From 025e46e11cb2962fd7692adfa401333758cc779b Mon Sep 17 00:00:00 2001 From: gaoluyang <2820782392@qq.com> Date: 星期二, 02 九月 2025 14:00:34 +0800 Subject: [PATCH] 修改组件 --- src/pages/equipmentManagement/repair/maintain.vue | 134 +++++++++++++++++++++----------------------- 1 files changed, 65 insertions(+), 69 deletions(-) diff --git a/src/pages/equipmentManagement/repair/maintain.vue b/src/pages/equipmentManagement/repair/maintain.vue index 64d08cb..12a39b7 100644 --- a/src/pages/equipmentManagement/repair/maintain.vue +++ b/src/pages/equipmentManagement/repair/maintain.vue @@ -4,57 +4,56 @@ <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"> + <u-form ref="formRef" :model="form" :rules="formRules" label-width="140rpx"> <!-- 鍩烘湰淇℃伅 --> - <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> + <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="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-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> + <u-button class="cancel-btn" @click="goBack">鍙栨秷</u-button> + <u-button class="save-btn" @click="submitForm" :loading="loading">淇濆瓨</u-button> </view> - </van-form> + </u-form> <!-- 鏃ユ湡閫夋嫨鍣� --> - <van-popup v-model:show="showDate" position="bottom"> - <van-date-picker - v-model="currentDate" - title="閫夋嫨鏃ユ湡" - @confirm="onDateConfirm" - @cancel="showDate = false" - /> - </van-popup> + <up-datetime-picker + :show="showDatePicker" + v-model="pickerDateValue" + mode="date" + title="閫夋嫨鏃ユ湡" + @confirm="onDateConfirm" + /> </view> </template> @@ -65,7 +64,7 @@ import { addMaintain } from '@/api/equipmentManagement/repair'; import useUserStore from "@/store/modules/user"; import dayjs from "dayjs"; -import { showToast } from 'vant'; +import { formatDateToYMD } from '@/utils/ruoyi' defineOptions({ name: "璁惧缁翠慨琛ㄥ崟", @@ -76,8 +75,8 @@ // 琛ㄥ崟寮曠敤 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 showDatePicker = ref(false); +const pickerDateValue = ref(Date.now());; // 浣跨敤鏃堕棿鎴� // 琛ㄥ崟楠岃瘉瑙勫垯 const formRules = { @@ -93,10 +92,17 @@ maintenanceTime: dayjs().format("YYYY-MM-DD"), // 缁翠慨鏃ユ湡锛堝彧鏄剧ず鏃ユ湡锛� }); +// 鑷畾涔塻howToast鍑芥暟 +const showToast = (message) => { + uni.showToast({ + title: message, + icon: 'none' + }) +}; + // 娓呴櫎琛ㄥ崟鏍¢獙鐘舵�� const clearValidate = () => { - // Vant4涓笉闇�瑕佹墜鍔ㄦ竻闄ら獙璇佺姸鎬侊紝閲嶇疆琛ㄥ崟鏃朵細鑷姩娓呴櫎 - // formRef.value?.clearValidate(); // 鍒犻櫎杩欒 + // uview-plus涓嶉渶瑕佹墜鍔ㄦ竻闄ら獙璇佺姸鎬侊紝閲嶇疆琛ㄥ崟鏃朵細鑷姩娓呴櫎 }; // 閲嶇疆琛ㄥ崟鏁版嵁鍜屾牎楠岀姸鎬� @@ -110,20 +116,16 @@ const resetFormAndValidate = () => { resetForm(); - // clearValidate(); // 鍒犻櫎杩欒锛孷ant4浼氳嚜鍔ㄥ鐞� }; // 鎻愪氦琛ㄥ崟 -const sendForm = async () => { +const submitForm = async () => { try { - // 浣跨敤Vant4鐨勬纭獙璇佹柟寮� - formRef.value?.validate().then(() => { - // 楠岃瘉閫氳繃 + // 浣跨敤uview-plus鐨勮〃鍗曢獙璇佹柟寮� + const valid = await formRef.value.validate(); + if (valid) { submitFormData(); - }).catch((errors) => { - // 楠岃瘉澶辫触 - showToast('璇峰~鍐欏畬鏁翠俊鎭�'); - }); + } } catch (e) { showToast('琛ㄥ崟楠岃瘉澶辫触'); } @@ -178,17 +180,11 @@ return options.id; }; -// 鏄剧ず鏃ユ湡閫夋嫨鍣� -const showDatePicker = () => { - showDate.value = true; -}; - // 纭鏃ユ湡閫夋嫨 -const onDateConfirm = ({ selectedValues }) => { - // 鍙繚瀛樺勾鏈堟棩锛屼笉鍖呭惈鏃跺垎绉� - form.value.maintenanceTime = selectedValues.join('-'); - currentDate.value = selectedValues; - showDate.value = false; +const onDateConfirm = (e) => { + form.value.maintenanceTime = formatDateToYMD(e.value) + pickerDateValue.value = formatDateToYMD(e.value) + showDatePicker.value = false; }; // 鍒濆鍖栬〃鍗曟暟鎹� @@ -197,7 +193,6 @@ 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()]; }; onShow(() => { @@ -212,6 +207,7 @@ </script> <style scoped lang="scss"> +@import '@/static/scss/form-common.scss'; .repair-maintain { min-height: 100vh; background: #f8f9fa; -- Gitblit v1.9.3