前端

jiangping

2025-07-17 2cfe454c309a65f02e89063d8306ff71f86b7f5c

 admin/src/components/business/orderProgress.vue

@@ -6,15 +6,30 @@
        :visible.sync="visible"
        :confirm-working="isWorking"
    >
        <el-timeline reverse>
            <el-timeline-item v-for="(item, index) in list" :key="index" :hide-timestamp="true">
                <div style="display: flex; flex-direction: column;">
                    <span class="a">{{item.title}}</span>
                    <span class="b">{{item.creatorName}} {{item.companyName || '平台理赔员'}} {{item.createDate }}</span>
                    <span class="c" v-if="index >0 && item.content">说明：{{item.content}}</span>
                </div>
            </el-timeline-item>
      <div class="time-line">
        <el-timeline :reverse="true">
          <el-timeline-item
              v-for="(activity, index) in list"
              :key="index"
              color="#2991FF"
              size="large"
              type="primary"
          >
            <div class="time">
              <div>
            <span class="year">
              {{ activity.createTime.substring(0, 10) }}
            </span>
              </div>
              <div class="day">{{ activity.createTime.substring(10,20) }}</div>
            </div>
            <div class="ml10">
              <div class="list-title">{{ activity.title }}</div>
              <div class="list-company">{{activity.logInfo }}</div>
            </div>
          </el-timeline-item>
        </el-timeline>
      </div>
    </GlobalWindow>
</template>

@@ -39,19 +54,49 @@
  }
}
</script>

<style lang="scss" scoped>
    .a {
        color: rgba(16,16,16,1);
        font-size: 14px;
    }
    .b {
        color: rgba(154,154,154,1);
        font-size: 14px;
        margin: 10px 0;
    }
    .c {
        color: rgba(16,16,16,1);
        font-size: 14px;
    }
.time-line {
  margin-top: 50px;
  margin-left: 200px;
}
.list-title {
  font-size: 12px;
  font-family: PingFangSC-Medium, PingFang SC;
  font-weight: 500;
  color: #181b1e;
}
.list-company {
  font-size: 12px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #596878;
  margin-bottom: 15px;
}
.list-desc {
  font-size: 12px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #596878;
}
//左侧时间
.time {
  color: #409eff;
  position: absolute;
  left: -94px;
  top: 1px;
  .year {
    font-size: 14px;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: #20354a;
  }
  .day {
    font-size: 12px;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: black;
    text-align: right;
    margin-top: 0px;
  }
}
</style>