<template>
    <div id="main">
        <Loading v-if="isLoading" :top="300"></Loading>
        <AreaLayout>
            <!-- 头部右侧个人中心部分 -->
            <div class="header-right-box fl-around" slot="header-content">
                <Icon style="display:block" custom="iconfont icon-home" :color="routerName == 'homePage' ? '#1CC0F3':'#d0d0d0'" @click="toHome" :title="$t('system.goHome')"/>
				<Icon type="md-open" @click="changePlatform" :title="$t('system.changePlat')" v-if="hasArea"/>
                <BaseNotification :msgs="msgs"></BaseNotification>
                <span class="header-split"></span>
                <!-- <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>
        </AreaLayout>
    </div>
</template>

<script>
import AreaLayout from './AreaLayout.vue'
export default {
    name: 'headers',
    props: ['parentToChild', 'identityselect'],
    components: {
        AreaLayout
    },
    data() {
        return {
            msgs: [],
            isShowMock: false,
            isOpenDrawer: false,
            routerName: '',
            isLoading: false
        }
    },
    created() {
        let user = JSON.parse(decodeURIComponent(localStorage.userInfo, "utf-8"))
        let user_profile = JSON.parse(decodeURIComponent(localStorage.user_profile, "utf-8"))
        console.log(user_profile)
        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 || user.sub,
                name: user.name,
                schoolCode: user_profile.defaultschool || user_profile.schools[0].schoolId
            })
        } else {
            this.$store.commit('setUserInfo', {
                TEAMModelId: user.id || user.sub,
                name: user.name,
                schoolCode: this.$GLOBAL.DEFAULT_SCHOOL_CODE
            })
        }
        this.$store.commit('setPrivateSpace', user_profile.total || 0)
        this.getAllNotice(user_profile, user.id)
		this.curPlatform = localStorage.getItem('platform') || 'school'

    },
    methods: {
		changePlatform(){
			let goPlatform = this.curPlatform === 'area' ? 'school' : 'area'
			this.$router.push({
			    name: goPlatform === 'area' ? 'area' : 'home'
			})
			localStorage.setItem('platform',this.curPlatform === 'area' ? 'school' : 'area')
			this.curPlatform = goPlatform
		},
        async getAllNotice(user_profile, userId) {
            let schoolNotice = await this.getSchoolNotice(user_profile, userId)
            let privateNotice = await this.getPrivateNotice(userId)
            this.msgs = schoolNotice.concat(privateNotice)
            console.log('端外通知', this.msgs)
        },
        getSchoolNotice(user_profile, userId) {
            return new Promise((r, j) => {
                if (this.hasSchool) {
                    this.$api.service.getNotification({
                        "from": "ies5:" + (user_profile.defaultschool || user_profile.schools[0].schoolId),
                        "receiver": userId
                    }).then(res => {
                        r(res.msgs)
                    })
                } else {
                    r([])
                }
            })
        },
        getPrivateNotice(userId) {
            return new Promise((r, j) => {
                this.$api.service.getNotification({
                    "from": "ies5:private",
                    "receiver": userId
                }).then(res => {
                    r(res.msgs)
                })
            })
        },
        toHome() {
            this.$router.push({ path: '/area/areaMgmt' })
        },
        toSettings() {
            this.$router.push({ path: '/home/settings' })
        },
        toFeedback() {
            this.$router.push({ path: '/home/feedback' })
        },
        closeMenu() {
            this.isOpenDrawer = false
        },
        basicMenu(name) {
            if (name == 'quit') {
                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))
        })

    },
    computed: {
        hasSchool() {
            return this.$store.state.userInfo.hasSchool;
        },
		hasArea(){
			return this.$store.state.user.userProfile.areas.length > 0
		}
    },
    watch: {
        $route: {
            handler(val, oldval) {
                this.routerName = val.name
            },
            // 深度观察监听
            deep: true,
            //立即执行
            immediate: true
        }
    }
}
</script>

<style scoped>
.header-split {
    display: block;
    width: 1px;
    background: #797979;
    height: 30px;
}
.header-right-box {
    width: 240px;
    margin: 12px;
    line-height: 1.5;
    float: right;
    height: 45px;
    margin-right: 20px;
}

.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";
@import "~@/css/dark-iview-style.less";
@import "~@/css/custom-iview.less";
@import "~@/css/light-iview-form.less";
</style>