增加固定数据的动画

src/utils/comm.js

@@ -47,5 +47,43 @@ export function rtsocket(param){
     // rtdata = e.data
     
   };
+}
 
+// 数字滚动效果
+export function numberGrow (ele,value) {
+  // debugger;
+  //【这里调速度 1 ，步进值， 通俗地讲，就是每次跳的时候，增加的一个增量】
+  //let step = parseInt((this.value * 100) / (this.time * 1000));
+  let time=2000
+  let nval = parseInt(value.replace(/,/gi,''))
+  let step  = parseInt(nval * 100 / (time * 1000))
+  // 设置当前值(这个值是计时器持续运行时，每次页面上显示的跳动值，不是最终的那个具体值)
+  let current = 0
+  // 设置开始值
+  let start = 0
+  // 设置定时器，用来反复横跳的，哈哈哈
+  let t = setInterval(() =>{
+    // 每次增加一点步进值
+    start += step
+    // 开始值大于传过来的的值，说明 到点了，不用 继续横跳了
+    if (start > this.value) {
+      clearInterval(t)
+      // 把穿过的值赋给start，结束
+      start = this.value
+      // 清掉计时器
+      t = null
+    }
+    if(start == 0){
+      start = this.value;
+      clearInterval(t)
+    }
+    // 当前值等于开始值，那就结束
+    if (this.value === 0) {
+    return
+    }
+    current = start
+    // 正则
+    ele.innerHTML = current.toString().replace(/(\d)(?=(?:\d{3}[+]?)+$)/g, '$1,')
+  }, this.time * 100)  // 【这里调速度 2， 通俗地讲，这里是页面上，肉眼能看到的跳动频率】
+  // 本来想设置成 秒 *1000的，但是实在太慢了，就改成 *100了
 }

src/views/HomeView.vue

@@ -125,7 +125,7 @@ import * as echarts from 'echarts';
 import * as btApi from '../api/home'
 
 // 数字变化效果
-import { numGrow,ecMaxVal} from '@/utils/comm';
+import { numGrow,ecMaxVal,numberGrow} from '@/utils/comm';
 
 // 引入api
 import * as homeApi from '@/api/home'
@@ -185,10 +185,12 @@ export default {
     this.getGcgNumDatas()
     //统计日月年进馆总数
     this.getStat();
-    // 设置定时
+    //
+    this.getInfoDatas()
+    // 设置websocket定时
     setInterval(()=>{
-      this.getInfoDatas();
+      this.getsckdata();
-    },3000)
+    },5000)
     
     
   },
@@ -655,10 +657,10 @@ export default {
       homeApi.allGroupNum().then(res => {
         // get allTimeData
         const tmpdata = res.data.returnData
-        that.day_num = tmpdata.day.noRepeatInNum
+        // that.day_num = tmpdata.day.noRepeatInNum
-        that.week_num = tmpdata.week.noRepeatInNum
+        // that.week_num = tmpdata.week.noRepeatInNum
-        that.mon_num = tmpdata.month.noRepeatInNum
+        // that.mon_num = tmpdata.month.noRepeatInNum
-        that.year_num = tmpdata.year.noRepeatInNum
+        // that.year_num = tmpdata.year.noRepeatInNum
 
         //年度总人数
         const ycount= tmpdata.year.noRepeatInNum
@@ -677,7 +679,15 @@ export default {
       // interface
       homeApi.allGcgNumDatas().then(res=>{
         this.ssjgNumDatas = res.data.returnData
+        //
+
       })
+
+
+    },
+
+    //
+    getsckdata(){
       // websocket 
       const param ={
         type:'realTimeData',
@@ -704,7 +714,6 @@ export default {
       }
 
       let func1 = func2.bind(this)
-
     },