类别代码

src/views/zdry/dytj.vue

 <!--
  * @Author: your name
  * @Date: 2021-09-03 09:32:50
- * @LastEditTime: 2021-09-03 16:19:47
+ * @LastEditTime: 2021-09-03 16:47:55
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: \founder_vue\src\views\zdry\dytj.vue
@@ -16,7 +16,12 @@
       v-if="historyArr.length > 1 && type == 'map'"
       >返回上层</el-button
     >
-    <div id="charts" ref="charts" v-show="type == 'map'"></div>
+    <div
+      id="charts"
+      ref="charts"
+      v-show="type == 'map'"
+      v-loading="loading"
+    ></div>
     <div id="table" v-show="type == 'table'">
       <rightContent
         @returnBtn="type = 'map'"
@@ -101,6 +106,7 @@ export default {
           disabled: false,
         },
       ],
+      loading: false,
     };
   },
   methods: {
@@ -245,9 +251,11 @@ export default {
     },
     //下钻处理接口事件
     getChartsData(xzqhdm) {
+      this.loading = true;
       let params = new Object();
       if (xzqhdm) params.xzqhdm = xzqhdm;
       ryXzqhTj(params).then((res) => {
+        this.loading = false;
         if (res.success && res.code == 200) {
           if (res.data.rows.length > 0) {
             let xData = res.data.rows.map((i) => ({

src/views/zdry/lbtj.vue

 <!--
  * @Author: your name
  * @Date: 2021-09-03 09:32:50
- * @LastEditTime: 2021-09-03 16:06:50
+ * @LastEditTime: 2021-09-03 16:49:26
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: \founder_vue\src\views\zdry\dytj.vue
@@ -16,7 +16,12 @@
       v-if="historyArr.length > 1 && type == 'map'"
       >返回上层</el-button
     >
-    <div id="charts" ref="charts" v-show="type == 'map'"></div>
+    <div
+      id="charts"
+      ref="charts"
+      v-show="type == 'map'"
+      v-loading="loading"
+    ></div>
     <div id="table" v-show="type == 'table'">
       <rightContent
         @returnBtn="type = 'map'"
@@ -31,7 +36,7 @@
 </template>
 <script>
 import rightContent from "@c/ptCxForm_components.vue";
-import { ryXzqhTj, getMainZdGzryxx } from "@/api/zdry/zdrytj.js";
+import { ryAjlbTj } from "@/api/zdry/zdrytj.js";
 export default {
   components: {
     rightContent,
@@ -91,7 +96,18 @@ export default {
       key: "1",
       tableLoading: false,
       tableLength: "",
-      excelHeader: "地域统计",
+      Menu: [
+        {
+          id: "lbtj",
+          label: "类别统计",
+          index: "lbtj",
+          auth: "M0101",
+          className: "iconfont iconrizhi",
+          disabled: false,
+        },
+      ],
+      tierNum: 1,
+      loading: false
     };
   },
   methods: {
@@ -233,27 +249,41 @@ export default {
       let obj = this.historyArr[this.historyArr.length - 2];
       this.getCharts(obj.x, obj.data, obj.rotate);
       this.historyArr.pop();
+      this.tierNum--;
     },
     //下钻处理接口事件
     getChartsData(xzqhdm) {
       let params = new Object();
-      if (xzqhdm) params.xzqhdm = xzqhdm;
-      ryXzqhTj(params).then((res) => {
+      if (this.tierNum == 1) {
+        params.groupid = "CODE_AJZLB";
+      } else if (this.tierNum == 2) {
+        params.groupid = "CODE_AJXZLB";
+      } else if (this.tierNum == 3) {
+        params.groupid = "CODE_XALBDMBCMS";
+      }
+      if (xzqhdm) {
+        params.ajlb = xzqhdm;
+      }
+      this.loading = true
+      ryAjlbTj(params).then((res) => {
+        this.loading = false;
         if (res.success && res.code == 200) {
           if (res.data.rows.length > 0) {
             let xData = res.data.rows.map((i) => ({
-              name: i.xzqhmc,
-              value: i.xzqhdm,
+              name: i.ajlbmc,
+              value: i.ajlb,
             }));
             let data = res.data.rows.map((i) => ({
-              name: i.xzqhmc,
+              name: i.ajlbmc,
               value: i.count,
-              dm: i.xzqhdm,
+              dm: i.ajlb,
             }));
             //添加到histoy数组
             this.historyArr.push({ x: xData, data: data });
             //刷新图
             this.getCharts(xData, data);
+            //更改层数
+            this.tierNum++;
           } else {
             this.$message.warning("没有下一层了");
           }
@@ -263,13 +293,17 @@ export default {
     //表格内容接口
     getTableData(dm) {
       this.type = "table";
-      this.$set(this.cxFormData, "xzqhdm", dm);
+      this.$set(this.cxFormData, "sabq", dm);
     },
   },
   mounted() {
     //初始化图形
     this.getChartsData();
   },
+  created() {
+    this.$store.commit("user/SET_Menu", this.Menu);
+    // debugger;
+  },
 };
 </script>
 <style lang="scss" scoped>
@@ -294,7 +328,7 @@ export default {
   }
   .returnBtn {
     position: absolute;
-    top: 45px;
+    top: 30px;
     right: 40px;
     z-index: 111;
   }

src/views/zdry/xbtj.vue

 <!--
  * @Author: your name
  * @Date: 2021-09-03 09:32:50
- * @LastEditTime: 2021-09-03 16:20:30
+ * @LastEditTime: 2021-09-03 16:48:45
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: \founder_vue\src\views\zdry\dytj.vue
 -->
 <template>
   <div id="dytj">
-    <div id="charts" ref="charts" v-show="type == 'map'"></div>
+    <div id="charts" ref="charts" v-show="type == 'map'" v-loading="loading"></div>
     <div id="table" v-show="type == 'table'">
       <rightContent
         @returnBtn="type = 'map'"
@@ -94,6 +94,7 @@ export default {
           disabled: false,
         },
       ],
+      loading: true
     };
   },
   methods: {
@@ -222,10 +223,12 @@ export default {
     },
     //下钻处理接口事件
     getChartsData(xzqhdm) {
+      this.loading = true;
       let params = new Object();
       if (xzqhdm) params.xzqhdm = xzqhdm;
       ryXbTj(params).then((res) => {
         if (res.success && res.code == 200) {
+          this.loading = false;
           if (res.data.rows.length > 0) {
             let xData = res.data.rows.map((i) => ({
               name: i.xbmc,