| | |
| | | <div class="process-diagram-status" :class="{ 'is-done': Number(step.isCompleted) === 1 }"> |
| | | {{ Number(step.isCompleted) === 1 ? "已完成" : "未完成" }} |
| | | </div> |
| | | <div v-if="step.isCompleted" style="margin-top: 8px;"> |
| | | <el-date-picker |
| | | v-model="step.completedTime" |
| | | type="datetime" |
| | | placeholder="选择时间" |
| | | format="YYYY-MM-DD HH:mm:ss" |
| | | value-format="YYYY-MM-DD HH:mm:ss" |
| | | size="small" |
| | | style="width: 100%;" |
| | | /> |
| | | </div> |
| | | </div> |
| | | <div v-if="idx < steps.length - 1" class="process-diagram-arrow">→</div> |
| | | </div> |
| | |
| | | await fetchRouteSteps(selectedRouteId.value); |
| | | }; |
| | | |
| | | const formatDateTime = (date) => { |
| | | const pad = (n) => (n < 10 ? '0' + n : n); |
| | | return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())} ${pad(date.getHours())}:${pad(date.getMinutes())}:${pad(date.getSeconds())}`; |
| | | }; |
| | | |
| | | const handleStepCompletedChange = (step) => { |
| | | step.isCompleted = Boolean(step.isCompleted); |
| | | if (step.isCompleted && !step.completedTime) { |
| | | step.completedTime = proxy?.parseTime ? proxy.parseTime(new Date()) : formatDateTime(new Date()); |
| | | } |
| | | }; |
| | | |
| | | const handleClose = () => { |
| | |
| | | recordList: steps.value.map((step) => ({ |
| | | processRouteItemId: step.processRouteItemId, |
| | | isCompleted: Number(step.isCompleted ?? 0), |
| | | completedTime: step.completedTime || (step.isCompleted ? (proxy?.parseTime ? proxy.parseTime(new Date()) : formatDateTime(new Date())) : null) |
| | | })), |
| | | }); |
| | | } catch (e) { |
| | |
| | | } |
| | | |
| | | .process-diagram-node { |
| | | width: 160px; |
| | | min-width: 160px; |
| | | height: 78px; |
| | | width: 180px; |
| | | min-width: 180px; |
| | | min-height: 78px; |
| | | border: 1px solid #ebeef5; |
| | | border-radius: 10px; |
| | | background: #fff; |