更新

src/App.vue

@@ -155,7 +155,7 @@ export default {
       clearInterval(this.polling);
       this.polling = setInterval(() => {
         // 具体业务代码
-        this.autoChange();
+        // this.autoChange();
       }, 20000);
     },
   },

src/views/index.vue

@@ -8,8 +8,8 @@
           <span class="kliu_title">总服务人次趋势</span>
           <div class="kliu_st">
             <span id="yitem" :class="klselt == 'y' ? 'spactive' : ''" @click="selitem('y')">年</span>
-            <span id="mitem" :class="klselt == 'm' ? 'spactive' : ''" @click="selitem('m')">月</span>
-            <span id="ditem" :class="klselt == 'd' ? 'spactive' : ''" @click="selitem('d')">日</span>
+            <span id="mitem" :class="klselt == 'm' ? 'spactive' : ''" @click="selitem2('m')">月</span>
+            <span id="ditem" :class="klselt == 'd' ? 'spactive' : ''" @click="selitem3('d')">日</span>
           </div>
         </div>
         <!-- 立体柱状图 -->
@@ -177,7 +177,9 @@ export default {
       rsqsData_z: [],
       proportionData: [],
       proportionData_z: [],
-      groupNameData: []
+      groupNameData: [],
+      timer1: null,//左上角定时器
+      timer2: null,//左下角定时器
     };
   },
   //创建的时候修改背景图片
@@ -270,6 +272,7 @@ export default {
     selitem(type) {
       // console.log(type);
       this.klselt = type;
+      // this.getHomeBarData();
       this.btgetdata()
     },
     selitem2(type) {
@@ -508,33 +511,27 @@ export default {
           ]
         });
       }
-      setInterval(function () {
+      that.timer1 = setInterval(function () {
         myChart.clear();
         option && myChart.setOption(option);
         run(myChart);
-      }, 3600);
+      }, 5000);
     },
 
     // 今日各场馆服务人次趋势
     line_zone() {
+      let that = this;
       var chartDom = document.getElementById("kl-line");
       var option;
       
       var xData = this.rsqsXData;
       var gcolor = ['#FF99CC', '#6666FF', '#FF6600', '#7049f0', '#fa704d', '#01babc']
-      var name = []
-      // var data = [
-      //   [174, 137, 135, 34, 152, 135, 140, 160, 100, 174, 137, 135, 34],
-      //   [134, 74, 137, 135, 161, 137, 300, 220, 250, 134, 74, 137, 135],
-      //   [147, 134, 155, 131, 174, 122, 140, 160, 150, 127, 134, 175, 161],
-      //   [124, 147, 175, 134, 122, 175, 180, 110, 130, 154, 187, 125, 134],
-      //   [154, 174, 157, 175, 121, 157, 200, 250, 280, 134, 174, 157, 175],
-      // ]
+
       var data = this.rsqsData_z
 
       var series = [];
       for (var i = 0; i < data.length; i++) {
-        console.log(gcolor[i])
+        // console.log(gcolor[i])
 
         series.push({
           name: this.rsqsDataName[i],
@@ -685,21 +682,75 @@ export default {
         },
         series: series,
       }
-      // function run(myChart){
-      //   // 获取新数据-处理
-      //   myChart.setOption({
-      //     series: series
-      //   });
-      // }
-      // setTimeout(()=>{
+      function run(myChart){
+        // 获取新数据-处理
+        that.getGcgNumDatas();
+        setTimeout(() => {
+          var xData = that.rsqsXData;
+          var gcolor = ['#FF99CC', '#6666FF', '#FF6600', '#7049f0', '#fa704d', '#01babc']
+
+          var data = that.rsqsData_z
+
+          var series = [];
+          for (var i = 0; i < data.length; i++) {
+            // console.log(gcolor[i])
+
+            series.push({
+              name: that.rsqsDataName[i],
+              type: "line",
+              symbolSize: 3,//标记的大小，可以设置成诸如 10 这样单一的数字，也可以用数组分开表示宽和高，例如 [20, 10] 表示标记宽为20，高为10[ default: 4 ]
+              symbol: 'circle',//标记的图形。ECharts 提供的标记类型包括 'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
+              smooth: true, //是否平滑曲线显示
+              showSymbol: false, //是否显示 symbol, 如果 false 则只有在 tooltip hover 的时候显示
+              areaStyle: {
+                normal: {
+                  color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+                    offset: 0,
+                    color: gcolor[i]
+                  }, {
+                    offset: 0.8,
+                    color: '#fff',
+                  }], false),
+                  // shadowColor: 'rgba(255,255,255, 0.1)',
+                  shadowBlur: 10,
+                  opacity: 0.3,
+                }
+              },
+              itemStyle: {
+                normal: {
+                  color: gcolor[i],
+                  lineStyle: {
+                    width: 1,
+                    type: 'solid' //'dotted'虚线 'solid'实线
+                  },
+                  borderColor: gcolor[i], //图形的描边颜色。支持的格式同 color
+                  borderWidth: 8,//描边线宽。为 0 时无描边。[ default: 0 ] 
+                  barBorderRadius: 0,
+                  label: {
+                    show: false,
+                  },
+                  opacity: 0.5,
+                }
+              },
+              data: data[i],
+
+            })
+          }
+          myChart.setOption({
+            xAxis: [{data: xData}],
+            series: series
+          });
+        }, 2000);
+      }
+      setTimeout(()=>{
         var myChart = echarts.init(chartDom);
         option && myChart.setOption(option);
-        // setInterval(function () {
-        //   myChart.clear();
-        //   option && myChart.setOption(option);
-        //   run(myChart);
-        // }, 600);
-      // }, 600)
+        setInterval(function () {
+          myChart.clear();
+          option && myChart.setOption(option);
+          run(myChart);
+        }, 3000);
+      }, 200)
     },
 
     addNumber(start, end, id) {
@@ -785,8 +836,11 @@ export default {
 
     getGcgNumDatas() {
       let that = this
-
+      that.rsqsDatas = [];
+      this.rsqsDataName = [];
+      that.rsqsData_z = [];
       homeApi.allGcgNumDatas().then(res => {
+        ///pass.passcc/toDayGroupsEnterNum'
         const tmpdata = res.data.data
         tmpdata.forEach((item) => {
           this.rsqsDataName.push(item.groupName);