页签调整

src/app/SimpleReuseStrategy.ts

@@ -37,7 +37,7 @@ export class SimpleReuseStrategy implements RouteReuseStrategy {
 
   /**
    * 基于路由数据确定路由是否应该分离。
-   * 表示对所有路由允许复用 如果有路由不想利用可以在这加一些业务逻辑判断，这里判断路由是否有 keepAlive 数据判断是否复用。
+   * 表示对所有路由允许复用 如果有路由不想利用可以在这加一些业务逻辑判断，这里判断路由是否有 reuse 数据判断是否复用。
    *
    * @param {ActivatedRouteSnapshot} route - 要检查分离的路由快照。
    * @return {boolean} 如果应该分离路由则返回true，否则返回 false。

src/app/views/new-statistics/components/custom-tabs/custom-tabs.component.ts

@@ -9,7 +9,6 @@ import { Router } from '@angular/router';
   styleUrls: ['./custom-tabs.component.less']
 })
 export class CustomTabsComponent implements OnInit {
-  @Output() selectTabEmit = new EventEmitter();
   constructor(
     public tabService: TabService,
     public router: Router,
@@ -23,15 +22,13 @@ export class CustomTabsComponent implements OnInit {
 
   closeTab(path: string, event: MouseEvent): void {
     event.stopPropagation();
-    let newPath:any = this.tabService.closeTab(path);
-    this.selectTabEmit.emit(newPath.split('/').reverse()[0])
+    this.tabService.closeTab(path);
   }
 
   selectTab(path: string): void {
     const [routePath, params] = this.tabService.getFullPath(path);
     // console.log('params:', params)
     // console.log('routePath:', routePath)
-    this.selectTabEmit.emit(routePath.split('/').reverse()[0])
     this.router.navigate([routePath], {
       replaceUrl: true
     }).catch(err => {
@@ -70,7 +67,6 @@ export class CustomTabsComponent implements OnInit {
     this.rightClickedTab.active = true;
 
     this.tabService.closeOtherTabs(this.rightClickedTab);
-    this.selectTabEmit.emit(this.rightClickedTab.path.split('/').reverse()[0])
 
     this.showContextMenu = false;
   }

src/app/views/new-statistics/distribution-inspection-statistics/distribution-inspection-statistics.component.html

@@ -1,10 +1,10 @@
 <!-- content -->
 <div class="content">
   <virtual-scroller #osComponentRef1 [items]="secondMenuList" class="secondMenu">
-    <div class="secondMenuItem ellipsis-oneline" [ngClass]="{ active: activeSecondMenuLink == data.link }" [title]="data.title" *ngFor="let data of osComponentRef1.viewPortItems" (click)="clickSecondMenu(data)">{{data.title}}</div>
+    <a replaceUrl [routerLink]="'/newStatistics/' + route.parent.snapshot.routeConfig.path + '/' + data.link" class="secondMenuItem ellipsis-oneline" routerLinkActive="active" [title]="data.title" *ngFor="let data of osComponentRef1.viewPortItems">{{data.title}}</a>
   </virtual-scroller>
   <div class="main">
-    <app-custom-tabs (selectTabEmit)="selectTabEmit($event)"></app-custom-tabs>
+    <app-custom-tabs></app-custom-tabs>
     <router-outlet></router-outlet>
   </div>
 </div>

src/app/views/new-statistics/distribution-inspection-statistics/distribution-inspection-statistics.component.less

@@ -41,6 +41,8 @@
         padding: 0 36px;
         border-bottom: 1px solid #E9E9E9;
         cursor: pointer;
+        display: block;
+        color: rgba(0,0,0,0.65);
         &.active{
           background-color: #E9F7E9;
           border-color: #E9F7E9;

src/app/views/new-statistics/distribution-inspection-statistics/distribution-inspection-statistics.component.ts

@@ -25,14 +25,11 @@ export class DistributionInspectionStatisticsComponent implements OnInit {
 
   initSecondMenu(){
     this.secondMenuList = this.menuList.find(v => v.link == this.route.parent.routeConfig.path).childrens || [];
-    console.log(this.tabService.tabs)
-    let activeTab = this.tabService.tabs.find(v => v.active);
-    if(this.secondMenuList.length){
-      if(activeTab.path === `/newStatistics/${this.route.parent.snapshot.routeConfig.path}/${this.secondMenuList[0].link}`){
-        this.clickSecondMenu(this.secondMenuList[0]);
-      }else{
-        this.activeSecondMenuLink = activeTab.path.split('/').reverse()[0];
-      }
+    if(location.hash == '#/newStatistics/distributionInspectionStatistics'){
+      this.router.navigate([`/newStatistics/${this.route.parent.snapshot.routeConfig.path}/${this.secondMenuList[0].link}`], { replaceUrl: true });
+    }else{
+      let tab = this.tabService.tabs.find(v => v.active);
+      this.router.navigate([tab.path], { replaceUrl: true });
     }
   }
 
@@ -41,15 +38,4 @@ export class DistributionInspectionStatisticsComponent implements OnInit {
     this.initSecondMenu();
   }
 
-  // 点击二级菜单
-  activeSecondMenuLink:string;
-  clickSecondMenu(data){
-    this.activeSecondMenuLink = data.link;
-    this.router.navigate([`/newStatistics/${this.route.parent.snapshot.routeConfig.path}/${this.activeSecondMenuLink}`], { replaceUrl: true });
-  }
-
-  // 回显二级菜单
-  selectTabEmit(link){
-    this.activeSecondMenuLink = link;
-  }
 }

src/app/views/new-statistics/maintenance-statistics/maintenance-statistics.component.html

@@ -1,10 +1,10 @@
 <!-- content -->
 <div class="content">
   <virtual-scroller #osComponentRef1 [items]="secondMenuList" class="secondMenu">
-    <div class="secondMenuItem ellipsis-oneline" [ngClass]="{ active: activeSecondMenuLink == data.link }" [title]="data.title" *ngFor="let data of osComponentRef1.viewPortItems" (click)="clickSecondMenu(data)">{{data.title}}</div>
+    <a replaceUrl [routerLink]="'/newStatistics/' + route.parent.snapshot.routeConfig.path + '/' + data.link" class="secondMenuItem ellipsis-oneline" routerLinkActive="active" [title]="data.title" *ngFor="let data of osComponentRef1.viewPortItems">{{data.title}}</a>
   </virtual-scroller>
   <div class="main">
-    <app-custom-tabs (selectTabEmit)="selectTabEmit($event)"></app-custom-tabs>
+    <app-custom-tabs></app-custom-tabs>
     <router-outlet></router-outlet>
   </div>
 </div>

src/app/views/new-statistics/maintenance-statistics/maintenance-statistics.component.less

@@ -41,6 +41,8 @@
         padding: 0 36px;
         border-bottom: 1px solid #E9E9E9;
         cursor: pointer;
+        display: block;
+        color: rgba(0,0,0,0.65);
         &.active{
           background-color: #E9F7E9;
           border-color: #E9F7E9;

src/app/views/new-statistics/maintenance-statistics/maintenance-statistics.component.ts

@@ -25,14 +25,11 @@ export class MaintenanceStatisticsComponent implements OnInit {
 
   initSecondMenu(){
     this.secondMenuList = this.menuList.find(v => v.link == this.route.parent.routeConfig.path).childrens || [];
-    console.log(this.tabService.tabs)
-    let activeTab = this.tabService.tabs.find(v => v.active);
-    if(this.secondMenuList.length){
-      if(activeTab.path === `/newStatistics/${this.route.parent.snapshot.routeConfig.path}/${this.secondMenuList[0].link}`){
-        this.clickSecondMenu(this.secondMenuList[0]);
-      }else{
-        this.activeSecondMenuLink = activeTab.path.split('/').reverse()[0];
-      }
+    if(location.hash == '#/newStatistics/maintenanceStatistics'){
+      this.router.navigate([`/newStatistics/${this.route.parent.snapshot.routeConfig.path}/${this.secondMenuList[0].link}`], { replaceUrl: true });
+    }else{
+      let tab = this.tabService.tabs.find(v => v.active);
+      this.router.navigate([tab.path], { replaceUrl: true });
     }
   }
 
@@ -41,15 +38,4 @@ export class MaintenanceStatisticsComponent implements OnInit {
     this.initSecondMenu();
   }
 
-  // 点击二级菜单
-  activeSecondMenuLink:string;
-  clickSecondMenu(data){
-    this.activeSecondMenuLink = data.link;
-    this.router.navigate([`/newStatistics/${this.route.parent.snapshot.routeConfig.path}/${this.activeSecondMenuLink}`], { replaceUrl: true });
-  }
-
-  // 回显二级菜单
-  selectTabEmit(link){
-    this.activeSecondMenuLink = link;
-  }
 }

src/app/views/new-statistics/new-statistics.component.html

@@ -1,5 +1,5 @@
 <div class="header">
-  <span class="title" *ngFor="let data of menuList" [ngClass]="{ active: activeMenuId == data.id }" (click)="clickMenu(data)">{{data.title}}</span>
+  <a replaceUrl routerLinkActive="active" [routerLink]="'/newStatistics/' + data.link" class="title" *ngFor="let data of menuList">{{data.title}}</a>
   <div class="hospital" (click)="queryRangeClick()">
     <ng-container *ngIf="queryType == 1">查询范围:全院查询</ng-container>
     <ng-container *ngIf="queryType == 2">查询范围:{{hospital.hosName}}</ng-container>

src/app/views/new-statistics/new-statistics.component.less

@@ -13,6 +13,7 @@
     .title{
       margin-right: 16px;
       cursor: pointer;
+      color: rgba(0,0,0,0.65);
       &:last-of-type{
         margin-right: 0;
       }

src/app/views/new-statistics/new-statistics.component.ts

@@ -29,15 +29,6 @@ export class NewStatisticsComponent implements OnInit, OnDestroy {
 
   getMenuList(){
     this.menuList = this.tool.getMenuAutoType();
-    this.menuList.length && this.clickMenu(this.menuList[0]);
-  }
-
-  // 点击一级菜单
-  activeMenuId:number;
-  clickMenu(data){
-    this.activeMenuId = data.id;
-    console.log(`/newStatistics/${data.link}/${data.childrens[0].link}`);
-    this.router.navigate([`/newStatistics/${data.link}/${data.childrens[0].link}`], { replaceUrl: true });
   }
 
   // 全院查询-1|院区查询-2|责任部门查询-3|部门垂直查询-4

src/app/views/new-statistics/services/tab.service.ts

@@ -63,6 +63,9 @@ export class TabService {
     }
 
     const title = this.getTitleFromUrl(url);
+    if(title === ''){
+      return;
+    }
     this.tabs.forEach(t => t.active = false);
 
     const newTab: Tab = {
@@ -122,12 +125,11 @@ export class TabService {
         replaceUrl: true
       });
     }
-    return newActiveTab.path;
   }
 
   private getTitleFromRoute(route: ActivatedRouteSnapshot): string {
     while (route.firstChild) route = route.firstChild;
-    return route.data.title || '未命名标签';
+    return route.data.title || '';
   }
 
   private getTitleFromUrl(url: string): string {