100路视频

zhanghua

2023-12-04 e6443cf405d4e950abe35a29e6c133d097fc1ad5

 src/components/process/index.vue

@@ -1,36 +1,13 @@
<template>
  <div class="my-process">
    <div class="my-pro-header">
      <div class="pro-step" v-for="(item, index) in list" :key="item.name">
        <div class="pro-step-top">
          <div
            :class="[
              'circle',
              active === index
                ? 'in-process__circle'
                : active > index
                ? 'finish'
                : 'wait',
            ]"
          ></div>
          <div
            :class="['line', active > index ? 'finish-line' : '']"
            v-if="index < list.length - 1 ? true : false"
          ></div>
        </div>
        <div
          :class="[
            'pro-step-name',
            active === index
              ? 'in-process'
              : active > index
              ? 'finish-name'
              : 'wait',
          ]"
        >
          {{ item.name }}
        </div>
      </div>
      <el-steps :space="260" :active="active" finish-status="success">
        <el-step
          v-for="item in list"
          :title="item.name"
          :key="item.title"
        ></el-step>
      </el-steps>
    </div>
    <div class="my-pro-main">
      <div class="pro-step-ver" v-for="(item, index) in list" :key="item.title">
@@ -81,7 +58,9 @@
          </div>
          <div class="desc-content" v-if="active > index">
            <div class="desc-content-message">
              {{ item.disposeRecords[0].result || "" }}
              {{
                (item.disposeRecords[0] && item.disposeRecords[0].result) || ""
              }}
            </div>
            <div class="desc-content-endtime">
              {{
@@ -111,9 +90,6 @@
      handlePassVo: { workflowConfigSteps: mylist },
      baseCase: { state: mystate },
    } = this;
    // console.log(this.handlePassVo.workflowConfigSteps[0].name);
    // console.log(mylist);
    console.log(mystate);
    if (mystate === 6) {
      this.active = 1;
    } else if (mystate === 7) {
@@ -123,7 +99,7 @@
    } else if (mystate === 9) {
      this.active = 4;
    } else {
      this.active = -1;
      this.active = 0;
    }
    this.list = mylist;
  },
@@ -141,7 +117,8 @@
.my-process {
  padding-top: 50px;
  .my-pro-header {
    display: flex;
    padding: 0 30px;
    line-height: 1;

    .pro-step {
      flex: 1;
@@ -223,5 +200,8 @@
  .finish-name {
    color: #4b9bb7;
  }
  .desc-content-message {
    color: #666;
  }
}
</style>