页面修改

src/api/course/index.js

@@ -644,4 +644,16 @@ export function GetCourseRebateSetList(data) {
     method: 'post',
     data
   })
+}
+
+/**
+ * 首页人数统计
+ * @param {JSON对象} data 
+ */
+export function queryPersonnelStatic(data) {
+  return request({
+    url: '/UserCenter/PersonnelStatic',
+    method: 'post',
+    data
+  })
 }
\ No newline at end of file

src/components/work/sell.vue

@@ -32,14 +32,15 @@
             </q-btn>
           </div>
           <div class="sell-num">
-            0<span class="unit">人</span>
+            {{PersionData.todayAdd}}<span class="unit">人</span>
           </div>
           <div class="flex no-wrap justify-between items-center">
             <div class="sell-name">今日新名单</div>
             <img src="../../assets/images/newindex/sell8.png" alt="" style="width:10px;">
           </div>
         </div>
-        <div class="sell-block" :class="{'active-sell':sellBlock==2}" style="background-color:#FFF5F8"  @click="ckeckSell(2)">
+        <div class="sell-block" :class="{'active-sell':sellBlock==2}" style="background-color:#FFF5F8"
+          @click="ckeckSell(2)">
           <div class="flex no-wrap justify-between items-center">
             <img src="../../assets/images/newindex/sell2.png" style="width:26px;height:26px">
             <q-btn size="sm" dense flat round icon="more_horiz">
@@ -60,14 +61,15 @@
             </q-btn>
           </div>
           <div class="sell-num">
-            0<span class="unit">人</span>
+            {{PersionData.notCommunicateCount}}<span class="unit">人</span>
           </div>
           <div class="flex no-wrap justify-between items-center">
             <div class="sell-name">待跟进</div>
             <img src="../../assets/images/newindex/sell8.png" alt="" style="width:10px;">
           </div>
         </div>
-        <div class="sell-block" :class="{'active-sell':sellBlock==3}" style="background-color:#E8FFF3"  @click="ckeckSell(3)">
+        <div class="sell-block" :class="{'active-sell':sellBlock==3}" style="background-color:#E8FFF3"
+          @click="ckeckSell(3)">
           <div class="flex no-wrap justify-between items-center">
             <img src="../../assets/images/newindex/sell3.png" style="width:26px;height:26px">
             <q-btn size="sm" dense flat round icon="more_horiz">
@@ -88,14 +90,15 @@
             </q-btn>
           </div>
           <div class="sell-num">
-            0<span class="unit">人</span>
+            {{PersionData.todayVisit}}<span class="unit">人</span>
           </div>
           <div class="flex no-wrap justify-between items-center">
             <div class="sell-name">今日到访</div>
             <img src="../../assets/images/newindex/sell8.png" alt="" style="width:10px;">
           </div>
         </div>
-        <div class="sell-block" :class="{'active-sell':sellBlock==4}" style="background-color:#F2FAFF;"  @click="ckeckSell(4)">
+        <div class="sell-block" :class="{'active-sell':sellBlock==4}" style="background-color:#F2FAFF;"
+          @click="ckeckSell(4)">
           <div class="flex no-wrap justify-between items-center">
             <img src="../../assets/images/newindex/sell4.png" style="width:26px;height:26px">
             <q-btn size="sm" dense flat round icon="more_horiz">
@@ -116,14 +119,15 @@
             </q-btn>
           </div>
           <div class="sell-num">
-            0<span class="unit">人</span>
+            {{PersionData.appointmentCount}}<span class="unit">人</span>
           </div>
           <div class="flex no-wrap justify-between items-center">
             <div class="sell-name">今日拜访</div>
             <img src="../../assets/images/newindex/sell8.png" alt="" style="width:10px;">
           </div>
         </div>
-        <div class="sell-block" :class="{'active-sell':sellBlock==5}" style="background-color:#FFFAF5"  @click="ckeckSell(5)">
+        <div class="sell-block" :class="{'active-sell':sellBlock==5}" style="background-color:#FFFAF5"
+          @click="ckeckSell(5)">
           <div class="flex no-wrap justify-between items-center">
             <img src="../../assets/images/newindex/sell5.png" style="width:26px;height:26px">
             <q-btn size="sm" dense flat round icon="more_horiz">
@@ -144,14 +148,15 @@
             </q-btn>
           </div>
           <div class="sell-num">
-            0<span class="unit">人</span>
+            {{PersionData.customerCount}}<span class="unit">人</span>
           </div>
           <div class="flex no-wrap justify-between items-center">
             <div class="sell-name">今日新同行</div>
             <img src="../../assets/images/newindex/sell7.png" alt="" style="width:10px;">
           </div>
         </div>
-        <div class="sell-block" :class="{'active-sell':sellBlock==6}" style="background-color:#FEF4FE"  @click="ckeckSell(6)">
+        <div class="sell-block" :class="{'active-sell':sellBlock==6}" style="background-color:#FEF4FE"
+          @click="ckeckSell(6)">
           <div class="flex no-wrap justify-between items-center">
             <img src="../../assets/images/newindex/sell6.png" style="width:26px;height:26px">
             <q-btn size="sm" dense flat round icon="more_horiz">
@@ -172,7 +177,7 @@
             </q-btn>
           </div>
           <div class="sell-num">
-            0<span class="unit">人</span>
+            {{PersionData.trialLessonCount}}<span class="unit">人</span>
           </div>
           <div class="flex no-wrap justify-between items-center">
             <div class="sell-name">今日试听</div>
@@ -184,6 +189,9 @@
   </div>
 </template>
 <script>
+  import {
+    queryPersonnelStatic
+  } from '../../api/course/index'
   import VueApexCharts from "vue-apexcharts";
   export default {
     components: {
@@ -343,10 +351,27 @@
             }
           }
         },
-        sellBlock:1,
+        sellBlock: 1,
+        //人员统计
+        PersionData: {},
       };
     },
+    created() {
+
+    },
+    mounted() {
+      this.getPersionNumData();
+    },
     methods: {
+      //人数统计
+      getPersionNumData() {
+        queryPersonnelStatic({}).then(res => {
+          if (res.Code == 1) {
+            this.PersionData = res.Data;
+          }
+          console.log("res", res);
+        });
+      },
       checkTab(type) {
         if (type == 1) {
           this.tab = 1
@@ -360,12 +385,11 @@
           this.date = ""
         }
       },
-      ckeckSell(n){
-        this.sellBlock=n
+      ckeckSell(n) {
+        this.sellBlock = n
       }
     }
   };
-
 </script>
 <style lang="scss" scoped>
   .sell {
@@ -385,7 +409,7 @@
     }
 
     .top {
-    //   width: 660px;
+      //   width: 660px;
       height: 185px;
       border-radius: 8px 8px 0 0;
       background-color: #009EF7;
@@ -393,7 +417,7 @@
 
     .bottom {
       width: 31.25vw;
-      height:320px;
+      height: 320px;
       position: absolute;
       top: 160px;
       left: 50%;
@@ -408,31 +432,34 @@
         padding: 16px;
 
         .sell-num {
-          height:60px;
+          height: 60px;
           font-size: 36px;
           font-family: Source Han Sans CN;
           font-weight: 800;
           color: #404040;
-          line-height:30px;
-          padding-top:20px;
-          .unit{
-              font-size: 14px;
-              font-family: PingFang SC;
-              font-weight: 400;
-              color: #404040;
-          }
-        }
-        .sell-name{
+          line-height: 30px;
+          padding-top: 20px;
+
+          .unit {
             font-size: 14px;
             font-family: PingFang SC;
             font-weight: 400;
             color: #404040;
-            white-space:nowrap;
+          }
+        }
+
+        .sell-name {
+          font-size: 14px;
+          font-family: PingFang SC;
+          font-weight: 400;
+          color: #404040;
+          white-space: nowrap;
         }
       }
     }
   }
-  .active-sell{
+
+  .active-sell {
     box-shadow: 1px 3px 49px 0px rgba(0, 158, 247, 0.28);
   }
-</style>
+</style>
\ No newline at end of file