11

86134

2023-11-18 281971fb8056d8c244d48fa0db383e48db541f06

 src/views/product/workbench/operation-task-pane.vue

@@ -8,7 +8,6 @@
    >
    </el-alert>
    <el-card
    
  v-for="(item, index) in operationTasks"
    @click.native="setCheckFlag(item)"
  shadow="hover"
@@ -60,10 +59,25 @@
    </div> -->
    <div class="row">
      <div class="l">计划完成时间：</div>
      <div class="r" >{{ item.planFinishDay }}</div>
      <div class="r">{{ item.planFinishDay }}</div>
    </div>
  </div>

  <el-progress
    class="task-progress"
    :text-inside="true"
    :stroke-width="20"
    :percentage="
      Number((item.completedQuantity / item.plannedQuantity).toFixed(2)) *
        100 >
      100
        ? 100
        : Number(
            (item.completedQuantity / item.plannedQuantity).toFixed(2)
          ) * 100
    "
    :format="formatPercentage(item.completedQuantity, item.plannedQuantity)"
  ></el-progress>
</el-card>
  </div>
</template>
@@ -334,6 +348,12 @@
    }
  },
  methods: {

    setCheckFlag(item) {
      this.$nextTick(() => {
        this.changeBackgroundColor(item.planFinishDay);
      });
    },
    getBackgroundColor(planFinishDay) {
    const currentDate = new Date();
    currentDate.setHours(0, 0, 0, 0); // 设置时间为当天的开始，忽略时分秒毫秒
@@ -341,25 +361,26 @@
    planFinishDayObj.setHours(0, 0, 0, 0); // 同样设置时间为计划完成日的开始

    if (planFinishDayObj < currentDate) {
      // 如果计划完成日在当前日之前，返回'blue'表示过期
      return 'red';
        // 如果计划完成日在当前日之前，返回'rgba(0, 0, 255, 0.3)'表示过期，这里的 0.3 控制了透明度
        return 'rgba(255, 0, 0, 0.5)';
    } else {
      const timeDifference = currentDate - planFinishDayObj;
      const daysDifference = Math.ceil(timeDifference / (1000 * 60 * 60 * 24));
        const timeDifference = currentDate - planFinishDayObj;
        const daysDifference = Math.ceil(timeDifference / (1000 * 60 * 60 * 24));

      if (daysDifference < 0) {
        // 如果计划完成日在未来，计算它是否在10天内
        const daysUntilDue = Math.abs(daysDifference);
        if (daysUntilDue <= 10) {
          // 如果在10天内，返回'yellow'表示即将到期
          return 'yellow';
        if (daysDifference < 0) {
            // 如果计划完成日在未来，计算它是否在10天内
            const daysUntilDue = Math.abs(daysDifference);
            if (daysUntilDue <= 10) {
                // 如果在10天内，返回'rgba(255, 255, 0, 0.3)'表示即将到期，这里的 0.3 控制了透明度
                return 'rgba(219, 219, 54, 0.7)';
            }
            return 'rgba(28, 62, 222, 0.8)';
        }
      }
    }
    // 如果不是即将到期或已过期，返回'red'表示已到期
    return 'blue';
    // 如果不是即将到期或已过期，返回'rgba(255, 0, 0, 0.3)'表示已到期，这里的 0.3 控制了透明度
    return 'rgba(255, 0, 0, 0.5)';
},
    

    // 点击工单，选中工单
    setCheckFlag(item) {
      if (item.checkFlag) {