flat： 街道添加地图

src/components/city-cascader/main.vue

@@ -1,13 +1,19 @@
 <template>
-  <el-cascader
+  <div>
-    :options="area.data"
+    <el-cascader
-    :show-all-levels="showAllLevels"
+      :options="area.data"
-    v-model="model"
+      :show-all-levels="showAllLevels"
-    :filterable="filterable"
+      v-model="model"
-    :placeholder="placeholder"
+      :filterable="filterable"
-    :disabled="disabled"
+      :placeholder="placeholder"
-    :clearable="clearable"
+      :disabled="disabled"
-  ></el-cascader>
+      :clearable="clearable"
+      v-if="type !== 'view'"
+    ></el-cascader>
+    <div v-else>
+      {{ model2 }}
+    </div>
+  </div>
 </template>
 
 <script>
@@ -29,6 +35,9 @@ export default {
     showAllLevels: {type: Boolean, default: true},
     disabled: Boolean,
     clearable: Boolean,
+    type: {
+      default: 'custom',
+    }
   },
   data() {
     return {
@@ -79,6 +88,14 @@ export default {
         return null;
       },
     },
+    model2: {
+      get() {
+        if (this.county && this.county != -1) {
+          return `${this.area.dic[this.prov].label}-${this.area.dic[this.city].label}-${this.area.dic[this.county].label}`
+        }
+        return null;
+      },
+    },
   },
 };
 </script>

src/components/map/selectLocation2.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-content">
     <el-input
-      v-if="type !== 'view'"
+      v-if="showInput"
       :placeholder="placeholder"
       clearable
       v-model="addressLocation"
@@ -52,7 +52,7 @@ import {
   GetFeaturesByGeometryParameters
 } from '@supermap/iclient-ol';
 
-console.log(process.env.VUE_APP_SUPPER_MAP)
+const geoJSONParser = new GeoJSON();
 export default {
   name: "uMapView",
   props: {
@@ -114,6 +114,14 @@ export default {
       default: 'custom',
     }
   },
+  computed: {
+    showInput() {
+      if (this.type === 'view' || this.type === 'select') {
+        return false
+      }
+      return true
+    }
+  },
   data() {
     return {
       // 实例化对象
@@ -281,6 +289,13 @@ export default {
     careateFeature(result) {
       if (this.vectorSourceIcon) {
         this.vectorSourceIcon.clear()
+        const geojsonObject = {
+          type: 'FeatureCollection',
+          features: result,
+        };
+        this.vectorSourceIcon.addFeatures(geoJSONParser.readFeatures(geojsonObject))
+        this.vectorSourceIcon.changed()
+        return
       }
       const geojsonObject = {
         type: 'FeatureCollection',
@@ -288,7 +303,7 @@ export default {
       };
       // 创建一个图层作为点位
       this.vectorSourceIcon = new SourceVector({
-        features: new GeoJSON().readFeatures(geojsonObject)
+        features: geoJSONParser.readFeatures(geojsonObject)
       });
       this.vectorLayerIcon = new LayerVector({
         source: this.vectorSourceIcon,

src/views/manage/company/companyList.vue

@@ -17,7 +17,22 @@
         <jl-city-cascader :disabled="disabled" v-model="form.cityId"></jl-city-cascader>
       </template>
       <template slot="cityId" slot-scope="{ row }">
-        {{ row.cityId === -1 ? '' : row.cityId }}
+        <jl-city-cascader :type="'view'" :disabled="true" v-model="row.cityId"></jl-city-cascader>
+      </template>
+      <template slot="lonForm" slot-scope="{ row }">
+        <super-map-view
+          :isCanEdit="false"
+          @addAddress="changeAddress"
+          :longitude="row.lon <= 0 ? 104.397894 : row.lon"
+          :latitude="row.lat <= 0 ? 31.126855 : row.lat"
+          :open="true"
+          :zoom="10"
+          :min-zoom="10"
+          :max-zoom="20"
+          :flag-tip="false"
+          placeholder="请输入详细地址"
+          :type="'select'"
+        ></super-map-view>
       </template>
       <template slot="companyAddressForm" slot-scope="{ disabled }">
         <select-map
@@ -203,6 +218,7 @@ export default {
       },
       obj: {},
       data: [],
+      selectJW: null,
     };
   },
   computed: {
@@ -314,6 +330,7 @@ export default {
                 span: 20,
                 display: true,
                 prop: "cityId",
+                slot: true,
                 formslot: true,
                 rules: [
                   {
@@ -337,6 +354,14 @@ export default {
                   },
                 ],
               },
+              {
+                label: "所在地区",
+                prop: "lon",
+                hide: true,
+                span: 20,
+                display: true,
+                formslot: true,
+              },
             ],
           }
         ],
@@ -436,6 +461,9 @@ export default {
         }
       );
     },
+    changeAddress(val) {
+      this.selectJW = val
+    },
     rowUpdate(row, index, done, loading) {
       row.authUrlId = getPath(row.authUrlId);
       row.identityUrl4Id = getPath(row.identityUrl4Id);
@@ -444,6 +472,11 @@ export default {
       if (this.obj.address) {
         copyRow.companyAddress = this.obj.address
       }
+      if (this.selectJW) {
+        const {lng, lat} = this.selectJW
+        copyRow.lon = lng
+        copyRow.lat = lat
+      }
       update(copyRow).then(
         () => {
           this.onLoad(this.page);
@@ -540,6 +573,7 @@ export default {
       if (["add", "edit"].includes(type)) {
         this.imgList = [];
         this.initData();
+        this.selectJW = null
         done();
       }
       if (["edit", "view"].includes(type)) {