index.html 24 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496
  1. <style>
  2. .panel-div{
  3. float:left;
  4. border:1px solid #ccc;
  5. width:24%;
  6. height:300px;
  7. margin-right: 1%;
  8. }
  9. @media (max-width: 1200px){
  10. .panel-div{
  11. width:48%;
  12. margin-bottom: 20px;
  13. }
  14. }
  15. .pannel-top{
  16. width:100%;
  17. height: 50px;
  18. border-bottom: 1px solid #ccc;
  19. font-size:1.8rem;
  20. position:relative;
  21. z-index: 1;
  22. }
  23. {if condition = "$groupId eq 3"}
  24. .pannel-middle{
  25. width:100%;
  26. height: 100px;
  27. border-bottom: 1px solid #ccc;
  28. position:relative;
  29. font-size:1.3rem;
  30. }
  31. {else /}
  32. .pannel-middle{
  33. width:100%;
  34. height: 100px;
  35. border-bottom: 1px solid #ccc;
  36. position:relative;
  37. font-size:1.8rem;
  38. }
  39. {/if}
  40. .pannel-bottom{
  41. width:100%;
  42. height: 150px;
  43. font-size:1.8rem;
  44. position:relative;
  45. }
  46. .pannel-top > div{
  47. font-size: 14px;
  48. position: absolute;
  49. top: 50%;
  50. -ms-transform: translateY(-50%);
  51. -moz-transform: translateY(-50%);
  52. -webkit-transform: translateY(-50%);
  53. -o-transform: translateY(-50%);
  54. transform: translateY(-50%);
  55. margin-left: 10px;
  56. font-weight:bold;
  57. color: #333;
  58. }
  59. .pannel-top .tooltip-inner {
  60. padding: 3px 8px;
  61. color: #fff;
  62. font-size: 11px;
  63. width: 200px;
  64. text-align: left;
  65. background-color: #000;
  66. border-radius: 3px;
  67. }
  68. @media (max-width: 480px){
  69. .pannel-top .tooltip-inner {
  70. width: 160px;
  71. }
  72. }
  73. .pannel-top div.flush{
  74. position: absolute;
  75. font-size: 13px;
  76. color: #999;
  77. top: 50%;
  78. -ms-transform: translateY(-50%);
  79. -moz-transform: translateY(-50%);
  80. -webkit-transform: translateY(-50%);
  81. -o-transform: translateY(-50%);
  82. transform: translateY(-50%);
  83. right:10px;
  84. font-weight: normal;
  85. }
  86. .pannel-middle div{
  87. position: absolute;
  88. top: 50%;
  89. -ms-transform: translateY(-50%);
  90. -moz-transform: translateY(-50%);
  91. -webkit-transform: translateY(-50%);
  92. -o-transform: translateY(-50%);
  93. transform: translateY(-50%);
  94. width: auto;
  95. }
  96. .pannel-bottom div{
  97. position: absolute;
  98. top: 50%;
  99. -ms-transform: translateY(-50%);
  100. -moz-transform: translateY(-50%);
  101. -webkit-transform: translateY(-50%);
  102. -o-transform: translateY(-50%);
  103. transform: translateY(-50%);
  104. font-size:1.3rem;
  105. }
  106. .pannel-middle div.first,.pannel-bottom div.first
  107. {
  108. left:10px;
  109. }
  110. .pannel-middle div.second,.pannel-bottom div.second
  111. {
  112. right:10px;
  113. }
  114. .pannel-middle div span,.pannel-bottom div span
  115. {
  116. color: #1581ff;
  117. margin-bottom: 20px;
  118. }
  119. .day{
  120. font-size: 1.5rem;
  121. padding:5px;
  122. margin: 5px;
  123. }
  124. @media (max-width: 767px){
  125. .panel-div {
  126. display: block;
  127. float: none;
  128. width: 100%;
  129. margin-bottom: 20px;
  130. }
  131. }
  132. .fixed-table-body .card-view .title{
  133. padding: 6px 10px;
  134. width: 40%;
  135. box-sizing: border-box;
  136. vertical-align: middle;
  137. line-height: 20px;
  138. }
  139. .fixed-table-body .card-view .value{
  140. padding: 6px 10px;
  141. display: inline-block;
  142. width: 60%;
  143. box-sizing: border-box;
  144. vertical-align: middle;
  145. line-height: 20px;
  146. }
  147. i{
  148. font-style: normal;
  149. }
  150. .card-view{
  151. background-color: #fff;
  152. margin-bottom: 1px;
  153. }
  154. .tooltip.right{
  155. top: 0!important;
  156. }
  157. .tooltip.right .tooltip-arrow{
  158. top: 10px!important;
  159. }
  160. .channelTitle{
  161. font-size:2rem;
  162. margin-bottom:10px;
  163. }
  164. .pvuv_box{
  165. padding-left: 10px;
  166. display: inline-block;
  167. *display: inline;
  168. *zoom:1;
  169. vertical-align: middle;
  170. }
  171. .pvuv_box span{
  172. display: block;
  173. font-size: 14px;
  174. color: #333;
  175. font-weight: normal;
  176. line-height: 18px;
  177. }
  178. .pannel_tody_box .tooltip.right{
  179. top: 6px !important;
  180. }
  181. .fa-question-circle{
  182. cursor: pointer;
  183. }
  184. </style>
  185. <div class="panel panel-default panel-intro">
  186. <div class="panel-body">
  187. <div id="myTabContent" class="tab-content">
  188. <div class="tab-pane fade active in" id="one">
  189. <div class="widget-body no-padding">
  190. {notempty name='channelTitle'}
  191. <div class="channelTitle">
  192. {$channelTitle}
  193. </div>
  194. {/notempty}
  195. <div></div>
  196. <!--今日开始-->
  197. <div>
  198. <div class="panel-div pannel_tody_box">
  199. <div class="pannel-top">
  200. <?php
  201. $current_pv = ($pvuv['pv'] ?? 0)+($guide_pvuv['pv'] ?? 0);
  202. $current_uv = ($pvuv['uv'] ?? 0)+($guide_pvuv['uv'] ?? 0);
  203. ?>
  204. {if condition="$groupId lt 3"}
  205. <div style="z-index: 10;">今天 <i class="fa fa-question-circle" data-toggle="tooltip" data-placement="right" data-original-title="非实时,延迟一分钟左右<br />充值:今天0点之后,推广产生的充值金额<br />渠道商分成收益:今天0点之后,渠道商充值金额*渠道商抽成比例<br />已支付:已支付的订单笔数<br />未支付:未支付的订单笔数<br />完成率:已支付/(已支付+未支付)<br />完成率中不包含活动充值"></i></div>
  206. {elseif condition="$groupId eq 3"}
  207. <div style="z-index: 10;">今天 <i class="fa fa-question-circle" data-toggle="tooltip" data-placement="right" data-original-title="非实时,延迟一分钟左右<br />充值:今天0点之后,自身推广产生的充值金额<br />分成收益:今天0点之后,自身推广产生的充值金额 *抽成比例<br />代理商充值:今天0点之后,代理商推广产生的充值金额<br />代理商分成收益:今天0点之后,代理商推广产生的充值金额 *代理商的抽成比例<br />已支付:已支付的订单笔数<br />未支付:未支付的订单笔数<br />完成率:已支付/(已支付+未支付)<br />完成率中不包含活动充值<br />pvuv每隔一小时刷新一次"></i>
  208. <div class="pvuv_box">
  209. <span id="today_pv">pv:{$current_pv}</span>
  210. <span id="today_uv">uv:{$current_uv}</span>
  211. </div>
  212. </div>
  213. {else /}
  214. <div style="z-index: 10;">今天 <i class="fa fa-question-circle" data-toggle="tooltip" data-placement="right" data-original-title="非实时,延迟一分钟左右<br />充值:今天0点之后,推广产生的充值金额<br />分成收益:今天0点之后,推广产生的充值金额 *抽成比例<br />已支付:已支付的订单笔数<br />未支付:未支付的订单笔数<br />完成率:已支付/(已支付+未支付)<br />完成率中不包含活动充值<br />pvuv每隔一小时刷新一次"></i>
  215. <div class="pvuv_box">
  216. <span id="today_pv">pv:{$current_pv}</span>
  217. <span id="today_uv">uv:{$current_uv}</span>
  218. </div>
  219. </div>
  220. {/if}
  221. <div class="flush">60秒后刷新</div>
  222. </div>
  223. <div class="pannel-middle">
  224. <div class="first">
  225. 充值<br/>
  226. <span id="recharge_money">¥{$today.recharge_money| default=0}</span>
  227. {if condition = "$groupId eq 3"}
  228. <br/><br/>
  229. 代理商充值<br/>
  230. <span id="agent_recharge">¥{$today.agent_recharge| default=0}</span>
  231. {/if}
  232. </div>
  233. <div class="second">
  234. {if condition="$groupId gt 2"}
  235. 分成收益<br/>
  236. {else /}
  237. 渠道商分成收益<br/>
  238. {/if}
  239. <span id = "recharge_money_benefit">¥{$today.recharge_money_benefit| default=0}</span>
  240. {if condition = "$groupId eq 3"}
  241. <br/><br/>
  242. 代理商分成收益<br/>
  243. <span id="agent_benefit">¥{$today.agent_recharge_benefit| default=0}</span>
  244. {/if}
  245. </div>
  246. </div>
  247. <div class="pannel-bottom">
  248. <div class="first" id="normal_first">
  249. 普通充值<br/>
  250. <span id = 'normal_recharge_money'>¥{$today.normal_recharge_money| default=0}</span><br/><br/>
  251. 已支付:{$today.normal_recharge_orders| default=0}笔<br/>
  252. {notempty name='today'}
  253. 未支付:{$today.normal_recharge_orders_count-$today.normal_recharge_orders}笔<br/>
  254. {else /}
  255. 未支付:0笔<br/>
  256. {/notempty}
  257. 完成率:<?php
  258. $percent = 0;
  259. if ($today['kandian_recharge_orders_count']) {
  260. $percent = floor($today['kandian_recharge_orders']/$today['kandian_recharge_orders_count']*100);
  261. } elseif ($today['normal_recharge_orders_count']) {
  262. $percent = floor($today['normal_recharge_orders']/$today['normal_recharge_orders_count']*100);
  263. } else {
  264. $percent = 0;
  265. }
  266. echo $percent;
  267. ?>%<br/>
  268. </div>
  269. <div class="second" id="vip_first">
  270. 年费VIP会员<br/>
  271. <span>¥{$today.vip_recharge_money| default=0}</span><br/><br/>
  272. 已支付:{$today.vip_recharge_orders| default=0}笔<br/>
  273. {notempty name='today'}
  274. 未支付:{$today.vip_recharge_orders_count-$today.vip_recharge_orders}笔<br/>
  275. {else /}
  276. 未支付:0笔<br/>
  277. {/notempty}
  278. 完成率:<?php echo $today['vip_recharge_orders_count']? floor($today['vip_recharge_orders']/$today['vip_recharge_orders_count']*100) : 0;?>%<br/>
  279. </div>
  280. </div>
  281. </div>
  282. <!--昨日开始-->
  283. <div class="panel-div">
  284. <div class="pannel-top">
  285. <div>昨天</div>
  286. </div>
  287. <div class="pannel-middle">
  288. <div class="first">
  289. 充值<br/>
  290. <span>¥{$yesterday.recharge_money| default=0}</span>
  291. {if condition = "$groupId eq 3"}
  292. <br/><br/>
  293. 代理商充值<br/>
  294. <span>¥{$yesterday.agent_recharge| default=0}</span>
  295. {/if}
  296. </div>
  297. <div class="second">
  298. {if condition="$groupId gt 2"}
  299. 分成收益<br/>
  300. {else /}
  301. 渠道商分成收益<br/>
  302. {/if}
  303. <span>¥{$yesterday.recharge_money_benefit| default=0}</span>
  304. {if condition = "$groupId eq 3"}
  305. <br/><br/>
  306. 代理商分成收益<br/>
  307. <span>¥{$yesterday.agent_recharge_benefit| default=0}</span>
  308. {/if}
  309. </div>
  310. </div>
  311. <div class="pannel-bottom">
  312. <div class="first">
  313. 普通充值<br/>
  314. <span>¥{$yesterday.normal_recharge_money| default=0}</span><br/><br/>
  315. 已支付:{$yesterday.normal_recharge_orders| default=0}笔<br/>
  316. {notempty name='yesterday'}
  317. 未支付:{$yesterday.normal_recharge_orders_count-$yesterday.normal_recharge_orders}笔<br/>
  318. {else /}
  319. 未支付:0笔<br/>
  320. {/notempty}
  321. 完成率:<?php
  322. $percent = 0;
  323. if ($yesterday['kandian_recharge_orders_count']) {
  324. $percent = floor($yesterday['kandian_recharge_orders']/$yesterday['kandian_recharge_orders_count']*100);
  325. } elseif ($yesterday['normal_recharge_orders_count']) {
  326. $percent = floor($yesterday['normal_recharge_orders']/$yesterday['normal_recharge_orders_count']*100);
  327. } else {
  328. $percent = 0;
  329. }
  330. echo $percent;
  331. ?>%<br/>
  332. </div>
  333. <div class="second">
  334. 年费VIP会员<br/>
  335. <span>¥{$yesterday.vip_recharge_money| default=0}</span><br/><br/>
  336. 已支付:{$yesterday.vip_recharge_orders| default=0}笔<br/>
  337. {notempty name='yesterday'}
  338. 未支付:{$yesterday.vip_recharge_orders_count-$yesterday.vip_recharge_orders}笔<br/>
  339. {else /}
  340. 未支付:0笔<br/>
  341. {/notempty}
  342. 完成率:<?php echo $yesterday['vip_recharge_orders_count']? floor($yesterday['vip_recharge_orders']/$yesterday['vip_recharge_orders_count']*100) : 0;?>%<br/>
  343. </div>
  344. </div>
  345. </div>
  346. <!--昨日结束,本月开始-->
  347. <div class="panel-div">
  348. <div class="pannel-top">
  349. <div>本月(不含当日) <i class="fa fa-question-circle" data-toggle="tooltip" data-placement="right" data-original-title="不含当日,非实时,每天凌晨2:30左右更新"></i></div>
  350. </div>
  351. <div class="pannel-middle">
  352. <div class="first">
  353. 充值<br/>
  354. <span>¥{$month.recharge_money| default=0}</span>
  355. {if condition = "$groupId eq 3"}
  356. <br/><br/>
  357. 代理商充值<br/>
  358. <span>¥{$month.agent_recharge| default=0}</span>
  359. {/if}
  360. </div>
  361. <div class="second">
  362. {if condition="$groupId gt 2"}
  363. 分成收益<br/>
  364. {else /}
  365. 渠道商分成收益<br/>
  366. {/if}
  367. <span>¥{$month.recharge_money_benefit| default=0}</span>
  368. {if condition = "$groupId eq 3"| default=0}
  369. <br/><br/>
  370. 代理商分成收益<br/>
  371. <span>¥{$month.agent_recharge_benefit| default=0}</span>
  372. {/if}
  373. </div>
  374. </div>
  375. <div class="pannel-bottom">
  376. <div class="first">
  377. 普通充值<br/>
  378. <span>¥{$month.normal_recharge_money| default=0}</span><br/><br/>
  379. 已支付:{$month.normal_recharge_orders| default=0}笔<br/>
  380. {notempty name='month'}
  381. 未支付:{$month.normal_recharge_orders_count-$month.normal_recharge_orders}笔<br/>
  382. {else /}
  383. 未支付:0笔<br/>
  384. {/notempty}
  385. 完成率:<?php
  386. $percent = 0;
  387. if ($month['kandian_recharge_orders_count']) {
  388. $percent = floor($month['kandian_recharge_orders']/$month['kandian_recharge_orders_count']*100);
  389. } elseif ($month['normal_recharge_orders_count']) {
  390. $percent = floor($month['normal_recharge_orders']/$month['normal_recharge_orders_count']*100);
  391. } else {
  392. $percent = 0;
  393. }
  394. echo $percent;
  395. ?>%<br/>
  396. </div>
  397. <div class="second">
  398. 年费VIP会员<br/>
  399. <span>¥{$month.vip_recharge_money| default=0}</span><br/><br/>
  400. 已支付:{$month.vip_recharge_orders| default=0}笔<br/>
  401. {notempty name='month'}
  402. 未支付:{$month.vip_recharge_orders_count-$month.vip_recharge_orders}笔<br/>
  403. {else /}
  404. 未支付:0笔<br/>
  405. {/notempty}
  406. 完成率:<?php echo $month['vip_recharge_orders_count']? floor($month['vip_recharge_orders']/$month['vip_recharge_orders_count']*100) : 0;?>%<br/>
  407. </div>
  408. </div>
  409. </div>
  410. <!--本月结束。累计开始-->
  411. <div class="panel-div">
  412. <div class="pannel-top">
  413. <div>累计(不含当日) <i class="fa fa-question-circle" data-toggle="tooltip" data-placement="right" data-original-title="不含当日,非实时,每天凌晨2:30左右更新"></i></div>
  414. </div>
  415. <div class="pannel-middle">
  416. <div class="first">
  417. 充值<br/>
  418. <span>¥{$all.recharge_money| default=0}</span>
  419. {if condition = "$groupId eq 3"}
  420. <br/><br/>
  421. 代理商充值<br/>
  422. <span>¥{$all.agent_recharge| default=0}</span>
  423. {/if}
  424. </div>
  425. <div class="second">
  426. {if condition="$groupId gt 2"}
  427. 分成收益<br/>
  428. {else /}
  429. 渠道商分成收益<br/>
  430. {/if}
  431. <span>¥{$all.recharge_money_benefit| default=0}</span>
  432. {if condition = "$groupId eq 3"}
  433. <br/><br/>
  434. 代理商分成收益<br/>
  435. <span>¥{$all.agent_recharge_benefit| default=0}</span>
  436. {/if}
  437. </div>
  438. </div>
  439. <div class="pannel-bottom">
  440. <div class="first">
  441. 普通充值<br/>
  442. <span>¥{$all.normal_recharge_money| default=0}</span><br/><br/>
  443. 已支付:{$all.normal_recharge_orders | default=0}笔<br/>
  444. {notempty name='all'}
  445. 未支付:{$all.normal_recharge_orders_count-$all.normal_recharge_orders}笔<br/>
  446. {else /}
  447. 未支付:0笔<br/>
  448. {/notempty}
  449. 完成率:<?php
  450. $percent = 0;
  451. if ($all['kandian_recharge_orders_count']) {
  452. $percent = floor($all['kandian_recharge_orders']/$all['kandian_recharge_orders_count']*100);
  453. } elseif ($all['normal_recharge_orders_count']) {
  454. $percent = floor($all['normal_recharge_orders']/$all['normal_recharge_orders_count']*100);
  455. } else {
  456. $percent = 0;
  457. }
  458. echo $percent;
  459. ?>%<br/>
  460. </div>
  461. <div class="second">
  462. 年费VIP会员<br/>
  463. <span>¥{$all.vip_recharge_money| default=0}</span><br/><br/>
  464. 已支付:{$all.vip_recharge_orders| default=0}笔<br/>
  465. {notempty name='all'}
  466. 未支付:{$all.vip_recharge_orders_count-$all.vip_recharge_orders}笔<br/>
  467. {else /}
  468. 未支付:0笔<br/>
  469. {/notempty}
  470. 完成率:<?php echo $all['vip_recharge_orders_count']? floor($all['vip_recharge_orders']/$all['vip_recharge_orders_count']*100) : 0;?>%<br/>
  471. </div>
  472. </div>
  473. </div>
  474. </div>
  475. <div class="day">近30日充值统计(<i class="text-danger">不含当日</i>)</div>
  476. <div style="overflow: auto;">
  477. <table id="table" class="table table-striped table-bordered table-hover" width="100%">
  478. </table>
  479. </div>
  480. </div>
  481. </div>
  482. </div>
  483. </div>
  484. </div>