新增必到点采集详情页面 处理打卡

src/pages/collectPage/collectAndAdd.vue

@@ -7,11 +7,14 @@ import GdMap from "@/components/GdMap/index.vue"
 import {addSaveData} from "@/api/collectPage";
 import {hintToast} from "@/utils/tools";
 import router from "@/router";
+import {useRoute} from "vue-router";
 
+const navTitle = ref("必到点采集新增")
 const loading = ref(false)
 const disabled = ref(false)
 const visible = ref(false)
 const formData = ref({})
+const route = useRoute()
 
 const onSubmit = async (data) => {
   try {
@@ -20,8 +23,8 @@ const onSubmit = async (data) => {
     if (res) {
       hintToast(res?.msg || '新增成功')
 
-      setTimeout(async () => {
-        await router.push(`/collectPage`)
+      setTimeout( () => {
+        router.back()
       }, 500)
     }
   } catch (error) {
@@ -40,34 +43,53 @@ const handleChange = (val) => {
   formData.value.fgdwId = val?.id
 }
 
+const handleVisible = () => {
+  if (disabled.value) return
+  visible.value = true
+}
+
 onMounted(() => {
-  // 获取经纬度
-  emitter.emit("getMapClickCoordinates");
+  if (route.query?.item) {
+    // 查看详情禁用处理
+    formData.value = JSON.parse(route.query.item)
+    console.log(formData.value)
+    disabled.value = true
 
-  // 更新地图标注位置
-  emitter.on("mapClickCoordinates", async (res) => {
-    emitter.emit("deletePointArea")
+    navTitle.value = '必到点采集详情'
 
-    formData.value.jd = res.lng
-    formData.value.wd = res.lat
+    // 禁用地图
+    emitter.emit("setMapInteractions", !disabled.value)
+  } else {
+    disabled.value = false
 
-    emitter.emit("addPointArea", {
-      coords: [{ jd: res.lng, wd: res.lat }],
-      coordinates: res?.coordinates,
-      icon: require("../../assets/lz/dw.png"),
-      sizeX: 30,
-      sizeY: 35
-    });
-  })
+    // 获取经纬度
+    emitter.emit("getMapClickCoordinates");
+
+    // 更新地图标注位置
+    emitter.on("mapClickCoordinates", async (res) => {
+      emitter.emit("deletePointArea")
+
+      formData.value.jd = res.lng
+      formData.value.wd = res.lat
+
+      emitter.emit("addPointArea", {
+        coords: [{ jd: res.lng, wd: res.lat }],
+        coordinates: res?.coordinates,
+        icon: require("../../assets/lz/dw.png"),
+        sizeX: 30,
+        sizeY: 35
+      });
+    })
+  }
 })
 </script>
 
 <template>
   <div>
-    <TopNav navTitle="必到点采集新增" :showLeft="true" />
+    <TopNav :navTitle="navTitle" :showLeft="true" />
 
     <div class="formWrapper">
-      <van-form @submit="onSubmit" class="form" :disabled="disabled">
+      <van-form @submit="onSubmit" class="form" :readonly="disabled">
 <!--        <van-field-->
 <!--          v-model="formData.cjsbQk"-->
 <!--          readonly-->
@@ -77,7 +99,7 @@ onMounted(() => {
         <van-field
            v-model="formData.bddMc"
            name="bddMc"
-           required
+           :required="!disabled"
            label="必到点名称"
            placeholder="请输入必到点名称"
            :rules="[{ required: true, message: '请输入必到点名称' }]"
@@ -85,18 +107,18 @@ onMounted(() => {
         <van-field
            v-model="formData.mc"
            name="mc"
-           required
+           :required="!disabled"
            is-link
            readonly
            label="所属方格"
            placeholder="请输入必到点名称"
            :rules="[{ required: true, message: '请输入必到点名称' }]"
-           @click="visible = true"
+           @click="handleVisible"
         />
         <van-field
            v-model="formData.bddDz"
            name="bddDz"
-           required
+           :required="!disabled"
            label="地址"
            placeholder="请输入必到点名称"
            :rules="[{ required: true, message: '请输入必到点名称' }]"
@@ -104,7 +126,7 @@ onMounted(() => {
         <van-field
            v-model="formData.jd"
            name="jd"
-           required
+           :required="!disabled"
            label="经度"
            placeholder="请输入经度"
            :rules="[{ required: true, message: '请输入经度' }]"
@@ -112,7 +134,7 @@ onMounted(() => {
         <van-field
            v-model="formData.wd"
            name="wd"
-           required
+           :required="!disabled"
            label="纬度"
            placeholder="请输入纬度"
            :rules="[{ required: true, message: '请输入纬度' }]"
@@ -124,7 +146,7 @@ onMounted(() => {
          </div>
        </div>
 
-        <div class="btn">
+        <div class="btn" v-if="!disabled">
           <van-button
             round
             block