From 74e6e4431b82fcd30e31f59b91bcdf2c8a5cf3f8 Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期四, 09 四月 2026 13:12:51 +0800
Subject: [PATCH] 升级app 1.部署修改
---
src/pages/equipmentManagement/repair/maintain.vue | 827 ++++++++++++++++++++++++++++++++++++++++++----------------
1 files changed, 590 insertions(+), 237 deletions(-)
diff --git a/src/pages/equipmentManagement/repair/maintain.vue b/src/pages/equipmentManagement/repair/maintain.vue
index 64d08cb..9b077d6 100644
--- a/src/pages/equipmentManagement/repair/maintain.vue
+++ b/src/pages/equipmentManagement/repair/maintain.vue
@@ -1,267 +1,620 @@
<template>
- <view class="repair-maintain">
- <!-- 浣跨敤閫氱敤椤甸潰澶撮儴缁勪欢 -->
- <PageHeader title="鏂板缁翠慨" @back="goBack" />
-
- <!-- 琛ㄥ崟鍐呭 -->
- <van-form @submit="sendForm" ref="formRef" label-width="110px" input-align="right" error-message-align="right" scroll-to-error scroll-to-error-position="center">
- <!-- 鍩烘湰淇℃伅 -->
- <van-cell-group title="缁翠慨淇℃伅" inset>
- <van-field
- v-model="form.maintenanceName"
- label="缁翠慨浜�"
- placeholder="璇疯緭鍏ョ淮淇汉"
- :rules="formRules.maintenanceName"
- required
- clearable
- />
- <van-field
- v-model="form.maintenanceResult"
- label="缁翠慨缁撴灉"
- type="textarea"
- rows="3"
- placeholder="璇疯緭鍏ョ淮淇粨鏋�"
- :rules="formRules.maintenanceResult"
- required
- clearable
- maxlength="200"
- show-word-limit
- />
- <van-field
- v-model="form.maintenanceTime"
- label="缁翠慨鏃ユ湡"
- placeholder="璇烽�夋嫨缁翠慨鏃ユ湡"
- :rules="formRules.maintenanceTime"
- required
- readonly
- @click="showDatePicker"
- clearable
- />
- </van-cell-group>
-
- <!-- 鎻愪氦鎸夐挳 -->
- <view class="footer-btns">
- <van-button class="cancel-btn" @click="goBack">鍙栨秷</van-button>
- <van-button class="save-btn" native-type="submit" form-type="submit" :loading="loading">淇濆瓨</van-button>
- </view>
- </van-form>
-
- <!-- 鏃ユ湡閫夋嫨鍣� -->
- <van-popup v-model:show="showDate" position="bottom">
- <van-date-picker
- v-model="currentDate"
- title="閫夋嫨鏃ユ湡"
- @confirm="onDateConfirm"
- @cancel="showDate = false"
- />
- </van-popup>
- </view>
+ <view class="repair-maintain">
+ <!-- 浣跨敤閫氱敤椤甸潰澶撮儴缁勪欢 -->
+ <PageHeader title="鏂板缁翠慨"
+ @back="goBack" />
+ <!-- 琛ㄥ崟鍐呭 -->
+ <u-form ref="formRef"
+ :model="form"
+ :rules="formRules"
+ label-width="140rpx">
+ <!-- 鍩烘湰淇℃伅 -->
+ <u-cell-group title="缁翠慨淇℃伅"
+ inset>
+ <u-form-item prop="maintenanceName"
+ label="鎶ヤ慨浜�"
+ required>
+ <u-input v-model="form.maintenanceName"
+ placeholder="璇疯緭鍏ユ姤淇汉"
+ clearable />
+ </u-form-item>
+ <u-form-item prop="maintenanceResult"
+ label="缁翠慨缁撴灉"
+ required>
+ <u-input v-model="form.maintenanceResult"
+ type="textarea"
+ rows="3"
+ placeholder="璇疯緭鍏ョ淮淇粨鏋�"
+ clearable
+ maxlength="200"
+ show-word-limit />
+ </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="maintenanceTime"
+ required
+ border-bottom>
+ <u-input v-model="form.maintenanceTime"
+ placeholder="璇烽�夋嫨缁翠慨鏃ユ湡"
+ readonly
+ @click="showDatePicker = true"
+ clearable />
+ <template #right>
+ <u-icon name="arrow-right"
+ @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">
+ <u-button class="cancel-btn"
+ @click="goBack">鍙栨秷</u-button>
+ <u-button class="save-btn"
+ @click="submitForm"
+ :loading="loading">淇濆瓨</u-button>
+ </view>
+ </u-form>
+ <!-- 鏃ユ湡閫夋嫨鍣� -->
+ <up-datetime-picker :show="showDatePicker"
+ v-model="pickerDateValue"
+ mode="datetime"
+ title="閫夋嫨鏃ユ湡"
+ 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 { onShow } from '@dcloudio/uni-app';
-import PageHeader from '@/components/PageHeader.vue';
-import { addMaintain } from '@/api/equipmentManagement/repair';
-import useUserStore from "@/store/modules/user";
-import dayjs from "dayjs";
-import { showToast } from 'vant';
+ 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/repair";
+ import useUserStore from "@/store/modules/user";
+ import dayjs from "dayjs";
-defineOptions({
- name: "璁惧缁翠慨琛ㄥ崟",
-});
+ defineOptions({
+ name: "璁惧缁翠慨琛ㄥ崟",
+ });
-const userStore = useUserStore();
+ const userStore = useUserStore();
-// 琛ㄥ崟寮曠敤
-const formRef = ref(null);
-const loading = ref(false);
-const showDate = ref(false);
-const currentDate = ref([new Date().getFullYear(), new Date().getMonth() + 1, new Date().getDate()]);
+ // 琛ㄥ崟寮曠敤
+ const formRef = ref(null);
+ 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: "璇疯緭鍏ョ淮淇汉" }],
- maintenanceResult: [{ required: true, trigger: "blur", message: "璇疯緭鍏ョ淮淇粨鏋�" }],
- maintenanceTime: [{ required: true, trigger: "change", message: "璇烽�夋嫨缁翠慨鏃ユ湡" }],
-};
+ // 琛ㄥ崟楠岃瘉瑙勫垯
+ const formRules = {
+ maintenanceName: [
+ { required: true, trigger: "blur", message: "璇疯緭鍏ユ姤淇汉" },
+ ],
+ maintenanceResult: [
+ { required: true, trigger: "blur", message: "璇疯緭鍏ョ淮淇粨鏋�" },
+ ],
+ maintenanceTime: [
+ { required: true, trigger: "change", message: "璇烽�夋嫨缁翠慨鏃ユ湡" },
+ ],
+ };
+ const repairStatusOptions = ref([
+ { name: "寰呯淮淇�", value: "0" },
+ { name: "瀹岀粨", value: "1" },
+ { name: "澶辫触", value: "2" },
+ ]);
+ const repairStatusText = ref("瀹岀粨");
+ // 鎵撳紑鎶ヤ慨鐘舵�侀�夋嫨鍣�
+ 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;
+ },
+ });
+ };
+ // 浣跨敤 ref 澹版槑琛ㄥ崟鏁版嵁
+ const form = ref({
+ maintenanceName: userStore.nickName || "", // 榛樿浣跨敤褰撳墠鐢ㄦ埛鏄电О
+ maintenanceResult: undefined, // 缁翠慨缁撴灉
+ maintenanceTime: dayjs().format("YYYY-MM-DD HH:mm:ss"), // 缁翠慨鏃ユ湡锛堝彧鏄剧ず鏃ユ湡锛�
+ status: "1",
+ sparePartsIds: [],
+ });
-// 浣跨敤 ref 澹版槑琛ㄥ崟鏁版嵁
-const form = ref({
- maintenanceName: userStore.nickName || '', // 榛樿浣跨敤褰撳墠鐢ㄦ埛鏄电О
- maintenanceResult: undefined, // 缁翠慨缁撴灉
- maintenanceTime: dayjs().format("YYYY-MM-DD"), // 缁翠慨鏃ユ湡锛堝彧鏄剧ず鏃ユ湡锛�
-});
+ // 鑷畾涔塻howToast鍑芥暟
+ const showToast = message => {
+ uni.showToast({
+ title: message,
+ icon: "none",
+ });
+ };
-// 娓呴櫎琛ㄥ崟鏍￠獙鐘舵��
-const clearValidate = () => {
- // Vant4涓笉闇�瑕佹墜鍔ㄦ竻闄ら獙璇佺姸鎬侊紝閲嶇疆琛ㄥ崟鏃朵細鑷姩娓呴櫎
- // formRef.value?.clearValidate(); // 鍒犻櫎杩欒
-};
+ // 閲嶇疆琛ㄥ崟鏁版嵁鍜屾牎楠岀姸鎬�
+ const resetForm = () => {
+ form.value = {
+ 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 resetForm = () => {
- form.value = {
- maintenanceName: userStore.nickName || '',
- maintenanceResult: undefined,
- maintenanceTime: dayjs().format("YYYY-MM-DD"),
- };
-};
+ const resetFormAndValidate = () => {
+ resetForm();
+ };
-const resetFormAndValidate = () => {
- resetForm();
- // clearValidate(); // 鍒犻櫎杩欒锛孷ant4浼氳嚜鍔ㄥ鐞�
-};
+ // 鎻愪氦琛ㄥ崟
+ const submitForm = async () => {
+ try {
+ // 浣跨敤uview-plus鐨勮〃鍗曢獙璇佹柟寮�
+ const valid = await formRef.value.validate();
+ if (valid) {
+ submitFormData();
+ }
+ } catch (e) {
+ showToast("琛ㄥ崟楠岃瘉澶辫触");
+ }
+ };
-// 鎻愪氦琛ㄥ崟
-const sendForm = async () => {
- try {
- // 浣跨敤Vant4鐨勬纭獙璇佹柟寮�
- formRef.value?.validate().then(() => {
- // 楠岃瘉閫氳繃
- submitFormData();
- }).catch((errors) => {
- // 楠岃瘉澶辫触
- showToast('璇峰～鍐欏畬鏁翠俊鎭�');
- });
- } catch (e) {
- showToast('琛ㄥ崟楠岃瘉澶辫触');
- }
-};
+ // 鎻愪氦琛ㄥ崟鏁版嵁
+ const submitFormData = async () => {
+ try {
+ loading.value = true;
+ const id = getPageId();
-// 鎻愪氦琛ㄥ崟鏁版嵁
-const submitFormData = async () => {
- try {
- loading.value = true;
- const id = getPageId();
-
- if (!id) {
- showToast('鍙傛暟閿欒');
- loading.value = false;
- return;
- }
-
- // 鍑嗗鎻愪氦鏁版嵁锛宮aintenanceTime 鍔犱笂褰撳墠鏃跺垎绉�
- const submitData = { ...form.value };
- if (submitData.maintenanceTime && !submitData.maintenanceTime.includes(':')) {
- // 濡傛灉 maintenanceTime 鍙寘鍚棩鏈燂紝娣诲姞褰撳墠鏃跺垎绉�
- submitData.maintenanceTime = submitData.maintenanceTime + ' ' + dayjs().format('HH:mm:ss');
- }
-
- const { code } = await addMaintain({ id: id, ...submitData });
-
- if (code == 200) {
- showToast('鏂板缁翠慨鎴愬姛');
- resetFormAndValidate();
- setTimeout(() => {
- uni.navigateBack();
- }, 1500);
- } else {
- loading.value = false;
- }
- } catch (e) {
- loading.value = false;
- showToast('鎿嶄綔澶辫触');
- }
-};
+ if (!id) {
+ showToast("鍙傛暟閿欒");
+ loading.value = false;
+ return;
+ }
+ form.value.status = Number(form.value.status);
+ // 棰嗙敤鏁伴噺鏍￠獙
+ 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 goBack = () => {
- uni.navigateBack();
-};
+ 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,
+ }))
+ : [],
+ };
-// 鑾峰彇椤甸潰ID
-const getPageId = () => {
- const pages = getCurrentPages();
- const currentPage = pages[pages.length - 1];
- const options = currentPage.options;
- return options.id;
-};
+ const { code } = await addMaintain({ id: id, ...submitData });
-// 鏄剧ず鏃ユ湡閫夋嫨鍣�
-const showDatePicker = () => {
- showDate.value = true;
-};
+ if (code == 200) {
+ showToast("鏂板缁翠慨鎴愬姛");
+ resetFormAndValidate();
+ setTimeout(() => {
+ goBack();
+ }, 500);
+ } else {
+ loading.value = false;
+ }
+ } catch (e) {
+ console.log(e);
-// 纭鏃ユ湡閫夋嫨
-const onDateConfirm = ({ selectedValues }) => {
- // 鍙繚瀛樺勾鏈堟棩锛屼笉鍖呭惈鏃跺垎绉�
- form.value.maintenanceTime = selectedValues.join('-');
- currentDate.value = selectedValues;
- showDate.value = false;
-};
+ loading.value = false;
+ showToast("鎿嶄綔澶辫触");
+ }
+ };
-// 鍒濆鍖栬〃鍗曟暟鎹�
-const initForm = () => {
- // 璁剧疆缁翠慨浜轰负褰撳墠鐢ㄦ埛鏄电О
- form.value.maintenanceName = userStore.nickName || '';
- // 璁剧疆褰撳墠鏃ユ湡锛堝彧鍖呭惈骞存湀鏃ワ級
- form.value.maintenanceTime = dayjs().format('YYYY-MM-DD');
- currentDate.value = [new Date().getFullYear(), new Date().getMonth() + 1, new Date().getDate()];
-};
+ // 杩斿洖涓婁竴椤�
+ const goBack = () => {
+ uni.removeStorageSync("repairId");
+ uni.navigateBack();
+ };
-onShow(() => {
- // 椤甸潰鏄剧ず鏃跺垵濮嬪寲琛ㄥ崟
- initForm();
-});
+ // 鑾峰彇椤甸潰ID
+ const getPageId = () => {
+ const id = uni.getStorageSync("repairId");
+ return id;
+ };
-onMounted(() => {
- // 椤甸潰鍔犺浇鏃跺垵濮嬪寲琛ㄥ崟
- initForm();
-});
+ // 纭鏃ユ湡閫夋嫨
+ const onDateConfirm = e => {
+ form.value.maintenanceTime = dayjs(e.value).format("YYYY-MM-DD HH:mm:ss");
+ pickerDateValue.value = e.value;
+ 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 = 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(() => {
+ // 椤甸潰鏄剧ず鏃跺垵濮嬪寲琛ㄥ崟
+ initForm();
+ });
+
+ onMounted(() => {
+ // 椤甸潰鍔犺浇鏃跺垵濮嬪寲琛ㄥ崟
+ 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">
-.repair-maintain {
- min-height: 100vh;
- background: #f8f9fa;
- padding-bottom: 5rem;
-}
+ @import "@/static/scss/form-common.scss";
+ .repair-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;
-}
+ .spare-parts-container {
+ width: 100%;
+ min-height: 72rpx;
+ display: flex;
+ align-items: center;
+ flex-wrap: wrap;
+ gap: 12rpx;
+ }
-.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;
-}
+ .spare-parts-list {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 12rpx;
+ }
-.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;
-}
+ .spare-part-tag {
+ display: inline-flex;
+ align-items: center;
+ gap: 8rpx;
+ padding: 10rpx 14rpx;
+ background: #2c7be5;
+ border-radius: 999rpx;
+ color: #fff;
+ font-size: 24rpx;
+ }
-// 鍝嶅簲寮忚皟鏁�
-@media (max-width: 768px) {
- .submit-section {
- padding: 12px;
- }
-}
+ .placeholder {
+ color: #c0c4cc;
+ font-size: 28rpx;
+ }
-.tip-text {
- padding: 4px 16px 0 16px;
- font-size: 12px;
- color: #888;
-}
+ .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;
+ 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;
+ }
+
+ .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;
+ }
+ }
+
+ .tip-text {
+ padding: 4px 16px 0 16px;
+ font-size: 12px;
+ color: #888;
+ }
</style>
\ No newline at end of file
--
Gitblit v1.9.3