From 77861fcc5ee1c4f8e7c6412b373cb438c7313930 Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期三, 03 九月 2025 10:06:26 +0800
Subject: [PATCH] 头部样式修改、适配不同机型

---
 src/pages/equipmentManagement/ledger/detail.vue |  397 +++++++++++++++++++++++++++++++++++--------------------
 1 files changed, 251 insertions(+), 146 deletions(-)

diff --git a/src/pages/equipmentManagement/ledger/detail.vue b/src/pages/equipmentManagement/ledger/detail.vue
index 9757730..2c798e6 100644
--- a/src/pages/equipmentManagement/ledger/detail.vue
+++ b/src/pages/equipmentManagement/ledger/detail.vue
@@ -1,10 +1,10 @@
 <template>
-	<view class="equipment-detail">
+	<view class="account-detail">
 		<!-- 浣跨敤閫氱敤椤甸潰澶撮儴缁勪欢 -->
 		<PageHeader title="璁惧鍙拌处璇︽儏" @back="goBack" />
 		
 		<!-- 琛ㄥ崟鍐呭 -->
-		<u-form @submit="sendForm" ref="formRef" label-width="110" input-align="right" error-message-align="right">
+		<u-form @submit="sendForm" ref="formRef" :model="form" :rules="formRules" label-width="110">
 			<!-- 鍩烘湰淇℃伅 -->
 			<u-cell-group title="鍩烘湰淇℃伅">
 				<u-form-item label="璁惧鍚嶇О" prop="deviceName" required border-bottom>
@@ -17,115 +17,133 @@
 				<u-form-item label="瑙勬牸鍨嬪彿" prop="deviceModel" required border-bottom>
 					<u-input
 						v-model="form.deviceModel"
+						:disabled="(form.deviceModel != null && operationType === 'edit')"
 						placeholder="璇疯緭鍏ヨ鏍煎瀷鍙�"
 						clearable
 					/>
 				</u-form-item>
-				<u-form-item label="璁惧缂栧彿" prop="deviceNumber" required border-bottom>
+				<!-- <u-form-item label="璁惧鍝佺墝" prop="deviceBrand" required border-bottom>
 					<u-input
-						v-model="form.deviceNumber"
-						placeholder="璇疯緭鍏ヨ澶囩紪鍙�"
+						v-model="form.deviceBrand"
+						placeholder="璇疯緭鍏ヨ澶囧搧鐗�"
 						clearable
 					/>
-				</u-form-item>
-				<u-form-item label="璐拱鏃ユ湡" prop="purchaseDate" required border-bottom>
+				</u-form-item> -->
+				<u-form-item label="渚涘簲鍟�" prop="supplierName" required border-bottom>
 					<u-input
-						v-model="form.purchaseDate"
-						placeholder="璇烽�夋嫨璐拱鏃ユ湡"
-						readonly
-						@click="showDatePicker"
-						clearable
-					/>
-				</u-form-item>
-				<u-form-item label="璐拱浠锋牸" prop="purchasePrice" required border-bottom>
-					<u-input
-						v-model="form.purchasePrice"
-						type="number"
-						placeholder="璇疯緭鍏ヨ喘涔颁环鏍�"
-						clearable
-					/>
-				</u-form-item>
-				<u-form-item label="渚涘簲鍟�" prop="supplier" required border-bottom>
-					<u-input
-						v-model="form.supplier"
+						v-model="form.supplierName"
 						placeholder="璇疯緭鍏ヤ緵搴斿晢"
 						clearable
 					/>
 				</u-form-item>
-				<u-form-item label="浣跨敤閮ㄩ棬" prop="department" required border-bottom>
+				<!-- <u-form-item label="瀛樻斁浣嶇疆" prop="storageLocation" required border-bottom>
 					<u-input
-						v-model="form.department"
-						placeholder="璇疯緭鍏ヤ娇鐢ㄩ儴闂�"
+						v-model="form.storageLocation"
+						placeholder="璇疯緭鍏ュ瓨鏀句綅缃�"
+						clearable
+					/>
+				</u-form-item> -->
+				<u-form-item label="鍗曚綅" prop="unit" required border-bottom>
+					<u-input
+						v-model="form.unit"
+						placeholder="璇疯緭鍏ュ崟浣�"
 						clearable
 					/>
 				</u-form-item>
-				<u-form-item label="绋庣巼" prop="taxRate" required border-bottom>
+				<!-- <u-form-item label="鍚敤鎶樻棫" prop="enableDepreciation" required border-bottom>
+					<u-switch
+						v-model="form.enableDepreciation"
+						:active-value="true"
+						:inactive-value="false"
+					/>
+				</u-form-item> -->
+				<u-form-item label="鏁伴噺" prop="number" required border-bottom>
+					<u-input
+						v-model="form.number"
+						type="number"
+						placeholder="璇疯緭鍏ユ暟閲�"
+						clearable
+						@blur="mathNum"
+					/>
+				</u-form-item>
+				<u-form-item label="鍚◣鍗曚环" prop="taxIncludingPriceUnit" required border-bottom>
+					<u-input
+						v-model="form.taxIncludingPriceUnit"
+						type="number"
+						placeholder="璇疯緭鍏ュ惈绋庡崟浠�"
+						clearable
+						@blur="mathNum"
+					/>
+				</u-form-item>
+				<u-form-item label="鍚◣鎬讳环" prop="taxIncludingPriceTotal" required border-bottom>
+					<u-input
+						v-model="form.taxIncludingPriceTotal"
+						type="number"
+						placeholder="鑷姩鐢熸垚"
+						disabled
+					/>
+				</u-form-item>
+				<u-form-item label="绋庣巼(%)" prop="taxRate" required border-bottom>
 					<u-input
 						v-model="form.taxRate"
 						placeholder="璇烽�夋嫨绋庣巼"
 						readonly
-						@click="showTaxRatePicker"
-						clearable
+						@click="showTaxRatePicker = true"
+					/>
+					<template #right>
+						<u-icon name="arrow-right" @click="showTaxRatePicker = true"></u-icon>
+					</template>
+					<up-action-sheet
+						:show="showTaxRatePicker"
+						:actions="taxRateActionList"
+						title="閫夋嫨绋庣巼"
+						@select="onTaxRateSelect"
+						@close="showTaxRatePicker = false"
 					/>
 				</u-form-item>
-				<u-form-item label="浣跨敤鐘舵��" prop="status" required border-bottom>
+				<u-form-item label="涓嶅惈绋庢�讳环" prop="unTaxIncludingPriceTotal" required border-bottom>
 					<u-input
-						v-model="form.status"
-						placeholder="璇疯緭鍏ヤ娇鐢ㄧ姸鎬�"
-						clearable
+						v-model="form.unTaxIncludingPriceTotal"
+						type="number"
+						placeholder="鑷姩鐢熸垚"
+						disabled
 					/>
 				</u-form-item>
-				<u-form-item label="澶囨敞" border-bottom>
-					<u-textarea
-						v-model="form.remark"
-						placeholder="璇疯緭鍏ュ娉�"
-						:maxlength="200"
-						count
-						:autoHeight="true"
+				<u-form-item label="褰曞叆鏃ユ湡" prop="createTime" required border-bottom>
+					<u-input
+						v-model="form.createTime"
+						placeholder="璇烽�夋嫨褰曞叆鏃ユ湡"
+						readonly
+						@click="showDatePicker"
+						clearable
 					/>
+					<template #right>
+						<u-icon name="arrow-right" @click="showDatePicker"></u-icon>
+					</template>
 				</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>
+		
+		<!-- 鎻愪氦鎸夐挳 -->
+		<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>
 
-		<!-- 绋庣巼閫夋嫨鍣� -->
-		<u-popup v-model="showTaxRate" mode="bottom">
-			<u-picker
-				v-model="taxRatePickerValue"
-				:columns="taxRateOptions"
-				@confirm="onTaxRateConfirm"
-				@cancel="showTaxRate = false"
-			/>
-		</u-popup>
-
-		<!-- 鏃ユ湡閫夋嫨鍣� -->
-		<u-popup v-model="showDate" mode="bottom">
-			<u-datetime-picker
-				v-model="currentDate"
-				title="閫夋嫨鏃ユ湡"
+	<!-- 鏃ユ湡閫夋嫨鍣� -->
+<up-datetime-picker
+				:show="showDate"
+				v-model="pickerDateValue"
 				@confirm="onDateConfirm"
 				@cancel="showDate = false"
+				mode="date"
 			/>
-		</u-popup>
-	</view>
+</view>
 </template>
 
 <script setup>
 // 鏇挎崲 Vant 鐨� toast
 // import { showToast } from 'vant';
-
-// 鏇挎崲 toast 鏂规硶
-const showToast = (message) => {
-  uni.showToast({
-    title: message,
-    icon: 'none'
-  })
-}
 
 import { ref, computed, onMounted } from 'vue';
 import { onShow } from '@dcloudio/uni-app';
@@ -136,7 +154,12 @@
 	calculateTaxIncludeTotalPrice,
 	calculateTaxExclusiveTotalPrice,
 } from "@/utils/summarizeTable";
-import { showToast } from 'vant';
+const showToast = (message) => {
+	uni.showToast({
+		title: message,
+		icon: 'none'
+	})
+}
 
 defineOptions({
 	name: "璁惧鍙拌处琛ㄥ崟",
@@ -146,28 +169,75 @@
 const formRef = ref(null);
 const operationType = ref('');
 const loading = ref(false);
-const showTaxRate = ref(false);
-const taxRatePickerValue = ref([]);
 const showDate = ref(false);
-const currentDate = ref([new Date().getFullYear(), new Date().getMonth() + 1, new Date().getDate()]);
+const pickerDateValue = ref(Date.now());
+const showTaxRatePicker = ref(false);
+const taxRateActionList = ref([
+  { name: '1', value: 1 },
+  { name: '6', value: 6 },
+  { name: '13', value: 13 }
+]);
 
 // 琛ㄥ崟楠岃瘉瑙勫垯
 const formRules = {
 	deviceName: [{ required: true, trigger: "blur", message: "璇疯緭鍏�" }],
 	deviceModel: [{ required: true, trigger: "blur", message: "璇疯緭鍏�" }],
+	deviceBrand: [{ required: true, trigger: "blur", message: "璇疯緭鍏�" }],
 	supplierName: [{ required: true, trigger: "blur", message: "璇疯緭鍏�" }],
+	storageLocation: [{ required: true, trigger: "blur", message: "璇疯緭鍏�" }],
 	unit: [{ required: true, trigger: "blur", message: "璇疯緭鍏�" }],
-	number: [{ required: true, trigger: "blur", message: "璇疯緭鍏�" }],
-	taxIncludingPriceUnit: [{ required: true, trigger: "blur", message: "璇疯緭鍏�" }],
-	taxRate: [{ required: true, trigger: "change", message: "璇疯緭鍏�" }],
+	// 鏁板瓧绫诲瀷瀛楁闇�瑕佺壒娈婂鐞嗭紝纭繚鏈夋暟鍊兼椂涓嶄細瑙﹀彂蹇呭～鏍￠獙
+	number: [{
+		required: true,
+		trigger: "blur",
+		message: "璇疯緭鍏�",
+		validator: (rule, value, callback) => {
+			// 瀵逛簬鏁板瓧绫诲瀷锛屾鏌ユ槸鍚︿负鏈夋晥鏁板瓧锛堝寘鎷�0锛�
+			if (value !== undefined && value !== null && value !== '' && !isNaN(value)) {
+				callback();
+			} else {
+				callback(new Error('璇疯緭鍏ユ暟閲�'));
+			}
+		}
+	}],
+	taxIncludingPriceUnit: [{
+		required: true,
+		trigger: "blur",
+		message: "璇疯緭鍏�",
+		validator: (rule, value, callback) => {
+			// 瀵逛簬鏁板瓧绫诲瀷锛屾鏌ユ槸鍚︿负鏈夋晥鏁板瓧锛堝寘鎷�0锛�
+			if (value !== undefined && value !== null && value !== '' && !isNaN(value)) {
+				callback();
+			} else {
+				callback(new Error('璇疯緭鍏ュ惈绋庡崟浠�'));
+			}
+		}
+	}],
+	taxRate: [{
+		required: true,
+		trigger: "change",
+		message: "璇烽�夋嫨",
+		validator: (rule, value, callback) => {
+			// 妫�鏌ョ◣鐜囨槸鍚︿负鏈夋晥鏁板瓧
+			if (value !== undefined && value !== null && value !== '' && !isNaN(value)) {
+				callback();
+			} else {
+				callback(new Error('璇烽�夋嫨绋庣巼'));
+			}
+		}
+	}],
+	createTime: [{ required: true, trigger: "change", message: "璇烽�夋嫨" }],
 };
 
 // 浣跨敤 ref 澹版槑琛ㄥ崟鏁版嵁
 const form = ref({
 	deviceName: undefined, // 璁惧鍚嶇О
 	deviceModel: undefined, // 瑙勬牸鍨嬪彿
+	deviceBrand: undefined, // 璁惧鍝佺墝
 	supplierName: undefined, // 渚涘簲鍟�
+	storageLocation: undefined, // 瀛樻斁浣嶇疆
 	unit: undefined, // 鍗曚綅
+	enableDepreciation: false, // 鍚敤鎶樻棫
 	number: undefined, // 鏁伴噺
 	taxIncludingPriceUnit: undefined, // 鍚◣鍗曚环
 	taxIncludingPriceTotal: undefined, // 鍚◣鎬讳环
@@ -176,14 +246,7 @@
 	createTime: dayjs().format("YYYY-MM-DD"), // 褰曞叆鏃ユ湡
 });
 
-// 绋庣巼閫夐」
-const taxRateOptions = computed(() => {
-	return [
-		{ text: '1', value: 1 },
-		{ text: '6', value: 6 },
-		{ text: '13', value: 13 }
-	]
-});
+
 
 // 鍔犺浇琛ㄥ崟鏁版嵁
 const loadForm = async (id) => {
@@ -192,17 +255,27 @@
 	}
 	try {
 		const { code, data } = await getLedgerById(id);
+		console.log(data);
+		
 		if (code == 200) {
 			form.value.deviceName = data.deviceName;
 			form.value.deviceModel = data.deviceModel;
+			form.value.deviceBrand = data.deviceBrand || '';
 			form.value.supplierName = data.supplierName;
+			form.value.storageLocation = data.storageLocation || '';
 			form.value.unit = data.unit;
+			form.value.enableDepreciation = !!data.enableDepreciation;
 			form.value.number = data.number;
 			form.value.taxIncludingPriceUnit = data.taxIncludingPriceUnit;
 			form.value.taxIncludingPriceTotal = data.taxIncludingPriceTotal;
 			form.value.taxRate = data.taxRate;
 			form.value.unTaxIncludingPriceTotal = data.unTaxIncludingPriceTotal;
 			form.value.createTime = data.createTime;
+			
+			// 鏁版嵁鍔犺浇瀹屾垚鍚庯紝閲嶇疆琛ㄥ崟楠岃瘉鐘舵��
+			setTimeout(() => {
+				clearValidate();
+			}, 100);
 		}
 	} catch (e) {
 		showToast('鑾峰彇璇︽儏澶辫触');
@@ -211,11 +284,12 @@
 
 // 鏁板璁＄畻
 const mathNum = () => {
-	if (!form.value.taxIncludingPriceUnit) {
+	// 鍙湁鍦ㄦ柊澧炴ā寮忔垨鑰呭瓧娈电‘瀹炰负绌烘椂鎵嶆樉绀烘彁绀�
+	if (operationType.value !== 'edit' || (form.value.taxIncludingPriceUnit === undefined || form.value.taxIncludingPriceUnit === '')) {
 		showToast("璇疯緭鍏ュ崟浠�");
 		return;
 	}
-	if (!form.value.number) {
+	if (operationType.value !== 'edit' || (form.value.number === undefined || form.value.number === '')) {
 		showToast("璇疯緭鍏ユ暟閲�");
 		return;
 	}
@@ -236,44 +310,65 @@
 	formRef.value?.clearValidate();
 };
 
-// 閲嶇疆琛ㄥ崟鏁版嵁鍜屾牎楠岀姸鎬�
-const resetForm = () => {
-	form.value = {
-		deviceName: undefined,
-		deviceModel: undefined,
-		supplierName: undefined,
-		unit: undefined,
-		number: undefined,
-		taxIncludingPriceUnit: undefined,
-		taxIncludingPriceTotal: undefined,
-		taxRate: undefined,
-		unTaxIncludingPriceTotal: undefined,
-		createTime: dayjs().format("YYYY-MM-DD HH:mm:ss"),
-	};
-};
-
-const resetFormAndValidate = () => {
-	resetForm();
-	clearValidate();
-};
-
 // 鎻愪氦琛ㄥ崟
 const sendForm = async () => {
 	try {
-		// 鎵嬪姩楠岃瘉琛ㄥ崟
-		await formRef.value?.validate();
+		// 妫�鏌ュ繀濉瓧娈�
+		let isValid = true;
+		let errorMessage = '';
+		
+		// 妫�鏌ユ枃鏈被鍨嬪繀濉瓧娈�
+		if (!form.value.deviceName || form.value.deviceName.trim() === '') {
+			isValid = false;
+			errorMessage = '璇疯緭鍏ヨ澶囧悕绉�';
+		} else if (!form.value.deviceModel || form.value.deviceModel.trim() === '') {
+			isValid = false;
+			errorMessage = '璇疯緭鍏ヨ鏍煎瀷鍙�';
+		} else if (!form.value.deviceBrand || form.value.deviceBrand.trim() === '') {
+			isValid = false;
+			errorMessage = '璇疯緭鍏ヨ澶囧搧鐗�';
+		} else if (!form.value.supplierName || form.value.supplierName.trim() === '') {
+			isValid = false;
+			errorMessage = '璇疯緭鍏ヤ緵搴斿晢';
+		} else if (!form.value.storageLocation || form.value.storageLocation.trim() === '') {
+			isValid = false;
+			errorMessage = '璇疯緭鍏ュ瓨鏀句綅缃�';
+		} else if (!form.value.unit || form.value.unit.trim() === '') {
+			isValid = false;
+			errorMessage = '璇疯緭鍏ュ崟浣�';
+		}
+		
+		// 妫�鏌ユ暟瀛楃被鍨嬪繀濉瓧娈�
+		else if (form.value.number === undefined || form.value.number === null || form.value.number === '' || isNaN(form.value.number)) {
+			isValid = false;
+			errorMessage = '璇疯緭鍏ユ暟閲�';
+		} else if (form.value.taxIncludingPriceUnit === undefined || form.value.taxIncludingPriceUnit === null || form.value.taxIncludingPriceUnit === '' || isNaN(form.value.taxIncludingPriceUnit)) {
+			isValid = false;
+			errorMessage = '璇疯緭鍏ュ惈绋庡崟浠�';
+		} else if (form.value.taxRate === undefined || form.value.taxRate === null || form.value.taxRate === '' || isNaN(form.value.taxRate)) {
+			isValid = false;
+			errorMessage = '璇烽�夋嫨绋庣巼';
+		} else if (!form.value.createTime || form.value.createTime.trim() === '') {
+			isValid = false;
+			errorMessage = '璇烽�夋嫨褰曞叆鏃ユ湡';
+		}
+		
+		// 濡傛灉楠岃瘉澶辫触锛屾樉绀洪敊璇彁绀�
+		if (!isValid) {
+			showToast(errorMessage);
+			return;
+		}
+		
+		// 楠岃瘉閫氳繃锛屾樉绀烘彁浜や腑鎻愮ず
+		showToast('姝ｅ湪鎻愪氦琛ㄥ崟...');
 		
 		loading.value = true;
 		const id = getPageId();
 		
 		// 鍑嗗鎻愪氦鏁版嵁锛宑reateTime 鍔犱笂褰撳墠鏃跺垎绉�
 		const submitData = { ...form.value };
-		if (submitData.createTime && !submitData.createTime.includes(':')) {
-			// 濡傛灉 createTime 鍙寘鍚棩鏈燂紝娣诲姞褰撳墠鏃跺垎绉�
-			submitData.createTime = submitData.createTime + ' ' + dayjs().format('HH:mm:ss');
-		}
 		
-		const { code } = id
+		const { code, res } = id
 			? await editLedger({ id: id, ...submitData })
 			: await addLedger(submitData);
 		
@@ -284,51 +379,58 @@
 			}, 1500);
 		} else {
 			loading.value = false;
+			console.log(res);
 		}
 	} catch (e) {
 		loading.value = false;
-		showToast('琛ㄥ崟楠岃瘉澶辫触');
+		showToast('鎻愪氦澶辫触');
 	}
 };
 
 // 杩斿洖涓婁竴椤�
 const goBack = () => {
+	// 浣跨敤鍚庢竻闄torage涓殑ID锛岄伩鍏嶆暟鎹畫鐣�
+			uni.removeStorageSync('ledgerId');
 	uni.navigateBack();
 };
 
 // 鑾峰彇椤甸潰鍙傛暟
 const getPageParams = () => {
-	const pages = getCurrentPages();
-	const currentPage = pages[pages.length - 1];
-	const options = currentPage.options;
-	
-	if (options.id) {
-		// 缂栬緫妯″紡锛岃幏鍙栬鎯�
-		loadForm(options.id);
-	} else {
-		// 鏂板妯″紡
+	try {
+		// 浼樺厛浠巗torage涓幏鍙朓D
+		const ledgerId = uni.getStorageSync('ledgerId');
+		
+		if (ledgerId) {
+			// 缂栬緫妯″紡锛岃幏鍙栬鎯�
+			loadForm(ledgerId);
+		} else {
+			// 鏂板妯″紡
+			operationType.value = 'add';
+		}
+	} catch (e) {
 		operationType.value = 'add';
 	}
 };
 
 // 鑾峰彇椤甸潰ID
 const getPageId = () => {
-	const pages = getCurrentPages();
-	const currentPage = pages[pages.length - 1];
-	const options = currentPage.options;
-	return options.id;
+	try {
+		// 浼樺厛浠巗torage涓幏鍙朓D
+		const ledgerId = uni.getStorageSync('ledgerId');
+		
+		if (ledgerId) {
+			return ledgerId;
+		}
+	} catch (e) {
+		console.error('鑾峰彇椤甸潰ID鍑洪敊:', e);
+	}
+	return null;
 };
 
-// 鏄剧ず绋庣巼閫夋嫨鍣�
-const showTaxRatePicker = () => {
-	showTaxRate.value = true;
-};
-
-// 纭绋庣巼閫夋嫨
-const onTaxRateConfirm = ({ selectedValues, selectedOptions }) => {
-	form.value.taxRate = selectedOptions[0].value;
-	taxRatePickerValue.value = selectedValues;
-	showTaxRate.value = false;
+// 閫夋嫨绋庣巼
+const onTaxRateSelect = (e) => {
+	form.value.taxRate = e.value;
+	showTaxRatePicker.value = false;
 	mathNum(); // 閲嶆柊璁＄畻
 };
 
@@ -338,10 +440,12 @@
 };
 
 // 纭鏃ユ湡閫夋嫨
-const onDateConfirm = ({ selectedValues }) => {
+const onDateConfirm = (e) => {
 	// 鍙繚瀛樺勾鏈堟棩锛屼笉鍖呭惈鏃跺垎绉�
-	form.value.createTime = selectedValues.join('-');
-	currentDate.value = selectedValues;
+	const date = new Date(e.value);
+	form.value.createTime = date.getFullYear() + '-' + 
+		String(date.getMonth() + 1).padStart(2, '0') + '-' + 
+		String(date.getDate()).padStart(2, '0');
 	showDate.value = false;
 };
 
@@ -357,6 +461,7 @@
 </script>
 
 <style scoped lang="scss">
+@import '@/static/scss/form-common.scss';
 .ledger-detail {
 	min-height: 100vh;
 	background: #f8f9fa;

--
Gitblit v1.9.3