|
@@ -9,13 +9,13 @@
|
|
|
>
|
|
>
|
|
|
<!-- 步骤圆圈 -->
|
|
<!-- 步骤圆圈 -->
|
|
|
<div class="step-circle">
|
|
<div class="step-circle">
|
|
|
- <div v-if="step.status === tCompleted.value" class="step-icon completed">
|
|
|
|
|
|
|
+ <div v-if="step.status === STATUS_COMPLETED" class="step-icon completed">
|
|
|
<el-icon><Check /></el-icon>
|
|
<el-icon><Check /></el-icon>
|
|
|
</div>
|
|
</div>
|
|
|
- <div v-else-if="step.status === tProcessing.value" class="step-icon processing">
|
|
|
|
|
|
|
+ <div v-else-if="step.status === STATUS_PROCESSING" class="step-icon processing">
|
|
|
{{ index + 1 }}
|
|
{{ index + 1 }}
|
|
|
</div>
|
|
</div>
|
|
|
- <div v-else-if="step.status === tFailed.value" class="step-icon failed">
|
|
|
|
|
|
|
+ <div v-else-if="step.status === STATUS_FAILED" class="step-icon failed">
|
|
|
<el-icon><Close /></el-icon>
|
|
<el-icon><Close /></el-icon>
|
|
|
</div>
|
|
</div>
|
|
|
<div v-else class="step-icon waiting">
|
|
<div v-else class="step-icon waiting">
|
|
@@ -28,7 +28,7 @@
|
|
|
<div class="step-title">{{ step.name }}</div>
|
|
<div class="step-title">{{ step.name }}</div>
|
|
|
<div class="step-status">
|
|
<div class="step-status">
|
|
|
{{ getStepTitle(step) }}
|
|
{{ getStepTitle(step) }}
|
|
|
- <div v-if="step.status !== tWaiting.value" class="step-details">
|
|
|
|
|
|
|
+ <div v-if="step.status !== STATUS_WAITING" class="step-details">
|
|
|
{{ tCurrentProgress.value.replace('{current}', step.current).replace('{total}', step.total) }}
|
|
{{ tCurrentProgress.value.replace('{current}', step.current).replace('{total}', step.total) }}
|
|
|
{{ getCurrentGoodsNo(step) }}
|
|
{{ getCurrentGoodsNo(step) }}
|
|
|
<span v-if="step.error" style="color: red; margin-left:5px;">{{ tFailedCount.value.replace('{count}', step.error) }}</span>
|
|
<span v-if="step.error" style="color: red; margin-left:5px;">{{ tFailedCount.value.replace('{count}', step.error) }}</span>
|
|
@@ -110,25 +110,25 @@ const getStepTitle = (step: StepData) => {
|
|
|
return step.status
|
|
return step.status
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-// 获取步骤样式类
|
|
|
|
|
|
|
+// 后端返回的中文状态值常量
|
|
|
|
|
+const STATUS_WAITING = '等待处理'
|
|
|
|
|
+const STATUS_PROCESSING = '正在处理'
|
|
|
|
|
+const STATUS_COMPLETED = '处理完成'
|
|
|
|
|
+const STATUS_FAILED = '处理失败'
|
|
|
|
|
+
|
|
|
|
|
+// 获取步骤样式类 - 使用后端返回的中文状态值
|
|
|
const getStepClass = (step: StepData) => {
|
|
const getStepClass = (step: StepData) => {
|
|
|
return {
|
|
return {
|
|
|
- 'step-completed': step.status === tCompleted.value,
|
|
|
|
|
- 'step-processing': step.status === tProcessing.value,
|
|
|
|
|
- 'step-failed': step.status === tFailed.value,
|
|
|
|
|
- 'step-waiting': step.status === tWaiting.value
|
|
|
|
|
|
|
+ 'step-completed': step.status === STATUS_COMPLETED,
|
|
|
|
|
+ 'step-processing': step.status === STATUS_PROCESSING,
|
|
|
|
|
+ 'step-failed': step.status === STATUS_FAILED,
|
|
|
|
|
+ 'step-waiting': step.status === STATUS_WAITING
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-// 获取进度百分比
|
|
|
|
|
-const getProgressPercentage = (step: StepData) => {
|
|
|
|
|
- if (step.total === 0) return 0
|
|
|
|
|
- return Math.round((step.current / step.total) * 100)
|
|
|
|
|
-}
|
|
|
|
|
-
|
|
|
|
|
-// 检查是否所有步骤都完成
|
|
|
|
|
|
|
+// 检查是否所有步骤都完成 - 使用后端返回的中文状态值
|
|
|
const allStepsCompleted = computed(() => {
|
|
const allStepsCompleted = computed(() => {
|
|
|
- return props.steps.every(step => step.status === '处理完成')
|
|
|
|
|
|
|
+ return props.steps.every(step => step.status === STATUS_COMPLETED)
|
|
|
})
|
|
})
|
|
|
|
|
|
|
|
// 获取当前货号(这里需要根据实际数据结构调整)
|
|
// 获取当前货号(这里需要根据实际数据结构调整)
|