地图初始化暂时关闭canvas方法，修改上传数据

src/components/common/BottomForm/UploadingData.vue

@@ -1,6 +1,11 @@
 <template>
   <!-- 上传数据弹窗 -->
-  <el-dialog title="上传数据" :visible.sync="dialogVisible" :before-close="handleClose" width="400px">
+  <el-dialog
+    title="上传数据"
+    :visible.sync="dialogVisible"
+    :before-close="handleClose"
+    width="400px"
+  >
     <template slot="title">
       <div class="dialogTitle">
         <div class="dialogTitleIcon"></div>
@@ -34,12 +39,19 @@
       >
         <i class="el-icon-upload"></i>
         <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
-        <div class="el-upload__tip" slot="tip">*仅支持Geojson格式文件，且不超过5MB</div>
+        <div class="el-upload__tip" slot="tip">
+          *仅支持Geojson格式文件，且不超过5MB
+        </div>
       </el-upload>
     </div>
     <span slot="footer" class="dialog-footer">
       <el-button @click="clearDialogVisible()">取 消</el-button>
-      <el-button type="primary" :disabled="dataUpState" @click="subMitDialogVisible()">确 定</el-button>
+      <el-button
+        type="primary"
+        :disabled="dataUpState"
+        @click="subMitDialogVisible()"
+        >确 定</el-button
+      >
     </span>
   </el-dialog>
 </template>
@@ -64,7 +76,7 @@ export default {
       // 上传文件列表
       fileList: [],
       // 上传数据弹窗显示状态
-      dialogVisible: false
+      dialogVisible: false,
     };
   },
   mounted() {
@@ -73,7 +85,7 @@ export default {
     this.$bus.$on("scsj", () => {
       this.changeShowBottomMenusStatus();
     });
-    this.$Get("./static/json/simplified_pdgeojson.json").then(res => {
+    this.$Get("./static/json/simplified_pdgeojson.json").then((res) => {
       this.pd = res;
     });
   },
@@ -105,21 +117,33 @@ export default {
     // 上传数据表单提交
     subMitDialogVisible() {
       if (this.townMap.size == 0) {
-        this.$store.state.selectSelectDataMap.associatedItems.forEach(v => {
+        this.$store.state.selectSelectDataMap.associatedItems.forEach((v) => {
           this.townMap.set(v.name, v.index);
         });
       }
       if (this.townMap.size > 0) {
         let that = this;
-        shp("http://127.0.0.1:8089/dz").then(function (geojson) {
-          window.geojsontu = geojson;
-          that.postDataSize = geojson.features.length;
-          that.dataUpState = true;
-          let pdData = that.pd.features;
-          that.addData(pdData);
-        });
+        // shp("http://127.0.0.1:8089/dz").then(function (geojson) {
+        //   window.geojsontu = geojson;
+        //   that.postDataSize = geojson.features.length;
+        //   that.dataUpState = true;
+        //   let pdData = that.pd.features;
+        //   that.addPreModelData(pdData);
+        // });
+        shp("http://127.0.0.1:5500/nzy_performance/zjz/PermFarmland").then(
+          function (geojson) {
+            debugger;
+            window.geojsontu = geojson;
+            that.postDataSize = geojson.features.length;
+            that.dataUpState = true;
+            let pdData = that.pd.features;
+            that.addAllLayerData(pdData);
+          }
+        );
       } else {
-        this.$message.error("浦东新区行政区划数据未获取，请尝试刷新页面并重试！");
+        this.$message.error(
+          "浦东新区行政区划数据未获取，请尝试刷新页面并重试！"
+        );
       }
       // this.clearDialogVisible();
     },
@@ -134,7 +158,9 @@ export default {
     // 文件超出个数限制时
     handleExceed(files, fileList) {
       this.$message.warning(
-        `当前限制选择 1 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`
+        `当前限制选择 1 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
+          files.length + fileList.length
+        } 个文件`
       );
     },
     // 删除文件之前
@@ -155,7 +181,8 @@ export default {
     },
     // 读取file对象内容
     getActionData(file) {},
-    addData(pdData) {
+    // 添加预设模型数据
+    addPreModelData(pdData) {
       let geojsondata = window.geojsontu.features[this.postIndex];
       if (geojsondata && this.postIndex < this.postDataSize) {
         delete geojsondata["geometry"]["bbox"];
@@ -168,7 +195,7 @@ export default {
           镇域名称: "",
           xzqh: "",
           图层构成: "",
-          性质: ""
+          性质: "",
         };
         let coordinates = "";
         let testPolygon = "";
@@ -193,12 +220,18 @@ export default {
           let pdPolygon = turf.polygon(pdPolygonCoord);
 
           if (type === "Polygon") {
-            if (testPolygon != "" && pdPolygon != "" && turf.intersect(testPolygon, pdPolygon)) {
+            if (
+              testPolygon != "" &&
+              pdPolygon != "" &&
+              turf.intersect(testPolygon, pdPolygon)
+            ) {
               targetProperties.面积 = area;
               targetProperties.性质 = "基本农田被侵占";
               targetProperties.图层构成 = "基本农田和2020年森林";
               targetProperties.镇域名称 = pdData[j].properties.NAME;
-              targetProperties.xzqh = this.townMap.get(pdData[j].properties.NAME);
+              targetProperties.xzqh = this.townMap.get(
+                pdData[j].properties.NAME
+              );
               geojsondata.properties = targetProperties;
               break;
             }
@@ -206,13 +239,16 @@ export default {
             if (
               outerPolygon != "" &&
               innerPolygon != "" &&
-              (turf.intersect(pdPolygon, outerPolygon) || turf.intersect(pdPolygon, innerPolygon))
+              (turf.intersect(pdPolygon, outerPolygon) ||
+                turf.intersect(pdPolygon, innerPolygon))
             ) {
               targetProperties.面积 = area;
               targetProperties.性质 = "基本农田被侵占";
               targetProperties.图层构成 = "基本农田和2020年森林";
               targetProperties.镇域名称 = pdData[j].properties.NAME;
-              targetProperties.xzqh = this.townMap.get(pdData[j].properties.NAME);
+              targetProperties.xzqh = this.townMap.get(
+                pdData[j].properties.NAME
+              );
               geojsondata.properties = targetProperties;
               break;
             }
@@ -241,24 +277,65 @@ export default {
           c_editor_name: "liumouren",
           c_xzqh: xzqh,
           content: "测试录入数据",
-          title: "lmr-t" + this.postIndex
+          title: "lmr-t" + this.postIndex,
+        };
+        params.append("content", JSON.stringify(data));
+        this.$Post(this.urlsCollection.addContent, params).then(
+          (res) => {
+            if (res.code === 200) {
+              this.postIndex += 1;
+              this.addPreModelData(pdData);
+            } else {
+              this.$message.error(res.message);
+            }
+          },
+          (error) => {
+            this.$message.error(error);
+          }
+        );
+      } else {
+        this.$message.success("文件上传完成");
+        this.dataUpState = false;
+      }
+    },
+    // 上传所有图层数据
+    // 当前数据 -- 张江镇 - 永久基本农田
+    addAllLayerData(pdData) {
+      let geojsondata = window.geojsontu.features[this.postIndex];
+      if (geojsondata && this.postIndex < this.postDataSize) {
+        delete geojsondata["geometry"]["bbox"];
+        // 封装参数
+        let xzqh = geojsondata.properties.xzqh;
+        geojsondata = JSON.stringify(geojsondata);
+        let params = new FormData();
+        params.append("columnId", "510");
+        params.append("modelId", "118");
+        var data = {
+          c_boolean: false,
+          c_content: geojsondata,
+          c_date_time: (new Date().getTime() / 1000).toFixed(0) * 1000,
+          c_editorid: 4,
+          c_editor_name: "gaolu",
+          c_xzqh: xzqh,
+          content: "测试录入数据",
+          title: "gl-t" + this.postIndex,
         };
         params.append("content", JSON.stringify(data));
         this.$Post(this.urlsCollection.addContent, params).then(
-          res => {
+          (res) => {
             if (res.code === 200) {
               this.postIndex += 1;
-              this.addData(pdData);
+              this.addAllLayerData(pdData);
             } else {
               this.$message.error(res.message);
             }
           },
-          error => {
+          (error) => {
             this.$message.error(error);
           }
         );
       } else {
-        this.$message.success("文件上传完成")
+        this.$message.success("文件上传完成");
         this.dataUpState = false;
       }
     },
@@ -274,9 +351,9 @@ export default {
       //   this.$message.error("上传文件大小不能超过 10MB!");
       // }
       // return isJPG && isLt5M;
-    }
+    },
   },
-  watch: {}
+  watch: {},
 };
 </script>
 <style lang="less" scoped>
@@ -291,10 +368,18 @@ export default {
   }
   ::v-deep .el-progress-bar__outer {
     background-color: transparent;
-    background-image: linear-gradient(90deg, #007dff32 0%, #00ffff32 100%) !important;
+    background-image: linear-gradient(
+      90deg,
+      #007dff32 0%,
+      #00ffff32 100%
+    ) !important;
   }
   ::v-deep .el-progress-bar__inner {
-    background-image: linear-gradient(90deg, #007dff 0%, #00ffff 100%) !important;
+    background-image: linear-gradient(
+      90deg,
+      #007dff 0%,
+      #00ffff 100%
+    ) !important;
   }
 }
 </style>

src/components/map/MapHolder.vue

@@ -540,7 +540,7 @@ export default {
         zoomControl: false,
         minZoom: 10,
         maxZoom: 19,
-        preferCanvas: true,
+        // preferCanvas: true,
       }).setView(systemConfig.mapViewer.center, systemConfig.mapViewer.zoom);
 
       //添加默认图层

src/views/ComprehensiveAnalysis.vue

@@ -682,7 +682,9 @@ export default {
         );
       }
     },
-    getTableData() {},
+    getMapData(){
+      
+    },
     /**
      * 获取图层信息 -- 所有模型和预设模型
      * @columnId
@@ -691,7 +693,6 @@ export default {
      * @sourceType 土地资源/林地资源/生态资源/水资源/全部
      */
     displaySingleLayer(columnId, id, mainType, sourceType) {
-      debugger;
       // if (id !== "永久基本农田_50") {
       let uniqueId = id;
       this.layerIdMap.set(uniqueId, uniqueId);
@@ -707,6 +708,8 @@ export default {
       });
       // 图层未初始化
       if (!map2DViewer.analysisGroups[uniqueId]) {
+        map2DViewer.analysisGroups[uniqueId] = L.featureGroup();
+        map2DViewer.analysisGroups[uniqueId].addTo(map2DViewer.map);
         if (!this.layerLoading) {
           this.layerLoading = true;
         }
@@ -715,9 +718,10 @@ export default {
         layerParams = {
           columnId: columnId,
           states: "0,1,2,3",
-          pageSize: 800,
+          pageSize: 10000,
           page: 0,
         };
+
         this.$Post(this.urlsCollection.selectContentList, layerParams).then(
           (res) => {
             if (res.code === 202 && res.content === "数据不存在") {
@@ -731,17 +735,7 @@ export default {
               console.log(res.content.count, "count");
               // this.paginationData.currentPage = 1;
               this.paginationData.total = res.content.data.length;
-              map2DViewer.analysisGroups[uniqueId] = L.featureGroup();
-              map2DViewer.analysisGroups[uniqueId].addTo(map2DViewer.map);
-              // this.legendTitle.push({
-              //   name: uniqueId,
-              //   info: uniqueId,
-              // });
-              // this.legendIcon.push({
-              //   name: uniqueId,
-              //   background: "transparent",
-              //   border: `1px solid ${this.randomColor.get(uniqueId)}`,
-              // });
+
               if (!this.$store.state.selectSelectDataMap["singlePolygon"]) {
                 this.$store.state.selectSelectDataMap["singlePolygon"] = [];
               }
@@ -859,7 +853,10 @@ export default {
       }
 
       // 图层已初始化
-      if (map2DViewer.analysisGroups[uniqueId]) {
+      if (
+        map2DViewer.analysisGroups[uniqueId] &&
+        !map2DViewer.map.hasLayer(map2DViewer.analysisGroups[uniqueId])
+      ) {
         map2DViewer.map.addLayer(map2DViewer.analysisGroups[uniqueId]);
 
         if (mainType === "所有图层") {
@@ -1072,7 +1069,7 @@ export default {
 
           data.forEach((v) => {
             if (v) {
-              this.modelData.unshift(v);
+              this.modelData.push(v);
             }
           });