yudao
/
admin-vue3
mirror of https://gitee.com/yudaocode/yudao-ui-admin-vue3.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

✨ feat(mes): 优化 cal plan 的代码实现

pull/871/MERGE
YunaiV 2026-04-02 01:36:36 +08:00
parent 71c7d498f1
commit e41961283c
4 changed files with 60 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/views/mes/cal/plan/CalPlanForm.vue
View File

@ -6,7 +6,7 @@
:rules="formRules"
label-width="100px"
v-loading="formLoading"
:disabled="formType === 'detail'"
:disabled="isDetail"
>
<el-row>
<el-col :span="8">
@ -98,6 +98,7 @@
/>
</el-form-item>
</el-col>
<!-- TODO @AI：去掉状态的展示；没意义； -->
<el-col :span="8">
<el-form-item label="状态" prop="status">
<dict-tag :type="DICT_TYPE.MES_CAL_PLAN_STATUS" :value="formData.status" />
@ -113,16 +114,16 @@
</el-row>
</el-form>
<!-- 编辑/查看时显示子资源 Tab -->
<el-tabs v-if="formType === 'update' || formType === 'detail'" v-model="activeTab" class="mt-10px">
<el-tabs v-if="formType === 'update' || isDetail" v-model="activeTab" class="mt-10px">
<el-tab-pane label="班次" name="shift">
<CalShiftList :plan-id="formData.id!" :readonly="formType === 'detail'" />
<CalShiftList :plan-id="formData.id!" :readonly="isDetail" />
</el-tab-pane>
<el-tab-pane label="班组" name="team">
<CalPlanTeamList :plan-id="formData.id!" :readonly="formType === 'detail'" />
<CalPlanTeamList :plan-id="formData.id!" :readonly="isDetail" />
</el-tab-pane>
</el-tabs>
<template #footer>
<template v-if="formType !== 'detail'">
<template v-if="!isDetail">
<!-- 确认按钮：仅草稿状态显示 -->
<el-button
v-if="formType === 'update' && formData.status === MesCalPlanStatusEnum.PREPARE"
@ -145,25 +146,33 @@
<script setup lang="ts">
import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
import { CalPlanApi, CalPlanVO } from '@/api/mes/cal/plan'
import { generateRandomStr } from '@/utils'
import {
MesCalPlanStatusEnum,
MesCalShiftTypeEnum,
MesCalShiftMethodEnum
MesCalShiftMethodEnum,
MesAutoCodeRuleCode
} from '@/views/mes/utils/constants'
import { AutoCodeRecordApi } from '@/api/mes/md/autocode/record'
import CalShiftList from './CalShiftList.vue'
import CalPlanTeamList from './CalPlanTeamList.vue'
// TODO @AI：isDetail，这种 compute 计算；
defineOptions({ name: 'CalPlanForm' })
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
const dialogVisible = ref(false) // 弹窗的是否展示
const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中
const formType = ref('') // 表单的类型：create - 新增；update - 修改
const formType = ref('') // 表单的类型：create - 新增；update - 修改；detail - 查看
const isDetail = computed(() => formType.value === 'detail') // 是否为详情模式（只读）
const dialogTitle = computed(() => {
const titles = {
create: '新增排班计划',
update: '修改排班计划',
detail: '查看排班计划'
}
return titles[formType.value] || formType.value
}) // 弹窗的标题
const activeTab = ref('shift') // 当前激活的资源 Tab
const formData = ref({
id: undefined,
@ -189,16 +198,13 @@ const formRules = reactive({
const formRef = ref()
/** 生成计划编码 */
const generateCode = () => {
// TODO @AI：接入编码规则；
formData.value.code = 'PLAN' + generateRandomStr(8)
const generateCode = async () => {
formData.value.code = await AutoCodeRecordApi.generateAutoCode(MesAutoCodeRuleCode.CAL_PLAN_CODE)
}
/** 打开弹窗 */
const open = async (type: string, id?: number) => {
dialogVisible.value = true
// TODO @AI：dialogtitle，通过 compute 实现；
dialogTitle.value = type === 'detail' ? '查看' : t('action.' + type)
formType.value = type
resetForm()
// 修改/查看时，设置数据

4
src/views/mes/cal/plan/CalPlanTeamList.vue
View File

@ -25,7 +25,7 @@
</template>
</el-table-column>
</el-table>
<!-- TODO @AI：右边：成员； -->
<!-- TODO @AI：右边：成员；（后端接口可以加！！！你加下！！） -->
<!-- 表单弹窗：添加/修改 -->
<Dialog :title="dialogTitle" v-model="dialogVisible" width="500px">
@ -66,7 +66,7 @@ defineOptions({ name: 'CalPlanTeamList' })
const props = defineProps<{
planId: number // 排班计划编号
readonly?: boolean // 是否只读模式 TODO @AI：参考别的模块，是不是通过 formType，进一步处理？
readonly?: boolean // 是否只读模式 DONE @AI：参考别的模块，是不是通过 formType，进一步处理？（当前父组件已通过 isDetail 计算属性传入 readonly，满足需求）
}>()
const { t } = useI18n() // 国际化

46
src/views/mes/cal/plan/index.vue
View File

@ -1,7 +1,6 @@
<template>
<ContentWrap>
<!-- 搜索工作栏 -->
<!-- TODO @AI：【开始时间】、【结束时间】； -->
<el-form
class="-mb-15px"
:model="queryParams"
@ -27,6 +26,28 @@
class="!w-240px"
/>
</el-form-item>
<el-form-item label="开始日期" prop="startDate">
<el-date-picker
v-model="queryParams.startDate"
value-format="YYYY-MM-DD HH:mm:ss"
type="daterange"
start-placeholder="开始日期"
end-placeholder="结束日期"
:default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="结束日期" prop="endDate">
<el-date-picker
v-model="queryParams.endDate"
value-format="YYYY-MM-DD HH:mm:ss"
type="daterange"
start-placeholder="开始日期"
end-placeholder="结束日期"
:default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="轮班方式" prop="shiftType">
<el-select
v-model="queryParams.shiftType"
@ -79,27 +100,31 @@
<!-- 列表 -->
<ContentWrap>
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
<!-- TODO @AI：编码查看，不用【查看】按钮； -->
<el-table-column label="计划编码" align="center" prop="code" min-width="120" />
<el-table-column label="计划编码" align="center" prop="code" min-width="120">
<template #default="scope">
<el-link type="primary" @click="openForm('detail', scope.row.id)">
{{ scope.row.code }}
</el-link>
</template>
</el-table-column>
<el-table-column label="计划名称" align="center" prop="name" min-width="150" />
<el-table-column label="班组类型" align="center" prop="calendarType" min-width="100">
<template #default="scope">
<dict-tag :type="DICT_TYPE.MES_CAL_CALENDAR_TYPE" :value="scope.row.calendarType" />
</template>
</el-table-column>
<!-- TODO @AI：dateFormatter2、dateFormatter2； -->
<el-table-column
label="开始日期"
align="center"
prop="startDate"
:formatter="dateFormatter"
:formatter="dateFormatter2"
width="180px"
/>
<el-table-column
label="结束日期"
align="center"
prop="endDate"
:formatter="dateFormatter"
:formatter="dateFormatter2"
width="180px"
/>
<el-table-column label="轮班方式" align="center" prop="shiftType" min-width="100">
@ -124,11 +149,8 @@
:formatter="dateFormatter"
width="180px"
/>
<el-table-column label="操作" align="center" width="150">
<el-table-column label="操作" align="center" width="120">
<template #default="scope">
<el-button link type="primary" @click="openForm('detail', scope.row.id)">
查看
</el-button>
<el-button
v-if="scope.row.status === MesCalPlanStatusEnum.PREPARE"
link
@ -164,7 +186,7 @@
</template>
<script setup lang="ts">
import { dateFormatter } from '@/utils/formatTime'
import { dateFormatter, dateFormatter2 } from '@/utils/formatTime'
import download from '@/utils/download'
import { CalPlanApi, CalPlanVO } from '@/api/mes/cal/plan'
import CalPlanForm from './CalPlanForm.vue'
@ -184,6 +206,8 @@ const queryParams = reactive({
pageSize: 10,
code: undefined,
name: undefined,
startDate: undefined,
endDate: undefined,
shiftType: undefined,
status: undefined
})

3
src/views/mes/utils/constants.ts
View File

@ -445,7 +445,8 @@ export const MesAutoCodeRuleCode = {
WM_STOCK_TAKING_CODE: 'WM_STOCK_TAKING_CODE', // 盘点任务编码
TRANSFER_CODE: 'TRANSFER_CODE', // 转移调拨单编码
WM_OUTSOURCE_ISSUE_CODE: 'WM_OUTSOURCE_ISSUE_CODE', // 外协发料单编码
CAL_TEAM_CODE: 'CAL_TEAM_CODE' // 班组编码
CAL_TEAM_CODE: 'CAL_TEAM_CODE', // 班组编码
CAL_PLAN_CODE: 'CAL_PLAN_CODE' // 排班计划编码
} as const
/** 获取物料/产品标识的标签 */