index.html 6.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <include file="appapi@head"/>
  5. <title>我的等级</title>
  6. <link href='__STATIC__/appapi/css/level.css?t=1589966625' rel="stylesheet" type="text/css" >
  7. <style type="text/css">
  8. .bg_default1{
  9. background: #FFF;
  10. }
  11. </style>
  12. </head>
  13. <body >
  14. <div class="main">
  15. <div class="tab clearfix">
  16. <ul>
  17. <li class="on">
  18. 用户等级
  19. <div class="tab_line bg_default1"></div>
  20. </li>
  21. <li>
  22. 主播等级
  23. <div class="tab_line bg_default1"></div>
  24. </li>
  25. </ul>
  26. </div>
  27. <div class="top-body ">
  28. <div class="level">
  29. <div class="speed">
  30. <div class="info">
  31. <div class="name">
  32. <img src="{$userinfo['avatar']}">
  33. </div>
  34. <div class="avatar_bg"></div>
  35. <div class="tip">Lv.{$levelinfo['levelid']}</div>
  36. </div>
  37. <div class="level_val">
  38. 经验值:<span id="total" style="margin-right: 10px;">{$userinfo['consumption']}</span>
  39. <if condition="$type eq '1'">
  40. 距离升级:<span id="next_diff">{$cha}</span>
  41. <else/>
  42. 你已经达到最高级别
  43. </if>
  44. </div>
  45. <div class="level_jindu">
  46. <div class="level_jindu_l">
  47. Lv.{$levelinfo['levelid']}
  48. </div>
  49. <div class="jindu">
  50. <div class="levelnp">
  51. <div class="leveln n2 bg_default1" id="progress" style="width:{$baifen}%; border-radius: 4px;"></div>
  52. </div>
  53. </div>
  54. <div class="level_jindu_r">
  55. <if condition="$type eq '1'">
  56. Lv.{$levelinfo['levelid']+1}
  57. <else/>
  58. Lv.Max
  59. </if>
  60. </div>
  61. </div>
  62. </div>
  63. </div>
  64. <div class="privilege clearfix">
  65. <div class="title">
  66. <img src="__STATIC__/appapi/images/level/level_title_left.png" />
  67. 等级特权
  68. <img src="__STATIC__/appapi/images/level/level_title_right.png" />
  69. </div>
  70. <ul>
  71. <li>
  72. <img src="__STATIC__/appapi/images/level/v_level_id.png">
  73. <div class="privilege_t">排名靠前</div>
  74. </li>
  75. <li>
  76. <img src="__STATIC__/appapi/images/level/v_level_id2.png">
  77. <div class="privilege_t">等级勋章</div>
  78. </li>
  79. </ul>
  80. </div>
  81. <div class="privilege clearfix" style="margin-top: 0.2rem;">
  82. <div class="title">
  83. <img src="__STATIC__/appapi/images/level/level_title_left.png" />
  84. 如何升级
  85. <img src="__STATIC__/appapi/images/level/level_title_right.png" />
  86. </div>
  87. <ul>
  88. <li>
  89. <img src="__STATIC__/appapi/images/level/send_gift.png">
  90. <div class="privilege_t">送礼</div>
  91. </li>
  92. <li>
  93. <img src="__STATIC__/appapi/images/level/shop_consumption.png">
  94. <div class="privilege_t">道具消费</div>
  95. </li>
  96. </ul>
  97. </div>
  98. <div class="line10"></div>
  99. <div class="tips">
  100. <a href="/appapi/level/level">用户等级说明</a>
  101. </div>
  102. </div>
  103. <div class="top-body hide">
  104. <div class="level level_a">
  105. <div class="speed">
  106. <div class="info">
  107. <div class="name">
  108. <img src="{$userinfo['avatar']}">
  109. </div>
  110. <div class="avatar_bg"></div>
  111. <div class="tip">Lv.{$levelinfo_a['levelid']}</div>
  112. </div>
  113. <div class="level_val">
  114. 经验值:<span id="total" style="margin-right: 10px;">{$userinfo['votestotal']}</span>
  115. <if condition="$type_a eq '1'">
  116. 距离升级:<span id="next_diff">{$cha_a}</span>
  117. <else/>
  118. 你已经达到最高级别
  119. </if>
  120. </div>
  121. <div class="level_jindu">
  122. <div class="level_jindu_l">
  123. Lv.{$levelinfo_a['levelid']}
  124. </div>
  125. <div class="jindu">
  126. <div class="levelnp">
  127. <div class="leveln n2 bg_default1" id="progress" style="width:{$baifen_a}%; border-radius: 4px;"></div>
  128. </div>
  129. </div>
  130. <div class="level_jindu_r">
  131. <if condition="$type_a eq '1'">
  132. Lv.{$levelinfo_a['levelid']+1}
  133. <else/>
  134. Lv.Max
  135. </if>
  136. </div>
  137. </div>
  138. </div>
  139. </div>
  140. <div class="privilege clearfix">
  141. <div class="title">
  142. <img src="__STATIC__/appapi/images/level/level_title_left.png" />
  143. 等级特权
  144. <img src="__STATIC__/appapi/images/level/level_title_right.png" />
  145. </div>
  146. <ul>
  147. <li>
  148. <img src="__STATIC__/appapi/images/level/m_level_id.png">
  149. <div class="privilege_t">等级标识</div>
  150. </li>
  151. <li>
  152. <img src="__STATIC__/appapi/images/level/m_level_id2.png">
  153. <div class="privilege_t">身份标识</div>
  154. </li>
  155. </ul>
  156. </div>
  157. <div class="privilege clearfix" style="margin-top: 0.2rem;">
  158. <div class="title">
  159. <img src="__STATIC__/appapi/images/level/level_title_left.png" />
  160. 如何升级
  161. <img src="__STATIC__/appapi/images/level/level_title_right.png" />
  162. </div>
  163. <ul>
  164. <li>
  165. <img src="__STATIC__/appapi/images/level/a_send_gift.png">
  166. <div class="privilege_t">收礼</div>
  167. </li>
  168. <li>
  169. <img src="__STATIC__/appapi/images/level/shop_consumption.png">
  170. <div class="privilege_t">计费房间</div>
  171. </li>
  172. </ul>
  173. </div>
  174. <div class="line10"></div>
  175. <div class="tips">
  176. <a href="/appapi/level/level_a">主播等级说明</a>
  177. </div>
  178. </div>
  179. </div>
  180. </body>
  181. <include file="appapi@footer"/>
  182. <script>
  183. (function(){
  184. $(".tab ul li").on("click",function(){
  185. $(this).siblings().removeClass("on");
  186. $(this).addClass("on");
  187. $(".top-body").hide().eq($(this).index()).show();
  188. })
  189. })()
  190. </script>
  191. </body>
  192. </html>