养护员退回

刘淇
1 parent 7a96cf50
Showing 7 changed files with 517 additions and 155 deletions
common/utils/common.js
common/utils/useUploadImgs.js
pages-sub/daily/patrol-manage/add-patrol-record.vue
pages-sub/problem/work-order-manage/add-maintain-order.vue
pages-sub/problem/work-order-manage/distribution-order.vue
pages-sub/problem/work-order-manage/index.vue
pages-sub/problem/work-order-manage/order-detail.vue
@@ -11,6 +11,7 @@ export const nextStepMap = {
     name: '养护员待实施',
     btnText: '实施',
     operateTypePass: 120,
+    operateTypeNoPass: 220,
     backShow: true,
     renewShow: false
   },
@@ -19,18 +19,32 @@ export function useUploadImgs(config) {
     const imgList = ref([])
  
     /**
+     * 新增：清空所有图片
+     * 功能：重置图片列表为空，并触发表单字段校验（如果有表单Ref）
+     */
+    const clearImgs = () => {
+        imgList.value = [];
+        // 优化：先判断 formRef 存在，再判断 formRef.value 存在
+        if (defaultConfig.formRef && defaultConfig.formRef.value && defaultConfig.fieldName) {
+            defaultConfig.formRef.value.validateField(defaultConfig.fieldName);
+        }
+    };
+
+
+    /**
      * 删除图片
      */
     const deleteImg = (event) => {
-        // 确保index是有效数字
-        const index = Number(event.index)
-        if (isNaN(index) || index < 0 || index >= imgList.value.length) return
-
-        imgList.value.splice(index, 1)
-        // 删除后重新校验
-        defaultConfig.formRef.value?.validateField(defaultConfig.fieldName)
-        uni.showToast({ title: '图片删除成功', icon: 'success' })
-    }
+      const index = Number(event.index);
+      if (isNaN(index) || index < 0 || index >= imgList.value.length) return;
+
+      imgList.value.splice(index, 1);
+      // 修复：先判断 formRef 存在，再访问 value
+      if (defaultConfig.formRef && defaultConfig.formRef.value && defaultConfig.fieldName) {
+        defaultConfig.formRef.value.validateField(defaultConfig.fieldName);
+      }
+      uni.showToast({ title: '图片删除成功', icon: 'success' });
+    };
  
     /**
      * 上传图片（适配u-upload的file格式）
@@ -106,7 +120,9 @@ export function useUploadImgs(config) {
             }
  
             // 上传完成后校验
-            defaultConfig.formRef.value?.validateField(defaultConfig.fieldName)
+            if (defaultConfig.formRef && defaultConfig.formRef.value && defaultConfig.fieldName) {
+                defaultConfig.formRef.value.validateField(defaultConfig.fieldName);
+            }
         } catch (err) {
             console.error(`【${defaultConfig.fieldName}】图片上传失败：`, err)
             // 标记所有上传失败
@@ -147,11 +163,39 @@ export function useUploadImgs(config) {
         }
     }
  
+    /**
+     * 新增：批量设置图片列表（图片回显核心方法，替代业务页面的setUploadImgsList）
+     * @param imgUrls 图片URL数组（如：['https://xxx.jpg', 'https://yyy.png']）
+     * 功能：将纯URL数组转换为u-upload兼容格式，实现静默回显，无数据时不提示
+     */
+    const setImgList = (imgUrls = []) => {
+        // 容错处理：校验参数有效性，非数组/空数组直接重置
+        if (!Array.isArray(imgUrls) || imgUrls.length === 0) {
+            imgList.value = []
+            return
+        }
+
+        // 转换为u-upload兼容的格式（status: success 标记为已成功上传，可正常显示/删除）
+        const formatImgList = imgUrls.map(url => ({
+            url: url,
+            status: 'success', // 关键：标记为成功状态，兼容后续删除/校验逻辑
+            message: '',
+            name: url.substring(url.lastIndexOf('/') + 1), // 从URL截取文件名，优化显示
+            size: 0 // 历史图片无大小信息，默认0不影响使用
+        }))
+
+        // 额外优化：限制回显数量不超过maxCount，避免异常
+        const finalImgList = formatImgList.slice(0, defaultConfig.maxCount)
+        imgList.value = finalImgList
+    }
+
     return {
-        imgList: imgList.value, // 核心修复：返回纯数组（解除响应式代理）
+        imgList: imgList, // 核心修复：返回纯数组（解除响应式代理）
         rawImgList: imgList,    // 保留响应式引用（内部使用）
         uploadImgs,
         deleteImg,
+        clearImgs,
+        setImgList,
         getSuccessImgUrls,
         imgValidateRule,
         uploadConfig: defaultConfig
@@ -10,6 +10,7 @@
       >
         <!-- 1. 巡查描述（文本域） -->
         <up-form-item
+            label="巡查描述"
             prop="content"
             class="form-item"
             required
@@ -7,7 +7,7 @@
           ref="workOrderFormRef"
           labelWidth="170rpx"
       >
-        <!-- 1. 工单编号（只读展示，从URL获取） -->
+        <!-- 1. 工单编号（只读展示，从缓存获取） -->
         <up-form-item
             label="工单编号"
             border-bottom
@@ -285,32 +285,157 @@ const workOrderFormRules = reactive({
   reason: [
     { type: 'string', required: true, message: '请输入处理情况描述', trigger: ['change', 'blur'] },
     { type: 'string', max: 200, message: '处理情况描述最多200字', trigger: ['change', 'blur'] }
-  ],
-  // 新增5个图片字段校验
-  // startImgs: [startImgs.imgValidateRule],
-  // processingImgs: [processingImgs.imgValidateRule],
-  // endImgs: [endImgs.imgValidateRule],
-  // personImgs: [personImgs.imgValidateRule],
-  // materialImgs: [materialImgs.imgValidateRule]
+  ]
 })
  
-// 生命周期 - 从URL获取工单编号
+// 生命周期 - 从本地缓存获取完整工单数据
 onLoad((options) => {
+  try {
+    // 1. 校验tempKey是否缺失
+    if (!options || !options.tempKey) {
+      uni.showToast({
+        title: '缺失工单缓存Key，无法加载数据',
+        icon: 'none',
+        duration: 3000
+      });
+      console.error('onLoad异常：options或tempKey缺失');
+      return;
+    }
  
+    const { tempKey } = options;
+    let orderItem = {};
+    // 2. 读取缓存并校验缓存数据是否有效
+    orderItem = uni.getStorageSync(tempKey) || {};
+    if (JSON.stringify(orderItem) === '{}') {
+      uni.showToast({
+        title: '工单缓存数据为空，请重新进入',
+        icon: 'none',
+        duration: 3000
+      });
+      console.error('onLoad异常：工单缓存数据为空');
+      // 可选：返回上一页
+      // setTimeout(() => uni.navigateBack(), 1500);
+      return;
+    }
  
-      workOrderForm.workerDataId = options.id
-      workOrderForm.taskId = options.taskId
-      workOrderForm.orderNo = options.orderNo
+    // 可选：读取后移除缓存，避免冗余数据
+    uni.removeStorageSync(tempKey);
  
-  console.log('从URL获取工单编号：', workOrderForm.taskId)
+    // 3. 填充基础表单数据（存在则赋值，不存在则提示）
+    if (!orderItem.id) {
+      uni.showToast({
+        title: '缺失工单ID，数据异常',
+        icon: 'none',
+        duration: 2000
+      });
+      console.warn('工单数据缺失：id');
+    }
+    if (!orderItem.taskId) {
+      uni.showToast({
+        title: '缺失任务ID，提交可能失败',
+        icon: 'none',
+        duration: 2000
+      });
+      console.warn('工单数据缺失：taskId');
+    }
+    if (!orderItem.orderNo) {
+      uni.showToast({
+        title: '缺失工单编号，数据异常',
+        icon: 'none',
+        duration: 2000
+      });
+      console.warn('工单数据缺失：orderNo');
+    }
+
+    workOrderForm.workerDataId = orderItem.id || '';
+    workOrderForm.taskId = orderItem.taskId || '';
+    workOrderForm.orderNo = orderItem.orderNo || '';
+    workOrderForm.reason = orderItem.handleResult || ''; // 处理情况回显
+
+    // 共同处理人（如有数据则回显）
+    if (orderItem.coHandlers && orderItem.coHandlersName) {
+      workOrderForm.coProcessorId = orderItem.coHandlers;
+      workOrderForm.coProcessorName = orderItem.coHandlersName;
+    } else {
+      console.warn('工单数据提示：无共同处理人信息');
+    }
+
+    // 4. 回显各类图片：使用 useUploadImgs 内置 setImgList 方法（自动添加 status: 'success'）
+    // 校验图片字段是否存在，不存在则赋值空数组，避免报错
+    const startImgsArr = orderItem.startImgs || [];
+    const processingImgsArr = orderItem.processingImgs || [];
+    const endImgsArr = orderItem.endImgs || [];
+    const personImgsArr = orderItem.personImgs || [];
+    const materialImgsArr = orderItem.materialImgs || [];
+
+    // 图片回显前校验数组有效性
+    if (!Array.isArray(startImgsArr)) {
+      uni.showToast({
+        title: '开始图片数据格式异常',
+        icon: 'none',
+        duration: 2000
+      });
+      console.error('开始图片异常：非数组格式');
+    }
+    if (!Array.isArray(endImgsArr)) {
+      uni.showToast({
+        title: '结束图片数据格式异常',
+        icon: 'none',
+        duration: 2000
+      });
+      console.error('结束图片异常：非数组格式');
+    }
+
+    startImgs.setImgList(startImgsArr);
+    processingImgs.setImgList(processingImgsArr);
+    endImgs.setImgList(endImgsArr);
+    personImgs.setImgList(personImgsArr);
+    materialImgs.setImgList(materialImgsArr);
+
+    // 5. 校验必填图片（开始/结束）是否为空，提前提示
+    if (startImgsArr.length === 0) {
+      uni.showToast({
+        title: '开始图片为空，请补充上传',
+        icon: 'none',
+        duration: 2000
+      });
+      console.warn('工单提示：开始图片数组为空');
+    }
+    if (endImgsArr.length === 0) {
+      uni.showToast({
+        title: '结束图片为空，请补充上传',
+        icon: 'none',
+        duration: 2000
+      });
+      console.warn('工单提示：结束图片数组为空');
+    }
+
+    console.log('工单数据初始化完成：', workOrderForm);
+  } catch (error) {
+    uni.showToast({
+      title: '工单数据加载失败，请重试',
+      icon: 'none',
+      duration: 3000
+    });
+    console.error('获取工单缓存数据失败：', error);
+    // 可选：返回上一页
+    // setTimeout(() => uni.navigateBack(), 1500);
+  }
 })
  
 // 生命周期 - 初始化表单规则
 onReady(() => {
-  if (workOrderFormRef.value) {
-    workOrderFormRef.value.setRules(workOrderFormRules)
+  // 校验表单实例是否存在
+  if (!workOrderFormRef.value) {
+    uni.showToast({
+      title: '表单实例初始化失败',
+      icon: 'none',
+      duration: 2000
+    });
+    console.error('onReady异常：workOrderFormRef.value 为空');
+    return;
   }
-  console.log('工单表单规则初始化完成')
+  workOrderFormRef.value.setRules(workOrderFormRules)
 })
  
 // 生命周期 - 加载共同处理人列表
@@ -329,32 +454,77 @@ const loadCoProcessorList = async () =&gt; {
       pageSize: 100
     }
     const res = await getYlWorkersPage(queryData)
+
+    // 校验接口返回数据是否有效
+    if (!res || !res.list) {
+      uni.showToast({
+        title: '获取处理人列表失败（无数据）',
+        icon: 'none',
+        duration: 2000
+      });
+      console.error('loadCoProcessorList异常：接口返回无有效数据');
+      coProcessorList.value = [];
+      uni.hideLoading();
+      return;
+    }
+
     uni.hideLoading()
  
     if (res.list && res.list.length > 0) {
-      coProcessorList.value = res.list.map(item => ({
-        name: item.nickname,
-        value: item.id,
-        id: item.id
-      }))
-      console.log('共同处理人列表：', coProcessorList.value)
+      coProcessorList.value = res.list.map(item => {
+        // 校验列表项是否含必填字段
+        if (!item.id || !item.nickname) {
+          console.warn('处理人列表项异常：缺失id或nickname', item);
+          return null;
+        }
+        return {
+          name: item.nickname,
+          value: item.id,
+          id: item.id
+        }
+      }).filter(Boolean); // 过滤null项
     } else {
       coProcessorList.value = []
-      uni.showToast({ title: '未查询到处理人数据', icon: 'none' })
+      uni.showToast({
+        title: '暂无共同处理人数据',
+        icon: 'none',
+        duration: 2000
+      });
+      console.warn('loadCoProcessorList提示：处理人列表为空');
     }
   } catch (err) {
     uni.hideLoading()
+    uni.showToast({
+      title: '获取处理人列表失败，请重试',
+      icon: 'none',
+      duration: 3000
+    });
     console.error('获取共同处理人列表失败：', err)
-    uni.showToast({ title: '获取处理人失败，请重试', icon: 'none' })
     coProcessorList.value = []
   }
 }
  
 // 打开通用下拉弹窗（仅共同处理人）
 const handleActionSheetOpen = (type) => {
-  // 共同处理人列表为空提示
+  // 校验弹窗类型是否为支持的类型
+  if (type !== 'coProcessor') {
+    uni.showToast({
+      title: '不支持该弹窗类型',
+      icon: 'none',
+      duration: 2000
+    });
+    console.error('handleActionSheetOpen异常：不支持的弹窗类型', type);
+    return;
+  }
+
+  // 共同处理人列表为空时，提示并返回
   if (type === 'coProcessor' && coProcessorList.value.length === 0) {
-    uni.showToast({ title: '暂无处理人数据可选', icon: 'none' })
+    uni.showToast({
+      title: '暂无共同处理人可选',
+      icon: 'none',
+      duration: 2000
+    });
+    console.warn('handleActionSheetOpen提示：共同处理人列表为空');
     return
   }
  
@@ -375,6 +545,7 @@ const handleActionSheetOpen = (type) =&gt; {
 // 关闭通用下拉弹窗
 const handleActionSheetClose = () => {
   showActionSheet.value = false
+  // 重置弹窗数据，避免残留
   currentActionSheetData.type = ''
   currentActionSheetData.list = []
   currentActionSheetData.title = ''
@@ -382,20 +553,45 @@ const handleActionSheetClose = () =&gt; {
  
 // 下拉弹窗选择事件（仅处理共同处理人多选）
 const handleActionSheetSelect = (e) => {
-  console.log(e)
+  // 校验事件参数是否有效
+  if (!e || !e.name || !e.id) {
+    uni.showToast({
+      title: '选择处理人失败（参数异常）',
+      icon: 'none',
+      duration: 2000
+    });
+    console.error('handleActionSheetSelect异常：e参数缺失name或id', e);
+    showActionSheet.value = false;
+    return;
+  }
+
   const { type } = currentActionSheetData
   // 多选场景（仅共同处理人）
   if (type === 'coProcessor') {
     workOrderForm.coProcessorName = e.name
     workOrderForm.coProcessorId = e.id
-    workOrderFormRef.value?.validateField('coProcessorName')
+    // 校验表单实例是否存在，再执行字段校验
+    if (workOrderFormRef.value) {
+      workOrderFormRef.value?.validateField('coProcessorName')
+    } else {
+      console.warn('handleActionSheetSelect提示：表单实例不存在，跳过字段校验');
+    }
   }
   showActionSheet.value = false
 }
  
 // 图片切换选择
 const imgTabChange = (item)=> {
-  console.log(item)
+  // 校验切换参数是否有效
+  if (!item || item.index === undefined || item.index === null) {
+    uni.showToast({
+      title: '图片标签切换失败（参数异常）',
+      icon: 'none',
+      duration: 2000
+    });
+    console.error('imgTabChange异常：item参数缺失index', item);
+    return;
+  }
   activeTab.value = item.index
 }
  
@@ -407,66 +603,141 @@ const hideKeyboard = () =&gt; {
 // 提交工单（整合所有图片URL，增加开始/结束图片必填校验）
 const submitWorkOrder = async () => {
   try {
-    // ========== 新增：校验开始和结束阶段图片至少各1张 ==========
+    // ========== 前置校验：表单实例是否存在 ==========
+    if (!workOrderFormRef.value) {
+      uni.showToast({
+        title: '表单实例异常，无法提交',
+        icon: 'none',
+        duration: 2000
+      });
+      console.error('submitWorkOrder异常：workOrderFormRef.value 为空');
+      return;
+    }
+
+    // ========== 开始/结束图片必填校验 ==========
     const startImgUrls = startImgs.getSuccessImgUrls(); // 开始阶段图片URL数组
     const endImgUrls = endImgs.getSuccessImgUrls();     // 结束阶段图片URL数组
  
+    // 打印日志验证（可选，用于排查）
+    console.log('开始图片有效URL：', startImgUrls);
+    console.log('结束图片有效URL：', endImgUrls);
+
     // 判断开始图片是否为空
-    if (startImgUrls.length === 0) {
+    if (!Array.isArray(startImgUrls) || startImgUrls.length === 0) {
       uni.showToast({
         title: '请至少上传1张开始阶段图片',
         icon: 'none',
         duration: 2000
       });
+      console.warn('submitWorkOrder校验失败：开始图片为空');
       return; // 终止提交流程
     }
  
     // 判断结束图片是否为空
-    if (endImgUrls.length === 0) {
+    if (!Array.isArray(endImgUrls) || endImgUrls.length === 0) {
       uni.showToast({
         title: '请至少上传1张结束阶段图片',
         icon: 'none',
         duration: 2000
       });
+      console.warn('submitWorkOrder校验失败：结束图片为空');
       return; // 终止提交流程
     }
-    // ========== 图片校验结束 ==========
  
-    // 原有表单校验
+    // ========== 处理情况必填校验（兜底，防止表单校验失效） ==========
+    if (!workOrderForm.reason || workOrderForm.reason.trim().length === 0) {
+      uni.showToast({
+        title: '请输入处理情况描述',
+        icon: 'none',
+        duration: 2000
+      });
+      console.warn('submitWorkOrder校验失败：处理情况为空');
+      return;
+    }
+    if (workOrderForm.reason.trim().length > 200) {
+      uni.showToast({
+        title: '处理情况描述不能超过200字',
+        icon: 'none',
+        duration: 2000
+      });
+      console.warn('submitWorkOrder校验失败：处理情况超过200字');
+      return;
+    }
+
+    // ========== 原有表单校验 ==========
     await workOrderFormRef.value.validate()
  
+    // ========== 校验核心提交参数 ==========
+    if (!workOrderForm.taskId) {
+      uni.showToast({
+        title: '缺失任务ID，无法提交',
+        icon: 'none',
+        duration: 2000
+      });
+      console.error('submitWorkOrder异常：taskId 为空');
+      return;
+    }
+    if (!workOrderForm.workerDataId) {
+      uni.showToast({
+        title: '缺失工单ID，无法提交',
+        icon: 'none',
+        duration: 2000
+      });
+      console.error('submitWorkOrder异常：workerDataId 为空');
+      return;
+    }
+
     // 构造所有图片URL（原有代码不变）
     const allImgs = {
-      startImgs: startImgUrls, // 直接使用已获取的开始图片URL
-      processingImgs: processingImgs.getSuccessImgUrls(),
-      endImgs: endImgUrls,     // 直接使用已获取的结束图片URL
-      personImgs: personImgs.getSuccessImgUrls(),
-      materialImgs: materialImgs.getSuccessImgUrls()
+      startImgs: startImgUrls,
+      processingImgs: processingImgs.getSuccessImgUrls() || [],
+      endImgs: endImgUrls,
+      personImgs: personImgs.getSuccessImgUrls() || [],
+      materialImgs: materialImgs.getSuccessImgUrls() || []
     }
  
-    // 构造提交参数（可按需调整图片字段格式，此处既保留分类也提供合并数组）
+    // 构造提交参数
     const submitData = {
       taskId: workOrderForm.taskId,
       taskKey:'ylWorker',
-      operateType:nextStepMap['ylWorker'].operateTypePass,
-      workerDataId:Number(workOrderForm.workerDataId),
-      // nextStepMap
+      operateType: nextStepMap['ylWorker']?.operateTypePass || '', // 兜底：防止nextStepMap缺失属性
+      workerDataId: Number(workOrderForm.workerDataId) || '',
       handleResult: workOrderForm.reason.trim(),
-      coHandlers: [String(workOrderForm.coProcessorId)], // 数组格式提交，如需字符串可.join(',')
-      // busiLine: 'yl',
-      // // 分类图片URL
+      coHandlers: workOrderForm.coProcessorId ? [String(workOrderForm.coProcessorId)] : [],
       startImgs: allImgs.startImgs,
       processingImgs: allImgs.processingImgs,
       endImgs: allImgs.endImgs,
       personImgs: allImgs.personImgs,
       materialImgs: allImgs.materialImgs,
-
       problemsImgs:[]
     }
-    console.log(submitData)
+
+    // 校验operateType是否有效
+    if (!submitData.operateType) {
+      uni.showToast({
+        title: '提交类型异常，无法提交',
+        icon: 'none',
+        duration: 2000
+      });
+      console.error('submitWorkOrder异常：operateType 为空');
+      return;
+    }
  
     uni.showLoading({ title: '提交中...' })
     const res = await universalApproval(submitData)
+
+    // 校验接口返回结果
+    if (!res) {
+      uni.hideLoading();
+      uni.showToast({
+        title: '工单提交失败（接口无返回）',
+        icon: 'none',
+        duration: 3000
+      });
+      console.error('submitWorkOrder异常：universalApproval接口无有效返回');
+      return;
+    }
+
     uni.hideLoading()
  
     uni.showToast({
@@ -484,14 +755,16 @@ const submitWorkOrder = async () =&gt; {
   } catch (error) {
     uni.hideLoading()
  
-    // 区分校验失败和接口失败
+    // 区分校验失败和接口失败，仅接口失败时提示（校验失败已有内置提示）
     if (!Array.isArray(error)) {
-      console.error('工单提交失败：', error)
       uni.showToast({
         title: '提交失败，请重试',
         icon: 'none',
         duration: 2000
-      })
+      });
+      console.error('工单提交失败：', error)
+    } else {
+      console.warn('工单提交校验失败：', error);
     }
   }
 }
@@ -501,7 +774,7 @@ const submitWorkOrder = async () =&gt; {
 // 页面容器样式
 .page-container {
   min-height: 100vh;
-  padding-bottom: 100rpx; // 给底部按钮留空间，与参考示例一致
+  padding-bottom: 100rpx; // 给底部按钮留空间
 }
  
 // 表单内容容器
@@ -515,7 +788,7 @@ const submitWorkOrder = async () =&gt; {
   background: #fff;
 }
  
-// 新增：Tab自定义内容样式（红色*号）
+// Tab自定义内容样式（红色*号）
 .tab-item-content {
   display: flex;
   align-items: center;
@@ -528,8 +801,6 @@ const submitWorkOrder = async () =&gt; {
 }
  
 .tab-text {
-  font-size: 28rpx; // 与原有Tab文字大小一致
+  font-size: 28rpx;
 }
-
-
 </style>
 \ No newline at end of file
@@ -96,6 +96,7 @@ const currentActionSheetData = reactive({
 const assigneeList = ref([]) // 养护员列表
 // ========== 工单表单数据（仅保留所需字段） ==========
 const workOrderForm = reactive({
+  id:'',
   taskId:'',
   orderNo: '',        // 工单编号（对应接口参数id）
   assigneeId: '',     // 养护员ID（对应接口参数nextAssignee）
@@ -118,7 +119,7 @@ onLoad((options) =&gt; {
   if (options && options.orderNo) {
     workOrderForm.orderNo = options.orderNo
     workOrderForm.taskId = options.taskId
-
+    workOrderForm.id = options.id
   }
   console.log('从URL获取工单编号：', workOrderForm.orderNo)
 })
@@ -229,6 +230,7 @@ const submitWorkOrder = async () =&gt; {
     }
     // 3. 构造接口所需参数
     const submitData = {
+      workerDataId:workOrderForm.id,
       operateType: nextStepMap['ylTeamLeader'].operateTypePass,
       taskKey:'ylTeamLeader',
       agree:0,
@@ -181,28 +181,25 @@
     >
       <view class="reject-modal-content">
         <!-- 回退原因 必填textarea -->
-        <!--        <view class="textarea-label">-->
-        <!--          回退原因 <text class="required-mark">*</text>-->
-        <!--        </view>-->
         <up-textarea
             v-model.trim="rejectReason"
             placeholder="请输入回退原因（必填）"
-
             rows="6"
             :count="200"
             maxlength="200"
             class="reject-textarea"
         />
-        <!-- 上传图片（选填） -->
+        <!-- 上传图片（选填）- 按照参考页面改造 -->
         <view class="upload-wrap mt-20">
           <view class="upload-title">上传图片（选填）</view>
           <up-upload
-              :action="uploadUrl"
-              :file-list="rejectFileList"
-              @after-read="handleAfterRead"
-              @delete="handleDeleteFile"
+              :file-list="rejectImgs.imgList"
+              @after-read="rejectImgs.uploadImgs"
+              @delete="rejectImgs.deleteImg"
               multiple
-              max-count="3"
+              :max-count="rejectImgs.uploadConfig.maxCount"
+              :upload-text="rejectImgs.uploadConfig.uploadText"
+              :size-type="rejectImgs.uploadConfig.sizeType"
           />
         </view>
       </view>
@@ -244,7 +241,7 @@
 </template>
  
 <script setup>
-import { ref, computed } from 'vue';
+import { ref, computed, watch } from 'vue';
 import { onReady, onShow } from '@dcloudio/uni-app';
 import { timeFormat } from '@/uni_modules/uview-plus';
 import {
@@ -256,7 +253,9 @@ import {
 // 假设从用户store获取角色信息
 import { useUserStore } from '@/pinia/user';
 import { nextStepMap } from '@/common/utils/common'
-import { workorderCreate } from "../../../api/work-order-manage/work-order-manage";
+// 引入图片上传组合式函数（与参考页面一致）
+import { useUploadImgs } from '@/common/utils/useUploadImgs'
+
 // ========== 状态管理 ==========
 const userStore = useUserStore();
 // 标签页切换
@@ -284,18 +283,31 @@ const isInspector = computed(() =&gt; {
   // 增加可选链，避免用户信息不存在报错
   return userStore.userInfo?.roles?.includes('yl_inspector') || false;
 });
-// 回退弹窗相关（核心修改：将rejectPopupShow改为rejectModalShow）
+// 回退弹窗相关（核心改造：使用useUploadImgs替代原始图片管理）
 const rejectModalShow = ref(false); // 回退modal显示开关
 const rejectReason = ref(''); // 回退原因
-const rejectFileList = ref([]); // 回退上传图片列表
 const currentRejectItem = ref(null); // 当前回退工单
-// 上传地址（根据实际接口配置）
-const uploadUrl = ref('https://xxx.com/upload');
+
+// ========== 核心改造：回退图片上传配置（与参考页面风格一致） ==========
+const rejectImgs = useUploadImgs({
+  maxCount: 3, // 最多上传3张，与原有逻辑一致
+  uploadText: '选择回退图片', // 自定义上传提示文字
+  sizeType: ['compressed'], // 仅上传压缩图，优化性能
+  formRef: null, // 该弹窗无表单校验，传null即可
+  fieldName: 'rejectImgs' // 自定义字段名，用于标识该上传实例
+})
+
+// 监听上传实例响应式变化，解决u-upload不刷新问题（与参考页面一致）
+watch(() => rejectImgs.rawImgList.value, (newVal) => {
+  rejectImgs.imgList = newVal
+}, { deep: true })
+
 // ========== 新增：养护组长验收弹窗相关状态 ==========
 const acceptModalShow = ref(false); // 验收弹窗显示开关
 const acceptRadioValue = ref('0'); // 单选框值，默认0（通过）
 const acceptReason = ref(''); // 验收原因
 const currentAcceptItem = ref(null); // 当前验收的工单项
+
 // 分页查询列表
 const queryList = async (pageNo, pageSize) => {
   try {
@@ -324,6 +336,7 @@ const queryList = async (pageNo, pageSize) =&gt; {
     uni.showToast({title: '加载失败，请重试', icon: 'none'});
   }
 };
+
 // ========== 事件处理 ==========
 // 标签页切换
 const handleTabChange = (item) => {
@@ -350,8 +363,7 @@ const handleDetail = (item) =&gt; {
   });
 };
  
-// 待办-重新提交工单（跳转到新增页面并携带工单数据）
-
+// 生成临时key
 const generateTempKey = () => {
   return 'renew_order_' + Date.now() + '_' + Math.floor(Math.random() * 10000);
 };
@@ -388,13 +400,31 @@ const handleProcess = async (item) =&gt; {
   try {
     if (nextStepMap[item.taskKey]?.name == '养护组长分配') {
       uni.navigateTo({
-        url: `/pages-sub/problem/work-order-manage/distribution-order?taskId=${item.taskId}&orderNo=${item.orderNo}`
+        url: `/pages-sub/problem/work-order-manage/distribution-order?taskId=${item.taskId}&orderNo=${item.orderNo}&id=${item.id}`
       })
     }
     if (nextStepMap[item.taskKey]?.name == '养护员待实施') {
+
+      // ① 生成唯一临时key（和重新提交工单逻辑一致，避免冲突）
+      const tempKey = `maintain_order_${Date.now()}_${Math.floor(Math.random() * 10000)}`;
+
+      // ② 存储完整item到本地缓存（同步存储，确保立即生效）
+      try {
+        uni.setStorageSync(tempKey, item);
+      } catch (error) {
+        console.error('存储养护工单数据失败：', error);
+        uni.showToast({title: '数据存储异常，无法跳转', icon: 'none'});
+        return;
+      }
+
+      // ③ URL仅传递临时key（可选：携带必要简单参数，方便目标页面快速使用）
       uni.navigateTo({
-        url: `/pages-sub/problem/work-order-manage/add-maintain-order?taskId=${item.taskId}&id=${item.id}&orderNo=${item.orderNo}`
+        url: `/pages-sub/problem/work-order-manage/add-maintain-order?tempKey=${tempKey}`
       })
+
+      // uni.navigateTo({
+      //   url: `/pages-sub/problem/work-order-manage/add-maintain-order?taskId=${item.taskId}&id=${item.id}&orderNo=${item.orderNo}`
+      // })
     }
     // 养护组长验收 - 打开弹窗
     if (nextStepMap[item.taskKey]?.name == '养护组长验收') {
@@ -414,7 +444,6 @@ const handleProcess = async (item) =&gt; {
     // 发起人确认
     if (nextStepMap[item.taskKey]?.name == '发起人确认') {
       console.log(item)
-      // currentAcceptItem.value = item; // 存储当前工单信息
       uni.showModal({
         title: "结束工单",
         content: "请确定是否结束工单？",
@@ -422,7 +451,7 @@ const handleProcess = async (item) =&gt; {
           if (res.confirm) {
             // 构建请求参数
             const requestData = {
-              // fileUrls: rejectFileList.value.map(file => file.url || ''),
+              "returnImgs": rejectImgs.getSuccessImgUrls(), // 改造后：获取上传成功的图片URL
               "workerDataId": item.id,
               "taskKey": item.taskKey,
               "taskId": item.taskId,
@@ -441,14 +470,12 @@ const handleProcess = async (item) =&gt; {
         },
       });
     }
-
-
-
   } catch (error) {
     console.error('处理工单失败：', error);
     uni.showToast({title: '处理失败，请重试', icon: 'none'});
   }
 };
+
 // 待办-回退工单（打开回退modal）
 const handleReject = (item) => {
   console.log('123213')
@@ -459,15 +486,17 @@ const handleReject = (item) =&gt; {
   }
   currentRejectItem.value = item;
   rejectReason.value = ''; // 清空上次输入
-  rejectFileList.value = []; // 清空上次上传图片
+  rejectImgs.clearImgs(); // 改造后：使用组合式函数的清空方法
   rejectModalShow.value = true; // 显示回退modal
 };
+
 // 回退modal - 取消按钮
 const handleRejectModalCancel = () => {
   rejectModalShow.value = false;
   rejectReason.value = '';
-  rejectFileList.value = [];
+  rejectImgs.clearImgs(); // 改造后：使用组合式函数的清空方法
 };
+
 // 确认回退工单
 const confirmReject = async () => {
   // 严格校验回退原因（去除首尾空格）
@@ -485,9 +514,10 @@ const confirmReject = async () =&gt; {
   try {
     // 显示加载中，防止重复提交
     uni.showLoading({title: '提交中...', mask: true});
+
     // 构建请求参数
     const requestData = {
-      // fileUrls: rejectFileList.value.map(file => file.url || ''),
+      "returnImgs": rejectImgs.getSuccessImgUrls(), // 改造后：获取上传成功的图片URL数组
       "workerDataId": currentRejectItem.value.id,
       "taskKey": currentRejectItem.value.taskKey,
       "taskId": currentRejectItem.value.taskId,
@@ -508,25 +538,14 @@ const confirmReject = async () =&gt; {
     uni.hideLoading();
   }
 };
+
 // 新增工单
 const handleAddOrder = () => {
   uni.navigateTo({
     url: '/pages-sub/problem/work-order-manage/add-order'
   });
 };
-// 上传图片-读取后（避免重复添加）
-const handleAfterRead = (file) => {
-  if (!file) return;
-  const isExist = rejectFileList.value.some(item => item.url === file.url);
-  if (!isExist && rejectFileList.value.length < 3) {
-    rejectFileList.value.push(file);
-  }
-};
-// 上传图片-删除（安全删除，避免索引越界）
-const handleDeleteFile = (index) => {
-  if (index < 0 || index >= rejectFileList.value.length) return;
-  rejectFileList.value.splice(index, 1);
-};
+
 // ========== 新增：养护组长验收弹窗事件 ==========
 // 验收弹窗 - 确定按钮（含表单校验）
 const handleAcceptModalConfirm = async () => {
@@ -547,6 +566,7 @@ const handleAcceptModalConfirm = async () =&gt; {
     if (currentAcceptItem.value?.taskKey == 'ylTeamLeaderConfirm') {   // 养护组长验收
       postData = {
         "taskKey": "ylTeamLeaderConfirm",
+        "workerDataId": currentAcceptItem.value.id,
         "taskId": currentAcceptItem.value.taskId,
         "operateType": acceptRadioValue.value == 0 ? nextStepMap['ylTeamLeaderConfirm'].operateTypePass : nextStepMap['ylTeamLeaderConfirm'].operateTypeNoPass,
         "reason": acceptReason.value.trim()
@@ -556,6 +576,7 @@ const handleAcceptModalConfirm = async () =&gt; {
       postData = {
         "taskKey": "ylTeamLeaderConfirm",
         "taskId": currentAcceptItem.value.taskId,
+        "workerDataId": currentAcceptItem.value.id,
         "operateType": acceptRadioValue.value == 0 ? nextStepMap['ylTeamLeaderConfirm'].operateTypePass : nextStepMap['ylTeamLeaderConfirm'].operateTypeNoPass,
         "reason": acceptReason.value.trim(),
         "agree": acceptRadioValue.value
@@ -573,6 +594,7 @@ const handleAcceptModalConfirm = async () =&gt; {
     uni.showToast({title: '验收提交失败，请重试', icon: 'none', duration: 2000});
   }
 };
+
 // 页面初始化
 onShow(() => {
   // 初始化加载列表
@@ -11,16 +11,19 @@
     <!-- 主内容容器 -->
     <view v-else class="main-content">
       <!-- 顶部固定Tabs -->
-      <up-tabs
-          v-model="activeTopTab"
-          :list="topTabList"
-          :scrollable="false"
-          sticky
-          active-color="#3c9cff"
-          inactive-color="#666"
-          class="top-tabs"
-          @click="activeTopTabClick"
-      ></up-tabs>
+      <up-sticky :bgColor="'#fff'">
+        <up-tabs
+            v-model="activeTopTab"
+            :list="topTabList"
+            :scrollable="false"
+            sticky
+            active-color="#3c9cff"
+            inactive-color="#666"
+            class="top-tabs"
+            @click="activeTopTabClick"
+        ></up-tabs>
+      </up-sticky>
+
  
       <!-- 顶部Tab内容区 -->
       <view class="tab-content">
@@ -107,10 +110,22 @@
             ></up-cell>
           </up-cell-group>
  
+
           <!-- 图片分类Tabs区块 -->
-          <view class="img-tabs-block">
+          <view class="img-tabs-block" v-if="orderDetail.startImgs.length>0">
+            <up-cell-group :border="false">
+              <up-cell>
+              <template #title>
+                <view style="min-width: 200rpx">共同处理人</view>
+              </template>
+              <template #value>
+                <view class="common-text-color up-line-1">{{ orderDetail.coHandlersName || '--' }}</view>
+              </template>
+              </up-cell>
+            </up-cell-group>
+            <!--            coHandlersName-->
             <up-tabs
-                @change = 'imgTabChange'
+                @change='imgTabChange'
                 v-model="activeImgTab"
                 :list="imgTabList"
                 :scrollable="false"
@@ -136,10 +151,10 @@
  
         <!-- 2. 流程节点Tab -->
         <view v-show="activeTopTab == 1" class="process-content">
-<!--          <up-empty-->
-<!--              mode="data"-->
-<!--          ></up-empty>-->
-<!--          &lt;!&ndash; 可根据实际需求补充流程节点展示逻辑 &ndash;&gt;-->
+          <!--          <up-empty-->
+          <!--              mode="data"-->
+          <!--          ></up-empty>-->
+          <!--          &lt;!&ndash; 可根据实际需求补充流程节点展示逻辑 &ndash;&gt;-->
         </view>
       </view>
     </view>
@@ -147,10 +162,15 @@
 </template>
  
 <script setup lang="ts">
-import { ref, computed } from 'vue';
-import { onLoad, onShow } from '@dcloudio/uni-app';
-import { timeFormat } from '@/uni_modules/uview-plus';
-import { getMyTaskDetail, getDoneTaskDetail, getTodoTaskDetail, getApprovalDetail } from '@/api/work-order-manage/work-order-manage';
+import {ref, computed} from 'vue';
+import {onLoad, onShow} from '@dcloudio/uni-app';
+import {timeFormat} from '@/uni_modules/uview-plus';
+import {
+  getMyTaskDetail,
+  getDoneTaskDetail,
+  getTodoTaskDetail,
+  getApprovalDetail
+} from '@/api/work-order-manage/work-order-manage';
  
 // 状态管理
 const loading = ref(true);
@@ -159,29 +179,29 @@ const activeImgTab = ref(0); // 图片分类Tab激活索引
  
 // 顶部Tab列表
 const topTabList = ref([
-  { name: '工单详情' },
-  { name: '流程节点' }
+  {name: '工单详情'},
+  {name: '流程节点'}
 ]);
  
 const activeTopTabClick = async (item: any) => {
   console.log(item)
   activeTopTab.value = item.index
-  if(activeTopTab.value ==1){
+  if (activeTopTab.value == 1) {
     let getData = {
-      processInstanceId:processInstanceId.value,
+      processInstanceId: processInstanceId.value,
     }
-    const  res = await getApprovalDetail(getData)
+    const res = await getApprovalDetail(getData)
     console.log(res)
   }
 }
  
 // 图片分类Tab列表（带角标配置）
 const imgTabList = ref([
-  { name: '开始', badge: { isDot: true } },
-  { name: '进行中' },
-  { name: '结束', badge: { isDot: true } },
-  { name: '人员' },
-  { name: '材料' }
+  {name: '开始', badge: {isDot: true}},
+  {name: '进行中'},
+  {name: '结束', badge: {isDot: true}},
+  {name: '人员'},
+  {name: '材料'}
 ]);
  
 // 工单详情数据（初始化赋值，可被接口数据覆盖）
@@ -242,7 +262,7 @@ const orderDetail = ref&lt;any&gt;({
 const currentImgList = ref([])
  
 const tabKeyMap = ['startImgs', 'processingImgs', 'endImgs', 'personImgs', 'materialImgs'];
-const imgTabChange = (({index})=>{
+const imgTabChange = (({index}) => {
   console.log(index)
   const currentKey = tabKeyMap[index]
   console.log(currentKey)
@@ -263,24 +283,24 @@ const DetailQuery = async (taskIdStr: string) =&gt; {
     let res: any;
  
     if (tabType === 0) {
-      res = await getTodoTaskDetail({ taskId: taskIdStr });
+      res = await getTodoTaskDetail({taskId: taskIdStr});
     } else if (tabType === 1) {
-      res = await getMyTaskDetail({ taskId: taskIdStr });
+      res = await getMyTaskDetail({taskId: taskIdStr});
     } else if (tabType === 2) {
-      res = await getDoneTaskDetail({ taskId: taskIdStr });
+      res = await getDoneTaskDetail({taskId: taskIdStr});
     } else {
-      uni.showToast({ title: '无效的工单类型', icon: 'none' });
+      uni.showToast({title: '无效的工单类型', icon: 'none'});
       return;
     }
  
     // 覆盖工单详情数据
     if (res) {
       orderDetail.value = res;
-      currentImgList.value =  orderDetail.value.startImgs
+      currentImgList.value = orderDetail.value.startImgs
     }
   } catch (error) {
     console.error('获取工单详情失败：', error);
-    uni.showToast({ title: '加载失败，请重试', icon: 'none' });
+    uni.showToast({title: '加载失败，请重试', icon: 'none'});
   } finally {
     loading.value = false;
   }
@@ -292,20 +312,21 @@ const activeTab = ref(&#39;&#39;)
 const processInstanceId = ref('')
 onLoad((options: any) => {
   console.log('页面入参：', options)
-  const { taskId: taskIdOpt, activeTab: activeTabOpt, processInstanceId:processInstanceIdOpt } = options;
+  const {taskId: taskIdOpt, activeTab: activeTabOpt, processInstanceId: processInstanceIdOpt} = options;
   // 0-待办 1-我发起的 2-已办
   taskId.value = taskIdOpt || '';
   activeTab.value = activeTabOpt || '0';
-  processInstanceId.value = processInstanceIdOpt ;
+  processInstanceId.value = processInstanceIdOpt;
+  DetailQuery(taskId.value);
 });
  
 onShow(() => {
-  if (taskId.value) {
-    DetailQuery(taskId.value);
-  } else {
-    loading.value = false;
-    uni.showToast({ title: '缺少工单ID参数', icon: 'none' });
-  }
+  // if (taskId.value) {
+  //   DetailQuery(taskId.value);
+  // } else {
+  //   loading.value = false;
+  //   uni.showToast({title: '缺少工单ID参数', icon: 'none'});
+  // }
 });
 </script>
  
@@ -327,7 +348,7 @@ onShow(() =&gt; {
  
 // Tab内容区
 .tab-content {
-  padding: 16rpx;
+  //padding: 16rpx;
 }
  
 // 工单详情内容