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 | 365 ++++++++++++++++++++++++++++++++++++++++++++-------
1 files changed, 310 insertions(+), 55 deletions(-)
diff --git a/src/views/equipmentManagement/ledger/Form.vue b/src/views/equipmentManagement/ledger/Form.vue
index 108dbe4..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="100px" :rules="formRules" ref="formRef">
+ <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="璇疯緭鍏ヨ澶囧悕绉�" />
@@ -8,7 +26,7 @@
</el-col>
<el-col :span="12">
<el-form-item label="瑙勬牸鍨嬪彿" prop="deviceModel">
- <el-input v-model="form.deviceModel" :disabled="(form.deviceModel != null && operationType === 'edit')" placeholder="璇疯緭鍏ヨ鏍煎瀷鍙�" />
+ <el-input v-model="form.deviceModel" placeholder="璇疯緭鍏ヨ鏍煎瀷鍙�" />
</el-form-item>
</el-col>
<el-col :span="12">
@@ -17,8 +35,29 @@
</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="type">
+ <el-select
+ v-model="form.type"
+ placeholder="璇烽�夋嫨鎴栬緭鍏ヨ澶囩被鍨�"
+ clearable
+ filterable
+ allow-create
+ default-first-option
+ style="width: 100%"
+ @change="handleDeviceTypeChange"
+ >
+ <el-option
+ v-for="item in deviceTypeOptions"
+ :key="item"
+ :label="item"
+ :value="item"
+ />
+ </el-select>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="鍑哄巶缂栧彿" prop="factoryNumber">
+ <el-input v-model="form.factoryNumber" placeholder="璇疯緭鍏ュ嚭鍘傜紪鍙�" />
</el-form-item>
</el-col>
<el-col :span="12">
@@ -27,19 +66,68 @@
</el-form-item>
</el-col>
<el-col :span="12">
+ <el-form-item label="璐ｄ换浜�" prop="responsiblePerson">
+ <el-input v-model="form.responsiblePerson" placeholder="璇疯緭鍏ヨ矗浠讳汉" />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <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-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.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="enableDepreciation">
- <el-switch v-model="form.enableDepreciation" :active-value="true" :inactive-value="false" />
- </el-form-item>
- </el-col>
- <el-col :span="12">
<el-form-item label="鏁伴噺" prop="number">
- <el-input-number :step="0.01" :min="0" style="width: 100%"
+ <el-input-number :min="1" style="width: 100%"
v-model="form.number"
+ disabled
placeholder="璇疯緭鍏ユ暟閲�"
@change="mathNum"
/>
@@ -67,22 +155,18 @@
</el-col>
<el-col :span="12">
<el-form-item label="绋庣巼(%)" prop="taxRate">
- <!-- <el-input
- v-model="form.taxRate"
- placeholder="璇疯緭鍏ョ◣鐜�"
- type="number"
- >
- <template #append> % </template>
- </el-input> -->
<el-select
v-model="form.taxRate"
placeholder="璇烽�夋嫨"
clearable
@change="mathNum"
>
- <el-option label="1" :value="1" />
- <el-option label="6" :value="6" />
- <el-option label="13" :value="13" />
+ <el-option
+ v-for="dict in tax_rate"
+ :key="dict.value"
+ :label="dict.label"
+ :value="Number(dict.value)"
+ />
</el-select>
</el-form-item>
</el-col>
@@ -96,21 +180,87 @@
/>
</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="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
+ v-model:fileList="fileList"
+ :limit="20"
+ :fileSize="5"
+ :buttonText="'涓婁紶鍥剧墖'"
/>
</el-form-item>
</el-col>
@@ -120,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 {
@@ -128,69 +277,174 @@
calculateTaxExclusiveTotalPrice,
} from "@/utils/summarizeTable";
import { ElMessage } from "element-plus";
-import {ref} from "vue";
+import { ref, getCurrentInstance, computed } from "vue";
+import AttachmentUploadImage from '@/components/AttachmentUpload/image/index.vue';
+
+const { proxy } = getCurrentInstance();
+const { tax_rate } = proxy.useDict("tax_rate");
defineOptions({
name: "璁惧鍙拌处琛ㄥ崟",
});
const formRef = ref(null);
-const operationType = ref('');
+const operationType = ref('add');
+// 璁惧绫诲瀷鍥哄畾閫夐」
+const deviceTypeOptions = ref([
+ '鐢熶骇璁惧',
+ '鍔炲叕璁惧',
+ '妫�娴嬭澶�',
+ '杩愯緭璁惧',
+ '鍏朵粬璁惧'
+]);
const formRules = {
- deviceName: [{ required: true, trigger: "blur", message: "璇疯緭鍏�" }],
- deviceModel: [{ required: true, trigger: "blur", 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: "璇疯緭鍏�" }],
+ 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, // 璁惧鍝佺墝
- supplierName: undefined, // 渚涘簲鍟�
+ type: undefined, // 璁惧绫诲瀷
+ factoryNumber: undefined, // 鍑哄巶缂栧彿
storageLocation: undefined, // 瀛樻斁浣嶇疆
- enableDepreciation: false, // 鏄惁鍚敤鎶樻棫
+ responsiblePerson: undefined, // 璐ｄ换浜�
+ filingDate: dayjs().format("YYYY-MM-DD"), // 寤烘。鏃ユ湡
+
+ // Purchase Info
+ supplierName: undefined, // 渚涘簲鍟�
+ manufacturer: undefined, // 鍒堕�犲巶鍟�
+ purchaseDate: undefined, // 璐疆鏃ユ湡
+ originalAssetValue: undefined, // 璧勪骇鍘熷��
unit: undefined, // 鍗曚綅
- number: undefined, // 鏁伴噺
+ number: 1, // 鏁伴噺
taxIncludingPriceUnit: undefined, // 鍚◣鍗曚环
taxIncludingPriceTotal: undefined, // 鍚◣鎬讳环
taxRate: undefined, // 绋庣巼
unTaxIncludingPriceTotal: undefined, // 涓嶅惈绋庢�讳环
- // createUser: useUserStore().nickName, // 褰曞叆浜�
- createTime: dayjs().format("YYYY-MM-DD HH:mm:ss"), // 褰曞叆鏃ユ湡
+
+ // 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, // 璁惧鍥剧墖灞曠ず
+});
+
+const fileList = computed({
+ get() {
+ return form.storageBlobVOs || [];
+ },
+ set(val) {
+ form.storageBlobDTOs = val;
+ form.storageBlobVOs = val;
+ }
});
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.supplierName = data.supplierName;
+ form.type = data.type;
+ form.factoryNumber = data.factoryNumber;
form.storageLocation = data.storageLocation;
- form.enableDepreciation = data.enableDepreciation;
+ 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 = data.number;
+ 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');
+ } else {
+ form.planRuntimeTime = undefined;
+ }
+ form.storageBlobVOs = data.storageBlobVOs;
+ form.storageBlobDTOs = data.storageBlobVOs;
+ }
+};
+
+const handleDeviceTypeChange = (value) => {
+ // 濡傛灉杈撳叆鐨勬柊鍊间笉鍦ㄥ浐瀹氶�夐」涓紝鍒欐坊鍔犲埌閫夐」鍒楄〃
+ if (value && !deviceTypeOptions.value.includes(value)) {
+ deviceTypeOptions.value.push(value);
}
};
const mathNum = () => {
if (!form.taxIncludingPriceUnit) {
ElMessage.error("璇疯緭鍏ュ崟浠�");
- return;
- }
- if (!form.number) {
- ElMessage.error("璇疯緭鍏ユ暟閲�");
return;
}
form.taxIncludingPriceTotal = calculateTaxIncludeTotalPrice(
@@ -213,6 +467,7 @@
// 閲嶇疆琛ㄥ崟鏁版嵁鍜屾牎楠岀姸鎬�
const resetFormAndValidate = () => {
resetForm();
+ operationType.value = 'add'; // 閲嶇疆涓烘柊澧�
clearValidate();
};
@@ -222,6 +477,6 @@
resetForm,
clearValidate,
resetFormAndValidate,
- formRef,
+ formRef,
});
</script>
--
Gitblit v1.9.3