JCSS / jcss-miniprogram

  <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="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>
  

          <!-- 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.imgList"
                      @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.imgList"
                      @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.imgList"
                      @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.imgList"
                      @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.imgList"
                      @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>

    </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 { nextStepMap } from '@/common/utils/common'

  import { useUserStore } from '@/pinia/user';

  const userStore = useUserStore();

  // 表单Ref
  const workOrderFormRef = ref(null)

  // 页面状态

  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({

    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'] }

    ]

  })
  

  // 生命周期 - 从本地缓存获取完整工单数据

  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异常：工单缓存数据为空');

        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 || ''; // 处理情况回显
  

      // 共同处理人（如有数据则回显，转换为数组格式）

      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: 'yl',
        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: 2000
        });
        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()
  }
  

  // 提交工单（修改：将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.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: '提交中...' })

      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
      })
  
      // 延迟跳转
      setTimeout(() => {

        uni.reLaunch({

          url: '/pages-sub/problem/work-order-manage/index'
        })
      }, 1000)
    } catch (error) {
      uni.hideLoading()
  

      // 区分校验失败和接口失败，仅接口失败时提示（校验失败已有内置提示）

      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;
  }
  
  .tab-text {

    font-size: 28rpx;

  }

  </style>