From 2d3530a7c11557a40807ad7c0b9e302ce6ce3a9f Mon Sep 17 00:00:00 2001
From: hsy <1029150275@qq.com>
Date: 星期五, 28 八月 2026 10:16:32 +0800
Subject: [PATCH] feat: 综合业务模块页面重构与交互完善
---
src/views/equipmentManagement/ledger/Form.vue | 293 ++++++++++++++++++++++++++++++++++++++++++++--------------
1 files changed, 221 insertions(+), 72 deletions(-)
diff --git a/src/views/equipmentManagement/ledger/Form.vue b/src/views/equipmentManagement/ledger/Form.vue
index f1d21f2..4405f90 100644
--- a/src/views/equipmentManagement/ledger/Form.vue
+++ b/src/views/equipmentManagement/ledger/Form.vue
@@ -1,6 +1,24 @@
<template>
<el-form :model="form" label-width="120px" :rules="formRules" ref="formRef">
+ <el-divider content-position="left">鍩虹淇℃伅</el-divider>
<el-row :gutter="20">
+ <el-col :span="12">
+ <el-form-item label="璁惧缂栧彿" prop="uniqueCode">
+ <div style="display: flex; gap: 10px; width: 100%;">
+ <el-checkbox
+ v-model="form.autoGenerateUniqueCode"
+ v-if="operationType === 'add'"
+ >鑷姩鐢熸垚
+ </el-checkbox>
+ <el-input
+ v-model="form.uniqueCode"
+ :placeholder="form.autoGenerateUniqueCode ? '淇濆瓨鍚庤嚜鍔ㄧ敓鎴�' : '璇疯緭鍏ヨ澶囩紪鍙�'"
+ :disabled="form.autoGenerateUniqueCode || operationType === 'view'"
+ clearable
+ />
+ </div>
+ </el-form-item>
+ </el-col>
<el-col :span="12">
<el-form-item label="璁惧鍚嶇О" prop="deviceName">
<el-input v-model="form.deviceName" placeholder="璇疯緭鍏ヨ澶囧悕绉�" />
@@ -38,8 +56,8 @@
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="渚涘簲鍟�" prop="supplierName">
- <el-input v-model="form.supplierName" placeholder="璇疯緭鍏ヤ緵搴斿晢" />
+ <el-form-item label="鍑哄巶缂栧彿" prop="factoryNumber">
+ <el-input v-model="form.factoryNumber" placeholder="璇疯緭鍏ュ嚭鍘傜紪鍙�" />
</el-form-item>
</el-col>
<el-col :span="12">
@@ -48,31 +66,68 @@
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="鍗曚綅" prop="unit">
- <el-input v-model="form.unit" placeholder="璇疯緭鍏ュ崟浣�" />
+ <el-form-item label="璐d换浜�" prop="responsiblePerson">
+ <el-input v-model="form.responsiblePerson" placeholder="璇疯緭鍏ヨ矗浠讳汉" />
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="鍚敤鎶樻棫" prop="isDepr">
- <el-switch v-model="form.isDepr" :active-value="1" :inactive-value="2" />
+ <el-form-item label="寤烘。鏃ユ湡" prop="filingDate">
+ <el-date-picker
+ style="width: 100%"
+ v-model="form.filingDate"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD"
+ type="date"
+ placeholder="璇烽�夋嫨寤烘。鏃ユ湡"
+ clearable
+ />
</el-form-item>
</el-col>
- <el-col :span="12" v-if="form.isDepr === 1">
- <el-form-item label="姣忓勾鎶樻棫閲戦" prop="annualDepreciationAmount">
- <el-input-number
- :step="0.01"
- :min="0"
+ </el-row>
+
+ <el-divider content-position="left">閲囪喘淇℃伅</el-divider>
+ <el-row :gutter="20">
+ <el-col :span="12">
+ <el-form-item label="渚涘簲鍟�" prop="supplierName">
+ <el-input v-model="form.supplierName" placeholder="璇疯緭鍏ヤ緵搴斿晢" />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="鍒堕�犲巶鍟�" prop="manufacturer">
+ <el-input v-model="form.manufacturer" placeholder="璇疯緭鍏ュ埗閫犲巶鍟�" />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="璐疆鏃ユ湡" prop="purchaseDate">
+ <el-date-picker
style="width: 100%"
- v-model="form.annualDepreciationAmount"
- placeholder="璇疯緭鍏ユ瘡骞存姌鏃ч噾棰�"
+ v-model="form.purchaseDate"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD"
+ type="date"
+ placeholder="璇烽�夋嫨璐疆鏃ユ湡"
+ clearable
/>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="璧勪骇鍘熷��" prop="originalAssetValue">
+ <el-input-number :step="0.01" :min="0" style="width: 100%"
+ v-model="form.originalAssetValue"
+ placeholder="璇疯緭鍏ヨ祫浜у師鍊�"
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="鍗曚綅" prop="unit">
+ <el-input v-model="form.unit" placeholder="璇疯緭鍏ュ崟浣�" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="鏁伴噺" prop="number">
<el-input-number :min="1" style="width: 100%"
v-model="form.number"
- disabled
+ disabled
placeholder="璇疯緭鍏ユ暟閲�"
@change="mathNum"
/>
@@ -125,37 +180,80 @@
/>
</el-form-item>
</el-col>
- <!-- <el-col :span="12">
- <el-form-item label="褰曞叆浜�" prop="createUser">
- <el-input v-model="form.createUser" placeholder="璇疯緭鍏ュ綍鍏ヤ汉" />
+ </el-row>
+
+ <el-divider content-position="left">鎶�鏈弬鏁�</el-divider>
+ <el-row :gutter="20">
+ <el-col :span="24">
+ <el-form-item label="涓昏鎶�鏈弬鏁�" prop="technicalParameters">
+ <el-input type="textarea" :rows="3" v-model="form.technicalParameters" placeholder="璇疯緭鍏ヤ富瑕佹妧鏈弬鏁�" />
</el-form-item>
- </el-col> -->
+ </el-col>
+ <el-col :span="24">
+ <el-form-item label="涓昏鐢ㄩ��" prop="mainPurpose">
+ <el-input type="textarea" :rows="3" v-model="form.mainPurpose" placeholder="璇疯緭鍏ヤ富瑕佺敤閫�" />
+ </el-form-item>
+ </el-col>
+ </el-row>
+
+ <el-divider content-position="left">杩愯绠$悊</el-divider>
+ <el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="褰曞叆鏃ユ湡" prop="createTime">
+ <el-form-item label="璁惧鐘舵��" prop="status">
+ <el-select
+ v-model="form.status"
+ placeholder="璇烽�夋嫨"
+ :disabled="operationType === 'edit'"
+ style="width: 100%"
+ >
+ <el-option label="鍋滅敤" :value="0" />
+ <el-option label="鍚敤" :value="1" />
+ </el-select>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="鍚敤鏃ユ湡" prop="activationDate">
<el-date-picker
style="width: 100%"
- v-model="form.createTime"
+ v-model="form.activationDate"
format="YYYY-MM-DD"
- value-format="YYYY-MM-DD HH:mm:ss"
+ value-format="YYYY-MM-DD"
type="date"
- placeholder="璇烽�夋嫨褰曞叆鏃ユ湡"
+ placeholder="璇烽�夋嫨鍚敤鏃ユ湡"
clearable
/>
</el-form-item>
</el-col>
- <el-col :span="12">
- <el-form-item label="棰勮杩愯鏃堕棿" prop="planRuntimeTime">
- <el-date-picker
- style="width: 100%"
- v-model="form.planRuntimeTime"
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD"
- type="date"
- placeholder="璇烽�夋嫨褰曞叆鏃ユ湡"
- clearable
- />
- </el-form-item>
- </el-col>
+ <el-col :span="12">
+ <el-form-item label="棰勮杩愯鏃堕棿" prop="planRuntimeTime">
+ <el-date-picker
+ style="width: 100%"
+ v-model="form.planRuntimeTime"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD"
+ type="date"
+ placeholder="璇烽�夋嫨棰勮杩愯鏃堕棿"
+ clearable
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="鍚敤鎶樻棫" prop="isDepr">
+ <el-switch v-model="form.isDepr" :active-value="1" :inactive-value="2" />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12" v-if="form.isDepr === 1">
+ <el-form-item label="姣忓勾鎶樻棫閲戦" prop="annualDepreciationAmount">
+ <el-input-number
+ :step="0.01"
+ :min="0"
+ style="width: 100%"
+ v-model="form.annualDepreciationAmount"
+ placeholder="璇疯緭鍏ユ瘡骞存姌鏃ч噾棰�"
+ />
+ </el-form-item>
+ </el-col>
+
<el-col :span="24">
<el-form-item label="璁惧鍥剧墖" prop="storageBlobDTOs">
<AttachmentUploadImage
@@ -172,7 +270,6 @@
<script setup>
import useFormData from "@/hooks/useFormData";
-// import useUserStore from "@/store/modules/user";
import { getLedgerById } from "@/api/equipmentManagement/ledger";
import dayjs from "dayjs";
import {
@@ -190,7 +287,7 @@
name: "璁惧鍙拌处琛ㄥ崟",
});
const formRef = ref(null);
-const operationType = ref('');
+const operationType = ref('add');
// 璁惧绫诲瀷鍥哄畾閫夐」
const deviceTypeOptions = ref([
'鐢熶骇璁惧',
@@ -200,47 +297,77 @@
'鍏朵粬璁惧'
]);
const formRules = {
- deviceName: [{ required: true, trigger: "blur", message: "璇疯緭鍏�" }],
- deviceModel: [{ required: true, trigger: "blur", message: "璇疯緭鍏�" }],
- type: [{ required: true, trigger: "change", message: "璇烽�夋嫨鎴栬緭鍏ヨ澶囩被鍨�" }],
- supplierName: [{ 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: "璇疯緭鍏�" }],
- planRuntimeTime: [{ required: true, trigger: "change", message: "璇烽�夋嫨" }],
- annualDepreciationAmount: [
- {
- validator: (rule, value, callback) => {
- if (form.isDepr === 1 && (value === undefined || value === null || value === '')) {
- callback(new Error('鍚敤鎶樻棫鏃讹紝璇疯緭鍏ユ瘡骞存姌鏃ч噾棰�'));
- } else {
- callback();
- }
- },
- trigger: "blur"
- }
- ],
+ uniqueCode: [
+ {
+ validator: (rule, value, callback) => {
+ if (!form.autoGenerateUniqueCode && (value === undefined || value === null || value === '')) {
+ callback(new Error('璇疯緭鍏ヨ澶囩紪鍙�'));
+ } else {
+ callback();
+ }
+ },
+ trigger: "blur"
+ }
+ ],
+ deviceName: [{ required: true, trigger: "blur", message: "璇疯緭鍏�" }],
+ deviceModel: [{ required: true, trigger: "blur", message: "璇疯緭鍏�" }],
+ type: [{ required: true, trigger: "change", message: "璇烽�夋嫨鎴栬緭鍏ヨ澶囩被鍨�" }],
+ supplierName: [{ 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: "璇疯緭鍏�" }],
+ planRuntimeTime: [{ required: true, trigger: "change", message: "璇烽�夋嫨" }],
+ status: [{ required: true, trigger: "change", message: "璇烽�夋嫨" }],
+ annualDepreciationAmount: [
+ {
+ validator: (rule, value, callback) => {
+ if (form.isDepr === 1 && (value === undefined || value === null || value === '')) {
+ callback(new Error('鍚敤鎶樻棫鏃讹紝璇疯緭鍏ユ瘡骞存姌鏃ч噾棰�'));
+ } else {
+ callback();
+ }
+ },
+ trigger: "blur"
+ }
+ ],
}
const { form, resetForm } = useFormData({
+ // Basic Info
+ autoGenerateUniqueCode: true,
+ uniqueCode: undefined, // 鍞竴鎬х紪鍙�
deviceName: undefined, // 璁惧鍚嶇О
deviceModel: undefined, // 瑙勬牸鍨嬪彿
deviceBrand: undefined, // 璁惧鍝佺墝
type: undefined, // 璁惧绫诲瀷
- supplierName: undefined, // 渚涘簲鍟�
+ factoryNumber: undefined, // 鍑哄巶缂栧彿
storageLocation: undefined, // 瀛樻斁浣嶇疆
- isDepr: 2, // 鏄惁鍚敤鎶樻棫 1-鏄� 2-鍚�
- annualDepreciationAmount: undefined, // 姣忓勾鎶樻棫閲戦
+ responsiblePerson: undefined, // 璐d换浜�
+ filingDate: dayjs().format("YYYY-MM-DD"), // 寤烘。鏃ユ湡
+
+ // Purchase Info
+ supplierName: undefined, // 渚涘簲鍟�
+ manufacturer: undefined, // 鍒堕�犲巶鍟�
+ purchaseDate: undefined, // 璐疆鏃ユ湡
+ originalAssetValue: undefined, // 璧勪骇鍘熷��
unit: undefined, // 鍗曚綅
number: 1, // 鏁伴噺
taxIncludingPriceUnit: undefined, // 鍚◣鍗曚环
taxIncludingPriceTotal: undefined, // 鍚◣鎬讳环
taxRate: undefined, // 绋庣巼
unTaxIncludingPriceTotal: undefined, // 涓嶅惈绋庢�讳环
- // createUser: useUserStore().nickName, // 褰曞叆浜�
- createTime: dayjs().format("YYYY-MM-DD HH:mm:ss"), // 褰曞叆鏃ユ湡
- planRuntimeTime: dayjs().format("YYYY-MM-DD"), // 褰曞叆鏃ユ湡
+
+ // Technical Specs
+ technicalParameters: undefined, // 涓昏鎶�鏈弬鏁�
+ mainPurpose: undefined, // 涓昏鐢ㄩ��
+
+ // Operation Info
+ status: 1, // 璁惧鐘舵�� (0鍋滅敤 1鍚敤)
+ activationDate: undefined, // 鍚敤鏃ユ湡
+ planRuntimeTime: dayjs().format("YYYY-MM-DD"), // 棰勮杩愯鏃堕棿
+ isDepr: 2, // 鏄惁鍚敤鎶樻棫 1-鏄� 2-鍚�
+ annualDepreciationAmount: undefined, // 姣忓勾鎶樻棫閲戦
storageBlobDTOs: undefined, // 璁惧鍥剧墖鎻愪氦
storageBlobVOs: undefined, // 璁惧鍥剧墖灞曠ず
});
@@ -256,26 +383,47 @@
});
const loadForm = async (id) => {
- if (id) {
- operationType.value = 'edit'
- }
+ if (id) {
+ operationType.value = 'edit';
+ } else {
+ operationType.value = 'add';
+ }
const { code, data } = await getLedgerById(id);
if (code == 200) {
+ form.autoGenerateUniqueCode = false;
+ form.uniqueCode = data.uniqueCode;
form.deviceName = data.deviceName;
form.deviceModel = data.deviceModel;
form.deviceBrand = data.deviceBrand;
form.type = data.type;
- form.supplierName = data.supplierName;
+ form.factoryNumber = data.factoryNumber;
form.storageLocation = data.storageLocation;
- form.isDepr = data.isDepr;
- form.annualDepreciationAmount = data.annualDepreciationAmount;
+ form.responsiblePerson = data.responsiblePerson;
+ form.filingDate = data.filingDate;
+
+ form.supplierName = data.supplierName;
+ form.manufacturer = data.manufacturer;
+ if (data.purchaseDate) {
+ form.purchaseDate = dayjs(data.purchaseDate).format('YYYY-MM-DD');
+ }
+ form.originalAssetValue = data.originalAssetValue;
form.unit = data.unit;
form.number = 1;
form.taxIncludingPriceUnit = data.taxIncludingPriceUnit;
form.taxIncludingPriceTotal = data.taxIncludingPriceTotal;
form.taxRate = data.taxRate;
form.unTaxIncludingPriceTotal = data.unTaxIncludingPriceTotal;
- form.createTime = data.createTime;
+
+ form.technicalParameters = data.technicalParameters;
+ form.mainPurpose = data.mainPurpose;
+
+ form.status = data.status != null ? data.status : 1;
+ if (data.activationDate) {
+ form.activationDate = dayjs(data.activationDate).format('YYYY-MM-DD');
+ }
+ form.isDepr = data.isDepr;
+ form.annualDepreciationAmount = data.annualDepreciationAmount;
+
// 棰勮杩愯鏃堕棿锛氬悗绔繑鍥炲悗杞负 YYYY-MM-DD 浠ヤ究鏃ユ湡閫夋嫨鍣ㄦ纭睍绀�
if (data.planRuntimeTime) {
form.planRuntimeTime = dayjs(data.planRuntimeTime).format('YYYY-MM-DD');
@@ -319,6 +467,7 @@
// 閲嶇疆琛ㄥ崟鏁版嵁鍜屾牎楠岀姸鎬�
const resetFormAndValidate = () => {
resetForm();
+ operationType.value = 'add'; // 閲嶇疆涓烘柊澧�
clearValidate();
};
@@ -328,6 +477,6 @@
resetForm,
clearValidate,
resetFormAndValidate,
- formRef,
+ formRef,
});
</script>
--
Gitblit v1.9.3