fix: 修复工序步骤条当前工序展示错误的问题

songshankun

2023-11-14 c8cf9f8ba577ce75e8723ff2d4218fffae349c47

fix: 修复工序步骤条当前工序展示错误的问题

 src/views/dashboard/components/TaskStep.vue

@@ -8,13 +8,13 @@
        class="task-step-item"
        :style="{ 'flex-basis': flexBasis }"
      >
        <el-icon v-if="index + 1 < active" class="icon" size="22" color="#01f304"><CircleCheck /></el-icon>
        <el-icon v-if="index < active" class="icon" size="22" color="#01f304"><CircleCheck /></el-icon>

        <el-icon v-if="index + 1 === active" class="icon" size="22" color="#c25915">
        <el-icon v-if="index === active" class="icon" size="22" color="#c25915">
          <Clock />
        </el-icon>
        <el-icon v-if="index + 1 > active" class="icon" size="22" color="#7d7f83"><Clock /></el-icon>
        <span class="text" :class="{ green: index + 1 < active, red: index + 1 === active, gray: index + 1 > active }">
        <el-icon v-if="index > active" class="icon" size="22" color="#7d7f83"><Clock /></el-icon>
        <span class="text" :class="{ green: index < active, red: index === active, gray: index > active }">
          {{ item }}
        </span>
        <span class="line"></span>
@@ -50,8 +50,7 @@
    () => [props.steps, activeItemRef.value, scrollerRef.value],
    () => {
      if (props.steps.length > 0 && activeItemRef.value?.length && scrollerRef?.value) {
        console.log(scrollerRef?.value)
        const left = props.active - 1 >= 0 ? activeItemRef.value[props.active - 1]?.offsetLeft ?? 20 : 20
        const left = props.active >= 0 ? activeItemRef.value[props.active]?.offsetLeft ?? 20 : 20
        requestAnimationFrame(() => {
          scrollerRef?.value?.setScrollLeft?.(left - 20)
        })