airport-chengdu-web/src/app/pages/pages.component.ts

import { Component, OnInit } from '@angular/core';
import { Router, NavigationEnd, ActivatedRoute } from '@angular/router';
import { BasicDataService } from '../services/basic-data-service';
import { OperateSpinServiceService } from '../services/operate-spin-service.service';
import { HttpClientService } from '../services/http-client.service';
import { NzMessageService } from 'ng-zorro-antd';

import {
    FormBuilder,
    FormControl,
    FormGroup,
    Validators
} from '@angular/forms';

import { filter } from 'rxjs/operators';
// import 'rxjs/add/operator/map';
// import 'rxjs/add/operator/mergeMap';

@Component({
    selector: 'app-pages',
    templateUrl: './pages.component.html',
    styleUrls: ['./pages.component.scss']
})
export class PagesComponent implements OnInit {
    public user_name: string;
    public role_type: string;
    public menuClose: boolean = false;
    public isSpinning: any = false;
    menuData = [];

    modalIsVisible = false;
    isConfirmLoading = false;

    dropdownVisible = false;

    validateForm: FormGroup;

    constructor(
        private router: Router,
        private fb: FormBuilder,
        private basicDataService: BasicDataService,
        private operateSpinService: OperateSpinServiceService,
        private httpClient: HttpClientService,
        private message: NzMessageService
    ) {
        this.operateSpinService.spinSubject.subscribe(
            val => this.isSpinning = val
        )
        this.basicDataService.loadBasicData();
    }

    ngOnInit() {
        this.httpClient.get('/sysapi/common/menu/list', { sysid: 1 }).subscribe(
            res => {
                let menuList = res.body.children[0].children;
                menuList.forEach(menu => {
                    this.menuDataHandle(menu);
                })
                this.menuData = menuList;
            }
        )

        if (sessionStorage.getItem('userInfo')) {
            this.user_name = JSON.parse(sessionStorage.getItem('userInfo')).login_name;
            this.role_type = JSON.parse(sessionStorage.getItem('userInfo')).real_name;
        } else {
            let cookieMsg = ['SESSION', 'token']
            cookieMsg.forEach(element => {
                this.delCookie(element)
            })
            this.router.navigate(['/login']);
        }

        let activeRoute = this.router.url;
        this.selectActiveMenu(this.menuData, activeRoute);

        this.router.events.pipe(
            filter(event => event instanceof NavigationEnd),
        ).subscribe((event) => {
            this.selectActiveMenu(this.menuData, event['urlAfterRedirects'])
        });

        this.validateForm = this.fb.group({
            oldPassword: ['', [Validators.required, Validators.minLength(2), Validators.maxLength(15)]],
            newPassword: ['', [Validators.required, Validators.minLength(2), Validators.maxLength(15)]],
            confirmPassword: ['', [Validators.required, this.confirmationValidator, Validators.minLength(2), Validators.maxLength(15)]],
        });
    }

    confirmationValidator = (control: FormControl): { [s: string]: boolean } => {
        // console.log(control.value);
        if (!control.value) {
            return { required: true };
        } else if (control.value !== this.validateForm.controls.newPassword.value) {
            return { confirm: true, error: true };
        }
        return {};
    };

    updateConfirmValidator(): void {
        /** wait for refresh value */
        Promise.resolve().then(() => this.validateForm.controls.confirmPassword.updateValueAndValidity());
    }

    /**
     * 修改密码
     */
    modifyPassword() {
        this.dropdownVisible = false;
        this.modalIsVisible = true;
    }
    modifyHandleOk(): void {
        this.isConfirmLoading = true;
        let params = {
            "curPassword":this.validateForm.get('oldPassword').value,
            "newPassword":this.validateForm.get('newPassword').value
        }
        this.httpClient.put('/sysapi/setting/user/cur/password', params).subscribe((response) => {
            // console.log(response);
            if(response.is_success){
                this.message.success('修改密码成功！');
                this.validateForm.patchValue({
                    oldPassword: '',
                    newPassword: '',
                    confirmPassword: ''
                })
                for (const i in this.validateForm.controls) {
                    this.validateForm.controls[i].markAsPristine();
                    this.validateForm.controls[i].markAsUntouched();
                    this.validateForm.controls[i].updateValueAndValidity();
                }
            }else{
                this.message.error(response.err_msg + '，修改失败！');
            }
            this.modalIsVisible = false;
            this.isConfirmLoading = false;
        }, err => {
            // console.log(err);
            this.message.error('修改密码失败！');
            this.validateForm.patchValue({
                oldPassword: '',
                newPassword: '',
                confirmPassword: ''
            })
            for (const i in this.validateForm.controls) {
                this.validateForm.controls[i].markAsPristine();
                this.validateForm.controls[i].markAsUntouched();
                this.validateForm.controls[i].updateValueAndValidity();
            }
            this.modalIsVisible = false;
            this.isConfirmLoading = false;
        })

    }
    modifyHandleCancel(): void {
        this.modalIsVisible = false;
        this.validateForm.patchValue({
            oldPassword: '',
            newPassword: '',
            confirmPassword: ''
        })
        for (const i in this.validateForm.controls) {
            this.validateForm.controls[i].markAsPristine();
            this.validateForm.controls[i].markAsUntouched();
            this.validateForm.controls[i].updateValueAndValidity();
        }
    }

    //退出点击
    logoutClick() {
        this.dropdownVisible = true;
    }


    /**
     * 展开收起菜单
     */
    toggleMenu() {
        this.menuClose = !this.menuClose;
    }

    /**
     * 
     * 菜单数据处理
     */
    menuDataHandle(menu) {
        menu['name'] = menu.data.menu.title;
        menu['icon'] = menu.data.menu.icon;
        menu['isExpend'] = false;
        menu['isActive'] = false;
        delete menu.data;
        if (menu.children && menu.children.length > 0) {
            menu.children.forEach(menu => {
                this.menuDataHandle(menu);
            })
        }
    }

    /**
     * 判断是否有子节点
     * @param item 
     */
    isLeaf(item: any) {
        return !item.children || !item.children.length;
    }

    selectActiveMenu(menuData, activeRoute) {
        menuData.forEach(item => {
            if (this.isLeaf(item)) {
                if (item.path === activeRoute) {
                    item.isActive = true;
                } else {
                    item.isActive = false;
                }
            } else {
                this.selectActiveMenu(item.children, activeRoute)
            }
        })
    }

    confirmLogout() {
        this.httpClient.post('/logout').subscribe(
            data => {
                let sessionStorageMsg = ['userInfo']
                sessionStorageMsg.forEach(element => {
                    sessionStorage.removeItem(element)
                })
                this.message.success('退出系统成功！');
                this.router.navigate(['/login']);
            }
        )
    }

    public delCookie($name) {
        let myDate = new Date();
        myDate.setTime(-1000);
        document.cookie = $name + "=''; expires=" + myDate.toUTCString();
    }

}