Merge branch 'main' of http://47.92.168.204:3000/VoRDM/vordm-admin

# Conflicts:
#	src/views/dataService/remoteSensingData/components/searchCondition.vue

src/components/Map.vue

@@ -1,9 +1,10 @@
 <template>
-  <div ref="map" class="container"></div>
+  <div ref="map"
+       class="container"></div>
 </template>
 
 <script setup>
-import { ref, onMounted } from 'vue'
+import { ref, reactive, onMounted } from 'vue'
 import WKT from 'terraformer-wkt-parser'
 import * as turf from '@turf/turf'
 import L from 'leaflet'
@@ -13,10 +14,11 @@ import 'leaflet-draw/dist/leaflet.draw.css'
 import '@geoman-io/leaflet-geoman-free';
 import '@geoman-io/leaflet-geoman-free/dist/leaflet-geoman.css';
 import 'Leaflet-ImageOverlay-Rotated'
-import 'leaflet-control-geocoder/dist/Control.Geocoder.css';
+// import 'leaflet-control-geocoder/dist/Control.Geocoder.css';
-import 'leaflet-control-geocoder';
+// import 'leaflet-control-geocoder';
 import { useVariableStore } from '/@/stores/index.ts'
 import * as omnivore from '@mapbox/leaflet-omnivore'
+import axios from "axios";
 const variableStore = useVariableStore()
 const map = ref()
 let homeMap = null
@@ -24,6 +26,9 @@ let featureLayerG_area = null
 let featureLayerG_point = null
 let layerRectangle = null
 
+const state = reactive({
+  markerLayer: null
+})
 
 onMounted(() => {
   homeMap = L.map(map.value, {
@@ -31,7 +36,7 @@ onMounted(() => {
     crs: L.CRS.EPSG4326,
     center: [29.563761, 106.550464],
     zoom: 3,
-    minZoom: 1,
+    minZoom: 3,
     maxZoom: 18,
     attributionControl: false, // 移除右下角leaflet标识
     zoomControl: false,
@@ -49,32 +54,32 @@ onMounted(() => {
 
   featureLayerG_area = L.layerGroup().addTo(homeMap)
   featureLayerG_point = L.layerGroup().addTo(homeMap)
-  // 'http://t0.tianditu.com/img_c/wmts?layer=img&style=default&tilematrixset=c&Service=WMTS&Request=GetTile&Version=1.0.0&Format=tiles&TileMatrix={z}&TileCol={x}&TileRow={y}&tk='
+  'http://t0.tianditu.com/img_c/wmts?layer=img&style=default&tilematrixset=c&Service=WMTS&Request=GetTile&Version=1.0.0&Format=tiles&TileMatrix={z}&TileCol={x}&TileRow={y}&tk='
-  // const CIA_C = "http://t0.tianditu.com/cia_c/wmts?layer=cia&style=default&tilematrixset=c&Service=WMTS&Request=GetTile&Version=1.0.0&Format=tiles&TileMatrix={z}&TileCol={x}&TileRow={y}&tk=";
+  const CIA_C = "http://t0.tianditu.com/cia_c/wmts?layer=cia&style=default&tilematrixset=c&Service=WMTS&Request=GetTile&Version=1.0.0&Format=tiles&TileMatrix={z}&TileCol={x}&TileRow={y}&tk=";
-  // const nameLayer =  L.tileLayer(CIA_C + TK_KEY, {
+  const nameLayer = L.tileLayer(CIA_C + TK_KEY, {
-  //     maxZoom: 20,
+    maxZoom: 20,
-  //     tileSize: 256,
+    tileSize: 256,
-  //     zoomOffset: 1
+    zoomOffset: 1
-  // }).addTo(homeMap);
-
-  // 创建Geocoding控件
-  const geocoder = L.Control.geocoder({
-    defaultMarkGeocode: false,
-    placeholder: 'Enter address...',
-    collapsed: true,
   }).addTo(homeMap);
 
-  // 监听Geocoding控件的结果事件
+  //   // 创建Geocoding控件
-  geocoder.on('markgeocode', function (event) {
+  //   const geocoder = L.Control.geocoder({
-    const result = event.geocode || {};
+  //     defaultMarkGeocode: false,
-    onGeocodeResult(result);
+  //     placeholder: 'Enter address...',
-  });
+  //     collapsed: true,
+  //   }).addTo(homeMap);
+
+  //   // 监听Geocoding控件的结果事件
+  //   geocoder.on('markgeocode', function (event) {
+  //     const result = event.geocode || {};
+  //     onGeocodeResult(result);
+  //   });
 
 })
-const onGeocodeResult = (result) => {
+// const onGeocodeResult = (result) => {
-  homeMap.setView(result.center, 5);
+//   homeMap.setView(result.center, 5);
-  L.marker(result.center).addTo(homeMap);
+//   L.marker(result.center).addTo(homeMap);
-}
+// }
 
 /** WKT加载点和多边形
    * Object param 参数集合
@@ -309,7 +314,6 @@ const mapOperations = {
     featureLayerG_point.clearLayers()
     variableStore.layerGroupPoint = null
     variableStore.layerGroupPoly = null
-
   },
   /**
    * 清楚wkt添加的所有
@@ -425,6 +429,25 @@ const mapOperations = {
   },
   removeEdit: () => {
     homeMap.pm.toggleGlobalRemovalMode();
+  },
+  //   地理编码检索
+  addressSelect: (keyWord) => {
+    if (state.markerLayer) {
+      homeMap.removeLayer(state.markerLayer)
+    }
+
+    let addressServer = 'http://api.tianditu.gov.cn/geocoder?ds={"keyWord":"' + keyWord + '"}&tk=dc8182ebeca998e22154d404aa3c0c17'
+
+    const service = axios.get(addressServer).then(res => {
+      homeMap.flyTo(L.latLng([res.data.location.lat, res.data.location.lon]), 6)
+      const markerParam = {
+        'x': res.data.location.lat,
+        'y': res.data.location.lon
+      }
+      state.markerLayer = L.marker(
+        new L.latLng(res.data.location.lat, res.data.location.lon),
+      ).addTo(homeMap)
+    })
   }
 }
 //omnivore.wkt.parse('POINT(-80 0)').addTo(homeMap);

src/views/dataService/remoteSensingData/components/searchCondition.vue

@@ -19,15 +19,20 @@
            </el-col>  
           </el-row>
           </el-card>
-          <el-card class="box-card" style="margin-top: 3%;">
+          <el-card class="box-card"
+                   style="margin-top: 3%;">
             <span>Select time range</span>
             <el-row class="block">
               <el-col :span="5">
                 <span class="demonstration">Start time</span>
               </el-col>
               <el-col :span="19">
-                <el-date-picker style="width: 90%;" v-model="state.startTime" type="datetime"
+                <el-date-picker style="width: 90%;"
-                  placeholder="Select start time" value-format="YYYY-MM-DD HH:mm:ss" :shortcuts="state.shortcuts"
+                                v-model="state.startTime"
+                                type="datetime"
+                                placeholder="Select start time"
+                                value-format="YYYY-MM-DD HH:mm:ss"
+                                :shortcuts="state.shortcuts"
                                 :disabled-date="disabledDate" />
               </el-col>
             </el-row>
@@ -36,20 +41,28 @@
                 <span class="demonstration">End time</span>
               </el-col>
               <el-col :span="19">
-                <el-date-picker style="width: 90%;" v-model="state.endTime" type="datetime" placeholder="Select end time"
+                <el-date-picker style="width: 90%;"
-                  value-format="YYYY-MM-DD HH:mm:ss" :shortcuts="state.shortcuts" :disabled-date="disabledDate" />
+                                v-model="state.endTime"
+                                type="datetime"
+                                placeholder="Select end time"
+                                value-format="YYYY-MM-DD HH:mm:ss"
+                                :shortcuts="state.shortcuts"
+                                :disabled-date="disabledDate" />
               </el-col>
             </el-row>
           </el-card>
 
-          <el-card class="box-card" style="margin-top: 3%;">
+          <el-card class="box-card"
-            <span>Select a region  <el-switch
+                   style="margin-top: 3%;">
-                                      v-model="state.switch"
+            <span>Select a region
+              <el-switch v-model="state.switch"
                          size="large"
                          active-text="Area"
-                                      inactive-text="Polygon"
+                         inactive-text="Polygon" />
-                                    /></span>
+            </span>
-            <el-scrollbar wrap-class="list" view-class="view-box" :native="false">
+            <el-scrollbar wrap-class="list"
+                          view-class="view-box"
+                          :native="false">
               <div v-for="(coordinate, i) in   state.coordinateList  ">
                 <el-row class="coordinateContainer">
                   <el-col :span="1"></el-col>
@@ -59,35 +72,52 @@
                       parseFloat(coordinate.Lng).toFixed(4)
                     }}</span>
                   </el-col>
-                  <el-col :span="2">
+                  <!-- <el-col :span="2">
-                    <el-button class="el-icon" @click="editCoordinate" size="small">
+                    <el-button class="el-icon"
+                               @click="editCoordinate"
+                               size="small">
                       <ele-Edit />
                     </el-button>
-                  </el-col>
+                  </el-col> -->
                   <el-col :span="2">
-                    <el-button class="el-icon" @click="state.coordinateList.splice(i, 1);" size="small">
+                    <el-button class="el-icon"
+                               @click="state.coordinateList.splice(i, 1);"
+                               size="small">
                       <ele-Delete />
                     </el-button>
                   </el-col>
                 </el-row>
               </div>
+              <div v-if="state.switch==false"
+                   style="margin-bottom: 10px;">
+                {{variableStore.layerGroupPoly}}
+              </div>
             </el-scrollbar>
             <el-row>
               <el-col :span=" 1 "></el-col>
               <el-col :span=" 7 ">
-                <el-button class="coordinateBtn" @click=" addCoordinate ">Add coordinates</el-button>
+                <el-button class="coordinateBtn"
+                           @click=" addCoordinate ">Add coordinates</el-button>
               </el-col>
               <el-col :span=" 7 ">
-                <el-button class="coordinateBtn" @click=" clearCoordinate ">Clear coordinates</el-button>
+                <el-button class="coordinateBtn"
+                           @click=" clearCoordinate ">Clear coordinates</el-button>
               </el-col>
             </el-row>
 
           </el-card>
 
-          <el-card class="box-card" style="margin-top: 3%;">
+          <el-card class="box-card"
+                   style="margin-top: 3%;">
             <span>Select satellite type</span>
-            <el-tree-select class="satelliteSelect" v-model=" state.satelliteSelected " :data=" state.sensor " multiple
+            <el-tree-select class="satelliteSelect"
-              collapse-tags collapse-tags-tooltip :render-after-expand=" false " show-checkbox
+                            v-model=" state.satelliteSelected "
+                            :data=" state.sensor "
+                            multiple
+                            collapse-tags
+                            collapse-tags-tooltip
+                            :render-after-expand=" false "
+                            show-checkbox
                             placeholder="Select satellite type" />
           </el-card>
 
@@ -106,19 +136,34 @@
           </el-card> -->
           <el-card style="margin-top:3%;">
             <el-row>
-                <el-button class="lowerBtn" @click=" startCrawl ">Start Crawl</el-button>
+              <el-button class="lowerBtn"
+                         @click=" startCrawl ">Start Crawl</el-button>
             </el-row>
             <el-row>
-                <el-button class="lowerBtn" @click=" ClearCondition ">Go Back</el-button>
+              <el-button class="lowerBtn"
+                         @click=" ClearCondition ">Go Back</el-button>
             </el-row>
+
           </el-card>
         </div>
       </el-col>
       <el-col :span=" 16 ">
-        <Map id="map" ref="map">
+        <Map id="map"
+             ref="map">
         </Map>
       </el-col>
+    </el-row>
 
+    <el-row class="addressGroup">
+      <el-input v-model="state.address"
+                placeholder="Please input location"
+                class="input-with-select"
+                clearable>
+        <template #append>
+          <el-button :icon="Search"
+                     @click="addressSelect" />
+        </template>
+      </el-input>
     </el-row>
     <el-dialog title="status" v-model="state.statusShow" width="420px">
         <el-table :data="state.statusData">
@@ -146,6 +191,7 @@ import { ref, reactive, watch, defineExpose, onMounted,defineEmits } from 'vue';
 import { submit2 as submit ,rs2,getStatus  } from '/@/api/crawl/index';
 import { useUserInfo } from '/@/stores/userInfo';
 import { ElMessage, ElMessageBox } from "element-plus";
+import { Search } from '@element-plus/icons-vue'
 import { useVariableStore } from '/@/stores/index.ts';
 import { getList as BizDict } from "/@/api/system/dictbiz.js";
 const variableStore = useVariableStore();
@@ -156,6 +202,7 @@ const disabledDate = (time) => {
 }
 // 初始化数据
 const map = ref()
+
 const state = reactive({
   statusData: [],
   statusShow: false,
@@ -231,12 +278,12 @@ const state = reactive({
   data: {},
   data2: [],
   geometry: null,
+  address: '',
 })
 //获取爬取卫星状态
 const openStatus = () => {
   getStatus(state.data.disasterId).then(res => {
     state.statusData = res;
-    console.log(res,state.statusData)
     state.statusShow = true;
   })
 }
@@ -324,10 +371,8 @@ const changeLatLon = (e) => {
       state.disLon = String((360 - state.disLon).toFixed(3)) + "°W"
     }
   }
-
 }
 
-
 // 添加坐标点
 const addCoordinate = () => {
   state.addCoord = !state.addCoord;
@@ -458,6 +503,19 @@ const ClearCondition = () => {
   emit('response')
 }
 
+// 地理编码检索
+const addressSelect = () => {
+  if (state.address) {
+    map.value.mapOperations.addressSelect(state.address)
+  }
+  else {
+    ElMessage({
+      message: 'Warning, please enter location !',
+      type: 'error',
+    })
+  }
+}
+
 // 监听 
 watch(
   () => state.coordinateList.length,
@@ -504,7 +562,6 @@ defineExpose({
 	border: 1px solid #f7f7fa;
 	height: 52rem;
 
-
 	span {
 		display: block;
 		margin-bottom: 3%;
@@ -551,5 +608,13 @@ defineExpose({
 #map {
 	height: 58rem;
 	margin-left: 5px;
+	z-index: 1;
+}
+
+.addressGroup {
+	position: absolute;
+	top: 20px;
+	right: 30px;
+	z-index: 99;
 }
 </style>

src/views/responseManagement/userResponse/index.vue

@@ -1,181 +1,359 @@
 <template>
   <div class="system-role-container layout-padding">
-    <el-config-provider :locale="en" style="position: relative;">
+    <el-config-provider :locale="en"
+                        style="position: relative;">
       <div class="system-role-padding layout-padding-auto layout-padding-view">
-        <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick" style="margin-left: 20px">
+        <el-tabs v-model="activeName"
-          <el-tab-pane label="Unapproved" name="first">
+                 class="demo-tabs"
-            <el-table :data="state.tableData.data" v-loading="state.tableData.loading" style="width: 100%">
+                 @tab-click="handleClick"
-              <el-table-column prop="username" label="User name" show-overflow-tooltip sortable></el-table-column>
+                 style="margin-left: 20px">
-              <el-table-column prop="organization" label="Organization" show-overflow-tooltip sortable></el-table-column>
+          <el-tab-pane label="Unapproved"
-              <el-table-column prop="disasterType" label="Disaster type" show-overflow-tooltip sortable>
+                       name="first">
+            <el-table :data="state.tableData.data"
+                      v-loading="state.tableData.loading"
+                      style="width: 100%">
+              <el-table-column prop="username"
+                               label="User name"
+                               show-overflow-tooltip
+                               sortable></el-table-column>
+              <el-table-column prop="organization"
+                               label="Organization"
+                               show-overflow-tooltip
+                               sortable></el-table-column>
+              <el-table-column prop="disasterType"
+                               label="Disaster type"
+                               show-overflow-tooltip
+                               sortable>
                 <!-- 在disasterType中获取dictKey 对应的dictValue -->
                 <template #default="scope">
                   <el-tag type="info">{{ getValue(scope.row.disasterType) }}</el-tag>
                 </template>
               </el-table-column>
-              <el-table-column prop="disasterKeyword" label="Disaster keyword" show-overflow-tooltip
+              <el-table-column prop="disasterKeyword"
+                               label="Disaster keyword"
+                               show-overflow-tooltip
                                sortable></el-table-column>
-              <el-table-column prop="disasterTime" label="Disaster time" show-overflow-tooltip sortable>
+              <el-table-column prop="disasterTime"
+                               label="Disaster time"
+                               show-overflow-tooltip
+                               sortable>
                 <template #default="scope">
                   <!-- 格式化去除时分秒 -->
                   {{ dateFormat(scope.row.disasterTime) }}
                 </template>
               </el-table-column>
-              <el-table-column prop="respondStatus" label="Response status" show-overflow-tooltip sortable>
+              <el-table-column prop="respondStatus"
+                               label="Response status"
+                               show-overflow-tooltip
+                               sortable>
                 <template #default="scope">
-                  <el-tag type="info" v-if="scope.row.respondStatus === 0">Awaiting approval</el-tag>
+                  <el-tag type="info"
-                  <el-tag type="info" v-if="scope.row.respondStatus === 1">Rejected</el-tag>
+                          v-if="scope.row.respondStatus === 0">Awaiting approval</el-tag>
+                  <el-tag type="info"
+                          v-if="scope.row.respondStatus === 1">Rejected</el-tag>
                 </template>
               </el-table-column>
-              <el-table-column prop="Operate" label="Operate" show-overflow-tooltip sortable>
+              <el-table-column prop="Operate"
+                               label="Operate"
+                               show-overflow-tooltip
+                               sortable>
                 <template #default="scope">
-                  <el-button size="small" text type="primary"
+                  <el-button size="small"
+                             text
+                             type="primary"
                              @click="onOpenEditRole('edit', scope.row)">Approve</el-button>
                 </template>
               </el-table-column>
             </el-table>
-            <el-pagination @size-change="onHandleSizeChange" @current-change="onHandleCurrentChange" class="mt15"
+            <el-pagination @size-change="onHandleSizeChange"
-              :pager-count="5" :page-sizes="[10, 20, 30]" v-model:current-page="state.tableData.param.current" background
+                           @current-change="onHandleCurrentChange"
-              v-model:page-size="state.tableData.param.size" layout="total, sizes, prev, pager, next, jumper"
+                           class="mt15"
+                           :pager-count="5"
+                           :page-sizes="[10, 20, 30]"
+                           v-model:current-page="state.tableData.param.current"
+                           background
+                           v-model:page-size="state.tableData.param.size"
+                           layout="total, sizes, prev, pager, next, jumper"
                            :total="state.tableData.total">
             </el-pagination>
           </el-tab-pane>
 
-          <el-tab-pane label="Rejected" name="firstNew">
+          <el-tab-pane label="Rejected"
-            <el-table :data="state.tableData.data" v-loading="state.tableData.loading" style="width: 100%">
+                       name="firstNew">
-              <el-table-column prop="username" label="User name" show-overflow-tooltip sortable></el-table-column>
+            <el-table :data="state.tableData.data"
-              <el-table-column prop="organization" label="Organization" show-overflow-tooltip sortable></el-table-column>
+                      v-loading="state.tableData.loading"
-              <el-table-column prop="disasterType" label="Disaster type" show-overflow-tooltip sortable>
+                      style="width: 100%">
+              <el-table-column prop="username"
+                               label="User name"
+                               show-overflow-tooltip
+                               sortable></el-table-column>
+              <el-table-column prop="organization"
+                               label="Organization"
+                               show-overflow-tooltip
+                               sortable></el-table-column>
+              <el-table-column prop="disasterType"
+                               label="Disaster type"
+                               show-overflow-tooltip
+                               sortable>
                 <!-- 在disasterType中获取dictKey 对应的dictValue -->
                 <template #default="scope">
                   <el-tag type="info">{{ getValue(scope.row.disasterType) }}</el-tag>
                 </template>
               </el-table-column>
-              <el-table-column prop="disasterKeyword" label="Disaster keyword" show-overflow-tooltip
+              <el-table-column prop="disasterKeyword"
+                               label="Disaster keyword"
+                               show-overflow-tooltip
                                sortable></el-table-column>
-              <el-table-column prop="disasterTime" label="Disaster time" show-overflow-tooltip sortable>
+              <el-table-column prop="disasterTime"
+                               label="Disaster time"
+                               show-overflow-tooltip
+                               sortable>
                 <template #default="scope">
                   <!-- 格式化去除时分秒 -->
                   {{ dateFormat(scope.row.disasterTime) }}
                 </template>
               </el-table-column>
-              <el-table-column width="200" prop="Operate" label="Operate" show-overflow-tooltip sortable v-auth-role="'admin'">
+              <el-table-column width="200"
+                               prop="Operate"
+                               label="Operate"
+                               show-overflow-tooltip
+                               sortable
+                               v-auth-role="'admin'">
                 <template #default="scope">
-                  <el-button size="small" text type="danger" @click="remove(scope.row)">Delete</el-button>
+                  <el-button size="small"
+                             text
+                             type="danger"
+                             @click="remove(scope.row)">Delete</el-button>
                 </template>
               </el-table-column>
             </el-table>
-            <el-pagination @size-change="onHandleSizeChange" @current-change="onHandleCurrentChange" class="mt15"
+            <el-pagination @size-change="onHandleSizeChange"
-              :pager-count="5" :page-sizes="[10, 20, 30]" v-model:current-page="state.tableData.param.current" background
+                           @current-change="onHandleCurrentChange"
-              v-model:page-size="state.tableData.param.size" layout="total, sizes, prev, pager, next, jumper"
+                           class="mt15"
+                           :pager-count="5"
+                           :page-sizes="[10, 20, 30]"
+                           v-model:current-page="state.tableData.param.current"
+                           background
+                           v-model:page-size="state.tableData.param.size"
+                           layout="total, sizes, prev, pager, next, jumper"
                            :total="state.tableData.total">
             </el-pagination>
           </el-tab-pane>
 
-          <el-tab-pane label="Approved" name="second">
+          <el-tab-pane label="Approved"
-            <el-table :data="state.tableData.data" v-loading="state.tableData.loading" style="width: 100%">
+                       name="second">
+            <el-table :data="state.tableData.data"
+                      v-loading="state.tableData.loading"
+                      style="width: 100%">
 
-              <el-table-column prop="username" label="User name" show-overflow-tooltip sortable  width="150"></el-table-column>
+              <el-table-column prop="username"
-              <el-table-column prop="organization" label="Organization" show-overflow-tooltip sortable  width="160"></el-table-column>
+                               label="User name"
-              <el-table-column prop="email" label="Email" show-overflow-tooltip sortable></el-table-column>
+                               show-overflow-tooltip
-              <el-table-column prop="disasterType" label="Disaster type" show-overflow-tooltip sortable  width="160">
+                               sortable
+                               width="150"></el-table-column>
+              <el-table-column prop="organization"
+                               label="Organization"
+                               show-overflow-tooltip
+                               sortable
+                               width="160"></el-table-column>
+              <el-table-column prop="email"
+                               label="Email"
+                               show-overflow-tooltip
+                               sortable></el-table-column>
+              <el-table-column prop="disasterType"
+                               label="Disaster type"
+                               show-overflow-tooltip
+                               sortable
+                               width="160">
                 <!-- 在disasterType中获取dictKey 对应的dictValue -->
                 <template #default="scope">
                   <el-tag type="info">{{ getValue(scope.row.disasterType) }}</el-tag>
                 </template>
               </el-table-column>
-              <el-table-column prop="disasterKeyword" label="Disaster keyword"  width="190" show-overflow-tooltip
+              <el-table-column prop="disasterKeyword"
+                               label="Disaster keyword"
+                               width="190"
+                               show-overflow-tooltip
                                sortable></el-table-column>
-              <el-table-column prop="disasterTime" label="Disaster time" show-overflow-tooltip sortable  width="150">
+              <el-table-column prop="disasterTime"
+                               label="Disaster time"
+                               show-overflow-tooltip
+                               sortable
+                               width="150">
                 <template #default="scope">
                   <!-- 格式化去除时分秒 -->
                   {{ dateFormat(scope.row.disasterTime) }}
                 </template>
               </el-table-column>
-              <el-table-column prop="chiefName" label="Answer" show-overflow-tooltip sortable></el-table-column>
+              <el-table-column prop="chiefName"
-              <el-table-column prop="reviewTime" label="reviewTime" show-overflow-tooltip sortable   width="140"/>
+                               label="Answer"
-              <el-table-column width="170" prop="respondStatus" label="Response status" show-overflow-tooltip sortable>
+                               show-overflow-tooltip
+                               sortable></el-table-column>
+              <el-table-column prop="reviewTime"
+                               label="reviewTime"
+                               show-overflow-tooltip
+                               sortable
+                               width="140" />
+              <el-table-column width="170"
+                               prop="respondStatus"
+                               label="Response status"
+                               show-overflow-tooltip
+                               sortable>
                 <template #default="scope">
-                  <el-tag type="info" v-if="scope.row.respondStatus === 2">Approved</el-tag>
+                  <el-tag type="info"
-                  <el-tag type="info" v-if="scope.row.respondStatus === 1">Rejected</el-tag>
+                          v-if="scope.row.respondStatus === 2">Approved</el-tag>
-                  <el-tag type="success" v-if="scope.row.respondStatus === 3">Complete response</el-tag>
+                  <el-tag type="info"
+                          v-if="scope.row.respondStatus === 1">Rejected</el-tag>
+                  <el-tag type="success"
+                          v-if="scope.row.respondStatus === 3">Complete response</el-tag>
                 </template>
               </el-table-column>
-              <el-table-column width="240" prop="Operate" label="Operate" show-overflow-tooltip sortable>
+              <el-table-column width="240"
+                               prop="Operate"
+                               label="Operate"
+                               show-overflow-tooltip
+                               sortable>
                 <template #default="scope">
-                  <el-button size="small" text type="primary" @click="onAllocation(scope.row)">Allocation</el-button>
+                  <el-button size="small"
-                  <el-button size="small" text type="danger" @click="responseEnded(scope.row)">Response ended</el-button>
+                             text
-                  <el-button size="small" text type="danger" @click="remove(scope.row)"  v-auth-role="'admin'">Delete</el-button>
+                             type="primary"
+                             @click="onAllocation(scope.row)">Allocation</el-button>
+                  <el-button size="small"
+                             text
+                             type="danger"
+                             @click="responseEnded(scope.row)">Response ended</el-button>
+                  <el-button size="small"
+                             text
+                             type="danger"
+                             @click="remove(scope.row)"
+                             v-auth-role="'admin'">Delete</el-button>
                 </template>
               </el-table-column>
             </el-table>
-            <el-pagination @size-change="onHandleSizeChange" @current-change="onHandleCurrentChange" class="mt15"
+            <el-pagination @size-change="onHandleSizeChange"
-              :pager-count="5" :page-sizes="[10, 20, 30]" v-model:current-page="state.tableData.param.current" background
+                           @current-change="onHandleCurrentChange"
-              v-model:page-size="state.tableData.param.size" layout="total, sizes, prev, pager, next, jumper"
+                           class="mt15"
+                           :pager-count="5"
+                           :page-sizes="[10, 20, 30]"
+                           v-model:current-page="state.tableData.param.current"
+                           background
+                           v-model:page-size="state.tableData.param.size"
+                           layout="total, sizes, prev, pager, next, jumper"
                            :total="state.tableData.total">
             </el-pagination>
           </el-tab-pane>
 
-
+          <el-tab-pane label="Finish"
-          <el-tab-pane label="Finish" name="firstNewOne">
+                       name="firstNewOne">
-            <el-table :data="state.tableData.data" v-loading="state.tableData.loading" style="width: 100%">
+            <el-table :data="state.tableData.data"
-              <el-table-column prop="username" label="User name" show-overflow-tooltip sortable></el-table-column>
+                      v-loading="state.tableData.loading"
-              <el-table-column prop="organization" label="Organization" show-overflow-tooltip sortable></el-table-column>
+                      style="width: 100%">
-              <el-table-column prop="disasterType" label="Disaster type" show-overflow-tooltip sortable>
+              <el-table-column prop="username"
+                               label="User name"
+                               show-overflow-tooltip
+                               sortable></el-table-column>
+              <el-table-column prop="organization"
+                               label="Organization"
+                               show-overflow-tooltip
+                               sortable></el-table-column>
+              <el-table-column prop="disasterType"
+                               label="Disaster type"
+                               show-overflow-tooltip
+                               sortable>
                 <!-- 在disasterType中获取dictKey 对应的dictValue -->
                 <template #default="scope">
                   <el-tag type="info">{{ getValue(scope.row.disasterType) }}</el-tag>
                 </template>
               </el-table-column>
-              <el-table-column prop="disasterKeyword" label="Disaster keyword" show-overflow-tooltip
+              <el-table-column prop="disasterKeyword"
+                               label="Disaster keyword"
+                               show-overflow-tooltip
                                sortable></el-table-column>
-              <el-table-column prop="disasterTime" label="Disaster time" show-overflow-tooltip sortable>
+              <el-table-column prop="disasterTime"
+                               label="Disaster time"
+                               show-overflow-tooltip
+                               sortable>
                 <template #default="scope">
                   <!-- 格式化去除时分秒 -->
                   {{ dateFormat(scope.row.disasterTime) }}
                 </template>
               </el-table-column>
-              <el-table-column prop="respondedTime" label="Responded time" show-overflow-tooltip sortable>
+              <el-table-column prop="respondedTime"
+                               label="Responded time"
+                               show-overflow-tooltip
+                               sortable>
                 <template #default="scope">
                   <!-- 格式化去除时分秒 -->
                   {{ dateFormat(scope.row.respondedTime) }}
                 </template>
               </el-table-column>
-              <el-table-column width="200" prop="Operate" label="Operate" show-overflow-tooltip sortable>
+              <el-table-column width="200"
-                <template #default="scope"  v-auth-role="'admin'">
+                               prop="Operate"
-                  <el-button size="small" text type="danger" @click="remove(scope.row)">Delete</el-button>
+                               label="Operate"
+                               show-overflow-tooltip
+                               sortable>
+                <template #default="scope"
+                          v-auth-role="'admin'">
+                  <el-button size="small"
+                             text
+                             type="danger"
+                             @click="remove(scope.row)">Delete</el-button>
                 </template>
               </el-table-column>
             </el-table>
-            <el-pagination @size-change="onHandleSizeChange" @current-change="onHandleCurrentChange" class="mt15"
+            <el-pagination @size-change="onHandleSizeChange"
-              :pager-count="5" :page-sizes="[10, 20, 30]" v-model:current-page="state.tableData.param.current" background
+                           @current-change="onHandleCurrentChange"
-              v-model:page-size="state.tableData.param.size" layout="total, sizes, prev, pager, next, jumper"
+                           class="mt15"
+                           :pager-count="5"
+                           :page-sizes="[10, 20, 30]"
+                           v-model:current-page="state.tableData.param.current"
+                           background
+                           v-model:page-size="state.tableData.param.size"
+                           layout="total, sizes, prev, pager, next, jumper"
                            :total="state.tableData.total">
             </el-pagination>
           </el-tab-pane>
         </el-tabs>
       </div>
-      <el-dialog v-model="state.dialogVisible" title="Approval" width="45%">
+      <el-dialog v-model="state.dialogVisible"
+                 title="Approval"
+                 width="45%">
         <el-container style="margin-top: -2%;margin-bottom: 2%;">
-          <el-radio v-model="state.radio" label='1' @click="mapEvents('1')">Point</el-radio>
+          <el-radio v-model="state.radio"
-          <el-radio v-model="state.radio" label='2' @click="mapEvents('2')">Area</el-radio>
+                    label='1'
-          <el-radio v-model="state.radio" label='3' @click="mapEvents('3')">Edit</el-radio>
+                    @click="mapEvents('1')">Point</el-radio>
-          <el-button type="primary" style="margin-left: 5%;" @click="ClearSubmit">Clear</el-button>
+          <el-radio v-model="state.radio"
+                    label='2'
+                    @click="mapEvents('2')">Area</el-radio>
+          <el-radio v-model="state.radio"
+                    label='3'
+                    @click="mapEvents('3')">Edit</el-radio>
+          <el-button type="primary"
+                     style="margin-left: 5%;"
+                     @click="ClearSubmit">Clear</el-button>
         </el-container>
-        <el-container style="margin-top: 2%;margin-bottom: 2%;" v-if="state.radio === '1' ? true : false">
+        <el-container style="margin-top: 2%;margin-bottom: 2%;"
+                      v-if="state.radio === '1' ? true : false">
           <span style="line-height: 35px;"> Latitude：</span>
-          <el-input placeholder="wait……" style="height:35px;margin-right: 1%;" v-model="state.dislat">
+          <el-input placeholder="wait……"
+                    style="height:35px;margin-right: 1%;"
+                    v-model="state.dislat">
           </el-input>
           <span style="line-height: 35px;">Longitude：</span>
-          <el-input placeholder="wait……" style="height:35px;" v-model="state.dislon"></el-input>
+          <el-input placeholder="wait……"
+                    style="height:35px;"
+                    v-model="state.dislon"></el-input>
         </el-container>
-        <el-container style="margin-top: 2%;margin-bottom: 2%;" v-if="state.radio === '3' ? true : false">
+        <el-container style="margin-top: 2%;margin-bottom: 2%;"
+                      v-if="state.radio === '3' ? true : false">
           <el-row>
             <el-col :span="3">
               <span style="line-height: 35px;"> Latitude：</span>
             </el-col>
             <el-col :span="7">
-              <el-input placeholder="wait……" style="height:35px;margin-right: 1%;" v-model="state.dislat"
+              <el-input placeholder="wait……"
+                        style="height:35px;margin-right: 1%;"
+                        v-model="state.dislat"
                         :onchange="manualLat">
               </el-input>
             </el-col>
@@ -184,36 +362,56 @@
               <span style="line-height: 35px;">Longitude：</span>
             </el-col>
             <el-col :span="7">
-              <el-input placeholder="wait……" style="height:35px;" v-model="state.dislon" :onchange="manualLon"></el-input>
+              <el-input placeholder="wait……"
+                        style="height:35px;"
+                        v-model="state.dislon"
+                        :onchange="manualLon"></el-input>
             </el-col>
           </el-row>
         </el-container>
-        <MapPage style="height:350px ; width:100% ;margin-bottom: 10px;" ref="mapRef">
+        <MapPage style="height:350px ; width:100% ;margin-bottom: 10px;"
+                 ref="mapRef">
         </MapPage>
         <div class="latLon-div"> {{ state.popupLat }} , {{ state.popupLon }} </div>
 
-        <el-form :inline="true" label-width="auto" :label-position="labelPosition" :model="formInline"
+        <el-form :inline="true"
+                 label-width="auto"
+                 :label-position="labelPosition"
+                 :model="formInline"
                  class="demo-form-inline">
 
           <el-form-item label="Disaster Time">
-            <el-date-picker style="width: 200px;" v-model="state.edit.disasterTime" type="date" value-format="YYYY-MM-DD"
+            <el-date-picker style="width: 200px;"
+                            v-model="state.edit.disasterTime"
+                            type="date"
+                            value-format="YYYY-MM-DD"
                             placeholder="Select date and time" />
           </el-form-item>
 
           <el-form-item label="Disaster type">
-            <el-select style="width: 200px; height: 40px;" class="form-select" size="default" clearable
+            <el-select style="width: 200px; height: 40px;"
-              placeholder="Disaster Type" v-model="state.edit.disasterType">
+                       class="form-select"
-              <el-option v-for="(item, index) in state.dictList" :value="item.dictKey" :key="index"
+                       size="default"
+                       clearable
+                       placeholder="Disaster Type"
+                       v-model="state.edit.disasterType">
+              <el-option v-for="(item, index) in state.dictList"
+                         :value="item.dictKey"
+                         :key="index"
                          :label="item.dictValue" />
             </el-select>
           </el-form-item>
 
           <el-form-item label="Disaster country">
-            <el-input style="width: 200px;" v-model="state.edit.disasterCountry" placeholder="please Disaster country"
+            <el-input style="width: 200px;"
+                      v-model="state.edit.disasterCountry"
+                      placeholder="please Disaster country"
                       clearable></el-input>
           </el-form-item>
           <el-form-item label="Theme keywords">
-            <el-input style="width: 200px;" v-model="state.edit.disasterKeyword" placeholder="please Theme keywords"
+            <el-input style="width: 200px;"
+                      v-model="state.edit.disasterKeyword"
+                      placeholder="please Theme keywords"
                       clearable></el-input>
           </el-form-item>
 
@@ -221,16 +419,19 @@
         <template #footer>
           <span class="dialog-footer">
             <el-button @click="dialogVisible = false">Cancel</el-button>
-            <el-button type="danger" @click="reviews(1)">
+            <el-button type="danger"
+                       @click="reviews(1)">
               Reject
             </el-button>
-            <el-button type="primary" @click="reviews(2)">
+            <el-button type="primary"
+                       @click="reviews(2)">
               Approve
             </el-button>
           </span>
         </template>
       </el-dialog>
-      <selectUser ref="select" @callback="getTableData"></selectUser>
+      <selectUser ref="select"
+                  @callback="getTableData"></selectUser>
     </el-config-provider>
   </div>
 </template>
@@ -363,18 +564,23 @@ const onHandleSizeChange = (val) => {
   getTableData();
 };
 const onOpenEditRole = (type, row) => {
-
+  if (state.wktPoint_Poly) {
+    mapRef.value.mapOperations.removeLayer(state.wktPoint_Poly)
+  }
   //深拷贝
   state.edit = JSON.parse(JSON.stringify(row));
   state.dialogVisible = true;
   if (row.geometry.indexOf("POINT") != -1) {
     setTimeout(() => {
       state.radio = "1"
+      state.dislon = row.geometry.substring(row.geometry.indexOf("(") + 1, row.geometry.lastIndexOf(" "))
+      state.dislat = row.geometry.substring(row.geometry.lastIndexOf(" ") + 1, row.geometry.indexOf(")"))
       // mapRef.value.mapOperations.removeAll()
       //赋值地图范围，并且可以修改点或者区域
-      if (state.wktPoint_Poly) {
+      //   if (state.wktPoint_Poly) {
-        mapRef.value.mapOperations.removeLayer(state.wktPoint_Poly)
+      //     mapRef.value.mapOperations.removeLayer(state.wktPoint_Poly)
-      }
+      //     console.log('清除');
+      //   }
       state.wktPoint_Poly = mapRef.value.mapOperations.wktParseToMap(row.geometry)
       mapEvents('1')
     }, 100);
@@ -386,12 +592,20 @@ const onOpenEditRole = (type, row) => {
       //赋值地图范围，并且可以修改点或者区域
       //   if (state.wktPoint_Poly) {
       //     mapRef.value.mapOperations.removeLayer(state.wktPoint_Poly)
+      //     console.log('清除');
       //   }
-      mapRef.value.mapOperations.wktParseToMap(row.geometry)
+      //   mapRef.value.mapOperations.removeWktAll()
+      state.wktPoint_Poly = mapRef.value.mapOperations.wktParseToMap(row.geometry)
       mapEvents('2')
     }, 100);
   }
 };
+const cancelApporval = () => {
+  state.dialogVisible = false;
+  if (state.wktPoint_Poly) {
+    mapRef.value.mapOperations.removeLayer(state.wktPoint_Poly)
+  }
+}
 
 //验证纬度
 const manualLat = () => {