407 lines
13 KiB
Vue
407 lines
13 KiB
Vue
|
<template>
|
|||
|
|
<BasicModal
|
|||
|
|
v-bind="$attrs"
|
|||
|
|
title="选择密炼物料"
|
|||
|
|
:width="1180"
|
|||
|
|
:getContainer="getModalContainer"
|
|||
|
|
@register="registerModal"
|
|||
|
|
@ok="handleOk"
|
|||
|
|
>
|
|||
|
|
<div class="mixing-material-picker">
|
|||
|
|
<div class="mixing-material-picker-toolbar">
|
|||
|
|
<a-input
|
|||
|
|
v-model:value="keyword"
|
|||
|
|
allow-clear
|
|||
|
|
placeholder="关键字（物料编码/名称/描述）"
|
|||
|
|
style="width: 280px"
|
|||
|
|
@pressEnter="reloadTable"
|
|||
|
|
/>
|
|||
|
|
<a-button type="primary" @click="reloadTable">搜索</a-button>
|
|||
|
|
<MesXslMixingMaterialCategorySetting
|
|||
|
|
v-model:hiddenCategoryIds="hiddenCategoryIds"
|
|||
|
|
:categories="allMinorCategories"
|
|||
|
|
:loading="treeLoading"
|
|||
|
|
@change="handleCategoryVisibilityChange"
|
|||
|
|
/>
|
|||
|
|
</div>
|
|||
|
|
<div class="mixing-material-picker-body">
|
|||
|
|
<aside class="mixing-material-picker-sider">
|
|||
|
|
<div class="mixing-material-picker-sider-title">物料小类</div>
|
|||
|
|
<Spin :spinning="treeLoading">
|
|||
|
|
<BasicTree
|
|||
|
|
:treeData="visibleCategoryTree"
|
|||
|
|
:selectedKeys="selectedCategoryKeys"
|
|||
|
|
:expandedKeys="expandedCategoryKeys"
|
|||
|
|
defaultExpandLevel="2"
|
|||
|
|
@update:selectedKeys="onCategorySelect"
|
|||
|
|
@update:expandedKeys="onExpandedKeysChange"
|
|||
|
|
/>
|
|||
|
|
</Spin>
|
|||
|
|
</aside>
|
|||
|
|
<div class="mixing-material-picker-main">
|
|||
|
|
<BasicTable @register="registerTable">
|
|||
|
|
<template #bodyCell="{ column, record }">
|
|||
|
|
<template v-if="column.dataIndex === 'pickerWeighMode'">
|
|||
|
|
<div class="mixing-material-picker-weigh-mode" @click.stop>
|
|||
|
|
<JDictSelectTag
|
|||
|
|
:value="getPickerWeighMode(record.id)"
|
|||
|
|
:dictCode="MIXING_MATERIAL_PICKER_WEIGH_MODE_DICT"
|
|||
|
|
:getPopupContainer="getSelectPopupContainer"
|
|||
|
|
:showChooseOption="false"
|
|||
|
|
placeholder="请选择"
|
|||
|
|
popupClassName="mixing-material-picker-weigh-mode-dropdown"
|
|||
|
|
style="width: 100%"
|
|||
|
|
@change="(val) => setPickerWeighMode(record.id, val)"
|
|||
|
|
/>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</template>
|
|||
|
|
</BasicTable>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</BasicModal>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script lang="ts" setup>
|
|||
|
|
import { computed, onMounted, ref, watch } from 'vue';
|
|||
|
|
import { Spin } from 'ant-design-vue';
|
|||
|
|
import { BasicModal, useModalInner } from '/@/components/Modal';
|
|||
|
|
import { BasicTable, useTable } from '/@/components/Table';
|
|||
|
|
import { BasicTree } from '/@/components/Tree';
|
|||
|
|
import { defHttp } from '/@/utils/http/axios';
|
|||
|
|
import { loadMesMaterialCategoryTreeData } from '/@/views/system/category/category.constants';
|
|||
|
|
import { list as mixerList, queryById as queryMixerById } from '/@/views/mes/material/MesMixerMaterial.api';
|
|||
|
|
import { useMessage } from '/@/hooks/web/useMessage';
|
|||
|
|
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
|
|||
|
|
import MesXslMixingMaterialCategorySetting from './MesXslMixingMaterialCategorySetting.vue';
|
|||
|
|
import {
|
|||
|
|
applyMixingMaterialFromSelection,
|
|||
|
|
loadMixingMaterialPickerHiddenCategoryIds,
|
|||
|
|
MIXING_MATERIAL_PICKER_WEIGH_MODE_DICT,
|
|||
|
|
mixingMaterialPickerTableColumns,
|
|||
|
|
resolveMixingMaterialKindForPicker,
|
|||
|
|
sanitizeMixingMaterialPickerHiddenCategoryIds,
|
|||
|
|
saveMixingMaterialPickerHiddenCategoryIds,
|
|||
|
|
type MixingMaterialPickerCategoryItem,
|
|||
|
|
} from '../MesXslMixingSpec.data';
|
|||
|
|
import type { KeyType } from '/@/components/Tree/src/types/tree';
|
|||
|
|
|
|||
|
|
const TREE_ALL = 'ALL';
|
|||
|
|
const emit = defineEmits(['register', 'select']);
|
|||
|
|
const { createMessage } = useMessage();
|
|||
|
|
|
|||
|
|
const keyword = ref('');
|
|||
|
|
const treeLoading = ref(false);
|
|||
|
|
const rawCategoryTree = ref<Recordable[]>([]);
|
|||
|
|
const allMajorCategories = ref<Array<{ id: string; name: string; minors: MixingMaterialPickerCategoryItem[] }>>([]);
|
|||
|
|
const allMinorCategories = ref<MixingMaterialPickerCategoryItem[]>([]);
|
|||
|
|
const hiddenCategoryIds = ref<string[]>(loadMixingMaterialPickerHiddenCategoryIds());
|
|||
|
|
const selectedCategoryKeys = ref<KeyType[]>([TREE_ALL]);
|
|||
|
|
const expandedCategoryKeys = ref<KeyType[]>([TREE_ALL]);
|
|||
|
|
const selectedRow = ref<Recordable | null>(null);
|
|||
|
|
const categoryRubberMap = ref<Record<string, boolean>>({});
|
|||
|
|
const pickerWeighModeMap = ref<Record<string, string>>({});
|
|||
|
|
|
|||
|
|
const hiddenCategoryIdSet = computed(() => new Set(hiddenCategoryIds.value.map(String)));
|
|||
|
|
|
|||
|
|
function getModalContainer() {
|
|||
|
|
return document.body;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function getSelectPopupContainer() {
|
|||
|
|
return document.body;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function filterHiddenCategoryTree(nodes: Recordable[], hidden: Set<string>): Recordable[] {
|
|||
|
|
return (nodes || [])
|
|||
|
|
.map((major) => {
|
|||
|
|
const children = (major.children || [])
|
|||
|
|
.filter((minor) => !hidden.has(String(minor.key)))
|
|||
|
|
.map((minor) => ({
|
|||
|
|
key: minor.key,
|
|||
|
|
title: minor.title,
|
|||
|
|
}));
|
|||
|
|
if (!children.length) {
|
|||
|
|
return null;
|
|||
|
|
}
|
|||
|
|
return {
|
|||
|
|
key: major.key,
|
|||
|
|
title: major.title,
|
|||
|
|
children,
|
|||
|
|
};
|
|||
|
|
})
|
|||
|
|
.filter(Boolean) as Recordable[];
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const visibleCategoryTree = computed(() => [
|
|||
|
|
{
|
|||
|
|
key: TREE_ALL,
|
|||
|
|
title: '全部小类',
|
|||
|
|
children: filterHiddenCategoryTree(rawCategoryTree.value, hiddenCategoryIdSet.value),
|
|||
|
|
},
|
|||
|
|
]);
|
|||
|
|
|
|||
|
|
function syncExpandedCategoryKeys() {
|
|||
|
|
const keys: KeyType[] = [TREE_ALL];
|
|||
|
|
for (const major of visibleCategoryTree.value[0]?.children || []) {
|
|||
|
|
keys.push(major.key);
|
|||
|
|
}
|
|||
|
|
expandedCategoryKeys.value = keys;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
watch(
|
|||
|
|
visibleCategoryTree,
|
|||
|
|
() => {
|
|||
|
|
syncExpandedCategoryKeys();
|
|||
|
|
},
|
|||
|
|
{ deep: true },
|
|||
|
|
);
|
|||
|
|
|
|||
|
|
const selectedCategoryFilter = computed(() => {
|
|||
|
|
const key = selectedCategoryKeys.value[0];
|
|||
|
|
if (!key || key === TREE_ALL) {
|
|||
|
|
return {};
|
|||
|
|
}
|
|||
|
|
const keyStr = String(key);
|
|||
|
|
const major = allMajorCategories.value.find((item) => item.id === keyStr);
|
|||
|
|
if (major) {
|
|||
|
|
return { majorCategoryId: major.id };
|
|||
|
|
}
|
|||
|
|
return { minorCategoryId: keyStr };
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
const [registerTable, { reload, getSelectRowKeys, getSelectRows, clearSelectedRowKeys }] = useTable({
|
|||
|
|
api: mixerList,
|
|||
|
|
columns: mixingMaterialPickerTableColumns,
|
|||
|
|
rowKey: 'id',
|
|||
|
|
useSearchForm: false,
|
|||
|
|
pagination: { pageSize: 10 },
|
|||
|
|
canResize: false,
|
|||
|
|
showIndexColumn: true,
|
|||
|
|
immediate: true,
|
|||
|
|
beforeFetch: (params) => {
|
|||
|
|
const next = { ...params, ...selectedCategoryFilter.value };
|
|||
|
|
const kw = keyword.value?.trim();
|
|||
|
|
if (kw) {
|
|||
|
|
next.materialName = `*${kw}*`;
|
|||
|
|
}
|
|||
|
|
return next;
|
|||
|
|
},
|
|||
|
|
rowSelection: {
|
|||
|
|
type: 'radio',
|
|||
|
|
columnWidth: 48,
|
|||
|
|
onChange: (_keys, rows) => {
|
|||
|
|
selectedRow.value = rows?.[0] ?? null;
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
clickToRowSelect: true,
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
//update-begin---author:cursor ---date:20260525 for：【XSLMES-20260525-A50】选料弹窗打开时初始化（对齐其他SelectModal）-----------
|
|||
|
|
const [registerModal, { setModalProps, closeModal }] = useModalInner(async () => {
|
|||
|
|
await initPickerModal();
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
async function initPickerModal() {
|
|||
|
|
selectedRow.value = null;
|
|||
|
|
keyword.value = '';
|
|||
|
|
pickerWeighModeMap.value = {};
|
|||
|
|
clearSelectedRowKeys?.();
|
|||
|
|
hiddenCategoryIds.value = loadMixingMaterialPickerHiddenCategoryIds();
|
|||
|
|
selectedCategoryKeys.value = [TREE_ALL];
|
|||
|
|
setModalProps({ confirmLoading: false });
|
|||
|
|
await loadMaterialCategoryTree();
|
|||
|
|
reloadTable();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
onMounted(() => {
|
|||
|
|
loadMaterialCategoryTree();
|
|||
|
|
});
|
|||
|
|
//update-end---author:cursor ---date:20260525 for：【XSLMES-20260525-A50】选料弹窗打开时初始化（对齐其他SelectModal）-----------
|
|||
|
|
|
|||
|
|
async function loadMaterialCategoryTree() {
|
|||
|
|
treeLoading.value = true;
|
|||
|
|
try {
|
|||
|
|
const { majors, minors, treeNodes } = await loadMesMaterialCategoryTreeData();
|
|||
|
|
rawCategoryTree.value = treeNodes;
|
|||
|
|
allMajorCategories.value = majors;
|
|||
|
|
allMinorCategories.value = minors;
|
|||
|
|
|
|||
|
|
const sanitizedHidden = sanitizeMixingMaterialPickerHiddenCategoryIds(
|
|||
|
|
minors.map((item) => item.id),
|
|||
|
|
hiddenCategoryIds.value,
|
|||
|
|
);
|
|||
|
|
if (sanitizedHidden.length !== hiddenCategoryIds.value.length) {
|
|||
|
|
hiddenCategoryIds.value = sanitizedHidden;
|
|||
|
|
saveMixingMaterialPickerHiddenCategoryIds(sanitizedHidden);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
categoryRubberMap.value = {};
|
|||
|
|
syncExpandedCategoryKeys();
|
|||
|
|
|
|||
|
|
if (!minors.length) {
|
|||
|
|
createMessage.warning('未加载到物料小类，请确认分类字典根编码 XSLMES_MATERIAL 及其下级分类已配置。');
|
|||
|
|
}
|
|||
|
|
} catch {
|
|||
|
|
rawCategoryTree.value = [];
|
|||
|
|
allMajorCategories.value = [];
|
|||
|
|
allMinorCategories.value = [];
|
|||
|
|
createMessage.warning('加载物料分类树失败，请检查分类根编码 XSLMES_MATERIAL 是否存在。');
|
|||
|
|
} finally {
|
|||
|
|
treeLoading.value = false;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function reloadTable() {
|
|||
|
|
reload();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function getPickerWeighMode(materialId?: string) {
|
|||
|
|
if (!materialId) {
|
|||
|
|
return undefined;
|
|||
|
|
}
|
|||
|
|
return pickerWeighModeMap.value[String(materialId)];
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function setPickerWeighMode(materialId: string | undefined, value?: string) {
|
|||
|
|
if (!materialId) {
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
const key = String(materialId);
|
|||
|
|
const next = { ...pickerWeighModeMap.value };
|
|||
|
|
if (value == null || value === '') {
|
|||
|
|
delete next[key];
|
|||
|
|
} else {
|
|||
|
|
next[key] = String(value);
|
|||
|
|
}
|
|||
|
|
pickerWeighModeMap.value = next;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function onCategorySelect(keys: KeyType[]) {
|
|||
|
|
selectedCategoryKeys.value = keys?.length ? keys : [TREE_ALL];
|
|||
|
|
reloadTable();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function onExpandedKeysChange(keys: KeyType[]) {
|
|||
|
|
expandedCategoryKeys.value = keys?.length ? keys : [TREE_ALL];
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function handleCategoryVisibilityChange() {
|
|||
|
|
const key = selectedCategoryKeys.value[0];
|
|||
|
|
if (!key || key === TREE_ALL) {
|
|||
|
|
syncExpandedCategoryKeys();
|
|||
|
|
reloadTable();
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
const keyStr = String(key);
|
|||
|
|
const hidden = hiddenCategoryIdSet.value;
|
|||
|
|
const major = allMajorCategories.value.find((item) => item.id === keyStr);
|
|||
|
|
if (major) {
|
|||
|
|
const hasVisibleMinor = major.minors.some((minor) => !hidden.has(String(minor.id)));
|
|||
|
|
if (!hasVisibleMinor) {
|
|||
|
|
selectedCategoryKeys.value = [TREE_ALL];
|
|||
|
|
}
|
|||
|
|
} else if (hidden.has(keyStr)) {
|
|||
|
|
selectedCategoryKeys.value = [TREE_ALL];
|
|||
|
|
}
|
|||
|
|
syncExpandedCategoryKeys();
|
|||
|
|
reloadTable();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function resolveKindForMaterial(material: Recordable, weighMode?: string) {
|
|||
|
|
const minorId = material?.minorCategoryId ? String(material.minorCategoryId) : '';
|
|||
|
|
const minorName = material?.minorCategoryId_dictText || '';
|
|||
|
|
if (!minorId) {
|
|||
|
|
return resolveMixingMaterialKindForPicker(weighMode, false, minorName);
|
|||
|
|
}
|
|||
|
|
if (categoryRubberMap.value[minorId] === undefined) {
|
|||
|
|
try {
|
|||
|
|
const cat = await defHttp.get<Recordable>({ url: '/sys/category/queryById', params: { id: minorId } });
|
|||
|
|
categoryRubberMap.value[minorId] = cat?.isRubber === '1' || cat?.isRubber === 1;
|
|||
|
|
} catch {
|
|||
|
|
categoryRubberMap.value[minorId] = false;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return resolveMixingMaterialKindForPicker(
|
|||
|
|
weighMode,
|
|||
|
|
categoryRubberMap.value[minorId] ? '1' : '0',
|
|||
|
|
minorName,
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function handleOk() {
|
|||
|
|
const keys = (getSelectRowKeys?.() || []) as string[];
|
|||
|
|
let row = selectedRow.value || ((getSelectRows?.() || []) as Recordable[])[0];
|
|||
|
|
if (!row && keys.length) {
|
|||
|
|
try {
|
|||
|
|
const raw = await queryMixerById({ id: keys[0] });
|
|||
|
|
row = (raw as any)?.id != null ? raw : (raw as any)?.result;
|
|||
|
|
} catch {
|
|||
|
|
// ignore
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if (!row?.id) {
|
|||
|
|
createMessage.warning('请选择一条密炼物料');
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
const weighMode = getPickerWeighMode(row.id);
|
|||
|
|
const payload: Recordable = { ...row, pickerWeighMode: weighMode };
|
|||
|
|
const materialKind = await resolveKindForMaterial(row, weighMode);
|
|||
|
|
applyMixingMaterialFromSelection(payload, row, materialKind);
|
|||
|
|
emit('select', payload);
|
|||
|
|
closeModal();
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="less" scoped>
|
|||
|
|
.mixing-material-picker {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
gap: 12px;
|
|||
|
|
min-height: 520px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.mixing-material-picker-toolbar {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
gap: 8px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.mixing-material-picker-body {
|
|||
|
|
display: flex;
|
|||
|
|
gap: 12px;
|
|||
|
|
min-height: 480px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.mixing-material-picker-sider {
|
|||
|
|
width: 240px;
|
|||
|
|
flex-shrink: 0;
|
|||
|
|
border: 1px solid var(--border-color-base, #f0f0f0);
|
|||
|
|
border-radius: 4px;
|
|||
|
|
padding: 8px;
|
|||
|
|
overflow: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.mixing-material-picker-sider-title {
|
|||
|
|
font-weight: 600;
|
|||
|
|
margin-bottom: 8px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.mixing-material-picker-main {
|
|||
|
|
flex: 1;
|
|||
|
|
min-width: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.mixing-material-picker-weigh-mode {
|
|||
|
|
min-width: 108px;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
|
|||
|
|
<style lang="less">
|
|||
|
|
/* 下拉挂到 body，避免表格 overflow 裁剪；层级高于 Modal */
|
|||
|
|
.mixing-material-picker-weigh-mode-dropdown {
|
|||
|
|
z-index: 2100 !important;
|
|||
|
|
}
|
|||
|
|
</style>
|