ソースを参照

h5分享页面

LIPENGTAO1313 6 年 前
コミット
78c6bd0eea
共有2 個のファイルを変更した503 個の追加6 個の削除を含む
  1. 501 0
      e/pr.html
  2. 2 6
      productShow.html

+ 501 - 0
e/pr.html

@ -0,0 +1,501 @@
1
<!DOCTYPE html>
2
<html>
3

4
	<head>
5
		<meta charset="UTF-8">
6
		<title>资源分享-科袖网</title>
7
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
8
		<link rel="stylesheet" href="../css/reset.css" />
9
		<link rel="stylesheet" href="../css/common.css" />
10
		<link rel="stylesheet" href="../css/share.css" />
11
		<style>
12
			html,
13
			body {
14
				margin: 0;
15
				padding: 0px;
16
				background: #FFFFFF;
17
			}
18
		</style>
19
		<script type="text/javascript" src="../js/jquery-1.11.1.js"></script>
20
		<script type="text/javascript" src="../js/public/swiper.min.js"></script>
21
		<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
22
		<script type="text/javascript" src="../js/public/baseUtil.js"></script>
23
		<script type="text/javascript" src="../js/public/shareCom.js"></script>
24
		<script type="text/javascript" src="../js/public/openApp.js"></script>
25
	</head>
26

27
	<body>
28
		<div class="contentBody2">
29
			<!--焦点图 start-->
30
			<div data-editor="topslider">
31
				<div id="index-container">
32
					<ul class="swiper-wrapper">
33
						<!--<li class="swiper-slide"><a class="tab-re"><img src="../images/banner/banner01.jpg" /></a></li>-->
34
					</ul>
35
					<div class="swiper-pagination" id="index-pagination"></div>
36
				</div>
37
			</div>
38
			<div class="showDetail">
39
				<div class="h1Font hWeight" id="resourceName"></div>
40
				<div class="showFont" id="application"></div>
41
				<div class="madiaBlock">
42
					<ul class="mui-table-view noactiveTab infoBlock">
43
						<li class="mui-table-view-cell">
44
							<div class="flexCenter mui-clearfix">
45
								<a id="thisInfo">
46
									<div class="madiaHead" id="thisPic"></div>
47
									<div class="madiaInfo" style="padding-right: 80px;">
48
										<p><span class="h1Font ellipsisSty" id="thisName"></span><em class="authiconNew" title="" id="authFlag"></em></p>
49
										<p class="h3Font ellipsisSty" id="thisOther"></p>
50
									</div>
51
								</a>
52
								<div class="goSpan">
53
									<span class="attenSpan">关注</span>
54
								</div>
55
							</div>
56

57
						</li>
58
					</ul>
59
				</div>
60
				<!--内容区-->
61
				<div class="showMain showRes">
62
					<ul>
63
						<li>
64
							<div class="showTit">所属机构</div>
65
							<div class="showCon" id="resorceOrg"></div>
66
						</li>
67
						<li>
68
							<div class="showTit">厂商型号</div>
69
							<div class="showCon" id="modelNumber"></div>
70
						</li>
71
						<li>
72
							<div class="showTit">产地:</div>
73
							<div class="showCon" id="productArea">
74
							</div>
75
						</li>
76
						<li>
77
							<div class="showTit">官方价格:</div>
78
							<div class="showCon" id="officialPrice">
79
							</div>
80
						</li>
81
						<li>
82
							<div class="showTit">性能参数</div>
83
							<div class="showCon" id="performancePa"></div>
84
						</li>
85
						<li id="articleContent">
86
							<div class="showTit">详细介绍</div>
87
							<div class="showCon" id="detailDescp"></div>
88
						</li>
89
					</ul>
90
				</div>
91
				<!--标签模块-->
92
				<ul class="tagList">
93
					<!--<li>
94
					<span class="h2Font"></span>
95
				</li>-->
96
				</ul>
97
				<div class="madiaBlock displayNone">
98
					<div class="madiaTit">相关文章</div>
99
					<ul class="mui-table-view" id="likeArtical">
100
					</ul>
101
				</div>
102
				<div class="madiaBlock displayNone">
103
					<div class="madiaTit">其他产品</div>
104
					<ul class="mui-table-view" id="likeResource">
105
					</ul>
106
				</div>
107
			</div>
108
			<div class="shareEcode">
109
				<img class="Ecodecon" src="../images/ecordCard.jpg" />
110
				<div class="Ecodeinfo">
111
					<a href="http://a.app.qq.com/o/simple.jsp?pkgname=com.ekexiu.app"><button class="frmbtn frmactive">下载移动客户端</button></a>
112
				</div>
113
			</div>
114
		</div>
115
		<script type="text/javascript">
116
			$(document).ready(function() {
117
				var imgUrl = "http://www.ekexiu.com/images/logo180.png";
118
				var lineLink = document.location.href;
119
				var descContent;
120
				var shareTitle;
121
				var appid = '';
122

123
				var resourceId = GetQueryString("id");
124
				var othisInfo = document.getElementById("thisInfo"); //用户/企业信息
125
				var othisName = document.getElementById("thisName"); //专家名称
126
				var othisOther = document.getElementById("thisOther"); //专家职称/职位
127
				var oauthFlag = document.getElementById("authFlag"); //专家认证
128
				var othisPic = document.getElementById("thisPic"); //专家头像
129

130
				var oresorcePic = document.getElementById("resorcePic"); //资源图片
131
				var oresourceName = document.getElementById("resourceName"); //资源名称
132
				var oapplication = document.getElementById("application"); //应用用途
133
				var oresorceOrg = document.getElementById("resorceOrg"); //资源所属机构
134
				var omodelNumber = document.getElementById("modelNumber"); //厂商型号
135
				var operformancePa = document.getElementById("performancePa"); //性能参数
136
				var oremarkContent = document.getElementById("remarkContent"); //合作备注
137
				var odetailDescp = document.getElementById("detailDescp"); //详细描述
138
				getRecourceMe(); /*获取信息*/
139
				relatedArticles(); /*相关文章信息*/
140

141
				//interestingResources();
142
				pageViewLog(resourceId, 11);
143

144
				//进入发布者详情页面
145
				$("#thisInfo").on("click", function() {
146
					var reType = this.getAttribute("data-type");
147
					if(reType == "1") {
148
						var proId = this.getAttribute("data-id");
149
						location.href = "http://" + window.location.host + "/e/p.html?id=" + proId;
150
					} else if(reType == "2") {
151
						var cmpId = this.getAttribute("data-id");
152
						location.href = "http://" + window.location.host + "/e/c.html?id=" + cmpId;
153
					}
154

155
				})
156

157
				var this_ = "../html/resourceShow.html?resourceId=" + resourceId;
158
				wcFresh(this_);
159
				$("body").on("click", ".goSpan", function() {
160
					isInstalled(this_, true);
161
					$(this).addClass("activeThis");
162
				})
163

164
				function getRecourceMe() {
165
					$.ajax({
166
						url: '/ajax/product/qo',
167
						data: {
168
							'id': resourceId,
169
						},
170
						dataType: 'json', //服务器返回json格式数据
171
						type: 'get', //HTTP请求类型
172
						timeout: 10000, //超时时间设置为10秒;
173
						success: function(data) {
174
							if(data.success) {
175
								var mydata = data.data;
176
								var resourceName = mydata.name;
177
								document.title = resourceName;
178
								oresourceName.innerHTML = mydata.name;
179
								oapplication.innerHTML = "简介:" + mydata.cnt;
180
								//微信再次分享配置
181
								shareTitle = oresourceName.innerHTML;
182
								descContent = oapplication.innerHTML;
183
								if(mydata.spec) { //厂商型号
184
									omodelNumber.innerText = mydata.spec;
185
									omodelNumber.parentNode.style.display = "block";
186
								}
187
								if(mydata.producingArea) {
188
									$("#productArea").text(mydata.producingArea).parents("li").show();
189
								}
190
								if(mydata.price) {
191
									$("#officialPrice").text(mydata.price).parents("li").show();
192
								}
193
								if(mydata.parameter) { //性能参数
194
									operformancePa.innerHTML = mydata.parameter;
195
									operformancePa.parentNode.style.display = "block";
196
								}
197
								if(mydata.descp) { //详细描述
198
									odetailDescp.innerHTML = mydata.descp;
199
									odetailDescp.parentNode.style.display = "block";
200
								}
201
								if(mydata.keywords) {
202
									var oSub = mydata.keywords.split(",");
203
									var oSt = "";
204
									for(var i = 0; i < oSub.length; i++) {
205
										oSt += '<li><p class="h2Font">' + oSub[i] + '</p></li>'
206
									}
207
									$(".tagList").html(oSt);
208
								} else {
209
									$("#resourceList").parents(".otherShow").addClass("displayNone")
210
								}
211
								orgSigInfo(mydata.owner);
212
								otherProduct(mydata.owner)
213
								if(mydata.images) {
214
									imgUrl = "http://www.ekexiu.com/data/product" + mydata.images.split(",")[0].replace(/.jpg/, "_s.jpg");
215
									var rPdiv = '';
216
									for(var i = 0; i < mydata.images.split(",").length; i++) {
217
										rPdiv += '<li class="swiper-slide"><a class="tab-re"><img src="../data/product' + mydata.images.split(",")[i] + '" /></a></li>'
218
									}
219
									$("#index-container ul").append(rPdiv);
220
									//轮换图片滚动
221
									var swiper = new Swiper('#index-container', {
222
										pagination: '#index-pagination',
223
										slidesPerView: 1,
224
										paginationClickable: true,
225
										loop: true,
226
										autoplay: 5000,
227
										autoplayDisableOnInteraction: false
228
									});
229
								} else {
230
									$("#index-container").parent().hide();
231
								}
232
							}
233
						},
234
						error: function(e) {
235
							return;
236
						}
237
					});
238
				}
239
				/*资源里面相关文章*/
240
				function relatedArticles() {
241
					$.ajax({
242
						url: '/ajax/article/lq/byProduct',
243
						type: "GET",
244
						data: {
245
							"product": resourceId,
246
							"rows": 5
247
						},
248
						dataType: "json",
249
						success: function(data) {
250
							if(data.success) {
251
								if(data.data.length == 0) {
252
									return;
253
								}
254
								document.getElementById("likeArtical").parentNode.classList.remove("displayNone");
255
								var $html = data.data;
256
								console.log($html)
257
								for(var i = 0; i < $html.length; i++) {
258
									(function(n) {
259
										var oURL;
260
										if($html[i].articleType == 1) {
261
											oURL = "/ajax/professor/baseInfo/" + $html[i].ownerId;
262
										} else {
263
											oURL = "/ajax/org/" + $html[i].ownerId;
264
										}
265
										$.ajax({
266
											url: oURL,
267
											type: "GET",
268
											dataType: "json",
269
											success: function(data) {
270
												if(data.success) {
271
													var likeRUl = document.getElementById("likeArtical");
272
													var likeRli = document.createElement("li");
273
													likeRli.className = 'mui-table-view-cell';
274
													likeRli.setAttribute("data-id", $html[n].articleId);
275

276
													var comName = "";
277
													if($html[n].articleType == 1) {
278
														var stl = autho(data.data.authType, data.data.orgAuth, data.data.authStatus);
279
														comName = data.data.name;
280
														likeRli.setAttribute("data-type", 1);
281
													} else if($html[n].articleType == 2) {
282
														var stl = {};
283
														stl.sty = "";
284
														stl.title = "";
285
														if(data.data.authStatus == 3) {
286
															stl.sty = "authicon-com-ok";
287
															stl.title = "认证企业";
288
														}
289
														if(data.data.forShort) {
290
															comName = data.data.forShort;
291
														} else {
292
															comName = data.data.name;
293
														}
294
														likeRli.setAttribute("data-type", 2);
295
													} else if($html[n].articleType == 3) {
296
														var stl = {};
297
														stl.sty = "";
298
														stl.title = "";
299
														comName = data.data.name;
300
														likeRli.setAttribute("data-type", 3);
301
													}
302

303
													var str = ""
304
													str += '<div class="flexCenter OflexCenter mui-clearfix">'
305
													if($html[n].articleImg) {
306
														str += '<div class="madiaHead artHead" style="background-image: url(/data/article/' + $html[n].articleImg + ')"></div>'
307
													} else {
308
														str += '<div class="madiaHead artHead"></div>'
309
													}
310
													str += '<div class="madiaInfo OmadiaInfo">'
311
													str += '<p class="ellipsisSty-2 h1Font">' + $html[n].articleTitle + '</p>'
312
													str += '<p><span class="h2Font" style="margin-right:10px;">' + comName + '</span><span class="time">' + commenTime($html[n].publishTime) + '</span></p>'
313
													str += '</div></div>'
314
													likeRli.innerHTML = str;
315
													likeRUl.appendChild(likeRli, likeRUl.lastChild);
316
												}
317
											},
318
											error: function() {}
319
										});
320
									})(i);
321

322
								}
323
							}
324
						},
325
						error: function() {}
326
					});
327
				}
328

329
				function orgSigInfo(id) {
330
					$.ajax({
331
						url: "/ajax/org/" + id,
332
						type: "GET",
333
						data: {},
334
						dataType: "json",
335
						success: function(data) {
336
							var mydata = {};
337
							mydata.organization = data.data;
338
							othisInfo.setAttribute("data-id", mydata.organization.id);
339
							othisInfo.setAttribute("data-status", mydata.organization.authStatus);
340
							othisInfo.setAttribute("data-type", mydata.resourceType);
341
							if(mydata.organization.forShort) {
342
								othisName.innerHTML = mydata.organization.forShort;
343
							} else {
344
								othisName.innerHTML = mydata.organization.name;
345
							}
346

347
							if(mydata.organization.subject) {
348
								othisOther.innerHTML = (mydata.organization.subject).replace(/,/, " | ");
349
							}
350
							var mgimg = "../images/default-icon.jpg";
351
							if(mydata.organization.hasOrgLogo) {
352
								mgimg = "/images/org/" + mydata.organization.id + ".jpg";
353
							}
354
							othisPic.classList.add("cmpHead2");
355
							othisPic.innerHTML = '<div class="boxBlock"><img class="boxBlockimg" id="companyImg" src="' + mgimg + '"></div>'
356
							if(mydata.organization.authStatus == 3) {
357
								oauthFlag.classList.add("authicon-com-ok");
358
							}
359
						}
360
					});
361
				}
362

363
				/*文章跳转*/
364
				$("#likeArtical").on("click", "li", function() {
365
					location.href = "http://" + window.location.host + "/e/a.html?id=" + $(this).attr("data-id");
366
				})
367
				/*产品跳转*/
368
				$("#likeResource").on("click", "li", function() {
369
					location.href = "http://" + window.location.host + "/e/pr.html?id=" + $(this).attr("data-id");
370
				})
371

372
				function otherProduct(par) {
373
					var $info = {};
374
					$info.rows = 6;
375
					$info.owner = par;
376
					$.ajax({
377
							url: "/ajax/product/publish",
378
							data: $info,
379
							dataType: "json",
380
							traditional: true,
381
							type: 'get', //HTTP请求类型
382
							success: function(data) {
383
								if(data.success) {
384
									if(data.data.length <= 1) {
385
										return;
386
									}
387
									document.getElementById("likeResource").parentNode.classList.remove("displayNone");
388
									var $data = data.data;
389
									for(var i = 0; i < $data.length; i++) {
390
										(function(n) {
391
											$.ajax({
392
												url: "/ajax/org/" + $data[n].owner,
393
												"type": "GET",
394
												'dataType': "json",
395
												"success": function(data) {
396
													if(data.success) {
397
														var thisName, userType, thisAuth, thisTitle
398
														if(data.data.forShort) {
399
															thisName = data.data.forShort;
400
														} else {
401
															thisName = data.data.name;
402
														}
403
														if(data.data.authStatus == 3) {
404
															thisTitle = "科袖认证企业";
405
															thisAuth = "authicon-com-ok";
406
														}
407
														var imgL = '/data/product' + $data[n].images.split(",")[0];
408
														var add = document.createElement("li");
409
														add.className = "mui-table-view-cell";
410
														add.setAttribute("data-id", $data[n].id);
411
														var itemlist = '<div class="flexCenter OflexCenter"><div class="madiaHead resourceHead" style="background-image:url(' + imgL + ')"></div>';
412
														itemlist += '<div class="madiaInfo OmadiaInfo">';
413
														itemlist += '<p class="ellipsisSty-2 h1Font" id="usertitle">' + $data[n].name + '</p>';
414
														itemlist += '<p><span class="h2Font">' + thisName + '</span><em class="authiconNew ' + thisAuth + '" title="' + thisTitle + '"></em></p>';
415
														itemlist += '</div></div>';
416
														add.innerHTML = itemlist;
417
														document.getElementById("likeResource").appendChild(add);
418
													}
419
												},
420
												'error': function() {}
421
											});
422
										})(i);
423
									}
424

425
								}
426
						},
427
						error: function() {}
428
					});
429
			}
430
			/*微信分享*/
431
			$.ajax({
432
				url: "../ajax/weixin/jsapiTicket",
433
				type: 'get',
434
				dataType: 'json',
435
				contentType: "application/x-www-form-urlencoded; charset=utf-8",
436
				data: {
437
					'url': location.href.split('#')[0]
438
				},
439
				success: function(data) {
440
					if(data.data) {
441
						wx.config({
442
							debug: false, //调试模式好犀利
443
							appId: data.data.appId,
444
							timestamp: data.data.timestamp,
445
							nonceStr: data.data.nonceStr,
446
							signature: data.data.signature,
447
							jsApiList: [ // 所有要调用的 API 都要加到这个列表中
448
								"onMenuShareAppMessage",
449
								"onMenuShareTimeline",
450
								"onMenuShareQQ",
451
								"onMenuShareQZone",
452
								"scanQRCode",
453
							]
454
						});
455
						wx.ready(function() {
456
							// 在这里调用 API
457
							wx.onMenuShareAppMessage({ //分享给朋友
458
								title: shareTitle, // 分享标题
459
								desc: descContent, // 分享描述
460
								link: lineLink, // 分享链接
461
								imgUrl: imgUrl, // 分享图标
462
								success: share_success_callback,
463
								cancel: share_cancel_callback
464
							});
465
							wx.onMenuShareTimeline({ //分享到朋友圈
466
								title: shareTitle, // 分享标题
467
								desc: descContent, // 分享描述
468
								link: lineLink, // 分享链接
469
								imgUrl: imgUrl, // 分享图标
470
								success: share_success_callback,
471
								cancel: share_cancel_callback
472
							});
473
							wx.onMenuShareQQ({ //分享到QQ
474
								title: shareTitle, // 分享标题
475
								desc: descContent, // 分享描述
476
								link: lineLink, // 分享链接
477
								imgUrl: imgUrl, // 分享图标
478
								success: share_success_callback,
479
								cancel: share_cancel_callback
480
							});
481
							wx.onMenuShareQZone({ //分享到QQ空间
482
								title: shareTitle, // 分享标题
483
								desc: descContent, // 分享描述
484
								link: lineLink, // 分享链接
485
								imgUrl: imgUrl, // 分享图标
486
								success: share_success_callback,
487
								cancel: share_cancel_callback
488
							});
489
						});
490
						//分享成功后的回调函数	
491
						function share_success_callback() {}
492
						//用户取消分享后执行的回调函数	
493
						function share_cancel_callback() {}
494
					}
495
				}
496
			});
497
			})
498
		</script>
499
	</body>
500

501
</html>

+ 2 - 6
productShow.html

@ -123,10 +123,6 @@
123 123
						<p class="h2Font" id="titleOffice"></p>
124 124
						<p class="h2Font" id="orgType"></p>
125 125
					</div>
126
					<div class="goSpan displayNone">
127
						<span class="consultSpan" id="consultin">联系</span>
128
						<span class="attenSpan">关注</span>
129
					</div>
130 126
					<div class="form-item otherBlock currentBlock displayNone">
131 127
						<div class="aboutTit">热门资源</div>
132 128
						<div class="form-result currentArt">
@ -196,8 +192,8 @@
196 192
	});
197 193
	function makeCode(){
198 194
		var hurl = window.location.host;
199
		var resourceId =  GetQueryString("resourceId");
200
		var elurl = "http://" + hurl + "/e/r.html?id=" + resourceId ; 
195
		var resourceId =  GetQueryString("productId");
196
		var elurl = "http://" + hurl + "/e/pr.html?id=" + resourceId ; 
201 197
		qrcode.makeCode(elurl);
202 198
	}
203 199
	makeCode();