<template>
    <div class="monitor">
      <div class="monitor-header">
        <el-tabs class="eltabs" v-model="activeName" @tab-click="handleClick" >
            <el-tab-pane label="客户信息审核" name="first">
              <!-- <OnIndex></OnIndex> -->
              <Index></Index>
            </el-tab-pane>
            <el-tab-pane label="回款信息审核" name="second">
              <refund></refund>
            </el-tab-pane>
            <el-tab-pane label="合同信息审核" name="third">
             <contract></contract>
            </el-tab-pane>
            <el-tab-pane label="续约信息审核" name="fourth">
              <resume></resume>
            </el-tab-pane>
           
          </el-tabs>
      </div>
 
    </div>
</template>

<script>
import refund from './components/refundmessage'
import contract from './components/connectionmessage'
import resume from './components/resumemessage'
import OnIndex from './OnIndex'
import Index from './Index'
export default {
    data(){
        return {
            value1:'',
            activeName:'first',
        }
    },
    components:{
      refund,
      contract,
      resume,
      OnIndex,
      Index
    },
    methods:{
      handleClick(){
        
      }
    }
}
</script>

<style scoped>
.monitor{
    background: #F5F7F9;
    padding: 25px;
    box-sizing: border-box;
    width: 100%;
    min-height: 100%;
}
.monitor-header{
  width: 100%;
    height: auto;
    padding: 20px 15px;
    box-sizing: border-box;
    /* background: brown; */
    /* border:  1px solid #E6E6E6; */
    border-radius: 5px;
    background: #ffffff;
    margin-bottom: 20px;
}

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

  .eltabs{
    .el-tabs__header{
      .el-tabs__nav-wrap{
        .el-tabs__nav-scroll{
          display: flex;
          -webkit-box-pack: center;
          justify-content: start !important;
        }
      }
    }
  }
</style>