<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>
  </basicContainer>

</template>


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

        type: {},
        option: {
          column: [{
            icon: 'el-icon-info',
            label: '充值明细',
            prop: 'tab1',
          }, {
            icon: 'el-icon-warning',
            label: '扣款明细',
            prop: 'tab2',
          }]
        },

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

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

<style>
</style>
