<!DOCTYPE html>
|
<html>
|
|
<head>
|
<meta charset="utf-8" />
|
<meta http-equiv="X-UA-Compatible" content="chrome=1"/>
|
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
|
<title>免费领券</title>
|
<!--自设-->
|
<link rel="stylesheet" type="text/css" href="css/doui.min.css"/>
|
<script src="js/doui.min.js" type="text/javascript" charset="utf-8"></script>
|
<script src="js/publicFunction.js" type="text/javascript" charset="utf-8"></script>
|
<style type="text/css">
|
/*块*/
|
.kuai{ width: 7.1rem; height: auto; margin-left: 0.2rem; background-color: white; border-radius: 0.1rem; overflow: hidden; }
|
/*已经抢光*/
|
.shareF_notHave{ width: 70%; height: 70%; display: block; position: absolute; left: 15%; top: 15%; }
|
.shareH_notHave{ width: 60%; height: 60%; display: block; position: absolute; left: 20%; top: 20%; }
|
|
/*优惠券*/
|
.app-sp-coupons{ border: 1px solid #E5005C; border-radius: 0.06rem; overflow: hidden; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; }
|
.app-sp-couponsQuan{ width: 0.35rem; height: 0.35rem; line-height: 0.4rem; font-size: 0.26rem; color: white; text-align: center; background-color: #E5005C; }
|
.app-sp-couponsPrice{ width: auto; height: 0.35rem; line-height: 0.4rem; padding: 0 0.14rem; font-size: 0.26rem; color: #E5005C; text-align: center; }
|
|
</style>
|
|
<link />
|
</head>
|
|
<body style="display:none;">
|
<div id="allwai" class="heightenBox fontMobile">
|
|
<!--圆弧框 距离顶部 距离 底色-->
|
<div style="width:100%; height:0.2rem;"></div>
|
|
<!--圆弧-->
|
<div v-show="share.list.length>0" class="kuai fboxCol Xstart Ycenter">
|
|
<!--猜你喜欢-->
|
<div class="home_cai fboxRow Xcenter Ycenter">
|
<img v-if="appType=='flq'" class="homeF_caiimg" src="img/flq/index_z1.png"/>
|
<img v-else class="homeH_caiimg" src="img/hcj/index_z1.png"/>
|
<div class="font32 font-weight">好友分享</div>
|
<img v-if="appType=='flq'" class="homeF_caiimg" src="img/flq/index_z2.png"/>
|
<img v-else class="homeH_caiimg" src="img/hcj/index_z2.png"/>
|
</div>
|
|
<!--分享标题-->
|
<div v-if="share.title" class="fboxRow Xstart Ystart" style="width:6.5rem; margin-bottom:0.2rem;">
|
<div class="font30 font-black" style="line-height:1.8; text-indent:0.6rem;">{{share.title}}</div>
|
</div>
|
|
<!--一个商品单框-->
|
<div v-for="(item, index) in share.list" class="sp1 fboxRow" v-on:click="spdanClick(item)">
|
|
<!--商品图片-->
|
<div class="sp1_img">
|
<img class="sp1_imgsrc" src="img/flq/sp_imgDef.png"/>
|
<img class="sp1_imgsrc" v-bind:src="item.picUrl" />
|
<!--已经抢光图片-->
|
<img v-if="appType=='flq'&&item.state==1" class="shareF_notHave" src="img/flq/share_notHave.png"/>
|
<img v-else-if="appType=='hcj'&&item.state==1" class="shareH_notHave" src="img/hcj/share_notHave.png"/>
|
</div>
|
|
<div class="sp1_content fboxCol" style="padding-top:0rem ;">
|
|
<!--商品标题栏-->
|
<div class="sp1_title fboxRow Xstart Ycenter">
|
<!--标题文字-->
|
<div class="sp1_titleFont font-ell2">{{item.title}}</div>
|
<!--来源-->
|
<div class="sp_type">
|
<img v-if='item.shopType==10' src="img/flq/sp_type1.png" />
|
<img v-else-if='item.shopType==11' src="img/flq/sp_type2.png" />
|
<img v-else-if='item.shopType==20' src="img/flq/sp_type20.png" />
|
<img v-else-if='item.shopType==30' src="img/flq/sp_type30.png" />
|
</div>
|
</div>
|
|
|
|
<div class="flex1"></div>
|
|
<!--原价-->
|
<div class="fboxRow Xstart Ycenter Ybaseline" style="margin-bottom:0.1rem;">
|
<div class="fboxRow ziF_red Ybaseline font-weight">
|
<div class="font24">￥</div>
|
<div v-if="item.couponInfo" class="font40">{{item.couponPrice}}</div>
|
<div v-else class="font40">{{item.zkPrice}}</div>
|
</div>
|
|
<div class="sp1_xiaoFont" style="margin-left: 0.1rem;text-decoration: line-through;">¥{{item.zkPrice}}</div>
|
<div class="sp1_xiaoFont" style="margin-left: 0.1rem;" v-if="item.salesType==1">月销 {{item.salesCount}}</div>
|
<div class="sp1_xiaoFont" style="margin-left: 0.1rem;" v-if="item.salesType==4">总销量 {{item.salesCount}}</div>
|
|
</div>
|
|
<!--价格栏-->
|
<div class="fboxRow Xstart Ycenter">
|
<div v-if="item.couponInfo" class="app-sp-coupons">
|
<div class="app-sp-couponsQuan" style="vertical-align: middle;">券</div>
|
<div class="app-sp-couponsPrice">¥{{item.couponInfo.amount}}</div>
|
</div>
|
<!--空白-->
|
<div class="flex1"></div>
|
</div>
|
|
</div>
|
|
</div>
|
|
<div style="width:50%; height:0.1rem;"></div>
|
|
</div>
|
|
<!--圆弧框 距离底部 距离 底色-->
|
<div style="width:100%; height:0.2rem;"></div>
|
|
</div>
|
</body>
|
|
</html>
|
|
|
|
<!--一键复制-->
|
<script src="js/clipboard.min.js" type="text/javascript" charset="utf-8"></script>
|
<script src="js/clipboard.config.js" type="text/javascript" charset="utf-8"></script>
|
<script type="text/javascript">
|
// ================================================================================== 页面数据
|
var urldata =null;
|
var vm = null;
|
doui.importComplete(getImport(), function()
|
{
|
// vue实例化
|
vm = new Vue({
|
el: '#allwai',
|
// 数据定义
|
data: {
|
// ------------------------------------------------------- 系统信息
|
appType: null, // app：flq-返利券 hcj-海草街
|
fingerprint: '', // 浏览器指纹
|
|
// ------------------------------------------------------- 分享信息
|
share: {
|
id: null, // 动态id
|
source: "", // 来源
|
title: "", // 分享标题
|
list: [], // 商品列表
|
},
|
},
|
});
|
|
|
// 浏览器指纹获取
|
var sys = doui.systemInfoGet();
|
vm.fingerprint = sys.fingerprint;
|
|
|
// 获取地址栏信息
|
urldata = doui.urlParamGet();
|
// 获取app类型
|
if (urldata.appType) { vm.appType = urldata.appType; }
|
else { vm.appType = appTypeGet(); }
|
// 获取到来源
|
if (urldata.source) { vm.share.source = urldata.source; }
|
|
// 获取到用户id
|
if (urldata.uid)
|
{
|
var user = { id: urldata.uid };
|
saveSharePeople(user);
|
}
|
|
// 获取到分享id
|
if (urldata.shareId)
|
{
|
// 保存分享id
|
vm.share.id = urldata.shareId;
|
// 请求数据
|
Get_splist();
|
}
|
else { doui.showToast("获取分享ID失败"); }
|
|
|
$("body").css("display", "block");
|
});
|
|
|
|
// ================================================================================== 页面事件
|
// 商品框 点击,参数： 商品id
|
function spdanClick (itemC)
|
{
|
// 1. 无优惠券
|
if (itemC.state == 1) { doui.showToast("该优惠券已抢光"); }
|
// 2. 有商品id
|
else if (itemC.goodsId) {
|
if(itemC.goodsType==1)
|
{
|
window.location.href='./single/xiangQing.html?id='+itemC.goodsId+"&uid="+urldata.uid;
|
}else if(itemC.goodsType==2)
|
{
|
jumpJDLink(itemC.goodsId,urldata.uid);
|
}else if(itemC.goodsType==3)
|
{
|
jumpPDDLink(itemC.goodsId,urldata.uid);
|
}
|
|
}
|
// 3. 无商品id
|
else { doui.showToast("获取商品ID失败"); }
|
}
|
|
|
|
// ================================================================================== 数据请求
|
// 分享内容
|
function Get_splist ()
|
{
|
// 数据准备
|
var myurl =getHttp() + '/api/apph5/v1/share/getList';//getHttp()
|
var mydata = doui.AjaxData({
|
shareId: vm.share.id,
|
source: vm.share.source,
|
fingerprint: vm.fingerprint,
|
});
|
// 数据请求
|
doui.showLoading("载入中");
|
doui.AjaxJsonp(myurl, mydata, function(res)
|
{
|
if (res.code != 0) { doui.hideLoading(); doui.showToast(res.msg); }
|
else
|
{
|
var mo = res.data.result_list;
|
// 列表保存
|
vm.share.list = mo;
|
// 标题保存
|
vm.share.title = res.data.title;
|
|
doui.hideLoading();
|
}
|
});
|
}
|
|
//获取拼多多的推广链接
|
function jumpPDDLink(goodsId,uid) {
|
//数据请求
|
doui.showLoading("获取商品信息中");
|
var mydata = doui.AjaxData({
|
id:goodsId,
|
uid: uid
|
});
|
doui.AjaxJsonp(
|
getHttp()+ "/api/h5/v1/webRecommend/getPDDGoodsDetail",//getHttp()
|
mydata,
|
function(res) {
|
doui.hideLoading();
|
if (res.code != 0) {
|
doui.showToast(res.msg);
|
} else {
|
var mo = res.data;
|
//跳转到券链接
|
window.location.href=mo.jumpLink;
|
}
|
}
|
);
|
}
|
|
//获取京东的链接
|
function jumpJDLink(goodsId,uid) {
|
//数据请求
|
doui.showLoading("正在获取商品信息");
|
var mydata = doui.AjaxData({
|
id:goodsId,
|
uid: uid
|
});
|
doui.AjaxJsonp(
|
getHttp()+ "/api/h5/v1/webRecommend/getJDGoodsDetail",//getHttp()
|
mydata,
|
function(res) {
|
doui.hideLoading();
|
if (res.code != 0) {
|
doui.showToast(res.msg);
|
} else {
|
var mo = res.data;
|
//跳转到券链接
|
window.location.href=mo.jumpLink;
|
}
|
}
|
);
|
}
|
</script>
|
