<script lang="ts" setup>
|
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
|
import type { MesWmProductIssueLineApi } from '#/api/mes/wm/productissue/line';
|
|
import { nextTick, ref } from 'vue';
|
|
import { message, Modal } from 'ant-design-vue';
|
|
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
import { getReturnableIssueLines } from '#/api/mes/wm/productissue/line';
|
|
const props = defineProps<{
|
workOrderId?: number;
|
}>();
|
|
const emit = defineEmits<{
|
selected: [rows: MesWmProductIssueLineApi.ProductIssueLine[]];
|
}>();
|
|
const open = ref(false);
|
const selectedRows = ref<MesWmProductIssueLineApi.ProductIssueLine[]>([]);
|
|
const columns: VxeTableGridOptions<MesWmProductIssueLineApi.ProductIssueLine>['columns'] = [
|
{ type: 'radio', width: 60 },
|
{ field: 'itemCode', title: '物料编码', minWidth: 120 },
|
{ field: 'itemName', title: '物料名称', minWidth: 140 },
|
{ field: 'specification', title: '规格型号', minWidth: 120 },
|
{ field: 'unitMeasureName', title: '单位', width: 80 },
|
{ field: 'quantity', title: '可退数量', width: 100 },
|
{ field: 'batchCode', title: '批次号', minWidth: 120 },
|
];
|
|
const [Grid, gridApi] = useVbenVxeGrid({
|
gridOptions: {
|
columns,
|
height: 480,
|
keepSource: true,
|
radioConfig: { highlight: true, trigger: 'row' },
|
proxyConfig: {
|
ajax: {
|
query: async () => {
|
if (!props.workOrderId) {
|
return { list: [], total: 0 };
|
}
|
const list = await getReturnableIssueLines(props.workOrderId);
|
return { list, total: list.length };
|
},
|
},
|
},
|
rowConfig: {
|
keyField: 'id',
|
isHover: true,
|
},
|
toolbarConfig: {
|
refresh: true,
|
},
|
} as VxeTableGridOptions<MesWmProductIssueLineApi.ProductIssueLine>,
|
gridEvents: {
|
radioChange: ({ row }: { row: MesWmProductIssueLineApi.ProductIssueLine }) => {
|
selectedRows.value = [row];
|
},
|
cellDblclick: async ({ row }: { row: MesWmProductIssueLineApi.ProductIssueLine }) => {
|
selectedRows.value = [row];
|
await gridApi.grid.setRadioRow(row);
|
handleConfirm();
|
},
|
},
|
});
|
|
async function openModal() {
|
open.value = true;
|
selectedRows.value = [];
|
await nextTick();
|
await gridApi.grid.clearRadioRow();
|
await gridApi.query();
|
}
|
|
function closeModal() {
|
open.value = false;
|
selectedRows.value = [];
|
}
|
|
function handleConfirm() {
|
if (selectedRows.value.length === 0) {
|
message.warning('请选择一条领料记录');
|
return;
|
}
|
emit('selected', selectedRows.value);
|
open.value = false;
|
}
|
|
defineExpose({ open: openModal });
|
</script>
|
|
<template>
|
<Modal
|
v-model:open="open"
|
:destroy-on-close="true"
|
title="选择领料记录"
|
width="70%"
|
@cancel="closeModal"
|
@ok="handleConfirm"
|
>
|
<Grid table-title="可退料的领料记录" />
|
</Modal>
|
</template>
|