style:排产甘特图i18适配

main
黄伟杰 20 hours ago
parent 0ff6eaef69
commit fc6f348ad6

@ -4575,6 +4575,7 @@ export default {
planCountLabel: 'Plan Count',
planDetailTitle: 'Plan Details',
planCodeColon: 'Plan Code: ',
taskCodeColon: 'Task Code: ',
planNumberColon: 'Plan Qty: ',
deliveryDateColon: 'Delivery Date: ',
startColon: 'Start: ',
@ -4585,15 +4586,19 @@ export default {
deviceLabel: 'Device',
devicePlaceholder: 'Please select device',
startDateLabel: 'Start Date',
startDatePlaceholder: 'Please select start date',
startDatePlaceholder: 'Please select plan start date',
endDateLabel: 'End Date',
endDatePlaceholder: 'Please select plan end date',
durationLabel: 'Days',
buttonCancel: 'Cancel',
buttonConfirm: 'Confirm',
editStartDateTitle: 'Edit Start Time',
startTimeLabel: 'Start Time',
startTimePlaceholder: 'Please select start time',
warningCompleteDeviceDate: 'Please complete device and start date',
capacityTypeLabel: 'Capacity Source',
warningCompleteDeviceDate: 'Please complete device, start date and end date',
warningValidTime: 'Please select a valid time',
warningEndBeforeStart: 'End time cannot be earlier than start time',
columnTaskName: 'Task Name',
columnDeviceName: 'Device Name',
columnPlanInfo: 'Plan Info',

@ -4786,6 +4786,7 @@ export default {
planCountLabel: '计划条数',
planDetailTitle: '计划明细',
planCodeColon: '计划编码:',
taskCodeColon: '任务编码:',
planNumberColon: '计划数量:',
deliveryDateColon: '交货日期:',
startColon: '开始:',
@ -4796,15 +4797,19 @@ export default {
deviceLabel: '设备',
devicePlaceholder: '请选择设备',
startDateLabel: '开始日期',
startDatePlaceholder: '请选择开始日期',
startDatePlaceholder: '请选择计划开始日期',
endDateLabel: '结束日期',
endDatePlaceholder: '请选择计划结束日期',
durationLabel: '天数',
buttonCancel: '取消',
buttonConfirm: '确定',
editStartDateTitle: '修改开始时间',
startTimeLabel: '开始时间',
startTimePlaceholder: '请选择开始时间',
warningCompleteDeviceDate: '请完善设备和开始日期',
capacityTypeLabel: '产能来源',
warningCompleteDeviceDate: '请完善设备、计划开始日期和计划结束日期',
warningValidTime: '请选择有效的时间',
warningEndBeforeStart: '结束时间不能早于开始时间',
columnTaskName: '任务名称',
columnDeviceName: '设备名称',
columnPlanInfo: '计划信息',

@ -4,18 +4,18 @@
<div ref="ganttContainerRef" class="schedule-gantt-container" :style="{ height }"></div>
</div>
<div class="schedule-detail-panel">
<div class="schedule-detail-title">计划信息</div>
<div class="schedule-detail-title">{{ t('GanttChart.GanttPanel.detailTitle') }}</div>
<template v-if="activePreviewDevice">
<el-descriptions :column="1" border size="small">
<el-descriptions-item label="设备名称">{{ activePreviewDevice.deviceName }}</el-descriptions-item>
<el-descriptions-item label="设备ID">{{ activePreviewDevice.deviceId }}</el-descriptions-item>
<el-descriptions-item v-if="activePreviewDevice.capacityType !== undefined" label="产能来源">{{ getCapacityTypeLabel(activePreviewDevice.capacityType) }}</el-descriptions-item>
<el-descriptions-item v-if="activePreviewDevice.capacityType === 1" label="产能">{{ activePreviewDevice.ratedCapacity ?? '-' }}</el-descriptions-item>
<el-descriptions-item v-if="'dailyAverageValue' in activePreviewDevice" label="每日报工平均值">{{ activePreviewDevice.dailyAverageValue ?? '-' }}</el-descriptions-item>
<el-descriptions-item v-if="'dataCollectionCapacity' in activePreviewDevice" label="数据采集产能">{{ activePreviewDevice.dataCollectionCapacity ?? '-' }}</el-descriptions-item>
<el-descriptions-item label="计划条数">{{ activePreviewDevice.plans?.length ?? 0 }}</el-descriptions-item>
<el-descriptions-item :label="t('GanttChart.GanttPanel.deviceNameLabel')">{{ activePreviewDevice.deviceName }}</el-descriptions-item>
<el-descriptions-item :label="t('GanttChart.GanttPanel.deviceIdLabel')">{{ activePreviewDevice.deviceId }}</el-descriptions-item>
<el-descriptions-item v-if="activePreviewDevice.capacityType !== undefined" :label="t('GanttChart.GanttPanel.capacityTypeLabel')">{{ getCapacityTypeLabel(activePreviewDevice.capacityType) }}</el-descriptions-item>
<el-descriptions-item v-if="activePreviewDevice.capacityType === 1" :label="t('GanttChart.GanttPanel.capacityLabel')">{{ activePreviewDevice.ratedCapacity ?? '-' }}</el-descriptions-item>
<el-descriptions-item v-if="'dailyAverageValue' in activePreviewDevice" :label="t('GanttChart.GanttPanel.dailyAvgLabel')">{{ activePreviewDevice.dailyAverageValue ?? '-' }}</el-descriptions-item>
<el-descriptions-item v-if="'dataCollectionCapacity' in activePreviewDevice" :label="t('GanttChart.GanttPanel.dataCollectionCapacityLabel')">{{ activePreviewDevice.dataCollectionCapacity ?? '-' }}</el-descriptions-item>
<el-descriptions-item :label="t('GanttChart.GanttPanel.planCountLabel')">{{ activePreviewDevice.plans?.length ?? 0 }}</el-descriptions-item>
</el-descriptions>
<div class="schedule-plan-list-title">计划明细</div>
<div class="schedule-plan-list-title">{{ t('GanttChart.GanttPanel.planDetailTitle') }}</div>
<div class="schedule-plan-list">
<div
v-for="(plan, index) in activePreviewTask ? [activePreviewTask] : (activePreviewDevice?.plans ?? [])"
@ -25,53 +25,52 @@
<div class="schedule-plan-item-head">
<span class="schedule-plan-item-title">{{ plan.productCode ?? '-' }} / {{ plan.productName ?? '-' }}</span>
</div>
<div>任务编码{{ plan.taskCode ?? '-' }}</div>
<div>计划数量{{ plan.planNumber ?? '-' }}</div>
<div>{{ t('GanttChart.GanttPanel.taskCodeColon') }}{{ plan.taskCode ?? '-' }}</div>
<div>{{ t('GanttChart.GanttPanel.planNumberColon') }}{{ plan.planNumber ?? '-' }}</div>
<template v-if="activePreviewDevice.capacityType !== 1">
<div>产能{{ plan.ratedCapacity ?? '-' }}</div>
<div>产能来源{{ getCapacityTypeLabel(plan.capacityType) }}</div>
<div>{{ t('GanttChart.GanttPanel.capacityLabel') }}{{ plan.ratedCapacity ?? '-' }}</div>
<div>{{ t('GanttChart.GanttPanel.capacityTypeLabel') }}{{ getCapacityTypeLabel(plan.capacityType) }}</div>
</template>
<div>交货日期{{ plan.deliveryDateStr ?? '-' }}</div>
<div>开始{{ plan.planStartTimeStr || '-' }}</div>
<div>结束{{ plan.planEndTimeStr || '-' }}</div>
<div>最晚开工{{ plan.latestStartTimeStr || '-' }}</div>
<div>{{ t('GanttChart.GanttPanel.deliveryDateColon') }}{{ plan.deliveryDateStr ?? '-' }}</div>
<div>{{ t('GanttChart.GanttPanel.startColon') }}{{ plan.planStartTimeStr || '-' }}</div>
<div>{{ t('GanttChart.GanttPanel.endColon') }}{{ plan.planEndTimeStr || '-' }}</div>
<div>{{ t('GanttChart.GanttPanel.latestStartColon') }}{{ plan.latestStartTimeStr || '-' }}</div>
</div>
</div>
</template>
<el-empty v-else description="暂无计划信息" :image-size="80" />
<el-empty v-else :description="t('GanttChart.GanttPanel.emptyDescription')" :image-size="80" />
</div>
</div>
<el-dialog v-model="taskAdjustDialogVisible" title="调整任务" width="420px" append-to-body>
<el-dialog v-model="taskAdjustDialogVisible" :title="t('GanttChart.GanttPanel.adjustTaskTitle')" width="420px" append-to-body>
<el-form label-width="110px">
<el-form-item label="设备">
<el-select v-model="taskAdjustForm.deviceTaskId" placeholder="请选择设备" class="!w-full">
<el-form-item :label="t('GanttChart.GanttPanel.deviceLabel')">
<el-select v-model="taskAdjustForm.deviceTaskId" :placeholder="t('GanttChart.GanttPanel.devicePlaceholder')" class="!w-full">
<el-option v-for="item in previewDeviceOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>
<el-form-item label="计划开始日期">
<el-form-item :label="t('GanttChart.GanttPanel.startDateLabel')">
<el-date-picker
v-model="taskAdjustForm.startDate"
type="datetime"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择计划开始日期"
:placeholder="t('GanttChart.GanttPanel.startDatePlaceholder')"
class="!w-full"
/>
</el-form-item>
<el-form-item label="计划结束日期">
<el-form-item :label="t('GanttChart.GanttPanel.endDateLabel')">
<el-date-picker
v-model="taskAdjustForm.endDate"
type="datetime"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择计划结束日期"
:placeholder="t('GanttChart.GanttPanel.endDatePlaceholder')"
class="!w-full"
/>
</el-form-item>
</el-form>
<template #footer>
<el-button @click="taskAdjustDialogVisible = false">取消</el-button>
<el-button type="primary" @click="handleTaskAdjustSubmit"></el-button>
<el-button @click="taskAdjustDialogVisible = false">{{ t('GanttChart.GanttPanel.buttonCancel') }}</el-button>
<el-button type="primary" @click="handleTaskAdjustSubmit">{{ t('GanttChart.GanttPanel.buttonConfirm') }}</el-button>
</template>
</el-dialog>
</template>
@ -81,9 +80,12 @@ import dayjs from 'dayjs'
import { gantt } from 'dhtmlx-gantt'
import 'dhtmlx-gantt/codebase/dhtmlxgantt.css'
import { getDictOptions } from '@/utils/dict'
import { useI18n } from '@/hooks/web/useI18n'
defineOptions({ name: 'ScheduleGanttPanelEditable' })
const { t } = useI18n()
const props = withDefaults(
defineProps<{
scheduleList: any[]
@ -208,14 +210,14 @@ const clearCustomPlanBars = () => {
const buildPlanBarTooltipHtml = (plan: any, device: any) => {
return `
<div><b>任务明细</b></div>
<div>设备${device?.deviceName ?? '-'}</div>
<div>任务单${plan.taskCode ?? '-'}</div>
<div>产品${plan.productCode ?? '-'} / ${plan.productName ?? '-'}</div>
<div>计划数量${plan.planNumber ?? '-'}</div>
<div>开始${formatTooltipDateTime(plan.planStartTimeStr)}</div>
<div>结束${formatTooltipDateTime(plan.planEndTimeStr)}</div>
<div>最晚开工${formatTooltipDateTime(plan.latestStartTimeStr)}</div>
<div><b>${t('GanttChart.GanttPanel.tooltipTaskDetail')}</b></div>
<div>${t('GanttChart.GanttPanel.tooltipDevice')}${device?.deviceName ?? '-'}</div>
<div>${t('GanttChart.GanttPanel.tooltipTaskCode')}${plan.taskCode ?? '-'}</div>
<div>${t('GanttChart.GanttPanel.tooltipProduct')}${plan.productCode ?? '-'} / ${plan.productName ?? '-'}</div>
<div>${t('GanttChart.GanttPanel.tooltipPlanNumber')}${plan.planNumber ?? '-'}</div>
<div>${t('GanttChart.GanttPanel.tooltipStart')}${formatTooltipDateTime(plan.planStartTimeStr)}</div>
<div>${t('GanttChart.GanttPanel.tooltipEnd')}${formatTooltipDateTime(plan.planEndTimeStr)}</div>
<div>${t('GanttChart.GanttPanel.tooltipLatestStart')}${formatTooltipDateTime(plan.latestStartTimeStr)}</div>
`
}
@ -555,7 +557,7 @@ const openTaskAdjustDialogForPlan = (plan: any, device: any) => {
const handleTaskAdjustSubmit = () => {
if (!taskAdjustForm.deviceTaskId || !taskAdjustForm.startDate || !taskAdjustForm.endDate) {
message.warning('请完善设备、计划开始日期和计划结束日期')
message.warning(t('GanttChart.GanttPanel.warningCompleteDeviceDate'))
return
}
if (!editingPlanIdentity.value) return
@ -582,11 +584,11 @@ const handleTaskAdjustSubmit = () => {
const newStart = dayjs(taskAdjustForm.startDate)
const newEnd = dayjs(taskAdjustForm.endDate)
if (!newStart.isValid() || !newEnd.isValid()) {
message.warning('请选择有效的时间')
message.warning(t('GanttChart.GanttPanel.warningValidTime'))
return
}
if (newEnd.isBefore(newStart)) {
message.warning('结束时间不能早于开始时间')
message.warning(t('GanttChart.GanttPanel.warningEndBeforeStart'))
return
}
@ -639,7 +641,7 @@ const initGanttPreview = () => {
gantt.config.columns = [
{
name: 'text',
label: '设备名称',
label: t('GanttChart.GanttPanel.columnDeviceName'),
tree: false,
width: '*',
min_width: 100,
@ -647,7 +649,7 @@ const initGanttPreview = () => {
},
{
name: 'duration',
label: '天数',
label: t('GanttChart.GanttPanel.columnDays'),
align: 'center',
width: 80,
template: (task: any) => String(task.totalDays ?? task.duration ?? 0)
@ -655,7 +657,7 @@ const initGanttPreview = () => {
]
gantt.config.scales = [
{ unit: 'month', step: 1, format: (date) => dayjs(date).format('YYYY年M月') },
{ unit: 'month', step: 1, format: (date) => dayjs(date).format(t('GanttChart.GanttPanel.scaleMonthFormat')) },
{ unit: 'day', step: 1, format: (date) => dayjs(date).format('MM-DD') }
]

Loading…
Cancel
Save