-
Notifications
You must be signed in to change notification settings - Fork 0
/
productInfo.html
206 lines (206 loc) · 9.92 KB
/
productInfo.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover"><title>产品详情</title><link rel="icon" href="./img/favicon.ico" type="image/x-icon"><link rel="stylesheet" href="./css/reset.css"><link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/css/swiper.min.css"><link rel="stylesheet" href="./static/layui/css/layui.mobile.css"><script>var _PageHeight=document.documentElement.clientHeight,_PageWidth=document.documentElement.clientWidth,_LoadingTop=61<_PageHeight?(_PageHeight-61)/2:0,_LoadingLeft=215<_PageWidth?(_PageWidth-215)/2:0,_LoadingHtml='<div id="loadingDiv" style="position:absolute;left:0;width:100%;height:'+_PageHeight+'px;top:0;background:url(./img/loading2.gif) no-repeat center center;background-size:0.4rem 0.5rem;opacity:100;filter:alpha(opacity=100);z-index:10000;"></div>';function completeLoading(){if("complete"==document.readyState){var e=document.getElementById("loadingDiv");e.parentNode.removeChild(e),$("#loadingDiv").remove(),$("#main").css({opacity:100,filter:"alpha(opacity=100)"})}}document.write(_LoadingHtml),document.onreadystatechange=completeLoading</script></head><body><section id="main" style="opacity:0"><div class="banner"><div class="swiper-container"><div class="swiper-wrapper"></div><div class="swiper-pagination"></div></div></div><div class="goods" style="display:none"><div class="goodsPrice"><span class="icon">券后价</span>￥<span class="price"></span><span class="itemPrice"></span></div><div class="goodsName"></div><div class="goodsState borderB5"><div class="quantity"></div><div class="tip"></div></div><div class="goodsInfo"><div class="title borderB1">宝贝详情</div><div class="info"></div></div></div><div class="footer"><div class="goodsShare"></div><div class="vouchers"></div></div></section><div style="display:none"><script src="https://s22.cnzz.com/z_stat.php?id=1274687253&web_id=1274687253" language="JavaScript"></script></div><script src="./js/rem.js"></script><script src="https://unpkg.com/[email protected]/dist/jquery.min.js"></script><script src="./js/fastclick.js"></script><script src="https://unpkg.com/[email protected]/dist/js/swiper.min.js" charset="utf-8"></script><script src="./static/layui/layui.js"></script><script>window.onload = function() {
FastClick.attach(document.body);
var _czc = _czc || [];
_czc.push(["_setAccount", "1274687253"]);
_czc.push(["_trackPageview", "/zttH5/product.html", "https://zhishun520.com/"]);
//下载事件
_czc.push(["_trackEvent", "淘返利详情页", "打开", "头条TV", 1, "open"]);
var u = navigator.userAgent;
var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
if(isAndroid) {
$("head").append('<link rel="stylesheet" type="text/css" href="./css/common.css"/>');
$("head").append('<link rel="stylesheet" type="text/css" href="./css/productInfoAd.css"/>');
} else if(isiOS) {
$("head").append('<link rel="stylesheet" type="text/css" href="./css/productInfo.css"/>');
if (screen.height == 812 && screen.width == 375){
$("#main").css("padding-bottom","2.67rem");
}
}
//获取Url地址中userId参数
function getUrlParams(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); //定义正则表达式
var r = window.location.search.substr(1).match(reg);
if(r != null) return unescape(r[2]);
return null;
};
var userID = getUrlParams("userId"),
itemId = getUrlParams("itemId"),
coupon = getUrlParams("coupon"),
commission = getUrlParams("commission"),
itemUrl = getUrlParams("itemUrl"),
tmall = getUrlParams("tmall"),
nativeUrl = getUrlParams("nativeUrl");
/**
* 产品性情
* @params price1：最低最后成交价（非必需）
* price2：最高最后成交价（非必需）
* couponValue：最低优惠券面值（非必需）
* 返回商品信息：
* itemPrice 产品原价
* coupon 优惠券面额
* commission 按产品原价-优惠券面额成交以后的佣金
* itemUrl：领券购买的H5链接
* name：商品名称
* nativeUrl：调用app打开的链接
* itemId：商品id，跟平台对应，是平台的商品ID
* sales：销量
* tmall:1是天猫 0不是天猫
*/
$.ajax({
url: ajaxUrl + "/get/tao/product/",
type: "GET",
dataType: "json", //指定服务器返回的数据类型
data: {
itemId: itemId,
userId: userID
},
success: function(data) {
coupon = getUrlParams("coupon"),
commission = getUrlParams("commission"),
itemUrl = getUrlParams("itemUrl"),
tmall = getUrlParams("tmall"),
nativeUrl = getUrlParams("nativeUrl");
var data = data.data;
//console.log({"userId":userID,"itemId":itemId,"coupon":parseFloat(coupon),"itemPrice":itemPrice,"commission":commission,"itemUrl":itemUrl,"nativeUrl":nativeUrl,"nativeUrl":nativeUrl,"tmall":tmall});
var bannerImg = data.itemPicUrl.split(","),
name = data.name,
itemPrice = parseFloat(data.itemPrice),
itemPicUrl = data.itemPicUrl,
sales = data.sales,
commission = (commission==undefined||commission=="")?data.commission:commission,
nativeUrl = (nativeUrl==undefined||nativeUrl=="")?data.nativeUrl:nativeUrl,
itemUrl = (itemUrl==undefined||itemUrl=="")?data.itemUrl:itemUrl,
coupon = (coupon==undefined||coupon=="")?data.coupon:coupon,
tmall = (tmall==undefined||tmall=="")?data.tmall:tmall;
//console.log({"userId":userID,"itemId":itemId,"coupon":parseFloat(coupon),"itemPrice":itemPrice,"commission":commission,"itemUrl":itemUrl,"nativeUrl":nativeUrl,"nativeUrl":nativeUrl,"tmall":tmall});
//渲染banenr图
var _html = "";
if(bannerImg.length) {
bannerImg.map(function(item, index) {
_html += `<div class="swiper-slide" style="background-image:url(${item})"></div>`;
});
};
$(".swiper-wrapper").html(_html);
var mySwiper = new Swiper('.swiper-container', {
autoplay: false, //可选选项，自动滑动
initialSlide: $(this).index(),
loop: true,
pagination: {
el: '.swiper-pagination',
type: "fraction"
}
})
//领券
$(".vouchers").html("领" + coupon + "元券");
//佣金
$(".tip").html("购买后返" + commission + "元");
//价格
$(".price").html((itemPrice - coupon).toFixed(2));
if(tmall == 0) {
//淘宝原价
$(".itemPrice").html("淘宝价:￥<span style='text-decoration:line-through;'>" + itemPrice + "</span>");
//名称
$(".goodsName").html(`
<img src="./img/type_taobaol_icon.png" alt="" />${name}
`);
} else {
//天猫原价
$(".itemPrice").html("天猫价:￥<span style='text-decoration:line-through;'>" + itemPrice + "</span>");
//名称
$(".goodsName").html(`
<img src="./img/type_tmall_icon.png" alt="" />${name}
`);
}
//销量
$(".quantity").html("已售 " + sales);
$(".goods").show();
$(".goodsShare").html("分享");
//绑定原生事件
$(".goodsShare").on("click", {
picUrl:bannerImg[0],
itemId: itemId,
nativeUrl: nativeUrl,
itemUrl: itemUrl,
itemId: itemId,
coupon: coupon.toString(),
commission:commission.toString(),
itemPrice: itemPrice.toString(),
name: name,
sales: sales.toString(),
itemPicUrl: itemPicUrl,
tmall: tmall
}, goodsShare)
$(".vouchers").on("click", {
nativeUrl: nativeUrl,
itemUrl: itemUrl,
itemId: itemId,
itemPrice: itemPrice.toString(),
name: name,
coupon: coupon.toString(),
sales: sales.toString(),
itemPicUrl: itemPicUrl,
tmall: tmall
}, vouchers)
}
});
/**
* 宝贝详情
*/
$.ajax({
url: `https://hws.m.taobao.com/cache/mtop.wdetail.getItemDescx/4.1/?data=%7Bitem_num_id%3A${itemId}%7D&type=jsonp&dataType=jsonp&callback=jQuery172034640315678070044_1535527857648&_=1535527874218`,
type: "GET",
dataType: "jsonp", //指定服务器返回的数据类型
jsonpCallback: "jQuery172034640315678070044_1535527857648", //指定回调函数名称
success: function(data) {
console.log(data);
var data = data.data.images,
_html = "";
if(data.length) {
data.map(function(item, index) {
_html += `<img lay-src="${item}" alt="" /> `;
});
}
$(".info").html(_html);
layui.use('flow', function(){
var flow = layui.flow;
//当你执行这样一个方法时，即对页面中的全部带有lay-src的img元素开启了懒加载（当然你也可以指定相关img）
flow.lazyimg();
});
},
error:function(error){
console.log(error);
}
});
/**
* 分享
*/
function goodsShare(e) {
var data = JSON.stringify(e.data);
console.log(e.data);
var u = navigator.userAgent;
var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
if(isAndroid) {
window.jsi.goodsShare(data)
} else if(isiOS) {
window.webkit.messageHandlers.goodsShare.postMessage(data);
}
}
/**
* 领券
*/
function vouchers(e) {
console.log(e.data);
var data = JSON.stringify(e.data);
console.log(data)
var u = navigator.userAgent;
var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
if(isAndroid) {
window.jsi.vouchers(data)
} else if(isiOS) {
window.webkit.messageHandlers.vouchers.postMessage(data);
}
}
}</script></body></html>