山水工程列表

src/components/echartsTemplate/pie.vue

@@ -60,19 +60,19 @@ let option = {
         name: {
           color: "#fff", //#BCD3E5
           fontSize: 14,
-          width: 60,
+          // width: 60,
         },
         value: {
           color: "#64DAFF",
           fontSize: 14,
           padding: [5, 4],
           align: "center",
-          width: 40,
+          // width: 40,
         },
         unit: {
           color: "#fff", //#BCD3E5
           fontSize: 14,
-          width: 5,
+          // width: 5,
         },
       },
     },
@@ -207,14 +207,17 @@ export default {
       }
       option.legend.right = cartData.legend_right || "2%";
       let max = cartData.max || 4;
-      option.legend.textStyle.rich.name.width = max * 15;
+      // option.legend.textStyle.rich.name.width = max * 15;
       option.legend.formatter = function (name) {
         const sItem = cartData.data.find((item) =>
           `${item.name}`.includes(`${name}`)
         );
         if (sItem) {
           let aname = name.length > max ? name.substr(0, max) + "..." : name;
-          return `{name|${aname}}  {value|${sItem.value}}  {unit|${_this.$props.unit}} `;
+          let ratio = cartData.total
+            ? "," + ((sItem.value / cartData.total) * 100).toFixed(2) + "%"
+            : "";
+          return `{name|${aname}}  {value|${sItem.value}}  {unit|${_this.$props.unit}${ratio}}`;
           // return name + 'sItem.value';
         } else {
           return name;
@@ -230,7 +233,6 @@ export default {
         option.title.show = true;
       } else {
         option.title.show = false;
-
       }
       this.myChart.resize();
       this.myChart.setOption(option);

src/store/store.js

@@ -39,9 +39,9 @@ var store2 = {
         checkedData: null,
         sceneLayerlist: [],
         flattenNames: [],//存储压平的名称数组
-        cockpit_date: null,
-        cockpit_region: {id:'4602',name :'三亚市'},//行政区划
-        region_tree:[],//行政区划树
+        cockpit_date: ['', ''],
+        cockpit_region: { id: '4602', name: '三亚市' },//行政区划
+        region_tree: [],//行政区划树
         viewer_flag: true,
         xzqh_flag: true,
         query_pick_pane: [],
@@ -132,7 +132,7 @@ var store2 = {
             tbmj_ys: 0,
             isNightSwitch: false, //夜景状态（中图）
         },
-        vectordataid:0,
+        vectordataid: 0,
     },
     setisInitViewer(newValue) {
         this.state.isInitViewer = newValue;
@@ -268,13 +268,13 @@ var store2 = {
         this.state.cockpit_date = newValue;
     }, setCockpitGkzb(newValue) {
         this.state.cockpit_gkzb = newValue;
-    }, 
+    },
     setCockpitRegion(newValue) {
         this.state.cockpit_region = newValue;
-    }, 
+    },
     setRegionTree(newValue) {
         this.state.region_tree = newValue;
-    }, 
+    },
     setViewerFlagb(newValue) {
         this.state.viewer_flag = newValue;
     },

src/views/LandscapeProject/index.vue

@@ -22,11 +22,35 @@ export default {
     return {};
   },
   created() {},
-  mounted() {},
+  mounted() {
+    this.draw_vector();
+  },
   methods: {
     changeData(name, updata) {
       this[name] = updata;
     },
+    draw_vector() {
+      // store.setViewerFlagb(false);
+      // store.setToolBarShow(false);
+      // store.setXzqh_flag(false);
+      store.setCockpit_vector({
+        title: "山水工程项目",
+        word: "项目名称",
+        mapType: "jsc_stxf_ssxf_layer",
+        tableData: [],
+        tablejscType: `jsc_stxf_ywlx_ssxfmx`,
+        columns: [
+          "项目名称",
+          "治理面积(公顷)",
+          "投资金额(万元)",
+          "区县编码",
+          "区县编码名称",
+          "治理时间",
+          "治理进度",
+          "备注",
+        ],
+      });
+    },
   },
   watch: {
     activeTabs(newValue) {},

src/views/cockpit/common/VectorSpace/BoxCommonVector.vue

@@ -3,89 +3,97 @@
     <div class="innerContainerVector leftPaneVector" v-drag>
       <h2 class="PangetitleVector darg-div">
         <span class="pange_textVector">{{ title }}</span>
+        <slot name="title"></slot>
+        <i
+          class="el-icon-close"
+          v-if="$route.path == '/overview'"
+          @click="close"
+        ></i>
       </h2>
-      <i class="el-icon-close" @click="close"></i>
-      <el-input
-        v-if="word"
-        clearable
-        v-model="state"
-        @input="change_witch"
-        class="search"
-        placeholder="请输入内容"
-      ></el-input>
-      <div class="searchDiv" v-else>
-        <div class="sidiv" v-for="sitem in searchs" :key="sitem.key">
-          <el-input
-            v-if="sitem.type == 'input'"
-            clearable
-            v-model="searchform[sitem.key]"
-            @input="change_witch"
-            class="search"
-            :placeholder="sitem.label"
-          ></el-input>
-          <el-select
-            v-else-if="sitem.type == 'select'"
-            clearable
-            v-model="searchform[sitem.key]"
-            :placeholder="sitem.label"
-            @change="change_witch"
-          >
-            <el-option
-              v-for="item in sitem.options"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value"
-            ></el-option>
-          </el-select>
-          <!-- clearable -->
-          <el-cascader
-            v-else-if="sitem.type == 'cascader'"
-            v-model="searchform[sitem.key]"
-            :show-all-levels="false"
-            :options="sitem.options"
-            :placeholder="sitem.label"
-            :props="{
-              checkStrictly: true,
-              expandTrigger: 'hover',
-              emitPath: false,
-            }"
-            @change="change_witch"
-          ></el-cascader>
+      <template v-if="islist">
+        <el-input
+          v-if="word"
+          clearable
+          v-model="state"
+          @input="change_witch"
+          class="search"
+          placeholder="请输入内容"
+        ></el-input>
+        <div class="searchDiv" v-else>
+          <div class="sidiv" v-for="sitem in searchs" :key="sitem.key">
+            <el-input
+              v-if="sitem.type == 'input'"
+              clearable
+              v-model="searchform[sitem.key]"
+              @input="change_witch"
+              class="search"
+              :placeholder="sitem.label"
+            ></el-input>
+            <el-select
+              v-else-if="sitem.type == 'select'"
+              clearable
+              v-model="searchform[sitem.key]"
+              :placeholder="sitem.label"
+              @change="change_witch"
+            >
+              <el-option
+                v-for="item in sitem.options"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              ></el-option>
+            </el-select>
+            <!-- clearable -->
+            <el-cascader
+              v-else-if="sitem.type == 'cascader'"
+              v-model="searchform[sitem.key]"
+              :show-all-levels="false"
+              :options="sitem.options"
+              :placeholder="sitem.label"
+              :props="{
+                checkStrictly: true,
+                expandTrigger: 'hover',
+                emitPath: false,
+              }"
+              @change="change_witch"
+            ></el-cascader>
+          </div>
         </div>
-      </div>
-      <el-table
-        :row-class-name="tableRowClassName"
-        ref="singleTable"
-        :data="active_dableData"
-        style="width: 100%"
-        height="650"
-        :header-cell-style="{
-          background: 'rgba(10, 25, 38, 0.6)',
-          color: '#66b1ff',
-          fontSize: '14px',
-          fontFamily: 'Microsoft YaHei',
-          fontWeight: '400',
-        }"
-      >
-        <el-table-column
-          show-overflow-tooltip="true"
-          v-for="(item, index) in store.state.cockpit_vector.columns"
-          :key="index"
-          :width="index ? 100 : 150"
-          :prop="item"
-          :label="item"
+        <el-table
+          :row-class-name="tableRowClassName"
+          ref="singleTable"
+          :data="active_dableData"
+          style="width: 100%"
+          height="650"
+          :header-cell-style="{
+            background: 'rgba(10, 25, 38, 0.6)',
+            color: '#66b1ff',
+            fontSize: '14px',
+            fontFamily: 'Microsoft YaHei',
+            fontWeight: '400',
+          }"
         >
-        </el-table-column>
-
-        <el-table-column fixed="right" label="操作" width="50">
-          <template slot-scope="scope">
-            <!-- <el-button @click="info(scope.row)" type="text" size="small">详情</el-button> -->
-            <el-button @click="go(scope.row)" type="text" size="small"
-              >定位</el-button
-            >
-          </template>
-        </el-table-column>
-      </el-table>
+          <el-table-column
+            show-overflow-tooltip="true"
+            v-for="(item, index) in store.state.cockpit_vector.columns"
+            :key="index"
+            :width="index ? 100 : 150"
+            :prop="item"
+            :label="item"
+          >
+          </el-table-column>
+
+          <el-table-column fixed="right" label="操作" width="50">
+            <template slot-scope="scope">
+              <!-- <el-button @click="info(scope.row)" type="text" size="small">详情</el-button> -->
+              <el-button @click="go(scope.row)" type="text" size="small"
+                >定位</el-button
+              >
+            </template>
+          </el-table-column>
+        </el-table>
+      </template>
+      <slot name="all" v-else></slot>
     </div>
   </div>
 </template>
@@ -100,6 +108,12 @@ import * as turf from "@turf/turf";
 let BoxCommonVector_entity = null;
 let layerSources = {};
 export default {
+  props: {
+    islist: {
+      type: Boolean,
+      default: true,
+    },
+  },
   data() {
     return {
       state: "",
@@ -124,9 +138,16 @@ export default {
     },
     async draw_vector_server(jscType, goitrem) {
       let res = await QueryOne({ jscType, id: "4602" });
-      this.layersData = { ...res.data, title: this.title };
+      this.layersData = {
+        ...res.data,
+        title: this.title,
+        id: "81f91e995b80435184cc51519bf0c1d3",
+      };
       if (goitrem) this.go(goitrem);
-      else tdsy.addLayer(this.layersData);
+      else {
+        tdsy.addLayer(this.layersData);
+        store.state.vectorlayerlist.push(this.layersData);
+      }
       // this.Getlayers(res.data.url);
     },
     async Getlayers(mapurl) {
@@ -487,7 +508,7 @@ export default {
     },
     async init_vector(params) {
       const that = this;
-
+      console.log(store.state.cockpit_date, "--");
       let obj = {
         jscType: store.state.cockpit_vector.tablejscType,
         beginTime: store.state.cockpit_date[0],
@@ -602,12 +623,12 @@ div::-webkit-scrollbar {
   width: 100%;
   height: 100%;
   position: absolute;
-  left: -1rem;
+  left: 0rem;
   top: 0rem;
 }
 
 .innerContainerVector {
-  width: 350px;
+  width: 430px;
   height: 760px; //calc(100% - 20px);
   position: absolute;
   top: 28px;
@@ -660,13 +681,13 @@ div::-webkit-scrollbar {
     border-radius: 4px;
     top: -1.9rem !important;
     position: relative;
-    right: -19.5rem;
+    right: -24rem;
   }
 
   .PangetitleVector {
     box-sizing: border-box;
     width: 100%;
-    height: 35px;
+    height: 42px;
     background: url("/static/images/overview/titlebox.gif") no-repeat !important;
     background-size: 100% 100% !important;
     line-height: 35px;

src/views/complianceAnalysis/components/scjg.vue

@@ -317,36 +317,6 @@ export default {
     }
   }
 
-  .echars {
-    margin-bottom: 10px;
-    .echartTitle {
-      width: 100%;
-      height: 40px;
-      display: flex;
-      justify-content: space-between;
-      // background: rgba(38, 38, 38, 0.9);
-      border-bottom: 1px solid #166cad;
-      margin-right: 10px;
-      line-height: 40px;
 
-      .block-title {
-        width: calc(100% - 50px);
-      }
-      .eshow {
-        background-image: url("/static/images/ghzc/to_bottom.png");
-      }
-      .eclose {
-        background-image: url("/static/images/ghzc/to_right.png");
-      }
-    }
-    .echart {
-      width: 380px;
-      height: 220px;
-    }
-    .echart_vertical {
-      width: 380px;
-      height: 370px;
-    }
-  }
 }
 </style>

src/views/complianceAnalysis/ghzc.scss

@@ -160,6 +160,43 @@
         }
     }
 
+    .echars {
+        margin-bottom: 10px;
+
+        .echartTitle {
+            width: 100%;
+            height: 40px;
+            display: flex;
+            justify-content: space-between;
+            // background: rgba(38, 38, 38, 0.9);
+            border-bottom: 1px solid #166cad;
+            margin-right: 10px;
+            line-height: 40px;
+
+            .block-title {
+                width: calc(100% - 50px);
+            }
+
+            .eshow {
+                background-image: url("/static/images/ghzc/to_bottom.png");
+            }
+
+            .eclose {
+                background-image: url("/static/images/ghzc/to_right.png");
+            }
+        }
+
+        .echart {
+            width: 380px;
+            height: 220px;
+        }
+
+        .echart_vertical {
+            width: 380px;
+            height: 370px;
+        }
+    }
+
     // .el-button--primary {
     //     color: #409eff;
     //     background: #ecf5ff;