<style lang="scss" scoped>
.search-bar {
    display: flex;
    align-items: center;
}
.search-box p {
    display: inline-block;
    border: 1px solid #f2f2f2;
    border-radius: 5px;
    margin-right: 10px;
    padding: 5px 10px;
    cursor: pointer;
}
.card-person-drawer {
    width: 100%;
    height: 90%;
    overflow: hidden;
    padding: 10px 0px;
    display: flex;
    flex-wrap: wrap;
    margin-right: -10px;
    justify-content: space-between;
    ::v-deep .ant-card-body {
        padding: 0;
    }
    ::v-deep .ant-card-head {
        padding: 0 5px;
    }
    .card-item {
        width: calc(25% - 10px);
        margin-bottom: 10px;
        float: left;
    }
    .card-item-else {
        width: calc(20% - 10px);
        margin-bottom: 10px;
        float: left;
    }
}
</style>
<style scoped>
.showNumBox {
    margin: 10px 0;
}
.showNumBox .ant-card-body {
    display: flex;
    justify-content: center;
}
.showNumBox p,
.showNumBox span {
    text-align: center;
    line-height: 40px;
    font-size: 30px;
    font-weight: 600;
    color: red;
    margin: 0;
}
.search-box .ant-card-body {
    padding: 5px 15px;
}
.showNumBox .ant-card-body .styleElse {
    line-height: 60px;
    height: 40px;
    font-size: 16px;
    font-weight: 400;
    margin-left: 10px;
}
.ant-modal-wrap .yincang .ant-modal-content .ant-modal-footer {
    display: none !important;
}
.yincang .ant-col-6 p {
    text-align: left;
    color: red;
    font-size: 16px;
    font-weight: 500;
}
.ant-table-thead div {
    font-weight: 700;
}
.tool-tip {
    position: absolute;
    top: 65px;
    right: 10px;
}
</style>
<style lang="less" scoped>
.ant-card-head .ant-tabs-bar {
    padding: 0;
}
.search-box .ant-card-body {
    padding: 5px 15px;
}
.search-box {
    padding: 15px 10px;
}
.search-box p {
    display: inline-block;
    border: 1px solid #f2f2f2;
    border-radius: 5px;
    margin-right: 10px;
    padding: 5px 10px;
    cursor: pointer;
}
.statistics .ant-col-6 .ant-card-body .styleElse {
    line-height: 60px;
    height: 40px;
    font-size: 16px;
    font-weight: 400;
    margin-left: 10px;
}
.ant-modal-wrap .yincang .ant-modal-content .ant-modal-footer {
    display: none !important;
}
.yincang .ant-col-6 p {
    text-align: left;
    color: red;
    font-size: 16px;
    font-weight: 500;
}
.ant-table-thead div {
    font-weight: 700;
}
.tool-tip {
    position: absolute;
    top: 65px;
    right: 10px;
}
.statistics {
    .ant-card-bordered {
        border: none;
    }
    .ant-card-head .ant-tabs {
        clear: both;
        margin-bottom: -13px;
        color: rgba(0, 0, 0, 0.65);
        font-weight: normal;
        font-size: 14px;
    }
    .duibi {
        position: absolute;
        right: 24px;
        top: 15px;
    }
    p {
        margin-bottom: 0;
    }
}
</style>

<style lang="less" scoped>
.middle-button {
    margin: 0 8px;
}
.newPlanStatic {
    .divider {
        height: 62px;
    }
    .showNumBox {
        background: white;
        overflow: hidden;
        margin: 15px 0;
        padding: 30px 0;
        text-align: center;
        .ant-card-body {
            padding-top: 0;
        }
        .title {
            font-size: 14px;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: #999999;
            line-height: 22px;
            display: inline-block;
        }
    }
    .tabbody {
        background: white;
        padding: 0 24px;
        margin-bottom: 15px;
        .ant-tabs-bar {
            margin: 0;
        }
    }
    .chartBox {
        background: white;
        padding: 20px 0;
    }
    .tableBody {
        background: white;
        padding: 20px;
    }
}
</style>
<template>
    <div class="newPlanStatic config-project">
        <div class="tabbody">
            <a-tabs v-model="tabKey" @change="tabChange">
                <a-tab-pane key="channelList" tab="渠道号"> </a-tab-pane>
                <a-tab-pane key="2" tab="单品" disabled> </a-tab-pane>
                <!-- <a-button slot="tabBarExtraContent" type="primary" @click="newCreat(null)">
                    创建渠道号
                </a-button> -->
            </a-tabs>
        </div>
        <component v-bind:is="currentTabComponent"></component>

    </div>
</template>

<script>
import moment from 'moment'

let KScolumns = []

export default {
    components: {
        channelList: () => import('./components/channelList'),
    },

    data() {
        return {
            currentTabComponent: 'channelList',
  
            tabKey: 'channelList',

        }
    },
    methods: {
        moment,

        // 快手头条的切换
        tabChange(key) {
            this.currentTabComponent = key;
        },

    },
    watch: {

    },
    computed: {
      
    },
    mounted() {
       
    },
    activated: function() {},

    filters: {
        
    }
}
</script>
