Ver código fonte

人流量折线图加载优化

王涛 3 anos atrás
pai
commit
2ca1472bcb

+ 1 - 3
src/components2/populationStatistics/echartsZXT.vue

@@ -26,8 +26,7 @@ export default {
     getData() {
       let myChart = echarts.init(document.getElementById("index"));
       let data = this.resData;
-      setTimeout(()=>{
-        let series = []; //定义一个数组变量用于存放配置
+      let series = []; //定义一个数组变量用于存放配置
       let colorShown = [
         {
           opacity: 0.8,
@@ -129,7 +128,6 @@ export default {
         series: series,
       };
       option && myChart.setOption(option);
-      },1000)
       
       setTimeout(function () {
         window.onresize = function () {

+ 16 - 5
src/components2/populationStatistics/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-col :span="24" class="populationStatistics modular" style="padding:10px 20px 0;">
+  <el-col :span="24" class="populationStatistics modular" style="padding:10px 20px 0;" v-loading="loading">
     <el-col class="title" style="margin-left:0;">今日人流量统计</el-col>
     <el-col class="subtitle"
       >今日人流量统计:<strong>{{
@@ -7,6 +7,7 @@
       }}</strong><span> 人/次</span></el-col
     >
     <echartsZXT
+      v-if="status"
       :resData="populationStatisticsList.data"
       style="width: 100%; height: 100%;"
       alt="折线图"
@@ -30,19 +31,24 @@ export default {
             [],[]
           ],
       },
+      status:false,
+      loading:true
     };
   },
   watch: {},
-  mounted() {
+  created(){
     this.init()
     this.timing()
+  },
+  mounted() {
+    
   },
   methods: {
-    init(){
-      axios({
+    async init(){
+      await axios({
         method: 'get',
         url: 'https://smartpark.caih.com/ykt/api/thirdparty/v1/openInterface/yunUserRequest',
-        timeout: 100000,
+        timeout: 10000,
       }).then(res =>{
           let total = 0
           if(res.data){
@@ -55,6 +61,11 @@ export default {
               total += res.data[i].card_number
             }
             this.populationStatisticsList.num = total
+            setTimeout(()=>{
+              this.status = true
+              this.loading = false
+            },20)
+            
           }
       }).catch(err =>{
       })

+ 2 - 3
src/components2/restaurant/index.vue

@@ -6,7 +6,7 @@
         <el-image :src="restaurant1" fit="scale-down" />
         <el-col class="name"
           >今日营业额<el-col class="num"
-            >{{ data.consumerNowNumber || 0 }}<span class="unit">元</span></el-col
+            >{{ data.nowIncome || 0 }}<span class="unit">元</span></el-col
           ></el-col
         >
       </el-col>
@@ -14,7 +14,7 @@
         <el-image :src="restaurant1" fit="scale-down" />
         <el-col class="name"
           >今日销售人/次<el-col class="num"
-            >{{ data.nowIncome || 0 }}<span class="unit">份</span></el-col
+            >{{ data.consumerNowNumber || 0 }}<span class="unit"></span></el-col
           ></el-col
         >
       </el-col>
@@ -59,7 +59,6 @@ export default {
     };
   },
   created(){
-    console.log(getWeekDate())
     if(getWeekDate() == "周一" || getWeekDate() == "周日"){
       this.list2 = [
         {id:num1,name:"未营业",num:0},