From ee42bf1badae06026efa79dc17d2a541297ab49b Mon Sep 17 00:00:00 2001 From: gaoluyang <2820782392@qq.com> Date: 星期三, 03 九月 2025 17:43:31 +0800 Subject: [PATCH] 采购管理整体样式优化,搜索条件修改 --- src/pages/equipmentManagement/repair/add.vue | 138 ++++++++++++++++++++++++---------------------- 1 files changed, 72 insertions(+), 66 deletions(-) diff --git a/src/pages/equipmentManagement/repair/add.vue b/src/pages/equipmentManagement/repair/add.vue index e9a9dfb..ec0147f 100644 --- a/src/pages/equipmentManagement/repair/add.vue +++ b/src/pages/equipmentManagement/repair/add.vue @@ -4,31 +4,28 @@ <PageHeader :title="operationType === 'edit' ? '缂栬緫鎶ヤ慨' : '鏂板鎶ヤ慨'" @back="goBack" /> <!-- 琛ㄥ崟鍐呭 --> - <u-form @submit="sendForm" ref="formRef" label-width="110" input-align="right" error-message-align="right"> + <u-form @submit="sendForm" ref="formRef" :rules="formRules" :model="form" label-width="110"> <!-- 鍩烘湰淇℃伅 --> <u-cell-group title="鍩烘湰淇℃伅"> - <u-form-item label="璁惧鍚嶇О" prop="deviceLedgerId" required> + <u-form-item label="璁惧鍚嶇О" prop="deviceLedgerId" required border-bottom> <u-input v-model="deviceNameText" placeholder="璇烽�夋嫨璁惧鍚嶇О" - readonly @click="showDevicePicker" clearable - > - <template #suffix> - <u-icon name="scan" @click.stop="startScan" class="scan-icon" /> - </template> - </u-input> + /> + <template #right> + <u-icon name="scan" @click="startScan" class="scan-icon" /> + </template> </u-form-item> - <u-form-item label="瑙勬牸鍨嬪彿"> + <u-form-item label="瑙勬牸鍨嬪彿" prop="deviceModel" border-bottom> <u-input v-model="form.deviceModel" placeholder="璇疯緭鍏ヨ鏍煎瀷鍙�" - readonly clearable /> </u-form-item> - <u-form-item label="鎶ヤ慨鏃ユ湡" prop="repairTime" required> + <u-form-item label="鎶ヤ慨鏃ユ湡" prop="repairTime" required border-bottom> <u-input v-model="form.repairTime" placeholder="璇烽�夋嫨鎶ヤ慨鏃ユ湡" @@ -36,21 +33,25 @@ @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> + <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> + <u-form-item label="鏁呴殰鐜拌薄" prop="remark" required border-bottom> <u-textarea v-model="form.remark" + rows="3" placeholder="璇疯緭鍏ユ晠闅滅幇璞�" - :maxlength="200" + clearable count - :autoHeight="true" + maxlength="200" /> </u-form-item> </u-cell-group> @@ -63,24 +64,22 @@ </u-form> <!-- 璁惧閫夋嫨鍣� --> - <u-popup v-model="showDevice" mode="bottom"> - <u-picker - v-model="devicePickerValue" - :columns="deviceColumns" - @confirm="onDeviceConfirm" - @cancel="showDevice = false" - /> - </u-popup> + <up-action-sheet + :show="showDevice" + :actions="deviceActionList" + title="閫夋嫨璁惧鍚嶇О" + @select="onDeviceSelect" + @close="showDevice = false" + /> <!-- 鏃ユ湡閫夋嫨鍣� --> - <u-popup v-model="showDate" mode="bottom"> - <u-datetime-picker - v-model="currentDate" - title="閫夋嫨鏃ユ湡" - @confirm="onDateConfirm" - @cancel="showDate = false" - /> - </u-popup> + <up-datetime-picker + :show="showDate" + v-model="pickerDateValue" + @confirm="onDateConfirm" + @cancel="showDate = false" + mode="date" + /> </view> </template> @@ -91,15 +90,12 @@ import { getDeviceLedger } from '@/api/equipmentManagement/ledger'; import { addRepair, editRepair, getRepairById } from '@/api/equipmentManagement/repair'; import dayjs from "dayjs"; -// 鏇挎崲 Vant 鐨� toast -// import { showToast } from 'vant'; - -// 鏇挎崲 toast 鏂规硶 +import { formatDateToYMD } from '@/utils/ruoyi'; const showToast = (message) => { - uni.showToast({ - title: message, - icon: 'none' - }) + uni.showToast({ + title: message, + icon: 'none' + }) } defineOptions({ @@ -111,13 +107,18 @@ const operationType = ref('add'); const loading = ref(false); const showDevice = ref(false); -const devicePickerValue = ref([]); const showDate = ref(false); -const currentDate = ref([new Date().getFullYear(), new Date().getMonth() + 1, new Date().getDate()]); +const pickerDateValue = ref(Date.now()); // 璁惧閫夐」 const deviceOptions = ref([]); const deviceNameText = ref(''); +const deviceActionList = computed(() => { + return deviceOptions.value.map(item => ({ + name: item.deviceName, + value: item.id + })); +}); // 鎵爜鐩稿叧鐘舵�� const isScanning = ref(false); @@ -138,14 +139,6 @@ repairTime: dayjs().format("YYYY-MM-DD"), // 鎶ヤ慨鏃ユ湡 repairName: undefined, // 鎶ヤ慨浜� remark: undefined, // 鏁呴殰鐜拌薄 -}); - -// 璁惧閫夋嫨鍣ㄥ垪 -const deviceColumns = computed(() => { - return deviceOptions.value.map(item => ({ - text: item.deviceName, - value: item.id - })); }); // 鍔犺浇璁惧鍒楄〃 @@ -209,11 +202,6 @@ remark: undefined, }; deviceNameText.value = ''; -}; - -const resetFormAndValidate = () => { - resetForm(); - clearValidate(); }; // 鎵弿浜岀淮鐮佸姛鑳� @@ -281,11 +269,10 @@ }; // 纭璁惧閫夋嫨 -const onDeviceConfirm = ({ selectedValues, selectedOptions }) => { - form.value.deviceLedgerId = selectedOptions[0].value; - devicePickerValue.value = selectedValues; +const onDeviceSelect = (e) => { + form.value.deviceLedgerId = e.value; + setDeviceModel(e.value); showDevice.value = false; - setDeviceModel(selectedOptions[0].value); }; // 鏄剧ず鏃ユ湡閫夋嫨鍣� @@ -294,9 +281,8 @@ }; // 纭鏃ユ湡閫夋嫨 -const onDateConfirm = ({ selectedValues }) => { - form.value.repairTime = selectedValues.join('-'); - currentDate.value = selectedValues; +const onDateConfirm = (e) => { + form.value.repairTime = formatDateToYMD(e.value); showDate.value = false; }; @@ -322,18 +308,37 @@ const sendForm = async () => { try { // 鎵嬪姩楠岃瘉琛ㄥ崟 - await formRef.value?.validate(); - + 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 { code } = id ? await editRepair({ id: id, ...submitData }) : await addRepair(submitData); - + if (code == 200) { showToast(`${id ? "缂栬緫" : "鏂板"}鎶ヤ慨鎴愬姛`); setTimeout(() => { @@ -379,6 +384,7 @@ </script> <style scoped lang="scss"> +@import '@/static/scss/form-common.scss'; .repair-add { min-height: 100vh; background: #f8f9fa; -- Gitblit v1.9.3