import { Component, OnDestroy, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { NcApplication, NgCortexService, NcMenu, NcPassport, NcRouteRecord } from '@ng-cortex/core';
import { NzContextMenuService, NzDropdownMenuComponent } from 'ng-zorro-antd/dropdown';
import { delay } from 'rxjs/operators';

/** 应用布局组件 */
@Component({
  selector: 'nc-application-layout',
  templateUrl: './nc-application-layout.component.html',
  styleUrls: ['./nc-application-layout.component.scss']
})
export class NcApplicationLayoutComponent implements OnInit, OnDestroy {

  /** 应用索引路由 */
  _routeForApplicationIndex!: string;
  /** 菜单折叠状态 */
  _menuCollapsed: boolean = false;
  /** 用户下拉显示状态 */
  _userDropdownVisible: boolean = false;
  /** 通行证 */
  _passport: NcPassport | null = null;
  /** 应用列表 */
  _applicationList: NcApplication[] = [];
  /** 当前应用 */
  _currentApplication: NcApplication | null = null;
  /** 菜单列表 */
  _menuList: NcMenu[] = [];
  /** 路由记录列表 */
  _routeRecordList: NcRouteRecord[] = [];
  /** 当前路由记录索引 */
  _currentRouteRecordIndex: number = 0;

  /** 取消通行证 */
  private _cancelPassportObserveFn = () => { };
  /** 取消应用列表 */
  private _cancelApplicationListObserveFn = () => { };
  /** 取消当前应用 */
  private _cancelCurrentApplicationObserveFn = () => { };
  /** 取消菜单列表 */
  private _cancelMenuListObserveFn = () => { };
  /** 取消路由记录列表 */
  private _cancelRouteRecordListObserveFn = () => { };
  /** 取消当前路由记录 */
  private _cancelCurrentRouteRecordObserveFn = () => { };

  constructor(
    private _router: Router,
    private _ngCortexService: NgCortexService,
    private _nzContextMenuService: NzContextMenuService) { }

  /** 初始化后 */
  ngOnInit(): void {
    this._routeForApplicationIndex = this._ngCortexService.routeForApplicationIndex;
    const passportSubscription = this._ngCortexService.passport.pipe(delay(24)).subscribe(passport => this._passport = passport);
    const applicationListSubscription = this._ngCortexService.applicationList.pipe(delay(24)).subscribe(applicationList => this._applicationList = applicationList);
    const currentApplicationSubscription = this._ngCortexService.currentApplication.pipe(delay(24)).subscribe(application => this._currentApplication = application);
    const menuListSubscription = this._ngCortexService.menuList.pipe(delay(24)).subscribe(menuList => this._menuList = menuList);
    const routeRecordSubscription = this._ngCortexService.routeRecordList.pipe(delay(24)).subscribe(routeRecordList => this._routeRecordList = routeRecordList);
    const currentRouteRecordSubscription = this._ngCortexService.currentRouteRecord.pipe(delay(24)).subscribe(routeRecord => this._currentRouteRecordIndex = this._routeRecordList.indexOf(routeRecord!));
    this._cancelPassportObserveFn = () => { passportSubscription.unsubscribe() };
    this._cancelApplicationListObserveFn = () => { applicationListSubscription.unsubscribe() };
    this._cancelCurrentApplicationObserveFn = () => { currentApplicationSubscription.unsubscribe() };
    this._cancelMenuListObserveFn = () => { menuListSubscription.unsubscribe() };
    this._cancelRouteRecordListObserveFn = () => { routeRecordSubscription.unsubscribe() };
    this._cancelCurrentRouteRecordObserveFn = () => { currentRouteRecordSubscription.unsubscribe() };
  }

  /** 注销后 */
  ngOnDestroy(): void {
    this._cancelPassportObserveFn();
    this._cancelApplicationListObserveFn();
    this._cancelCurrentApplicationObserveFn();
    this._cancelMenuListObserveFn();
    this._cancelRouteRecordListObserveFn();
    this._cancelCurrentRouteRecordObserveFn();
  }

  /** 登出 */
  _logout(): void {
    this._ngCortexService.logout();
  }

  /**
   * 跳转标签
   * @param route 路由地址
   */
  _navigateTo(route: string): void {
    this._router.navigateByUrl(route);
  }

  /**
   * 关闭路由
   * @param routeOrIndex 路由或者索引
   */
  _closeRoute(routeOrIndex: string | number): void {
    let route: string;
    if (typeof routeOrIndex === 'string') {
      route = routeOrIndex;
    } else {
      route = this._routeRecordList[routeOrIndex].route;
    }
    this._ngCortexService.closeRoute(route);
  }

  /**
   * 关闭其它路由
   * @param route 路由
   */
  _closeOtherRoutes(route: string): void {
    this._ngCortexService.closeOtherRoutes(route);
  }

  /**
   * 关闭右侧路由
   * @param route 路由
   */
  _closeRightRoutes(route: string): void {
    this._ngCortexService.closeRightRoutes(route);
  }

  /**
   * 关闭全部路由
   */
  _closeAllRoutes(): void {
    this._ngCortexService.closeAllRoutes();
  }

  /**
   * 打开标签下拉菜单
   * @param event 鼠标事件
   * @param menu 菜单模板
   */
  _openTabDropdownMenu(event: MouseEvent, menu: NzDropdownMenuComponent): void {
    this._nzContextMenuService.create(event, menu);
  }

}
