feat(mes-qc): 迁移 antd 来料检验及检测结果、缺陷记录组件(代码优化)
parent
abc8789fe3
commit
cea628b1a1
|
|
@ -16,6 +16,13 @@ export namespace MesQcDefectRecordApi {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** 查询质检缺陷记录 */
|
||||||
|
export function getDefectRecord(id: number) {
|
||||||
|
return requestClient.get<MesQcDefectRecordApi.DefectRecord>(
|
||||||
|
`/mes/qc/defect-record/get?id=${id}`,
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
/** 查询质检缺陷记录分页 */
|
/** 查询质检缺陷记录分页 */
|
||||||
export function getDefectRecordPage(
|
export function getDefectRecordPage(
|
||||||
params: PageParam & { lineId?: number; qcId?: number; qcType?: number; },
|
params: PageParam & { lineId?: number; qcId?: number; qcType?: number; },
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,93 @@
|
||||||
|
import type { VbenFormSchema } from '#/adapter/form';
|
||||||
|
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
|
||||||
|
import type { MesQcDefectRecordApi } from '#/api/mes/qc/defectrecord';
|
||||||
|
|
||||||
|
import { DICT_TYPE } from '@vben/constants';
|
||||||
|
import { getDictOptions } from '@vben/hooks';
|
||||||
|
|
||||||
|
/** 表单类型 */
|
||||||
|
export type FormType = 'create' | 'update';
|
||||||
|
|
||||||
|
/** 新增/修改缺陷记录的表单 */
|
||||||
|
export function useDefectRecordInlineFormSchema(): VbenFormSchema[] {
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
fieldName: 'name',
|
||||||
|
label: '缺陷描述',
|
||||||
|
component: 'Textarea',
|
||||||
|
formItemClass: 'col-span-2',
|
||||||
|
componentProps: {
|
||||||
|
placeholder: '请输入缺陷描述',
|
||||||
|
rows: 2,
|
||||||
|
},
|
||||||
|
rules: 'required',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
fieldName: 'level',
|
||||||
|
label: '缺陷等级',
|
||||||
|
component: 'Select',
|
||||||
|
componentProps: {
|
||||||
|
allowClear: true,
|
||||||
|
options: getDictOptions(DICT_TYPE.MES_DEFECT_LEVEL, 'number'),
|
||||||
|
placeholder: '请选择缺陷等级',
|
||||||
|
},
|
||||||
|
rules: 'selectRequired',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
fieldName: 'quantity',
|
||||||
|
label: '缺陷数量',
|
||||||
|
component: 'InputNumber',
|
||||||
|
componentProps: {
|
||||||
|
class: '!w-full',
|
||||||
|
min: 1,
|
||||||
|
placeholder: '请输入缺陷数量',
|
||||||
|
},
|
||||||
|
rules: 'required',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
fieldName: 'remark',
|
||||||
|
label: '备注',
|
||||||
|
component: 'Input',
|
||||||
|
formItemClass: 'col-span-2',
|
||||||
|
componentProps: {
|
||||||
|
placeholder: '请输入备注',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 缺陷记录列表的字段 */
|
||||||
|
export function useDefectRecordInlineGridColumns(): VxeTableGridOptions<MesQcDefectRecordApi.DefectRecord>['columns'] {
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
field: 'name',
|
||||||
|
title: '缺陷描述',
|
||||||
|
minWidth: 200,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'level',
|
||||||
|
title: '缺陷等级',
|
||||||
|
width: 120,
|
||||||
|
cellRender: {
|
||||||
|
name: 'CellDict',
|
||||||
|
props: { type: DICT_TYPE.MES_DEFECT_LEVEL },
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'quantity',
|
||||||
|
title: '缺陷数量',
|
||||||
|
width: 100,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'remark',
|
||||||
|
title: '备注',
|
||||||
|
minWidth: 150,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '操作',
|
||||||
|
width: 130,
|
||||||
|
fixed: 'right',
|
||||||
|
slots: { default: 'actions' },
|
||||||
|
},
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
@ -1,11 +1,11 @@
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
|
import type { FormType } from './data';
|
||||||
|
|
||||||
import type { MesQcDefectRecordApi } from '#/api/mes/qc/defectrecord';
|
import type { MesQcDefectRecordApi } from '#/api/mes/qc/defectrecord';
|
||||||
|
|
||||||
import { computed, ref } from 'vue';
|
import { computed, ref } from 'vue';
|
||||||
|
|
||||||
import { useVbenModal } from '@vben/common-ui';
|
import { useVbenModal } from '@vben/common-ui';
|
||||||
import { DICT_TYPE } from '@vben/constants';
|
|
||||||
import { getDictOptions } from '@vben/hooks';
|
|
||||||
|
|
||||||
import { message } from 'ant-design-vue';
|
import { message } from 'ant-design-vue';
|
||||||
|
|
||||||
|
|
@ -17,8 +17,10 @@ import {
|
||||||
} from '#/api/mes/qc/defectrecord';
|
} from '#/api/mes/qc/defectrecord';
|
||||||
import { $t } from '#/locales';
|
import { $t } from '#/locales';
|
||||||
|
|
||||||
interface OpenData {
|
import { useDefectRecordInlineFormSchema } from './data';
|
||||||
formType: 'create' | 'update';
|
|
||||||
|
interface CtxData {
|
||||||
|
formType: FormType;
|
||||||
id?: number;
|
id?: number;
|
||||||
lineId: number;
|
lineId: number;
|
||||||
qcId: number;
|
qcId: number;
|
||||||
|
|
@ -28,8 +30,7 @@ interface OpenData {
|
||||||
defineOptions({ name: 'DefectRecordInlineForm' });
|
defineOptions({ name: 'DefectRecordInlineForm' });
|
||||||
|
|
||||||
const emit = defineEmits(['success']);
|
const emit = defineEmits(['success']);
|
||||||
// TODO @AI:这里,别的模块,一般是要枚举 create、update 么?
|
const formType = ref<FormType>('create');
|
||||||
const formType = ref<'create' | 'update'>('create');
|
|
||||||
const formData = ref<MesQcDefectRecordApi.DefectRecord>();
|
const formData = ref<MesQcDefectRecordApi.DefectRecord>();
|
||||||
|
|
||||||
const getTitle = computed(() =>
|
const getTitle = computed(() =>
|
||||||
|
|
@ -38,8 +39,6 @@ const getTitle = computed(() =>
|
||||||
: $t('ui.actionTitle.create', ['缺陷记录']),
|
: $t('ui.actionTitle.create', ['缺陷记录']),
|
||||||
);
|
);
|
||||||
|
|
||||||
// TODO @AI:搞个 data.ts?
|
|
||||||
// TODO @AI:代码风格,貌似不够一致;
|
|
||||||
const [Form, formApi] = useVbenForm({
|
const [Form, formApi] = useVbenForm({
|
||||||
commonConfig: {
|
commonConfig: {
|
||||||
componentProps: {
|
componentProps: {
|
||||||
|
|
@ -49,50 +48,7 @@ const [Form, formApi] = useVbenForm({
|
||||||
labelWidth: 90,
|
labelWidth: 90,
|
||||||
},
|
},
|
||||||
layout: 'horizontal',
|
layout: 'horizontal',
|
||||||
schema: [
|
schema: useDefectRecordInlineFormSchema(),
|
||||||
{
|
|
||||||
fieldName: 'name',
|
|
||||||
label: '缺陷描述',
|
|
||||||
component: 'Textarea',
|
|
||||||
formItemClass: 'col-span-2',
|
|
||||||
componentProps: {
|
|
||||||
placeholder: '请输入缺陷描述',
|
|
||||||
rows: 2,
|
|
||||||
},
|
|
||||||
rules: 'required',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fieldName: 'level',
|
|
||||||
label: '缺陷等级',
|
|
||||||
component: 'Select',
|
|
||||||
componentProps: {
|
|
||||||
allowClear: true,
|
|
||||||
options: getDictOptions(DICT_TYPE.MES_DEFECT_LEVEL, 'number'),
|
|
||||||
placeholder: '请选择缺陷等级',
|
|
||||||
},
|
|
||||||
rules: 'selectRequired',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fieldName: 'quantity',
|
|
||||||
label: '缺陷数量',
|
|
||||||
component: 'InputNumber',
|
|
||||||
componentProps: {
|
|
||||||
class: '!w-full',
|
|
||||||
min: 1,
|
|
||||||
placeholder: '请输入缺陷数量',
|
|
||||||
},
|
|
||||||
rules: 'required',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fieldName: 'remark',
|
|
||||||
label: '备注',
|
|
||||||
component: 'Input',
|
|
||||||
formItemClass: 'col-span-2',
|
|
||||||
componentProps: {
|
|
||||||
placeholder: '请输入备注',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
],
|
|
||||||
showDefaultActions: false,
|
showDefaultActions: false,
|
||||||
wrapperClass: 'grid-cols-2',
|
wrapperClass: 'grid-cols-2',
|
||||||
});
|
});
|
||||||
|
|
@ -107,7 +63,7 @@ const [Modal, modalApi] = useVbenModal({
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
modalApi.lock();
|
modalApi.lock();
|
||||||
try {
|
// 提交表单
|
||||||
const values =
|
const values =
|
||||||
(await formApi.getValues()) as MesQcDefectRecordApi.DefectRecord;
|
(await formApi.getValues()) as MesQcDefectRecordApi.DefectRecord;
|
||||||
const payload: MesQcDefectRecordApi.DefectRecord = {
|
const payload: MesQcDefectRecordApi.DefectRecord = {
|
||||||
|
|
@ -116,6 +72,7 @@ const [Modal, modalApi] = useVbenModal({
|
||||||
qcId: formData.value.qcId,
|
qcId: formData.value.qcId,
|
||||||
qcType: formData.value.qcType,
|
qcType: formData.value.qcType,
|
||||||
};
|
};
|
||||||
|
try {
|
||||||
if (formType.value === 'update') {
|
if (formType.value === 'update') {
|
||||||
await updateDefectRecord({ ...payload, id: formData.value.id });
|
await updateDefectRecord({ ...payload, id: formData.value.id });
|
||||||
message.success($t('common.updateSuccess'));
|
message.success($t('common.updateSuccess'));
|
||||||
|
|
@ -123,6 +80,7 @@ const [Modal, modalApi] = useVbenModal({
|
||||||
await createDefectRecord(payload);
|
await createDefectRecord(payload);
|
||||||
message.success($t('common.createSuccess'));
|
message.success($t('common.createSuccess'));
|
||||||
}
|
}
|
||||||
|
// 关闭并提示
|
||||||
await modalApi.close();
|
await modalApi.close();
|
||||||
emit('success');
|
emit('success');
|
||||||
} finally {
|
} finally {
|
||||||
|
|
@ -134,18 +92,10 @@ const [Modal, modalApi] = useVbenModal({
|
||||||
formData.value = undefined;
|
formData.value = undefined;
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const data = modalApi.getData<OpenData>();
|
// 加载数据
|
||||||
|
const data = modalApi.getData<CtxData>();
|
||||||
formType.value = data.formType;
|
formType.value = data.formType;
|
||||||
if (data.id) {
|
if (!data.id) {
|
||||||
// 编辑:根据 id 加载明细
|
|
||||||
modalApi.lock();
|
|
||||||
try {
|
|
||||||
formData.value = await getDefectRecord(data.id);
|
|
||||||
await formApi.setValues(formData.value);
|
|
||||||
} finally {
|
|
||||||
modalApi.unlock();
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
// 新增:保留来自父级的上下文,并默认数量为 1
|
// 新增:保留来自父级的上下文,并默认数量为 1
|
||||||
formData.value = {
|
formData.value = {
|
||||||
lineId: data.lineId,
|
lineId: data.lineId,
|
||||||
|
|
@ -153,6 +103,15 @@ const [Modal, modalApi] = useVbenModal({
|
||||||
qcType: data.qcType,
|
qcType: data.qcType,
|
||||||
};
|
};
|
||||||
await formApi.setValues({ quantity: 1 });
|
await formApi.setValues({ quantity: 1 });
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
modalApi.lock();
|
||||||
|
try {
|
||||||
|
formData.value = await getDefectRecord(data.id);
|
||||||
|
// 设置到 values
|
||||||
|
await formApi.setValues(formData.value);
|
||||||
|
} finally {
|
||||||
|
modalApi.unlock();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -5,7 +5,6 @@ import type { MesQcDefectRecordApi } from '#/api/mes/qc/defectrecord';
|
||||||
import { computed, ref } from 'vue';
|
import { computed, ref } from 'vue';
|
||||||
|
|
||||||
import { useVbenModal } from '@vben/common-ui';
|
import { useVbenModal } from '@vben/common-ui';
|
||||||
import { DICT_TYPE } from '@vben/constants';
|
|
||||||
|
|
||||||
import { message } from 'ant-design-vue';
|
import { message } from 'ant-design-vue';
|
||||||
|
|
||||||
|
|
@ -16,22 +15,22 @@ import {
|
||||||
} from '#/api/mes/qc/defectrecord';
|
} from '#/api/mes/qc/defectrecord';
|
||||||
import { $t } from '#/locales';
|
import { $t } from '#/locales';
|
||||||
|
|
||||||
|
import { useDefectRecordInlineGridColumns } from './data';
|
||||||
import DefectRecordInlineForm from './defect-record-inline-form.vue';
|
import DefectRecordInlineForm from './defect-record-inline-form.vue';
|
||||||
|
|
||||||
defineOptions({ name: 'DefectRecordInlineList' });
|
defineOptions({ name: 'DefectRecordInlineList' });
|
||||||
|
|
||||||
const emit = defineEmits(['success']);
|
const emit = defineEmits(['success']);
|
||||||
|
|
||||||
// TODO @AI:改成 QcData???
|
interface CtxData {
|
||||||
interface OpenData {
|
|
||||||
formType?: string;
|
formType?: string;
|
||||||
lineId: number;
|
lineId: number;
|
||||||
qcId: number;
|
qcId: number;
|
||||||
qcType: number;
|
qcType: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
const qcData = ref<OpenData>();
|
const ctxData = ref<CtxData>();
|
||||||
const isReadonly = computed(() => qcData.value?.formType === 'detail');
|
const isReadonly = computed(() => ctxData.value?.formType === 'detail');
|
||||||
|
|
||||||
/** 刷新表格 */
|
/** 刷新表格 */
|
||||||
function handleRefresh() {
|
function handleRefresh() {
|
||||||
|
|
@ -46,31 +45,31 @@ const [FormModal, formModalApi] = useVbenModal({
|
||||||
|
|
||||||
/** 新增缺陷 */
|
/** 新增缺陷 */
|
||||||
function handleCreate() {
|
function handleCreate() {
|
||||||
if (!qcData.value) {
|
if (!ctxData.value) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
formModalApi
|
formModalApi
|
||||||
.setData({
|
.setData({
|
||||||
formType: 'create',
|
formType: 'create',
|
||||||
lineId: qcData.value.lineId,
|
lineId: ctxData.value.lineId,
|
||||||
qcId: qcData.value.qcId,
|
qcId: ctxData.value.qcId,
|
||||||
qcType: qcData.value.qcType,
|
qcType: ctxData.value.qcType,
|
||||||
})
|
})
|
||||||
.open();
|
.open();
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 编辑缺陷 */
|
/** 编辑缺陷 */
|
||||||
function handleEdit(row: MesQcDefectRecordApi.DefectRecord) {
|
function handleEdit(row: MesQcDefectRecordApi.DefectRecord) {
|
||||||
if (!qcData.value) {
|
if (!ctxData.value) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
formModalApi
|
formModalApi
|
||||||
.setData({
|
.setData({
|
||||||
formType: 'update',
|
formType: 'update',
|
||||||
id: row.id,
|
id: row.id,
|
||||||
lineId: qcData.value.lineId,
|
lineId: ctxData.value.lineId,
|
||||||
qcId: qcData.value.qcId,
|
qcId: ctxData.value.qcId,
|
||||||
qcType: qcData.value.qcType,
|
qcType: ctxData.value.qcType,
|
||||||
})
|
})
|
||||||
.open();
|
.open();
|
||||||
}
|
}
|
||||||
|
|
@ -90,55 +89,22 @@ async function handleDelete(row: MesQcDefectRecordApi.DefectRecord) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// TODO @AI:搞个 data.ts?
|
|
||||||
// TODO @AI:代码风格,貌似不够一致;
|
|
||||||
const [Grid, gridApi] = useVbenVxeGrid({
|
const [Grid, gridApi] = useVbenVxeGrid({
|
||||||
gridOptions: {
|
gridOptions: {
|
||||||
columns: [
|
columns: useDefectRecordInlineGridColumns(),
|
||||||
{
|
|
||||||
field: 'name',
|
|
||||||
title: '缺陷描述',
|
|
||||||
minWidth: 200,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
field: 'level',
|
|
||||||
title: '缺陷等级',
|
|
||||||
width: 120,
|
|
||||||
cellRender: {
|
|
||||||
name: 'CellDict',
|
|
||||||
props: { type: DICT_TYPE.MES_DEFECT_LEVEL },
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
field: 'quantity',
|
|
||||||
title: '缺陷数量',
|
|
||||||
width: 100,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
field: 'remark',
|
|
||||||
title: '备注',
|
|
||||||
minWidth: 150,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '操作',
|
|
||||||
width: 130,
|
|
||||||
fixed: 'right',
|
|
||||||
slots: { default: 'actions' },
|
|
||||||
},
|
|
||||||
],
|
|
||||||
height: 320,
|
height: 320,
|
||||||
proxyConfig: {
|
proxyConfig: {
|
||||||
ajax: {
|
ajax: {
|
||||||
query: async ({ page }) => {
|
query: async ({ page }) => {
|
||||||
if (!qcData.value) {
|
if (!ctxData.value) {
|
||||||
return { list: [], total: 0 };
|
return { list: [], total: 0 };
|
||||||
}
|
}
|
||||||
return await getDefectRecordPage({
|
return await getDefectRecordPage({
|
||||||
lineId: qcData.value.lineId,
|
lineId: ctxData.value.lineId,
|
||||||
pageNo: page.currentPage,
|
pageNo: page.currentPage,
|
||||||
pageSize: page.pageSize,
|
pageSize: page.pageSize,
|
||||||
qcId: qcData.value.qcId,
|
qcId: ctxData.value.qcId,
|
||||||
qcType: qcData.value.qcType,
|
qcType: ctxData.value.qcType,
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
@ -158,10 +124,10 @@ const [Modal, modalApi] = useVbenModal({
|
||||||
showConfirmButton: false,
|
showConfirmButton: false,
|
||||||
async onOpenChange(isOpen: boolean) {
|
async onOpenChange(isOpen: boolean) {
|
||||||
if (!isOpen) {
|
if (!isOpen) {
|
||||||
qcData.value = undefined;
|
ctxData.value = undefined;
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
qcData.value = modalApi.getData<OpenData>();
|
ctxData.value = modalApi.getData<CtxData>();
|
||||||
await gridApi.query();
|
await gridApi.query();
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,89 @@
|
||||||
|
import type { VbenFormApi, VbenFormSchema } from '#/adapter/form';
|
||||||
|
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
|
||||||
|
import type { MesQcIndicatorResultApi } from '#/api/mes/qc/indicatorresult';
|
||||||
|
|
||||||
|
import { h } from 'vue';
|
||||||
|
|
||||||
|
import { Button } from 'ant-design-vue';
|
||||||
|
|
||||||
|
import { generateAutoCode } from '#/api/mes/md/autocode/record';
|
||||||
|
import { MesAutoCodeRuleCode } from '#/views/mes/utils/constants';
|
||||||
|
|
||||||
|
/** 表单类型 */
|
||||||
|
export type FormType = 'create' | 'update';
|
||||||
|
|
||||||
|
/** 新增/修改检测结果的表单 */
|
||||||
|
export function useQcIndicatorResultFormSchema(
|
||||||
|
formApi?: VbenFormApi,
|
||||||
|
): VbenFormSchema[] {
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
fieldName: 'id',
|
||||||
|
component: 'Input',
|
||||||
|
dependencies: {
|
||||||
|
triggerFields: [''],
|
||||||
|
show: () => false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
fieldName: 'code',
|
||||||
|
label: '样品编号',
|
||||||
|
component: 'Input',
|
||||||
|
componentProps: {
|
||||||
|
placeholder: '请输入样品编号',
|
||||||
|
},
|
||||||
|
rules: 'required',
|
||||||
|
suffix: () =>
|
||||||
|
h(
|
||||||
|
Button,
|
||||||
|
{
|
||||||
|
type: 'default',
|
||||||
|
onClick: async () => {
|
||||||
|
try {
|
||||||
|
const code = await generateAutoCode(
|
||||||
|
MesAutoCodeRuleCode.QC_INDICATOR_RESULT_CODE,
|
||||||
|
);
|
||||||
|
await formApi?.setFieldValue('code', code);
|
||||||
|
} catch (error) {
|
||||||
|
console.error(error);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{ default: () => '生成' },
|
||||||
|
),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
fieldName: 'sn',
|
||||||
|
label: '物资 SN',
|
||||||
|
component: 'Input',
|
||||||
|
componentProps: {
|
||||||
|
placeholder: '请输入物资 SN',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
fieldName: 'remark',
|
||||||
|
label: '备注',
|
||||||
|
component: 'Textarea',
|
||||||
|
formItemClass: 'col-span-2',
|
||||||
|
componentProps: {
|
||||||
|
placeholder: '请输入备注',
|
||||||
|
rows: 2,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 检测结果列表的字段 */
|
||||||
|
export function useQcIndicatorResultGridColumns(): VxeTableGridOptions<MesQcIndicatorResultApi.IndicatorResult>['columns'] {
|
||||||
|
return [
|
||||||
|
{ field: 'code', title: '样品编号', width: 200 },
|
||||||
|
{ field: 'sn', title: '物资SN', minWidth: 200 },
|
||||||
|
{ field: 'remark', title: '备注', minWidth: 200 },
|
||||||
|
{
|
||||||
|
title: '操作',
|
||||||
|
width: 150,
|
||||||
|
fixed: 'right',
|
||||||
|
slots: { default: 'actions' },
|
||||||
|
},
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
@ -1,13 +1,14 @@
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
|
import type { FormType } from './data';
|
||||||
|
|
||||||
import type { MesQcIndicatorResultApi } from '#/api/mes/qc/indicatorresult';
|
import type { MesQcIndicatorResultApi } from '#/api/mes/qc/indicatorresult';
|
||||||
|
|
||||||
import { computed, h, ref } from 'vue';
|
import { computed, ref } from 'vue';
|
||||||
|
|
||||||
import { useVbenModal } from '@vben/common-ui';
|
import { useVbenModal } from '@vben/common-ui';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
Form as AForm,
|
Form as AForm,
|
||||||
Button,
|
|
||||||
Divider,
|
Divider,
|
||||||
Input,
|
Input,
|
||||||
InputNumber,
|
InputNumber,
|
||||||
|
|
@ -17,29 +18,29 @@ import {
|
||||||
} from 'ant-design-vue';
|
} from 'ant-design-vue';
|
||||||
|
|
||||||
import { useVbenForm } from '#/adapter/form';
|
import { useVbenForm } from '#/adapter/form';
|
||||||
import { generateAutoCode } from '#/api/mes/md/autocode/record';
|
|
||||||
import {
|
import {
|
||||||
createIndicatorResult,
|
createIndicatorResult,
|
||||||
getIndicatorResultDetail,
|
getIndicatorResultDetail,
|
||||||
updateIndicatorResult,
|
updateIndicatorResult,
|
||||||
} from '#/api/mes/qc/indicatorresult';
|
} from '#/api/mes/qc/indicatorresult';
|
||||||
import { $t } from '#/locales';
|
import { $t } from '#/locales';
|
||||||
import {
|
import { MesQcResultValueType } from '#/views/mes/utils/constants';
|
||||||
MesAutoCodeRuleCode,
|
|
||||||
MesQcResultValueType,
|
|
||||||
} from '#/views/mes/utils/constants';
|
|
||||||
|
|
||||||
interface OpenData {
|
import { useQcIndicatorResultFormSchema } from './data';
|
||||||
formType: 'create' | 'update';
|
|
||||||
|
interface CtxData {
|
||||||
|
formType: FormType;
|
||||||
id?: number;
|
id?: number;
|
||||||
qcId: number;
|
qcId: number;
|
||||||
qcType: number;
|
qcType: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
defineOptions({ name: 'QcIndicatorResultForm' });
|
||||||
|
|
||||||
const emit = defineEmits(['success']);
|
const emit = defineEmits(['success']);
|
||||||
const formType = ref<'create' | 'update'>('create');
|
const formType = ref<FormType>('create');
|
||||||
const items = ref<MesQcIndicatorResultApi.IndicatorResultDetail[]>([]);
|
const items = ref<MesQcIndicatorResultApi.IndicatorResultDetail[]>([]);
|
||||||
const ctxData = ref<OpenData>();
|
const ctxData = ref<CtxData>();
|
||||||
|
|
||||||
const getTitle = computed(() =>
|
const getTitle = computed(() =>
|
||||||
formType.value === 'update'
|
formType.value === 'update'
|
||||||
|
|
@ -55,66 +56,10 @@ const [Form, formApi] = useVbenForm({
|
||||||
formItemClass: 'col-span-1',
|
formItemClass: 'col-span-1',
|
||||||
labelWidth: 100,
|
labelWidth: 100,
|
||||||
},
|
},
|
||||||
wrapperClass: 'grid-cols-2',
|
|
||||||
layout: 'horizontal',
|
layout: 'horizontal',
|
||||||
// TODO @AI:搞个 data.ts?
|
schema: [],
|
||||||
// TODO @AI:代码风格,貌似不够一致;
|
|
||||||
schema: [
|
|
||||||
{
|
|
||||||
fieldName: 'id',
|
|
||||||
component: 'Input',
|
|
||||||
dependencies: {
|
|
||||||
triggerFields: [''],
|
|
||||||
show: () => false,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fieldName: 'code',
|
|
||||||
label: '样品编号',
|
|
||||||
component: 'Input',
|
|
||||||
componentProps: {
|
|
||||||
placeholder: '请输入样品编号',
|
|
||||||
},
|
|
||||||
rules: 'required',
|
|
||||||
suffix: () =>
|
|
||||||
h(
|
|
||||||
Button,
|
|
||||||
{
|
|
||||||
type: 'default',
|
|
||||||
onClick: async () => {
|
|
||||||
try {
|
|
||||||
const code = await generateAutoCode(
|
|
||||||
MesAutoCodeRuleCode.QC_INDICATOR_RESULT_CODE,
|
|
||||||
);
|
|
||||||
await formApi.setFieldValue('code', code);
|
|
||||||
} catch (error) {
|
|
||||||
console.error(error);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{ default: () => '生成' },
|
|
||||||
),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fieldName: 'sn',
|
|
||||||
label: '物资 SN',
|
|
||||||
component: 'Input',
|
|
||||||
componentProps: {
|
|
||||||
placeholder: '请输入物资 SN',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fieldName: 'remark',
|
|
||||||
label: '备注',
|
|
||||||
component: 'Textarea',
|
|
||||||
formItemClass: 'col-span-2',
|
|
||||||
componentProps: {
|
|
||||||
placeholder: '请输入备注',
|
|
||||||
rows: 2,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
],
|
|
||||||
showDefaultActions: false,
|
showDefaultActions: false,
|
||||||
|
wrapperClass: 'grid-cols-2',
|
||||||
});
|
});
|
||||||
|
|
||||||
/** 解析字典选项字符串:value=label;value=label */
|
/** 解析字典选项字符串:value=label;value=label */
|
||||||
|
|
@ -132,7 +77,6 @@ function parseValueOptions(spec?: string) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// TODO @AI:注释风格的统一;
|
|
||||||
const [Modal, modalApi] = useVbenModal({
|
const [Modal, modalApi] = useVbenModal({
|
||||||
async onConfirm() {
|
async onConfirm() {
|
||||||
if (!ctxData.value) {
|
if (!ctxData.value) {
|
||||||
|
|
@ -143,8 +87,9 @@ const [Modal, modalApi] = useVbenModal({
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
modalApi.lock();
|
modalApi.lock();
|
||||||
try {
|
// 提交表单
|
||||||
const head = (await formApi.getValues()) as MesQcIndicatorResultApi.IndicatorResult;
|
const head =
|
||||||
|
(await formApi.getValues()) as MesQcIndicatorResultApi.IndicatorResult;
|
||||||
const submitItems = items.value.map((item) => {
|
const submitItems = items.value.map((item) => {
|
||||||
const submit: MesQcIndicatorResultApi.IndicatorResultDetail = {
|
const submit: MesQcIndicatorResultApi.IndicatorResultDetail = {
|
||||||
id: item.id,
|
id: item.id,
|
||||||
|
|
@ -164,10 +109,11 @@ const [Modal, modalApi] = useVbenModal({
|
||||||
});
|
});
|
||||||
const payload: MesQcIndicatorResultApi.IndicatorResult = {
|
const payload: MesQcIndicatorResultApi.IndicatorResult = {
|
||||||
...head,
|
...head,
|
||||||
|
items: submitItems,
|
||||||
qcId: ctxData.value.qcId,
|
qcId: ctxData.value.qcId,
|
||||||
qcType: ctxData.value.qcType,
|
qcType: ctxData.value.qcType,
|
||||||
items: submitItems,
|
|
||||||
};
|
};
|
||||||
|
try {
|
||||||
if (formType.value === 'update') {
|
if (formType.value === 'update') {
|
||||||
await updateIndicatorResult(payload);
|
await updateIndicatorResult(payload);
|
||||||
message.success($t('common.updateSuccess'));
|
message.success($t('common.updateSuccess'));
|
||||||
|
|
@ -175,6 +121,7 @@ const [Modal, modalApi] = useVbenModal({
|
||||||
await createIndicatorResult(payload);
|
await createIndicatorResult(payload);
|
||||||
message.success($t('common.createSuccess'));
|
message.success($t('common.createSuccess'));
|
||||||
}
|
}
|
||||||
|
// 关闭并提示
|
||||||
await modalApi.close();
|
await modalApi.close();
|
||||||
emit('success');
|
emit('success');
|
||||||
} finally {
|
} finally {
|
||||||
|
|
@ -187,7 +134,9 @@ const [Modal, modalApi] = useVbenModal({
|
||||||
items.value = [];
|
items.value = [];
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const data = modalApi.getData<OpenData>();
|
formApi.setState({ schema: useQcIndicatorResultFormSchema(formApi) });
|
||||||
|
// 加载数据
|
||||||
|
const data = modalApi.getData<CtxData>();
|
||||||
ctxData.value = data;
|
ctxData.value = data;
|
||||||
formType.value = data.formType;
|
formType.value = data.formType;
|
||||||
modalApi.lock();
|
modalApi.lock();
|
||||||
|
|
@ -207,11 +156,12 @@ const [Modal, modalApi] = useVbenModal({
|
||||||
? Number(item.value)
|
? Number(item.value)
|
||||||
: undefined,
|
: undefined,
|
||||||
}));
|
}));
|
||||||
|
// 设置到 values
|
||||||
await formApi.setValues({
|
await formApi.setValues({
|
||||||
id: detail.id,
|
id: detail.id,
|
||||||
code: detail.code,
|
code: detail.code,
|
||||||
sn: detail.sn,
|
|
||||||
remark: detail.remark,
|
remark: detail.remark,
|
||||||
|
sn: detail.sn,
|
||||||
});
|
});
|
||||||
} finally {
|
} finally {
|
||||||
modalApi.unlock();
|
modalApi.unlock();
|
||||||
|
|
@ -225,14 +175,16 @@ const [Modal, modalApi] = useVbenModal({
|
||||||
<div class="px-4">
|
<div class="px-4">
|
||||||
<Form />
|
<Form />
|
||||||
<Divider>检测值</Divider>
|
<Divider>检测值</Divider>
|
||||||
<!-- TODO @AI:这里,可以改成更大化使用 schema 方式么? -->
|
<!-- 检测值控件由每行 valueType 驱动,逐行渲染:FLOAT/INTEGER 走 InputNumber,DICT 走 Select 并按 valueSpecification 解析选项 -->
|
||||||
<AForm :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
|
<AForm :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
|
||||||
<div
|
<div
|
||||||
v-for="(item, index) in items"
|
v-for="(item, index) in items"
|
||||||
:key="item.indicatorId ?? index"
|
:key="item.indicatorId ?? index"
|
||||||
class="mb-2"
|
class="mb-2"
|
||||||
>
|
>
|
||||||
<AForm.Item :label="`检测项${index + 1}:${item.indicatorName ?? ''}`">
|
<AForm.Item
|
||||||
|
:label="`检测项${index + 1}:${item.indicatorName ?? ''}`"
|
||||||
|
>
|
||||||
<InputNumber
|
<InputNumber
|
||||||
v-if="
|
v-if="
|
||||||
item.valueType === MesQcResultValueType.FLOAT ||
|
item.valueType === MesQcResultValueType.FLOAT ||
|
||||||
|
|
|
||||||
|
|
@ -13,6 +13,7 @@ import {
|
||||||
} from '#/api/mes/qc/indicatorresult';
|
} from '#/api/mes/qc/indicatorresult';
|
||||||
import { $t } from '#/locales';
|
import { $t } from '#/locales';
|
||||||
|
|
||||||
|
import { useQcIndicatorResultGridColumns } from './data';
|
||||||
import QcIndicatorResultForm from './qc-indicator-result-form.vue';
|
import QcIndicatorResultForm from './qc-indicator-result-form.vue';
|
||||||
|
|
||||||
const props = defineProps<{
|
const props = defineProps<{
|
||||||
|
|
@ -69,21 +70,9 @@ async function handleDelete(row: MesQcIndicatorResultApi.IndicatorResult) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// TODO @AI:搞个 data.ts?
|
|
||||||
// TODO @AI:代码风格,貌似不够一致;
|
|
||||||
const [Grid, gridApi] = useVbenVxeGrid({
|
const [Grid, gridApi] = useVbenVxeGrid({
|
||||||
gridOptions: {
|
gridOptions: {
|
||||||
columns: [
|
columns: useQcIndicatorResultGridColumns(),
|
||||||
{ field: 'code', title: '样品编号', width: 200 },
|
|
||||||
{ field: 'sn', title: '物资SN', minWidth: 200 },
|
|
||||||
{ field: 'remark', title: '备注', minWidth: 200 },
|
|
||||||
{
|
|
||||||
title: '操作',
|
|
||||||
width: 150,
|
|
||||||
fixed: 'right',
|
|
||||||
slots: { default: 'actions' },
|
|
||||||
},
|
|
||||||
],
|
|
||||||
height: 360,
|
height: 360,
|
||||||
proxyConfig: {
|
proxyConfig: {
|
||||||
ajax: {
|
ajax: {
|
||||||
|
|
@ -101,8 +90,8 @@ const [Grid, gridApi] = useVbenVxeGrid({
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
rowConfig: {
|
rowConfig: {
|
||||||
keyField: 'id',
|
|
||||||
isHover: true,
|
isHover: true,
|
||||||
|
keyField: 'id',
|
||||||
},
|
},
|
||||||
toolbarConfig: {
|
toolbarConfig: {
|
||||||
refresh: true,
|
refresh: true,
|
||||||
|
|
|
||||||
|
|
@ -62,17 +62,12 @@ const [Form, formApi] = useVbenForm({
|
||||||
showDefaultActions: false,
|
showDefaultActions: false,
|
||||||
});
|
});
|
||||||
|
|
||||||
// TODO @AI:这个不应该是表头吧?不够通用;应该是 handleRefresh 更合理把。
|
/** 子表变更后刷新主表头数据(缺陷统计等) */
|
||||||
/** 重新加载主表头数据(用于子表变更后刷新缺陷统计) */
|
async function handleRefresh() {
|
||||||
async function reloadHead() {
|
|
||||||
if (!formData.value?.id) {
|
if (!formData.value?.id) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
try {
|
|
||||||
formData.value = await getIqc(formData.value.id);
|
formData.value = await getIqc(formData.value.id);
|
||||||
} catch (error) {
|
|
||||||
console.error('[IqcForm] reload head failed:', error);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 提交表单 */
|
/** 提交表单 */
|
||||||
|
|
@ -222,7 +217,7 @@ const [Modal, modalApi] = useVbenModal({
|
||||||
<LineList
|
<LineList
|
||||||
:form-type="formType"
|
:form-type="formType"
|
||||||
:iqc-id="formData.id"
|
:iqc-id="formData.id"
|
||||||
@refresh="reloadHead"
|
@refresh="handleRefresh"
|
||||||
/>
|
/>
|
||||||
</Tabs.TabPane>
|
</Tabs.TabPane>
|
||||||
<Tabs.TabPane key="result" tab="检测结果">
|
<Tabs.TabPane key="result" tab="检测结果">
|
||||||
|
|
|
||||||
|
|
@ -16,6 +16,13 @@ export namespace MesQcDefectRecordApi {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** 查询质检缺陷记录 */
|
||||||
|
export function getDefectRecord(id: number) {
|
||||||
|
return requestClient.get<MesQcDefectRecordApi.DefectRecord>(
|
||||||
|
`/mes/qc/defect-record/get?id=${id}`,
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
/** 查询质检缺陷记录分页 */
|
/** 查询质检缺陷记录分页 */
|
||||||
export function getDefectRecordPage(
|
export function getDefectRecordPage(
|
||||||
params: PageParam & { lineId?: number; qcId?: number; qcType?: number; },
|
params: PageParam & { lineId?: number; qcId?: number; qcType?: number; },
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue