统计

static/css/common.css

@@ -533,6 +533,38 @@ a{color: #07a9fe;text-decoration: none;}
 }
 .chatArea .el-textarea__inner{
     border: none;
+}
+.tongji{
+    display: flex;
+}
+.tongji .tongjiItem{
+    background: #fff;
+    margin: 10px;
+    border-radius: 5px;
+    width: 100%;
+}
+.tongji .tongjiHeader{
+    font-size: 14px;
+    font-weight: bold;
+    padding: 10px 15px;
+    border-bottom: 1px solid #e8eaec;
+    color:#17233d;
+}
+.tongji .tongjiBody{
+    font-size: 30px;
+    margin: 0px 10px;
+    padding: 10px 0px;
+    border-bottom: 1px solid #e8eaec;
+    color: #515a6e;
+}
+.tongji .tongjiFooter{
+    font-size: 14px;
+    margin: 10px 10px;
+    color: #515a6e;
+}
+.tongji .tongjiFooter span{
+    color: red;
+    padding: 0 3px;
 }
     /* 定义滚动条的宽度、高度和背景色 */
 ::-webkit-scrollbar {

static/templates/pannel.html

@@ -1,6 +1,52 @@
 {{template "header" }}
 <div id="app" style="width:100%;background: #eef0f6">
     <template>
+        <div class="tongji">
+            <div class="tongjiItem">
+                <div class="tongjiHeader">
+                    全部客户
+                </div>
+                <div class="tongjiBody">
+                    33
+                </div>
+                <div class="tongjiFooter">
+                    累计客户数量<span>xx</span>人
+                </div>
+            </div>
+            <div class="tongjiItem">
+                <div class="tongjiHeader">
+                    日新增客户
+                </div>
+                <div class="tongjiBody">
+                    33
+                </div>
+                <div class="tongjiFooter">
+                    累计客户数量<span>xx</span>人
+                </div>
+            </div>
+            <div class="tongjiItem">
+                <div class="tongjiHeader">
+                    月新增客户
+                </div>
+                <div class="tongjiBody">
+                    33
+                </div>
+                <div class="tongjiFooter">
+                    累计客户数量<span>xx</span>人
+                </div>
+            </div>
+            <div class="tongjiItem">
+                <div class="tongjiHeader">
+                    年新增客户
+                </div>
+                <div class="tongjiBody">
+                    33
+                </div>
+                <div class="tongjiFooter">
+                    累计客户数量<span>xx</span>人
+                </div>
+            </div>
+        </div>
         <div style="background: #fff;margin: 10px;padding: 10px" id="visitorNums">
 
         </div>