<template>
  <el-dialog title="审批流程" :visible.sync="dialogVisible" width="50%" center>
    <div class="content" v-if="dialogVisible">
      <el-steps direction="vertical" :active="active" space="50px" v-if="type === 0">
        <el-step title="创建完成"></el-step>
        <el-step v-if="showStep2" :title="title1"></el-step>
        <el-step title="待区域管理员分发"></el-step>
        <el-step title="审核通过待下发"></el-step>
        <el-step title="审核通过已下发"></el-step>
      </el-steps>
      <el-steps direction="vertical" :active="active" space="50px" v-if="type === 1">
        <el-step title="创建完成"></el-step>
        <el-step :title="title2"></el-step>
        <el-step :title="title3"></el-step>
        <el-step title="待区域管理员拆解审核"></el-step>
        <el-step title="待商务管理员拆解审核"></el-step>
        <el-step title="待事业部分管领导拆解审核"></el-step>
        <el-step title="拆解完成"></el-step>
      </el-steps>
    </div>
  </el-dialog>
</template>

<script>
export default {
  data() {
    return {
      dialogVisible: false,
      showStep2: false,
      title1: '待营销中心分管领导审批',
      title2: '待运营管理员分发审核',
      title3: '待服务商管理员拆解',
      active: 1,
      type: 0
    };
  },
  methods: {
    showDialog(row) {
      console.log('row', row);

      this.type = row.parentId === 0 ? 0 : 1;
      this.title1 = '待营销中心分管领导审批';
      this.title2 = '待运营管理员分发审核';
      this.title3 = '待服务商管理员拆解';
      this.active = 1;
      // 父级状态
      if (row.parentId == 0) {
        this.showStep2 = row.planType === 'QRT' ? false : true;
        if (row.planState === 'PASSED') {
          if (!row.children) {
            this.active = 2;
          } else {
            this.active = row.execScoreValue > 0 ? 5 : 3;
          }
        } else if (row.planState === 'REJECTED') {
          this.title1 = '营销中心分管领导拒绝';
        }
      } else {
        if (row.planState === 'PASSED') {
          if (!row.planDetails) {
            this.active = 2;
          } else {
            switch (row.planDetails.detailsState) {
              case 'INIT':
                this.active = 3;
                break;
              case 'CKT1':
                this.active = 4;
                break;
              case 'CKT2':
                this.active = 5;
                break;
              case 'PASSED':
                this.active = 7;
                break;
              case 'REJECTED':
                this.active = 2;
                this.title3 = '拆解审核失败，待服务员管理员重新拆解';
                break;
              default:
                break;
            }
          }
        } else if (row.planState === 'REJECTED') {
          this.title2 = '运营管理员分发审核拒绝';
        }
      }

      this.dialogVisible = true;
    }
  }
};
</script>

<style lang="scss" scoped></style>
