From b2b12e3bfac952fd86630bf1b0e9a76f1d65451f Mon Sep 17 00:00:00 2001
From: yyb <995253665@qq.com>
Date: 星期三, 15 四月 2026 09:51:19 +0800
Subject: [PATCH] 优化产品类别选择:添加过滤功能以增强用户体验,并在类别变化时重置相关字段以避免旧值残留
---
src/views/salesManagement/salesLedger/index.vue | 250 ++++++++++++++++++++++++++++++++++++++-----------
1 files changed, 191 insertions(+), 59 deletions(-)
diff --git a/src/views/salesManagement/salesLedger/index.vue b/src/views/salesManagement/salesLedger/index.vue
index dae908a..2f61cdf 100644
--- a/src/views/salesManagement/salesLedger/index.vue
+++ b/src/views/salesManagement/salesLedger/index.vue
@@ -3,8 +3,23 @@
<div class="search_form">
<el-form :model="searchForm" :inline="true">
<el-form-item label="瀹㈡埛鍚嶇О锛�">
- <el-input v-model="searchForm.customerName" placeholder="璇疯緭鍏�" clearable prefix-icon="Search"
- @change="handleQuery" />
+ <el-select
+ v-model="searchForm.customerId"
+ filterable
+ placeholder="璇烽�夋嫨瀹㈡埛鍚嶇О"
+ clearable
+ style="width: 220px"
+ @change="handleQuery"
+ >
+ <el-option
+ v-for="item in customerOption"
+ :key="item.id"
+ :label="item.customerName"
+ :value="item.id"
+ >
+ {{ item.customerName + "鈥斺��" + item.taxpayerIdentificationNumber }}
+ </el-option>
+ </el-select>
</el-form-item>
<el-form-item label="閿�鍞悎鍚屽彿锛�">
<el-input v-model="searchForm.salesContractNo" placeholder="璇疯緭鍏�" clearable prefix-icon="Search"
@@ -17,6 +32,14 @@
<el-form-item label="褰曞叆鏃ユ湡锛�">
<el-date-picker v-model="searchForm.entryDate" value-format="YYYY-MM-DD" format="YYYY-MM-DD" type="daterange"
placeholder="璇烽�夋嫨" clearable @change="changeDaterange" />
+ </el-form-item>
+ <el-form-item label="鍙戣揣鐘舵�侊細">
+ <el-select v-model="searchForm.deliveryStatus" placeholder="璇烽�夋嫨" clearable style="width: 140px">
+ <el-option label="鏈彂璐�" :value="1" />
+ <el-option label="瀹℃壒涓�" :value="2" />
+ <el-option label="瀹℃壒澶辫触" :value="3" />
+ <el-option label="宸插彂璐�" :value="4" />
+ </el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="handleQuery"> 鎼滅储 </el-button>
@@ -116,13 +139,13 @@
<el-tag v-else type="danger">涓嶈冻</el-tag>
</template>
</el-table-column>
- <el-table-column label="鍙戣揣鐘舵��" width="140" align="center">
+ <!-- <el-table-column label="鍙戣揣鐘舵��" width="140" align="center">
<template #default="scope">
<el-tag :type="getShippingStatusType(scope.row)" size="small">
{{ getShippingStatusText(scope.row) }}
</el-tag>
</template>
- </el-table-column>
+ </el-table-column> -->
<el-table-column label="蹇�掑叕鍙�" prop="expressCompany" show-overflow-tooltip />
<el-table-column label="蹇�掑崟鍙�" prop="expressNumber" show-overflow-tooltip />
<el-table-column label="鍙戣揣杞︾墝" minWidth="100px" align="center">
@@ -169,9 +192,18 @@
<el-table-column label="瀹㈡埛鍚嶇О" prop="customerName" width="300" show-overflow-tooltip />
<el-table-column label="涓氬姟鍛�" prop="salesman" width="100" show-overflow-tooltip />
<el-table-column label="椤圭洰鍚嶇О" prop="projectName" width="180" show-overflow-tooltip />
- <el-table-column label="浠樻鏂瑰紡" prop="paymentMethod" show-overflow-tooltip />
<el-table-column label="鍚堝悓閲戦(鍏�)" prop="contractAmount" width="220" show-overflow-tooltip
:formatter="formattedNumber" />
+ <el-table-column label="鍙戣揣鐘舵��" width="140" align="center">
+ <template #default="scope">
+ <el-tag v-if="Number(scope.row.deliveryStatus) === 1" type="info">鏈彂璐�</el-tag>
+ <el-tag v-else-if="Number(scope.row.deliveryStatus) === 2" type="warning">瀹℃壒涓�</el-tag>
+ <el-tag v-else-if="Number(scope.row.deliveryStatus) === 3" type="danger">瀹℃壒涓嶉�氳繃</el-tag>
+ <el-tag v-else-if="Number(scope.row.deliveryStatus) === 4" type="primary">瀹℃壒閫氳繃</el-tag>
+ <el-tag v-else-if="Number(scope.row.deliveryStatus) === 5" type="success">宸插彂璐�</el-tag>
+ <el-tag v-else type="info">-</el-tag>
+ </template>
+ </el-table-column>
<el-table-column label="褰曞叆浜�" prop="entryPersonName" width="100" show-overflow-tooltip />
<el-table-column label="褰曞叆鏃ユ湡" prop="entryDate" width="120" show-overflow-tooltip />
<el-table-column label="绛捐鏃ユ湡" prop="executionDate" width="120" show-overflow-tooltip />
@@ -217,7 +249,7 @@
<el-row :gutter="30">
<el-col :span="12">
<el-form-item label="瀹㈡埛鍚嶇О锛�" prop="customerId">
- <el-select v-model="form.customerId" placeholder="璇烽�夋嫨" clearable :disabled="operationType === 'view'">
+ <el-select v-model="form.customerId" filterable placeholder="璇烽�夋嫨" clearable :disabled="operationType === 'view'">
<el-option v-for="item in customerOption" :key="item.id" :label="item.customerName" :value="item.id">
{{
item.customerName + "鈥斺��" + item.taxpayerIdentificationNumber
@@ -239,11 +271,12 @@
format="YYYY-MM-DD" type="date" placeholder="璇烽�夋嫨" clearable :disabled="operationType === 'view'" />
</el-form-item>
</el-col>
- <el-col :span="12">
- <el-form-item label="浠樻鏂瑰紡">
- <el-input v-model="form.paymentMethod" placeholder="璇疯緭鍏�" clearable :disabled="operationType === 'view'" />
- </el-form-item>
- </el-col>
+ <el-col :span="12">
+ <el-form-item label="浜よ揣鏃ユ湡锛�" prop="deliveryDate">
+ <el-date-picker style="width: 100%" v-model="form.deliveryDate" value-format="YYYY-MM-DD" format="YYYY-MM-DD"
+ type="date" placeholder="璇烽�夋嫨" clearable />
+ </el-form-item>
+ </el-col>
</el-row>
<el-row :gutter="30">
<el-col :span="12">
@@ -263,14 +296,6 @@
</el-form-item>
</el-col>
</el-row>
- <el-row :gutter="30">
- <el-col :span="12">
- <el-form-item label="浜よ揣鏃ユ湡锛�" prop="entryDate">
- <el-date-picker style="width: 100%" v-model="form.deliveryDate" value-format="YYYY-MM-DD" format="YYYY-MM-DD"
- type="date" placeholder="璇烽�夋嫨" clearable />
- </el-form-item>
- </el-col>
- </el-row>
<el-row>
<el-form-item label="浜у搧淇℃伅锛�" prop="entryDate">
<el-button v-if="operationType !== 'view'" type="primary" @click="openProductForm('add')">娣诲姞</el-button>
@@ -439,6 +464,8 @@
v-model="productForm.productCategory"
placeholder="璇烽�夋嫨"
clearable
+ filterable
+ :filter-node-method="filterProductCategoryNode"
check-strictly
@change="getModels"
:data="productOptions"
@@ -482,7 +509,9 @@
<el-form-item label="绋庣巼(%)锛�" prop="taxRate">
<el-select v-model="productForm.taxRate" placeholder="璇烽�夋嫨" clearable @change="calculateFromTaxRate" style="width: 100%">
<el-option label="1" value="1" />
+ <el-option label="3" value="3" />
<el-option label="6" value="6" />
+ <el-option label="9" value="9" />
<el-option label="13" value="13" />
</el-select>
</el-form-item>
@@ -911,7 +940,7 @@
<script setup>
import { getToken } from "@/utils/auth";
import pagination from "@/components/PIMTable/Pagination.vue";
-import {onMounted, ref, getCurrentInstance} from "vue";
+import {onMounted, ref, getCurrentInstance, watch} from "vue";
import { addShippingInfo } from "@/api/salesManagement/deliveryLedger.js";
import { ElMessageBox, ElMessage } from "element-plus";
import { ArrowDown } from "@element-plus/icons-vue";
@@ -983,10 +1012,12 @@
const data = reactive({
searchForm: {
customerName: "", // 瀹㈡埛鍚嶇О
+ customerId: "", // 瀹㈡埛ID锛堟煡璇笅鎷夛級
salesContractNo: "", // 閿�鍞悎鍚岀紪鍙�
entryDate: null, // 褰曞叆鏃ユ湡
entryDateStart: undefined,
entryDateEnd: undefined,
+ deliveryStatus: undefined, // 鍙戣揣鐘舵�侊細1鏈彂璐� 2瀹℃壒涓� 3瀹℃壒澶辫触 4宸插彂璐�
},
form: {
salesContractNo: "",
@@ -1010,6 +1041,17 @@
});
const { form, rules } = toRefs(data);
const { form: searchForm } = useFormData(data.searchForm);
+
+// 鏂板鍙拌处锛氬綍鍏ユ棩鏈熷彉鏇存椂锛屼氦璐ф棩鏈熼粯璁や繚鎸佷负褰曞叆鏃ユ湡鍚庣 7 澶�
+watch(
+ () => [operationType.value, form.value?.entryDate],
+ () => {
+ if (operationType.value !== "add") return;
+ const ed = form.value?.entryDate;
+ if (!ed) return;
+ form.value.deliveryDate = dayjs(ed).add(7, "day").format("YYYY-MM-DD");
+ }
+);
// 浜у搧琛ㄥ崟寮规鏁版嵁
const productFormVisible = ref(false);
const productOperationType = ref("");
@@ -1043,22 +1085,6 @@
productRules: {
productCategory: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }],
productModelId: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }],
- specificationModel: [
- { required: true, message: "璇烽�夋嫨", trigger: "change" },
- ],
- thickness: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }],
- quantity: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }],
- taxInclusiveUnitPrice: [
- { required: true, message: "璇疯緭鍏�", trigger: "blur" },
- ],
- taxRate: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }],
- taxInclusiveTotalPrice: [
- { required: true, message: "璇疯緭鍏�", trigger: "blur" },
- ],
- taxExclusiveTotalPrice: [
- { required: true, message: "璇疯緭鍏�", trigger: "blur" },
- ],
- invoiceType: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }],
},
});
const { productForm, productRules } = toRefs(productFormData);
@@ -1361,6 +1387,21 @@
const params = { ...rest, ...page };
// 绉婚櫎褰曞叆鏃ユ湡鐨勯粯璁ゅ�艰缃紝鍙繚鐣欒寖鍥存棩鏈熷瓧娈�
delete params.entryDate;
+ // 鏌ヨ瀹㈡埛鍚嶇О涓庢柊澧炰繚鎸佷竴鑷达細鍏堥�� customerId锛屽啀鏄犲皠涓� customerName 鏌ヨ
+ const selectedCustomer = (customerOption.value || []).find(
+ (item) => String(item?.id ?? "") === String(params.customerId ?? "")
+ );
+ if (selectedCustomer?.customerName) {
+ params.customerName = String(selectedCustomer.customerName).trim();
+ } else {
+ const cn = params.customerName != null ? String(params.customerName).trim() : "";
+ if (cn) {
+ params.customerName = cn;
+ } else {
+ delete params.customerName;
+ }
+ }
+ delete params.customerId;
return ledgerListPage(params)
.then((res) => {
tableLoading.value = false;
@@ -1468,18 +1509,44 @@
};
// 鑾峰彇tree瀛愭暟鎹�
const getModels = (value) => {
+ // 浜у搧澶х被鍙樺寲鏃讹紝閲嶇疆瑙勬牸鍨嬪彿涓庡帤搴︼紝閬垮厤鏃у�兼畫鐣�
+ productForm.value.productModelId = null;
+ productForm.value.specificationModel = "";
+ productForm.value.thickness = null;
+
+ if (!value) {
+ productForm.value.productCategory = "";
+ modelOptions.value = [];
+ return;
+ }
+
productForm.value.productCategory = findNodeById(productOptions.value, value);
modelList({ id: value }).then((res) => {
- modelOptions.value = res;
+ modelOptions.value = res || [];
});
};
const getProductModel = (value) => {
const index = modelOptions.value.findIndex((item) => item.id === value);
if (index !== -1) {
productForm.value.specificationModel = modelOptions.value[index].model;
+ const selectedModel = modelOptions.value[index];
+ const modelThickness =
+ selectedModel?.thickness ??
+ selectedModel?.modelThickness ??
+ selectedModel?.thick ??
+ null;
+ productForm.value.thickness =
+ modelThickness === null || modelThickness === undefined || modelThickness === ""
+ ? null
+ : Number(modelThickness);
} else {
productForm.value.specificationModel = null;
+ productForm.value.thickness = null;
}
+};
+const filterProductCategoryNode = (value, data) => {
+ if (!value) return true;
+ return String(data?.label || "").toLowerCase().includes(String(value).toLowerCase());
};
const findNodeById = (nodes, productId) => {
for (let i = 0; i < nodes.length; i++) {
@@ -1620,6 +1687,9 @@
// }
// });
form.value.entryDate = getCurrentDate(); // 璁剧疆榛樿褰曞叆鏃ユ湡涓哄綋鍓嶆棩鏈�
+ if (type === "add") {
+ form.value.deliveryDate = dayjs(form.value.entryDate).add(7, "day").format("YYYY-MM-DD");
+ }
dialogFormVisible.value = true;
};
@@ -1786,7 +1856,9 @@
}
form.value.tempFileIds = tempFileIds;
form.value.type = 1;
- addOrUpdateSalesLedger(form.value).then((res) => {
+ const submitPayload = { ...form.value };
+ delete submitPayload.paymentMethod;
+ addOrUpdateSalesLedger(submitPayload).then((res) => {
proxy.$modal.msgSuccess("鎻愪氦鎴愬姛");
closeDia();
getList();
@@ -2516,11 +2588,23 @@
* @param row 琛屾暟鎹�
*/
const canShip = (row) => {
+
// 浜у搧鐘舵�佸繀椤绘槸鍏呰冻锛坅pproveStatus === 1锛�
if (row.approveStatus !== 1) {
return false;
}
+ // 濡傛灉鍚庣杩斿洖浜嗗彴璐︾骇鍙戣揣鐘舵�侊紙deliveryStatus锛�
+ // 1=宸插彂璐э紝鍒欑姝㈠啀娆″彂璐�
+ const deliveryStatus = row.deliveryStatus;
+ if (
+ deliveryStatus !== null &&
+ deliveryStatus !== undefined &&
+ String(deliveryStatus).trim() !== ""
+ ) {
+ if (Number(deliveryStatus) === 1) return false;
+ }
+
// 鑾峰彇鍙戣揣鐘舵��
const shippingStatus = row.shippingStatus;
@@ -2538,6 +2622,44 @@
if (selectedRows.value.length === 0) {
proxy.$modal.msgWarning("璇烽�夋嫨鏁版嵁");
return;
+ }
+
+ // 鍙厑璁搞�愭湭鍙戣揣/瀹℃壒澶辫触銆戣繘鍏ュ彂璐ф祦绋�
+ const canDeliveryLedgers = selectedRows.value.filter((r) => {
+ const status = Number(r.deliveryStatus);
+ return status === 1 || status === 3;
+ });
+ if (canDeliveryLedgers.length === 0) {
+ proxy.$modal.msgWarning("浠呮湭鍙戣揣鎴栧鎵瑰け璐ョ殑鍙拌处鍙互鍙戣揣");
+ return;
+ }
+
+ // 宸插彂璐у彴璐︼細寮圭獥鎻愰啋锛屼笉鑳藉啀娆″彂璐э紙4 瑙嗕负宸插彂璐э級
+ const shippedLedgers = selectedRows.value.filter((r) => Number(r.deliveryStatus) === 4);
+ if (shippedLedgers.length === selectedRows.value.length) {
+ try {
+ await ElMessageBox.alert("鎵�閫夐攢鍞彴璐﹀潎宸插彂璐э紝涓嶈兘鍐嶆鍙戣揣銆�", "鎻愮ず", {
+ type: "warning",
+ confirmButtonText: "鐭ラ亾浜�",
+ });
+ } catch {
+ /* 鍏抽棴寮圭獥 */
+ }
+ return;
+ }
+ if (shippedLedgers.length > 0) {
+ try {
+ await ElMessageBox.alert(
+ "閫変腑鐨勯攢鍞彴璐︿腑鍖呭惈宸插彂璐ц褰曪紝宸插彂璐х殑涓嶈兘鍐嶆鍙戣揣锛岀郴缁熷皢浠呬负鏈彂璐у彴璐﹀鐞嗐��",
+ "鎻愮ず",
+ {
+ type: "warning",
+ confirmButtonText: "鐭ラ亾浜�",
+ }
+ );
+ } catch {
+ return;
+ }
}
const customerNames = selectedRows.value.map((r) => String(r.customerName || "").trim());
@@ -2567,14 +2689,22 @@
try {
const targets = [];
for (const ledger of selectedRows.value) {
+
+ //濡傛灉宸茬粡鏄�滃鎵逛腑(2)鈥濇垨鈥滃凡鍙戣揣(4)鈥濓紝鍒欒烦杩囷紝涓嶅厑璁搁噸澶嶆搷浣�
+ const status = Number(ledger.deliveryStatus);
+ if (status === 2 || status === 4) {
+ console.warn(`鍙拌处缂栧彿 ${ledger.salesContractNo} 鐘舵�佷负 ${status}锛岃烦杩囧彂璐);
+ continue;
+ }
+
let products = [];
try {
const res = await productList({ salesLedgerId: ledger.id, type: 1 });
products = res?.data || [];
- } catch {
+ } catch (error) {
products = [];
+ console.error('璇锋眰鍙戠敓寮傚父', error);
}
-
for (const product of products) {
if (!canShip(product)) continue;
targets.push({
@@ -2583,7 +2713,6 @@
});
}
}
-
if (targets.length === 0) {
proxy.$modal.msgWarning("娌℃湁鍙彂璐х殑鏁版嵁");
return;
@@ -2615,14 +2744,15 @@
});
}
-// 鎵撳紑鍙戣揣寮规
+// 鎵撳紑鍙戣揣寮规锛堝崟鏉★級
const openDeliveryForm = (row) => {
- // 妫�鏌ユ槸鍚﹀彲浠ュ彂璐�
- if (!canShip(row)) {
- proxy.$modal.msgWarning("鍙湁鍦ㄤ骇鍝佺姸鎬佹槸鍏呰冻锛屽彂璐х姸鎬佹槸寰呭彂璐ф垨瀹℃牳鎷掔粷鐨勬椂鍊欐墠鍙互鍙戣揣");
+ // 鍙厑璁搞�愭湭鍙戣揣/瀹℃壒澶辫触銆戝彂璐э紱宸插彂璐�/瀹℃壒涓笉鍏佽
+ const status = Number(row.deliveryStatus);
+ if (status !== 1 && status !== 3) {
+ proxy.$modal.msgWarning("鍙湁鍙戣揣鐘舵�佷负鏈彂璐ф垨瀹℃壒澶辫触鐨勮褰曟墠鍙互鍙戣揣");
return;
}
-
+
currentDeliveryRows.value = [row];
deliveryForm.value = {
type: "璐ц溅",
@@ -2653,19 +2783,18 @@
return;
}
- // 渚濇鍙戣揣锛堥伩鍏嶅苟鍙戜笅搴撳瓨鎵e噺/鐘舵�佹洿鏂颁簰鐩稿奖鍝嶏級
- const run = async () => {
- for (const item of targets) {
- const salesLedgerId = item.salesLedgerId;
- if (!salesLedgerId) continue;
- await addShippingInfo({
- salesLedgerId,
- salesLedgerProductId: item.id,
- type: deliveryForm.value.type,
- approveUserIds,
- });
- }
- };
+ // 鎸夊彴璐︾淮搴﹀幓閲嶏紝姣忎釜 salesLedgerId 鍙皟鐢ㄤ竴娆″彂璐ф帴鍙�
+ const uniqueLedgerIds = [...new Set(targets.map((item) => item.salesLedgerId).filter(Boolean))];
+
+ const run = async () => {
+ for (const salesLedgerId of uniqueLedgerIds) {
+ await addShippingInfo({
+ salesLedgerId,
+ type: deliveryForm.value.type,
+ approveUserIds,
+ });
+ }
+ };
run()
.then(() => {
@@ -2709,6 +2838,9 @@
};
onMounted(() => {
getList();
+ customerList().then((res) => {
+ customerOption.value = res;
+ });
userListNoPage().then(res => {
userList.value = res.data;
})
--
Gitblit v1.9.3