245 lines
7.6 KiB
Vue
245 lines
7.6 KiB
Vue
<template>
|
||
<BasicModal
|
||
v-bind="$attrs"
|
||
title="选取混炼示方"
|
||
:width="960"
|
||
:zIndex="1500"
|
||
:showOkBtn="false"
|
||
:showCancelBtn="false"
|
||
wrapClassName="mixing-spec-picker-modal-wrap"
|
||
@register="registerModal"
|
||
>
|
||
<div class="mixing-spec-picker">
|
||
<div class="mixing-spec-picker-toolbar">
|
||
<span class="mixing-spec-picker-label">关键字</span>
|
||
<a-input
|
||
v-model:value="keyword"
|
||
allow-clear
|
||
placeholder="规格/用途/发行编号/机台"
|
||
style="width: 240px"
|
||
@pressEnter="reloadTable"
|
||
/>
|
||
<span class="mixing-spec-picker-label">机台</span>
|
||
<a-select
|
||
v-model:value="machineId"
|
||
allow-clear
|
||
show-search
|
||
option-filter-prop="label"
|
||
placeholder="==请选择=="
|
||
style="width: 160px"
|
||
:options="machineOptions"
|
||
:loading="machineLoading"
|
||
:getPopupContainer="getSelectPopupContainer"
|
||
popupClassName="mixing-spec-picker-machine-dropdown"
|
||
@click.stop
|
||
/>
|
||
<a-button type="primary" @click="reloadTable">搜索</a-button>
|
||
</div>
|
||
<BasicTable @register="registerTable" />
|
||
</div>
|
||
<template #footer>
|
||
<a-button @click="handleClose">关闭</a-button>
|
||
<a-button type="primary" :loading="confirmLoading" @click="handleConfirm">确认</a-button>
|
||
<a-button type="primary" :loading="referenceLoading" @click="handleReferenceAdd">参照选中示方新增</a-button>
|
||
</template>
|
||
</BasicModal>
|
||
</template>
|
||
|
||
<script lang="ts" setup>
|
||
import { ref } from 'vue';
|
||
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||
import { BasicTable, useTable } from '/@/components/Table';
|
||
import { useMessage } from '/@/hooks/web/useMessage';
|
||
import { list as mixingSpecList, queryById as queryMixingSpecById } from '../MesXslMixingSpec.api';
|
||
import { mixingSpecHistorySelectColumns } from '../MesXslMixingSpec.data';
|
||
import { list as equipmentList } from '/@/views/xslmes/mesXslEquipmentLedger/MesXslEquipmentLedger.api';
|
||
|
||
const emit = defineEmits(['register', 'edit', 'referenceAdd']);
|
||
|
||
const { createMessage } = useMessage();
|
||
|
||
const keyword = ref('');
|
||
const machineId = ref<string | undefined>(undefined);
|
||
const machineOptions = ref<Array<{ label: string; value: string }>>([]);
|
||
const machineLoading = ref(false);
|
||
const confirmLoading = ref(false);
|
||
const referenceLoading = ref(false);
|
||
const selectedRow = ref<Recordable | null>(null);
|
||
|
||
function getSelectPopupContainer() {
|
||
return document.body;
|
||
}
|
||
|
||
const [registerTable, { reload, getSelectRowKeys, getSelectRows, setSelectedRowKeys, clearSelectedRowKeys }] = useTable({
|
||
api: mixingSpecList,
|
||
columns: mixingSpecHistorySelectColumns,
|
||
rowKey: 'id',
|
||
useSearchForm: false,
|
||
pagination: { pageSize: 30 },
|
||
canResize: false,
|
||
showIndexColumn: true,
|
||
immediate: false,
|
||
beforeFetch: (params) => ({
|
||
...params,
|
||
keyword: keyword.value?.trim() || undefined,
|
||
machineId: machineId.value || undefined,
|
||
}),
|
||
rowSelection: {
|
||
type: 'radio',
|
||
columnWidth: 48,
|
||
onChange: (_keys, rows) => {
|
||
selectedRow.value = rows?.[0] ?? null;
|
||
},
|
||
},
|
||
clickToRowSelect: true,
|
||
});
|
||
|
||
async function loadMachineOptions(preset?: { machineId?: string; machineName?: string }) {
|
||
machineLoading.value = true;
|
||
try {
|
||
const optionMap = new Map<string, { label: string; value: string }>();
|
||
//update-begin---author:cursor ---date:20260615 for：【XSLMES-20260615-A02】机台下拉合并设备台账并补全预选机台名称-----------
|
||
const eqRaw = await equipmentList({ pageNo: 1, pageSize: 500 });
|
||
const eqPage = (eqRaw as Recordable)?.records != null ? eqRaw : (eqRaw as Recordable)?.result;
|
||
const eqRecords = ((eqPage?.records || eqPage || []) as Recordable[]).filter(Boolean);
|
||
eqRecords.forEach((row) => {
|
||
if (!row?.id) {
|
||
return;
|
||
}
|
||
const value = String(row.id);
|
||
optionMap.set(value, {
|
||
value,
|
||
label: row.equipmentName || row.equipmentCode || value,
|
||
});
|
||
});
|
||
const raw = await mixingSpecList({ pageNo: 1, pageSize: 500 });
|
||
const page = (raw as Recordable)?.records != null ? raw : (raw as Recordable)?.result;
|
||
const specRecords = ((page?.records || page || []) as Recordable[]).filter(Boolean);
|
||
specRecords.forEach((row) => {
|
||
if (!row?.machineId) {
|
||
return;
|
||
}
|
||
const value = String(row.machineId);
|
||
optionMap.set(value, {
|
||
value,
|
||
label: row.machineName || optionMap.get(value)?.label || value,
|
||
});
|
||
});
|
||
const presetId = preset?.machineId ? String(preset.machineId) : '';
|
||
if (presetId) {
|
||
const presetLabel = preset?.machineName || optionMap.get(presetId)?.label || presetId;
|
||
optionMap.set(presetId, { value: presetId, label: presetLabel });
|
||
}
|
||
//update-end---author:cursor ---date:20260615 for：【XSLMES-20260615-A02】机台下拉合并设备台账并补全预选机台名称-----------
|
||
machineOptions.value = Array.from(optionMap.values()).sort((a, b) =>
|
||
a.label.localeCompare(b.label, 'zh-CN'),
|
||
);
|
||
} catch {
|
||
machineOptions.value = [];
|
||
} finally {
|
||
machineLoading.value = false;
|
||
}
|
||
}
|
||
|
||
function reloadTable() {
|
||
reload();
|
||
}
|
||
|
||
async function resolveSelectedRow(): Promise<Recordable | null> {
|
||
const keys = (getSelectRowKeys?.() || []) as string[];
|
||
let row = selectedRow.value || ((getSelectRows?.() || []) as Recordable[])[0];
|
||
if (!row?.id && keys.length) {
|
||
try {
|
||
const raw = await queryMixingSpecById({ id: keys[0] });
|
||
row = (raw as Recordable)?.specName != null ? raw : (raw as Recordable)?.result;
|
||
} catch {
|
||
row = null;
|
||
}
|
||
}
|
||
return row?.id ? row : null;
|
||
}
|
||
|
||
function handleClose() {
|
||
closeModal();
|
||
}
|
||
|
||
async function handleConfirm() {
|
||
const row = await resolveSelectedRow();
|
||
if (!row) {
|
||
createMessage.warning('请选择一条混炼示方');
|
||
return;
|
||
}
|
||
confirmLoading.value = true;
|
||
try {
|
||
emit('edit', {
|
||
mixingSpecId: row.id,
|
||
specName: row.specName || '',
|
||
});
|
||
closeModal();
|
||
} finally {
|
||
confirmLoading.value = false;
|
||
}
|
||
}
|
||
|
||
async function handleReferenceAdd() {
|
||
const row = await resolveSelectedRow();
|
||
if (!row) {
|
||
createMessage.warning('请选择一条混炼示方');
|
||
return;
|
||
}
|
||
referenceLoading.value = true;
|
||
try {
|
||
emit('referenceAdd', {
|
||
mixingSpecId: row.id,
|
||
specName: row.specName || '',
|
||
});
|
||
closeModal();
|
||
} finally {
|
||
referenceLoading.value = false;
|
||
}
|
||
}
|
||
|
||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
||
keyword.value = '';
|
||
machineId.value = data?.machineId || undefined;
|
||
selectedRow.value = null;
|
||
confirmLoading.value = false;
|
||
referenceLoading.value = false;
|
||
clearSelectedRowKeys?.();
|
||
setModalProps({ confirmLoading: false });
|
||
await loadMachineOptions({
|
||
machineId: data?.machineId || undefined,
|
||
machineName: data?.machineName || undefined,
|
||
});
|
||
reload();
|
||
});
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
.mixing-spec-picker-toolbar {
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
gap: 8px;
|
||
margin-bottom: 12px;
|
||
}
|
||
|
||
.mixing-spec-picker-label {
|
||
color: #333;
|
||
font-size: 13px;
|
||
white-space: nowrap;
|
||
}
|
||
</style>
|
||
|
||
<style lang="less">
|
||
.mixing-spec-picker-modal-wrap {
|
||
.ant-modal {
|
||
top: 40px;
|
||
}
|
||
}
|
||
|
||
.mixing-spec-picker-machine-dropdown {
|
||
z-index: 2100 !important;
|
||
}
|
||
</style>
|