<!DOCTYPE html>
|
<html>
|
|
<head>
|
<meta charset="utf-8" />
|
<link href="img/favicon.ico" rel="shortcut icon" type="image/x-icon" />
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
<meta name="viewport"
|
content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
|
<title>新手攻略</title>
|
<!--css-->
|
<link rel="stylesheet" type="text/css" href="css/DOUI.min.css" />
|
<style type="text/css">
|
/*图片效果*/
|
.imgstyle {
|
width: 100%;
|
height: auto;
|
display: block;
|
}
|
|
.animt_img {
|
animation: imgopc 1s;
|
animation-fill-mode: both;
|
animation-timing-function: ease;
|
}
|
|
@
|
keyframes imgopc { 0%{
|
opacity: 0;
|
}
|
|
100%{
|
opacity
|
:
|
|
1;
|
}
|
}
|
/*APP下载*/
|
.homeappwai {
|
width: 94%;
|
height: 3.5rem;
|
padding: 0 3%;
|
position: fixed;
|
left: 0;
|
bottom: 0.5rem;
|
background-color: rgba(0, 0, 0, 0.75);
|
z-index: 50;
|
color: white;
|
}
|
|
.homeappimg {
|
width: 2.5rem;
|
height: 2.5rem;
|
margin-right: 0.3rem;
|
}
|
|
.homeappgo {
|
width: 4rem;
|
height: 2rem;
|
border-radius: 1rem;
|
background-color: #E5005C;
|
text-decoration: none;
|
color: white;
|
}
|
</style>
|
<!--js-->
|
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
|
<script src="https://cdn.bootcss.com/vue/2.5.16/vue.min.js"></script>
|
<script src="js/DOUI.min.js" type="text/javascript" charset="utf-8"></script>
|
</head>
|
|
<body class="displayNone">
|
<div id="allwai" class="allwai font3"
|
style="background-color: #FDD757;">
|
|
<!--图片列表-->
|
<div style="width: 100%; padding-bottom: 5rem; overflow: scroll;">
|
<div style="width: 100%; height: auto;">
|
|
<!--循环添加-->
|
<div v-for="item in imglist" style="width: 100%; height: auto;">
|
<img v-bind:src="item" class="imgstyle animt_img"
|
onclick="return false" />
|
</div>
|
|
</div>
|
</div>
|
|
<!--APP下载卡片-->
|
<div v-if="inapp=='false'||inapp==false"
|
class="homeappwai fboxRow Ycenter">
|
<img class="homeappimg" src="img/list_load.png" />
|
<div>不只领优惠券，APP客户端还返利</div>
|
<div class="flex1"></div>
|
<a class="homeappgo fboxRow Xcenter Ycenter"
|
href="http://a.app.qq.com/o/simple.jsp?pkgname=com.yeshi.ec.rebate">下载</a>
|
</div>
|
|
</div>
|
</body>
|
|
<script type="text/javascript">
|
function copyLink() {
|
var href = window.location.href;
|
yestv.copyText(href);
|
yestv.toast("链接已复制到剪贴板");
|
}
|
|
try {
|
var array = new Array();
|
array.push({
|
icon : 'http://img.flqapp.com/resource/icon_share.png',
|
name : '复制链接',
|
js : 'copyLink()'
|
});
|
yestv.addMenu(JSON.stringify(array));
|
} catch (e) {
|
}
|
|
$("body").addClass("displayNone");
|
|
//======================== 页面数据 ================================
|
//数据请求接口
|
var https = "http://flq.yeshitv.com";
|
|
//图片内容信息
|
var imgdata = {
|
inapp : true, //是否在app内部打开
|
id : null, //攻略id
|
imglist : [], //图片列表
|
};
|
|
//图片数据vue实例化
|
var alldata = new Vue({
|
el : "#allwai",
|
data : imgdata,
|
//创建完毕
|
created : function() {
|
$("body").removeClass("displayNone");
|
},
|
//数据节点渲染完毕
|
updated : function() {
|
var num_all = $('img').length;
|
console.log("图片总张数：" + num_all);
|
},
|
});
|
|
//获取地址栏传递参数
|
var urldata = doui.urlParamGet();
|
//获取攻略id
|
if (urldata.id) {
|
imgdata.id = urldata.id;
|
} else {
|
doui.showToast("未获取到攻略id");
|
}
|
//是否在app内部打开
|
if (urldata.inApp) {
|
imgdata.inapp = urldata.inApp;
|
}
|
|
//======================== 数据请求 ================================
|
imglistGet();
|
function imglistGet() {
|
doui.showLoading("获取攻略");
|
//发送数据准备
|
var myurl = "../../api/h5/v1/strategy/strategyPicture";
|
var mydata = doui.AjaxData({
|
id : imgdata.id,
|
});
|
//发起请求
|
$.get({
|
url : myurl,
|
data : {
|
id : imgdata.id
|
},
|
success : function(res) {
|
res = JSON.parse(res);
|
doui.hideLoading();
|
if (res.code != 0) {
|
doui.showToast(res.msg);
|
}
|
//向图片组中添加数据
|
else {
|
imgdata.imglist = res.data;
|
}
|
}
|
});
|
}
|
</script>
|
</html>
|
