pages-sub/problem/work-order-manage/add-maintain-order.vue

<template>
  <view class="page-container">
    <view class="work-order-form-content commonPageLRpadding">
      <up-form
          label-position="left"
          :model="workOrderForm"
          ref="workOrderFormRef"
          labelWidth="170rpx"
      >
        <!-- 1. 工单编号（只读展示，从缓存获取） -->
        <up-form-item
            label="工单编号"
            border-bottom
        >
          <up-input
              v-model="workOrderForm.orderNo"
              border="none"
              readonly
              placeholder="暂无工单编号"
          ></up-input>
        </up-form-item>
        <!-- 2. 作业类型（决定加载哪套动态字段配置：数据中心/业务类型字段配置 配置归属=工单） -->
        <up-form-item
            label="作业类型"
            prop="workTypeName"
            required
            border-bottom
            @click="openWorkTypeSheet(); hideKeyboard()"
        >
          <up-input
              v-model="workOrderForm.workTypeName"
              disabled
              disabled-color="#ffffff"
              placeholder="请选择作业类型"
              border="none"
          ></up-input>
          <template #right>
            <up-icon name="arrow-right" size="16"></up-icon>
          </template>
        </up-form-item>
        <!-- 3. 共同处理人（支持多选） -->
        <up-form-item
            label="共同处理人"
            prop="coProcessorName"
            border-bottom
            @click="handleActionSheetOpen('coProcessor'); hideKeyboard()"
        >
          <up-input
              v-model="workOrderForm.coProcessorNameStr"
              disabled
              disabled-color="#ffffff"
              placeholder="请选择共同处理人"
              border="none"
          ></up-input>
          <template #right>
            <up-icon name="arrow-right" size="16"></up-icon>
          </template>
        </up-form-item>
        <!-- 3. 处理建议（处理情况描述，必填） -->
        <up-form-item
            label="处理情况"
            prop="reason"
            required
        >
          <up-textarea
              placeholder="请输入处理情况描述（必填，最多200字）"
              v-model.trim="workOrderForm.reason"
              count
              maxlength="200"
              rows="5"
              @blur="() => workOrderFormRef.validateField('reason')"
          ></up-textarea>
        </up-form-item>
        <!-- 4. 动态字段：按「业务类型(busiLine) + 作业类型」加载数据中心配置的工单填报项 -->
        <view class="dynamic-field-block" v-if="workOrderForm.workTypeId">
          <view class="dynamic-field-title">作业填报</view>
          <work-field-form
              ref="workFieldFormRef"
              :business-type="workOrderForm.businessType"
              :biz-type="1"
              :work-type-id="workOrderForm.workTypeId"
              @loaded="onDynamicFieldsLoaded"
          ></work-field-form>
          <view class="dynamic-field-empty" v-if="dynamicFieldCount === 0">
            <text>该作业类型暂无需填报项</text>
          </view>
        </view>
        <!-- Tabs标签栏（图片切换：开始、进行中、结束、人员、材料）- 改造后 -->
        <view class="tabs-wrap " style="margin-top: 30rpx;">
          <up-tabs
              v-model="activeTab"
              :list="tabList"
              line-width="40rpx"
              active-color="#1989fa"
              inactive-color="#666666"
              @change = "imgTabChange"
          >
            <!-- 使用content插槽自定义每个tab的内容，添加红色*号 -->
            <template #content="{ item, index }">
              <view class="tab-item-content">
                <!-- 给索引0（开始）和索引2（结束）添加红色*号 -->
                <text v-if="index === 0 || index === 2" class="required-star">*</text>
                <text class="tab-text">{{ item.name }}</text>
              </view>
            </template>
          </up-tabs>
          <view class="tab-content" style="padding-top: 20rpx; background: #fff; padding-bottom: 20rpx;">
            <!-- 开始阶段图片上传 -->
            <view v-if="activeTab == 0">
              <up-form-item  prop="startImgs">
                <up-upload
                    :file-list="startImgs.rawImgList.value|| []"
                    @after-read="startImgs.uploadImgs"
                    @delete="startImgs.deleteImg"
                    multiple
                    :max-count="startImgs.uploadConfig.maxCount"
                    :upload-text="startImgs.uploadConfig.uploadText"
                    :size-type="startImgs.uploadConfig.sizeType"
                ></up-upload>
              </up-form-item>
            </view>
            <!-- 进行中阶段图片上传 -->
            <view v-if="activeTab == 1">
              <up-form-item  prop="processingImgs">
                <up-upload
                    :file-list="processingImgs.rawImgList.value|| []"
                    @after-read="processingImgs.uploadImgs"
                    @delete="processingImgs.deleteImg"
                    multiple
                    :max-count="processingImgs.uploadConfig.maxCount"
                    :upload-text="processingImgs.uploadConfig.uploadText"
                    :size-type="processingImgs.uploadConfig.sizeType"
                ></up-upload>
              </up-form-item>
            </view>
            <!-- 结束阶段图片上传 -->
            <view v-if="activeTab == 2">
              <up-form-item  prop="endImgs">
                <up-upload
                    :file-list="endImgs.rawImgList.value|| []"
                    @after-read="endImgs.uploadImgs"
                    @delete="endImgs.deleteImg"
                    multiple
                    :max-count="endImgs.uploadConfig.maxCount"
                    :upload-text="endImgs.uploadConfig.uploadText"
                    :size-type="endImgs.uploadConfig.sizeType"
                ></up-upload>
              </up-form-item>
            </view>
            <!-- 人员配置图片上传 -->
            <view v-if="activeTab == 3">
              <up-form-item  prop="personImgs">
                <up-upload
                    :file-list="personImgs.rawImgList.value|| []"
                    @after-read="personImgs.uploadImgs"
                    @delete="personImgs.deleteImg"
                    multiple
                    :max-count="personImgs.uploadConfig.maxCount"
                    :upload-text="personImgs.uploadConfig.uploadText"
                    :size-type="personImgs.uploadConfig.sizeType"
                ></up-upload>
              </up-form-item>
            </view>
            <!-- 材料使用图片上传 -->
            <view v-if="activeTab == 4">
              <up-form-item  prop="materialImgs">
                <up-upload
                    :file-list="materialImgs.rawImgList.value|| []"
                    @after-read="materialImgs.uploadImgs"
                    @delete="materialImgs.deleteImg"
                    multiple
                    :max-count="materialImgs.uploadConfig.maxCount"
                    :upload-text="materialImgs.uploadConfig.uploadText"
                    :size-type="materialImgs.uploadConfig.sizeType"
                ></up-upload>
              </up-form-item>
            </view>
          </view>
        </view>
      </up-form>
    </view>
    <!-- 底部提交按钮（保留，按需可移除） -->
    <view class="fixed-bottom-btn-wrap">
      <up-button
          type="primary"
          text="提交工单"
          @click="submitWorkOrder"
      ></up-button>
    </view>
    <!-- 通用下拉弹窗（仅用于共同处理人多选） -->
    <up-action-sheet
        :show="showActionSheet"
        :actions="currentActionSheetData.list"
        :title="currentActionSheetData.title"
        @close="handleActionSheetClose"
        @select="handleActionSheetSelect"
    ></up-action-sheet>
    <!-- 作业类型选择弹窗（字典 maintain_type） -->
    <up-action-sheet
        :show="showWorkTypeSheet"
        :actions="workTypeOptions"
        title="请选择作业类型"
        cancel-text="取消"
        @close="showWorkTypeSheet = false"
        @select="onWorkTypeSelect"
    ></up-action-sheet>
  </view>
</template>
<script setup>
import { ref, reactive, watch } from 'vue'
import { onLoad, onReady, onShow } from '@dcloudio/uni-app';
import { useUploadImgs } from '@/common/utils/useUploadImgs'
import { getYlWorkersPage, universalApproval } from '@/api/work-order-manage/work-order-manage'
import { workRecordSubmit, getConfiguredWorkTypes } from '@/api/common'
import { nextStepMap } from '@/common/utils/common'
import { useUserStore } from '@/pinia/user';
const userStore = useUserStore();
// 表单Ref
const workOrderFormRef = ref(null)
// 作业填报动态表单Ref（components/work-field-form）
const workFieldFormRef = ref(null)
// 作业类型选择弹窗
const showWorkTypeSheet = ref(false)
// 作业类型选项：字典 maintain_type（打开弹窗时取，避免字典异步加载导致首次为空）
const workTypeOptions = ref([])
// 当前作业类型下的动态字段数量（0 时给「无需填报」提示）
const dynamicFieldCount = ref(0)
// 动态字段提交幂等流水号：同一页面生命周期内保持不变，网络重试只落一条记录
let workRecordClientSeq = ''
// 来源列表页标识（work-order/regional/ai），提交后回到用户进入时的列表
let fromPage = 'work-order'
// 来源标识 -> 列表页路径
const BACK_URL_MAP = {
  'work-order': '/pages-sub/problem/work-order-manage/index',
  'regional': '/pages-sub/problem/regional-order-manage/index',
  'ai': '/pages-sub/problem/ai-manage/index'
}
// 页面状态
const showActionSheet = ref(false)
const currentActionSheetData = reactive({
  type: '',
  list: [],
  title: '',
})
// Tabs配置（图片切换用）
const activeTab = ref(0)
const tabList = ref([
  { name: '开始' },
  { name: '进行中' },
  { name: '结束' },
  { name: '人员' },
  { name: '材料' }
])
// 共同处理人列表
const coProcessorList = ref([])
// 工单表单数据（修改：新增coProcessorName数组，coProcessorNameStr用于页面展示）
const workOrderForm = reactive({
  busiLine:'',
  businessType:'',              // 业务类型（由 busiLine 首段得出，用于加载动态字段配置）
  workTypeId:'',                // 作业类型ID（字典 maintain_type，用于加载动态字段配置）
  workTypeName:'',              // 作业类型名称（页面展示）
  workerDataId:'',
  taskId:'', // 任务id
  orderNo: '',                  // 工单编号
  coProcessorId: [],            // 共同处理人ID数组（多选，改为数组格式）
  coProcessorName: [],          // 共同处理人名称数组（多选，数组格式，用于提交）
  coProcessorNameStr: '',       // 共同处理人名称字符串（用于页面输入框展示）
  reason: '',                   // 处理情况描述
})
// ========== 图片上传配置（5个Tab分别配置，均限制3张，与参考示例一致） ==========
// 开始阶段图片
const startImgs = useUploadImgs({
  maxCount: 3,
  uploadText: '选择开始照片',
  sizeType: ['compressed'],
  formRef: workOrderFormRef,
  fieldName: 'startImgs'
})
// 进行中阶段图片
const processingImgs = useUploadImgs({
  maxCount: 3,
  uploadText: '选择进行中照片',
  sizeType: ['compressed'],
  formRef: workOrderFormRef,
  fieldName: 'processingImgs'
})
// 结束阶段图片
const endImgs = useUploadImgs({
  maxCount: 3,
  uploadText: '选择结束照片',
  sizeType: ['compressed'],
  formRef: workOrderFormRef,
  fieldName: 'endImgs'
})
// 人员配置图片
const personImgs = useUploadImgs({
  maxCount: 3,
  uploadText: '选择人员照片',
  sizeType: ['compressed'],
  formRef: workOrderFormRef,
  fieldName: 'personImgs'
})
// 材料使用图片
const materialImgs = useUploadImgs({
  maxCount: 3,
  uploadText: '选择材料照片',
  sizeType: ['compressed'],
  formRef: workOrderFormRef,
  fieldName: 'materialImgs'
})
// // ========== 核心修复：监听每个上传实例的响应式数组变化，解决u-upload不刷新问题 ==========
// watch(() => startImgs.rawImgList.value, (newVal) => {
//   startImgs.imgList = newVal
// }, { deep: true })
//
// watch(() => processingImgs.rawImgList.value, (newVal) => {
//   processingImgs.imgList = newVal
// }, { deep: true })
//
// watch(() => endImgs.rawImgList.value, (newVal) => {
//   endImgs.imgList = newVal
// }, { deep: true })
//
// watch(() => personImgs.rawImgList.value, (newVal) => {
//   personImgs.imgList = newVal
// }, { deep: true })
//
// watch(() => materialImgs.rawImgList.value, (newVal) => {
//   materialImgs.imgList = newVal
// }, { deep: true })
// 表单校验规则（新增5个图片字段校验，复用上传校验规则）
const workOrderFormRules = reactive({
  orderNo: [
    { type: 'string', trigger: ['change'] }
  ],
  reason: [
    { type: 'string', required: true, message: '请输入处理情况描述', trigger: ['change', 'blur'] },
    { type: 'string', max: 200, message: '处理情况描述最多200字', trigger: ['change', 'blur'] }
  ],
  workTypeName: [
    { type: 'string', required: true, message: '请选择作业类型', trigger: ['change'] }
  ]
})
// 生命周期 - 从本地缓存获取完整工单数据
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;
    // 来源列表页：养护员实施可能从工单管理、区域工单、AI 工单进入，提交后回原列表
    fromPage = options.from || 'work-order';
    let orderItem = {};
    // 2. 读取缓存并校验缓存数据是否有效
    orderItem = uni.getStorageSync(tempKey) || {};
    if (JSON.stringify(orderItem) === '{}') {
      uni.showToast({
        title: '工单缓存数据为空，请重新进入',
        icon: 'none',
        duration: 3000
      });
      console.error('onLoad异常：工单缓存数据为空');
      return;
    }
    // 可选：读取后移除缓存，避免冗余数据
    uni.removeStorageSync(tempKey);
    // 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 || ''; // 处理情况回显
    workOrderForm.busiLine = orderItem.busiLine
    // 业务线可能是逗号分隔多值（如 "yl,hj"），字段配置按单值定位，取首段
    workOrderForm.businessType = String(orderItem.busiLine || '').split(',')[0].trim()
    // 来源数据若已带作业类型则回显（工单主表当前无该字段，通常为空，由用户手选）
    if (orderItem.workTypeId) {
      workOrderForm.workTypeId = orderItem.workTypeId
      workOrderForm.workTypeName = uni.$dict.getDictLabel('maintain_type', orderItem.workTypeId) || ''
    } else {
      // 该业务线只配了一个作业类型的字段时自动选中，进页即可看到填报项
      loadDefaultWorkType()
    }
    // 共同处理人（如有数据则回显，转换为数组格式）
    if (orderItem.coHandlers && orderItem.coHandlersName) {
      // 处理ID：如果是字符串（逗号分隔），转为数组；本身是数组则直接赋值
      workOrderForm.coProcessorId = Array.isArray(orderItem.coHandlers)
          ? orderItem.coHandlers
          : (orderItem.coHandlers.split(',').filter(Boolean) || []);
      // 处理名称：同理，转为数组格式（用于提交），并拼接为字符串（用于展示）
      workOrderForm.coProcessorName = Array.isArray(orderItem.coHandlersName)
          ? orderItem.coHandlersName
          : (orderItem.coHandlersName.split(',').filter(Boolean) || []);
      // 拼接名称为字符串，用于输入框展示
      workOrderForm.coProcessorNameStr = workOrderForm.coProcessorName.join('，');
    } 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);
  }
})
// 生命周期 - 初始化表单规则
onReady(() => {
  // 校验表单实例是否存在
  if (!workOrderFormRef.value) {
    uni.showToast({
      title: '表单实例初始化失败',
      icon: 'none',
      duration: 2000
    });
    console.error('onReady异常：workOrderFormRef.value 为空');
    return;
  }
  workOrderFormRef.value.setRules(workOrderFormRules)
})
// 生命周期 - 加载共同处理人列表
onShow(async () => {
  await loadCoProcessorList()
})
// 加载共同处理人列表
const loadCoProcessorList = async () => {
  try {
    uni.showLoading({ title: '获取处理人列表中...' })
    const queryData = {
      // roleCode: 'yl_worker',
      busiLine: workOrderForm.busiLine,
      pageNo: 1,
      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 => {
        // 校验列表项是否含必填字段
        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',
      //   duration: 1000
      // });
      console.warn('loadCoProcessorList提示：处理人列表为空');
    }
  } catch (err) {
    uni.hideLoading()
    uni.showToast({
      title: '获取处理人列表失败，请重试',
      icon: 'none',
      duration: 3000
    });
    console.error('获取共同处理人列表失败：', err)
    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',
      duration: 2000
    });
    console.warn('handleActionSheetOpen提示：共同处理人列表为空');
    return
  }
  // 弹窗配置映射（仅保留共同处理人）
  const configMap = {
    coProcessor: {
      title: '请选择共同处理人',
      list: coProcessorList.value,
    }
  }
  currentActionSheetData.type = type
  currentActionSheetData.title = configMap[type].title
  currentActionSheetData.list = configMap[type].list
  showActionSheet.value = true
}
// 关闭通用下拉弹窗
const handleActionSheetClose = () => {
  showActionSheet.value = false
  // 重置弹窗数据，避免残留
  currentActionSheetData.type = ''
  currentActionSheetData.list = []
  currentActionSheetData.title = ''
}
// 下拉弹窗选择事件（修改：支持多选，存储名称和ID为数组）
const handleActionSheetSelect = (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') {
    // 若已选中该处理人，移除（实现切换选择）；未选中则添加
    const idIndex = workOrderForm.coProcessorId.findIndex(id => id === e.id);
    if (idIndex > -1) {
      // 移除已选中的ID和名称
      workOrderForm.coProcessorId.splice(idIndex, 1);
      workOrderForm.coProcessorName.splice(idIndex, 1);
    } else {
      // 添加新选中的ID和名称（数组格式）
      workOrderForm.coProcessorId.push(e.id);
      workOrderForm.coProcessorName.push(e.name);
    }
    // 拼接名称数组为字符串，用于输入框展示
    workOrderForm.coProcessorNameStr = workOrderForm.coProcessorName.join('，');
    // 校验表单实例是否存在，再执行字段校验
    if (workOrderFormRef.value) {
      workOrderFormRef.value?.validateField('coProcessorName')
    } else {
      console.warn('handleActionSheetSelect提示：表单实例不存在，跳过字段校验');
    }
  }
  showActionSheet.value = false
}
// 图片切换选择
const imgTabChange = (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
}
// 隐藏键盘
const hideKeyboard = () => {
  uni.hideKeyboard()
}
// 打开作业类型选择弹窗
const openWorkTypeSheet = () => {
  // up-action-sheet 用 name 展示，value 作为回传值
  workTypeOptions.value = uni.$dict.getDictSimpleList('maintain_type')
    .map(item => ({ name: item.label, value: item.value }))
  if (workTypeOptions.value.length === 0) {
    uni.showToast({
      title: '暂无作业类型字典数据',
      icon: 'none',
      duration: 2000
    })
    return
  }
  showWorkTypeSheet.value = true
}
// 选择作业类型：驱动动态字段按「业务类型 + 作业类型」重新加载
const onWorkTypeSelect = (e) => {
  showWorkTypeSheet.value = false
  if (!e || e.value === undefined || e.value === null || e.value === '') {
    return
  }
  workOrderForm.workTypeId = e.value
  workOrderForm.workTypeName = e.name
  dynamicFieldCount.value = 0
  if (workOrderFormRef.value) {
    workOrderFormRef.value.validateField('workTypeName')
  }
}
// 动态字段加载完成（count=0 时页面提示「暂无需填报项」）
const onDynamicFieldsLoaded = (count) => {
  dynamicFieldCount.value = count || 0
}
/**
 * 自动带出作业类型：该业务线下只有一个作业类型配置了填报项时直接选中，
 * 动态字段块随之渲染（v-if 绑在 workTypeId 上），用户不用先猜该选哪个作业类型。
 * 配了多个时不自动选，交给用户手选。
 */
const loadDefaultWorkType = async () => {
  if (!workOrderForm.businessType) {
    return
  }
  try {
    const list = await getConfiguredWorkTypes({
      businessType: workOrderForm.businessType,
      bizType: 1
    })
    if (!Array.isArray(list) || list.length !== 1) {
      return
    }
    const only = list[0]
    workOrderForm.workTypeId = only.workTypeId
    workOrderForm.workTypeName = only.workTypeName
        || uni.$dict.getDictLabel('maintain_type', only.workTypeId)
        || ''
    dynamicFieldCount.value = 0
  } catch (error) {
    console.warn('获取已配置填报项的作业类型失败：', error)
  }
}
// 动态字段提交幂等流水号（后端按 userId+clientSeq 去重）
const genClientSeq = () => `${Date.now()}-${Math.random().toString(16).slice(2, 10)}`
// 提交工单（修改：将coProcessorName数组一并传入提交参数）
const submitWorkOrder = async () => {
  try {
    // ========== 前置校验：表单实例是否存在 ==========
    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 (!Array.isArray(startImgUrls) || startImgUrls.length === 0) {
      uni.showToast({
        title: '请至少上传1张开始阶段图片',
        icon: 'none',
        duration: 2000
      });
      console.warn('submitWorkOrder校验失败：开始图片为空');
      return; // 终止提交流程
    }
    // 判断结束图片是否为空
    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.workTypeId) {
      uni.showToast({
        title: '请选择作业类型',
        icon: 'none',
        duration: 2000
      });
      console.warn('submitWorkOrder校验失败：作业类型为空');
      return;
    }
    let dynamicValues = []
    if (workFieldFormRef.value) {
      // 校验失败时 reject 字段数组（uview-plus 已提示），交给外层 catch 忽略
      await workFieldFormRef.value.validate()
      dynamicValues = workFieldFormRef.value.getValues()
    }
    // ========== 校验核心提交参数 ==========
    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,
      processingImgs: processingImgs.getSuccessImgUrls() || [],
      endImgs: endImgUrls,
      personImgs: personImgs.getSuccessImgUrls() || [],
      materialImgs: materialImgs.getSuccessImgUrls() || []
    }
    // 构造提交参数（修改：添加coProcessorName数组一并提交）
    const submitData = {
      taskId: workOrderForm.taskId,
      taskKey:'ylWorker',
      operateType: nextStepMap['ylWorker']?.operateTypePass || '', // 兜底：防止nextStepMap缺失属性
      workerDataId: Number(workOrderForm.workerDataId) || '',
      handleResult: workOrderForm.reason.trim(),
      coHandlers: workOrderForm.coProcessorId || [], // ID数组
      coHandlersName: workOrderForm.coProcessorName || [], // 名称数组（一并提交）
      startImgs: allImgs.startImgs,
      processingImgs: allImgs.processingImgs,
      endImgs: allImgs.endImgs,
      personImgs: allImgs.personImgs,
      materialImgs: allImgs.materialImgs,
      problemsImgs:[]
    }
    // 打印提交参数，验证coProcessorName是否为数组
    console.log('提交参数（含名称数组）：', submitData);
    // 校验operateType是否有效
    if (!submitData.operateType) {
      uni.showToast({
        title: '提交类型异常，无法提交',
        icon: 'none',
        duration: 2000
      });
      console.error('submitWorkOrder异常：operateType 为空');
      return;
    }
    uni.showLoading({ title: '提交中...' })
    // ========== 先落作业填报（动态字段），再走审批流转 ==========
    // 值按「业务类型 + 作业类型」的字段配置落库；同一工单重复实施时后端按 (bizType,bizId) 覆盖原记录并红冲旧物料
    if (dynamicValues.length > 0) {
      if (!workRecordClientSeq) {
        workRecordClientSeq = genClientSeq()
      }
      await workRecordSubmit({
        businessType: workOrderForm.businessType,
        bizType: 1,
        bizId: Number(workOrderForm.workerDataId),
        workTypeId: Number(workOrderForm.workTypeId),
        clientSeq: workRecordClientSeq,
        remark: workOrderForm.reason.trim(),
        fields: dynamicValues
      })
    }
    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({
      title: '工单提交成功',
      icon: 'success',
      duration: 1000
    })
    // 延迟跳转：来源列表页在 onShow 中不做刷新，用 reLaunch 重建页面保证待办数据最新
    setTimeout(() => {
      uni.reLaunch({
        url: BACK_URL_MAP[fromPage] || BACK_URL_MAP['work-order']
      })
    }, 1000)
  } catch (error) {
    uni.hideLoading()
    // 本次提交失败后重置流水号：下次重试允许按最新填报值覆盖原记录（后端按 bizType+bizId 覆盖，不会重复建单）
    workRecordClientSeq = ''
    // 区分校验失败和接口失败，仅接口失败时提示（校验失败已有内置提示）
    if (!Array.isArray(error)) {
      uni.showToast({
        title: '提交失败，请重试',
        icon: 'none',
        duration: 2000
      });
      console.error('工单提交失败：', error)
    } else {
      console.warn('工单提交校验失败：', error);
    }
  }
}
</script>
<style lang="scss" scoped>
// 页面容器样式
.page-container {
  min-height: 100vh;
  padding-bottom: 100rpx; // 给底部按钮留空间
}
// 表单内容容器
.work-order-form-content {
  background: #fff;
  padding-bottom: 30rpx;
}
// Tabs容器样式
.tabs-wrap {
  background: #fff;
}
// Tab自定义内容样式（红色*号）
.tab-item-content {
  display: flex;
  align-items: center;
}
.required-star {
  color: #f53f3f; // 红色必填标识
  margin-right: 4rpx; // 与文字保持小间距
  font-weight: bold;
}
// 作业填报（动态字段）区块
.dynamic-field-block {
  margin-top: 10rpx;
  .dynamic-field-title {
    padding: 20rpx 0 10rpx;
    font-size: 30rpx;
    font-weight: 600;
    color: #303133;
    border-bottom: 1rpx solid #f0f0f0;
  }
  .dynamic-field-empty {
    padding: 30rpx 0;
    text-align: center;
    font-size: 26rpx;
    color: #999;
  }
}
</style>