生态修复-山水修复

src/views/cockpitNew1/stxf.vue

@@ -23,19 +23,19 @@
       <div class="item">
         <div class="itembg"></div>
         <div class="text">综合整治项目</div>
-        <span>{{ sdata.a || 0 }}</span>
+        <span>{{ sdata.xzqhdm_number || 0 }}</span>
         个
       </div>
       <div class="item">
         <div class="itembg"></div>
         <div class="text">土地整治面积</div>
-        <span>{{ sdata.a || 0 }}</span>
+        <span>{{ sdata.zlmj || 0 }}</span>
         公顷
       </div>
       <div class="item">
         <div class="itembg"></div>
         <div class="text">总投资</div>
-        <span>{{ sdata.a || 0 }}</span>
+        <span>{{ sdata.tzje || 0 }}</span>
         万元
       </div>
     </div>
@@ -59,8 +59,17 @@ export default {
         { value: "haxf", label: "海岸线保护" }
       ],
       value: "tdxf",
-      datas: {},
-      sdata: {}
+      paramdatas: {},
+      sdata: {},
+      eData: {
+        xData: ["农用地", "建设用地", "生态修复", "历史文化保护"],
+        yData: [
+          [10, 10, 10, 10],
+          [10, 10, 30, 10],
+          [10, 10, 10, 40]
+        ],
+        legend: [""]
+      }
     };
   },
   //监听属性 类似于data概念
@@ -69,24 +78,11 @@ export default {
   watch: {},
   methods: {
     changeCharts() {
-      this.setData(this.datas);
+      this.setData(this.paramdatas);
     },
     // //第二个图表
     setData(datas) {
-      this.datas = datas;
-      let v = {
-        xData: ["农用地", "建设用地", "生态修复", "历史文化保护"],
-        yData: [
-          [10, 10, 10, 10],
-          [10, 10, 30, 10],
-          [10, 10, 10, 40]
-        ],
-
-        legend: [""]
-      };
-      this.$nextTick(() => {
-        this.$refs.echartRef.setOptions(v);
-      });
+      this.paramdatas = datas;
       this.GetQueryOne(datas);
       this.GetQueryList(datas);
     },
@@ -96,20 +92,32 @@ export default {
         jscType: `jsc_stxf_ztgh_${this.value}` //"jsc_stxf_ztgh_ssxf"
       };
       QueryOne(params).then(res => {
-        // this.sdata = res.data && res.data.length > 0 ? res.data[0] : {};
+        this.sdata = res.data || {};
       });
     },
     GetQueryList(datas) {
+      this.eData.xData = [];
+      this.eData.yData = [];
       let params = {
         ...datas,
         jscType: `jsc_stxf_ywlx_${this.value}` // "jsc_stxf_ywlx_ssxf"
       };
       QueryList(params).then(res => {
-        // this.sdata = res.data && res.data.length > 0 ? res.data[0] : {};
+        res.data.forEach(edata => {
+          this.eData.xData.push(edata.jd_type);
+          this.eData.yData.push([edata.xzqhdm_number, edata.zlmj, edata.tzje]);
+        });
+        this.$nextTick(() => {
+          this.$refs.echartRef.setOptions(this.eData);
+        });
       });
     }
   },
-  mounted() {}
+  mounted() {
+    this.$nextTick(() => {
+      this.$refs.echartRef.setOptions(this.eData);
+    });
+  }
 };
 </script>
 <style lang="scss" scoped>