<template>
  <basicContainer>
    <avue-tabs :option="option" @change="handleChange"></avue-tabs>
    <span v-if="type.prop==='tab1'">
      <chongzhi ref="chongzhi"></chongzhi>
    </span>
    <!--<span v-else-if="type.prop==='tab2'">
      <debit ref="debit"></debit>
    </span>-->
    <span v-else-if="type.prop==='tab3'">
      <withdraw ref="withdraw"></withdraw>
    </span>
  </basicContainer>

</template>


<script>
  import chongzhi from "@/views/billrecord/chongzhi";
  import debit from "@/views/guosen/debit";
  import withdraw from "@/views/guosen/withdraw";
  export default {
    components:{
      chongzhi,
      debit,
      withdraw
    },
    data() {
      return {

        type: {},
        option: {
          column: [{
            icon: 'el-icon-info',
            label: '采购明细',
            prop: 'tab1',
          },
          /*  {
            icon: 'el-icon-warning',
            label: '扣款明细',
            prop: 'tab2',
          },*/
            {
              icon: 'el-icon-warning',
              label: '代付明细',
              prop: 'tab3',
            }]
        },

      }
    },
    created() {
      this.type = this.option.column[0];

    },
    methods: {
      handleChange(column) {
        this.type = column
        if(this.type.prop==='tab1'){
          this.$nextTick(()=>{
            this.$refs.chongzhi.searchReset();
          })
        }else if(this.type.prop==='tab2'){
          this.$nextTick(()=>{
            this.$refs.debit.searchReset();
            // this.$refs.withdraw.searchReset();
          })
        }else{
          this.$nextTick(()=>{
            this.$refs.withdraw.searchReset();
          })
        }
      }
    }
  }
</script>

<style>
</style>
