feat:地图弹框形式展示

src/views/map/index.vue

@@ -2,14 +2,24 @@
 <script>
 import { reactive, toRefs, onMounted } from "vue";
 export default {
-  setup() {
+   props: {
+    obj: {
+      type: Object,
+      default: {},
+    },
+
+  },
+  setup(props) {
     let state = reactive({});
 
     let methods = {
-      init() {
-        function getQueryParamsNew() {
+      init(item) {
+    /*    function getQueryParamsNew() {
+          //console.log(window.location.search)
           const params = new URLSearchParams(window.location.search);
+          //console.log(params)
           let paramsObj = {};
+          //console.log(params)
           for (const [key, value] of params.entries()) {
             if (paramsObj.hasOwnProperty(key)) {
               if (Array.isArray(paramsObj[key])) {
@@ -21,11 +31,14 @@ export default {
               paramsObj[key] = value;
             }
           }
+         // console.log(paramsObj)
           return paramsObj;
         }
-        var queryParamsNew = getQueryParamsNew();
-        state.queryParamsNew = queryParamsNew;
-
+        var queryParamsNew = getQueryParamsNew();*/
+     //   state.queryParamsNew = queryParamsNew;
+  //   console.log(item)
+       let queryParamsNew =item
+       // console.log(queryParamsNew)
         const lng = queryParamsNew.lng; //经度
         const lat = queryParamsNew.lat; // 纬度
         // 初始化地图
@@ -59,7 +72,8 @@ export default {
       },
     };
     onMounted(() => {
-      methods.init();
+     console.log(props)
+     methods.init(props.obj);
     });
     return {
       ...toRefs(state),
@@ -76,12 +90,12 @@ export default {
 </template>
 
 <style >
-.layout-sider {
+/*.layout-sider {
   display: none;
 }
 .layout-main-header {
   display: none;
-}
+}*/
 .mapmain {
   height: 100%;
   width: 100%;

src/views/task/content/Content.vue

@@ -15,6 +15,7 @@ import { useInfiniteScroll } from '@vueuse/core'
 import BatchModal from '../modal/BatchModal.vue'
 import CustomSettingModal from '../modal/CustomSettingModal.vue'
 import ImgDetailModal from "../modal/ImgDetailModal.vue"
+import MapModal from "../modal/MapModal.vue"
 import PictureTable from './PictureTable.vue'
 import TaskTable from './TaskTable.vue'
 import History from './History.vue'
@@ -46,6 +47,7 @@ const selectItems = ref<any[]>([])
 const message = useMessage()
 const dialog = useDialog()
 const notPassModalRef = ref(null)
+const MapModalRef= ref(null)
 const batchModalRef: any = ref(null)
 const totalCount = ref(0)
 const taskId: any = ref('') // 任务id
@@ -331,7 +333,7 @@ async function handleDragEnd(event, item) {
 }
 async function addSuspicious() {
   taskStore.setInFileId(taskDetailInfo.value.ocrPicture)
-  console.log(taskDetailInfo.value.ocrPicture)
+//  console.log(taskDetailInfo.value.ocrPicture)
   if (taskDetailInfo.value.ocrPicture.pictureid) {
     const res = await dubiousfileyd({
       pictureid: taskDetailInfo.value.ocrPicture.id,
@@ -529,15 +531,18 @@ function switchBatch() {
 
 function getrowValue(e) {
   if (e.key == 'location') {
+  const modal = unref(MapModalRef)! as any
+console.log(modal)
    const locationobj = JSON.parse(taskDetailInfo.value.ocrPicture.location)
     const lat = locationobj.lat.$numberDecimal
     const lng = locationobj.lng.$numberDecimal
     const name = e.value
-    const protocol = window.location.protocol
-    const hostname = window.location.hostname
-    const port = window.location.port
-    const hostWithPort = `${protocol}//${hostname}:${port}/`
-    window.open(`${hostWithPort}map` + `?name=${name}&lat=${lat}&lng=${lng}`)
+  modal.showModal({name,lat,lng})   
+   // const protocol = window.location.protocol
+    //const hostname = window.location.hostname
+   // const port = window.location.port
+    //const hostWithPort = `${protocol}//${hostname}:${port}/`
+   // window.open(`${hostWithPort}map` + `?name=${name}&lat=${lat}&lng=${lng}`)
   }
 }
 function overTaskHandelr(item: any) {
@@ -1380,6 +1385,7 @@ function nopassfun(e){
     <BatchModal ref="batchModalRef" @reject="rejectHandler" @approval="approvalHandler" />
     <CustomSettingModal ref="CustomSettingModalRef" @on-ok="getDetail" />
     <img-detail-modal ref="imgdetailref" @passfun="passfun"  @nopassfun="nopassfun"/>
+    <MapModal ref="MapModalRef"/>
   </div>
 </template>