FE-V2-PC/src/views/secureAccess/approval/indexKDNH.vue

<!--准入资格审核-->
<template>
  <div class="app-container approval">
    <div class="top-big-box" v-if="pageType==1||pageType==2||pageType==3">
      <div>
        <p :class="pageType==1?'color_one':'color_99'" @click="tableClick(1)">待审核</p>
        <p :class="{'back_one':pageType==1}"></p>
      </div>
      <div>
        <p :class="pageType==2?'color_one':'color_99'" @click="tableClick(2)">已通过</p>
        <p :class="{'back_one':pageType==2}"></p>
      </div>
      <div>
        <p :class="pageType==3?'color_one':'color_99'" @click="tableClick(3)">未通过</p>
        <p :class="{'back_one':pageType==3}"></p>
      </div>
      <p class="null-p"></p>
      <!--<p class="add-button-one-120" @click="tableClick(4)"-->
      <!--&gt;<i class="el-icon-plus"></i>准入资格配置</p>-->
    </div>
    <pending v-if="pageType==1"></pending>
    <passed v-if="pageType==2"></passed>
    <failed v-if="pageType==3"></failed>
    <!--<configuration v-if="pageType==4"></configuration>-->
    <info-page v-if="pageType==5" :infoData="infoData"></info-page>
  </div>
</template>
<script>
  import pending from "./pending.vue";
  import passed from "./passed.vue";
  import failed from "./failed.vue";
  // import configuration from "./configuration.vue";
  import infoPage from "./infoPageKDNH.vue";

export default {
  components: {
    pending,
    passed,
    failed,
    // configuration,
    infoPage
  },
  name: "Approval",
  data() {
    return {
      pageType:1,
      pageTypeTwo:1,
      infoData:{
        type:null,
        list:0,//type=0,审核，1查看
      }
    };
  },
  created() {

  },
  methods: {
    pageClick(type,row){
      this.infoData.type = type;
      this.infoData.list = row;
      this.pageType = 5;
    },
    pageOff(){
      // this.pageType = JSON.parse(JSON.stringify(this.pageTypeTwo));
      this.pageType = this.pageTypeTwo;
    },
    //选项卡切换
    tableClick(type){
      if(this.pageType!=type){
        if(type == 4){
          // this.pageTypeTwo = JSON.parse(JSON.stringify(this.pageType));
          this.pageTypeTwo = this.pageType;
        }
        this.pageType = type;
      }
    },
  }
};
</script>
<style scoped lang="scss">
  .approval {
    display: flex!important;
    flex-direction: column;
    box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);
    padding:20px!important;
    .top-big-box{
      display: flex;
      border-bottom:2px solid #E0E0E0;
      margin-top:-9px;
      margin-bottom:32px;
      div{
        cursor:pointer;
        width:128px;
        p:nth-child(1){
          line-height:58px;
          font-size:18px;
          text-align: center;
          margin:0;
        }
        p:nth-child(2){
          width:80px;
          height:4px;
          margin:0 auto;
          border-radius:1px;
        }
      }
      .null-p{
        flex:1;
      }
      .add-button-one-120{
        margin-top:9px;
        margin-right:20px;
      }
    }
  }
</style>