<template>
    <bread-page>
        <menu-page>
            <div class="menu-left" slot="menuList">
                <el-menu :default-active="flag" @select="handleSelect">
                    <el-menu-item index="1">平台动态</el-menu-item>
                    <el-menu-item index="2">领域资讯</el-menu-item>
                </el-menu>
            </div>

            <div class="main">
                <div v-if="flag == 1">
                    <news-dynamic></news-dynamic>
                </div>
                <div v-else>
                    <news-field></news-field>
                </div>
            </div>
        </menu-page>
    </bread-page>
</template>

<script>
import { mapState } from 'vuex';
import BreadPage from '../../components/page/BreadPage.vue';
import MenuPage from '../../components/page/MenuPage.vue';
import newsDynamic from '../../components/newsDynamic.vue';
import newsField from '../../components/newsField.vue';
export default {
    components: { BreadPage, MenuPage, newsField, newsDynamic },
    data() {
        return {
            flag: 1
        };
    },
    computed: {
        ...mapState(['adminleftnavnum'])
    },
    methods: {
        handleSelect(key) {
            this.flag = key;
            this.$router.push('/newsList?flag=' + key);
        }
    },
    created() {
        if (this.$route.query.flag) {
            this.handleSelect(this.$route.query.flag);
        }
    }
};
</script>

<style lang="less" scoped>
.menu-left {
    min-height: 600px;
    background-color: #fff;
}
.main {
    min-height: 900px;
    margin-top: -20px;
    flex-grow: 1;
    .flex-col();
}
</style>
