试点总览接口联调

src/views/LandConsolidation/components/sdgk.vue

@@ -5,7 +5,7 @@
       <div class="item" v-for="(sd, index) in sdlist" :key="index">
         <div class="text">
           <p>{{ sd.name }}</p>
-          <span class="cvalue">{{ (sdata.area || 0).toFixed(2) }} </span>
+          <span class="cvalue">{{ (sdata[sd.prop] || 0).toFixed(2) }} </span>
           <span class="unit">{{ sd.unit }}</span>
         </div>
       </div>
@@ -19,6 +19,22 @@
     <div class="echars">
       <div class="echartTitle">
         <div class="block-title">现状信息</div>
+        <div class="selectTab">
+          <el-select
+            v-model="tab"
+            placeholder="请选择"
+            :popper-append-to-body="false"
+            @change="Getxzxx()"
+          >
+            <el-option
+              v-for="item in options"
+              :key="item.value"
+              :label="item.name"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </div>
       </div>
       <div class="content">
         <div class="item" v-for="(sd, index) in xzlist" :key="index">
@@ -27,7 +43,7 @@
           </div>
           <div class="text">
             <p>{{ sd.name }}</p>
-            <span class="cvalue">{{ (sdata.area || 0).toFixed(2) }} </span>
+            <span class="cvalue">{{ (xzdata[sd.prop] || 0).toFixed(2) }} </span>
             <span class="unit">{{ sd.unit }}</span>
           </div>
         </div>
@@ -36,27 +52,11 @@
     <div class="echars">
       <div class="echartTitle">
         <div class="block-title">试点投资</div>
-        <div class="selectTab">
-          <el-select
-            v-model="tab"
-            placeholder="请选择"
-            :popper-append-to-body="false"
-            @change="changeCharts"
-          >
-            <el-option
-              v-for="item in options"
-              :key="item.value"
-              :label="item.name"
-              :value="item.value"
-            >
-            </el-option>
-          </el-select>
-        </div>
       </div>
       <div class="content ztzc">
         <div class="text">
           <span>总投资</span>
-          <span class="cvalue">{{ (tzdata.area || 0).toFixed(2) }} </span>
+          <span class="cvalue">{{ (tzdata.jhtz || 0).toFixed(2) }} </span>
           <span class="unit">万元</span>
         </div>
       </div>
@@ -65,18 +65,18 @@
         <div class="item">
           <div class="text">
             <p>财政投资</p>
-            <span class="cvalue">{{ (tzdata.area || 0).toFixed(2) }} </span>
+            <span class="cvalue">{{ (tzdata.czjhtz || 0).toFixed(2) }} </span>
             <span class="unit">万元</span>
-            <p>{{ (tzdata.area || 0).toFixed(2) }}%</p>
+            <p>{{ (tzdata.czratio || 0).toFixed(2) }}%</p>
           </div>
         </div>
         <div class="item"></div>
         <div class="item">
           <div class="text">
             <p>社会投资</p>
-            <span class="cvalue">{{ (tzdata.area || 0).toFixed(2) }} </span>
+            <span class="cvalue">{{ (tzdata.shjhtz || 0).toFixed(2) }} </span>
             <span class="unit">万元</span>
-            <p>{{ (tzdata.area || 0).toFixed(2) }}%</p>
+            <p>{{ (tzdata.sjratio || 0).toFixed(2) }}%</p>
           </div>
         </div>
       </div>
@@ -87,42 +87,41 @@
 <script>
 import pie from "@/components/echartsTemplate/pie.vue";
 import { overview, district, reason } from "@/api/Idleland.js";
-import { QueryList } from "@/api/cockpitNew";
+import { QueryOne, QueryList } from "@/api/cockpitNew";
 import { legends } from "./config.js";
 import { loadGeoJSON } from "@/utils/MapHelper/help.js";
-import {QueryOne} from '../../../api/stxf/tdzz.js'
 export default {
   props: {},
   data() {
     return {
-      sdata: { suspected: {}, confirm: {}, disposal: {} },
+      region: "",
+      sdata: {},
       sdlist: [
-        { name: "试点区域", prop: "suspected", unit: "公顷" },
-        { name: "整治区域", prop: "confirm", unit: "公顷" },
-        { name: "涉及村庄", prop: "disposal", unit: "个" },
+        { name: "试点区域", prop: "试点面积", unit: "公顷" },
+        { name: "整治区域", prop: "整治面积", unit: "公顷" },
+        { name: "涉及村庄", prop: "村庄个数", unit: "个" },
       ],
-      tab: 0,
+      tab: "sd",
       options: [
-        { name: "试点区域", value: 0 },
-        { name: "整治区域", value: 1 },
+        { name: "试点区域", value: "sd" },
+        { name: "整治区域", value: "zzqy" },
       ],
       xzlist: [
-        { name: "农用地面积", prop: "suspected", unit: "公顷" },
-        { name: "建设用地面积", prop: "confirm", unit: "公顷" },
-        { name: "未利用地面积", prop: "disposal", unit: "公顷" },
-        { name: "耕地面积", prop: "disposal", unit: "公顷" },
-        { name: "永久基本农田", prop: "disposal", unit: "公顷" },
-        { name: "生态红线划定", prop: "disposal", unit: "公顷" },
+        { name: "农用地面积", prop: "nydmk", unit: "公顷" },
+        { name: "建设用地面积", prop: "jsydmj", unit: "公顷" },
+        { name: "未利用地面积", prop: "wlytmj", unit: "公顷" },
+        { name: "耕地面积", prop: "gd", unit: "公顷" },
+        { name: "永久基本农田", prop: "yjjbnt", unit: "公顷" },
+        { name: "生态红线划定", prop: "sthxhdmj", unit: "公顷" },
       ],
+      xzdata: {},
       tzdata: {},
     };
   },
   components: {
     pie,
   },
-  mounted() {
-    this.getData();
-  },
+  mounted() {},
   methods: {
     changeData(name, updata) {
       this[name] = updata;
@@ -133,24 +132,23 @@ export default {
     },
     getData() {
       this.$emit("updateParent", "loading", true);
-      this.params = { districtCode: this.region };
       this.Getzzxm();
+      this.Getxzxx();
+      this.Getsdtz();
       this.Getkjxx();
       this.Getkjxx();
       this.Getkjxx();
       this.Getkjxx();
-
-      this.GetSumList();
     },
-    async Getzzxm(params) {
-      let getGk = await QueryOne({
-        jscType: "qytuzz_sdzl_xzxx_sd",
-        id: params ? params.id : "4602",
-      })
-      console.log(getGk,'getGkgetGkgetGkgetGk');
+    async Getzzxm() {
+      let sdres = await QueryOne({
+        jscType: "qytuzz_sdzl_sdqk",
+        id: this.region,
+      });
+      this.sdata = sdres.data;
       let res = await QueryList({
         jscType: "jsc_stxf_ywfl_tdzz",
-        id: params ? params.id : "4602",
+        id: this.region,
       });
       let arr = [];
       res.data.forEach((res) => {
@@ -160,23 +158,31 @@ export default {
         });
       });
       this.setEchart({ data: arr, type: '"horizontal"' }, 0);
-      // this.$refs.stxf_echart_tdzz.setOptions(arr);
-
-      // let res_hz = await QueryList({
-      //   jscType: "jsc_stxf_ztgh_tdzz",
-      //   id: params ? params.id : "4602",
-      // });
-
-      // this.sdata.tdzz = {
-      //   xzqhdm_number: res_hz.data[0].xmsl,
-      //   zlmj: res_hz.data[0].mj,
-      //   tzje: res_hz.data[0].tzje,
-      // };
     },
-    async Getkjxx(params) {
+    async Getxzxx() {
+      let res = await QueryOne({
+        jscType: `qytuzz_sdzl_xzxx_${this.tab}`,
+        id: this.region,
+      });
+      this.xzdata = res.data;
+      this.$emit("updateParent", "loading", false);
+    },
+    async Getsdtz() {
+      let { data } = await QueryOne({
+        jscType: "qytuzz_sdzl_sdtz",
+        id: this.region,
+      });
+      let czratio = data.jhtz ? (data.czjhtz / data.jhtz) * 100 : 0;
+      let sjratio = data.jhtz ? (data.shjhtz / data.jhtz) * 100 : 0;
+      this.tzdata = { ...data, czratio, sjratio };
+      const background = `linear-gradient(to right,#DFE15A ${czratio}%,#62ADED 0%)`;
+      this.$refs.tzRef.style.background = background;
+      this.$emit("updateParent", "loading", false);
+    },
+    async Getkjxx() {
       let res = await QueryList({
         jscType: "qytuzz_sdzl_kjxx",
-        id: params ? params.id : "4602",
+        id: this.region,
       });
       this.active_tableData(res.data);
     },
@@ -201,26 +207,6 @@ export default {
       //   if (das.name == "LandConsolidation") {viewer.dataSources.remove(das);}
       // });
     },
-    GetOverview() {
-      overview(this.params).then((res) => {
-        this.sdata = res.data || {};
-        this.$emit("updateParent", "loading", false);
-      });
-    },
-    GetSumList() {
-      reason(this.params).then((res) => {
-        res.data.map((a) => {
-          a.name = a.reason;
-          a.value = a.area.toFixed(2);
-        });
-        let redPercent = 60;
-        let bluePercent = 40;
-        const background = `linear-gradient(to right,#DFE15A ${redPercent}%,#62ADED   ${bluePercent}%)`;
-        this.$refs.tzRef.style.background = background;
-        this.setEchart({ data: res.data, type: '"horizontal"' }, 0);
-        this.$emit("updateParent", "loading", false);
-      });
-    },
     changeCharts(e) {},
     setEchart(data, id) {
       this.$nextTick(() => {
@@ -311,6 +297,7 @@ export default {
   .tzdiv {
     height: 20px;
     margin: 5px 20px;
+    // background: #62aded;
   }
 }
 </style>