首页折线图

src/views/modules/home/index.vue

@@ -489,26 +489,22 @@ export default {
         };
         myChart.setOption(option, true);
       })
-
-    
-     
-  
-      
-      
-
-      
-      console.log(data, code, msg,"sfklsdkjl");
-  
-
       
     },
     initEcharts() {
-        this.$http.get("/voluntary/volunteerInfo/homePage/staticVolunteerInfoByTime").then(({ data: { data } }) => {
-        console.log(data,"sdfkljsd");
-        
+      const url = "/voluntary/volunteerInfo/homePage/staticVolunteerInfoByTime";
+      let params = {
+        agencyId: ""
+      };
+      requestGet(url, params).then(res => {
+        console.log(res, "s2342df;lsdl;");
+        const data=res.data
+        const xData=data.map(item=>{
+              console.log(item.statisticDate,"");
+             return  item.statisticDate
+            })
         this.myChart = echarts.init(document.getElementById("my_chart"));
-        console.log("123123", data)
-        let series = data.series.map((item, index) => {
+        let series = res.data.map((item, index) => {
           return {
             ...item,
             type: "line",
@@ -521,8 +517,71 @@ export default {
             }
           };
         });
-      }
-   )
+        let option = {
+          tooltip: {
+            trigger: "axis",
+          },
+          legend: {
+            data: ['服务老人', '服务次数', '服务时长', '发放积分'],
+          },
+          grid: {
+            left: "3%",
+            right: "4%",
+            bottom: "13%",
+            top: '5',
+            containLabel: true,
+          },
+          toolbox: {
+            // feature: {
+            // 	saveAsImage: {}
+            // }
+          },
+          xAxis: {
+            type: "category",
+            boundaryGap: false,
+            data: xData
+          },
+          yAxis: {
+            type: "value",
+          },
+          series: [{
+            name: '服务老人',
+            type: 'line',
+            data: data.map((item, index) => ({
+              value: item.servingElderlyNum,
+            })),
+            color: "#3B82F6"
+          },
+          {
+            name: '服务记录',
+            type: 'line',
+            data: data.map((item, index) => ({
+              value: item.serviceNum,
+            })),
+            color: "#22C55E" 
+          },
+          {
+            name: '服务时长',
+            type: 'line',
+            data: data.map((item, index) => ({
+              value: item.serviceTime,
+            })),
+             color: "#FACC15"
+          },
+          {
+            name: '发放积分',
+            type: 'line',
+            data: data.map((item, index) => ({
+              value: item.pointNum,
+            })),
+            color: "#FB923C"
+          }
+          ],
+        };
+        this.myChart.setOption(option, true); 
+      })
+  
+  //  )
     },
 
     columnbackgroundStyle({ row, column, rowIndex, columnIndex }) {