From 5783abee4e8c6ba1fc525545cf2a41ffe3e01926 Mon Sep 17 00:00:00 2001
From: zhangwencui <1064582902@qq.com>
Date: 星期五, 10 七月 2026 16:59:40 +0800
Subject: [PATCH] 物料产品选择勾选问题
---
src/views/mes/md/item/components/select-dialog.vue | 388 +++++++++++++++++++++++++++----------------------------
1 files changed, 192 insertions(+), 196 deletions(-)
diff --git a/src/views/mes/md/item/components/select-dialog.vue b/src/views/mes/md/item/components/select-dialog.vue
index 69c6bcf..30622bf 100644
--- a/src/views/mes/md/item/components/select-dialog.vue
+++ b/src/views/mes/md/item/components/select-dialog.vue
@@ -1,228 +1,224 @@
<script lang="ts" setup>
-import type { VxeTableGridOptions } from '#/adapter/vxe-table';
-import type { MesMdItemApi } from '#/api/mes/md/item';
-import type { MesMdItemTypeApi } from '#/api/mes/md/item/type';
+ import type { VxeTableGridOptions } from "#/adapter/vxe-table";
+ import type { MesMdItemApi } from "#/api/mes/md/item";
+ import type { MesMdItemTypeApi } from "#/api/mes/md/item/type";
-import { nextTick, ref } from 'vue';
+ import { nextTick, ref } from "vue";
-import { CommonStatusEnum } from '../../../../../packages/constants/src';
+ import { CommonStatusEnum } from "../../../../../packages/constants/src";
-import { Card, message, Modal } from 'ant-design-vue';
+ import { Card, message, Modal } from "ant-design-vue";
-import { useVbenVxeGrid } from '#/adapter/vxe-table';
-import { getItemPage } from '#/api/mes/md/item';
-import { MdItemTypeTree } from '#/views/mes/md/item/type/components';
+ import { useVbenVxeGrid } from "#/adapter/vxe-table";
+ import { getItemPage } from "#/api/mes/md/item";
+ import { MdItemTypeTree } from "#/views/mes/md/item/type/components";
-import { useItemSelectGridColumns, useItemSelectGridFormSchema } from '../data';
+ import { useItemSelectGridColumns, useItemSelectGridFormSchema } from "../data";
-defineOptions({ name: 'MdItemSelectDialog' });
+ defineOptions({ name: "MdItemSelectDialog" });
-const emit = defineEmits<{
- selected: [rows: MesMdItemApi.Item[]];
-}>();
+ const emit = defineEmits<{
+ selected: [rows: MesMdItemApi.Item[]];
+ }>();
-const open = ref(false); // 寮圭獥鏄惁鎵撳紑
-const multiple = ref(true); // 鏄惁澶氶��
-const selectedRows = ref<MesMdItemApi.Item[]>([]); // 宸查�夌墿鏂欏垪琛�
-const selectedItemTypeId = ref<number>(); // 褰撳墠绛涢�夊垎绫荤紪鍙�
-const preSelectedIds = ref<number[]>([]); // 棰勯�夌墿鏂欑紪鍙峰垪琛�
-const typeTreeRef = ref<InstanceType<typeof MdItemTypeTree>>(); // 鐗╂枡鍒嗙被鏍�
+ const open = ref(false); // 寮圭獥鏄惁鎵撳紑
+ const multiple = ref(true); // 鏄惁澶氶��
+ const selectedRows = ref<MesMdItemApi.Item[]>([]); // 宸查�夌墿鏂欏垪琛�
+ const selectedItemTypeId = ref<number>(); // 褰撳墠绛涢�夊垎绫荤紪鍙�
+ const preSelectedIds = ref<number[]>([]); // 棰勯�夌墿鏂欑紪鍙峰垪琛�
+ const typeTreeRef = ref<InstanceType<typeof MdItemTypeTree>>(); // 鐗╂枡鍒嗙被鏍�
-/** 鑾峰彇褰撳墠琛ㄦ牸鏁版嵁 */
-function getTableRows() {
- return gridApi.grid.getTableData().fullData as MesMdItemApi.Item[];
-}
-
-/** 鑾峰彇澶氶�夎褰曪紝鍖呭惈 VXE reserve 璺ㄩ〉璁板綍 */
-function getMultipleSelectedRows() {
- const selectedMap = new Map<number, MesMdItemApi.Item>();
- const records = [
- ...(gridApi.grid.getCheckboxReserveRecords?.() ?? []),
- ...(gridApi.grid.getCheckboxRecords?.() ?? []),
- ] as MesMdItemApi.Item[];
- records.forEach((row) => {
- const rowId = row.id;
- if (!rowId) {
- selectedMap.set(rowId as number, row);
- }
- });
- return [...selectedMap.values()];
-}
-
-/** 澶勭悊鍕鹃�夊彉鍖� */
-function handleCheckboxSelectChange() {
- selectedRows.value = getMultipleSelectedRows();
-}
-
-/** 澶勭悊鍗曢�夊彉鍖� */
-function handleRadioChange(row: MesMdItemApi.Item) {
- selectedRows.value = [row];
-}
-
-/** 澶氶�夋ā寮忎笅鍒囨崲琛屽嬀閫� */
-async function toggleMultipleRow(row: MesMdItemApi.Item) {
- const selected = gridApi.grid.isCheckedByCheckboxRow(row);
- await gridApi.grid.setCheckboxRow(row, !selected);
- selectedRows.value = getMultipleSelectedRows();
-}
-
-/** 澶勭悊琛屽弻鍑� */
-async function handleCellDblclick({ row }: { row: MesMdItemApi.Item }) {
- if (multiple.value) {
- await toggleMultipleRow(row);
- return;
+ /** 鑾峰彇褰撳墠琛ㄦ牸鏁版嵁 */
+ function getTableRows() {
+ return gridApi.grid.getTableData().fullData as MesMdItemApi.Item[];
}
- selectedRows.value = [row];
- await gridApi.grid.setRadioRow(row);
- handleConfirm();
-}
-/** 鎸夊垎绫荤瓫閫夌墿鏂� */
-function handleItemTypeNodeClick(row: MesMdItemTypeApi.ItemType | undefined) {
- selectedItemTypeId.value = row?.id;
- gridApi.query();
-}
+ /** 鑾峰彇澶氶�夎褰曪紝鍖呭惈 VXE reserve 璺ㄩ〉璁板綍 */
+ function getMultipleSelectedRows() {
+ const selectedMap = new Map<number, MesMdItemApi.Item>();
+ const records = [
+ ...(gridApi.grid.getCheckboxReserveRecords?.() ?? []),
+ ...(gridApi.grid.getCheckboxRecords?.() ?? []),
+ ] as MesMdItemApi.Item[];
+ records.forEach(row => {
+ const rowId = row.id;
+ if (rowId) {
+ selectedMap.set(rowId, row);
+ }
+ });
+ return [...selectedMap.values()];
+ }
-/** 鍥炴樉棰勯�夌墿鏂� */
-async function applyPreSelection() {
- if (preSelectedIds.value.length === 0) {
- return;
- }
- const rows = getTableRows();
- for (const row of rows) {
- if (
- row.id === undefined ||
- row.id === null ||
- !preSelectedIds.value.includes(row.id)
- ) {
- continue;
- }
- if (multiple.value) {
- await gridApi.grid.setCheckboxRow(row, true);
- } else {
- await gridApi.grid.setRadioRow(row);
- selectedRows.value = [row];
- return;
- }
- }
- if (multiple.value) {
+ /** 澶勭悊鍕鹃�夊彉鍖� */
+ function handleCheckboxSelectChange() {
selectedRows.value = getMultipleSelectedRows();
}
-}
-const [Grid, gridApi] = useVbenVxeGrid({
- formOptions: {
- schema: useItemSelectGridFormSchema(),
- },
- gridOptions: {
- columns: useItemSelectGridColumns(true),
- height: 560,
- keepSource: true,
- checkboxConfig: {
- highlight: true,
- range: true,
- reserve: true,
+ /** 澶勭悊鍗曢�夊彉鍖� */
+ function handleRadioChange(row: MesMdItemApi.Item) {
+ selectedRows.value = [row];
+ }
+
+ /** 澶氶�夋ā寮忎笅鍒囨崲琛屽嬀閫� */
+ async function toggleMultipleRow(row: MesMdItemApi.Item) {
+ const selected = gridApi.grid.isCheckedByCheckboxRow(row);
+ await gridApi.grid.setCheckboxRow(row, !selected);
+ selectedRows.value = getMultipleSelectedRows();
+ }
+
+ /** 澶勭悊琛屽弻鍑� */
+ async function handleCellDblclick({ row }: { row: MesMdItemApi.Item }) {
+ if (multiple.value) {
+ await toggleMultipleRow(row);
+ return;
+ }
+ selectedRows.value = [row];
+ await gridApi.grid.setRadioRow(row);
+ handleConfirm();
+ }
+
+ /** 鎸夊垎绫荤瓫閫夌墿鏂� */
+ function handleItemTypeNodeClick(row: MesMdItemTypeApi.ItemType | undefined) {
+ selectedItemTypeId.value = row?.id;
+ gridApi.query();
+ }
+
+ /** 鍥炴樉棰勯�夌墿鏂� */
+ async function applyPreSelection() {
+ if (preSelectedIds.value.length === 0) {
+ return;
+ }
+ const rows = getTableRows();
+ for (const row of rows) {
+ if (
+ row.id === undefined ||
+ row.id === null ||
+ !preSelectedIds.value.includes(row.id)
+ ) {
+ continue;
+ }
+ if (multiple.value) {
+ await gridApi.grid.setCheckboxRow(row, true);
+ } else {
+ await gridApi.grid.setRadioRow(row);
+ selectedRows.value = [row];
+ return;
+ }
+ }
+ if (multiple.value) {
+ selectedRows.value = getMultipleSelectedRows();
+ }
+ }
+
+ const [Grid, gridApi] = useVbenVxeGrid({
+ formOptions: {
+ schema: useItemSelectGridFormSchema(),
},
- radioConfig: {
- highlight: true,
- trigger: 'row',
- },
- proxyConfig: {
- ajax: {
- query: async ({ page }, formValues) => {
- return await getItemPage({
- pageNo: page.currentPage,
- pageSize: page.pageSize,
- ...formValues,
- itemTypeId: selectedItemTypeId.value,
- status: CommonStatusEnum.ENABLE,
- });
+ gridOptions: {
+ columns: useItemSelectGridColumns(true),
+ height: 560,
+ keepSource: true,
+ checkboxConfig: {
+ highlight: true,
+ range: true,
+ reserve: true,
+ },
+ radioConfig: {
+ highlight: true,
+ trigger: "row",
+ },
+ proxyConfig: {
+ ajax: {
+ query: async ({ page }, formValues) => {
+ return await getItemPage({
+ pageNo: page.currentPage,
+ pageSize: page.pageSize,
+ ...formValues,
+ itemTypeId: selectedItemTypeId.value,
+ status: CommonStatusEnum.ENABLE,
+ });
+ },
},
},
+ rowConfig: {
+ keyField: "id",
+ isHover: true,
+ },
+ toolbarConfig: {
+ refresh: true,
+ search: true,
+ },
+ } as VxeTableGridOptions<MesMdItemApi.Item>,
+ gridEvents: {
+ cellDblclick: handleCellDblclick,
+ checkboxAll: handleCheckboxSelectChange,
+ checkboxChange: handleCheckboxSelectChange,
+ radioChange: ({ row }: { row: MesMdItemApi.Item }) => {
+ handleRadioChange(row);
+ },
},
- rowConfig: {
- keyField: 'id',
- isHover: true,
- },
- toolbarConfig: {
- refresh: true,
- search: true,
- },
- } as VxeTableGridOptions<MesMdItemApi.Item>,
- gridEvents: {
- cellDblclick: handleCellDblclick,
- checkboxAll: handleCheckboxSelectChange,
- checkboxChange: handleCheckboxSelectChange,
- radioChange: ({ row }: { row: MesMdItemApi.Item }) => {
- handleRadioChange(row);
- },
- },
-});
-
-/** 閲嶇疆鏌ヨ鍜岄�夋嫨鐘舵�� */
-async function resetQueryState() {
- selectedItemTypeId.value = undefined;
- selectedRows.value = [];
- typeTreeRef.value?.reset();
- await gridApi.grid.clearCheckboxRow();
- await gridApi.grid.clearCheckboxReserve();
- await gridApi.grid.clearRadioRow();
- await gridApi.formApi.resetForm();
-}
-
-/** 鎵撳紑鐗╂枡閫夋嫨寮圭獥 */
-async function openModal(
- selectedIds?: number[],
- options?: { multiple?: boolean },
-) {
- open.value = true;
- multiple.value = options?.multiple ?? true;
- preSelectedIds.value = selectedIds || [];
- await nextTick();
- gridApi.setGridOptions({
- columns: useItemSelectGridColumns(multiple.value),
});
- await resetQueryState();
- await gridApi.query();
- await nextTick();
- await applyPreSelection();
-}
-/** 鍏抽棴鐗╂枡閫夋嫨寮圭獥 */
-async function closeModal() {
- open.value = false;
- await resetQueryState();
-}
-
-/** 纭閫夋嫨鐗╂枡 */
-function handleConfirm() {
- const rows = multiple.value ? getMultipleSelectedRows() : selectedRows.value;
- if (rows.length === 0) {
- message.warning(multiple.value ? '璇疯嚦灏戦�夋嫨涓�鏉℃暟鎹�' : '璇烽�夋嫨涓�鏉℃暟鎹�');
- return;
+ /** 閲嶇疆鏌ヨ鍜岄�夋嫨鐘舵�� */
+ async function resetQueryState() {
+ selectedItemTypeId.value = undefined;
+ selectedRows.value = [];
+ typeTreeRef.value?.reset();
+ await gridApi.grid.clearCheckboxRow();
+ await gridApi.grid.clearCheckboxReserve();
+ await gridApi.grid.clearRadioRow();
+ await gridApi.formApi.resetForm();
}
- emit('selected', multiple.value ? rows : [rows[0]!]);
- open.value = false;
-}
-defineExpose({ open: openModal });
+ /** 鎵撳紑鐗╂枡閫夋嫨寮圭獥 */
+ async function openModal(
+ selectedIds?: number[],
+ options?: { multiple?: boolean }
+ ) {
+ open.value = true;
+ multiple.value = options?.multiple ?? true;
+ preSelectedIds.value = selectedIds || [];
+ await nextTick();
+ gridApi.setGridOptions({
+ columns: useItemSelectGridColumns(multiple.value),
+ });
+ await resetQueryState();
+ await gridApi.query();
+ await nextTick();
+ await applyPreSelection();
+ }
+
+ /** 鍏抽棴鐗╂枡閫夋嫨寮圭獥 */
+ async function closeModal() {
+ open.value = false;
+ await resetQueryState();
+ }
+
+ /** 纭閫夋嫨鐗╂枡 */
+ function handleConfirm() {
+ const rows = multiple.value ? getMultipleSelectedRows() : selectedRows.value;
+ if (rows.length === 0) {
+ message.warning(multiple.value ? "璇疯嚦灏戦�夋嫨涓�鏉℃暟鎹�" : "璇烽�夋嫨涓�鏉℃暟鎹�");
+ return;
+ }
+ emit("selected", multiple.value ? rows : [rows[0]!]);
+ open.value = false;
+ }
+
+ defineExpose({ open: openModal });
</script>
<template>
- <Modal
- v-model:open="open"
- title="鐗╂枡浜у搧閫夋嫨"
- width="80%"
- :destroy-on-close="true"
- @ok="handleConfirm"
- @cancel="closeModal"
- >
+ <Modal v-model:open="open"
+ title="鐗╂枡浜у搧閫夋嫨"
+ width="80%"
+ :destroy-on-close="true"
+ @ok="handleConfirm"
+ @cancel="closeModal">
<div class="flex h-full w-full">
<Card class="mr-4 h-full w-1/5">
- <MdItemTypeTree
- ref="typeTreeRef"
- @node-click="handleItemTypeNodeClick"
- />
+ <MdItemTypeTree ref="typeTreeRef"
+ @node-click="handleItemTypeNodeClick" />
</Card>
<div class="w-4/5">
<Grid table-title="鐗╂枡浜у搧鍒楄〃" />
--
Gitblit v1.9.3