修改

src/api/system/index.js

@@ -9,3 +9,10 @@ export function topStatistics(query) {
         params: query
     })
 }
+export function signPatientCount(query) {
+    return request({
+        url: '/system/homePage/signPatientCount',
+        method: 'get',
+        params: query
+    })
+}

src/views/index.vue

@@ -56,7 +56,7 @@
     </div>
     <div class="appbottom">
       <div class="appbottomone">
-        <div class="word">随访覆盖情况</div>
+        <div class="word">本月签约患者情况</div>
         <div id="main1" style="height: 80%"></div>
       </div>
       <div class="appbottomtwo">
@@ -68,7 +68,7 @@
 </template>
 
 <script>
-import { topStatistics } from "@/api/system/index";
+import { topStatistics, signPatientCount } from "@/api/system/index";
 import * as echarts from "echarts";
 
 export default {
@@ -86,16 +86,14 @@ export default {
     this.getlist();
   },
   methods: {
-    goback(){
+    goback() {
       this.$router.push({
         path: "/task/manualReview",
-    
       });
     },
-    gofollowup(){
+    gofollowup() {
       this.$router.push({
         path: "/task/followup",
-    
       });
     },
     // 上部分
@@ -105,11 +103,23 @@ export default {
         this.list = res.data;
       });
     },
-    goTarget(href) {
-      window.open(href, "_blank");
-    },
     getlist() {
       // 基于准备好的dom，初始化echarts实例
+      signPatientCount().then((res) => {
+        console.log(res, "res");
+        var countydata = [];
+        res.data.forEach((e) => {
+          countydata.push(e.time);
+        });
+        var countydatay = [];
+        res.data.forEach((e) => {
+          countydatay.push(e.signPatientCount);
+        });
+        var proportionlist = [];
+        res.data.forEach((e) => {
+          proportionlist.push(e.proportion);
+        });
+        // return
         var chartDoms = document.getElementById("main1");
         var myChart1 = echarts.init(chartDoms);
         var optionone;
@@ -123,22 +133,23 @@ export default {
               },
             },
           },
-        // toolbox: {
-        //   feature: {
-        //     dataView: { show: true, readOnly: false },
-        //     magicType: { show: true, type: ["line", "bar"] },
-        //     restore: { show: true },
-        //     // saveAsImage: { show: true },
-        //   },
-        // },
           legend: {
-          data: ["Evaporation", "Precipitation", "Temperature"],
+            data: ["签约数量", "签约率(%)"],
           },
-        color: ["#91ED93", "#68B4FF"],
+          color: ["#2BBD2E", "#68B4FF"],
           xAxis: [
             {
+              axisLabel: {
+                interval: 0,
+                // show: true,
+                // rotate: 35,//35度角倾斜显示
+                textStyle: {
+                  color: "#000",
+                  fontSize: 12,
+                },
+              },
               type: "category",
-            data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
+              data: countydata,
               axisPointer: {
                 type: "shadow",
               },
@@ -147,68 +158,53 @@ export default {
           yAxis: [
             {
               type: "value",
-            name: "Precipitation",
+              name: "签约数量",
-            min: 0,
+              // min: 0,
-            max: 250,
+              // max: 20,
-            interval: 50,
+              // interval: 4,
               axisLabel: {
-              formatter: "{value} ml",
+                formatter: "{value}",
               },
             },
             {
               type: "value",
-            name: "Temperature",
+              name: "签约率(%)",
               min: 0,
-            max: 25,
+              max: 100,
-            interval: 5,
+              interval: 20,
               axisLabel: {
-              formatter: "{value} °C",
+                formatter: "{value}%",
               },
             },
           ],
           series: [
             {
-            name: "Evaporation",
+              name: "签约数量",
               type: "bar",
               tooltip: {
                 valueFormatter: function (value) {
                   return value + " ml";
                 },
               },
-            data: [
+              data: countydatay,
-              2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4,
+              barWidth: "20%",
-              3.3,
-            ],
             },
-          // {
+
-          //   name: "Precipitation",
-          //   type: "bar",
-          //   tooltip: {
-          //     valueFormatter: function (value) {
-          //       return value + " ml";
-          //     },
-          //   },
-          //   data: [
-          //     2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0,
-          //     2.3,
-          //   ],
-          // },
             {
-            name: "Temperature",
+              name: "签约率(%)",
               type: "line",
               yAxisIndex: 1,
               tooltip: {
                 valueFormatter: function (value) {
-                return value + " °C";
+                  return value + " %";
                 },
               },
-            data: [
+              data: proportionlist,
-              2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2,
-            ],
             },
           ],
         };
         optionone && myChart1.setOption(optionone);
+      });
     },
     info() {
       var chartDom = document.getElementById("main");
@@ -251,12 +247,10 @@ export default {
 <style scoped lang="scss">
 .app-container {
   background: #f1f3f5;
-  // display: flex;
   width: 100%;
-  // height: 100%;
+  padding: 20px 20px 20px 20px;
 }
 .app {
-  // width: 99%;
   height: 150px;
   display: flex;
 
@@ -323,10 +317,10 @@ export default {
   }
 }
 .appright {
-  width: 16%;
+  width: 17%;
   background: #fff;
   border-radius: 5px;
-  height: calc(100vh - 400px);
+  height: calc(100vh - 450px);
   .wait {
     // padding: 20px;
     font-weight: 600;