achievement.html 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8" />
  5. <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7,chrome=1" />
  6. <title>个人成就</title>
  7. <meta name="description" content="" />
  8. <meta name="keywords" content="" />
  9. <link rel="stylesheet" href="css/morris.css" />
  10. <link rel="stylesheet" href="css/personal.css" />
  11. <!--[if gt IE 6]><!-->
  12. <script type="text/javascript">
  13. !function(t){t.loadScript(["http://szhuodong.duowan.com/feq/lolbox/yy-f2e-header-lolbox.min"])}(function(){function t(t){var e=n(t);document.write(e)}function n(t){for(var n,r="",c=0;n=t[c];c++)r+=e(n);return r}function e(t){var n=[unescape("%3Cscript%20type%3D%22text/javascript%22%20src%3D%22"),"",unescape("%22%3E%3C/script%3E")],e=new Date;return e.setSeconds(0),e.setMilliseconds(0),e=e.getTime(),t+="?t_="+e,n[1]=t,n.join("")}return{loadScript:function(n){n&&n.length&&n instanceof Array&&t(n)}}}())
  14. </script>
  15. <!--<![endif]-->
  16. <!--[if IE 7]>
  17. <style>
  18. .hero-nav, .blacklist{behavior: url(js/PIE.htc);}
  19. </style>
  20. <![endif]-->
  21. <script>var playerMostUsedHero = null,jiathis_config;</script>
  22. </head>
  23. <body style="overflow:hidden;" scroll="no">
  24. <div class="personal-nav-wrap">
  25. <div class="mod-tabs-hd col-4">
  26. <ul class="mod-tabs-trigger J_nav" id="modeTabs">
  27. <li class="stat-sign" stat-sign="zonghe" stat-desc="综合统计" data-name="generalRecord">
  28. <a>战绩总览</a>
  29. </li>
  30. <li class="stat-sign" stat-sign="common" stat-desc="常规模式" data-name="historyRecord">
  31. <a>历史战绩</a>
  32. </li>
  33. <li class="stat-sign" stat-sign="2015" stat-desc="stat-desc" data-name="goodAt">
  34. <a>擅长领域</a>
  35. </li>
  36. <li class="selected stat-sign" data-name="achievement">
  37. <a href="javascript:;">个人称号</a>
  38. </li>
  39. </ul>
  40. <div class="common-page__control clearfix">
  41. <a href="javascript:;" class="common-page__goBack"></a>
  42. <a href="javascript:;" class="common-page__reflash"></a>
  43. </div>
  44. </div>
  45. </div>
  46. <div class="box personal" style="width:600px;padding:15px;overflow:hidden;">
  47. <div class="no-data-tip hide">
  48. <img src="img/clothes-commit-fail.png">
  49. <p></p>
  50. </div>
  51. <div class="box-bd clearfix">
  52. <div class="intro" id="personalInfo">
  53. </div>
  54. <div class="mod-tabs clearfix">
  55. <div class="mod-tabs-bd"></div>
  56. </div>
  57. </div>
  58. <!-- 头部个人信息数据 -->
  59. <script id="personalInfoTemp" type="text/template">
  60. <%
  61. var level = data.level;
  62. var zdlData = data.tier_rank;
  63. var global = data.global;
  64. var tier = zdlData.tier;
  65. var duanwei = tier.name_cn;
  66. var url = (data.focus == "0") ? (global.aUrl + "addFocus") : (global.aUrl + "removeFocus");
  67. var tierName;
  68. if (zdlData && zdlData['tier'] && zdlData['tier']['const'] > 0) {
  69. tierName = zdlData['tier']['name_cn'] + ' ' + zdlData['rank']['name'];
  70. } else {
  71. tierName = '-';
  72. }
  73. %>
  74. <div class="info">
  75. <div class="avatar">
  76. <a href="<%=global.href%>" class="stat-sign" stat-sign="stand" stat-desc="点击/战绩页">
  77. <img src="<%=data.url_img%>" />
  78. </a><div class="p_level"><%=level%></div>
  79. <img src="img/achievement/placeholder.png" class="userMedal">
  80. </div>
  81. <div class="text">
  82. <div class="name-info clearfix">
  83. <a class="name" href="javascript:;" title="<%=data.pn%>"><%=data.pn%></a>
  84. <span class="name-info__nameServer">(<%=data.game_zone.alias%>)</span>
  85. <span class="userInfo-common__focus <%=data.isSelf ? 'hide' : ''%>">
  86. <%if(data.followed) {%>
  87. <a class="attention already" data-action="removeFocus"></a>
  88. <%} else {%>
  89. <a class="attention" data-action="addFocus"></a>
  90. <%} %>
  91. </span>
  92. </div>
  93. <div class="more-info">
  94. <span><%=tierName%></span>
  95. <span class="line-small"></span>
  96. <span>点赞 <%=data.like%></span>
  97. <span class="line-small"></span>
  98. <span class="blacklist-content2">
  99. <label>拉黑 <%=data.unlike%></label>
  100. </span>
  101. <!-- <span class="blacklist">隐藏拉黑</span> -->
  102. </div>
  103. </div>
  104. </div>
  105. <!-- 段位信息 -->
  106. <%
  107. if(tier){
  108. %>
  109. <div class="duan-wei clearfix">
  110. <img src="img/user-common__fighting.png">
  111. <p class="duan-wei-msg"><%=data.box_score%></p>
  112. </div>
  113. <%}%>
  114. <!-- 常用英雄列表 -->
  115. <div class="user-hero__box">
  116. <div class="user-hero__header clearfix">
  117. <h3>常用英雄</h3>
  118. <!-- 更多常用英雄URL -->
  119. <%
  120. var moreHeroURL = ['championsStat.html?serverName=', data.game_zone.server_name, '&playerName=', data.pn, '&userId=', data.user_id, '&gameZone=', data.game_zone.pinyin].join('');
  121. var historyRecordURL = ['historyRecord.html?serverName=', data.game_zone.server_name, '&playerName=', data.pn, '&userId=', data.user_id, '&gameZone=', data.game_zone.pinyin].join('');
  122. %>
  123. <a href="<%= moreHeroURL %>">更多》</a>
  124. </div>
  125. <ul class="user-hero__list clearfix">
  126. <%
  127. var heroListData = data.champion_performance_list.slice(0,5);
  128. _.each(heroListData, function(item, i){
  129. %>
  130. <li>
  131. <a href="<%= historyRecordURL %>&championId=<%= item.champion.id %>">
  132. <img src="<%= item.champion.url_img['40x40'] %>">
  133. <div class="user-hero__mask"></div>
  134. <div class="user-hero__info">
  135. <p class="user-hero__info--title">胜率</p>
  136. <p><%= item.win_rate %>%</p>
  137. </div>
  138. </a>
  139. </li>
  140. <% }); %>
  141. </ul>
  142. </div>
  143. </script>
  144. <!-- 个人成就主体内容渲染模板 -->
  145. <script id="achievement-tpl" type="text/template">
  146. <div class="mod-title"><img src="img/achievement/mod_title.png"></div>
  147. <div class="achievement">
  148. <ul class="clearfix">
  149. <li class="fl">
  150. <div class="charts-round-wrap">
  151. <div id="threeKillContainer" class="charts-wrap"></div>
  152. <div class="round-mask">
  153. <h3>三杀</h3>
  154. <p>x<%=data.triple_kill%></p>
  155. </div>
  156. </div>
  157. <p class="msg">已完成<span><%=data.triple_kill%>/<%=data.display_num%></span>次三杀任务</p>
  158. </li>
  159. <li class="fl">
  160. <div class="charts-round-wrap">
  161. <div id="fiveKillContainer" class="charts-wrap"></div>
  162. <div class="round-mask">
  163. <h3>五杀</h3>
  164. <p>x<%=data.penta_kill%></p>
  165. </div>
  166. </div>
  167. <p class="msg">已完成<span><%=data.penta_kill%>/<%=data.display_num%></span>次五杀任务</p>
  168. </li>
  169. <li class="fl">
  170. <div class="charts-round-wrap super-god">
  171. <div id="superGodContainer" class="charts-wrap"></div>
  172. <div class="round-mask">
  173. <h3>超神</h3>
  174. <p>x<%=data.god_like%></p>
  175. </div>
  176. </div>
  177. <p class="msg">已完成<span><%=data.god_like%>/<%=data.display_num%></span>次超神任务</p>
  178. </li>
  179. <li class="fl">
  180. <div class="charts-round-wrap">
  181. <div id="carryContainer" class="charts-wrap"></div>
  182. <div class="round-mask">
  183. <h3>CARRY</h3>
  184. <p>x<%=data.carry_num%></p>
  185. </div>
  186. </div>
  187. <p class="msg">已完成<span><%=data.carry_num%>/<%=data.display_num%></span>次CARRY任务</p>
  188. </li>
  189. <li class="fl">
  190. <div class="charts-round-wrap">
  191. <div id="mvpContainer" class="charts-wrap"></div>
  192. <div class="round-mask">
  193. <h3>MVP</h3>
  194. <p>x<%=data.mvp_num%></p>
  195. </div>
  196. </div>
  197. <p class="msg">已完成<span><%=data.mvp_num%>/<%=data.display_num%></span>次MVP任务</p>
  198. </li>
  199. </ul>
  200. </div>
  201. <div class="lock-wrap">
  202. <ul class="clearfix">
  203. <%
  204. // 完成情况
  205. var taskFinishList = [];
  206. data.carry_num >= data.display_num ? taskFinishList.push('finish') : taskFinishList.push('unfinish');
  207. data.god_like >= data.display_num ? taskFinishList.push('finish') : taskFinishList.push('unfinish');
  208. data.penta_kill >= data.display_num ? taskFinishList.push('finish') : taskFinishList.push('unfinish');
  209. data.mvp_num >= data.display_num ? taskFinishList.push('finish') : taskFinishList.push('unfinish');
  210. data.minions_kill_num >= data.display_num ? taskFinishList.push('finish') : taskFinishList.push('unfinish');
  211. data.rate_gank_num >= data.display_num ? taskFinishList.push('finish') : taskFinishList.push('unfinish');
  212. data.neutral_minions >= data.display_num ? taskFinishList.push('finish') : taskFinishList.push('unfinish');
  213. data.dragon_kill >= data.display_num ? taskFinishList.push('finish') : taskFinishList.push('unfinish');
  214. data.total_damage_taken >= data.display_num ? taskFinishList.push('finish') : taskFinishList.push('unfinish');
  215. data.damage_dealt_to_cham >= data.display_num ? taskFinishList.push('finish') : taskFinishList.push('unfinish');
  216. %>
  217. <li class="fl <%=taskFinishList[0]%>">
  218. <img src="img/achievement/a_level_1.png">
  219. <p class="title">CARRY全场</p>
  220. <p class="num"><%=data.carry_num%>/<%=data.display_num%></p>
  221. <div class="no-lock-mask">
  222. <i class="lock"></i>
  223. <div class="no-lock__info">
  224. <p>已完成</p>
  225. <p><%=data.carry_num%>/<%=data.display_num%></p>
  226. </div>
  227. </div>
  228. <div class="lock-hover-mask">
  229. <div class="inner">
  230. <a>展示到首页</a>
  231. </div>
  232. </div>
  233. <div class="lock-active-mask">
  234. <i class="triangle"></i>
  235. </div>
  236. </li>
  237. <li class="fl <%=taskFinishList[1]%>">
  238. <img src="img/achievement/a_level_2.png">
  239. <p class="title">完成超神</p>
  240. <p class="num"><%=data.god_like%>/<%=data.display_num%></p>
  241. <div class="no-lock-mask">
  242. <i class="lock"></i>
  243. <div class="no-lock__info">
  244. <p>已完成</p>
  245. <p><%=data.god_like%>/<%=data.display_num%></p>
  246. </div>
  247. </div>
  248. <div class="lock-hover-mask">
  249. <div class="inner">
  250. <a>展示到首页</a>
  251. </div>
  252. </div>
  253. <div class="lock-active-mask">
  254. <i class="triangle"></i>
  255. </div>
  256. </li>
  257. <li class="fl <%=taskFinishList[2]%>">
  258. <img src="img/achievement/a_level_3.png">
  259. <p class="title">完成五杀</p>
  260. <p class="num"><%=data.penta_kill%>/<%=data.display_num%></p>
  261. <div class="no-lock-mask">
  262. <i class="lock"></i>
  263. <div class="no-lock__info">
  264. <p>已完成</p>
  265. <p><%=data.penta_kill%>/<%=data.display_num%></p>
  266. </div>
  267. </div>
  268. <div class="lock-hover-mask">
  269. <div class="inner">
  270. <a>展示到首页</a>
  271. </div>
  272. </div>
  273. <div class="lock-active-mask">
  274. <i class="triangle"></i>
  275. </div>
  276. </li>
  277. <li class="fl <%=taskFinishList[3]%>">
  278. <img src="img/achievement/a_level_4.png">
  279. <p class="title">获得全场MVP</p>
  280. <p class="num"><%=data.mvp_num%>/<%=data.display_num%></p>
  281. <div class="no-lock-mask">
  282. <i class="lock"></i>
  283. <div class="no-lock__info">
  284. <p>已完成</p>
  285. <p><%=data.mvp_num%>/<%=data.display_num%></p>
  286. </div>
  287. </div>
  288. <div class="lock-hover-mask">
  289. <div class="inner">
  290. <a>展示到首页</a>
  291. </div>
  292. </div>
  293. <div class="lock-active-mask">
  294. <i class="triangle"></i>
  295. </div>
  296. </li>
  297. <li class="boundary fl <%=taskFinishList[4]%>">
  298. <img src="img/achievement/a_level_5.png">
  299. <p class="title">全场补刀最高</p>
  300. <p class="num"><%=data.minions_kill_num%>/<%=data.display_num%></p>
  301. <div class="no-lock-mask">
  302. <i class="lock"></i>
  303. <div class="no-lock__info">
  304. <p>已完成</p>
  305. <p><%=data.minions_kill_num%>/<%=data.display_num%></p>
  306. </div>
  307. </div>
  308. <div class="lock-hover-mask">
  309. <div class="inner">
  310. <a>展示到首页</a>
  311. </div>
  312. </div>
  313. <div class="lock-active-mask">
  314. <i class="triangle"></i>
  315. </div>
  316. </li>
  317. <li class="fl <%=taskFinishList[5]%>">
  318. <img src="img/achievement/a_level_6.png">
  319. <p class="title">GANK高达15%</p>
  320. <p class="num"><%=data.rate_gank_num%>/<%=data.display_num%></p>
  321. <div class="no-lock-mask">
  322. <i class="lock"></i>
  323. <div class="no-lock__info">
  324. <p>已完成</p>
  325. <p><%=data.rate_gank_num%>/<%=data.display_num%></p>
  326. </div>
  327. </div>
  328. <div class="lock-hover-mask">
  329. <div class="inner">
  330. <a>展示到首页</a>
  331. </div>
  332. </div>
  333. <div class="lock-active-mask">
  334. <i class="triangle"></i>
  335. </div>
  336. </li>
  337. <li class="fl <%=taskFinishList[6]%>">
  338. <img src="img/achievement/a_level_7.png">
  339. <p class="title">野怪击杀100次</p>
  340. <p class="num"><%=data.neutral_minions%>/<%=data.display_num%></p>
  341. <div class="no-lock-mask">
  342. <i class="lock"></i>
  343. <div class="no-lock__info">
  344. <p>已完成</p>
  345. <p><%=data.neutral_minions%>/<%=data.display_num%></p>
  346. </div>
  347. </div>
  348. <div class="lock-hover-mask">
  349. <div class="inner">
  350. <a>展示到首页</a>
  351. </div>
  352. </div>
  353. <div class="lock-active-mask">
  354. <i class="triangle"></i>
  355. </div>
  356. </li>
  357. <li class="fl <%=taskFinishList[7]%>">
  358. <img src="img/achievement/a_level_8.png">
  359. <p class="title">击杀大小龙4次</p>
  360. <p class="num"><%=data.dragon_kill%>/<%=data.display_num%></p>
  361. <div class="no-lock-mask">
  362. <i class="lock"></i>
  363. <div class="no-lock__info">
  364. <p>已完成</p>
  365. <p><%=data.dragon_kill%>/<%=data.display_num%></p>
  366. </div>
  367. </div>
  368. <div class="lock-hover-mask">
  369. <div class="inner">
  370. <a>展示到首页</a>
  371. </div>
  372. </div>
  373. <div class="lock-active-mask">
  374. <i class="triangle"></i>
  375. </div>
  376. </li>
  377. <li class="fl <%=taskFinishList[8]%>">
  378. <img src="img/achievement/a_level_9.png">
  379. <p class="title">承伤高于40000</p>
  380. <p class="num"><%=data.total_damage_taken%>/<%=data.display_num%></p>
  381. <div class="no-lock-mask">
  382. <i class="lock"></i>
  383. <div class="no-lock__info">
  384. <p>已完成</p>
  385. <p><%=data.total_damage_taken%>/<%=data.display_num%></p>
  386. </div>
  387. </div>
  388. <div class="lock-hover-mask">
  389. <div class="inner">
  390. <a>展示到首页</a>
  391. </div>
  392. </div>
  393. <div class="lock-active-mask">
  394. <i class="triangle"></i>
  395. </div>
  396. </li>
  397. <li class="boundary fl <%=taskFinishList[9]%>">
  398. <img src="img/achievement/a_level_10.png">
  399. <p class="title">输出高于40000</p>
  400. <p class="num"><%=data.damage_dealt_to_cham%>/<%=data.display_num%></p>
  401. <div class="no-lock-mask">
  402. <i class="lock"></i>
  403. <div class="no-lock__info">
  404. <p>已完成</p>
  405. <p><%=data.damage_dealt_to_cham%>/<%=data.display_num%></p>
  406. </div>
  407. </div>
  408. <div class="lock-hover-mask">
  409. <div class="inner">
  410. <a>展示到首页</a>
  411. </div>
  412. </div>
  413. <div class="lock-active-mask">
  414. <i class="triangle"></i>
  415. </div>
  416. </li>
  417. </ul>
  418. </div>
  419. <div class="page-ad">
  420. <img src="img/page_ad.png" alt="">
  421. </div>
  422. </script>
  423. <script src="js/jquery-1.11.1.min.js"></script>
  424. <script src="js/jquery-migrate-1.2.1.min.js"></script>
  425. <script src="js/highcharts.js"></script>
  426. <script src="js/jquery.nicescroll.min.js"></script>
  427. <script src="js/jquery.cookie.js"></script>
  428. <script src="js/underscore.js"></script>
  429. <script type="text/javascript" src="http://sz.duowan.com/s/ya/ya.1.3.1-min.js"></script>
  430. <!--广告位统计-->
  431. <script type="text/javascript">
  432. // fis3资源定位方法s
  433. function __uri(src) {
  434. return src;
  435. }
  436. /* 拆分逻辑模块 */
  437. var achievementJS = __uri("js/achievement.js");
  438. </script>
  439. <script src="http://sz.duowan.com/resource/adstat.1.0.0.js"></script>
  440. <script src="js/moment.min.js"></script>
  441. <script src="js/new_stat.js"></script>
  442. <script src="js/personal_v3.0.js"></script>
  443. <script type="text/javascript">
  444. $(function() {
  445. new Personal('tab4');
  446. });
  447. </script>
  448. <!--海度统计-->
  449. <script type="text/javascript">_hiido_no=0;_hiido_wid=["lbox"];</script>
  450. <script src="http://www.duowan.com/duowan.js" type="text/javascript"></script>
  451. <!--百度统计-->
  452. <script>
  453. var _hmt = _hmt || [];
  454. (function() {
  455. var hm = document.createElement("script");
  456. hm.src = "//hm.baidu.com/hm.js?72772dda37b1e926733138415981abcf";
  457. var s = document.getElementsByTagName("script")[0];
  458. s.parentNode.insertBefore(hm, s);
  459. })();
  460. </script>
  461. <!--[if gt IE 6]><!-->
  462. <script type="text/javascript">
  463. window.onerror = function(a,b,c){ return true};!function(t){t.loadScript(["http://szhuodong.duowan.com/feq/lolbox/yy-f2e-lolbox.min"])}(function(){function t(e,a){var n=a[e];if(n){e++;var o=document.createElement("script");o.type="text/javascript",o.setAttribute("async","async"),o.onload=o.onreadystatechange=function(){return o.readyState&&"complete"!==o.readyState&&"loaded"!==o.readyState?!1:(o.onload=o.onreadystatechange=null,void t(e,a))};var c=new Date;c.setSeconds(0),c.setMilliseconds(0),c=c.getTime(),o.async=!0,o.src=n+"?_="+c,document.getElementsByTagName("head")[0].appendChild(o)}}return{loadScript:function(e){e&&e.length&&e instanceof Array&&t(0,e)}}}());
  464. </script>
  465. <!--<![endif]-->
  466. </body>
  467. </html>