<template>
    <el-container class="mta-Aframe" direction="vertical">
        <!-- header -->
        <mta-header></mta-header>
        <!-- main -->
        <el-container class="mta-home-box">
            <el-aside width="auto">
                <el-scrollbar class="aframe-head-sidebar-scroll" wrap-class="scrollbar-wrapper">
                    <el-menu
                            :default-active="$route.path"
                            class="el-menu-vertical-demo response-el-menu"
                            background-color="#fff"
                            text-color="#333"
                            :active-text-color="getThemeColor(0)"
                            :unique-opened="true"
                            :collapse="isCollapse"
                            :collapse-transition="true"
                            :router="isRouter"
                            ref="menuRef"
                    >
                        <div class="mta-menu-btn-left" v-if="isCollapse" @click="changeStatus(1)">
                            <svg class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
                                 width="32" height="32">
                                <path d="M377.018182 802.909091c-6.981818 0-11.636364-2.327273-16.290909-6.981818-9.309091-9.309091-9.309091-23.272727 0-32.581818L612.072727 512 360.727273 260.654545c-9.309091-9.309091-9.309091-23.272727 0-32.581818s23.272727-9.309091 32.581818 0l267.636364 267.636364c9.309091 9.309091 9.309091 23.272727 0 32.581818L395.636364 795.927273c-4.654545 4.654545-11.636364 6.981818-18.618182 6.981818z"
                                      fill="#2c2c2c"></path>
                            </svg>
                        </div>
                        <div class="mta-menu-btn-right" v-if="!isCollapse" @click="changeStatus(0)">
                            <svg class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
                                 width="32" height="32">
                                <path d="M626.036364 823.854545L314.181818 512 626.036364 200.145455l25.6 23.272727L363.054545 512 651.636364 800.581818z"
                                      fill=""></path>
                            </svg>
                        </div>
                        <mta-sidebar-item :activeColor="getThemeColor(0)" defaultColor="#333"
                                          v-for="(child, index) in menuList" :sidebar="child"
                                          :key="child.path" :stIndex="index"></mta-sidebar-item>
                    </el-menu>
                </el-scrollbar>
            </el-aside>
            <el-main>
                <mta-transform>
                    <router-view/>
                </mta-transform>
            </el-main>
        </el-container>
        <!--footer-->
        <mta-footer></mta-footer>
    </el-container>
</template>
<script>
    import { mapGetters }     from 'vuex';
    import MtaHeader          from '@/components/management/Layout/Header.vue';
    import MtaFooter          from '@/components/management/Layout/Footer.vue';
    import MtaSidebarItem     from '@/components/management/Layout/Sidebar/SidebarItem.vue';
    import MtaTransform       from '@/components/management/Transform';
    import { initThemeColor } from '@/utils/theme';
    import { mapActions }     from 'vuex';
    import * as Initialization from '@/utils/initializationConfig';

    export default {
        name:       'about',
        components: {
            MtaHeader,
            MtaFooter,
            MtaSidebarItem,
            MtaTransform,
        },
        data() {
            return {
                isCollapse:     false,
                isRouter:       true,
                defaultOpeneds: [],
                activeIndex:    '',
                headerArr:      [
                    [
                        {
                            content:  '首页',
                            keyPath:  '/a/main',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd2',
                                },*/
                            ],
                        },
                    ],
                    [
                        {
                            content:  '角色管理',
                            keyPath:  '/a/user/userRoleMangement',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd2',
                                },*/
                            ],
                        },
                        {
                            content:  '部门管理',
                            keyPath:  '/a/user/organizational',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd2',
                                },*/
                            ],
                        },
                        {
                            content:  '用户管理',
                            keyPath:  '/a/user/userInfoManagement',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd2',
                                },*/
                            ],
                        },
                        {
                            content:  '职位管理',
                            keyPath:  '/a/user/positionManagement',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd2',
                                },*/
                            ],
                        },
                        {
                            content:  '租户配置',
                            keyPath:  '/a/user/tenantConfig',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd2',
                                },*/
                            ],
                        },
                        {
                            content:  '角色菜单绑定',
                            keyPath:  '/a/user/userRolesAndMenus',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd2',
                                },*/
                            ],
                        },
                        {
                            content:  '角色用户绑定',
                            keyPath:  '/a/user/userAndRole',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd2',
                                },*/
                            ],
                        },
                        {
                            content:  '在线用户监控',
                            keyPath:  '/a/user/userOnlineManagement',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd2',
                                },*/
                            ],
                        },
                        {
                            content:  '用户管理范围',
                            keyPath:  '/a/user/userPermissionModule',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd2',
                                },*/
                            ],
                        },
                        {
                            content:  '用户注册审核',
                            keyPath:  '/a/user/userRegisterAudit',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd2',
                                },*/
                            ],
                        },
                    ],
                    [
                        {
                            content:  '试题试卷考试分类',
                            keyPath:  '/a/kaoshi/kind',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd',
                                },*/
                            ],
                        },
                        {
                            content:  '试题管理',
                            keyPath:  '/a/kaoshi/shitiManager',
                            children: [
                                {
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd',
                                },
                            ],
                        },
                        {
                            content:  '试题批量导入',
                            keyPath:  '/a/kaoshi/shitiImport',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd',
                                },*/
                            ],
                        },
                        {
                            content:  '试卷管理',
                            keyPath:  '/a/kaoshi/shijuanManager',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd',
                                },*/
                            ],
                        },
                        {
                            content:  '考试管理',
                            keyPath:  '/a/kaoshi/kaoshiManager',
                            children: [
                                {
                                    content: '考试配置',
                                    keyPath: 'a/kaoshi/kaoshiConfig',
                                },

                            ],
                        },
                        {
                            content:  '线上成绩管理',
                            keyPath:  '/a/kaoshi/upManager',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd',
                                },*/
                            ],
                        },
                        {
                            content:  '线下成绩管理',
                            keyPath:  '/a/kaoshi/downManager',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd',
                                },*/
                            ],
                        },
                        {
                            content:  '人工评卷',
                            keyPath:  '/a/kaoshi/grade',
                            children: [
                                {
                                    content: '人工评卷详情',
                                    keyPath: 'a/kaoshi/evaluationEditor',
                                },
                            ],
                        },
                        {
                            content:  '考试报名审核',
                            keyPath:  '/a/kaoshi/audit',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd',
                                },*/
                            ],
                        },
                        {
                            content:  '考试用户监控',
                            keyPath:  '/a/kaoshi/jiankong',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd',
                                },*/
                            ],
                        },
                    ],
                    [
                        {
                            content:  '证书管理',
                            keyPath:  '/a/zhengshu/manager',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd',
                                },*/
                            ],
                        },
                        {
                            content:  '个人证书',
                            keyPath:  '/a/zhengshu/user',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd',
                                },*/
                            ],
                        },
                    ],
                    [
                        {
                            content:  '练习管理',
                            keyPath:  '/a/lianxi/manager',
                            children: [
                                {
                                    content: '试题配置',
                                    keyPath: 'a/lianxi/lianxiConfig',
                                },
                            ],
                        },
                    ],
                    [
                        {
                            content:  '用户统计',
                            keyPath:  '/a/tongji/user',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd',
                                },*/
                            ],
                        },
                        {
                            content:  '考试统计',
                            keyPath:  '/a/tongji/kaoshi',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd',
                                },*/
                            ],
                        },
                        {
                            content:  '错题统计',
                            keyPath:  '/a/tongji/cuoti',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd',
                                },*/
                            ],
                        },
                    ],
                    [
                        {
                            content:  '公告管理',
                            keyPath:  '/a/gonggao/manager',
                            children: [
                                /*{
                                    content: '试题添加编辑',
                                    keyPath: '/a/kaoshi/shitiAdd',
                                },*/
                            ],
                        },
                    ],
                ],
            };
        },
        computed:   {
            menuList() {
                if (this.getAuth === null) {
                    if (this.getTenantCode == null) {
                        this.$router.push({ path: '/a/login' });
                    } else if (this.getTenantCode !== 'admin') {
                        this.$router.push({ path: '/a/' + this.getTenantCode + '/login' });
                    } else {
                        this.$router.push({ path: '/a/admin/login' });
                    }
                    return;
                }

                if (!this.getAuth.menuList) {
                    console.error('未检测到菜单数据');
                    throw new Error('未检测到菜单数据');
                }

                return this.dealMenuList(this.getAuth.menuList, this.getAuth.menuList[0].parentId);
            },
            ...mapGetters(['getAuth', 'getThemeColor', 'getTenantCode']),
        },
        methods:    {
            changeStatus(status) {
                if (status === 0) {
                    this.isCollapse = true;
                } else {
                    this.isCollapse = false;
                }
            },
            dealMenuList(data, pId) {
                const ret = [];
                for (const o of data) {
                    if (o.parentId === pId) {
                        o.children = this.dealMenuList(data, o.menuId);
                        o.children.sort((a, b) => {
                            /*if (a.number === b.number) {
                                return a.menuId - b.menuId;
                            }  */
                            return a.number - b.number;
                        });
                        ret.push(o);
                    }
                }
                return ret;
            },
            ...mapActions(['setThemeColorObj']),
        },
        watch:      {},
        created() {
            initThemeColor();
            // 初始化 页面标签meta ico图标
            Initialization.initializationPageConfig();
        },
    };
</script>
<style lang="scss" scoped>
    .mta-Aframe {
        flex: 1;

        .el-main {
            display: flex;
            flex-direction: column;
            background-color: #F0F0F0;
            height: calc(100vh - 120px);
            >div{
                //总体区域小于1366，右侧内容区域小于1100
                min-width: 1100px;
            }
        }


        .el-aside {
            background: #FFF;
            display: flex;
        }

        .mta-footer {
            height: 50px;
            background: -webkit-gradient(linear, left top, left bottom, from(rgba(11, 0, 56, .95)), to(#333));
            background: linear-gradient(rgba(11, 0, 56, .95), #333);
            line-height: 50px;
            text-align: center;
            color: #CCC;
            font-size: 13px;
        }

        .mta-menu-btn-left {
            width: 64px;
            text-align: center;
            font-size: 22px;
            padding-right: 21px;
        }
    }


</style>
<style lang="scss">
    .el-submenu__icon-arrow {
        margin-top: -10px;
    }

    .mta-menu-span {
        padding-left: 16px;
    }

    .aframe-head-sidebar-scroll {
        height: calc(100vh - 126px);
    }

    .el-menu--vertical {
        .fa:before {
            display: inline-block;
            vertical-align: middle;
        }
    }

    .fa:before {
        width: 17px;
        height: 17px;
        margin-top: 2px;
        content: "";
        display: block;
        background-size: cover;
    }

    .fa-main:before {
        background-image: url("../../assets/images/icons/fa-main-o.svg");
    }


    .fa-bank:before {
        background-image: url("../../assets/images/icons/fa-bank.svg");
    }


    .fa-handshake-o:before {
        background-image: url("../../assets/images/icons/fa-bars.svg");
    }


    .fa-user:before {
        background-image: url("../../assets/images/icons/fa-user.svg");
    }


    .fa-user-circle:before {
        background-image: url("../../assets/images/icons/fa-user-circle.svg");
    }


    .fa-user-o:before {
        background-image: url("../../assets/images/icons/fa-user-o.svg");
    }


    .fa-lightbulb-o:before {
        background-image: url("../../assets/images/icons/fa-lightbulb-o.svg");
    }


    .fa-sitemap:before {
        background-image: url("../../assets/images/icons/Organizational.svg");
    }


    .fa-tanent-o:before {
        background-image: url("../../assets/images/icons/fa-tenant-o.svg");
    }


    .fa-register-audit-o:before {
        background-image: url("../../assets/images/icons/fa-register-audit-o.svg");
    }


    .fa-controller-o:before {
        background-image: url("../../assets/images/icons/fa-controller-o.svg");
    }


    .ks-zs-user:before {
        background-image: url("../../assets/images/icons/ks-zs-user.svg");
    }


    .ks-audit:before {
        background-image: url("../../assets/images/icons/ks-audit.svg");
    }


    .ks-ks-manager:before {
        background-image: url("../../assets/images/icons/ks-ks-manager.svg");
    }


    .ks-bank:before {
        background-image: url("../../assets/images/icons/ks-bank.svg");
    }

    .el-menu-item.is-active .ks-bank:before {
        background-image: url("../../assets/images/icons/ks-bank-a.svg");
    }

    .ks-grade:before {
        background-image: url("../../assets/images/icons/ks-grade.svg");
    }


    .ks-sj-manager:before {
        background-image: url("../../assets/images/icons/ks-sj-manager.svg");
    }


    .ks-st-import:before {
        background-image: url("../../assets/images/icons/ks-st-import.svg");
    }


    .ks-st-manager:before {
        background-image: url("../../assets/images/icons/ks-st-manager.svg");
    }


    .ks-kind:before {
        background-image: url("../../assets/images/icons/ks-kind.svg");
    }


    .ks-up-manager:before {
        background-image: url("../../assets/images/icons/ks-up-manager.svg");
    }


    .ks-down-manager:before {
        background-image: url("../../assets/images/icons/ks-down-manager.svg");
    }


    .ks-zs-manager:before {
        background-image: url("../../assets/images/icons/ks-zs-manager.svg");
    }


    .ks-zs:before {
        background-image: url("../../assets/images/icons/ks-zs.svg");
    }

    .el-menu-item.is-active .ks-zs:before {
        background-image: url("../../assets/images/icons/ks-zs-a.svg");
    }

    .ks-lx:before {
        background-image: url("../../assets/images/icons/ks-lx.svg");
    }

    .el-menu-item.is-active .ks-lx:before {
        background-image: url("../../assets/images/icons/ks-lx-a.svg");
    }

    .ks-lx-manager:before {
        background-image: url("../../assets/images/icons/ks-lx-manager.svg");
    }


    .ks-tj:before {
        background-image: url("../../assets/images/icons/ks-tj.svg");
    }

    .el-menu-item.is-active .ks-tj:before {
        background-image: url("../../assets/images/icons/ks-tj-a.svg");
    }

    .ks-tj-kaoshi:before {
        background-image: url("../../assets/images/icons/ks-tj-kaoshi.svg");
    }


    .ks-tj-cuoti:before {
        background-image: url("../../assets/images/icons/ks-tj-cuoti.svg");
    }
    .fa-px-kc-tj:before {
        background-image: url("../../assets/images/icons/ks-tj-kecheng.svg");
    }

    .ks-tj-user:before {
        background-image: url("../../assets/images/icons/ks-tj-user.svg");
    }


    .fa-userrole-o:before {
        background-image: url("../../assets/images/icons/fa-userrole-o.svg");
    }


    .ks-jiankong:before {
        background-image: url("../../assets/images/icons/ks-jiankong.svg");
    }


    .ks-gg-manager:before {
        background-image: url("../../assets/images/icons/notice-manager.svg");
    }


    .ks-gg:before {
        background-image: url("../../assets/images/icons/notice.svg");
    }

    .el-menu-item.is-active .ks-gg:before {
        background-image: url("../../assets/images/icons/notice-a.svg");
    }


    .ks-qx:before {
        background-image: url("../../assets/images/icons/perCenter.svg");
    }

    .el-menu-item.is-active .ks-qx:before {
        background-image: url("../../assets/images/icons/perCenter-a.svg");
    }

    .fa-tongji:before {
        background-image: url("../../assets/images/icons/fa-tongji.svg");
    }

    .el-menu-item.is-active .fa-tongji:before {
        background-image: url("../../assets/images/icons/fa-tongji-a.svg");
    }

    .fa-qa:before {
        background-image: url("../../assets/images/icons/fa-qa.svg");
    }

    .fa-qa-manager:before {
        background-image: url("../../assets/images/icons/fa-qa-manager.svg");
    }

    .fa-tongji-pingtai:before {
        background-image: url("../../assets/images/icons/fa-tongji-pingtai.svg");
    }


    .fa-tongji-zuhu:before {
        background-image: url("../../assets/images/icons/fa-tongji-zuhu.svg");
    }

    .fa-full-screen:before {
        content: url("../../assets/images/icons/fa-full-screen.svg");
    }

    .ks-tj-active:before {
        background-image: url("../../assets/images/icons/ks-tj-active.svg");
    }

    .fa-qx-manager:before {
        background-image: url("../../assets/images/icons/fa-qx-manager.png");
    }
    .kc-manager:before {
        background-image: url("../../assets/images/icons/kc-manager.svg");
    }
    .fa-px-kj:before {
        background-image: url("../../assets/images/icons/fa-px-kj.svg");
    }
    .fa-px-kc:before {
        background-image: url("../../assets/images/icons/fa-px-kc.svg");
    }
    .fa-px-cj:before {
        background-image: url("../../assets/images/icons/fa-px-cj.svg");
    }
    .fa-px-pj:before {
        background-image: url("../../assets/images/icons/fa-px-pj.svg");
    }
    .fa-px-js:before {
        background-image: url("../../assets/images/icons/fa-px-js.svg");
    }
    .fa-px-yj:before {
        background-image: url("../../assets/images/icons/fa-px-yj.svg");
    }
    .fa-px-ks:before {
        background-image: url("../../assets/images/icons/fa-px-ks.svg");
    }
    .fw-manager:before {
        background-image: url("../../assets/images/icons/fw-manager.svg");
    }
    //资源管理
    .fa-zy-manager:before {
        background-image: url("../../assets/images/icons/fa-zy-manager.svg");
    }
    //资源库管理
    .fa-zy-ku:before {
        background-image: url("../../assets/images/icons/fa-zy-ku.svg");
    }
</style>
