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

src/api/patrolList.js

@@ -16,3 +16,13 @@ export function fetchSelectListByBddxlrwId(params) {
         params
     })
 }
+
+
+// 打卡
+export function fetchTbZdxlFgdwBddxlrwJlClockIn(data) {
+    return service({
+        url: `${api}/tbZdxlFgdwBddxlrwJl/clockIn`,
+        method: 'POST',
+        data
+    })
+}

src/components/GdMap/index.vue

@@ -205,6 +205,12 @@ onMounted(() => {
     mapUtil.value.enableClickEvents()
     console.log(res)
   })
+
+  // 禁用地图
+  emitter.on("setMapInteractions", (res) => {
+    console.log(res)
+    mapUtil.value.setMapInteractions(res);
+  })
 });
 //切换地图底图
 const onMapImageChange = (val) => {
@@ -286,6 +292,7 @@ onUnmounted(() => {
   emitter.off("SsCircle");
   emitter.off("ClearssCircle");
   emitter.off("getMapClickCoordinates");
+  emitter.off("setMapInteractions");
 });
 </script>
 

src/components/GdMap/mapUtil.js

@@ -724,6 +724,71 @@ export function MapUtil(map) {
 
     _that.mMap.mapboxGLMap.on('click', _that.clickEventHandler);
   };
+
+
+    // 在 MapUtil.js 中添加以下方法
+    MapUtil.prototype.disableMapInteractions = function() {
+        const _that = this;
+
+        if (!_that.mMap || !_that.mMap.mapboxGLMap) return;
+
+        const map = _that.mMap.mapboxGLMap;
+
+        // 禁用所有交互
+        map.boxZoom.disable();
+        map.doubleClickZoom.disable();
+        map.dragPan.disable();
+        map.dragRotate.disable();
+        map.keyboard.disable();
+        map.scrollZoom.disable();
+        map.touchZoomRotate.disable();
+
+        // 禁用拖拽
+        map.dragPan.disable();
+
+        // 禁用缩放
+        map.scrollZoom.disable();
+        map.doubleClickZoom.disable();
+        map.touchZoomRotate.disable();
+
+        // 禁用旋转
+        map.dragRotate.disable();
+        map.touchZoomRotate.disable();
+
+        // 禁用键盘操作
+        map.keyboard.disable();
+
+        console.log('地图交互已禁用');
+    };
+
+    MapUtil.prototype.enableMapInteractions = function() {
+        const _that = this;
+
+        if (!_that.mMap || !_that.mMap.mapboxGLMap) return;
+
+        const map = _that.mMap.mapboxGLMap;
+
+        // 启用所有交互
+        map.boxZoom.enable();
+        map.doubleClickZoom.enable();
+        map.dragPan.enable();
+        map.dragRotate.enable();
+        map.keyboard.enable();
+        map.scrollZoom.enable();
+        map.touchZoomRotate.enable();
+
+        console.log('地图交互已启用');
+    };
+
+    MapUtil.prototype.setMapInteractions = function(enabled) {
+        const _that = this;
+
+        if (enabled) {
+            _that.enableMapInteractions();
+        } else {
+            _that.disableMapInteractions();
+        }
+    };
 }
 // 获取uuid 作为边界图层ID
 function getUUid() {

src/pages/clockInPage/components/Timeline.vue

@@ -1,32 +1,45 @@
 <template>
   <div class="info-container">
-    <div class="item" v-for="(item, index) in data" :key="index">
+    <template v-for="(item, index) in data" :key="index">
-      <div class="point"></div>
+      <div v-if="item?.dkKsSj" class="item">
-      <div class="line" v-if="index + 1 != data.length"></div>
+        <div class="point"></div>
-      <div class="info-right">
+        <div class="line" v-if="index + 1 != data.length"></div>
-        <div class="name">{{item.name}}</div>
+        <div class="info-right">
-        <div class="time">打卡时间：<text>{{ item.time }}</text></div>
+          <div class="name">{{ `第${item?.count}次打卡` }}</div>
+          <div class="time">打卡时间：<text>{{ item?.dkKsSj }}</text></div>
 
-        <div class="image">
+          <div v-if="item?.imgUrl" class="image">
-          <img src="../../../assets/home/bddcj.png" alt="">
+            <van-image width="80px" :src="item?.imgUrl" @click="onClickImg(item?.imgUrl)" style="flex: 1">
-        </div>
+              <template v-slot:loading>
+                <van-loading type="spinner" size="20" />
+              </template>
+            </van-image>
+          </div>
 
-        <div class="address">
+          <!--        <div class="address">-->
-          <van-icon name="location-o" color="#1DB1FF" />
+          <!--          <van-icon name="location-o" color="#1DB1FF" />-->
-          <div class="name">四川省成都市</div>
+          <!--          <div class="name">四川省成都市</div>-->
+          <!--        </div>-->
         </div>
       </div>
-    </div>
+    </template>
   </div>
 </template>
 
 <script setup>
+import {ImagePreview} from "vant";
+
 const props = defineProps({
   data: {
     type: Array,
     default: []
   }
 })
+
+//预览图片
+function onClickImg(url) {
+  ImagePreview([url]);
+}
 </script>
 
 <style lang="scss" scoped>

src/pages/clockInPage/index.vue

@@ -1,43 +1,158 @@
 <script setup>
 import TopNav from "@/components/topNav.vue";
-import {onMounted, reactive, ref} from "vue";
+import {onMounted, reactive, ref, computed, nextTick, onUnmounted, watch} from "vue";
 import { useRoute } from "vue-router";
 import Timeline from "@/pages/clockInPage/components/Timeline.vue";
-import {fetchSelectListByBddxlrwId} from "@/api/patrolList";
+import {fetchSelectListByBddxlrwId, fetchTbZdxlFgdwBddxlrwJlClockIn} from "@/api/patrolList";
+import {getBase64, hintToast} from "@/utils/tools";
+import {ImagePreview} from "vant";
+import {qcckPost, qcckGet} from "@/api/qcckApi";
 
 const route = useRoute();
-const activeName = ref("0")
+const active = ref(0)
+const nextStep = ref(0)
 const baseUrl = ref("")
+const fileId = ref("")
+
+
+const startTime = ref("2025-09-08 15:29:00");
+
+const useCountdownFromTime = (minutes = 10) => {
+  const timeLeft = ref(0); // 剩余毫秒数
+  const timer = ref(null);
+  const isRunning = ref(false); // 是否运行中
+  const isExpired = ref(false); // 是否过期
+  const expirationTime = ref(null); // 过期时间
+
+  // 计算过期时间
+  const calculateExpirationTime = (time) => {
+    if (!time) return null;
+
+    try {
+      const startDate = new Date(time);
+      if (isNaN(startDate.getTime())) return null;
+
+      return new Date(startDate.getTime() + minutes * 60000);
+    } catch {
+      return null;
+    }
+  };
+
+  // 更新倒计时
+  const update = () => {
+    if (!expirationTime.value) {
+      isExpired.value = true;
+      isRunning.value = false;
+      return;
+    }
+
+    const now = new Date();
+    timeLeft.value = expirationTime.value - now;
+
+    if (timeLeft.value <= 0) {
+      timeLeft.value = 0;
+      isExpired.value = true;
+      isRunning.value = false;
+      stop();
+      return;
+    }
+
+    if (timeLeft.value > 0) {
+      timer.value = setTimeout(update, 1000);
+    }
+  };
+
+  // 开始倒计时
+  const start = (startTime) => {
+    stop();
+    expirationTime.value = calculateExpirationTime(startTime);
+
+    if (!expirationTime.value) {
+      isExpired.value = true;
+      return;
+    }
+
+    isRunning.value = true;
+    isExpired.value = false;
+    update();
+  };
+
+  // 停止倒计时
+  const stop = () => {
+    if (timer.value) {
+      clearTimeout(timer.value);
+      timer.value = null;
+    }
+    isRunning.value = false;
+  };
+
+  // 格式化时间显示
+  const formattedTime = computed(() => {
+    if (timeLeft.value <= 0) return '00:00';
+
+    const totalSeconds = Math.floor(timeLeft.value / 1000);
+    const mins = Math.floor(totalSeconds / 60);
+    const secs = totalSeconds % 60;
+
+    return `${mins.toString().padStart(2, '0')}:${secs.toString().padStart(2, '0')}`;
+  });
+
+  // 过期时间显示
+  const expirationTimeFormatted = computed(() => {
+    if (!expirationTime.value) return '';
+    return expirationTime.value.toLocaleTimeString('zh-CN', {
+      hour: '2-digit',
+      minute: '2-digit',
+      second: '2-digit',
+      hour12: false
+    });
+  });
+
+  // 自动清理
+  onUnmounted(stop);
+
+  return {
+    timeLeft,
+    formattedTime,
+    expirationTime: expirationTimeFormatted,
+    isRunning,
+    isExpired,
+    start,
+    stop
+  };
+};
 
 const data = reactive({
   tabsList: [],
-  info: []
+  info: [],
 })
-const timeList = [
+
-  {
+const infoData = computed(() => {
-    time:'09:24:34',
+  return data.info?.[nextStep.value]
-    name: '第一次打卡 开始',
+})
-    person:'李小明',
+
-    content:'签收订单, 订单状态变更为待回单, 签收备注为\'无\'',
+const activeInfoData = computed(() => data.tabsList?.[active.value])
-  },
+
-  {
+const { formattedTime, isExpired, expirationTime, start, stop } = useCountdownFromTime(10);
-    time:'2020-03-26 12:30:12',
+
-    name: '吾悦广场',
+// 删除打卡图片
-    person:'李小明',
+const clearImage = () => {
-    content:'创建了订单, 并添加了跟踪方式, 电子设备或快递单号: 854654875',
+  baseUrl.value = ""
-  },
+}
-  {
+
-    time:'2020-03-26 12:30:12',
+// 浏览图片
-    name: '吾悦广场',
+const onClickImg = (url) => {
-    person:'李小明',
+  ImagePreview([url])
-    content:'签收订单, 订单状态变更为待回单, 签收备注为\'无\'',
+}
+
+// 点击上传
+const photoFn = () => {
+  try {
+    bridge.pZ("photo");
+  } catch (err) {
+    console.log(err, 'err');
   }
-]
+}
-const clearImage = () => {}
-
-const onClickImg = () => {}
-
-const photoFn = () => {}
 
 const count = (item) => {
   if (!item || !item.dkSx) return undefined;
@@ -48,20 +163,178 @@ const count = (item) => {
   return numbers[index];
 };
 
+const onChange = (value) => {
+  active.value = value;
+  getData(data.tabsList[value]?.id)
+}
+
+const handleNext = (index) => {
+  stop()
+  nextStep.value = index;
+  start(infoData?.value?.dkKsSj);
+}
+
+function setimage_base64(pzid, base64) {
+  console.log(base64, 'base64');
+  baseUrl.value = `data:image/jpeg;base64,${base64}`;
+  qcckPost({base64:base64}, "/mosty-base/minio/image/upload/base64").then(res => {
+    fileId.value = res;
+  })
+}
+
+const imageCache = new Map();
+
+const getImageUrl = async (fileId) => {
+  if (!fileId) return null;
+
+  // 检查缓存
+  if (imageCache.has(fileId)) {
+    return imageCache.get(fileId);
+  }
+
+  try {
+    const res = await qcckGet({}, `/mosty-base/minio/file/download/${fileId}`);
+    if (res?.url) {
+      const base64 = await getBase64("", res.url);
+      // 存入缓存
+      imageCache.set(fileId, base64);
+      return base64;
+    }
+    return null;
+  } catch (error) {
+    console.warn('获取图片失败:', error);
+    return null;
+  }
+};
+
 const getData = async (bddxlrwId = '') => {
-  const res = await fetchSelectListByBddxlrwId({ bddxlrwId })
+  try {
-  if (res) {
+    const res = await fetchSelectListByBddxlrwId({ bddxlrwId });
-    data.info = res
+    if (res) {
+      // 收集所有需要加载的图片ID
+      const imageIds = res.map(i => i?.dkJsFj).filter(Boolean);
+
+      // 批量获取图片URL
+      const imagePromises = imageIds.map(id => getImageUrl(id));
+      const imageResults = await Promise.allSettled(imagePromises);
+
+      // 创建图片映射表
+      const imageMap = new Map();
+      imageIds.forEach((id, index) => {
+        const result = imageResults[index];
+        imageMap.set(id, result.status === 'fulfilled' ? result.value : null);
+      });
+
+      // 设置数据
+      data.info = res.map(i => ({
+        ...i,
+        count: count(i),
+        imgUrl: imageMap.get(i?.dkJsFj) || null
+      }));
+
+      active.value = 1;
+
+      console.log('完整数据:', data.info);
+
+      await nextTick(() => {
+        const firstItem = data.info[nextStep.value || 0];
+        if (firstItem?.dkKsSj) {
+          startTime.value = infoData?.value?.dkKsSj;
+          start(startTime.value);
+        } else {
+          start('');
+        }
+      });
+    }
+  } catch (error) {
+    console.error(error);
+  }
+};
+
+// 简单的时间加法函数
+const addTenMinutes = (timeString) => {
+  if (!timeString) return '';
+
+  const date = new Date(timeString);
+  if (isNaN(date.getTime())) return '';
+
+  date.setMinutes(date.getMinutes() + 10);
+
+  return date.toLocaleString('zh-CN', {
+    year: 'numeric',
+    month: '2-digit',
+    day: '2-digit',
+    hour: '2-digit',
+    minute: '2-digit',
+    second: '2-digit',
+    hour12: false
+  }).replace(/\//g, '-');
+};
+
+// 判断是否超过10分钟
+const isTenMinutesPassed = (startTime) => {
+  if (!startTime) return false;
+
+  try {
+    const startDate = new Date(startTime);
+    if (isNaN(startDate.getTime())) return false;
+
+    // 计算10分钟后的时间
+    const tenMinutesLater = new Date(startDate.getTime() + 10 * 60 * 1000);
+    const now = new Date();
+
+    // 判断当前时间是否超过10分钟后
+    return now > tenMinutesLater;
+  } catch (error) {
+    console.error('时间判断错误:', error);
+    return false;
+  }
+};
+
+// 打卡
+const handleClick = async () => {
+  const { id } = data.info?.[nextStep.value]
+
+  if (!isTenMinutesPassed(infoData?.value.dkKsSj) && infoData?.value.dkKsSj) {
+    const newTime = addTenMinutes(infoData?.value.dkKsSj);
+    hintToast(`请于${newTime.split(' ')[1]}后打卡`)
+    return
+  }
+
+  if (fileId.value === '') {
+    hintToast('请拍照再打卡');
+    return
+  }
+
+  const { lng, lat } = getLocation()
+  try {
+    const res = await fetchTbZdxlFgdwBddxlrwJlClockIn({
+      id,
+      dkWd: lat,
+      dkJd: lng,
+      dkFj: fileId.value,
+    })
+
+    if (res) {
+      hintToast(`打卡成功`)
+      await getData(data.tabsList?.[0]?.id)
+      start();
+    }
+  } catch (error) {
+    hintToast(`打卡异常`)
+    stop()
+    console.log(error);
   }
 }
 
 onMounted(() => {
   if (route.query.item) {
     data.tabsList = JSON.parse(route.query.item)
-    console.log(data.tabsList)
   }
 
-  getData(data.tabsList[0]?.id)
+  getData(data.tabsList?.[0]?.id)
+
+  window.setimagebase64 = setimage_base64;
 })
 </script>
 
@@ -70,30 +343,28 @@ onMounted(() => {
     <top-nav navTitle="打卡" :showLeft="true" />
 
     <div class="clockInWrapper">
-      <van-tabs v-model="activeName">
+      <van-tabs v-model:active="active" :active="active" @click="onChange">
-        <template v-for="(item, index) in data.tabsList" :key="item?.id">
+        <template v-for="(item, index) in data.tabsList" :key="index">
-          <van-tab :name="index" :title="item?.bddMc" />
+          <van-tab :title="item.bddMc" />
         </template>
       </van-tabs>
 
       <div class="clockInList">
         <template v-for="(item, index) in data.info" :key="index">
-          <div class="clockInList_item">
+          <div class="clockInList_item" @click="handleNext(index)">
-            <div class="label">{{ `第${count(item)}次打卡` }}</div>
+            <div class="label">{{ `第${item?.count}次打卡` }}</div>
-            <div class="dec">开始</div>
+            <div class="dec">
-            <div class="dec">离开</div>
+              <van-icon v-if="item?.dkKsSj" name="checked" color="#007DE9" />
+              <div>开始</div>
+              <div v-if="item?.dkKsSj" class="time">{{ item?.dkKsSj?.split(' ')[1] }}已打卡</div>
+            </div>
+            <div class="dec">
+              <van-icon v-if="item?.dkJsSj" name="checked" color="#007DE9" />
+              <div>离开</div>
+              <div v-if="item?.dkJsSj" class="time">{{ item?.dkJsSj?.split(' ')[1] }}已打卡</div>
+            </div>
           </div>
         </template>
-<!--        <div class="clockInList_item">-->
-<!--          <div class="label">第一次打卡</div>-->
-<!--          <div class="dec">开始</div>-->
-<!--          <div class="dec">离开</div>-->
-<!--        </div>-->
-<!--        <div class="clockInList_item">-->
-<!--          <div class="label">第一次打卡</div>-->
-<!--          <div class="dec">开始</div>-->
-<!--          <div class="dec">离开</div>-->
-<!--        </div>-->
       </div>
 
       <div class="upload_box">
@@ -115,18 +386,18 @@ onMounted(() => {
       </div>
 
       <div class="clockWrapper">
-        <div class="circleWrapper">
+        <div class="circleWrapper" :class="{ 'disabled': !isExpired && expirationTime }" @click="handleClick">
-          <div class="time">10：00：00后</div>
+          <div v-if="!isExpired && expirationTime" class="time">{{ formattedTime }}后</div>
-          <div class="title">开始</div>
+          <div class="title">{{ !infoData?.dkKsSj ? `开始` : `离开` }}</div>
-          <div class="info">第一次打卡</div>
+          <div class="info">{{ `第${infoData?.count}次打卡` }}</div>
         </div>
         <div class="circleWrapperTip">
           <van-icon name="success" color="#FFFFFF" />
-          <div>已进入考勤范围：打卡点1德阳市某某某</div>
+          <div>已进入考勤范围：{{ activeInfoData?.bddMc }}</div>
         </div>
       </div>
 
-      <timeline :data="timeList" />
+      <timeline :data="data.info" />
     </div>
   </div>
 </template>
@@ -182,6 +453,7 @@ onMounted(() => {
       .time {
         font-weight: 400;
         font-size: 4.8vw;
+        margin-bottom: 1.33vw;
       }
 
       .title {
@@ -192,8 +464,14 @@ onMounted(() => {
       .info {
         font-weight: 400;
         font-size: 3.73vw;
+        margin-top: 1.33vw;
       }
     }
+
+    .disabled {
+      background: #EDEDED !important;
+      color: #75787F !important;
+    }
   }
 
   .upload_box {
@@ -244,6 +522,7 @@ onMounted(() => {
     display: flex;
     justify-content: space-between;
     margin-top: 4vw;
+    overflow-y: auto;
 
     .clockInList_item {
       padding: 4vw 2vw;
@@ -251,6 +530,12 @@ onMounted(() => {
       height: 18vw;
       background: #EDEDED;
       border-radius: 2.67vw;
+      flex-shrink: 0;
+      margin-right: 2.67vw;
+
+      &:last-child {
+        margin-right: 0;
+      }
 
       .label {
         font-weight: 400;
@@ -258,9 +543,18 @@ onMounted(() => {
       }
 
       .dec {
+        display: flex;
+        align-items: center;
         color: #75787F;
         font-size: 3.73vw;
         margin-top: 1.33vw;
+
+        .van-icon-checked {
+          margin-right: 1.33vw;
+        }
+        .time {
+          margin-left: 1.33vw;
+        }
       }
     }
   }
@@ -275,7 +569,7 @@ onMounted(() => {
     }
 
     .van-tabs__line {
-      display: none;
+      opacity: 0;
     }
 
     .van-tab {

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 () => {
+      setTimeout( () => {
-        await router.push(`/collectPage`)
+        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(() => {
-  // 获取经纬度
+  if (route.query?.item) {
-  emitter.emit("getMapClickCoordinates");
+    // 查看详情禁用处理
+    formData.value = JSON.parse(route.query.item)
+    console.log(formData.value)
+    disabled.value = true
 
-  // 更新地图标注位置
+    navTitle.value = '必到点采集详情'
-  emitter.on("mapClickCoordinates", async (res) => {
-    emitter.emit("deletePointArea")
 
-    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 }],
+    emitter.emit("getMapClickCoordinates");
-      coordinates: res?.coordinates,
+
-      icon: require("../../assets/lz/dw.png"),
+    // 更新地图标注位置
-      sizeX: 30,
+    emitter.on("mapClickCoordinates", async (res) => {
-      sizeY: 35
+      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

src/pages/collectPage/copmonents/customPopup.vue

@@ -36,6 +36,7 @@ const onSearch = (value) => {
 }
 
 const onRadionChange = (value) => {
+  emitter.emit("deletePointArea", "zdxl_fzyc")
   emits('change', value)
 
   const { x1, y1, x2, y2, id, zxX, zxY, mc } = value

src/pages/collectPage/copmonents/listItemWrapper.vue

@@ -1,4 +1,6 @@
 <script setup>
+import router from "@/router";
+
 const props = defineProps({
   list: {
     type: Array,
@@ -7,14 +9,17 @@ const props = defineProps({
   }
 })
 
-const emits = defineEmits(["onConfirm"]);
 
+const handleTo = (item) => {
+  const { bddMc, bddDz, wd, jd, fgdwMc } = item
+  router.push({ path: "/collectAndAdd", query: { item: JSON.stringify({ bddMc, bddDz, wd, jd, mc: fgdwMc }) } });
+}
 </script>
 
 <template>
   <div class="item-wrapper">
     <template v-for="(item, index) in list" :key="index">
-      <div class="item">
+      <div class="item" @click="handleTo(item)">
         <div class="title">{{ item.bddMc }}</div>
         <div class="infoWrapper">
 <!--          <div class="mt">所属部门：{{ item.sssgaj }}</div>-->

src/pages/patrolList/copmonents/patrolWrapper.vue

@@ -22,11 +22,11 @@ const handleClockInPage = (item) => {
       <div class="item" @click="handleClockInPage(item)">
         <div class="rowWrapper">
           <div class="title">{{ item?.fgMc }}</div>
-          <div class="progress">50%</div>
+          <div class="progress">{{ item?.bddAllProgress || 0 }}%</div>
         </div>
 
         <div class="rowWrapper mt co99 fz12">
-          <div>预警等级：{{ item?.fgYjdj }}</div>
+          <div>预警等级：{{ item?.fgYjdjLabel }}</div>
           <div>任务日期：{{ item?.rwRq }}</div>
         </div>
         <div class="rowWrapper mt co99 fz12">

src/pages/patrolList/index.vue

@@ -4,6 +4,7 @@ import TopNav from "@/components/topNav.vue";
 import Search from "@/components/search.vue";
 import PatrolWrapper from "@/pages/patrolList/copmonents/patrolWrapper.vue";
 import {fetchPatrolList} from "@/api/patrolList";
+import {getDictListByCode} from "@/api/common";
 
 const finished = ref(false);
 const loading = ref(false);
@@ -84,6 +85,8 @@ const getData = async () => {
       })) || []
       pageData.total = res?.total
       loading.value = false;
+
+      await getDictList()
     }
     loadingRefresh.value = false;
 
@@ -93,6 +96,15 @@ const getData = async () => {
   }
 }
 
+const getDictList = async () => {
+  const res = await getDictListByCode({ dictCode: 'D_ZDXL_FGXLRW_YJDJ' })
+
+  data.list = (data.list || []).map(item => ({
+    ...item,
+    fgYjdjLabel: (res?.itemList || []).find(i => i.dm === item.fgYjdj)?.zdmc || item.fgYjdj
+  }));
+}
+
 onMounted(() => {
   getData()
 })
@@ -105,7 +117,6 @@ onMounted(() => {
     <van-sticky>
       <div class="header">
         <search
-          :isSx="true"
           placeholder="请输入方格名称进行查询"
           v-model="searchValue"
           @update:modelValue="onSearch"

src/utils/tools.js

@@ -26,7 +26,7 @@ export function timeValidate(date, type) {
 }
 
 
-// 获取当前近多少天  7后7天  -7 前五天 
+// 获取当前近多少天  7后7天  -7 前五天
 export function getRecentDay(n, type) {
 	var currentDate = new Date();
 	var preDate = new Date(currentDate.getTime() + n * 24 * 3600 * 1000)
@@ -41,7 +41,7 @@ export function getRecentDay(n, type) {
 	}
 }
 
-// 获取n近7月  7后7 -7 前 
+// 获取n近7月  7后7 -7 前
 export function getnRencebtMonth(n) {
 	let date = new Date();
 	date.setMonth(date.getMonth() - n)
@@ -73,7 +73,7 @@ export function setArray(array) {
 }
 
 /**
- * 合并数据 
+ * 合并数据
  * @param {Object} array 数据
  */
 export function hbArray(array, item1, item2, item3) {
@@ -96,8 +96,8 @@ export function hbArray(array, item1, item2, item3) {
 }
 /**
  * 时间格式
- * @param {*} type 
+ * @param {*} type
- * @param {*} time 
+ * @param {*} time
  */
 export function dateFormat(type, time) {
 	let date
@@ -166,7 +166,7 @@ function setTimeTormat(date) {
 }
 /**
  * 获取类型名称
- * @param {*} type 
+ * @param {*} type
  */
 export function getTypeName(type) {
 	let name
@@ -385,19 +385,33 @@ export function compare(attr, rev) {
  * @param {*} url 地址
  */
 export function getBase64(fun, url) {
-	axios.get(`${baseUrl2}/mosty-api/mosty-base/image/base64`, {
+    if (fun && typeof fun === 'function') {
-		params: {
+        axios.get(`${baseUrl2}/mosty-api/mosty-base/image/base64`, {
-			url
+            params: {
-		}
+                url
-	}).then((res) => {
+            }
-		fun(`data:image/jpeg;base64,${res.data.data}`);
+        }).then((res) => {
-	}).catch((err) => {
+            fun(`data:image/jpeg;base64,${res.data.data}`);
-		fun("");
+        }).catch((err) => {
-	});
+            fun("");
+        });
+    } else {
+        // Promise模式
+        return new Promise((resolve, reject) => {
+            axios.get(`${baseUrl2}/mosty-api/mosty-base/image/base64`, {
+                params: { url }
+            }).then((res) => {
+                resolve(`data:image/jpeg;base64,${res.data.data}`);
+            }).catch((err) => {
+                console.error('获取base64失败:', err);
+                resolve("");
+            });
+        });
+    }
 }
 /**
  * 文件是否是图片
- * @param {*} val 
+ * @param {*} val
  */
 export function IS_PNG(val) {
 	return ['bmp', 'jpg', 'png', 'tif', 'gif', 'pcx', 'tga', 'exif', 'fpx', 'svg', 'psd', 'cdr', 'pcd', 'dxf', 'ufo',
@@ -406,7 +420,7 @@ export function IS_PNG(val) {
 }
 /**
  * 文件是否是音频
- * @param {*} val 
+ * @param {*} val
  */
 export function IS_MP3(val) {
 	return ['mp3', 'wav', 'wma', 'mp2', 'flac', 'midi', 'ra', 'ape', 'aac', 'cda', 'mov'].indexOf(val.toLowerCase()) !==
@@ -415,7 +429,7 @@ export function IS_MP3(val) {
 
 /**
  * 文件是否是视频
- * @param {*} val 
+ * @param {*} val
  */
 export function IS_MP4(val) {
 	return ['avi', 'wmv', 'mpeg', 'mp4', 'm4v', 'mov', 'asf', 'fiv', 'f4v', 'mvb', 'rm', '3gp', 'vob'].indexOf(val
@@ -530,7 +544,7 @@ export function getWeatherData(params, fun) {
 /**
  * 提示窗口
  * @param {*} msg  消息
- * @param {*} hintType  位置 
+ * @param {*} hintType  位置
  */
 Toast.allowMultiple();
 export function hintToast(msg, hintType = 'top') {
@@ -538,4 +552,4 @@ export function hintToast(msg, hintType = 'top') {
 		message: msg,
 		position: hintType
 	})
-}
+}