fix: 备件库跟设备维修和设备保养关联

spring

3 天以前 0837c6143ac9d8000a91044b988d37777c698a9d

fix: 备件库跟设备维修和设备保养关联

 src/pages/equipmentManagement/repair/maintain.vue

@@ -12,10 +12,10 @@
      <u-cell-group title="维修信息"
                    inset>
        <u-form-item prop="maintenanceName"
                     label="维修人"
                     label="报修人"
                     required>
          <u-input v-model="form.maintenanceName"
                   placeholder="请输入维修人"
                   placeholder="请输入报修人"
                   clearable />
        </u-form-item>
        <u-form-item prop="maintenanceResult"
@@ -57,6 +57,50 @@
                    @click="showDatePicker = true"></u-icon>
          </template>
        </u-form-item>
        <u-form-item label="设备备件"
                     prop="sparePartsIds"
                     border-bottom>
          <view class="spare-parts-container"
                @click="showSparePart = true">
            <view v-if="selectedSpareParts.length > 0"
                  class="spare-parts-list">
              <view v-for="(item, index) in selectedSpareParts"
                    :key="String(item.id)"
                    class="spare-part-tag">
                <text>{{ item.name }}</text>
                <u-icon name="close"
                        size="12"
                        color="#fff"
                        @click.stop="removeSparePart(index)" />
              </view>
            </view>
            <text v-else
                  class="placeholder">请选择设备备件</text>
          </view>
          <template #right>
            <u-icon name="arrow-right"
                    @click.stop="showSparePart = true"></u-icon>
          </template>
        </u-form-item>

        <u-form-item v-if="selectedSpareParts.length"
                     label="领用数量"
                     border-bottom>
          <view class="spare-qty-list">
            <view v-for="item in selectedSpareParts"
                  :key="String(item.id)"
                  class="spare-qty-row">
              <view class="spare-qty-name">
                <text class="spare-name">{{ item.name }}</text>
                <text v-if="item.quantity !== null && item.quantity !== undefined"
                      class="spare-stock">（库存：{{ item.quantity }}）</text>
              </view>
              <up-number-box v-model="sparePartQtyMap[item.id]"
                             :min="1"
                             :max="item.quantity !== null && item.quantity !== undefined ? Number(item.quantity) : undefined" />
            </view>
          </view>
        </u-form-item>
      </u-cell-group>
      <!-- 提交按钮 -->
      <view class="footer-btns">
@@ -75,14 +119,43 @@
                        format="YYYY-MM-DD HH:mm:ss"
                        @confirm="onDateConfirm"
                        @cancel="showDatePicker = false" />

    <!-- 设备备件选择器 -->
    <up-popup :show="showSparePart"
              mode="bottom"
              :closeable="true"
              @close="showSparePart = false">
      <view class="spare-part-popup">
        <view class="popup-header">
          <text class="popup-title">选择设备备件</text>
        </view>
        <view class="spare-part-options">
          <view v-for="(item, index) in sparePartOptions"
                :key="index"
                class="spare-part-option"
                :class="{ selected: isSparePartSelected(item.id) }"
                @click="toggleSparePartSelection(item)">
            <text class="spare-part-option-text">{{ item.name }}</text>
            <u-icon v-if="isSparePartSelected(item.id)"
                    name="checkmark"
                    color="#2c7be5" />
          </view>
        </view>
        <up-button type="primary"
                   size="small"
                   :customStyle="{ borderRadius: '6px', padding: '4px 12px' }"
                   @click="confirmSparePartSelection">确定</up-button>
      </view>
    </up-popup>
  </view>
</template>

<script setup>
  import { ref, onMounted } from "vue";
  import { ref, onMounted, reactive, watch } from "vue";
  import { onShow } from "@dcloudio/uni-app";
  import PageHeader from "@/components/PageHeader.vue";
  import { addMaintain } from "@/api/equipmentManagement/repair";
  import { getSparePartsList } from "@/api/equipmentManagement/spareParts";
  import useUserStore from "@/store/modules/user";
  import dayjs from "dayjs";

@@ -97,11 +170,16 @@
  const loading = ref(false);
  const showDatePicker = ref(false);
  const pickerDateValue = ref(Date.now()); // 使用时间戳
  const showSparePart = ref(false);
  const sparePartOptions = ref([]);
  const selectedSpareParts = ref([]);
  const tempSelectedSpareParts = ref([]);
  const sparePartQtyMap = reactive({});

  // 表单验证规则
  const formRules = {
    maintenanceName: [
      { required: true, trigger: "blur", message: "请输入维修人" },
      { required: true, trigger: "blur", message: "请输入报修人" },
    ],
    maintenanceResult: [
      { required: true, trigger: "blur", message: "请输入维修结果" },
@@ -131,6 +209,8 @@
    maintenanceName: userStore.nickName || "", // 默认使用当前用户昵称
    maintenanceResult: undefined, // 维修结果
    maintenanceTime: dayjs().format("YYYY-MM-DD HH:mm:ss"), // 维修日期（只显示日期）
    status: "1",
    sparePartsIds: [],
  });

  // 自定义showToast函数
@@ -147,7 +227,12 @@
      maintenanceName: userStore.nickName || "",
      maintenanceResult: undefined,
      maintenanceTime: dayjs().format("YYYY-MM-DD HH:mm:ss"),
      status: "1",
      sparePartsIds: [],
    };
    selectedSpareParts.value = [];
    tempSelectedSpareParts.value = [];
    Object.keys(sparePartQtyMap).forEach((k) => delete sparePartQtyMap[k]);
  };

  const resetFormAndValidate = () => {
@@ -179,8 +264,34 @@
        return;
      }
      form.value.status = Number(form.value.status);
      // 准备提交数据，maintenanceTime 加上当前时分秒
      const submitData = { ...form.value };
      // 领用数量校验
      if (Array.isArray(form.value.sparePartsIds) && form.value.sparePartsIds.length > 0) {
        for (const partId of form.value.sparePartsIds) {
          const qty = Number(sparePartQtyMap?.[partId]);
          if (!Number.isFinite(qty) || qty <= 0) {
            showToast("请填写备件领用数量");
            loading.value = false;
            return;
          }
          const part = sparePartOptions.value.find((p) => String(p.id) === String(partId));
          const stock = part?.quantity;
          if (stock !== null && stock !== undefined && Number.isFinite(Number(stock))) {
            if (qty > Number(stock)) {
              showToast(`备件「${part?.name || ""}」领用数量不能超过库存（${stock}）`);
              loading.value = false;
              return;
            }
          }
        }
      }

      const spareIds = Array.isArray(form.value.sparePartsIds) ? form.value.sparePartsIds : [];
      const submitData = {
        ...form.value,
        sparePartsIds: spareIds.length ? spareIds.join(",") : "",
        sparePartsQty: spareIds.length ? spareIds.map((pid) => sparePartQtyMap?.[pid] ?? 1).join(",") : "",
        sparePartsUseList: spareIds.length ? spareIds.map((pid) => ({ id: pid, quantity: sparePartQtyMap?.[pid] ?? 1 })) : [],
      };

      const { code } = await addMaintain({ id: id, ...submitData });

@@ -220,13 +331,71 @@
    showDatePicker.value = false;
  };

  const fetchSparePartOptions = async () => {
    try {
      const res = await getSparePartsList({ current: 1, size: 1000 });
      if (res?.code === 200) {
        sparePartOptions.value = res?.data?.records || [];
      } else {
        sparePartOptions.value = [];
      }
    } catch (e) {
      sparePartOptions.value = [];
    }
  };

  const isSparePartSelected = (id) => {
    return tempSelectedSpareParts.value.some((p) => String(p.id) === String(id));
  };

  const toggleSparePartSelection = (item) => {
    const idx = tempSelectedSpareParts.value.findIndex((p) => String(p.id) === String(item.id));
    if (idx >= 0) {
      tempSelectedSpareParts.value.splice(idx, 1);
      delete sparePartQtyMap[item.id];
    } else {
      tempSelectedSpareParts.value.push({
        id: item.id,
        name: item.name,
        quantity: item.quantity,
      });
      if (!Number.isFinite(Number(sparePartQtyMap[item.id]))) {
        sparePartQtyMap[item.id] = 1;
      }
    }
  };

  const confirmSparePartSelection = () => {
    selectedSpareParts.value = [...tempSelectedSpareParts.value];
    form.value.sparePartsIds = selectedSpareParts.value.map((i) => i.id);
    // 保底给未填的数量赋值
    selectedSpareParts.value.forEach((p) => {
      if (!Number.isFinite(Number(sparePartQtyMap[p.id])) || Number(sparePartQtyMap[p.id]) <= 0) {
        sparePartQtyMap[p.id] = 1;
      }
    });
    showSparePart.value = false;
  };

  const removeSparePart = (index) => {
    const removed = selectedSpareParts.value.splice(index, 1)[0];
    tempSelectedSpareParts.value = [...selectedSpareParts.value];
    form.value.sparePartsIds = selectedSpareParts.value.map((i) => i.id);
    if (removed?.id !== null && removed?.id !== undefined) {
      delete sparePartQtyMap[removed.id];
    }
  };

  // 初始化表单数据
  const initForm = () => {
  const initForm = async () => {
    form.value.status = "1";
    // 设置维修人为当前用户昵称
    // 设置报修人为当前用户昵称
    form.value.maintenanceName = userStore.nickName || "";
    // 设置当前日期（只包含年月日）
    form.value.maintenanceTime = dayjs().format("YYYY-MM-DD HH:mm:ss");

    // 拉取备件列表（对齐 PC：/spareParts/listPage）
    await fetchSparePartOptions();
  };

  onShow(() => {
@@ -238,6 +407,22 @@
    // 页面加载时初始化表单
    initForm();
  });

  watch(showSparePart, (val) => {
    if (val) {
      tempSelectedSpareParts.value = [...selectedSpareParts.value];
      tempSelectedSpareParts.value.forEach((p) => {
        if (!Number.isFinite(Number(sparePartQtyMap[p.id])) || Number(sparePartQtyMap[p.id]) <= 0) {
          sparePartQtyMap[p.id] = 1;
        }
      });

      // 兜底：如果还没加载备件列表，打开弹窗时再拉一次
      if (!Array.isArray(sparePartOptions.value) || sparePartOptions.value.length === 0) {
        fetchSparePartOptions().catch(() => {});
      }
    }
  });
</script>

<style scoped lang="scss">
@@ -248,6 +433,115 @@
    padding-bottom: 5rem;
  }

  .spare-parts-container {
    width: 100%;
    min-height: 72rpx;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12rpx;
  }

  .spare-parts-list {
    display: flex;
    flex-wrap: wrap;
    gap: 12rpx;
  }

  .spare-part-tag {
    display: inline-flex;
    align-items: center;
    gap: 8rpx;
    padding: 10rpx 14rpx;
    background: #2c7be5;
    border-radius: 999rpx;
    color: #fff;
    font-size: 24rpx;
  }

  .placeholder {
    color: #c0c4cc;
    font-size: 28rpx;
  }

  .spare-qty-list {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 18rpx;
    padding: 6rpx 0;
  }

  .spare-qty-row {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18rpx;
  }

  .spare-qty-name {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8rpx;
  }

  .spare-name {
    max-width: 420rpx;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #303133;
    font-size: 28rpx;
  }

  .spare-stock {
    color: #909399;
    font-size: 24rpx;
  }

  .spare-part-popup {
    padding: 24rpx;
  }

  .popup-header {
    padding-bottom: 12rpx;
  }

  .popup-title {
    font-size: 32rpx;
    font-weight: 600;
    color: #303133;
  }

  .spare-part-options {
    max-height: 60vh;
    overflow: auto;
    margin: 16rpx 0 24rpx 0;
    border-radius: 12rpx;
    background: #fff;
  }

  .spare-part-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 22rpx 18rpx;
    border-bottom: 1rpx solid #f2f3f5;
  }

  .spare-part-option.selected {
    background: #f3f8ff;
  }

  .spare-part-option-text {
    color: #303133;
    font-size: 28rpx;
  }

  .footer-btns {
    position: fixed;
    left: 0;

 src/pages/equipmentManagement/upkeep/maintain.vue

@@ -1,315 +1,1404 @@
<template>
    <view class="upkeep-maintain">
        <!-- 使用通用页面头部组件 -->
        <PageHeader title="新增保养" @back="goBack" />
		
        <!-- 表单内容 -->
        <u-form ref="formRef" :model="form" :rules="formRules" label-width="110px" :error-type="['message']">
            <!-- 基本信息 -->
            <u-form-item label="实际保养人" prop="maintenanceActuallyName" required border-bottom>
                <u-input
                    v-model="form.maintenanceActuallyName"
                    placeholder="请输入实际保养人"
                    clearable
                />
            </u-form-item>
			
            <u-form-item label="实际保养日期" prop="maintenanceActuallyTime" required border-bottom>
                <u-input
                    v-model="form.maintenanceActuallyTime"
                    placeholder="请选择实际保养日期"
                    readonly
                    @click="showDatePicker"
                    clearable
                />
                <template #right>
                    <u-icon name="arrow-right" @click.stop="showDatePicker" />
                </template>
            </u-form-item>
			
            <u-form-item label="保养结果" prop="maintenanceResult" required border-bottom>
                <u-input
                    v-model="maintenanceResultText"
                    placeholder="请选择保养结果"
                    readonly
                    @click="showResultPicker"
                    clearable
                />
                <template #right>
                    <u-icon name="arrow-right" @click.stop="showResultPicker" />
                </template>
            </u-form-item>
			
            <!-- 提交按钮 -->
            <view class="footer-btns">
                <u-button class="cancel-btn" @click="goBack">取消</u-button>
                <u-button class="save-btn" @click="sendForm" :loading="loading">保存</u-button>
            </view>
        </u-form>
  <view class="upkeep-maintain">
    <!-- 使用通用页面头部组件 -->
    <PageHeader title="新增保养"
                @back="goBack" />
    <!-- 表单内容 -->
    <u-form ref="formRef"
            :model="form"
            :rules="formRules"
            label-width="110px"
            :error-type="['message']">
      <!-- 基本信息 -->
      <u-form-item label="实际保养人"
                   prop="maintenanceActuallyName"
                   required
                   border-bottom>
        <u-input v-model="form.maintenanceActuallyName"
                 placeholder="请输入实际保养人"
                 clearable />
      </u-form-item>
      <u-form-item label="实际保养日期"
                   prop="maintenanceActuallyTime"
                   required
                   border-bottom>
        <u-input v-model="form.maintenanceActuallyTime"
                 placeholder="请选择实际保养日期"
                 readonly
                 @click="showDatePicker"
                 clearable />
        <template #right>
          <u-icon name="arrow-right"
                  @click.stop="showDatePicker" />
        </template>
      </u-form-item>
      <u-form-item label="保养结果"
                   prop="maintenanceResult"
                   required
                   border-bottom>
        <u-input v-model="form.maintenanceResult"
                 placeholder="请输入保养结果"
                 clearable />
      </u-form-item>
      <u-form-item label="保养状态"
                   prop="maintenancestatusText"
                   required
                   border-bottom>
        <u-input v-model="maintenancestatusText"
                 placeholder="请选择保养状态"
                 readonly
                 @click="showResultPicker"
                 clearable />
        <template #right>
          <u-icon name="arrow-right"
                  @click="showResultPicker" />
        </template>
      </u-form-item>
      <u-form-item label="设备备件"
                   prop="sparePartsIds"
                   border-bottom>
        <view class="spare-parts-container"
              @click="showSparePartPicker">
          <view v-if="selectedSpareParts.length > 0"
                class="spare-parts-list">
            <view v-for="(item, index) in selectedSpareParts"
                  :key="index"
                  class="spare-part-tag">
              <text>{{ item.name }}</text>
              <u-icon name="close"
                      size="12"
                      color="#fff"
                      @click="removeSparePart(index)" />
            </view>
          </view>
          <text v-else
                class="placeholder">请选择设备备件</text>
        </view>
        <template #right>
          <u-icon name="arrow-right"
                  @click="showSparePartPicker" />
        </template>
      </u-form-item>

        <!-- 日期选择器 -->
        <u-popup v-model="showDate" mode="bottom" :closeable="true">
            <u-datetime-picker
                v-model="form.maintenanceActuallyTime"
                mode="date"
                title="选择日期"
                @confirm="onDateConfirm"
                @cancel="showDate = false"
            />
        </u-popup>

        <!-- 保养结果选择器 -->
        <up-action-sheet
            :show="showResult"
            :actions="resultColumns"
            title="选择保养结果"
            @select="onResultConfirm"
            @close="showResult = false"
        />
    </view>
      <u-form-item v-if="selectedSpareParts.length"
                   label="领用数量"
                   border-bottom>
        <view class="spare-qty-list">
          <view v-for="item in selectedSpareParts"
                :key="String(item.id || item.value)"
                class="spare-qty-row">
            <view class="spare-qty-name">
              <text class="spare-name">{{ item.name }}</text>
              <text v-if="item.quantity !== null && item.quantity !== undefined"
                    class="spare-stock">（库存：{{ item.quantity }}）</text>
            </view>
            <up-number-box v-model="sparePartQtyMap[item.id || item.value]"
                           :min="1"
                           :max="item.quantity !== null && item.quantity !== undefined ? Number(item.quantity) : undefined" />
          </view>
        </view>
      </u-form-item>
      <!-- 上传附件 -->
      <u-form-item v-if="form.status == '1'"
                   label="保养附件"
                   border-bottom>
        <view class="simple-upload-area">
          <view class="upload-buttons">
            <u-button type="primary"
                      @click="chooseMedia('image')"
                      :loading="uploading"
                      :disabled="uploadFiles.length >= uploadConfig.limit"
                      :customStyle="{ marginRight: '10px', flex: 1 }">
              <u-icon name="camera"
                      size="18"
                      color="#fff"
                      style="margin-right: 5px;"></u-icon>
              {{ uploading ? '上传中...' : '拍照' }}
            </u-button>
            <!-- <u-button type="success"
                      @click="chooseMedia('video')"
                      :loading="uploading"
                      :disabled="uploadFiles.length >= uploadConfig.limit"
                      :customStyle="{ flex: 1 }">
              <uni-icons type="videocam"
                         name="videocam"
                         size="18"
                         color="#fff"
                         style="margin-right: 5px;"></uni-icons>
              {{ uploading ? '上传中...' : '拍视频' }}
            </u-button> -->
          </view>
          <!-- 上传进度 -->
          <view v-if="uploading"
                class="upload-progress">
            <u-line-progress :percentage="uploadProgress"
                             :showText="true"
                             activeColor="#409eff"></u-line-progress>
          </view>
          <!-- 上传的文件列表 -->
          <view v-if="uploadFiles.length > 0"
                class="file-list">
            <view v-for="(file, index) in uploadFiles"
                  :key="index"
                  class="file-item">
              <view class="file-preview-container">
                <!-- {{formatFileUrl(file.url)}} -->
                <image v-if="file.type === 'image' || isImageFile(file)"
                       :src="formatFileUrl(file.url || file.tempFilePath || file.path || file.downloadUrl)"
                       class="file-preview"
                       mode="aspectFill" />
                <view v-else-if="file.type === 'video'"
                      class="video-preview">
                  <uni-icons type="videocam"
                             name="videocam"
                             size="18"
                             color="#fff"
                             style="margin-right: 5px;"></uni-icons>
                  <text class="video-text">视频</text>
                </view>
                <!-- 删除按钮 -->
                <view class="delete-btn"
                      @click="removeFile(index)">
                  <u-icon name="close"
                          size="12"
                          color="#fff"></u-icon>
                </view>
              </view>
              <view class="file-info">
                <text class="file-name">{{ file.bucketFilename || file.name || (file.type === 'image' ? '图片' : '视频')
                  }}</text>
                <text class="file-size">{{ formatFileSize(file.size) }}</text>
              </view>
            </view>
          </view>
          <view v-if="uploadFiles.length === 0"
                class="empty-state">
            <text>请选择要上传的保养图片</text>
          </view>
        </view>
      </u-form-item>
      <!-- 提交按钮 -->
      <view class="footer-btns">
        <u-button class="cancel-btn"
                  @click="goBack">取消</u-button>
        <u-button class="save-btn"
                  @click="sendForm"
                  :loading="loading">保存</u-button>
      </view>
    </u-form>
    <!-- 日期选择器 -->
    <u-popup v-model="showDate"
             mode="bottom"
             :closeable="true">
      <u-datetime-picker v-model="form.maintenanceActuallyTime"
                         mode="date"
                         title="选择日期"
                         @confirm="onDateConfirm"
                         @cancel="showDate = false" />
    </u-popup>
    <!-- 保养结果选择器 -->
    <up-action-sheet :show="showResult"
                     :actions="resultColumns"
                     title="选择保养结果"
                     @select="onResultConfirm"
                     @close="showResult = false" />
    <!-- 设备备件选择器 -->
    <up-popup :show="showSparePart"
              mode="bottom"
              :closeable="true"
              @close="showSparePart = false">
      <view class="spare-part-popup">
        <view class="popup-header">
          <text class="popup-title">选择设备备件</text>
        </view>
        <view class="spare-part-options">
          <view v-for="(item, index) in sparePartOptions"
                :key="index"
                class="spare-part-option"
                :class="{ 'selected': isSparePartSelected(item.id) }"
                @click="toggleSparePartSelection(item)">
            <text>{{ item.name }}</text>
            <u-icon v-if="isSparePartSelected(item.id)"
                    name="checkmark"
                    color="#2c7be5" />
          </view>
        </view>
        <up-button type="primary"
                   size="small"
                   :customStyle="{ borderRadius: '6px', padding: '4px 12px' }"
                   @click="confirmSparePartSelection">确定</up-button>
      </view>
    </up-popup>
  </view>
</template>

<script setup>
import { ref, onMounted } from 'vue';
import { onShow } from '@dcloudio/uni-app';
import PageHeader from '@/components/PageHeader.vue';
import { addMaintenance } from '@/api/equipmentManagement/upkeep';
import useUserStore from "@/store/modules/user";
import dayjs from "dayjs";
import { formatDateToYMD } from '@/utils/ruoyi';
  import { ref, onMounted, reactive } from "vue";
  import { onShow } from "@dcloudio/uni-app";
  import PageHeader from "@/components/PageHeader.vue";
  import {
    addMaintenance,
  } from "@/api/equipmentManagement/upkeep";
  import { getSparePartsList } from "@/api/equipmentManagement/spareParts";
  import useUserStore from "@/store/modules/user";
  import dayjs from "dayjs";
  import { formatDateToYMD } from "@/utils/ruoyi";
  import config from "@/config";

// 显示提示信息
const showToast = (message) => {
  uni.showToast({
    title: message,
    icon: 'none'
  })
};
  // 显示提示信息
  const showToast = message => {
    uni.showToast({
      title: message,
      icon: "none",
    });
  };

defineOptions({
    name: "设备保养表单",
});
  defineOptions({
    name: "设备保养表单",
  });

const userStore = useUserStore();
  const userStore = useUserStore();

// 表单引用
const formRef = ref(null);
const loading = ref(false);
const showDate = ref(false);
const showResult = ref(false);
const currentDate = ref([new Date().getFullYear(), new Date().getMonth() + 1, new Date().getDate()]);
const resultPickerValue = ref([]);
const maintenanceResultText = ref('');
  // 表单引用
  const formRef = ref(null);
  const loading = ref(false);
  const showDate = ref(false);
  const showResult = ref(false);
  const showSparePart = ref(false);
  const currentDate = ref([
    new Date().getFullYear(),
    new Date().getMonth() + 1,
    new Date().getDate(),
  ]);
  const resultPickerValue = ref([]);
  const maintenancestatusText = ref("");
  const selectedSpareParts = ref([]);
  const tempSelectedSpareParts = ref([]);
  const sparePartQtyMap = reactive({});
  const sparePartsQtyRaw = ref("");

// 保养结果选项
const resultColumns = [
    { name: '完好', value: 1 },
    { name: '维修', value: 0 }
];
  // 文件上传相关
  const uploadFiles = ref([]);
  const uploading = ref(false);
  const uploadProgress = ref(0);
  const number = ref(0);

// 表单验证规则
const formRules = {
    maintenanceActuallyName: [{ required: true, trigger: "blur", message: "请输入实际保养人" }],
    maintenanceActuallyTime: [{ required: true, trigger: "change", message: "请选择实际保养日期" }],
    maintenanceResult: [{ required: true, trigger: "change", message: "请选择保养结果" }],
};
  // 上传配置
  const uploadConfig = {
    limit: 9,
    fileType: ["jpg", "jpeg", "png", "gif", "webp", "mp4", "mov", "avi", "wmv"],
    maxVideoDuration: 60,
  };

// 使用 ref 声明表单数据
const form = ref({
    maintenanceActuallyName: userStore.nickName || '', // 默认使用当前用户昵称
    maintenanceResult: undefined, // 保养结果
    maintenanceActuallyTime: dayjs().format("YYYY-MM-DD HH:mm:ss"), // 实际保养日期（只显示日期）
});
  // 上传文件URL
  const uploadFileUrl = ref(`${config.baseUrl}/file/upload`);

// 清除表单校验状态
const clearValidate = () => {
    // uview-plus不需要手动清除验证状态，重置表单时会自动清除
};
  // 保养结果选项
  const resultColumns = [
    { name: "完结", value: 1 },
    { name: "待保养", value: 0 },
    { name: "失败", value: 2 },
  ];

// 重置表单数据和校验状态
const resetForm = () => {
    form.value = {
        maintenanceActuallyName: userStore.nickName || '',
        maintenanceResult: undefined,
        maintenanceActuallyTime: dayjs().format("YYYY-MM-DD HH:mm:ss"),
    };
    maintenanceResultText.value = '';
};
  // 表单验证规则
  const formRules = {
    maintenanceActuallyName: [
      { required: true, trigger: "blur", message: "请输入实际保养人" },
    ],
    maintenanceActuallyTime: [
      { required: true, trigger: "change", message: "请选择实际保养日期" },
    ],
    maintenanceResult: [
      { required: true, trigger: "change", message: "请选择保养结果" },
    ],
  };

const resetFormAndValidate = () => {
    resetForm();
    // clearValidate(); // 删除这行，Vant4会自动处理
};
  // 使用 ref 声明表单数据
  const form = ref({
    maintenanceActuallyName: userStore.nickName || "", // 默认使用当前用户昵称
    maintenanceResult: undefined, // 保养结果
    maintenanceActuallyTime: dayjs().format("YYYY-MM-DD HH:mm:ss"), // 实际保养日期（只显示日期）
    sparePartsIds: undefined, // 设备备件ID
  });

// 提交表单
const sendForm = async () => {
    try {
        // 手动验证表单
        let isValid = true;
        let errorMessage = '';
        if (!form.value.maintenanceActuallyName) {
            isValid = false;
            errorMessage = '请输入实际保养人';
        } else if (!form.value.maintenanceActuallyTime) {
            isValid = false;
            errorMessage = '请选择实际保养日期';
        } else if (form.value.maintenanceResult === undefined) {
            isValid = false;
            errorMessage = '请选择保养结果';
        }
  // 清除表单校验状态
  const clearValidate = () => {
    // uview-plus不需要手动清除验证状态，重置表单时会自动清除
  };

        if (!isValid) {
            showToast(errorMessage);
            return;
        }
  // 重置表单数据和校验状态
  const resetForm = () => {
    form.value = {
      maintenanceActuallyName: userStore.nickName || "",
      maintenanceResult: undefined,
      maintenanceActuallyTime: dayjs().format("YYYY-MM-DD HH:mm:ss"),
      sparePartsIds: [],
    };
    maintenancestatusText.value = "";
    selectedSpareParts.value = [];
    tempSelectedSpareParts.value = [];
    Object.keys(sparePartQtyMap).forEach((k) => delete sparePartQtyMap[k]);
    sparePartsQtyRaw.value = "";
  };

        // 验证通过
        submitFormData();
    } catch (e) {
        showToast('表单验证失败');
    }
};
  const resetFormAndValidate = () => {
    resetForm();
    // clearValidate(); // 删除这行，Vant4会自动处理
  };
  // 判断是否为图片文件
  const isImageFile = file => {
    // 检查contentType字段
    if (file.contentType && file.contentType.startsWith("image/")) {
      return true;
    }

// 提交表单数据
const submitFormData = async () => {
    try {
        loading.value = true;
        const id = getPageId();
		
        if (!id) {
            showToast('参数错误');
            loading.value = false;
            return;
        }
		
        // 准备提交数据，maintenanceActuallyTime 加上当前时分秒
        const submitData = { ...form.value };
        const { code } = await addMaintenance({ id: id, ...submitData });
		
        if (code == 200) {
            showToast('新增保养成功');
            resetFormAndValidate();
            setTimeout(() => {
                uni.navigateBack();
            }, 1500);
        } else {
            loading.value = false;
        }
    } catch (e) {
        loading.value = false;
        showToast('操作失败');
    }
};
    // 检查原有的type字段
    if (file.type === "image") return true;

// 返回上一页
const goBack = () => {
    // 清除存储的id
    uni.removeStorageSync('repairId');
    uni.navigateBack();
};
    // 检查文件扩展名
    const name = file.bucketFilename || file.originalFilename || file.name || "";
    const ext = name.split(".").pop()?.toLowerCase();
    return ["jpg", "jpeg", "png", "gif", "webp"].includes(ext);
  };

// 获取页面ID
const getPageId = () => {
    // 从本地存储获取id
    return uni.getStorageSync('repairId');
};
  // 提交表单
  const sendForm = async () => {
    console.log(form.value.sparePartsIds, "form.value.sparePartsIds");
    try {
      // 手动验证表单
      let isValid = true;
      let errorMessage = "";
      if (!form.value.maintenanceActuallyName) {
        isValid = false;
        errorMessage = "请输入实际保养人";
      } else if (!form.value.maintenanceActuallyTime) {
        isValid = false;
        errorMessage = "请选择实际保养日期";
      } else if (form.value.maintenanceResult === undefined) {
        isValid = false;
        errorMessage = "请选择保养结果";
      } else if (uploadFiles.value.length === 0 && form.value.status == "1") {
        isValid = false;
        errorMessage = "请上传保养照片";
      }

// 显示日期选择器
const showDatePicker = () => {
    showDate.value = true;
};
      if (!isValid) {
        showToast(errorMessage);
        return;
      }

// 确认日期选择
const onDateConfirm = (e) => {
    // 只保存年月日，不包含时分秒
    form.value.maintenanceActuallyTime = dayjs(e.value).format('YYYY-MM-DD HH:mm:ss');
    showDate.value = false;
};
      // 验证通过
      submitFormData();
    } catch (e) {
      showToast("表单验证失败");
    }
  };

// 显示保养结果选择器
const showResultPicker = () => {
    showResult.value = true;
};
  // 提交表单数据
  const submitFormData = async () => {
    try {
      loading.value = true;
      const id = getPageId();

// 确认保养结果选择
const onResultConfirm = (selected) => {
    form.value.maintenanceResult = selected.value;
    maintenanceResultText.value = selected.name;
    showResult.value = false;
};
      if (!id) {
        showToast("参数错误");
        loading.value = false;
        return;
      }
      // 领用数量校验
      const spareIds = Array.isArray(form.value.sparePartsIds) ? form.value.sparePartsIds : [];
      if (spareIds.length > 0) {
        for (const partId of spareIds) {
          const qty = Number(sparePartQtyMap?.[partId]);
          if (!Number.isFinite(qty) || qty <= 0) {
            showToast("请填写备件领用数量");
            loading.value = false;
            return;
          }
          const part = sparePartOptions.value.find((p) => String(p.id || p.value) === String(partId));
          const stock = part?.quantity;
          if (stock !== null && stock !== undefined && Number.isFinite(Number(stock))) {
            if (qty > Number(stock)) {
              showToast(`备件「${part?.name || ""}」领用数量不能超过库存（${stock}）`);
              loading.value = false;
              return;
            }
          }
        }
      }

// 初始化表单数据
const initForm = () => {
    // 设置保养人为当前用户昵称
    form.value.maintenanceActuallyName = userStore.nickName || '';
    // 设置当前日期（只包含年月日）
    form.value.maintenanceActuallyTime = dayjs().format('YYYY-MM-DD HH:mm:ss');
    currentDate.value = [new Date().getFullYear(), new Date().getMonth() + 1, new Date().getDate()];
};
      const submitData = {
        ...form.value,
        imagesFile: form.value.status == "1" ? uploadFiles.value : [],
        sparePartsIds: spareIds.length ? spareIds.join(",") : "",
        sparePartsQty: spareIds.length ? spareIds.map((pid) => sparePartQtyMap?.[pid] ?? 1).join(",") : "",
        sparePartsUseList: spareIds.length ? spareIds.map((pid) => ({ id: pid, quantity: sparePartQtyMap?.[pid] ?? 1 })) : [],
      };
      const { code } = await addMaintenance({ id: id, ...submitData });

onShow(() => {
    // 页面显示时初始化表单
    initForm();
});
      if (code == 200) {
        showToast("新增保养成功");
        resetFormAndValidate();
        setTimeout(() => {
          uni.navigateBack();
        }, 1500);
      } else {
        loading.value = false;
      }
    } catch (e) {
      loading.value = false;
      showToast("操作失败");
    }
  };

onMounted(() => {
    // 页面加载时初始化表单
    initForm();
});
  // 返回上一页
  const goBack = () => {
    // 清除存储的id和数据
    uni.removeStorageSync("repairId");
    uni.removeStorageSync("upkeepItemData");
    uni.navigateBack();
  };

  // 获取页面ID
  const getPageId = () => {
    // 从本地存储获取id
    return uni.getStorageSync("repairId");
  };

  const dataform = ref({});
  // 获取设备信息
  const getUpkeepItemData = () => {
    try {
      const dataStr = uni.getStorageSync("upkeepItemData");
      if (!dataStr) {
        return null;
      }
      dataform.value = JSON.parse(dataStr);
      sparePartsQtyRaw.value = dataform.value?.sparePartsQty || "";
      fetchSparePartOptions();
      return JSON.parse(dataStr);
    } catch (e) {
      console.error("解析设备数据失败:", e);
      return null;
    }
  };

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

  // 确认日期选择
  const onDateConfirm = e => {
    // 只保存年月日，不包含时分秒
    form.value.maintenanceActuallyTime = dayjs(e.value).format(
      "YYYY-MM-DD HH:mm:ss"
    );
    showDate.value = false;
  };

  // 显示保养结果选择器
  const showResultPicker = () => {
    showResult.value = true;
  };

  // 确认保养结果选择
  const onResultConfirm = selected => {
    form.value.status = selected.value;
    maintenancestatusText.value = selected.name;
    showResult.value = false;
  };

  // 显示设备备件选择器
  const showSparePartPicker = () => {
    tempSelectedSpareParts.value = [...selectedSpareParts.value];
    tempSelectedSpareParts.value.forEach((p) => {
      const pid = p?.id ?? p?.value;
      if (pid !== null && pid !== undefined) {
        if (!Number.isFinite(Number(sparePartQtyMap[pid])) || Number(sparePartQtyMap[pid]) <= 0) {
          sparePartQtyMap[pid] = 1;
        }
      }
    });
    showSparePart.value = true;
  };

  // 检查备件是否已选中
  const isSparePartSelected = id => {
    return tempSelectedSpareParts.value.some(
      item => item.id === id || item.value === id
    );
  };

  // 切换备件选中状态
  const toggleSparePartSelection = item => {
    const itemId = item.id || item.value;
    const index = tempSelectedSpareParts.value.findIndex(
      selected => selected.id === itemId || selected.value === itemId
    );
    if (index > -1) {
      tempSelectedSpareParts.value.splice(index, 1);
      delete sparePartQtyMap[itemId];
    } else {
      tempSelectedSpareParts.value.push(item);
      if (!Number.isFinite(Number(sparePartQtyMap[itemId])) || Number(sparePartQtyMap[itemId]) <= 0) {
        sparePartQtyMap[itemId] = 1;
      }
    }
  };

  // 确认备件选择
  const confirmSparePartSelection = () => {
    selectedSpareParts.value = [...tempSelectedSpareParts.value];
    form.value.sparePartsIds = selectedSpareParts.value.map(item => item.id || item.value);
    selectedSpareParts.value.forEach((p) => {
      const pid = p?.id ?? p?.value;
      if (pid !== null && pid !== undefined) {
        if (!Number.isFinite(Number(sparePartQtyMap[pid])) || Number(sparePartQtyMap[pid]) <= 0) {
          sparePartQtyMap[pid] = 1;
        }
      }
    });
    showSparePart.value = false;
  };

  // 移除已选备件
  const removeSparePart = index => {
    const removed = selectedSpareParts.value.splice(index, 1)[0];
    form.value.sparePartsIds = selectedSpareParts.value.map(item => item.id || item.value);
    const rid = removed?.id ?? removed?.value;
    if (rid !== null && rid !== undefined) delete sparePartQtyMap[rid];
  };
  const sparePartsIds = ref([]);
  // 初始化表单数据
  const initForm = () => {
    // 获取设备信息
    const itemData = getUpkeepItemData();

    // 重置选择的备件
    selectedSpareParts.value = [];
    // 重置上传的文件
    uploadFiles.value = [];
    uploading.value = false;
    uploadProgress.value = 0;
    maintenancestatusText.value = "";

    // 设置保养人为当前用户昵称
    form.value.maintenanceActuallyName = userStore.nickName || "";
    // 设置当前日期（只包含年月日）
    form.value.maintenanceActuallyTime = dayjs().format("YYYY-MM-DD HH:mm:ss");
    currentDate.value = [
      new Date().getFullYear(),
      new Date().getMonth() + 1,
      new Date().getDate(),
    ];

    // 如果有设备信息，填充已有的保养数据
    if (itemData) {
      // 填充实际保养人
      if (itemData.maintenanceActuallyName) {
        form.value.maintenanceActuallyName = itemData.maintenanceActuallyName;
      }
      // 填充保养结果
      if (
        itemData.maintenanceResult !== undefined &&
        itemData.maintenanceResult !== null
      ) {
        form.value.maintenanceResult = itemData.maintenanceResult;
      }
      // 填充实际保养日期
      if (itemData.maintenanceActuallyTime) {
        form.value.maintenanceActuallyTime = itemData.maintenanceActuallyTime;
        // 解析日期设置到日期选择器
        const date = dayjs(itemData.maintenanceActuallyTime);
        currentDate.value = [date.year(), date.month() + 1, date.date()];
      }
      // 填充保养状态
      if (itemData.status) {
        const statusMap = {
          0: "待保养",
          1: "完结",
          2: "失败",
        };
        maintenancestatusText.value = statusMap[itemData.status] || "";
      }
      // 填充备件数据

      // 处理字符串格式的备件IDs
      sparePartsIds.value = itemData.sparePartsIds;

      // 填充附件数据
      if (itemData.files && itemData.files.length > 0) {
        uploadFiles.value = itemData.files.map(file => ({
          id: file.id,
          name: file.name || file.bucketFilename || file.originalFilename,
          url: file.url || file.downloadUrl,
          type:
            file.type ||
            (file.contentType && file.contentType.startsWith("image/")
              ? "image"
              : "video"),
          size: file.size || file.byteSize,
        }));
      } else if (itemData.uploadFiles && itemData.uploadFiles.length > 0) {
        uploadFiles.value = itemData.uploadFiles.map(file => ({
          id: file.id,
          name: file.name || file.bucketFilename || file.originalFilename,
          url: file.url || file.downloadUrl || file.tempFilePath || file.path,
          type: file.type,
          size: file.size,
        }));
      }
    }
  };

  onShow(async () => {
    // 先获取备件选项，再初始化表单
    const pageId = getPageId();
    if (pageId) {
      await fetchSparePartOptions();
    }
    // 页面显示时初始化表单
  });
  const sparePartOptions = ref([]);
  // 备件列表接口对齐维修页/PC：/spareParts/listPage → res.data.records
  const fetchSparePartOptions = () => {
    return new Promise((resolve, reject) => {
      getSparePartsList({ current: 1, size: 1000 })
        .then(res => {
          if (res.code == 200) {
            sparePartOptions.value = res?.data?.records || [];
            const idArray =
              typeof sparePartsIds.value === "string"
                ? sparePartsIds.value.split(",")
                : (Array.isArray(sparePartsIds.value) ? sparePartsIds.value : []);

            if (idArray.length > 0) {
              selectedSpareParts.value = sparePartOptions.value
                .filter(
                  option =>
                    idArray.includes(option.id.toString()) ||
                    idArray.includes(option.value?.toString())
                )
                .map(option => ({
                  id: option.id || option.value,
                  name: option.name,
                  code: option.code,
                  value: option.id || option.value,
                  quantity: option.quantity,
                }));
              // 设置备件IDs（保持数组，提交时再 join）
              form.value.sparePartsIds = idArray.map((v) => {
                const n = Number(String(v).trim());
                return Number.isFinite(n) ? n : String(v).trim();
              });

              // 回显领用数量（若有 sparePartsQty）
              if (typeof sparePartsQtyRaw.value === "string" && sparePartsQtyRaw.value.trim()) {
                const qtyArr = sparePartsQtyRaw.value.split(",").map((s) => Number(String(s).trim()));
                selectedSpareParts.value.forEach((p, idx) => {
                  const pid = p?.id ?? p?.value;
                  const q = qtyArr[idx];
                  if (pid !== null && pid !== undefined && Number.isFinite(q) && q > 0) {
                    sparePartQtyMap[pid] = q;
                  }
                });
              }

              // 默认数量兜底
              selectedSpareParts.value.forEach((p) => {
                const pid = p?.id ?? p?.value;
                if (pid !== null && pid !== undefined) {
                  if (!Number.isFinite(Number(sparePartQtyMap[pid])) || Number(sparePartQtyMap[pid]) <= 0) {
                    sparePartQtyMap[pid] = 1;
                  }
                }
              });
            }
            resolve(res?.data?.records || []);
          } else {
            resolve([]);
          }
        })
        .catch(err => {
          console.error("获取备件选项失败:", err);
          resolve([]);
        });
    });
  };

  // 格式化文件URL
  // const formatFileUrl = url => {
  //   if (!url) return "";

  //   // 如果已经是完整的URL（http或https开头），直接返回
  //   if (url.startsWith("http://") || url.startsWith("https://")) {
  //     return url;
  //   }

  //   // 如果是本地路径（如 D:\\ruoyi\\prod\\uploads...），需要转换为网络URL
  //   // 从路径中提取uploads后面的部分
  //   const uploadsIndex = url.indexOf("uploads");
  //   if (uploadsIndex !== -1) {
  //     const relativePath = url.substring(uploadsIndex);
  //     // 使用baseUrl + /profile/ + 相对路径
  //     return `http://192.168.1.35:8888/profile/${relativePath}`;
  //   }

  //   // 其他情况，尝试直接拼接
  //   return `http://192.168.1.35:8888/profile/${url}`;
  // };

  // 格式化文件大小
  const formatFileSize = size => {
    if (!size) return "";
    if (size < 1024) return size + "B";
    if (size < 1024 * 1024) return (size / 1024).toFixed(1) + "KB";
    return (size / (1024 * 1024)).toFixed(1) + "MB";
  };

  // 拍照/拍视频
  const chooseMedia = type => {
    if (uploadFiles.value.length >= uploadConfig.limit) {
      uni.showToast({
        title: `最多只能选择${uploadConfig.limit}个文件`,
        icon: "none",
      });
      return;
    }

    const remaining = uploadConfig.limit - uploadFiles.value.length;

    // 优先：chooseMedia（支持 image/video）
    if (typeof uni.chooseMedia === "function") {
      uni.chooseMedia({
        count: Math.min(remaining, 1),
        mediaType: [type || "image"],
        sizeType: ["compressed", "original"],
        sourceType: ["camera"], // 支持相机和相册
        success: res => {
          try {
            const files = res?.tempFiles || [];
            if (!files.length) throw new Error("未获取到文件");

            files.forEach((tf, idx) => {
              const filePath = tf.tempFilePath || tf.path || "";
              const fileType = tf.fileType || type || "image";
              const ext = fileType === "video" ? "mp4" : "jpg";
              const file = {
                tempFilePath: filePath,
                path: filePath,
                type: fileType,
                name: `${fileType}_${Date.now()}_${idx}.${ext}`,
                size: tf.size || 0,
                duration: tf.duration || 0,
                createTime: Date.now(),
                uid: Date.now() + Math.random() + idx,
              };

              console.log("chooseMedia 成功获取文件:", file);
              handleBeforeUpload(file);
            });
          } catch (e) {
            console.error("处理拍摄结果失败:", e);
            uni.showToast({ title: "处理文件失败", icon: "error" });
          }
        },
        fail: err => {
          console.error("拍摄失败:", err);
          uni.showToast({ title: "拍摄失败", icon: "error" });
        },
      });
      return;
    }

    // 降级：chooseImage / chooseVideo
    if (type === "video") {
      uni.chooseVideo({
        sourceType: ["camera", "album"],
        maxDuration: uploadConfig.maxVideoDuration,
        camera: "back",
        success: res => {
          try {
            if (!res.tempFilePath) {
              throw new Error("未获取到视频文件");
            }

            const file = {
              tempFilePath: res.tempFilePath,
              path: res.tempFilePath,
              type: "video",
              name: `video_${Date.now()}.mp4`,
              size: res.size || 0,
              duration: res.duration || 0,
              createTime: new Date().getTime(),
              uid: Date.now() + Math.random(),
            };

            handleBeforeUpload(file);
          } catch (error) {
            console.error("处理拍视频结果失败:", error);
            uni.showToast({ title: "处理视频失败", icon: "error" });
          }
        },
        fail: err => {
          console.error("拍视频失败:", err);
          uni.showToast({ title: "拍视频失败", icon: "error" });
        },
      });
    } else {
      uni.chooseImage({
        count: 1,
        sizeType: ["compressed", "original"],
        sourceType: ["camera", "album"],
        success: res => {
          const tempFilePath = res?.tempFilePaths?.[0];
          const tempFile = res?.tempFiles?.[0] || {};
          if (!tempFilePath) return;
          handleBeforeUpload({
            tempFilePath,
            path: tempFilePath,
            type: "image",
            name: `photo_${Date.now()}.jpg`,
            size: tempFile.size || 0,
            createTime: Date.now(),
            uid: Date.now() + Math.random(),
          });
        },
      });
    }
  };

  // 删除文件
  const removeFile = index => {
    uni.showModal({
      title: "确认删除",
      content: "确定要删除这个文件吗？",
      success: res => {
        if (res.confirm) {
          uploadFiles.value.splice(index, 1);
          uni.showToast({
            title: "删除成功",
            icon: "success",
          });
        }
      },
    });
  };

  // 上传前校验
  const handleBeforeUpload = async file => {
    // 校验文件类型
    if (
      uploadConfig.fileType &&
      Array.isArray(uploadConfig.fileType) &&
      uploadConfig.fileType.length > 0
    ) {
      const fileName = file.name || "";
      const fileExtension = fileName
        ? fileName.split(".").pop().toLowerCase()
        : "";

      // 根据文件类型确定期望的扩展名
      let expectedTypes = [];
      if (file.type === "image") {
        expectedTypes = ["jpg", "jpeg", "png", "gif", "webp"];
      } else if (file.type === "video") {
        expectedTypes = ["mp4", "mov", "avi", "wmv"];
      }

      // 检查文件扩展名是否在允许的类型中
      if (fileExtension && expectedTypes.length > 0) {
        const isAllowed = expectedTypes.some(
          type => uploadConfig.fileType.includes(type) && type === fileExtension
        );

        if (!isAllowed) {
          uni.showToast({
            title: `文件格式不支持，请拍摄 ${expectedTypes.join("/")} 格式的文件`,
            icon: "none",
          });
          return false;
        }
      }
    }

    // 校验通过，开始上传
    uploadFile(file);
    return true;
  };

  // 文件上传处理
  const uploadFile = async file => {
    uploading.value = true;
    uploadProgress.value = 0;
    number.value++;

    // 确保token存在
    const token = userStore.token;
    if (!token) {
      handleUploadError("用户未登录");
      return;
    }

    uploadWithUniUploadFile(file, file.tempFilePath || file.path || "", token);
  };

  // 使用uni.uploadFile上传
  const uploadWithUniUploadFile = (file, filePath, token) => {
    if (!filePath) {
      handleUploadError("文件路径不存在");
      return;
    }

    const uploadTask = uni.uploadFile({
      url: uploadFileUrl.value,
      filePath: filePath,
      name: "file",
      formData: {
        type: 10, // 保养附件类型
      },
      header: {
        Authorization: `Bearer ${token}`,
      },
      success: res => {
        try {
          if (res.statusCode === 200) {
            const response = JSON.parse(res.data);
            if (response.code === 200) {
              handleUploadSuccess(response, file);
              uni.showToast({
                title: "上传成功",
                icon: "success",
              });
            } else {
              handleUploadError(response.msg || "服务器返回错误");
            }
          } else {
            handleUploadError(`服务器错误，状态码: ${res.statusCode}`);
          }
        } catch (e) {
          console.error("解析响应失败:", e);
          console.error("原始响应数据:", res.data);
          handleUploadError("响应数据解析失败: " + e.message);
        }
      },
      fail: err => {
        console.error("上传失败:", err.errMsg || err);
        number.value--;

        let errorMessage = "上传失败";
        if (err.errMsg) {
          if (err.errMsg.includes("statusCode: null")) {
            errorMessage = "网络连接失败，请检查网络设置";
          } else if (err.errMsg.includes("timeout")) {
            errorMessage = "上传超时，请重试";
          } else if (err.errMsg.includes("fail")) {
            errorMessage = "上传失败，请检查网络连接";
          } else {
            errorMessage = err.errMsg;
          }
        }

        handleUploadError(errorMessage);
      },
      complete: () => {
        uploading.value = false;
        uploadProgress.value = 0;
      },
    });

    // 监听上传进度
    if (uploadTask && uploadTask.onProgressUpdate) {
      uploadTask.onProgressUpdate(res => {
        uploadProgress.value = res.progress;
      });
    }
  }; // 格式化文件URL
  const formatFileUrl = url => {
    if (!url) return "";
    if (url.startsWith("http://") || url.startsWith("https://")) {
      return url;
    }
    // const uploadsIndex = url.indexOf("uploads");
    // if (uploadsIndex !== -1) {
    //   const relativePath = url.substring(uploadsIndex);
    //   return `${config.fileUrl}/${relativePath}`;
    // }
    return `${config.fileUrl}/${url}`;
  };

  // 上传成功处理
  const handleUploadSuccess = (res, file) => {
    console.log("上传成功响应:", res);

    // 处理不同的数据结构：可能是数组，也可能是单个对象
    let uploadedFile = null;
    uploadedFile = res.data;

    if (!uploadedFile) {
      console.error("无法解析上传响应数据:", res);
      number.value--;
      handleUploadError("上传响应数据格式错误", false);
      return;
    }
    console.log("上传成功文件数据:", uploadedFile, file);

    // 确保上传的文件数据完整，包含id和type
    const fileData = {
      name: uploadedFile.originalName,
      type: file.type,
      url: uploadedFile.tempPath,
    };

    uploadFiles.value.push(fileData);
    number.value = 0;
  };

  // 上传失败处理
  const handleUploadError = (message = "上传文件失败", showRetry = false) => {
    uploading.value = false;
    uploadProgress.value = 0;

    if (showRetry) {
      uni.showModal({
        title: "上传失败",
        content: message + "，是否重试？",
        success: res => {
          if (res.confirm) {
            // 用户选择重试，这里可以重新触发上传
          }
        },
      });
    } else {
      uni.showToast({
        title: message,
        icon: "error",
      });
    }
  };

  onMounted(() => {
    // 页面加载时初始化表单
    initForm();
  });
</script>

<style scoped lang="scss">
@import '@/static/scss/form-common.scss';
.upkeep-maintain {
    min-height: 100vh;
    background: #f8f9fa;
    padding-bottom: 5rem;
}
  @import "@/static/scss/form-common.scss";
  .upkeep-maintain {
    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;
  }

  /* 设备备件多选样式 */
  .spare-parts-container {
    flex: 1;
    min-height: 40px;
    display: flex;
    align-items: center;
  }

  .spare-parts-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }

  .spare-part-tag {
    display: flex;
    align-items: center;
    gap: 4px;
    background: #2c7be5;
    color: #fff;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
  }

  .placeholder {
    color: #c0c4cc;
    font-size: 14px;
  }

  /* 领用数量样式 */
  .spare-qty-list {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 4px 0;
  }

  .spare-qty-row {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }

  .spare-qty-name {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
  }

  .spare-name {
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #303133;
    font-size: 14px;
  }

  .spare-stock {
    color: #909399;
    font-size: 12px;
  }

  /* 备件选择弹窗样式 */
  .spare-part-popup {
    padding: 16px;
    max-height: 60vh;
    display: flex;
    flex-direction: column;
  }

  .popup-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e8e8e8;
  }

  .popup-title {
    font-size: 16px;
    font-weight: 600;
    color: #333;
  }

  .spare-part-options {
    flex: 1;
    overflow-y: auto;
  }

  .spare-part-option {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid #f0f0f0;
    font-size: 14px;
    color: #333;
  }

  .spare-part-option.selected {
    color: #2c7be5;
    font-weight: 500;
  }

  /* 备件选择弹窗样式 */
  .spare-part-popup {
    width: 100%;
    max-height: 80vh;
    background: #fff;
    border-radius: 16px 16px 0 0;
    overflow: hidden;
  }

  .popup-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid #f0f0f0;
    background: #f8f9fa;
  }

  .popup-title {
    font-size: 16px;
    font-weight: 600;
    color: #333;
  }

  .spare-part-options {
    padding: 10px 0;
    max-height: 60vh;
    overflow-y: auto;
  }

  .spare-part-option {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 20px;
    border-bottom: 1px solid #f0f0f0;
    transition: all 0.2s ease;
  }

  .spare-part-option:last-child {
    border-bottom: none;
  }

  .spare-part-option:hover {
    background: #f8f9fa;
  }

  .spare-part-option.selected {
    background: #e6f7ff;
    color: #1890ff;
  }

  .spare-part-option.selected::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: #1890ff;
  }

  /* 文件上传样式 */
  .simple-upload-area {
    width: 100%;
  }

  .upload-buttons {
    display: flex;
    margin-bottom: 12px;
  }

  .upload-progress {
    margin: 12px 0;
  }

  .file-list {
    margin-top: 12px;
  }

  .file-item {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
    padding: 10px;
    background: #f8f9fa;
    border-radius: 8px;
  }

  .file-preview-container {
    position: relative;
    margin-right: 12px;
  }

  .file-preview {
    width: 80px;
    height: 80px;
    border-radius: 4px;
  }

  .video-preview {
    width: 80px;
    height: 80px;
    background: #333;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 12px;
  }

  .delete-btn {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 20px;
    height: 20px;
    background: #f56c6c;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .file-info {
    flex: 1;
  }

  .file-name {
    display: block;
    font-size: 14px;
    color: #333;
    margin-bottom: 4px;
    line-height: 1.4;
  }

  .file-size {
    font-size: 12px;
    color: #999;
  }

  .empty-state {
    padding: 20px 0;
    text-align: center;
    color: #999;
    font-size: 14px;
  }
</style>