import {AfterViewChecked, Component, ElementRef, OnChanges, OnInit, ViewChild} from '@angular/core';
import {Router} from '@angular/router';
import {NgbModalRef} from '@ng-bootstrap/ng-bootstrap';

import {ProfileService} from '../profiles/profile.service';
import {Principal, LoginService} from '../../shared';

import {ThemeList, VERSION} from '../../app.constants';
import {LocalStorageService} from 'ngx-webstorage';
import {SeparationComponent} from '../../system/modal/separation/separation.component';
import {BasicEditComponent} from '../../modal/basic-edit/basic-edit.component';
import {CreateGroupComponent} from '../../modal/create-group/create-group.component';
import {ModifyPasswordComponent} from '../../modal/modify-password/modify-password.component';
import {SystemService} from '../../system/system.service';
import {AppService} from '../../app.service';

@Component({
    selector: 'jhi-navbar',
    templateUrl: './navbar.component.html',
    styleUrls: [
        'navbar.css'
    ]
})
export class NavbarComponent implements OnInit, AfterViewChecked {
    @ViewChild('parent') parent: ElementRef;
    @ViewChild('children') children: ElementRef;
    @ViewChild('smartSeparation') smartSeparation: SeparationComponent;
    @ViewChild('basicEdit') basicEdit: BasicEditComponent;
    @ViewChild('smartCreateGroup') smartCreateGroup: CreateGroupComponent;
    @ViewChild('smartModifyPassword') smartModifyPassword: ModifyPasswordComponent;

    inProduction: boolean;
    isNavbarCollapsed: boolean;
    languages: any[];
    swaggerEnabled: boolean;
    modalRef: NgbModalRef;
    version: string;
    token: boolean;
    roleType;

    isBool = false;
    user;

    theme;
    themeLabel = '白色主题';
    themeList = ThemeList;

    constructor(
        private loginService: LoginService,
        private principal: Principal,
        private profileService: ProfileService,
        private router: Router,
        private appSer: AppService,
        private $localStorage: LocalStorageService,
        private systemSer: SystemService,
    ) {
        this.version = VERSION ? 'v' + VERSION : '';
        this.isNavbarCollapsed = true;
    }

    ngOnInit() {
        this.user = this.$localStorage.retrieve('userInfo');
        console.log(this.user);
        this.getCurrentRole();
        this.appSer.theme.subscribe(value => {
            this.theme = value;
        });
    }

    /**
     * 获取当前登录人角色
     * 1.系统管理员 2.安全管理员 3。二者都有
     */
    getCurrentRole() {
        this.systemSer.checkRole().subscribe(
            (res) => {
                this.roleType = res.data;
            }
        );
    }

    ngAfterViewChecked() {
    }

    collapseNavbar() {
        this.isNavbarCollapsed = true;
    }

    isAuthenticated() {
        return this.principal.isAuthenticated();
    }

    logout() {
        this.collapseNavbar();
        this.loginService.logout();
    }

    toggleNavbar() {
        this.isNavbarCollapsed = !this.isNavbarCollapsed;
    }

    getImageUrl() {
        return this.isAuthenticated() ? this.principal.getImageUrl() : null;
    }

    transition() {
        if (!this.isBool) {
            this.children.nativeElement.style.marginLeft = '0px';
            this.isBool = true;
        } else {
            this.children.nativeElement.style.marginLeft = '-300px';
            this.isBool = false;
        }
    }

    //修改密码
    showPasswordModal() {
        this.smartModifyPassword.showModal();
    }

    //三员分立
    showSeparationModal() {
        this.smartSeparation.showModal('三员分立');
    }

    //添加资源  ,name-分组名称，id-分组id
    showBasicEditModal() {
        this.basicEdit.showModal();
    }

    //添加分组
    showGroupModal() {
        this.smartCreateGroup.showModal('添加分组');
    }

    //切换主题
    changeTheme(item) {
        this.themeLabel = item.label;
        this.appSer.setTheme(item.value);
    }
}
