<template>
    <div id="main">
        <Loading v-if="isLoading" :top="300"></Loading>
        <BaseLayout>
            <!-- 头部右侧个人中心部分 -->
            <div class="header-right-box fl-around" slot="header-content">
                <Icon custom="iconfont icon-home" :color="routerName == 'homePage' ? '#1CC0F3':'#d0d0d0'" @click="toHome" />
                <BaseNotification></BaseNotification>
                <Icon type="ios-settings" :color="routerName == 'settings' ? '#1CC0F3':'#d0d0d0'" @click="toSettings" />
                <!-- 问题答疑页面暂未开发 暂时注释 -->
                <!-- <Icon type="md-help-circle" :color="routerName == 'feedback' ? '#1CC0F3':'#d0d0d0'" @click="toFeedback"/> -->
                <BaseUserPoptip @logout="basicMenu('quit')"></BaseUserPoptip>
            </div>
            <div id="content" class="custom-scroll-bar" slot="content">
                <router-view v-if="!$route.meta.isKeep" :key="this.$route.name"></router-view>
                <keep-alive>
                    <router-view v-if="$route.meta.isKeep" :key="this.$route.name"></router-view>
                </keep-alive>
            </div>
        </BaseLayout>
    </div>
</template>

<script>
export default {
    name: 'headers',
    props: ['parentToChild', 'identityselect'],
    components: {},
    computed: {

    },
    data() {
        return {
            isShowMock: false,
            isOpenDrawer: false,
            routerName: '',
            isLoading: false
        }
    },
    created() {
        //刷新重置vuex
        console.log('进入大云...')
        console.log(this.$store)

        //  window.addEventListener('beforeunload',() => {
        //     if(this.$store.state.user.school_profile.school_base){
        //         schoolStr = encodeURIComponent(JSON.stringify(this.$store.state.user.school_profile.school_base), "utf-8")
        //         localStorage.setItem('school_profile', schoolStr)
        //     }
        // })

        let user = JSON.parse(decodeURIComponent(localStorage.userInfo, "utf-8"))
        let user_profile = JSON.parse(decodeURIComponent(localStorage.user_profile, "utf-8"))
        if (user_profile.schools) {
            user_profile.schools = user_profile.schools.filter((item) => {
                return item.status == 'join'
            })
        } else {
            user_profile.schools = []
        }
        if (user_profile.schools.length) {
            this.$store.commit('setUserInfo', {
                TEAMModelId: user.id,
                name: user.name,
                schoolCode: user_profile.defaultschool || user_profile.schools[0].schoolId
            })
        } else {
            this.$store.commit('setUserInfo', {
                TEAMModelId: user.id,
                name: user.name,
                schoolCode: this.$GLOBAL.DEFAULT_SCHOOL_CODE
            })
        }



    },
    methods: {
        toHome() {
            this.$router.push({ path: '/home/homePage' })
        },
        toSettings() {
            this.$router.push({ path: '/home/settings' })
        },
        toFeedback() {
            this.$router.push({ path: '/home/feedback' })
        },
        closeMenu() {
            this.isOpenDrawer = false
        },
        basicMenu(name) {
            if (name == 'quit') {
                //     localStorage.removeItem('access_token')
                //     localStorage.removeItem('expires_in')
                //     localStorage.removeItem('userInfo')
                //     localStorage.removeItem('userAccess')
                //     localStorage.removeItem('user_details')
                this.$store.commit('user/resetSchoolProfile')
                this.$User.logout()
                this.$router.push({
                    path: '/login'
                })
            }
        }
    },
    mounted() {

        if (localStorage.getItem('noSave') && JSON.parse(localStorage.getItem('noSave')).length) {
            this.$tools.deleteNoSave(JSON.parse(localStorage.getItem('noSave')))
        } else {
            localStorage.setItem('noSave', '[]')
        }

        this.$EventBus.$off('onGlobalLoading')
        this.$EventBus.$on('onGlobalLoading', val => {
            this.isLoading = val
        })

        this.$EventBus.$off('noSave')
        this.$EventBus.$on('noSave', val => {
            let curNoSaveArr = JSON.parse(localStorage.getItem('noSave'))
            curNoSaveArr.push(val)
            localStorage.setItem('noSave', JSON.stringify(curNoSaveArr))
        })

    },
    watch: {
        $route: {
            handler(val, oldval) {
                this.routerName = val.name
            },
            // 深度观察监听
            deep: true,
            //立即执行
            immediate: true
        }
    }
}
</script>

<style scoped>
.header-right-box {
    width: 400px;
    margin: 12px;
    line-height: 1.5;
    float: right;
}

.header-right-box .ivu-icon {
    font-size: 22px;
    color: #d0d0d0;
    cursor: pointer;
}

.header-right-box img {
    width: 40px;
    border-radius: 50%;
    border: 2px solid #595959;
}

.fl-around {
    display: flex;
    align-items: center;
    justify-content: space-around;
}
</style>

<style>
html,
body {
    height: 100%;
    width: 100%;
    margin: 0px;
    padding: 0px;
}

#main {
    width: 100%;
    height: 100%;
}

#main .layout {
    border: none;
    border-radius: 0px;
}

#content {
    height: 100%;
    background: #242328;
    overflow: hidden;
}

/*重绘滚动条样式*/
.scrollstyle::-webkit-scrollbar {
    width: 5px;
}

.ivu-drawer-body::-webkit-scrollbar-track {
    display: none;
}

.scrollstyle::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: #94998a;
}

.scrollstyle::-webkit-scrollbar-button {
    display: none;
}
</style>

<style lang="less">
@import "../css/dark-iview-modal.less";
@import "../css/dark-iview-tabs.less";
@import "../css/dark-iview-collapse.less";
@import "../css/dark-iview-form.less";
@import "../css/dark-iview-upload.less";
@import "../css/dark-iview-table.less";
@import "../css/dark-iview-split.less";
@import "../css/dark-iview-page.less";
@import "../css/custom-animate.less";
@import "../css/dark-wang-editor.less";
@import "../css/dark-iview-loading.less";
@import "../css/disabled-iview-form.less";
@import "../css/common-style.less";
@import "../css/dark-iview-drawer.less";
@import "../css/dark-iview-card.less";
@import "../css/dark-iview-poptip.less";
@import "../css/dark-iview-checkbox.less";
@import "../css/dark-el-cascader.less";
</style>