文件上传得路径转换

yyb

7 小时以前 b6db02f5ff1c06cbfdda090ade5719f2d45f5b6f

 src/pages/equipmentManagement/repair/add.vue

@@ -1,435 +1,783 @@
<template>
   <view class="repair-add">
      <!-- 使用通用页面头部组件 -->
      <PageHeader :title="operationType === 'edit' ? '编辑报修' : '新增报修'" @back="goBack" />
		
      <!-- 表单内容 -->
      <u-form @submit="sendForm" ref="formRef" :rules="formRules" :model="form" label-width="110">
         <!-- 基本信息 -->
         <u-cell-group title="基本信息">
            <u-form-item label="设备名称" prop="deviceLedgerId" required border-bottom>
               <u-input
                  v-model="deviceNameText"
                  placeholder="请选择设备名称"
                  @click="showDevicePicker"
                  clearable
                  readonly=""
               />
               <template #right>
                  <u-icon name="scan" @click="startScan" class="scan-icon" />
               </template>
            </u-form-item>
            <u-form-item label="规格型号" prop="deviceModel" border-bottom>
               <u-input
                  v-model="form.deviceModel"
                  placeholder="请输入规格型号"
                  clearable
               />
            </u-form-item>
            <u-form-item label="报修日期" prop="repairTime" required border-bottom>
               <u-input
                  v-model="form.repairTime"
                  placeholder="请选择报修日期"
                  readonly
                  @click="showDatePicker"
                  clearable
               />
               <template #right>
                  <u-icon name="arrow-right" @click="showDatePicker"></u-icon>
               </template>
            </u-form-item>
            <u-form-item label="报修人" prop="repairName" required border-bottom>
               <u-input
                  v-model="form.repairName"
                  placeholder="请输入报修人"
                  clearable
               />
            </u-form-item>
            <u-form-item label="故障现象" prop="remark" required border-bottom>
               <u-textarea
                  v-model="form.remark"
                  rows="3"
                  placeholder="请输入故障现象"
                  clearable
                  count
                  maxlength="200"
               />
            </u-form-item>
         </u-cell-group>
			
         <!-- 提交按钮 -->
         <view class="footer-btns">
            <u-button class="cancel-btn" @click="goBack">取消</u-button>
            <u-button class="save-btn" type="primary" @click="sendForm" :loading="loading">保存</u-button>
         </view>
      </u-form>

      <!-- 设备选择器 -->
      <up-action-sheet
         :show="showDevice"
         :actions="deviceActionList"
         title="选择设备名称"
         @select="onDeviceSelect"
         @close="showDevice = false"
      />

      <!-- 日期选择器 -->
      <up-datetime-picker
         :show="showDate"
         v-model="pickerDateValue"
         @confirm="onDateConfirm"
         @cancel="showDate = false"
         mode="date"
      />
   </view>
  <view class="repair-add">
    <!-- 使用通用页面头部组件 -->
    <PageHeader :title="operationType === 'edit' ? '编辑报修' : '新增报修'"
                @back="goBack" />
    <!-- 表单内容 -->
    <u-form @submit="sendForm"
            ref="formRef"
            :rules="formRules"
            :model="form"
            label-width="110">
      <!-- 基本信息 -->
      <u-cell-group title="基本信息">
        <u-form-item label="设备名称"
                     prop="deviceLedgerId"
                     required
                     border-bottom>
          <u-input v-model="deviceNameText"
                   placeholder="请选择设备名称"
                   @click="showDevicePicker"
                   clearable
                   readonly="" />
          <template #right>
            <u-icon name="scan"
                    @click="startScan"
                    class="scan-icon" />
          </template>
        </u-form-item>
        <u-form-item label="规格型号"
                     prop="deviceModel"
                     border-bottom>
          <u-input v-model="form.deviceModel"
                   placeholder="请输入规格型号"
                   clearable />
        </u-form-item>
        <u-form-item label="报修日期"
                     prop="repairTime"
                     required
                     border-bottom>
          <u-input v-model="form.repairTime"
                   placeholder="请选择报修日期"
                   readonly
                   @click="showDatePicker"
                   clearable />
          <template #right>
            <u-icon name="arrow-right"
                    @click="showDatePicker"></u-icon>
          </template>
        </u-form-item>
        <u-form-item label="报修状态"
                     prop="repairTime"
                     required
                     border-bottom>
          <u-input v-model="repairStatusText"
                   placeholder="请选择报修状态"
                   readonly
                   @click="openRepairStatusPicker"
                   clearable />
          <template #right>
            <u-icon name="arrow-right"
                    @click="openRepairStatusPicker"></u-icon>
          </template>
        </u-form-item>
        <u-form-item label="报修人"
                     prop="repairName"
                     required
                     border-bottom>
          <u-input v-model="form.repairName"
                   placeholder="请输入报修人"
                   clearable />
        </u-form-item>
        <u-form-item label="故障现象"
                     prop="remark"
                     required
                     border-bottom>
          <u-textarea v-model="form.remark"
                      rows="3"
                      placeholder="请输入故障现象"
                      clearable
                      count
                      maxlength="200" />
        </u-form-item>
      <u-form-item label="故障图片"
                   border-bottom>
        <view class="repair-image-upload">
          <u-button type="primary"
                    @click="chooseRepairImage"
                    :loading="uploading"
                    :disabled="uploading">
            {{ uploading ? "上传中..." : "上传故障图片" }}
          </u-button>
          <view v-if="repairImageList.length"
                class="repair-image-list">
            <view v-for="(file, index) in repairImageList"
                  :key="file.id || index"
                  class="repair-image-item">
              <image :src="getFileAccessUrl(file)"
                     mode="aspectFill"
                     class="repair-image-preview"
                     @click="previewRepairImage(index)" />
              <view class="repair-image-delete"
                    @click="removeRepairImage(file, index)">
                <u-icon name="close"
                        size="12"
                        color="#fff" />
              </view>
            </view>
          </view>
        </view>
      </u-form-item>
      </u-cell-group>
      <!-- 提交按钮 -->
      <view class="footer-btns">
        <u-button class="cancel-btn"
                  @click="goBack">取消</u-button>
        <u-button class="save-btn"
                  type="primary"
                  @click="sendForm"
                  :loading="loading">保存</u-button>
      </view>
    </u-form>
    <!-- 设备选择器 -->
    <up-action-sheet :show="showDevice"
                     :actions="deviceActionList"
                     title="选择设备名称"
                     @select="onDeviceSelect"
                     @close="showDevice = false" />
    <!-- 日期选择器 -->
    <up-datetime-picker :show="showDate"
                        v-model="pickerDateValue"
                        @confirm="onDateConfirm"
                        @cancel="showDate = false"
                        mode="date" />
  </view>
</template>

<script setup>
import { ref, computed, onMounted, onUnmounted } from 'vue';
import { onShow } from '@dcloudio/uni-app';
import PageHeader from '@/components/PageHeader.vue';
import { getDeviceLedger } from '@/api/equipmentManagement/ledger';
import { addRepair, editRepair, getRepairById } from '@/api/equipmentManagement/repair';
import dayjs from "dayjs";
import { formatDateToYMD } from '@/utils/ruoyi';
const showToast = (message) => {
   uni.showToast({
      title: message,
      icon: 'none'
   })
}
  import { ref, computed, onMounted, onUnmounted } from "vue";
  import { onLoad, onShow } from "@dcloudio/uni-app";
  import PageHeader from "@/components/PageHeader.vue";
  import config from "@/config";
  import { getToken } from "@/utils/auth";
  import { getDeviceLedger } from "@/api/equipmentManagement/ledger";
  import {
    addRepair,
    delRepairFile,
    editRepair,
    getRepairFileList,
    getRepairById,
  } from "@/api/equipmentManagement/repair";
  import dayjs from "dayjs";
  import { formatDateToYMD } from "@/utils/ruoyi";
  const showToast = message => {
    uni.showToast({
      title: message,
      icon: "none",
    });
  };

defineOptions({
   name: "设备报修表单",
});
  defineOptions({
    name: "设备报修表单",
  });

// 表单引用
const formRef = ref(null);
const operationType = ref('add');
const loading = ref(false);
const showDevice = ref(false);
const showDate = ref(false);
const pickerDateValue = ref(Date.now());
  // 表单引用
  const formRef = ref(null);
  const operationType = ref("add");
  const loading = ref(false);
  const showDevice = ref(false);
  const showDate = ref(false);
  const pickerDateValue = ref(Date.now());
  const uploading = ref(false);
  const repairImageList = ref([]);
  const currentRepairId = ref(undefined);
  const pageInited = ref(false);

// 设备选项
const deviceOptions = ref([]);
const deviceNameText = ref('');
const deviceActionList = computed(() => {
   return deviceOptions.value.map(item => ({
      name: item.deviceName,
      value: item.id
   }));
});
  // 设备选项
  const deviceOptions = ref([]);
  const deviceNameText = ref("");
  const deviceActionList = computed(() => {
    return deviceOptions.value.map(item => ({
      name: item.deviceName,
      value: item.id,
    }));
  });

// 扫码相关状态
const isScanning = ref(false);
const scanTimer = ref(null);
  // 扫码相关状态
  const isScanning = ref(false);
  const scanTimer = ref(null);

// 表单验证规则
const formRules = {
   deviceLedgerId: [{ required: true, trigger: "change", message: "请选择设备名称" }],
   repairTime: [{ required: true, trigger: "change", message: "请选择报修日期" }],
   repairName: [{ required: true, trigger: "blur", message: "请输入报修人" }],
   remark: [{ required: true, trigger: "blur", message: "请输入故障现象" }],
};
  // 表单验证规则
  const formRules = {
    deviceLedgerId: [
      { required: true, trigger: "change", message: "请选择设备名称" },
    ],
    repairTime: [
      { required: true, trigger: "change", message: "请选择报修日期" },
    ],
    repairName: [{ required: true, trigger: "blur", message: "请输入报修人" }],
    remark: [{ required: true, trigger: "blur", message: "请输入故障现象" }],
  };

// 使用 ref 声明表单数据
const form = ref({
   deviceLedgerId: undefined, // 设备ID
   deviceModel: undefined, // 规格型号
   repairTime: dayjs().format("YYYY-MM-DD"), // 报修日期
   repairName: undefined, // 报修人
   remark: undefined, // 故障现象
});
  // 使用 ref 声明表单数据
  const form = ref({
    deviceLedgerId: undefined, // 设备ID
    deviceModel: undefined, // 规格型号
    repairTime: dayjs().format("YYYY-MM-DD"), // 报修日期
    repairName: undefined, // 报修人
    remark: undefined, // 故障现象
  });

// 加载设备列表
const loadDeviceName = async () => {
   try {
      const { data } = await getDeviceLedger();
      deviceOptions.value = data || [];
   } catch (e) {
      showToast('获取设备列表失败');
   }
};
  const normalizeFileUrl = (rawUrl = "") => {
    let fileUrl = rawUrl || "";
    const javaApi = config.baseUrl;
    const localPrefixes = ["wxfile://", "file://", "content://", "blob:", "data:"];

// 设置设备规格型号
const setDeviceModel = (id) => {
   const option = deviceOptions.value.find((item) => item.id === id);
   if (option) {
      form.value.deviceModel = option.deviceModel;
      deviceNameText.value = option.deviceName;
   }
};
    if (localPrefixes.some(prefix => fileUrl.startsWith(prefix))) {
      return fileUrl;
    }

// 加载表单数据（编辑模式）
const loadForm = async (id) => {
   if (id) {
      operationType.value = 'edit';
      try {
         const { code, data } = await getRepairById(id);
         if (code == 200) {
            form.value.deviceLedgerId = data.deviceLedgerId;
            form.value.deviceModel = data.deviceModel;
            form.value.repairTime = dayjs(data.repairTime).format("YYYY-MM-DD");
            form.value.repairName = data.repairName;
            form.value.remark = data.remark;
            // 设置设备名称显示
            const device = deviceOptions.value.find(item => item.id === data.deviceLedgerId);
            if (device) {
               deviceNameText.value = device.deviceName;
            }
         }
      } catch (e) {
         showToast('获取详情失败');
      }
   } else {
      // 新增模式
      operationType.value = 'add';
   }
};
    if (fileUrl && fileUrl.indexOf("\\") > -1) {
      const lowerPath = fileUrl.toLowerCase();
      const uploadPathIndex = lowerPath.indexOf("uploadpath");

// 扫描二维码功能
const startScan = () => {
   if (isScanning.value) {
      showToast('正在扫描中，请稍候...');
      return;
   }
	
   // 调用uni-app的扫码API
   uni.scanCode({
      scanType: ['qrCode', 'barCode'],
      success: (res) => {
         handleScanResult(res.result);
      },
      fail: (err) => {
         console.error('扫码失败:', err);
         showToast('扫码失败，请重试');
      }
   });
};
      if (uploadPathIndex > -1) {
        fileUrl = fileUrl.substring(uploadPathIndex).replace(/\\/g, "/");
      } else {
        fileUrl = fileUrl.replace(/\\/g, "/");
      }
    }
    fileUrl = fileUrl.replace(/^\/?uploadPath/, "/profile");

// 处理扫码结果
const handleScanResult = (scanResult) => {
   if (!scanResult) {
      showToast('扫码结果为空');
      return;
   }
	
   isScanning.value = true;
   showToast('扫码成功');
	
   // 3秒后处理扫码结果
   scanTimer.value = setTimeout(() => {
      processScanResult(scanResult);
      isScanning.value = false;
   }, 100);
};
function getDeviceIdByRegExp(url) {
   // 匹配deviceId=后面的数字
   const reg = /deviceId=(\d+)/;
   const match = url.match(reg);
   // 如果匹配到结果，返回数字类型，否则返回null
   return match ? Number(match[1]) : null;
}
    if (fileUrl && !fileUrl.startsWith("http")) {
      if (!fileUrl.startsWith("/")) fileUrl = "/" + fileUrl;
      fileUrl = javaApi + fileUrl;
    }

// 处理扫码结果并匹配设备
const processScanResult = (scanResult) => {
   const deviceId = getDeviceIdByRegExp(scanResult);
   const matchedDevice = deviceOptions.value.find(item => item.id == deviceId);
	
   if (matchedDevice) {
      // 找到匹配的设备，自动填充
      form.value.deviceLedgerId = matchedDevice.id;
      deviceNameText.value = matchedDevice.deviceName;
      form.value.deviceModel = matchedDevice.deviceModel;
      showToast('设备信息已自动填充');
   } else {
      // 未找到匹配的设备
      showToast('未找到匹配的设备，请手动选择');
   }
};
    return fileUrl;
  };

// 显示设备选择器
const showDevicePicker = () => {
   showDevice.value = true;
};
  const getFileAccessUrl = (file = {}) => {
    if (file?.link) {
      if (String(file.link).startsWith("http")) return file.link;
      return normalizeFileUrl(file.link);
    }
    return normalizeFileUrl(file?.url || file?.tempFilePath || "");
  };

// 确认设备选择
const onDeviceSelect = (e) => {
   form.value.deviceLedgerId = e.value;
   setDeviceModel(e.value);
   showDevice.value = false;
};
  const normalizeId = raw => {
    if (raw === null || raw === undefined) return undefined;
    const val = String(raw).trim();
    if (!val || val === "undefined" || val === "null") return undefined;
    return val;
  };

// 显示日期选择器
const showDatePicker = () => {
   showDate.value = true;
};
  const resolveRepairId = () => {
    const pages = getCurrentPages();
    const currentPage = pages[pages.length - 1] || {};
    const routeId = normalizeId(currentPage?.options?.id);
    const memoryId = normalizeId(currentRepairId.value);
    const storageId = normalizeId(uni.getStorageSync("repairId"));
    return memoryId || routeId || storageId;
  };

// 确认日期选择
const onDateConfirm = (e) => {
   form.value.repairTime = formatDateToYMD(e.value);
   pickerDateValue.value = dayjs(e.value).format("YYYY-MM-DD");
   showDate.value = false;
};
  const getPageId = () => {
    const id = resolveRepairId();
    currentRepairId.value = id;
    return id;
  };

onShow(() => {
   // 页面显示时获取参数
   getPageParams();
});
  const fetchRepairFileList = async id => {
    if (!id) {
      repairImageList.value = [];
      return;
    }
    try {
      const { code, data } = await getRepairFileList(id);
      if (code === 200) {
        repairImageList.value = Array.isArray(data) ? data : [];
      } else {
        repairImageList.value = [];
      }
    } catch (e) {
      repairImageList.value = [];
    }
  };

onMounted(() => {
   // 页面加载时获取设备列表和参数
   loadDeviceName();
   getPageParams();
});
  const chooseRepairImage = () => {
    uni.chooseImage({
      count: 9,
      sizeType: ["original", "compressed"],
      sourceType: ["album", "camera"],
      success: res => {
        const id = getPageId();
        const files = res.tempFiles || [];
        if (!files.length) return;
        if (id) {
          uploadRepairImages(files, id);
          return;
        }
        if (operationType.value === "edit") {
          showToast("未获取到报修ID，请返回列表后重试");
          return;
        }
        // 新增模式临时上传：先本地暂存，保存报修后再自动上传绑定
        const tempItems = files.map((file, idx) => {
          const filePath = file.path || file.tempFilePath;
          return {
            id: `temp_${Date.now()}_${idx}`,
            url: filePath,
            tempFilePath: filePath,
            name: file.name || `temp_${Date.now()}_${idx}.jpg`,
            isTemp: true,
          };
        });
        repairImageList.value = [...repairImageList.value, ...tempItems];
        showToast("已临时添加，保存报修后自动上传");
      },
      fail: () => {
        showToast("选择图片失败");
      },
    });
  };

// 组件卸载时清理定时器
onUnmounted(() => {
   if (scanTimer.value) {
      clearTimeout(scanTimer.value);
   }
});
  const uploadRepairImages = async (files, repairId) => {
    const commonId = normalizeId(repairId);
    if (!commonId) {
      showToast("未获取到报修ID，上传失败");
      return;
    }
    const token = getToken();
    if (!token) {
      showToast("登录已失效，请重新登录");
      return;
    }
    uploading.value = true;
    try {
      for (const file of files) {
        const filePath = file.path || file.tempFilePath;
        if (!filePath) continue;
        await new Promise((resolve, reject) => {
          uni.uploadFile({
            url: `${config.baseUrl}/device/repair/uploadFile`,
            filePath,
            name: "file",
            formData: {
              deviceRepairId: commonId,
              type: 13,
            },
            header: {
              Authorization: `Bearer ${token}`,
            },
            success: uploadRes => {
              try {
                const parsed = JSON.parse(uploadRes.data || "{}");
                if (uploadRes.statusCode === 200 && parsed.code === 200) {
                  resolve(parsed);
                } else {
                  reject(new Error(parsed.msg || "上传失败"));
                }
              } catch (err) {
                reject(new Error("上传响应解析失败"));
              }
            },
            fail: () => reject(new Error("上传失败")),
          });
        });
      }
      showToast("上传成功");
      await fetchRepairFileList(commonId);
    } catch (e) {
      showToast(e?.message || "上传失败");
    } finally {
      uploading.value = false;
    }
  };

// 提交表单
const sendForm = async () => {
   try {
      // 手动验证表单
      let isValid = true;
      let errorMessage = '';
      if (!form.value.deviceLedgerId) {
         isValid = false;
         errorMessage = '请选择设备名称';
      } else if (!form.value.repairTime || form.value.repairTime.trim() === '') {
         isValid = false;
         errorMessage = '请选择报修日期';
      } else if (!form.value.repairName || form.value.repairName.trim() === '') {
         isValid = false;
         errorMessage = '请输入报修人';
      } else if (!form.value.remark || form.value.remark.trim() === '') {
         isValid = false;
         errorMessage = '请输入故障现象';
      }
  const previewRepairImage = index => {
    const urls = repairImageList.value
      .map(item => getFileAccessUrl(item))
      .filter(Boolean);
    if (!urls.length) return;
    uni.previewImage({
      urls,
      current: urls[index] || urls[0],
    });
  };

      if (!isValid) {
         showToast(errorMessage);
         return;
      }
  const removeRepairImage = (file, index) => {
    if (!file?.id || file?.isTemp) {
      repairImageList.value.splice(index, 1);
      return;
    }
    uni.showModal({
      title: "提示",
      content: "确认删除该图片吗？",
      success: async res => {
        if (!res.confirm) return;
        try {
          const { code } = await delRepairFile(file.id);
          if (code === 200) {
            repairImageList.value.splice(index, 1);
            showToast("删除成功");
          } else {
            showToast("删除失败");
          }
        } catch (e) {
          showToast("删除失败");
        }
      },
    });
  };

      loading.value = true;
      const id = getPageId();
  // 报修状态选项
  const repairStatusOptions = ref([
    { name: "待维修", value: "0" },
    { name: "完结", value: "1" },
    { name: "失败", value: "2" },
  ]);
  const repairStatusText = ref("");

      // 准备提交数据
      const submitData = { ...form.value };
  // 打开报修状态选择器
  const openRepairStatusPicker = () => {
    uni.showActionSheet({
      itemList: repairStatusOptions.value.map(item => item.name),
      success: res => {
        form.value.status = repairStatusOptions.value[res.tapIndex].value;
        repairStatusText.value = repairStatusOptions.value[res.tapIndex].name;
      },
    });
  };

      const { code } = id
         ? await editRepair({ id: id, ...submitData })
         : await addRepair(submitData);
  // 加载设备列表
  const loadDeviceName = async () => {
    try {
      const { data } = await getDeviceLedger();
      deviceOptions.value = data || [];
    } catch (e) {
      showToast("获取设备列表失败");
    }
  };

      if (code == 200) {
         showToast(`${id ? "编辑" : "新增"}报修成功`);
         setTimeout(() => {
            uni.navigateBack();
         }, 1500);
      } else {
         loading.value = false;
      }
   } catch (e) {
      loading.value = false;
      showToast('表单验证失败');
   }
};
  // 设置设备规格型号
  const setDeviceModel = id => {
    const option = deviceOptions.value.find(item => item.id === id);
    if (option) {
      form.value.deviceModel = option.deviceModel;
      deviceNameText.value = option.deviceName;
    }
  };

// 返回上一页
const goBack = () => {
   uni.removeStorageSync('repairId');
   uni.navigateBack();
};
  // 加载表单数据（编辑模式）
  const loadForm = async id => {
    if (id) {
      operationType.value = "edit";
      try {
        const { code, data } = await getRepairById(id);
        if (code == 200) {
          form.value.deviceLedgerId = data.deviceLedgerId;
          form.value.deviceModel = data.deviceModel;
          form.value.repairTime = dayjs(data.repairTime).format("YYYY-MM-DD");
          form.value.repairName = data.repairName;
          form.value.remark = data.remark;
          await fetchRepairFileList(id);
          repairStatusText.value =
            repairStatusOptions.value.find(item => item.value == data.status)
              ?.name || "";
          // 设置设备名称显示
          const device = deviceOptions.value.find(
            item => item.id === data.deviceLedgerId
          );
          if (device) {
            deviceNameText.value = device.deviceName;
          }
        }
      } catch (e) {
        showToast("获取详情失败");
      }
    } else {
      // 新增模式
      operationType.value = "add";
    }
  };

// 获取页面参数
const getPageParams = () => {
   // 使用uni.getStorageSync获取id
   const id = uni.getStorageSync('repairId');
	
   // 根据是否有id参数来判断是新增还是编辑
   if (id) {
      // 编辑模式，获取详情
      loadForm(id);
      // 可选：获取后清除存储的id，避免影响后续操作
      uni.removeStorageSync('repairId');
   } else {
      // 新增模式
      loadForm();
   }
};
  // 扫描二维码功能
  const startScan = () => {
    if (isScanning.value) {
      showToast("正在扫描中，请稍候...");
      return;
    }

// 获取页面ID
const getPageId = () => {
   // 使用uni.getStorageSync获取id
   const id = uni.getStorageSync('repairId');
   return id;
};
    // 调用uni-app的扫码API
    uni.scanCode({
      scanType: ["qrCode", "barCode"],
      success: res => {
        handleScanResult(res.result);
      },
      fail: err => {
        console.error("扫码失败:", err);
        showToast("扫码失败，请重试");
      },
    });
  };

  // 处理扫码结果
  const handleScanResult = scanResult => {
    if (!scanResult) {
      showToast("扫码结果为空");
      return;
    }

    isScanning.value = true;
    showToast("扫码成功");

    // 3秒后处理扫码结果
    scanTimer.value = setTimeout(() => {
      processScanResult(scanResult);
      isScanning.value = false;
    }, 100);
  };
  function getDeviceIdByRegExp(url) {
    // 匹配deviceId=后面的数字
    const reg = /deviceId=(\d+)/;
    const match = url.match(reg);
    // 如果匹配到结果，返回数字类型，否则返回null
    return match ? Number(match[1]) : null;
  }

  // 处理扫码结果并匹配设备
  const processScanResult = scanResult => {
    const deviceId = getDeviceIdByRegExp(scanResult);
    const matchedDevice = deviceOptions.value.find(item => item.id == deviceId);

    if (matchedDevice) {
      // 找到匹配的设备，自动填充
      form.value.deviceLedgerId = matchedDevice.id;
      deviceNameText.value = matchedDevice.deviceName;
      form.value.deviceModel = matchedDevice.deviceModel;
      showToast("设备信息已自动填充");
    } else {
      // 未找到匹配的设备
      showToast("未找到匹配的设备，请手动选择");
    }
  };

  // 显示设备选择器
  const showDevicePicker = () => {
    showDevice.value = true;
  };

  // 确认设备选择
  const onDeviceSelect = e => {
    form.value.deviceLedgerId = e.value;
    setDeviceModel(e.value);
    showDevice.value = false;
  };

  // 显示日期选择器
  const showDatePicker = () => {
    showDate.value = true;
  };

  // 确认日期选择
  const onDateConfirm = e => {
    form.value.repairTime = formatDateToYMD(e.value);
    pickerDateValue.value = dayjs(e.value).format("YYYY-MM-DD");
    showDate.value = false;
  };

  onLoad(options => {
    const routeId = normalizeId(options?.id);
    const storageId = normalizeId(uni.getStorageSync("repairId"));
    const id = routeId || storageId;
    currentRepairId.value = id || undefined;
    pageInited.value = true;
  });

  onShow(() => {
    // onLoad 已拿到 id 后，再按当前 id 初始化页面
    if (!pageInited.value) return;
    getPageParams();
  });

  onMounted(() => {
    // 页面加载时先获取设备列表
    loadDeviceName();
  });

  // 组件卸载时清理定时器
  onUnmounted(() => {
    if (scanTimer.value) {
      clearTimeout(scanTimer.value);
    }
  });

  // 提交表单
  const sendForm = async () => {
    try {
      // 手动验证表单
      let isValid = true;
      let errorMessage = "";
      if (!form.value.deviceLedgerId) {
        isValid = false;
        errorMessage = "请选择设备名称";
      } else if (!form.value.repairTime || form.value.repairTime.trim() === "") {
        isValid = false;
        errorMessage = "请选择报修日期";
      } else if (!form.value.repairName || form.value.repairName.trim() === "") {
        isValid = false;
        errorMessage = "请输入报修人";
      } else if (!form.value.remark || form.value.remark.trim() === "") {
        isValid = false;
        errorMessage = "请输入故障现象";
      }

      if (!isValid) {
        showToast(errorMessage);
        return;
      }

      loading.value = true;
      const id = getPageId();

      // 准备提交数据
      const submitData = { ...form.value };

      const result = id
        ? await editRepair({ id: id, ...submitData })
        : await addRepair(submitData);
      const { code, data } = result || {};

      if (code == 200) {
        // 新增场景：临时图片在保存成功后自动上传并绑定新报修单
        if (!id) {
          const newId = data?.id || data?.repairId || data;
          if (newId) {
            currentRepairId.value = newId;
            const tempFiles = repairImageList.value
              .filter(item => item?.isTemp && (item.tempFilePath || item.url))
              .map(item => ({
                path: item.tempFilePath || item.url,
                tempFilePath: item.tempFilePath || item.url,
              }));
            if (tempFiles.length) {
              await uploadRepairImages(tempFiles, newId);
            }
          }
        }
        showToast(`${id ? "编辑" : "新增"}报修成功`);
        setTimeout(() => {
          uni.navigateBack();
        }, 1500);
      } else {
        loading.value = false;
      }
    } catch (e) {
      loading.value = false;
      showToast("表单验证失败");
    }
  };

  // 返回上一页
  const goBack = () => {
    uni.removeStorageSync("repairId");
    uni.navigateBack();
  };

  // 获取页面参数
  const getPageParams = () => {
    const id = resolveRepairId();
    currentRepairId.value = id || undefined;

    // 根据是否有id参数来判断是新增还是编辑
    if (id) {
      // 编辑模式，获取详情
      loadForm(id);
    } else {
      // 新增模式
      currentRepairId.value = undefined;
      repairImageList.value = [];
      loadForm();
    }
  };
</script>

<style scoped lang="scss">
@import '@/static/scss/form-common.scss';
.repair-add {
   min-height: 100vh;
   background: #f8f9fa;
   padding-bottom: 5rem;
}
  @import "@/static/scss/form-common.scss";
  .repair-add {
    min-height: 100vh;
    background: #f8f9fa;
    padding-bottom: 5rem;
  }

.footer-btns {
   position: fixed;
   left: 0;
   right: 0;
   bottom: 0;
   background: #fff;
   display: flex;
   justify-content: space-around;
   align-items: center;
   padding: 0.75rem 0;
   box-shadow: 0 -0.125rem 0.5rem rgba(0,0,0,0.05);
   z-index: 1000;
}
  .footer-btns {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    display: flex;
    justify-content: space-around;
    align-items: center;
    padding: 0.75rem 0;
    box-shadow: 0 -0.125rem 0.5rem rgba(0, 0, 0, 0.05);
    z-index: 1000;
  }

.cancel-btn {
   font-weight: 400;
   font-size: 1rem;
   color: #FFFFFF;
   width: 6.375rem;
   background: #C7C9CC;
   box-shadow: 0 0.25rem 0.625rem 0 rgba(3,88,185,0.2);
   border-radius: 2.5rem 2.5rem 2.5rem 2.5rem;
}
  .cancel-btn {
    font-weight: 400;
    font-size: 1rem;
    color: #ffffff;
    width: 6.375rem;
    background: #c7c9cc;
    box-shadow: 0 0.25rem 0.625rem 0 rgba(3, 88, 185, 0.2);
    border-radius: 2.5rem 2.5rem 2.5rem 2.5rem;
  }

.save-btn {
   font-weight: 400;
   font-size: 1rem;
   color: #FFFFFF;
   width: 14rem;
   background: linear-gradient( 140deg, #00BAFF 0%, #006CFB 100%);
   box-shadow: 0 0.25rem 0.625rem 0 rgba(3,88,185,0.2);
   border-radius: 2.5rem 2.5rem 2.5rem 2.5rem;
}
  .save-btn {
    font-weight: 400;
    font-size: 1rem;
    color: #ffffff;
    width: 14rem;
    background: linear-gradient(140deg, #00baff 0%, #006cfb 100%);
    box-shadow: 0 0.25rem 0.625rem 0 rgba(3, 88, 185, 0.2);
    border-radius: 2.5rem 2.5rem 2.5rem 2.5rem;
  }

// 响应式调整
@media (max-width: 768px) {
   .submit-section {
      padding: 12px;
   }
}
  // 响应式调整
  @media (max-width: 768px) {
    .submit-section {
      padding: 12px;
    }
  }

.tip-text { 
   padding: 4px 16px 0 16px; 
   font-size: 12px; 
   color: #888; 
}
  .tip-text {
    padding: 4px 16px 0 16px;
    font-size: 12px;
    color: #888;
  }

.scan-icon {
   color: #1989fa;
   font-size: 18px;
   margin-left: 8px;
   cursor: pointer;
}
  .scan-icon {
    color: #1989fa;
    font-size: 18px;
    margin-left: 8px;
    cursor: pointer;
  }

  .repair-image-upload {
    width: 100%;
  }

  .repair-image-list {
    margin-top: 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
  }

  .repair-image-item {
    position: relative;
    width: 80px;
    height: 80px;
  }

  .repair-image-preview {
    width: 80px;
    height: 80px;
    border-radius: 6px;
    background: #f5f5f5;
  }

  .repair-image-delete {
    position: absolute;
    top: -6px;
    right: -6px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.65);
    display: flex;
    align-items: center;
    justify-content: center;
  }
</style>