Smart_platform_ui/src/components/checkL/checkSchedule.vue

<template>
  <div>
    <div style="height: 90%;margin-top:30px;margin-left: 20%" v-if="data.length>0">
      <el-steps direction="vertical"
                :active="active"
                space="150px"
                align-center
                style="font-size: 12px">
        <el-step :key="index"
                 v-for="(item,index) in data"
                 :title="item.title"
                 :status="item.status"
                 style="font-size: 14px !important;">
          <template slot="description" scope="scope">
            <table width="100%" border="0" cellspacing="0" cellpadding="0" style="font-size: 14px">
              <tr>
                <td>
                  <span >{{index === 0?'提交人:':'审批人:'}}&nbsp;&nbsp;&nbsp;</span><span>{{item.auditName}}</span>
                </td>
              </tr>
              <tr>
                <td>
                  <span >{{index === 0?'提交日期:':'审批日期:'}}&nbsp;&nbsp;&nbsp;</span><span>{{item.auditOpTime}}</span>
                </td>
              </tr>
              <tr>
                <td>
                  <span >{{index === 0?'备注':'审批意见'}}:&nbsp;&nbsp;&nbsp;</span><span>{{item.auditMsg}}</span>
                </td>
              </tr>
            </table>
          </template>
        </el-step>
      </el-steps>
      <div class="dialogButton">
        <el-button size="small" @click="$emit('choceScheduleFun')">关闭</el-button>
      </div>
    </div>
    <div style="height: 90%;margin-top:30px;" v-else>
      <div style="text-align: center">
        <i class="el-icon-document" style="font-size: 60px;"></i>
        <div style="margin: 10px auto">暂无记录</div>
      </div>
      <div class="dialogButton">
        <el-button size="small" @click="$emit('choceScheduleFun')">关闭</el-button>
      </div>
    </div>
  </div>
</template>

<script>
  import option from './config/mainList.json'
  import { auditProcessListXD } from "@/api/check/check";

  export default {
    name: "checkSchedule",
    props: {
      checkId: {
        type: String
      },
      batchNo:{
        type: String
      },
      times:{
        type: String
      },
      choceScheduleFun:{
        type: Function
      }
    },
    data(){
      return {
        loading:false,
        option:option,
        active:1,
        data:[],
        page: {
          pageSize: 10,
          pagerCount: 5,
          total: 0,
        },
      }
    },
    watch:{
      checkId(val, oldVal) {
        if(val != oldVal){
          this.init()
        }
      },
      batchNo(val, oldVal) {
        if(val != oldVal){
          this.init()
        }
      }
    },
    created() {

    },
    mounted() {
      this.init()
    },
    methods:{
      init(){
        this.times = this.times?this.times:''
        auditProcessListXD(this.checkId,this.batchNo,this.times).then(res =>{
          res.data.data.map((item,index) =>{
            if(item.auditStatus == "A"){
              this.active = index + 2
              item.title = "审批通过"
              item.status = "success"
            }
            if(item.auditStatus == "B"){
              item.title = "审批驳回"
              item.status = "error"
            }
            if(item.auditStatus == "S" || item.auditStatus == "N"){
              item.title = "待审批"
            }
          })

          let sendObject = {
            ... res.data.data[0],
            auditName:res.data.data[0].sendName,
            auditOpTime:res.data.data[0].sendTime,
            auditMsg:res.data.data[0].sendMsg,
            auditStatus:"O",
            title:"提交",
          }
          res.data.data.unshift(sendObject)
          this.data = res.data.data
        })
      }
    }
  }
</script>

<style scoped lang="scss">
  /*::v-deep .el-step__title{*/
  /*  font-size: 14px;*/
  /*}*/
</style>