Browse Source

分享页面及修正

li 7 years ago
parent
commit
a0c64280cf
2 changed files with 614 additions and 0 deletions
  1. 608 0
      e/s.html
  2. 6 0
      js/serviceIssue.js

+ 608 - 0
e/s.html

@ -0,0 +1,608 @@
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="remarkContent"></div>
66
						</li>
67
						<li id="articleContent">
68
							<div class="showTit">详细介绍</div>
69
							<div class="showCon" id="detailDescp"></div>
70
						</li>
71
					</ul>
72
				</div>
73
				<!--标签模块-->
74
				<ul class="tagList">
75
					<!--<li>
76
					<span class="h2Font"></span>
77
				</li>-->
78
				</ul>
79
				<div class="madiaBlock displayNone" id="resource">
80
					<div class="madiaTit">相关资源</div>
81
					<ul class="mui-table-view" id="resourceList">
82
					</ul>
83
				</div>
84
				<div class="madiaBlock displayNone">
85
					<div class="madiaTit">相关文章</div>
86
					<ul class="mui-table-view" id="likeArtical">
87
					</ul>
88
				</div>
89
				<!--您可能感兴趣的资源-->
90
				<div class="madiaBlock displayNone">
91
					<div class="madiaTit">您可能感兴趣的服务</div>
92
					<ul class="mui-table-view" id="likeResource">
93
					</ul>
94
				</div>
95

96
			</div>
97
			<div class="shareEcode">
98
				<img class="Ecodecon" src="../images/ecordCard.jpg" />
99
				<div class="Ecodeinfo">
100
					<a href="http://a.app.qq.com/o/simple.jsp?pkgname=com.ekexiu.app"><button class="frmbtn frmactive">下载移动客户端</button></a>
101
				</div>
102
			</div>
103
		</div>
104
		<script type="text/javascript">
105
			$(document).ready(function() {
106
				var imgUrl = "http://www.ekexiu.com/images/logo180.png";
107
				var lineLink = document.location.href;
108
				var descContent;
109
				var shareTitle;
110
				var appid = '';
111

112
				var serviceId = GetQueryString("id");
113
				var othisInfo = document.getElementById("thisInfo"); //用户/企业信息
114
				var othisName = document.getElementById("thisName"); //专家名称
115
				var othisOther = document.getElementById("thisOther"); //专家职称/职位
116
				var oauthFlag = document.getElementById("authFlag"); //专家认证
117
				var othisPic = document.getElementById("thisPic"); //专家头像
118
				var oresorcePic = document.getElementById("resorcePic"); //资源图片
119
				var oresourceName = document.getElementById("resourceName"); //资源名称
120
				var oapplication = document.getElementById("application"); //应用用途
121
				var oremarkContent = document.getElementById("remarkContent"); //合作备注
122
				var odetailDescp = document.getElementById("detailDescp"); //详细描述
123
				getRecourceMe(); /*获取信息*/
124
				relatedArticles(); /*相关文章信息*/
125
				interestingResources();
126
				pageViewLog(serviceId, 10);
127

128
				//进入发布者详情页面
129
				$("#thisInfo").on("click", function() {
130
					var reType = this.getAttribute("data-type");
131
					if(reType == "1") {
132
						var proId = this.getAttribute("data-id");
133
						location.href = "http://" + window.location.host + "/e/p.html?id=" + proId;
134
					} else {
135
						var cmpId = this.getAttribute("data-id");
136
						location.href = "http://" + window.location.host + "/e/c.html?id=" + cmpId;
137
					}
138

139
				})
140

141
				var this_ = "../html/serviceIdShow.html?serviceId=" + serviceId;
142
				wcFresh(this_);
143
				$("body").on("click", ".goSpan", function() {
144
					isInstalled(this_, true);
145
					$(this).addClass("activeThis");
146
				})
147

148
				function ajaxRequist(url, obj, type, fn) {
149
					$.ajax({
150
						url: url,
151
						data: obj,
152
						dataType: 'json', //服务器返回json格式数据
153
						type: type, //支持'GET'和'POST'
154
						traditional: true,
155
						success: function(data) {
156
							if(data.success) {
157
								fn(data)
158
							}
159
						},
160
						error: function(xhr, type, errorThrown) {}
161
					});
162
				}
163
				//相关资源
164
				seresource() 
165
				 function seresource() {
166
		$.ajax({
167
			"url": "/ajax/ware/res",
168
			"type": "GET",
169
			"data": {
170
				"id": serviceId
171
			},
172
			"traditional": true,
173
			'dataType': "json",
174
			"success": function(data) {
175
				if(data.success) {
176
					if(data.data.length == 0) {
177
						return;
178
					}
179
					document.getElementById("resource").classList.remove("displayNone");
180
					for(var i = 0; i < data.data.length; i++) {
181
						(function(n) {
182
							ajaxRequist("/ajax/resource/queryOne", {
183
								"resourceId": data.data[n].resource
184
							}, "get", function(data) {
185
								sevrResource(data.data);
186
							})
187
						})(i)
188
					}
189
				}
190
			},
191
			'error': function() {
192
				
193
			}
194
		});
195
	}
196
				function sevrResource($data) {
197
					var namepo, userType;
198
					if($data.resourceType == 1) {
199
						namepo = $data.editProfessor.name;
200
						userType = autho($data.editProfessor.authType, $data.editProfessor.orgAuth, $data.editProfessor.authStatus);
201
					} else {
202
						userType = {};
203
						if($data.organization.forShort) {
204
							namepo = $data.organization.forShort;
205
						} else {
206
							namepo = $data.organization.name;
207
						}
208
						if($data.organization.authStatus == 3) {
209
							userType.sty = "authicon-com-ok"
210
						}
211
					}
212
					var rImg = "../images/default-resource.jpg";
213
					if($data.images.length > 0) {
214
						rImg = "/data/resource/" + $data.images[0].imageSrc;
215
					}
216
					var li = document.createElement("li");
217
					li.setAttribute("data-id", $data.resourceId);
218
					li.innerHTML = '<div class="flexCenter OflexCenter clearfix">' +
219
						' <div class="madiaHead resouseHead" style="background-image:url(' + rImg + ')"></div>' +
220
						'<div class="madiaInfo OmadiaInfo">' +
221
						'<p class="ellipsisSty h1Font">' + $data.resourceName + '</p>' +
222
						'<p><span class="h2Font">' + namepo + '</span><em class="authiconNew ' + userType.sty + '" title="科袖认证专家"></em></p>' +
223
						'<p class="ellipsisSty-2 h2Font">用途:' + $data.supportedServices + '</p>' +
224
						'</div>' +
225
						'</div>'
226
					document.getElementById("resourceList").appendChild(li);
227
				}
228

229
				function getRecourceMe() {
230
					$.ajax({
231
						url: '/ajax/ware/qo',
232
						data: {
233
							'id': serviceId,
234
						},
235
						dataType: 'json', //服务器返回json格式数据
236
						type: 'get', //HTTP请求类型
237
						timeout: 10000, //超时时间设置为10秒;
238
						success: function(data) {
239
							if(data.success) {
240
								var $data = data.data;
241
								var resourceName = $data.name;
242
								document.title = resourceName;
243
								oresourceName.innerHTML = resourceName;
244
								if($data.cnt)
245
									oapplication.innerHTML = "内容:" + $data.cnt;
246
								//微信再次分享配置
247
								shareTitle = oresourceName.innerHTML;
248
								descContent = oapplication.innerHTML;
249
								if($data.category == 1) {
250
									ajaxRequist("/ajax/professor/baseInfo/" + $data.owner, {}, "get", function(data) {
251
										var mydata = {};
252
										mydata.editProfessor = data.data;
253
										othisInfo.setAttribute("data-id", mydata.editProfessor.id);
254
										othisInfo.setAttribute("data-type",mydata.category);
255
										professorId = othisInfo.getAttribute("data-id");
256
										//用户个人信息
257
										othisName.innerHTML = mydata.editProfessor.name;
258
										var otitleInfo = "";
259
										var oOrgInfo = "";
260
										if(mydata.editProfessor.title) {
261
											otitleInfo = mydata.editProfessor.title + ",";
262
										} else {
263
											if(mydata.editProfessor.office) {
264
												otitleInfo = mydata.editProfessor.office + ",";
265
											} else {
266
												otitleInfo = "";
267
											}
268
										}
269
										if(mydata.editProfessor.orgName) {
270
											oOrgInfo = mydata.editProfessor.orgName;
271
										}
272
										othisOther.innerHTML = otitleInfo + oOrgInfo;
273

274
										var professorFlag = autho(mydata.editProfessor.authType, mydata.editProfessor.orgAuth, mydata.editProfessor.authStatus);
275
										oauthFlag.classList.add(professorFlag.sty);
276
										othisPic.classList.add("useHead");
277
										if(mydata.editProfessor.hasHeadImage == 1) {
278
											othisPic.style.backgroundImage = 'url(../images/head/' + mydata.editProfessor.id + '_l.jpg)';
279
										}
280
									})
281
								} else {
282
									ajaxRequist("/ajax/org/" + mydata.owner, {}, "get", function(data) {
283
										var mydata = {};
284
										mydata.organization = data.data;
285
										othisInfo.setAttribute("data-id", mydata.organization.id);
286
										othisInfo.setAttribute("data-status", mydata.organization.authStatus);
287
										othisInfo.setAttribute("data-type", mydata.category);
288
										if(mydata.organization.forShort) {
289
											othisName.innerHTML = mydata.organization.forShort;
290
										} else {
291
											othisName.innerHTML = mydata.organization.name;
292
										}
293

294
										if(mydata.organization.subject) {
295
											othisOther.innerHTML = (mydata.organization.subject).replace(/,/, " | ");
296
										}
297
										var mgimg = "../images/default-icon.jpg";
298
										if(mydata.organization.hasOrgLogo) {
299
											mgimg = "/images/org/" + mydata.organization.id + ".jpg";
300
										}
301
										othisPic.classList.add("cmpHead2");
302
										othisPic.innerHTML = '<div class="boxBlock"><img class="boxBlockimg" id="companyImg" src="' + mgimg + '"></div>'
303
										if(mydata.organization.authStatus == 3) {
304
											oauthFlag.classList.add("authicon-com-ok");
305
										}
306
									})
307
								}
308
								if($data.cooperation) { //合作备注
309
									oremarkContent.innerHTML = $data.cooperation;
310
									oremarkContent.parentNode.style.display = "block";
311
								}
312
								if($data.descp) { //详细描述
313
									odetailDescp.innerHTML = $data.descp;
314
									odetailDescp.parentNode.style.display = "block";
315
								}
316
								if($data.keywords) {
317
									var oSub = $data.keywords.split(",");
318
									var oSt = "";
319
									for(var i = 0; i < oSub.length; i++) {
320
										oSt += '<li><p class="h2Font">' + oSub[i] + '</p></li>'
321
									}
322
									$(".tagList").html(oSt);
323
								} 
324
								if($data.images) {
325

326
									if($data.images.split(",").length != 0) {
327
										imgUrl = "http://www.ekexiu.com/data/ware/" + $data.images.split(",")[0].replace(/.jpg/, "_s.jpg");
328
										var rPdiv = '';
329
										for(var i = 0; i < $data.images.split(",").length; i++) {
330
											rPdiv += '<li class="swiper-slide"><a class="tab-re"><img src="../data/ware/' + $data.images.split(",")[i] + '" /></a></li>'
331
										}
332
										$("#index-container ul").append(rPdiv);
333
										//轮换图片滚动
334
										var swiper = new Swiper('#index-container', {
335
											pagination: '#index-pagination',
336
											slidesPerView: 1,
337
											paginationClickable: true,
338
											loop: true,
339
											autoplay: 5000,
340
											autoplayDisableOnInteraction: false
341
										});
342
									}
343
								} else {
344
									$("#index-container").parent().hide();
345
								}
346
							}
347
						},
348
						error: function(e) {
349
							return;
350
						}
351
					});
352
				}
353
				/*资源里面相关文章*/
354
				function relatedArticles() {
355
					$.ajax({
356
						url: '/ajax/article/lq/byWare',
357
						type: "GET",
358
						data: {
359
							"ware": serviceId,
360
							"rows": 5
361
						},
362
						dataType: "json",
363
						success: function(data) {
364
							if(data.success) {
365
								if(data.data.length == 0) {
366
									return;
367
								}
368
								document.getElementById("likeArtical").parentNode.classList.remove("displayNone");
369
								var $html = data.data;
370
								for(var i = 0; i < $html.length; i++) {
371
									(function(n) {
372
										var oURL;
373
										if($html[i].articleType == 1) {
374
											oURL = "/ajax/professor/baseInfo/" + $html[i].professorId;
375
										} else {
376
											oURL = "/ajax/org/" + $html[i].orgId;
377
										}
378
										$.ajax({
379
											url: oURL,
380
											type: "GET",
381
											dataType: "json",
382
											success: function(data) {
383
												if(data.success) {
384
													var likeRUl = document.getElementById("likeArtical");
385
													var likeRli = document.createElement("li");
386
													likeRli.className = 'mui-table-view-cell';
387
													likeRli.setAttribute("data-id", $html[n].articleId);
388

389
													var comName = "";
390
													if($html[n].articleType == 1) {
391
														var stl = autho(data.data.authType, data.data.orgAuth, data.data.authStatus);
392
														comName = data.data.name;
393
														likeRli.setAttribute("data-type", 1);
394
													} else {
395
														var stl = {};
396
														stl.sty = "";
397
														stl.title = "";
398
														if(data.data.authStatus == 3) {
399
															stl.sty = "authicon-com-ok";
400
															stl.title = "认证企业";
401
														}
402
														if(data.data.forShort) {
403
															comName = data.data.forShort;
404
														} else {
405
															comName = data.data.name;
406
														}
407
														likeRli.setAttribute("data-type", 2);
408
													}
409

410
													var str = ""
411
													str += '<div class="flexCenter OflexCenter mui-clearfix">'
412
													if($html[n].articleImg) {
413
														str += '<div class="madiaHead artHead" style="background-image: url(/data/article/' + $html[n].articleImg + ')"></div>'
414
													} else {
415
														str += '<div class="madiaHead artHead"></div>'
416
													}
417
													str += '<div class="madiaInfo OmadiaInfo">'
418
													str += '<p class="ellipsisSty-2 h1Font">' + $html[n].articleTitle + '</p>'
419
													str += '<p><span class="h2Font" style="margin-right:10px;">' + comName + '</span><span class="time">' + commenTime($html[n].publishTime) + '</span></p>'
420
													str += '</div></div>'
421
													likeRli.innerHTML = str;
422
													likeRUl.appendChild(likeRli, likeRUl.lastChild);
423
												}
424
											},
425
											error: function() {}
426
										});
427
									})(i);
428

429
								}
430
							}
431
						},
432
						error: function() {}
433
					});
434
				}
435
				/*感兴趣的服务*/
436
				function interestingResources() {
437
					$.ajax({
438
						url: "/ajax/ware/ralateWare",
439
						data: {
440
							"id": serviceId,
441
							"rows": 5
442
						},
443
						dataType: "json",
444
						traditional: true,
445
						type: 'get', //HTTP请求类型
446
						success: function(data) {
447
							if(data.success) {
448
								if(data.data.length == 0) {
449
									return;
450
								}
451
								document.getElementById("likeResource").parentNode.classList.remove("displayNone");
452
								var $data = data.data,
453
									arr = [];
454
								for(var i = 0; i < $data.length; i++) {
455
									arr.push($data[i].id)
456
								}
457
								if(i != 0) {
458
									ajaxRequist("/ajax/ware/qm", {
459
										"id": arr
460
									}, "get", function(data) {
461
										var $respond = data.data;
462
										for(var i = 0; i < $respond.length; i++) {
463
											(function(n) {
464
												var imgL = "../images/default-service.jpg";
465
												if($respond[i].images) {
466
													imgL = '/data/ware/' + $respond[i].images.split(",")[0]
467
												}
468
												var oURL;
469
												if($respond[i].category == 1) {
470
													oURL = "/ajax/professor/baseInfo/" + $respond[i].owner;
471
												} else {
472
													oURL = "/ajax/org/" + $respond[i].owner;
473
												}
474
												$.ajax({
475
													url: oURL,
476
													"type": "GET",
477
													'dataType': "json",
478
													"success": function(data) {
479
														if(data.success) {
480
															var thisName, userType, thisAuth, thisTitle
481
															if(data.data.forShort) {
482
																thisName = data.data.forShort;
483
															} else {
484
																thisName = data.data.name;
485
															}
486
															if($respond.resourceType == 1) {
487
																userType = autho(data.data.authType, data.data.orgAuth, data.data.authStatus);
488
																thisTitle = userType.title;
489
																thisAuth = userType.sty;
490
															} else {
491
																if(data.data.authStatus == 3) {
492
																	thisTitle = "科袖认证企业";
493
																	thisAuth = "authicon-com-ok";
494
																}
495
															}
496
															var add = document.createElement("li");
497
															add.className = "mui-table-view-cell";
498
															add.setAttribute("data-id", $respond[n].id);
499
															var itemlist = '<div class="flexCenter OflexCenter"><div class="madiaHead resourceHead" style="background-image:url(' + imgL + ')"></div>';
500
															itemlist += '<div class="madiaInfo OmadiaInfo">';
501
															itemlist += '<p class="ellipsisSty-2 h1Font" id="usertitle">' + $respond[n].name + '</p>';
502
															itemlist += '<p><span class="h2Font">' + thisName + '</span><em class="authiconNew ' + thisAuth + '" title="' + thisTitle + '"></em></p>';
503
															itemlist += '</div></div>';
504

505
															add.innerHTML = itemlist;
506
															document.getElementById("likeResource").appendChild(add);
507
														}
508
													},
509
													'error': function() {}
510
												});
511
											})(i);
512
										}
513

514
									})
515
								}
516
							}
517
						},
518
						error: function() {}
519
					});
520
				}
521

522
				/*文章跳转*/
523
				$("#likeArtical").on("click", "li", function() {
524
					location.href = "http://" + window.location.host + "/e/a.html?id=" + $(this).attr("data-id");
525
				})
526
				/*点击资源列表*/
527
				$("#likeResource").on("click", "li", function() {
528
					location.href = "http://" + window.location.host + "/e/s.html?id=" + $(this).attr("data-id");
529
				})
530
				$("#resourceList").on("click", "li", function() {
531
					location.href = "http://" + window.location.host + "/e/r.html?id=" + $(this).attr("data-id");
532
				})
533
				$(".tagList").on("click", "li", function() {
534
					var keyCon = $(this).find(".h2Font").text();
535
					location.href = "http://" + window.location.host + "/e/search.html?flag=7&key=" + keyCon;
536
				})
537
				/*微信分享*/
538
				$.ajax({
539
					url: "../ajax/weixin/jsapiTicket",
540
					type: 'get',
541
					dataType: 'json',
542
					contentType: "application/x-www-form-urlencoded; charset=utf-8",
543
					data: {
544
						'url': location.href.split('#')[0]
545
					},
546
					success: function(data) {
547
						if(data.data) {
548
							wx.config({
549
								debug: false, //调试模式好犀利
550
								appId: data.data.appId,
551
								timestamp: data.data.timestamp,
552
								nonceStr: data.data.nonceStr,
553
								signature: data.data.signature,
554
								jsApiList: [ // 所有要调用的 API 都要加到这个列表中
555
									"onMenuShareAppMessage",
556
									"onMenuShareTimeline",
557
									"onMenuShareQQ",
558
									"onMenuShareQZone",
559
									"scanQRCode",
560
								]
561
							});
562
							wx.ready(function() {
563
								// 在这里调用 API
564
								wx.onMenuShareAppMessage({ //分享给朋友
565
									title: shareTitle, // 分享标题
566
									desc: descContent, // 分享描述
567
									link: lineLink, // 分享链接
568
									imgUrl: imgUrl, // 分享图标
569
									success: share_success_callback,
570
									cancel: share_cancel_callback
571
								});
572
								wx.onMenuShareTimeline({ //分享到朋友圈
573
									title: shareTitle, // 分享标题
574
									desc: descContent, // 分享描述
575
									link: lineLink, // 分享链接
576
									imgUrl: imgUrl, // 分享图标
577
									success: share_success_callback,
578
									cancel: share_cancel_callback
579
								});
580
								wx.onMenuShareQQ({ //分享到QQ
581
									title: shareTitle, // 分享标题
582
									desc: descContent, // 分享描述
583
									link: lineLink, // 分享链接
584
									imgUrl: imgUrl, // 分享图标
585
									success: share_success_callback,
586
									cancel: share_cancel_callback
587
								});
588
								wx.onMenuShareQZone({ //分享到QQ空间
589
									title: shareTitle, // 分享标题
590
									desc: descContent, // 分享描述
591
									link: lineLink, // 分享链接
592
									imgUrl: imgUrl, // 分享图标
593
									success: share_success_callback,
594
									cancel: share_cancel_callback
595
								});
596
							});
597
							//分享成功后的回调函数	
598
							function share_success_callback() {}
599
							//用户取消分享后执行的回调函数	
600
							function share_cancel_callback() {}
601
						}
602
					}
603
				});
604
			})
605
		</script>
606
	</body>
607

608
</html>

+ 6 - 0
js/serviceIssue.js

@ -394,6 +394,12 @@ $(document).ready(function() {
394 394

395 395
	}
396 396
	$("#expertli").on("click", "li", function() {
397
		console.log($("#expertli").find(".selectNull").length)
398
		if(!$(this).find(".selectNull").hasClass("selectAdd"))
399
		if($("#expertli").find(".selectAdd").length>=5) {
400
			$.MsgBox.Alert('提示','相关资源最多选择5个');
401
			return;
402
		}
397 403
		$(this).find(".selectNull").toggleClass("selectAdd");
398 404
	});
399 405
	ajaxRequist("/ajax/resource/qaProPublish", {