| | |
| | | <script lang="ts" setup> |
| | | import type { VxeTableGridOptions } from '#/adapter/vxe-table'; |
| | | import type { MesProWorkOrderApi } from '#/api/mes/pro/workorder'; |
| | | import {getWorkOrderSchedulePage, type MesProWorkOrderApi} from '#/api/mes/pro/workorder'; |
| | | |
| | | import { onMounted, ref } from 'vue'; |
| | | import { useRouter } from 'vue-router'; |
| | | |
| | | import { Page, useVbenModal } from '../../../../packages/effects/common-ui/src'; |
| | | import { Page, useVbenModal } from '@vben/common-ui'; |
| | | import { |
| | | MesProWorkOrderStatusEnum, |
| | | MesProWorkOrderTypeEnum, |
| | | } from '../../../../packages/constants/src'; |
| | | } from '@vben/constants'; |
| | | |
| | | import { Button, Card } from 'ant-design-vue'; |
| | | import { Button, Card, message, Tabs } from 'ant-design-vue'; |
| | | |
| | | import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table'; |
| | | import { getGanttTaskList } from '#/api/mes/pro/task'; |
| | | import { getGanttTaskList, previewAutoGenerate, autoGenerateTasks } from '#/api/mes/pro/task'; |
| | | import { getWorkOrderPage } from '#/api/mes/pro/workorder'; |
| | | |
| | | import ArchiveDetail from '#/views/mes/pd/archive/modules/detail.vue'; |
| | | import { GanttChart } from './components'; |
| | | import { useGridColumns, useGridFormSchema } from './data'; |
| | | import ScheduleForm from './modules/schedule-form.vue'; |
| | | import SchedulePreview from '../workorder-center/modules/schedule-preview.vue'; |
| | | |
| | | const router = useRouter(); |
| | | const ganttTasks = ref<any[]>([]); // 甘特图预览数据 |
| | | const archiveVisible = ref(false); |
| | | const archiveProductCode = ref(''); |
| | | |
| | | const activeTab = ref('PENDING'); // 默认选中待排产 |
| | | |
| | | const [ScheduleModal, scheduleModalApi] = useVbenModal({ |
| | | connectedComponent: ScheduleForm, |
| | | destroyOnClose: true, |
| | | }); |
| | | |
| | | const [SchedulePreviewModal, schedulePreviewModalApi] = useVbenModal({ |
| | | connectedComponent: SchedulePreview, |
| | | destroyOnClose: true, |
| | | }); |
| | | |
| | |
| | | }); |
| | | } |
| | | |
| | | /** 查看工单详情 */ |
| | | /** 查看订单详情 */ |
| | | function handleDetail(row: MesProWorkOrderApi.WorkOrder) { |
| | | scheduleModalApi.setData({ formType: 'detail', id: row.id }).open(); |
| | | } |
| | |
| | | /** 排产 */ |
| | | function handleSchedule(row: MesProWorkOrderApi.WorkOrder) { |
| | | scheduleModalApi.setData({ formType: 'schedule', id: row.id }).open(); |
| | | } |
| | | |
| | | /** 一键排产预览 */ |
| | | async function handleAutoSchedulePreview(row: MesProWorkOrderApi.WorkOrder) { |
| | | try { |
| | | const preview = await previewAutoGenerate({ workOrderId: row.id! }); |
| | | schedulePreviewModalApi |
| | | .setData({ workOrder: row, preview }) |
| | | .open(); |
| | | } catch { |
| | | message.error('获取排产预览失败'); |
| | | } |
| | | } |
| | | |
| | | /** 一键排产执行 */ |
| | | async function handleAutoSchedule(row: MesProWorkOrderApi.WorkOrder) { |
| | | try { |
| | | const result = await autoGenerateTasks({ workOrderId: row.id! }); |
| | | message.success(`排产成功,生成 ${result.taskIds?.length || 0} 个任务`); |
| | | handleRefresh(); |
| | | } catch { |
| | | message.error('排产失败'); |
| | | } |
| | | } |
| | | |
| | | /** 打开归档详情 */ |
| | | function handleArchive(row: MesProWorkOrderApi.WorkOrder) { |
| | | archiveProductCode.value = row.productCode || ''; |
| | | archiveVisible.value = true; |
| | | } |
| | | |
| | | /** 打开甘特图编辑页面 */ |
| | |
| | | proxyConfig: { |
| | | ajax: { |
| | | query: async ({ page }, formValues) => { |
| | | return await getWorkOrderPage({ |
| | | let scheduleStatus: number | undefined = undefined; |
| | | |
| | | if (activeTab.value === 'PENDING') { |
| | | scheduleStatus = 0; // 待排产 |
| | | } else if (activeTab.value === 'FINISHED') { |
| | | scheduleStatus = 1; // 已完成 |
| | | } |
| | | // activeTab === 'ALL' 时不传 |
| | | |
| | | return await getWorkOrderSchedulePage({ |
| | | pageNo: page.currentPage, |
| | | pageSize: page.pageSize, |
| | | status: MesProWorkOrderStatusEnum.CONFIRMED, |
| | | scheduleStatus, |
| | | type: MesProWorkOrderTypeEnum.SELF, |
| | | ...formValues, |
| | | }); |
| | |
| | | </script> |
| | | |
| | | <template> |
| | | <Page auto-content-height><ScheduleModal @success="handleRefresh" /> |
| | | <Page auto-content-height> |
| | | <ScheduleModal @success="handleRefresh" /> |
| | | <SchedulePreviewModal @success="handleRefresh" /> |
| | | |
| | | <!-- 排产甘特图预览 --> |
| | | <Card title="排产甘特图" class="mb-4"> |
| | | <GanttChart :height="350" :readonly="true" :tasks="ganttTasks" /> |
| | | </Card> |
| | | |
| | | <Grid table-title="待排产工单"> |
| | | <Grid> |
| | | <template #table-title> |
| | | <div class="flex flex-col gap-2"> |
| | | <span class="text-base font-medium">生产订单列表</span> |
| | | <Tabs v-model:activeKey="activeTab" @change="handleRefresh" :tabBarStyle="{ margin: 0, borderBottom: 0 }"> |
| | | <Tabs.TabPane key="ALL" tab="全部" /> |
| | | <Tabs.TabPane key="PENDING" tab="未完成" /> |
| | | <Tabs.TabPane key="FINISHED" tab="已完成" /> |
| | | </Tabs> |
| | | </div> |
| | | </template> |
| | | <template #toolbar-tools> |
| | | <TableAction |
| | | :actions="[ |
| | |
| | | ifShow: row.status === MesProWorkOrderStatusEnum.CONFIRMED, |
| | | onClick: handleSchedule.bind(null, row), |
| | | }, |
| | | { |
| | | label: '归档详情', |
| | | type: 'link', |
| | | onClick: handleArchive.bind(null, row), |
| | | }, |
| | | ]" |
| | | /> |
| | | </template> |
| | | </Grid> |
| | | <ArchiveDetail :visible="archiveVisible" :product-code="archiveProductCode" @update:visible="archiveVisible = $event" /> |
| | | </Page> |
| | | </template> |