dashboard.html 33 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579
  1. <!DOCTYPE html>
  2. <html lang="zh-cn">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>控制后台</title>
  6. <meta name="renderer" content="webkit">
  7. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  8. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  9. <link rel="stylesheet" href="/app/admin/component/pear/css/pear.css" />
  10. <link rel="stylesheet" href="/app/admin/demos/css/console1.css" />
  11. </head>
  12. <body class="pear-container">
  13. <div>
  14. <div class="layui-row layui-col-space10">
  15. <div class="layui-col-xs6 layui-col-md3">
  16. <div class="layui-card top-panel">
  17. <div class="layui-card-header">用户数</div>
  18. <div class="layui-card-body">
  19. <div class="layui-row layui-col-space5">
  20. <div class="layui-col-xs8 layui-col-md8 top-panel-number" style="color: #28333E;" id="value1">
  21. 0
  22. </div>
  23. <div class="layui-col-xs4 layui-col-md4 top-panel-tips">
  24. <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 1024 1024" width="200" height="200" t="1591462258798"
  25. p-id="942" version="1.1">
  26. <path fill="#fcc66f" d="M 262.7 835 c -15.3 0 -28.1 -11.4 -29.8 -26.6 L 174.1 291 c -0.6 -5.1 1 -10.2 4.5 -14 s 8.3 -6 13.4 -6 h 640 c 5.1 0 10 2.2 13.4 6 s 5 8.9 4.5 14 l -58.8 517.4 c -1.7 15.2 -14.5 26.6 -29.8 26.6 H 262.7 Z"
  27. p-id="943" />
  28. <path fill="#ffd79c" d="M 802 289 l -58.8 517.4 c -0.7 6.1 -5.8 10.6 -11.9 10.6 h 30 c 6.1 0 11.2 -4.6 11.9 -10.6 L 832 289 h -30 Z"
  29. p-id="944" />
  30. <path fill="#f56e73" d="M 164 307 c -16.5 0 -30 -13.5 -30 -30 v -58 c 0 -16.5 13.5 -30 30 -30 h 696 c 16.5 0 30 13.5 30 30 v 58 c 0 16.5 -13.5 30 -30 30 H 164 Z"
  31. p-id="945" />
  32. <path fill="#ffa1a8" d="M 860 207 h -30 c 6.6 0 12 5.4 12 12 v 58 c 0 6.6 -5.4 12 -12 12 h 30 c 6.6 0 12 -5.4 12 -12 v -58 c 0 -6.6 -5.4 -12 -12 -12 Z"
  33. p-id="946" />
  34. <path fill="#65c8ff" d="M 190.9 651.5 c -31.4 0 -56.9 -25.5 -56.9 -56.9 V 219 c 0 -16.5 13.5 -30 30 -30 h 466.2 c 9.9 0 18 8.1 18 18 v 301.1 c 0 34.7 -28.2 62.9 -62.9 62.9 s -62.9 -28.2 -62.9 -62.9 V 393.5 c 0 -23.2 -18.8 -42 -42 -42 s -42 18.8 -42 42 v 68.1 c 0 29.4 -23.9 53.4 -53.4 53.4 s -53.4 -23.9 -53.4 -53.4 v -68.1 c 0 -23.2 -18.8 -42 -42 -42 s -42 18.8 -42 42 v 201.1 c 0.1 31.4 -25.4 56.9 -56.7 56.9 Z"
  35. p-id="947" />
  36. <path fill="#b3eaff" d="M 277.8 321.5 c -33.1 0 -60 26.9 -60 60 v 201.1 c 0 21.5 -17.4 38.9 -38.9 38.9 c -7.7 0 -14.8 -2.2 -20.8 -6.1 c 6.9 10.9 19 18.1 32.8 18.1 c 21.5 0 38.9 -17.4 38.9 -38.9 V 393.5 c 0 -33.1 26.9 -60 60 -60 c 13.5 0 25.9 4.5 36 12 c -11 -14.5 -28.4 -24 -48 -24 Z M 618.3 207 v 289.1 c 0 24.8 -20.1 44.9 -44.9 44.9 c -9.3 0 -18 -2.8 -25.2 -7.7 c 8.1 11.9 21.7 19.7 37.2 19.7 c 24.8 0 44.9 -20.1 44.9 -44.9 V 207 h -12 Z M 468.5 321.5 c -33.1 0 -60 26.9 -60 60 v 68.1 c 0 19.5 -15.8 35.4 -35.4 35.4 c -6.7 0 -12.9 -1.9 -18.3 -5.1 c 6.2 10.2 17.4 17.1 30.3 17.1 c 19.5 0 35.4 -15.8 35.4 -35.4 v -68.1 c 0 -33.1 26.9 -60 60 -60 c 13.5 0 25.9 4.5 36 12 c -11 -14.5 -28.4 -24 -48 -24 Z"
  37. p-id="948" />
  38. <path fill="#453b56" d="M 698 729.4 m -18 0 a 18 18 0 1 0 36 0 a 18 18 0 1 0 -36 0 Z" p-id="949" />
  39. <path fill="#453b56" d="M 860 171 H 632.5 v 0.1 c -0.7 0 -1.5 -0.1 -2.2 -0.1 H 164 c -26.5 0 -48 21.5 -48 48 v 375.6 c 0 41.3 33.6 74.9 74.9 74.9 c 2.7 0 5.4 -0.2 8.1 -0.5 l 16 141.4 c 2.8 24.3 23.3 42.6 47.7 42.6 h 498.6 c 24.4 0 44.9 -18.3 47.7 -42.6 l 55.2 -485.6 c 24.5 -2.1 43.8 -22.7 43.8 -47.8 v -58 c 0 -26.5 -21.5 -48 -48 -48 Z M 190.9 633.5 c -21.5 0 -38.9 -17.4 -38.9 -38.9 V 219 c 0 -6.6 5.4 -12 12 -12 h 466.3 v 301.1 c 0 24.8 -20.1 44.9 -44.9 44.9 c -24.8 0 -44.9 -20.1 -44.9 -44.9 V 393.5 c 0 -33.1 -26.9 -60 -60 -60 s -60 26.9 -60 60 v 68.1 c 0 19.5 -15.8 35.4 -35.4 35.4 c -19.5 0 -35.4 -15.8 -35.4 -35.4 v -68.1 c 0 -33.1 -26.9 -60 -60 -60 s -60 26.9 -60 60 v 201.1 c 0.1 21.5 -17.4 38.9 -38.8 38.9 Z m 582.3 172.9 c -0.7 6.1 -5.8 10.6 -11.9 10.6 H 262.7 c -6.1 0 -11.2 -4.6 -11.9 -10.6 l -6.7 -59 h 396.6 c 9.9 0 18 -8.1 18 -18 s -8.1 -18 -18 -18 H 240 l -6.3 -55.4 c 19.3 -13.6 32.1 -36 32.1 -61.3 V 393.5 c 0 -13.2 10.8 -24 24 -24 s 24 10.8 24 24 v 68.1 c 0 39.4 32 71.4 71.4 71.4 s 71.4 -32 71.4 -71.4 v -68.1 c 0 -13.2 10.8 -24 24 -24 s 24 10.8 24 24 v 114.6 c 0 44.6 36.3 80.9 80.9 80.9 c 44.6 0 80.9 -36.3 80.9 -80.9 V 325 h 161.7 l -54.9 481.4 Z M 872 277 c 0 6.6 -5.4 12 -12 12 H 666.3 v -82 H 860 c 6.6 0 12 5.4 12 12 v 58 Z"
  40. p-id="950" /></svg>
  41. </div>
  42. </div>
  43. </div>
  44. </div>
  45. </div>
  46. <div class="layui-col-xs6 layui-col-md3">
  47. <div class="layui-card top-panel">
  48. <div class="layui-card-header">签到数</div>
  49. <div class="layui-card-body">
  50. <div class="layui-row layui-col-space5">
  51. <div class="layui-col-xs8 layui-col-md8 top-panel-number" style="color: #28333E;" id="value2">
  52. 0
  53. </div>
  54. <div class="layui-col-xs4 layui-col-md4 top-panel-tips">
  55. <svg t="1591462430908" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
  56. p-id="3170" width="200" height="200">
  57. <path d="M532 784.2c0 24.4-19.8 44.3-44.3 44.3s-44.3-19.8-44.3-44.3c0-24.4 44.3-80.3 44.3-80.3s44.3 55.8 44.3 80.3zM766 784.2c0 24.4 19.8 44.3 44.3 44.3 24.4 0 44.3-19.8 44.3-44.3 0-24.4-44.3-80.3-44.3-80.3S766 759.7 766 784.2z"
  58. fill="#97DCFF" p-id="3171"></path>
  59. <path d="M123.5 471.3c-9.9 0-18-8.1-18-18v-302c0-9.9 8.1-18 18-18h58c9.9 0 18 8.1 18 18v302c0 9.9-8.1 18-18 18h-58z"
  60. fill="#FCC66F" p-id="3172"></path>
  61. <path d="M181.5 151.3v302h-58v-302h58m0-36h-58c-19.9 0-36 16.1-36 36v302c0 19.9 16.1 36 36 36h58c19.9 0 36-16.1 36-36v-302c0-19.8-16.1-36-36-36z"
  62. fill="#453B56" p-id="3173"></path>
  63. <path d="M266.4 210.7m-18 0a18 18 0 1 0 36 0 18 18 0 1 0-36 0Z" fill="#453B56" p-id="3174"></path>
  64. <path d="M430.8 641.1c-9.9 0-18-8.1-18-18v-21.6c0-130.3 106-236.3 236.3-236.3s236.3 106 236.3 236.3v21.6c0 9.9-8.1 18-18 18H430.8z"
  65. fill="#FCC66F" p-id="3175"></path>
  66. <path d="M649 383.2c-5 0-10 0.2-15 0.6 113.5 7.7 203.3 102.2 203.3 217.7v21.6h30v-21.6c0-120.6-97.7-218.3-218.3-218.3z"
  67. fill="#FFD79C" p-id="3176"></path>
  68. <path d="M419.6 694.4c-22.1 0-40.1-18-40.1-40.1s18-40.1 40.1-40.1h458.8c22.1 0 40.1 18 40.1 40.1s-18 40.1-40.1 40.1H419.6z"
  69. fill="#F56E73" p-id="3177"></path>
  70. <path d="M878.4 632.3h-30c12.2 0 22.1 9.9 22.1 22.1s-9.9 22.1-22.1 22.1h30c12.2 0 22.1-9.9 22.1-22.1s-9.9-22.1-22.1-22.1z"
  71. fill="#FFA1A8" p-id="3178"></path>
  72. <path d="M693.3 846.4c0 24.4-19.8 44.3-44.3 44.3-24.4 0-44.3-19.8-44.3-44.3s44.3-80.3 44.3-80.3 44.3 55.9 44.3 80.3z"
  73. fill="#97DCFF" p-id="3179"></path>
  74. <path d="M649 908.7c-34.3 0-62.3-27.9-62.3-62.3 0-28.5 36.9-77.2 48.1-91.4 3.4-4.3 8.6-6.8 14.1-6.8s10.7 2.5 14.1 6.8c11.3 14.2 48.1 62.9 48.1 91.4 0.2 34.3-27.8 62.3-62.1 62.3z m0-112.3c-14.1 20.4-26.3 41.9-26.3 50 0 14.5 11.8 26.3 26.3 26.3s26.3-11.8 26.3-26.3c0-8.1-12.1-29.6-26.3-50z"
  75. fill="#453B56" p-id="3180"></path>
  76. <path d="M903.3 601.9v-0.5c0-134.1-104.4-244.3-236.3-253.6v-30.7c0-68.7-55.9-124.6-124.6-124.6H326.5c-9.9 0-18 8.1-18 18s8.1 18 18 18h215.9c48.8 0 88.6 39.7 88.6 88.6v30.7c-131.8 9.3-236.3 119.4-236.3 253.6v0.5c-19.6 9.3-33.2 29.3-33.2 52.4 0 32 26 58.1 58.1 58.1H459c-14.8 21-33.5 51.5-33.5 71.8 0 34.3 27.9 62.3 62.3 62.3 34.3 0 62.2-27.9 62.2-62.3 0-20.3-18.6-50.7-33.5-71.8h264.9c-14.8 21-33.5 51.5-33.5 71.8 0 34.3 27.9 62.3 62.3 62.3 34.3 0 62.3-27.9 62.3-62.3 0-20.3-18.6-50.7-33.5-71.8h39.4c32 0 58.1-26 58.1-58.1 0-23.1-13.6-43-33.2-52.4zM487.8 810.4c-14.5 0-26.3-11.8-26.3-26.3 0-8.1 12.1-29.6 26.3-50 14.1 20.4 26.2 41.9 26.2 50 0 14.5-11.8 26.3-26.2 26.3z m322.5 0c-14.5 0-26.3-11.8-26.3-26.3 0-8.1 12.1-29.6 26.3-50 14.1 20.4 26.3 41.9 26.3 50-0.1 14.5-11.9 26.3-26.3 26.3zM649 383.2c118.8 0 215.4 94.9 218.1 213.1H430.9c2.8-118.1 99.3-213.1 218.1-213.1z m251.5 271.1c0 12.2-9.9 22.1-22.1 22.1H419.6c-12.2 0-22.1-9.9-22.1-22.1 0-12.2 9.9-22.1 22.1-22.1h458.8c12.2 0.1 22.1 10 22.1 22.1z"
  77. fill="#453B56" p-id="3181"></path>
  78. </svg>
  79. </div>
  80. </div>
  81. </div>
  82. </div>
  83. </div>
  84. <div class="layui-col-xs6 layui-col-md3">
  85. <div class="layui-card top-panel">
  86. <div class="layui-card-header">在线数</div>
  87. <div class="layui-card-body">
  88. <div class="layui-row layui-col-space5">
  89. <div class="layui-col-xs8 layui-col-md8 top-panel-number" style="color: #28333E;" id="value3">
  90. 0
  91. </div>
  92. <div class="layui-col-xs4 layui-col-md4 top-panel-tips">
  93. <svg t="1591462464512" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
  94. p-id="3311" width="200" height="200">
  95. <path d="M750.4 216.5h-130v-15.3c0-32.9-26.8-59.7-59.7-59.7h-97.3c-32.9 0-59.7 26.8-59.7 59.7v15.3h-130c-30.7 0-55.6 25-55.6 55.6v72.4c0 9.9 8.1 18 18 18h31.5v478c0 23.2 18.8 42 42 42h405c23.2 0 42-18.8 42-42v-478H788c9.9 0 18-8.1 18-18v-72.4c0-30.6-25-55.6-55.6-55.6z"
  96. fill="#FCC66F" p-id="3312"></path>
  97. <path d="M708.5 344.5v496c0 13.3-10.7 24-24 24h30c13.3 0 24-10.7 24-24v-496h-30z" fill="#FFD79C" p-id="3313"></path>
  98. <path d="M309.5 882.5c-23.2 0-42-18.8-42-42V596c0-9.9 8.1-18 18-18h36.8c30.2 0 54.8 24.6 54.8 54.8v231.7c0 9.9-8.1 18-18 18h-49.6zM664.9 882.5c-9.9 0-18-8.1-18-18V632.8c0-30.2 24.6-54.8 54.8-54.8h36.8c9.9 0 18 8.1 18 18v244.5c0 23.2-18.8 42-42 42h-49.6z"
  99. fill="#F56E73" p-id="3314"></path>
  100. <path d="M708.5 596v244.5c0 13.3-10.7 24-24 24h30c13.3 0 24-10.7 24-24V596h-30z" fill="#FFA1A8" p-id="3315"></path>
  101. <path d="M475.2 882.5c-9.9 0-18-8.1-18-18V632.8c0-30.2 24.6-54.8 54.8-54.8 30.2 0 54.8 24.6 54.8 54.8v231.7c0 9.9-8.1 18-18 18h-73.6z"
  102. fill="#F56E73" p-id="3316"></path>
  103. <path d="M560.7 159.5h-18c23 0 41.7 18.7 41.7 41.7V221h18v-19.8c-0.1-23-18.7-41.7-41.7-41.7zM750.4 234.5h-30c20.8 0 37.6 16.8 37.6 37.6v72.4h30v-72.4c0-20.8-16.8-37.6-37.6-37.6z"
  104. fill="#FFD79C" p-id="3317"></path>
  105. <path d="M750.4 198.5H638.2c-1.4-41.6-35.6-75-77.5-75h-97.3c-41.9 0-76.1 33.4-77.5 75H273.6c-40.6 0-73.6 33-73.6 73.6v72.4c0 19.9 16.1 36 36 36h13.5v460c0 33.1 26.9 60 60 60H714.7c33.1 0 60-26.9 60-60v-460H788c19.9 0 36-16.1 36-36v-72.4c0-40.6-33-73.6-73.6-73.6z m-287.1-39h97.3c22.1 0 40.2 17.2 41.5 39H421.8c1.4-21.8 19.4-39 41.5-39z m-104.2 705h-49.6c-13.3 0-24-10.7-24-24V596h36.8c20.3 0 36.8 16.5 36.8 36.8v231.7z m189.7 0h-73.6V632.8c0-20.3 16.5-36.8 36.8-36.8 20.3 0 36.8 16.5 36.8 36.8v231.7z m189.7-24c0 13.3-10.7 24-24 24h-49.6V632.8c0-20.3 16.5-36.8 36.8-36.8h36.8v244.5z m0-280.5h-36.8c-40.1 0-72.8 32.6-72.8 72.8v231.7h-44.2V632.8c0-40.1-32.6-72.8-72.8-72.8-40.1 0-72.8 32.6-72.8 72.8v231.7h-44.2V632.8c0-40.1-32.6-72.8-72.8-72.8h-36.8v-74.5h279c9.9 0 18-8.1 18-18s-8.1-18-18-18h-279v-69h453V560zM788 344.5H236v-72.4c0-20.8 16.8-37.6 37.6-37.6h476.8c20.8 0 37.6 16.8 37.6 37.6v72.4z"
  106. fill="#453B56" p-id="3318"></path>
  107. <path d="M621.8 467.5m-18 0a18 18 0 1 0 36 0 18 18 0 1 0-36 0Z" fill="#453B56" p-id="3319"></path>
  108. </svg>
  109. </div>
  110. </div>
  111. </div>
  112. </div>
  113. </div>
  114. <div class="layui-col-xs6 layui-col-md3">
  115. <div class="layui-card top-panel">
  116. <div class="layui-card-header">今日注册人数</div>
  117. <div class="layui-card-body">
  118. <div class="layui-row layui-col-space5">
  119. <div class="layui-col-xs8 layui-col-md8 top-panel-number" style="color: #28333E;" id="value11">
  120. 0
  121. </div>
  122. <div class="layui-col-xs4 layui-col-md4 top-panel-tips">
  123. <svg t="1591462464512" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
  124. p-id="3311" width="200" height="200">
  125. <path d="M750.4 216.5h-130v-15.3c0-32.9-26.8-59.7-59.7-59.7h-97.3c-32.9 0-59.7 26.8-59.7 59.7v15.3h-130c-30.7 0-55.6 25-55.6 55.6v72.4c0 9.9 8.1 18 18 18h31.5v478c0 23.2 18.8 42 42 42h405c23.2 0 42-18.8 42-42v-478H788c9.9 0 18-8.1 18-18v-72.4c0-30.6-25-55.6-55.6-55.6z"
  126. fill="#FCC66F" p-id="3312"></path>
  127. <path d="M708.5 344.5v496c0 13.3-10.7 24-24 24h30c13.3 0 24-10.7 24-24v-496h-30z" fill="#FFD79C" p-id="3313"></path>
  128. <path d="M309.5 882.5c-23.2 0-42-18.8-42-42V596c0-9.9 8.1-18 18-18h36.8c30.2 0 54.8 24.6 54.8 54.8v231.7c0 9.9-8.1 18-18 18h-49.6zM664.9 882.5c-9.9 0-18-8.1-18-18V632.8c0-30.2 24.6-54.8 54.8-54.8h36.8c9.9 0 18 8.1 18 18v244.5c0 23.2-18.8 42-42 42h-49.6z"
  129. fill="#F56E73" p-id="3314"></path>
  130. <path d="M708.5 596v244.5c0 13.3-10.7 24-24 24h30c13.3 0 24-10.7 24-24V596h-30z" fill="#FFA1A8" p-id="3315"></path>
  131. <path d="M475.2 882.5c-9.9 0-18-8.1-18-18V632.8c0-30.2 24.6-54.8 54.8-54.8 30.2 0 54.8 24.6 54.8 54.8v231.7c0 9.9-8.1 18-18 18h-73.6z"
  132. fill="#F56E73" p-id="3316"></path>
  133. <path d="M560.7 159.5h-18c23 0 41.7 18.7 41.7 41.7V221h18v-19.8c-0.1-23-18.7-41.7-41.7-41.7zM750.4 234.5h-30c20.8 0 37.6 16.8 37.6 37.6v72.4h30v-72.4c0-20.8-16.8-37.6-37.6-37.6z"
  134. fill="#FFD79C" p-id="3317"></path>
  135. <path d="M750.4 198.5H638.2c-1.4-41.6-35.6-75-77.5-75h-97.3c-41.9 0-76.1 33.4-77.5 75H273.6c-40.6 0-73.6 33-73.6 73.6v72.4c0 19.9 16.1 36 36 36h13.5v460c0 33.1 26.9 60 60 60H714.7c33.1 0 60-26.9 60-60v-460H788c19.9 0 36-16.1 36-36v-72.4c0-40.6-33-73.6-73.6-73.6z m-287.1-39h97.3c22.1 0 40.2 17.2 41.5 39H421.8c1.4-21.8 19.4-39 41.5-39z m-104.2 705h-49.6c-13.3 0-24-10.7-24-24V596h36.8c20.3 0 36.8 16.5 36.8 36.8v231.7z m189.7 0h-73.6V632.8c0-20.3 16.5-36.8 36.8-36.8 20.3 0 36.8 16.5 36.8 36.8v231.7z m189.7-24c0 13.3-10.7 24-24 24h-49.6V632.8c0-20.3 16.5-36.8 36.8-36.8h36.8v244.5z m0-280.5h-36.8c-40.1 0-72.8 32.6-72.8 72.8v231.7h-44.2V632.8c0-40.1-32.6-72.8-72.8-72.8-40.1 0-72.8 32.6-72.8 72.8v231.7h-44.2V632.8c0-40.1-32.6-72.8-72.8-72.8h-36.8v-74.5h279c9.9 0 18-8.1 18-18s-8.1-18-18-18h-279v-69h453V560zM788 344.5H236v-72.4c0-20.8 16.8-37.6 37.6-37.6h476.8c20.8 0 37.6 16.8 37.6 37.6v72.4z"
  136. fill="#453B56" p-id="3318"></path>
  137. <path d="M621.8 467.5m-18 0a18 18 0 1 0 36 0 18 18 0 1 0-36 0Z" fill="#453B56" p-id="3319"></path>
  138. </svg>
  139. </div>
  140. </div>
  141. </div>
  142. </div>
  143. </div>
  144. <div class="layui-col-xs6 layui-col-md3">
  145. <div class="layui-card top-panel">
  146. <div class="layui-card-header">总收益</div>
  147. <div class="layui-card-body">
  148. <div class="layui-row layui-col-space5">
  149. <div class="layui-col-xs8 layui-col-md8 top-panel-number" style="color: #28333E;" id="value4">
  150. 0
  151. </div>
  152. <div class="layui-col-xs4 layui-col-md4 top-panel-tips">
  153. <svg t="1591462491887" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
  154. p-id="3449" width="200" height="200">
  155. <path d="M363.2 807c-9.9 0-18-8.1-18-18v-75.5c0-9.9 8.1-18 18-18h108.5c9.9 0 18 8.1 18 18V789c0 9.9-8.1 18-18 18H363.2z"
  156. fill="#F56E73" p-id="3450"></path>
  157. <path d="M441.7 713.5h30V789h-30z" fill="#FFA1A8" p-id="3451"></path>
  158. <path d="M259.6 398c-9.9 0-18-8.1-18-18V178.6c0-23.8 19.3-43.1 43.1-43.1s43.1 19.3 43.1 43.1V380c0 9.9-8.1 18-18 18h-50.2zM525.1 398c-9.9 0-18-8.1-18-18V178.6c0-23.8 19.3-43.1 43.1-43.1s43.1 19.3 43.1 43.1V380c0 9.9-8.1 18-18 18h-50.2z"
  159. fill="#65C8FF" p-id="3452"></path>
  160. <path d="M550.2 153.5c-3.2 0-6.2 0.7-9 1.7 9.4 3.6 16.1 12.7 16.1 23.4V380h18V178.6c0.1-13.9-11.2-25.1-25.1-25.1z"
  161. fill="#97DCFF" p-id="3453"></path>
  162. <path d="M686 330.5H149c-9.9 0-18 8.1-18 18v63c0 9.9 8.1 18 18 18h33.2l45 225c8.7 43.4 47.1 75 91.4 75h197.6c44.3 0 82.7-31.5 91.4-75l45-225H686c9.9 0 18-8.1 18-18v-63c0-9.9-8.1-18-18-18z"
  163. fill="#FCC66F" p-id="3454"></path>
  164. <path d="M608 411.5L560.1 651c-7 35.2-37.9 60.5-73.8 60.5h30c35.9 0 66.7-25.3 73.8-60.5L638 411.5h-30zM656 348.5h30v63h-30z"
  165. fill="#FFD79C" p-id="3455"></path>
  166. <path d="M474.2 543.5m-18 0a18 18 0 1 0 36 0 18 18 0 1 0-36 0Z" fill="#453B56" p-id="3456"></path>
  167. <path d="M416.9 525.5h-125c-9.9 0-18 8.1-18 18s8.1 18 18 18h125c9.9 0 18-8.1 18-18s-8.1-18-18-18zM893 543.5h-33.4c-65.2 0-118.2 53-118.2 118.2v19.6c0 9.9 8.1 18 18 18s18-8.1 18-18v-19.6c0-45.3 36.9-82.2 82.2-82.2H893c9.9 0 18-8.1 18-18s-8-18-18-18zM772.2 744.2c7-7 7-18.4 0-25.5-7-7-18.4-7-25.5 0s-7 18.4 0 25.5 18.4 7.1 25.5 0z"
  168. fill="#453B56" p-id="3457"></path>
  169. <path d="M759.5 761.6c-9.9 0-18 8.1-18 18v11.6c0 43.7-35.6 79.3-79.3 79.3H487.3c-26.4 0-48.3-19.9-51.4-45.5h35.8c19.9 0 36-16.1 36-36v-41.5h8.6c52.8 0 98.7-37.6 109.1-89.4l42.1-210.6H686c19.9 0 36-16.1 36-36v-63c0-19.9-16.1-36-36-36h-74.6V178.6c0-33.7-27.4-61.1-61.1-61.1s-61.1 27.4-61.1 61.1v133.9H345.9V178.6c0-33.7-27.4-61.1-61.1-61.1s-61.1 27.4-61.1 61.1v133.9H149c-19.9 0-36 16.1-36 36v63c0 19.9 16.1 36 36 36h18.5l42.1 210.6c10.4 51.8 56.2 89.4 109.1 89.4h8.6V789c0 19.9 16.1 36 36 36h36.6c3.3 45.5 41.2 81.5 87.5 81.5h174.8c63.6 0 115.3-51.7 115.3-115.3v-11.6c0-10-8.1-18-18-18z m-234.4-583c0-13.9 11.2-25.1 25.1-25.1s25.1 11.2 25.1 25.1v133.9H525V178.6z m-265.5 0c0-13.9 11.2-25.1 25.1-25.1s25.1 11.2 25.1 25.1v133.9h-50.3V178.6zM149 411.5v-63h537v63H149z m169.7 300c-35.9 0-66.7-25.3-73.8-60.5l-40.7-203.5h426.6L590.1 651c-7 35.2-37.9 60.5-73.8 60.5H318.7z m44.5 77.5v-41.5h108.5V789H363.2z"
  170. fill="#453B56" p-id="3458"></path>
  171. </svg>
  172. </div>
  173. </div>
  174. </div>
  175. </div>
  176. </div>
  177. </div>
  178. <div class="layui-row layui-col-space10">
  179. <div class="layui-col-md9">
  180. <div class="layui-card">
  181. <div class="layui-card-body">
  182. <div class="layui-tab custom-tab layui-tab-brief" lay-filter="docDemoTabBrief">
  183. <div id="echarts-records" style="background-color:#ffffff;min-height:400px;"></div>
  184. </div>
  185. </div>
  186. </div>
  187. </div>
  188. <div class="layui-col-xs6 layui-col-md3">
  189. <div class="layui-card top-panel">
  190. <div class="layui-card-header">新增购买人数</div>
  191. <div class="layui-card-body">
  192. <div class="layui-row layui-col-space5">
  193. <div class="layui-col-xs8 layui-col-md8 top-panel-number" style="color: #28333E;" id="value5">
  194. 0
  195. </div>
  196. <div class="layui-col-xs4 layui-col-md4 top-panel-tips">
  197. <svg t="1591462491887" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
  198. p-id="3449" width="200" height="200">
  199. <path d="M363.2 807c-9.9 0-18-8.1-18-18v-75.5c0-9.9 8.1-18 18-18h108.5c9.9 0 18 8.1 18 18V789c0 9.9-8.1 18-18 18H363.2z"
  200. fill="#F56E73" p-id="3450"></path>
  201. <path d="M441.7 713.5h30V789h-30z" fill="#FFA1A8" p-id="3451"></path>
  202. <path d="M259.6 398c-9.9 0-18-8.1-18-18V178.6c0-23.8 19.3-43.1 43.1-43.1s43.1 19.3 43.1 43.1V380c0 9.9-8.1 18-18 18h-50.2zM525.1 398c-9.9 0-18-8.1-18-18V178.6c0-23.8 19.3-43.1 43.1-43.1s43.1 19.3 43.1 43.1V380c0 9.9-8.1 18-18 18h-50.2z"
  203. fill="#65C8FF" p-id="3452"></path>
  204. <path d="M550.2 153.5c-3.2 0-6.2 0.7-9 1.7 9.4 3.6 16.1 12.7 16.1 23.4V380h18V178.6c0.1-13.9-11.2-25.1-25.1-25.1z"
  205. fill="#97DCFF" p-id="3453"></path>
  206. <path d="M686 330.5H149c-9.9 0-18 8.1-18 18v63c0 9.9 8.1 18 18 18h33.2l45 225c8.7 43.4 47.1 75 91.4 75h197.6c44.3 0 82.7-31.5 91.4-75l45-225H686c9.9 0 18-8.1 18-18v-63c0-9.9-8.1-18-18-18z"
  207. fill="#FCC66F" p-id="3454"></path>
  208. <path d="M608 411.5L560.1 651c-7 35.2-37.9 60.5-73.8 60.5h30c35.9 0 66.7-25.3 73.8-60.5L638 411.5h-30zM656 348.5h30v63h-30z"
  209. fill="#FFD79C" p-id="3455"></path>
  210. <path d="M474.2 543.5m-18 0a18 18 0 1 0 36 0 18 18 0 1 0-36 0Z" fill="#453B56" p-id="3456"></path>
  211. <path d="M416.9 525.5h-125c-9.9 0-18 8.1-18 18s8.1 18 18 18h125c9.9 0 18-8.1 18-18s-8.1-18-18-18zM893 543.5h-33.4c-65.2 0-118.2 53-118.2 118.2v19.6c0 9.9 8.1 18 18 18s18-8.1 18-18v-19.6c0-45.3 36.9-82.2 82.2-82.2H893c9.9 0 18-8.1 18-18s-8-18-18-18zM772.2 744.2c7-7 7-18.4 0-25.5-7-7-18.4-7-25.5 0s-7 18.4 0 25.5 18.4 7.1 25.5 0z"
  212. fill="#453B56" p-id="3457"></path>
  213. <path d="M759.5 761.6c-9.9 0-18 8.1-18 18v11.6c0 43.7-35.6 79.3-79.3 79.3H487.3c-26.4 0-48.3-19.9-51.4-45.5h35.8c19.9 0 36-16.1 36-36v-41.5h8.6c52.8 0 98.7-37.6 109.1-89.4l42.1-210.6H686c19.9 0 36-16.1 36-36v-63c0-19.9-16.1-36-36-36h-74.6V178.6c0-33.7-27.4-61.1-61.1-61.1s-61.1 27.4-61.1 61.1v133.9H345.9V178.6c0-33.7-27.4-61.1-61.1-61.1s-61.1 27.4-61.1 61.1v133.9H149c-19.9 0-36 16.1-36 36v63c0 19.9 16.1 36 36 36h18.5l42.1 210.6c10.4 51.8 56.2 89.4 109.1 89.4h8.6V789c0 19.9 16.1 36 36 36h36.6c3.3 45.5 41.2 81.5 87.5 81.5h174.8c63.6 0 115.3-51.7 115.3-115.3v-11.6c0-10-8.1-18-18-18z m-234.4-583c0-13.9 11.2-25.1 25.1-25.1s25.1 11.2 25.1 25.1v133.9H525V178.6z m-265.5 0c0-13.9 11.2-25.1 25.1-25.1s25.1 11.2 25.1 25.1v133.9h-50.3V178.6zM149 411.5v-63h537v63H149z m169.7 300c-35.9 0-66.7-25.3-73.8-60.5l-40.7-203.5h426.6L590.1 651c-7 35.2-37.9 60.5-73.8 60.5H318.7z m44.5 77.5v-41.5h108.5V789H363.2z"
  214. fill="#453B56" p-id="3458"></path>
  215. </svg>
  216. </div>
  217. </div>
  218. </div>
  219. </div>
  220. </div>
  221. <div class="layui-col-xs6 layui-col-md3">
  222. <div class="layui-card top-panel">
  223. <div class="layui-card-header">购买总人数</div>
  224. <div class="layui-card-body">
  225. <div class="layui-row layui-col-space5">
  226. <div class="layui-col-xs8 layui-col-md8 top-panel-number" style="color: #28333E;" id="value6">
  227. 0
  228. </div>
  229. <div class="layui-col-xs4 layui-col-md4 top-panel-tips">
  230. <svg t="1591462491887" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
  231. p-id="3449" width="200" height="200">
  232. <path d="M363.2 807c-9.9 0-18-8.1-18-18v-75.5c0-9.9 8.1-18 18-18h108.5c9.9 0 18 8.1 18 18V789c0 9.9-8.1 18-18 18H363.2z"
  233. fill="#F56E73" p-id="3450"></path>
  234. <path d="M441.7 713.5h30V789h-30z" fill="#FFA1A8" p-id="3451"></path>
  235. <path d="M259.6 398c-9.9 0-18-8.1-18-18V178.6c0-23.8 19.3-43.1 43.1-43.1s43.1 19.3 43.1 43.1V380c0 9.9-8.1 18-18 18h-50.2zM525.1 398c-9.9 0-18-8.1-18-18V178.6c0-23.8 19.3-43.1 43.1-43.1s43.1 19.3 43.1 43.1V380c0 9.9-8.1 18-18 18h-50.2z"
  236. fill="#65C8FF" p-id="3452"></path>
  237. <path d="M550.2 153.5c-3.2 0-6.2 0.7-9 1.7 9.4 3.6 16.1 12.7 16.1 23.4V380h18V178.6c0.1-13.9-11.2-25.1-25.1-25.1z"
  238. fill="#97DCFF" p-id="3453"></path>
  239. <path d="M686 330.5H149c-9.9 0-18 8.1-18 18v63c0 9.9 8.1 18 18 18h33.2l45 225c8.7 43.4 47.1 75 91.4 75h197.6c44.3 0 82.7-31.5 91.4-75l45-225H686c9.9 0 18-8.1 18-18v-63c0-9.9-8.1-18-18-18z"
  240. fill="#FCC66F" p-id="3454"></path>
  241. <path d="M608 411.5L560.1 651c-7 35.2-37.9 60.5-73.8 60.5h30c35.9 0 66.7-25.3 73.8-60.5L638 411.5h-30zM656 348.5h30v63h-30z"
  242. fill="#FFD79C" p-id="3455"></path>
  243. <path d="M474.2 543.5m-18 0a18 18 0 1 0 36 0 18 18 0 1 0-36 0Z" fill="#453B56" p-id="3456"></path>
  244. <path d="M416.9 525.5h-125c-9.9 0-18 8.1-18 18s8.1 18 18 18h125c9.9 0 18-8.1 18-18s-8.1-18-18-18zM893 543.5h-33.4c-65.2 0-118.2 53-118.2 118.2v19.6c0 9.9 8.1 18 18 18s18-8.1 18-18v-19.6c0-45.3 36.9-82.2 82.2-82.2H893c9.9 0 18-8.1 18-18s-8-18-18-18zM772.2 744.2c7-7 7-18.4 0-25.5-7-7-18.4-7-25.5 0s-7 18.4 0 25.5 18.4 7.1 25.5 0z"
  245. fill="#453B56" p-id="3457"></path>
  246. <path d="M759.5 761.6c-9.9 0-18 8.1-18 18v11.6c0 43.7-35.6 79.3-79.3 79.3H487.3c-26.4 0-48.3-19.9-51.4-45.5h35.8c19.9 0 36-16.1 36-36v-41.5h8.6c52.8 0 98.7-37.6 109.1-89.4l42.1-210.6H686c19.9 0 36-16.1 36-36v-63c0-19.9-16.1-36-36-36h-74.6V178.6c0-33.7-27.4-61.1-61.1-61.1s-61.1 27.4-61.1 61.1v133.9H345.9V178.6c0-33.7-27.4-61.1-61.1-61.1s-61.1 27.4-61.1 61.1v133.9H149c-19.9 0-36 16.1-36 36v63c0 19.9 16.1 36 36 36h18.5l42.1 210.6c10.4 51.8 56.2 89.4 109.1 89.4h8.6V789c0 19.9 16.1 36 36 36h36.6c3.3 45.5 41.2 81.5 87.5 81.5h174.8c63.6 0 115.3-51.7 115.3-115.3v-11.6c0-10-8.1-18-18-18z m-234.4-583c0-13.9 11.2-25.1 25.1-25.1s25.1 11.2 25.1 25.1v133.9H525V178.6z m-265.5 0c0-13.9 11.2-25.1 25.1-25.1s25.1 11.2 25.1 25.1v133.9h-50.3V178.6zM149 411.5v-63h537v63H149z m169.7 300c-35.9 0-66.7-25.3-73.8-60.5l-40.7-203.5h426.6L590.1 651c-7 35.2-37.9 60.5-73.8 60.5H318.7z m44.5 77.5v-41.5h108.5V789H363.2z"
  247. fill="#453B56" p-id="3458"></path>
  248. </svg>
  249. </div>
  250. </div>
  251. </div>
  252. </div>
  253. </div>
  254. <div class="layui-col-xs6 layui-col-md3">
  255. <div class="layui-card top-panel">
  256. <div class="layui-card-header">APP用户</div>
  257. <div class="layui-card-body">
  258. <div class="layui-row layui-col-space5">
  259. <div class="layui-col-xs8 layui-col-md8 top-panel-number" style="color: #28333E;" id="value10">
  260. 0
  261. </div>
  262. <div class="layui-col-xs4 layui-col-md4 top-panel-tips">
  263. <svg t="1591462491887" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
  264. p-id="3449" width="200" height="200">
  265. <path d="M363.2 807c-9.9 0-18-8.1-18-18v-75.5c0-9.9 8.1-18 18-18h108.5c9.9 0 18 8.1 18 18V789c0 9.9-8.1 18-18 18H363.2z"
  266. fill="#F56E73" p-id="3450"></path>
  267. <path d="M441.7 713.5h30V789h-30z" fill="#FFA1A8" p-id="3451"></path>
  268. <path d="M259.6 398c-9.9 0-18-8.1-18-18V178.6c0-23.8 19.3-43.1 43.1-43.1s43.1 19.3 43.1 43.1V380c0 9.9-8.1 18-18 18h-50.2zM525.1 398c-9.9 0-18-8.1-18-18V178.6c0-23.8 19.3-43.1 43.1-43.1s43.1 19.3 43.1 43.1V380c0 9.9-8.1 18-18 18h-50.2z"
  269. fill="#65C8FF" p-id="3452"></path>
  270. <path d="M550.2 153.5c-3.2 0-6.2 0.7-9 1.7 9.4 3.6 16.1 12.7 16.1 23.4V380h18V178.6c0.1-13.9-11.2-25.1-25.1-25.1z"
  271. fill="#97DCFF" p-id="3453"></path>
  272. <path d="M686 330.5H149c-9.9 0-18 8.1-18 18v63c0 9.9 8.1 18 18 18h33.2l45 225c8.7 43.4 47.1 75 91.4 75h197.6c44.3 0 82.7-31.5 91.4-75l45-225H686c9.9 0 18-8.1 18-18v-63c0-9.9-8.1-18-18-18z"
  273. fill="#FCC66F" p-id="3454"></path>
  274. <path d="M608 411.5L560.1 651c-7 35.2-37.9 60.5-73.8 60.5h30c35.9 0 66.7-25.3 73.8-60.5L638 411.5h-30zM656 348.5h30v63h-30z"
  275. fill="#FFD79C" p-id="3455"></path>
  276. <path d="M474.2 543.5m-18 0a18 18 0 1 0 36 0 18 18 0 1 0-36 0Z" fill="#453B56" p-id="3456"></path>
  277. <path d="M416.9 525.5h-125c-9.9 0-18 8.1-18 18s8.1 18 18 18h125c9.9 0 18-8.1 18-18s-8.1-18-18-18zM893 543.5h-33.4c-65.2 0-118.2 53-118.2 118.2v19.6c0 9.9 8.1 18 18 18s18-8.1 18-18v-19.6c0-45.3 36.9-82.2 82.2-82.2H893c9.9 0 18-8.1 18-18s-8-18-18-18zM772.2 744.2c7-7 7-18.4 0-25.5-7-7-18.4-7-25.5 0s-7 18.4 0 25.5 18.4 7.1 25.5 0z"
  278. fill="#453B56" p-id="3457"></path>
  279. <path d="M759.5 761.6c-9.9 0-18 8.1-18 18v11.6c0 43.7-35.6 79.3-79.3 79.3H487.3c-26.4 0-48.3-19.9-51.4-45.5h35.8c19.9 0 36-16.1 36-36v-41.5h8.6c52.8 0 98.7-37.6 109.1-89.4l42.1-210.6H686c19.9 0 36-16.1 36-36v-63c0-19.9-16.1-36-36-36h-74.6V178.6c0-33.7-27.4-61.1-61.1-61.1s-61.1 27.4-61.1 61.1v133.9H345.9V178.6c0-33.7-27.4-61.1-61.1-61.1s-61.1 27.4-61.1 61.1v133.9H149c-19.9 0-36 16.1-36 36v63c0 19.9 16.1 36 36 36h18.5l42.1 210.6c10.4 51.8 56.2 89.4 109.1 89.4h8.6V789c0 19.9 16.1 36 36 36h36.6c3.3 45.5 41.2 81.5 87.5 81.5h174.8c63.6 0 115.3-51.7 115.3-115.3v-11.6c0-10-8.1-18-18-18z m-234.4-583c0-13.9 11.2-25.1 25.1-25.1s25.1 11.2 25.1 25.1v133.9H525V178.6z m-265.5 0c0-13.9 11.2-25.1 25.1-25.1s25.1 11.2 25.1 25.1v133.9h-50.3V178.6zM149 411.5v-63h537v63H149z m169.7 300c-35.9 0-66.7-25.3-73.8-60.5l-40.7-203.5h426.6L590.1 651c-7 35.2-37.9 60.5-73.8 60.5H318.7z m44.5 77.5v-41.5h108.5V789H363.2z"
  280. fill="#453B56" p-id="3458"></path>
  281. </svg>
  282. </div>
  283. </div>
  284. </div>
  285. </div>
  286. </div>
  287. </div>
  288. <!--</div>-->
  289. <script src="/app/admin/component/layui/layui.js?v=2.8.12"></script>
  290. <script src="/app/admin/component/pear/pear.js"></script>
  291. <script>
  292. layui.use(['layer', 'echarts', 'element', 'count'], function() {
  293. var $ = layui.jquery,
  294. layer = layui.layer,
  295. element = layui.element,
  296. count = layui.count,
  297. echarts = layui.echarts;
  298. count.up("value1", {
  299. time: 4000,
  300. num: <?=$user_count?>,
  301. bit: 0,
  302. regulator: 50
  303. })
  304. count.up("value2", {
  305. time: 4000,
  306. num: <?=$day7_user_count?>,
  307. bit: 0,
  308. regulator: 50
  309. })
  310. count.up("value3", {
  311. time: 4000,
  312. num: <?=$today_user_count?>,
  313. bit: 0,
  314. regulator: 50
  315. })
  316. count.up("value4", {
  317. time: 4000,
  318. bit: 0,
  319. num: <?=$day30_user_count?>,
  320. regulator: 50
  321. })
  322. count.up("value5", {
  323. time: 4000,
  324. bit: 0,
  325. num: <?=$numDya?>,
  326. regulator: 50
  327. })
  328. count.up("value6", {
  329. time: 4000,
  330. bit: 0,
  331. num: <?=$tal_num?>,
  332. regulator: 50
  333. })
  334. count.up("value10", {
  335. time: 4000,
  336. bit: 0,
  337. num: <?=$app?>,
  338. regulator: 50
  339. })
  340. count.up("value11", {
  341. time: 4000,
  342. bit: 0,
  343. num: <?=$register_num?>,
  344. regulator: 50
  345. })
  346. var echartData='';
  347. $.ajax({
  348. url: '/app/admin/index/dashboard',
  349. dataType: "json",
  350. type: "post",
  351. async: false,
  352. success: function(res) {
  353. echartData=res.data;
  354. }
  355. })
  356. console.log(echartData);
  357. var echartsRecords = echarts.init(document.getElementById('echarts-records'), 'walden');
  358. let bgColor = "#fff";
  359. let color = [
  360. "#0090FF",
  361. "#36CE9E",
  362. "#FFC005",
  363. "#FF515A",
  364. "#8B5CFF",
  365. "#00CA69"
  366. ];
  367. let xAxisData = echartData.map(v => v.name);
  368. //  ["1", "2", "3", "4", "5", "6", "7", "8"]
  369. let yAxisData1 = echartData.map(v => v.value1);
  370. // [100, 138, 350, 173, 180, 150, 180, 230]
  371. let yAxisData2 = echartData.map(v => v.value2);
  372. // [233, 233, 200, 180, 199, 233, 210, 180]
  373. const hexToRgba = (hex, opacity) => {
  374. let rgbaColor = "";
  375. let reg = /^#[\da-f]{6}$/i;
  376. if (reg.test(hex)) {
  377. rgbaColor =
  378. `rgba(${parseInt("0x" + hex.slice(1, 3))},${parseInt(
  379. "0x" + hex.slice(3, 5)
  380. )},${parseInt("0x" + hex.slice(5, 7))},${opacity})`;
  381. }
  382. return rgbaColor;
  383. }
  384. option = {
  385. backgroundColor: bgColor,
  386. color: color,
  387. legend: {
  388. right: 10,
  389. top: 10
  390. },
  391. tooltip: {
  392. trigger: "axis",
  393. formatter: function(params) {
  394. let html = '';
  395. params.forEach(v => {
  396. console.log(v)
  397. html +=
  398. `<div style="color: #666;font-size: 14px;line-height: 24px">
  399. <span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:${color[v.componentIndex]};"></span>
  400. ${v.seriesName}.${v.name}
  401. <span style="color:${color[v.componentIndex]};font-weight:700;font-size: 18px">${v.value}</span>
  402. 元`;
  403. })
  404. return html
  405. },
  406. extraCssText: 'background: #fff; border-radius: 0;box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);color: #333;',
  407. axisPointer: {
  408. type: 'shadow',
  409. shadowStyle: {
  410. color: '#ffffff',
  411. shadowColor: 'rgba(225,225,225,1)',
  412. shadowBlur: 5
  413. }
  414. }
  415. },
  416. grid: {
  417. top: 100,
  418. containLabel: true
  419. },
  420. xAxis: [{
  421. type: "category",
  422. boundaryGap: false,
  423. axisLabel: {
  424. formatter: '{value}',
  425. textStyle: {
  426. color: "#333"
  427. }
  428. },
  429. axisLine: {
  430. lineStyle: {
  431. color: "#D9D9D9"
  432. }
  433. },
  434. data: xAxisData
  435. }],
  436. yAxis: [{
  437. type: "value",
  438. name: '单位:元',
  439. axisLabel: {
  440. textStyle: {
  441. color: "#666"
  442. }
  443. },
  444. nameTextStyle: {
  445. color: "#666",
  446. fontSize: 12,
  447. lineHeight: 40
  448. },
  449. splitLine: {
  450. lineStyle: {
  451. type: "dashed",
  452. color: "#E9E9E9"
  453. }
  454. },
  455. axisLine: {
  456. show: false
  457. },
  458. axisTick: {
  459. show: false
  460. }
  461. }],
  462. series: [{
  463. name: "收入",
  464. type: "line",
  465. smooth: true,
  466. // showSymbol: false,/
  467. symbolSize: 8,
  468. zlevel: 3,
  469. lineStyle: {
  470. normal: {
  471. color: color[0],
  472. shadowBlur: 3,
  473. shadowColor: hexToRgba(color[0], 0.5),
  474. shadowOffsetY: 8
  475. }
  476. },
  477. areaStyle: {
  478. normal: {
  479. color: new echarts.graphic.LinearGradient(
  480. 0,
  481. 0,
  482. 0,
  483. 1,
  484. [{
  485. offset: 0,
  486. color: hexToRgba(color[0], 0.3)
  487. },
  488. {
  489. offset: 1,
  490. color: hexToRgba(color[0], 0.1)
  491. }
  492. ],
  493. false
  494. ),
  495. shadowColor: hexToRgba(color[0], 0.1),
  496. shadowBlur: 10
  497. }
  498. },
  499. data: yAxisData1
  500. }, {
  501. name: "提现",
  502. type: "line",
  503. smooth: true,
  504. // showSymbol: false,
  505. symbolSize: 8,
  506. zlevel: 3,
  507. lineStyle: {
  508. normal: {
  509. color: color[1],
  510. shadowBlur: 3,
  511. shadowColor: hexToRgba(color[1], 0.5),
  512. shadowOffsetY: 8
  513. }
  514. },
  515. areaStyle: {
  516. normal: {
  517. color: new echarts.graphic.LinearGradient(
  518. 0,
  519. 0,
  520. 0,
  521. 1,
  522. [{
  523. offset: 0,
  524. color: hexToRgba(color[1], 0.3)
  525. },
  526. {
  527. offset: 1,
  528. color: hexToRgba(color[1], 0.1)
  529. }
  530. ],
  531. false
  532. ),
  533. shadowColor: hexToRgba(color[1], 0.1),
  534. shadowBlur: 10
  535. }
  536. },
  537. data: yAxisData2
  538. }]
  539. };
  540. echartsRecords.setOption(option);
  541. window.onresize = function() {
  542. echartsRecords.resize();
  543. }
  544. });
  545. </script>
  546. </body>
  547. </html>