<template>
    <a-card
        style="width:100%"
        :tab-list="tabListNoTitle"
        :active-tab-key="currentTabComponent"
        @tabChange="key => onTabChange(key)"
    >
        <component v-bind:is="currentTabComponent"></component>
    </a-card>
        
    
</template>

<script>
import moment from 'moment';

export default {
    components:{
        directional: () => import('../directional/directional'),
        person: () => import('@/views/modules/crowd-control/crowd-control.vue'),
        url: () => import('../url/url'),
        application: () => import('../application/application'),
    },
    data() {
        return {
            currentTabComponent:'directional',//当前加载的组件名称
            tabListNoTitle: [
                {
                    key: 'directional',
                    tab: '定向包管理',
                },
                {
                    key: 'person',
                    tab: '人群包管理',
                },
                {
                    key: 'url',
                    tab: '落地页管理',
                },
                {
                    key: 'application',
                    tab: '应用包管理',
                },
            ], 
        }
    },
    methods: {
        onTabChange(key, type) {
            this.currentTabComponent = key;
        },
    },
    created() {
        this.currentTabComponent = 'directional';
    }
   
}

</script>
