江河点位修正

src/api/gis/gisApi.js

@@ -36,6 +36,8 @@ const river = function (data) { // 江河水质数据查询
   return axios.post("/water/visualiz/river", data)
 }
 
+
+
 const waterStation = function (data) { // 水站数据查询
   return axios.post("/water/visualiz/waterStation", data)
 }
@@ -52,6 +54,10 @@ const waterVillage = function (data) { // 农村
   return axios.post("/drinkingWaterVillage/drinkingWaterVillage/villageGis", data)
 }
 
+
+const updateRiverCorrectLocation = function (data) { // 江河水质数据查询
+  return axios.post("/water/visualiz/updatePointLocation", data)
+}
 export {
   getLakePlace,
   getAirGis,
@@ -64,5 +70,6 @@ export {
   waterStation,
   waterCity,
   waterCounty,
-  waterVillage
+  waterVillage,
+  updateRiverCorrectLocation
 }

src/views/sound/road/dict/place.vue

@@ -235,6 +235,8 @@ export default {
         {title: "路宽", dataIndex: "roadWidth", sorter: true,},
         {title: "测点经度", dataIndex: "placeLng", sorter: true,},
         {title: "测点纬度", dataIndex: "placeLat", sorter: true,},
+        {title: "修正经度", dataIndex: "correctLng"},
+        {title: "修正纬度", dataIndex: "correctLat"},
         {
           title: "操作",
           key: "action",

src/views/visualiz/water/river/index.vue

@@ -30,7 +30,7 @@
 
         <a-select style="width: 200px;" v-if="currentRequestCata == '1'" @change="changeText" name="waterCate"
                   :default-value="currentCate">
-          <a-select-option v-for="(item,index) in waterCate" :key="index">
+          <a-select-option :value="item" v-for="(item,index) in waterCate" :key="index">
             {{ item }}
           </a-select-option>
         </a-select>
@@ -43,11 +43,17 @@
     <mapNominal :param="nominalList"></mapNominal>
     <!--    <map-table-center :rowData="pointData"></map-table-center>-->
     <map-table :columns="columns" :rowData="pointData"></map-table>
+
+    <a-modal @ok="updateCorrectLocation" :closable="false" :destroy-on-close="true" :width="1000" :body-style="{height:'700px'}"
+             v-model:visible="visibleRoadMap" :title="roadMapTitle"
+    >
+      <div style="width: 100%;height: 100%;" ref="roadMap" id="roadMap"></div>
+    </a-modal>
   </div>
 </template>
 <script>
 import {
-  river, national, waterStation, autonomous
+  river, national, waterStation, autonomous,updateRiverCorrectLocation
 } from "@/api/gis/gisApi";
 import {
   getColumnOptions,
@@ -160,6 +166,10 @@ export default {
         "common": "劣Ⅴ",
         "desc": "劣五类"
       }],
+      // 字典表单
+      visibleRoadMap: false,
+      roadMapTitle: "选择坐标",
+      form: {},
     };
   },
   mounted() {
@@ -172,7 +182,7 @@ export default {
       that.requestFun()
     },
     changeText: function (e) {
-      that.currentCate = that.waterCate[e]
+      that.currentCate = e
       that.requestFun()
     },
     changeCate: function (e) {
@@ -317,6 +327,13 @@ export default {
           that.currentY = 0
           that.tipFlag = false
         }, true)
+        myCompOverlay.addEventListener('contextmenu',function (e){
+          console.log("右键")
+          let currentId = e.target.getAttribute("id")
+          const {longitude, latitude, correctLng, correctLat,pointDictId} = that.pointData[currentId.substring(2, currentId.length)]
+          that.form = {longitude, latitude, correctLng, correctLat,pointDictId}
+          that.showRoadMap(that.form);
+        })
       })
     },
     whereChange(e) {
@@ -385,6 +402,87 @@ export default {
           }
         })
       }
+    },
+    showRoadMap(form) {
+      const {longitude, latitude, correctLng, correctLat} = form
+      this.visibleRoadMap = true
+      // this.roadMapTitle = "选择修正后的道路坐标"
+      this.$nextTick(() => {
+        console.log(this.$refs.roadMap)
+        // eslint-disable-next-line no-undef
+        var map = new BMap.Map(this.$refs.roadMap);    // 创建Map实例
+        // eslint-disable-next-line no-undef
+        map.addControl(new BMap.NavigationControl());  //初始化地图控件
+        // eslint-disable-next-line no-undef
+        map.addControl(new BMap.ScaleControl());
+        // eslint-disable-next-line no-undef
+        map.addControl(new BMap.OverviewMapControl());
+        // eslint-disable-next-line no-undef
+        var point = new BMap.Point(correctLng ? correctLng : longitude ? longitude : 108.33, correctLat ? correctLat : latitude ? latitude : 22.84);
+        // var point = new BBMap.Point(form.longitude ? form.longitude : 108.33, form.latitude ? form.latitude : 22.84);
+        map.centerAndZoom(point, 13);//初始化地图中心点
+        // eslint-disable-next-line no-undef
+        var marker = new BMap.Marker(point); //初始化地图标记
+        marker.enableDragging(); //标记开启拖拽
+        // eslint-disable-next-line no-undef
+        var gc = new BMap.Geocoder();//地址解析类
+        //添加标记拖拽监听
+        marker.addEventListener("dragend", (e) => {
+          //获取地址信息
+          this.form['correctLng'] = e.point.lng
+          this.form['correctLat'] = e.point.lat
+
+          gc.getLocation(e.point, function (rs) {
+            showLocationInfo(e.point, rs);
+          });
+        });
+
+        //添加标记点击监听
+        marker.addEventListener("click", function (e) {
+          gc.getLocation(e.point, function (rs) {
+            showLocationInfo(e.point, rs);
+          });
+        });
+
+        map.centerAndZoom(point, 15); //设置中心点坐标和地图级别
+        map.addOverlay(marker); //将标记添加到地图中
+        //显示地址信息窗口
+        function showLocationInfo(pt, rs) {
+          var opts = {
+            width: 250,     //信息窗口宽度
+            height: 100,     //信息窗口高度
+            title: ""  //信息窗口标题
+          }
+          var addComp = rs.addressComponents;
+          var addr = "当前位置：" + addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber + "<br/>";
+          addr += "纬度: " + pt.lat + ", " + "经度：" + pt.lng;
+          // eslint-disable-next-line no-undef
+          var infoWindow = new BMap.InfoWindow(addr, opts);  //创建信息窗口对象
+          marker.openInfoWindow(infoWindow);
+        }
+      })
+
+    },
+    updateCorrectLocation(){
+      const {correctLng, correctLat,pointDictId} =  that.form;
+      const reqData = {correctLng, correctLat,id:pointDictId};
+      if(this.currentRequestCata == "0"){
+        reqData.type = "river"
+      }else if(this.currentRequestCata == "1"){
+        if(this.currentCate == "国家水功能区"){
+          reqData.type = "national"
+        }else{
+          reqData.type = "auto"
+        }
+      }else{
+        reqData.type = "water"
+      }
+      updateRiverCorrectLocation(reqData).then(res=>{
+        if(res.data.code == 0){
+          this.requestFun()
+        }
+      })
+
     }
   }
 }

src/views/water/river/dict/api-relate.vue

@@ -21,7 +21,8 @@
           <a-col :lg="6" :md="12" :sm="24" :xs="24">
             <a-space>
               <a-button type="primary" @click="reload">查询</a-button>
-                            <a-button @click="reset" style="background: #FFA200FF; border-color: #FFA200FF;color: #FFFFFF">重置</a-button>
+              <a-button @click="reset" style="background: #FFA200FF; border-color: #FFA200FF;color: #FFFFFF">重置
+              </a-button>
             </a-space>
           </a-col>
         </a-row>
@@ -114,6 +115,24 @@
           <a-form-item label="纬度" name="latitude">
             <a-input v-model:value="form.latitude" placeholder="请输入纬度" allow-clear/>
           </a-form-item>
+          <a-form-item label="修正位置" name="correctLocation">
+            <a-input-search @search="showRoadMap(form)"
+                            :value="`[${form.correctLng},${form.correctLat}]`"
+                            placeholder="`[${form.longitude},${form.latitude}]`" allow-clear>
+              <template #enterButton>
+                <a-button>选择位置</a-button>
+              </template>
+            </a-input-search>
+          </a-form-item>
+
+          <a-modal :closable="false" :destroy-on-close="true" :width="1000" :body-style="{height:'700px'}"
+                   v-model:visible="visibleRoadMap" :title="roadMapTitle"
+          >
+            <div style="width: 100%;height: 100%;" ref="roadMap" id="roadMap"></div>
+            <template #footer>
+              <a-button key="submit" type="primary" @click="visibleRoadMap = false">确定</a-button>
+            </template>
+          </a-modal>
           <a-form-item label="备注" name="remark">
             <a-input v-model:value="form.remark" placeholder="请输入备注" allow-clear/>
           </a-form-item>
@@ -161,7 +180,8 @@
               >删除
               </a-button>
             </a-popconfirm>
-                        <a-button @click="exportData" style="background: #2FA524FF; border-color: #2FA524FF;color: #FFFFFF">导出</a-button>
+            <a-button @click="exportData" style="background: #2FA524FF; border-color: #2FA524FF;color: #FFFFFF">导出
+            </a-button>
           </a-space>
         </template>
         <template #action="{ record }">
@@ -171,7 +191,8 @@
               type="primary"
               shape="round"
               size="small"
-                        >修改</a-button
+            >修改
+            </a-button
             >
             <a-popconfirm
               :title="`确认删除这条数据吗?`"
@@ -180,7 +201,8 @@
               @confirm="remove(record)"
             >
               <a-button type="primary" danger shape="round" size="small"
-                            >删除</a-button
+              >删除
+              </a-button
               >
             </a-popconfirm>
           </a-space>
@@ -294,6 +316,8 @@ export default {
           title: "纬度",
           dataIndex: "latitude",
         },
+        {title: "修正经度", dataIndex: "correctLng"},
+        {title: "修正纬度", dataIndex: "correctLat"},
         {
           title: "备注",
           dataIndex: "remark",
@@ -329,6 +353,8 @@ export default {
       showNYear: false,
       cYear: undefined,
       nYear: undefined,
+      visibleRoadMap: false,
+      roadMapTitle: "选择坐标",
     };
   },
   mounted() {
@@ -486,7 +512,67 @@ export default {
 
       let sheet = XLSX.utils.aoa_to_sheet(arr);
       this.$util.exportSheet(XLSX, sheet, new Date().getTime().toString());
+    },
+    showRoadMap(form) {
+      const {longitude, latitude, correctLng, correctLat} = form
+      this.visibleRoadMap = true
+      this.roadMapTitle = "选择修正后的道路坐标"
+      this.$nextTick(() => {
+        console.log(this.$refs.roadMap)
+        // eslint-disable-next-line no-undef
+        var map = new BMap.Map(this.$refs.roadMap);    // 创建Map实例
+        // eslint-disable-next-line no-undef
+        map.addControl(new BMap.NavigationControl());  //初始化地图控件
+        // eslint-disable-next-line no-undef
+        map.addControl(new BMap.ScaleControl());
+        // eslint-disable-next-line no-undef
+        map.addControl(new BMap.OverviewMapControl());
+        // eslint-disable-next-line no-undef
+        var point = new BMap.Point(correctLng ? correctLng : longitude ? longitude : 108.33, correctLat ? correctLat : latitude ? latitude : 22.84);
+        // var point = new BBMap.Point(form.longitude ? form.longitude : 108.33, form.latitude ? form.latitude : 22.84);
+        map.centerAndZoom(point, 13);//初始化地图中心点
+        // eslint-disable-next-line no-undef
+        var marker = new BMap.Marker(point); //初始化地图标记
+        marker.enableDragging(); //标记开启拖拽
+        // eslint-disable-next-line no-undef
+        var gc = new BMap.Geocoder();//地址解析类
+        //添加标记拖拽监听
+        marker.addEventListener("dragend", (e) => {
+          //获取地址信息
+          this.form['correctLng'] = e.point.lng
+          this.form['correctLat'] = e.point.lat
+
+          gc.getLocation(e.point, function (rs) {
+            showLocationInfo(e.point, rs);
+          });
+        });
+
+        //添加标记点击监听
+        marker.addEventListener("click", function (e) {
+          gc.getLocation(e.point, function (rs) {
+            showLocationInfo(e.point, rs);
+          });
+        });
+
+        map.centerAndZoom(point, 15); //设置中心点坐标和地图级别
+        map.addOverlay(marker); //将标记添加到地图中
+        //显示地址信息窗口
+        function showLocationInfo(pt, rs) {
+          var opts = {
+            width: 250,     //信息窗口宽度
+            height: 100,     //信息窗口高度
+            title: ""  //信息窗口标题
           }
+          var addComp = rs.addressComponents;
+          var addr = "当前位置：" + addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber + "<br/>";
+          addr += "纬度: " + pt.lat + ", " + "经度：" + pt.lng;
+          // eslint-disable-next-line no-undef
+          var infoWindow = new BMap.InfoWindow(addr, opts);  //创建信息窗口对象
+          marker.openInfoWindow(infoWindow);
+        }
+      })
+
+    },
 
 
   },

src/views/water/river/dict/autonomous.vue

@@ -21,7 +21,8 @@
           <a-col :lg="6" :md="12" :sm="24" :xs="24">
             <a-space>
               <a-button type="primary" @click="reload">查询</a-button>
-                            <a-button @click="reset" style="background: #FFA200FF; border-color: #FFA200FF;color: #FFFFFF">重置</a-button>
+              <a-button @click="reset" style="background: #FFA200FF; border-color: #FFA200FF;color: #FFFFFF">重置
+              </a-button>
             </a-space>
           </a-col>
         </a-row>
@@ -44,7 +45,8 @@
           :wrapper-col="{ md: { span: 18 }, sm: { span: 24 } }"
         >
           <a-form-item label="新年份" name="nYear">
-                        <a-input-number autonomousWaterFunctionAreaPointId="inputNumber" v-model:value="nYear" :min="1970" :max="2050" />
+            <a-input-number autonomousWaterFunctionAreaPointId="inputNumber" v-model:value="nYear" :min="1970"
+                            :max="2050"/>
           </a-form-item>
         </a-form>
       </a-modal>
@@ -116,6 +118,24 @@
           <a-form-item label="纬度" name="latitude">
             <a-input v-model:value="form.latitude" placeholder="请输入纬度" allow-clear/>
           </a-form-item>
+          <a-form-item label="修正位置" name="correctLocation">
+            <a-input-search @search="showRoadMap(form)"
+                            :value="`[${form.correctLng},${form.correctLat}]`"
+                            placeholder="`[${form.longitude},${form.latitude}]`" allow-clear>
+              <template #enterButton>
+                <a-button>选择位置</a-button>
+              </template>
+            </a-input-search>
+          </a-form-item>
+
+          <a-modal :closable="false" :destroy-on-close="true" :width="1000" :body-style="{height:'700px'}"
+                   v-model:visible="visibleRoadMap" :title="roadMapTitle"
+          >
+            <div style="width: 100%;height: 100%;" ref="roadMap" id="roadMap"></div>
+            <template #footer>
+              <a-button key="submit" type="primary" @click="visibleRoadMap = false">确定</a-button>
+            </template>
+          </a-modal>
           <a-form-item label="备注" name="remark">
             <a-input
               v-model:value="form.remark"
@@ -170,7 +190,8 @@
               >删除
               </a-button>
             </a-popconfirm>
-                        <a-button @click="exportData" style="background: #2FA524FF; border-color: #2FA524FF;color: #FFFFFF">导出</a-button>
+            <a-button @click="exportData" style="background: #2FA524FF; border-color: #2FA524FF;color: #FFFFFF">导出
+            </a-button>
           </a-space>
         </template>
         <template #action="{ record }">
@@ -180,7 +201,8 @@
               type="primary"
               shape="round"
               size="small"
-                        >修改</a-button
+            >修改
+            </a-button
             >
             <a-popconfirm
               :title="`确认删除这条数据吗?`"
@@ -189,7 +211,8 @@
               @confirm="remove(record)"
             >
               <a-button type="primary" danger shape="round" size="small"
-                            >删除</a-button
+              >删除
+              </a-button
               >
             </a-popconfirm>
           </a-space>
@@ -294,6 +317,8 @@ export default {
           title: "纬度",
           dataIndex: "latitude",
         },
+        {title: "修正经度", dataIndex: "correctLng"},
+        {title: "修正纬度", dataIndex: "correctLat"},
         {
           title: "备注",
           dataIndex: "remark",
@@ -329,6 +354,8 @@ export default {
       showNYear: false,
       cYear: undefined,
       nYear: undefined,
+      visibleRoadMap: false,
+      roadMapTitle: "选择坐标",
     };
   },
   mounted() {
@@ -485,7 +512,67 @@ export default {
 
       let sheet = XLSX.utils.aoa_to_sheet(arr);
       this.$util.exportSheet(XLSX, sheet, new Date().getTime().toString());
+    },
+    showRoadMap(form) {
+      const {longitude, latitude, correctLng, correctLat} = form
+      this.visibleRoadMap = true
+      this.roadMapTitle = "选择修正后的道路坐标"
+      this.$nextTick(() => {
+        console.log(this.$refs.roadMap)
+        // eslint-disable-next-line no-undef
+        var map = new BMap.Map(this.$refs.roadMap);    // 创建Map实例
+        // eslint-disable-next-line no-undef
+        map.addControl(new BMap.NavigationControl());  //初始化地图控件
+        // eslint-disable-next-line no-undef
+        map.addControl(new BMap.ScaleControl());
+        // eslint-disable-next-line no-undef
+        map.addControl(new BMap.OverviewMapControl());
+        // eslint-disable-next-line no-undef
+        var point = new BMap.Point(correctLng ? correctLng : longitude ? longitude : 108.33, correctLat ? correctLat : latitude ? latitude : 22.84);
+        // var point = new BBMap.Point(form.longitude ? form.longitude : 108.33, form.latitude ? form.latitude : 22.84);
+        map.centerAndZoom(point, 13);//初始化地图中心点
+        // eslint-disable-next-line no-undef
+        var marker = new BMap.Marker(point); //初始化地图标记
+        marker.enableDragging(); //标记开启拖拽
+        // eslint-disable-next-line no-undef
+        var gc = new BMap.Geocoder();//地址解析类
+        //添加标记拖拽监听
+        marker.addEventListener("dragend", (e) => {
+          //获取地址信息
+          this.form['correctLng'] = e.point.lng
+          this.form['correctLat'] = e.point.lat
+
+          gc.getLocation(e.point, function (rs) {
+            showLocationInfo(e.point, rs);
+          });
+        });
+
+        //添加标记点击监听
+        marker.addEventListener("click", function (e) {
+          gc.getLocation(e.point, function (rs) {
+            showLocationInfo(e.point, rs);
+          });
+        });
+
+        map.centerAndZoom(point, 15); //设置中心点坐标和地图级别
+        map.addOverlay(marker); //将标记添加到地图中
+        //显示地址信息窗口
+        function showLocationInfo(pt, rs) {
+          var opts = {
+            width: 250,     //信息窗口宽度
+            height: 100,     //信息窗口高度
+            title: ""  //信息窗口标题
           }
+          var addComp = rs.addressComponents;
+          var addr = "当前位置：" + addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber + "<br/>";
+          addr += "纬度: " + pt.lat + ", " + "经度：" + pt.lng;
+          // eslint-disable-next-line no-undef
+          var infoWindow = new BMap.InfoWindow(addr, opts);  //创建信息窗口对象
+          marker.openInfoWindow(infoWindow);
+        }
+      })
+
+    },
 
 
   },

src/views/water/river/dict/place.vue

@@ -104,6 +104,23 @@
           <a-form-item label="纬度" name="latitude">
               <a-input v-model:value="form.latitude" placeholder="请输入纬度" allow-clear />
           </a-form-item>
+          <a-form-item label="修正位置" name="correctLocation">
+            <a-input-search @search="showRoadMap(form)"
+                            :value="`[${form.correctLng},${form.correctLat}]`" placeholder="`[${form.longitude},${form.latitude}]`" allow-clear>
+              <template #enterButton>
+                <a-button>选择位置</a-button>
+              </template>
+            </a-input-search>
+          </a-form-item>
+
+          <a-modal :closable="false" :destroy-on-close="true" :width="1000" :body-style="{height:'700px'}"
+                   v-model:visible="visibleRoadMap" :title="roadMapTitle"
+          >
+            <div style="width: 100%;height: 100%;" ref="roadMap" id="roadMap"></div>
+            <template #footer>
+              <a-button key="submit" type="primary" @click="visibleRoadMap = false">确定</a-button>
+            </template>
+          </a-modal>
           <a-form-item label="序号" name="seq">
             <a-input v-model:value="form.seq" placeholder="请输入序号" allow-clear />
         </a-form-item>
@@ -263,6 +280,8 @@
               title: "纬度",
               dataIndex: "latitude",
           },
+          {title: "修正经度", dataIndex: "correctLng"},
+          {title: "修正纬度", dataIndex: "correctLat"},
           {
               title: "序号",
               dataIndex: "seq",
@@ -310,6 +329,8 @@
         showNYear: false,
         cYear: undefined,
         nYear: undefined,
+        visibleRoadMap: false,
+        roadMapTitle: "选择坐标",
       };
     },
     mounted() {
@@ -462,7 +483,67 @@
 
         let sheet = XLSX.utils.aoa_to_sheet(arr);
         this.$util.exportSheet(XLSX, sheet, new Date().getTime().toString());
+      },
+      showRoadMap(form) {
+        const {longitude,latitude,correctLng,correctLat} = form
+        this.visibleRoadMap = true
+        this.roadMapTitle = "选择修正后的道路坐标"
+        this.$nextTick(() => {
+          console.log(this.$refs.roadMap)
+          // eslint-disable-next-line no-undef
+          var map = new BMap.Map(this.$refs.roadMap);    // 创建Map实例
+          // eslint-disable-next-line no-undef
+          map.addControl(new BMap.NavigationControl());  //初始化地图控件
+          // eslint-disable-next-line no-undef
+          map.addControl(new BMap.ScaleControl());
+          // eslint-disable-next-line no-undef
+          map.addControl(new BMap.OverviewMapControl());
+          // eslint-disable-next-line no-undef
+          var point = new BMap.Point(correctLng?correctLng:longitude?longitude:108.33,correctLat?correctLat:latitude?latitude:22.84);
+          // var point = new BBMap.Point(form.longitude ? form.longitude : 108.33, form.latitude ? form.latitude : 22.84);
+          map.centerAndZoom(point, 13);//初始化地图中心点
+          // eslint-disable-next-line no-undef
+          var marker = new BMap.Marker(point); //初始化地图标记
+          marker.enableDragging(); //标记开启拖拽
+          // eslint-disable-next-line no-undef
+          var gc = new BMap.Geocoder();//地址解析类
+          //添加标记拖拽监听
+          marker.addEventListener("dragend", (e) => {
+            //获取地址信息
+            this.form['correctLng'] = e.point.lng
+            this.form['correctLat'] = e.point.lat
+
+            gc.getLocation(e.point, function (rs) {
+              showLocationInfo(e.point, rs);
+            });
+          });
+
+          //添加标记点击监听
+          marker.addEventListener("click", function (e) {
+            gc.getLocation(e.point, function (rs) {
+              showLocationInfo(e.point, rs);
+            });
+          });
+
+          map.centerAndZoom(point, 15); //设置中心点坐标和地图级别
+          map.addOverlay(marker); //将标记添加到地图中
+          //显示地址信息窗口
+          function showLocationInfo(pt, rs) {
+            var opts = {
+              width: 250,     //信息窗口宽度
+              height: 100,     //信息窗口高度
+              title: ""  //信息窗口标题
             }
+            var addComp = rs.addressComponents;
+            var addr = "当前位置：" + addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber + "<br/>";
+            addr += "纬度: " + pt.lat + ", " + "经度：" + pt.lng;
+            // eslint-disable-next-line no-undef
+            var infoWindow = new BMap.InfoWindow(addr, opts);  //创建信息窗口对象
+            marker.openInfoWindow(infoWindow);
+          }
+        })
+
+      },
 
     },
   };

src/views/water/river/dict/water.vue

@@ -21,7 +21,8 @@
           <a-col :lg="6" :md="12" :sm="24" :xs="24">
             <a-space>
               <a-button type="primary" @click="reload">查询</a-button>
-                            <a-button @click="reset" style="background: #FFA200FF; border-color: #FFA200FF;color: #FFFFFF">重置</a-button>
+              <a-button @click="reset" style="background: #FFA200FF; border-color: #FFA200FF;color: #FFFFFF">重置
+              </a-button>
             </a-space>
           </a-col>
         </a-row>
@@ -87,6 +88,24 @@
           <a-form-item label="纬度" name="latitude">
             <a-input v-model:value="form.latitude" placeholder="请输入纬度" allow-clear/>
           </a-form-item>
+          <a-form-item label="修正位置" name="correctLocation">
+            <a-input-search @search="showRoadMap(form)"
+                            :value="`[${form.correctLng},${form.correctLat}]`"
+                            placeholder="`[${form.longitude},${form.latitude}]`" allow-clear>
+              <template #enterButton>
+                <a-button>选择位置</a-button>
+              </template>
+            </a-input-search>
+          </a-form-item>
+
+          <a-modal :closable="false" :destroy-on-close="true" :width="1000" :body-style="{height:'700px'}"
+                   v-model:visible="visibleRoadMap" :title="roadMapTitle"
+          >
+            <div style="width: 100%;height: 100%;" ref="roadMap" id="roadMap"></div>
+            <template #footer>
+              <a-button key="submit" type="primary" @click="visibleRoadMap = false">确定</a-button>
+            </template>
+          </a-modal>
         </a-form>
       </a-modal>
       <!-- 表格 -->
@@ -131,7 +150,8 @@
               >删除
               </a-button>
             </a-popconfirm>
-                        <a-button @click="exportData" style="background: #2FA524FF; border-color: #2FA524FF;color: #FFFFFF">导出</a-button>
+            <a-button @click="exportData" style="background: #2FA524FF; border-color: #2FA524FF;color: #FFFFFF">导出
+            </a-button>
           </a-space>
         </template>
         <template #action="{ record }">
@@ -141,7 +161,8 @@
               type="primary"
               shape="round"
               size="small"
-                        >修改</a-button
+            >修改
+            </a-button
             >
             <a-popconfirm
               :title="`确认删除这条数据吗?`"
@@ -150,7 +171,8 @@
               @confirm="remove(record)"
             >
               <a-button type="primary" danger shape="round" size="small"
-                            >删除</a-button
+              >删除
+              </a-button
               >
             </a-popconfirm>
           </a-space>
@@ -202,6 +224,8 @@ export default {
           title: "纬度",
           dataIndex: "latitude",
         },
+        {title: "修正经度", dataIndex: "correctLng"},
+        {title: "修正纬度", dataIndex: "correctLat"},
         {
           title: "操作",
           key: "action",
@@ -232,6 +256,8 @@ export default {
       showNYear: false,
       cYear: undefined,
       nYear: undefined,
+      visibleRoadMap: false,
+      roadMapTitle: "选择坐标",
     };
   },
   mounted() {
@@ -381,7 +407,67 @@ export default {
 
       let sheet = XLSX.utils.aoa_to_sheet(arr);
       this.$util.exportSheet(XLSX, sheet, new Date().getTime().toString());
+    },
+    showRoadMap(form) {
+      const {longitude, latitude, correctLng, correctLat} = form
+      this.visibleRoadMap = true
+      this.roadMapTitle = "选择修正后的道路坐标"
+      this.$nextTick(() => {
+        console.log(this.$refs.roadMap)
+        // eslint-disable-next-line no-undef
+        var map = new BMap.Map(this.$refs.roadMap);    // 创建Map实例
+        // eslint-disable-next-line no-undef
+        map.addControl(new BMap.NavigationControl());  //初始化地图控件
+        // eslint-disable-next-line no-undef
+        map.addControl(new BMap.ScaleControl());
+        // eslint-disable-next-line no-undef
+        map.addControl(new BMap.OverviewMapControl());
+        // eslint-disable-next-line no-undef
+        var point = new BMap.Point(correctLng ? correctLng : longitude ? longitude : 108.33, correctLat ? correctLat : latitude ? latitude : 22.84);
+        // var point = new BBMap.Point(form.longitude ? form.longitude : 108.33, form.latitude ? form.latitude : 22.84);
+        map.centerAndZoom(point, 13);//初始化地图中心点
+        // eslint-disable-next-line no-undef
+        var marker = new BMap.Marker(point); //初始化地图标记
+        marker.enableDragging(); //标记开启拖拽
+        // eslint-disable-next-line no-undef
+        var gc = new BMap.Geocoder();//地址解析类
+        //添加标记拖拽监听
+        marker.addEventListener("dragend", (e) => {
+          //获取地址信息
+          this.form['correctLng'] = e.point.lng
+          this.form['correctLat'] = e.point.lat
+
+          gc.getLocation(e.point, function (rs) {
+            showLocationInfo(e.point, rs);
+          });
+        });
+
+        //添加标记点击监听
+        marker.addEventListener("click", function (e) {
+          gc.getLocation(e.point, function (rs) {
+            showLocationInfo(e.point, rs);
+          });
+        });
+
+        map.centerAndZoom(point, 15); //设置中心点坐标和地图级别
+        map.addOverlay(marker); //将标记添加到地图中
+        //显示地址信息窗口
+        function showLocationInfo(pt, rs) {
+          var opts = {
+            width: 250,     //信息窗口宽度
+            height: 100,     //信息窗口高度
+            title: ""  //信息窗口标题
           }
+          var addComp = rs.addressComponents;
+          var addr = "当前位置：" + addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber + "<br/>";
+          addr += "纬度: " + pt.lat + ", " + "经度：" + pt.lng;
+          // eslint-disable-next-line no-undef
+          var infoWindow = new BMap.InfoWindow(addr, opts);  //创建信息窗口对象
+          marker.openInfoWindow(infoWindow);
+        }
+      })
+
+    },
 
   },
 };