密炼生产计划优化
This commit is contained in:
@@ -0,0 +1,9 @@
|
||||
import { defHttp } from '/@/utils/http/axios';
|
||||
|
||||
enum Api {
|
||||
list = '/xslmes/mesXslManualSmallMaterialPlanMaintain/list',
|
||||
saveAll = '/xslmes/mesXslManualSmallMaterialPlanMaintain/saveAll',
|
||||
}
|
||||
|
||||
export const list = (params) => defHttp.get({ url: Api.list, params });
|
||||
export const saveAll = (params) => defHttp.post({ url: Api.saveAll, params });
|
||||
@@ -0,0 +1,198 @@
|
||||
<template>
|
||||
<div class="small-plan-page">
|
||||
<div class="small-plan-toolbar">
|
||||
<a-button type="primary" preIcon="ant-design:save-outlined" :loading="saving" @click="handleSaveAll">保存</a-button>
|
||||
</div>
|
||||
|
||||
<a-table :columns="columns" :data-source="rows" :pagination="false" :scroll="{ x: 1220 }" row-key="_rowKey" size="small" bordered>
|
||||
<template #bodyCell="{ column, record, index }">
|
||||
<template v-if="column.dataIndex === 'formulaName'">
|
||||
<a-input :value="record.formulaName" @change="(e) => updateCell(index, 'formulaName', e?.target?.value)" />
|
||||
</template>
|
||||
|
||||
<template
|
||||
v-else-if="
|
||||
column.dataIndex === 'morningSeqNo' ||
|
||||
column.dataIndex === 'noonSeqNo' ||
|
||||
column.dataIndex === 'nightSeqNo' ||
|
||||
column.dataIndex === 'morningPlanCount' ||
|
||||
column.dataIndex === 'noonPlanCount' ||
|
||||
column.dataIndex === 'nightPlanCount'
|
||||
"
|
||||
>
|
||||
<a-input-number
|
||||
:value="record[column.dataIndex]"
|
||||
:min="0"
|
||||
:precision="0"
|
||||
:controls="false"
|
||||
style="width: 100%"
|
||||
@change="(v) => updateCell(index, column.dataIndex as string, v)"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<template
|
||||
v-else-if="
|
||||
column.dataIndex === 'morningRemark' || column.dataIndex === 'noonRemark' || column.dataIndex === 'nightRemark'
|
||||
"
|
||||
>
|
||||
<a-input :value="record[column.dataIndex]" @change="(e) => updateCell(index, column.dataIndex as string, e?.target?.value)" />
|
||||
</template>
|
||||
|
||||
<template v-else-if="column.key === 'action'">
|
||||
<a-button type="text" size="small" class="insert-plus-btn" title="新增" @click="insertBelow(index)">+</a-button>
|
||||
<a-button type="link" size="small" danger @click="removeRow(index)">删</a-button>
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed, ref } from 'vue';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { buildUUID } from '/@/utils/uuid';
|
||||
import { list, saveAll } from './MesXslManualSmallMaterialPlanMaintain.api';
|
||||
|
||||
const { createMessage } = useMessage();
|
||||
const saving = ref(false);
|
||||
const rows = ref<Recordable[]>([]);
|
||||
|
||||
const columns = computed(() => [
|
||||
{ title: '操作', key: 'action', width: 96, fixed: 'left', align: 'center' },
|
||||
{ title: '配方名称', dataIndex: 'formulaName', width: 220, fixed: 'left', align: 'center' },
|
||||
{
|
||||
title: '早班',
|
||||
align: 'center',
|
||||
children: [
|
||||
{ title: '序号', dataIndex: 'morningSeqNo', width: 90, align: 'center' },
|
||||
{ title: '计划', dataIndex: 'morningPlanCount', width: 90, align: 'center' },
|
||||
{ title: '备注', dataIndex: 'morningRemark', width: 160, align: 'center' },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: '中班',
|
||||
align: 'center',
|
||||
children: [
|
||||
{ title: '序号', dataIndex: 'noonSeqNo', width: 90, align: 'center' },
|
||||
{ title: '计划', dataIndex: 'noonPlanCount', width: 90, align: 'center' },
|
||||
{ title: '备注', dataIndex: 'noonRemark', width: 160, align: 'center' },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: '夜班',
|
||||
align: 'center',
|
||||
children: [
|
||||
{ title: '序号', dataIndex: 'nightSeqNo', width: 90, align: 'center' },
|
||||
{ title: '计划', dataIndex: 'nightPlanCount', width: 90, align: 'center' },
|
||||
{ title: '备注', dataIndex: 'nightRemark', width: 160, align: 'center' },
|
||||
],
|
||||
},
|
||||
]);
|
||||
|
||||
function createEmptyRow(): Recordable {
|
||||
return {
|
||||
_rowKey: buildUUID(),
|
||||
id: '',
|
||||
formulaName: '',
|
||||
morningSeqNo: null,
|
||||
morningPlanCount: null,
|
||||
morningRemark: '',
|
||||
noonSeqNo: null,
|
||||
noonPlanCount: null,
|
||||
noonRemark: '',
|
||||
nightSeqNo: null,
|
||||
nightPlanCount: null,
|
||||
nightRemark: '',
|
||||
};
|
||||
}
|
||||
|
||||
function createBlankRows(count = 12) {
|
||||
return Array.from({ length: count }, () => createEmptyRow());
|
||||
}
|
||||
|
||||
function updateCell(index: number, field: string, value: any) {
|
||||
const row = rows.value[index];
|
||||
if (!row) return;
|
||||
row[field] = value;
|
||||
}
|
||||
|
||||
function insertBelow(index: number) {
|
||||
rows.value.splice(index + 1, 0, createEmptyRow());
|
||||
}
|
||||
|
||||
function removeRow(index: number) {
|
||||
rows.value.splice(index, 1);
|
||||
if (!rows.value.length) {
|
||||
rows.value = createBlankRows();
|
||||
}
|
||||
}
|
||||
|
||||
async function loadRows() {
|
||||
const res = await list({ pageNo: 1, pageSize: 500 });
|
||||
const records = (res?.records || res?.result?.records || []) as Recordable[];
|
||||
rows.value = (records || []).map((item) => ({ ...createEmptyRow(), ...item, _rowKey: item.id || buildUUID() }));
|
||||
if (!rows.value.length) {
|
||||
rows.value = createBlankRows();
|
||||
}
|
||||
}
|
||||
|
||||
async function handleSaveAll() {
|
||||
saving.value = true;
|
||||
try {
|
||||
const payload = rows.value.map((r) => {
|
||||
const { _rowKey, ...rest } = r;
|
||||
return rest;
|
||||
});
|
||||
await saveAll({ rows: payload });
|
||||
createMessage.success('保存成功');
|
||||
await loadRows();
|
||||
} finally {
|
||||
saving.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
loadRows();
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.small-plan-page {
|
||||
padding: 8px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.small-plan-toolbar {
|
||||
margin-bottom: 12px;
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
:deep(.ant-table-thead > tr > th) {
|
||||
text-align: center !important;
|
||||
padding: 4px 6px !important;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
:deep(.ant-table-tbody > tr > td) {
|
||||
padding: 2px 3px !important;
|
||||
}
|
||||
|
||||
:deep(.ant-input),
|
||||
:deep(.ant-input-number),
|
||||
:deep(.ant-input-number-input) {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
:deep(.ant-input),
|
||||
:deep(.ant-input-number) {
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.insert-plus-btn {
|
||||
color: #52c41a;
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
line-height: 1;
|
||||
padding: 0 4px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user