<template>
    <div style="display:flex;flex-direction: row;justify-content: space-between;background:rgb(84, 92, 100);align-items:center">
        <div style="display: flex;flex-direction: row;align-items: center;justify-content: center">
            <el-button style="background-color: transparent;border: none" @click="handleMenu" size="mini"><i style="color: #eeeeee" class="el-icon-menu"></i></el-button>
            <BreadCrumb></BreadCrumb>
        </div>

        <div>
            <el-menu default-active=""
                     background-color="#545c64"
                     class="el-menu-demo"
                     mode="horizontal"
                     text-color="#ffffff">
                <el-menu-item>
                    <i class="el-icon-s-platform"></i>大屏展示
                </el-menu-item>
                <el-menu-item>
                    <el-dropdown trigger="click">
                        <div style="height:100%;">
                            <i class="el-icon-user"></i>
                            <span style="color:#fff">超级管理员</span>
                            <i class="el-icon-caret-bottom" />
                        </div>
                        <el-dropdown-menu>
<!--                            <el-dropdown-item>-->
<!--                                <span style="display:block;">修改密码</span>-->
<!--                            </el-dropdown-item>-->
                            <el-dropdown-item @click.native="logout">
                                <span style="display:block;">退出系统</span>
                            </el-dropdown-item>
                        </el-dropdown-menu>
                    </el-dropdown>
                </el-menu-item>
            </el-menu>
        </div>
    </div>

</template>

<script>

import BreadCrumb from "@/components/System/BreadCrumb.vue";

export default {
    name: "AdminHeader",
    components: {BreadCrumb},
    data(){
        return{
        }
    },
    methods:{
        logout(){
            if(this.$cookie.get('adminName')){
                this.$cookie.delete('adminName');
                this.$router.push({
                    path:'/adminLogin'
                })
            }
        },
        handleMenu() {
            // 相当于调用这个方法
            this.$store.commit('CollapseMenu')
        },
    }

}
</script>

<style scoped>

</style>