季度计划-勾选复选框“详细信息”、“航班关联信息”

src/app/pages/seasonal-plan/detail-tab/detail-tab.component.html

@@ -0,0 +1,20 @@
+<div class="tab-container">
+    <!-- <div class="hr-line">描述类 -----------------------------------------</div> -->
+    <div class="message-container">
+        <p class="mt-2"><label>航班号：</label>{{flight.flightNumber}}</p>
+        <p><label>航班季度：</label>{{flight.seasonRecId}}</p>
+        <p><label>国际代码：</label>{{flight.internationalCode}}</p>
+        <p><label>航空公司：</label>{{flight.airlineChnName}}</p>
+        <p><label>航线类别：</label>{{flight.routeType}}</p>
+        <p><label>航班类别：</label>{{flight.flightTypeCode}}</p>
+        <p><label>航班任务：</label>{{flight.flightTask}}</p>
+        <p><label>运营日：</label>{{flight.operationDays}}</p>
+        <p><label>开始日期：</label>{{flight.startDate}}</p>
+        <p><label>结束日期：</label>{{flight.endDate}}</p>
+        <p><label>航线：</label>{{flight.startAirport}}</p>
+        <p><label>到达/出发：</label>{{flight.arriOrDept}}</p>
+        <p><label>到达时间：</label>{{flight.arrivalTime}}</p>
+        <p><label>出发时间：</label>{{flight.departureTime}}</p>
+        <p><label>机型：</label>{{flight.aircraftTypeCode}}</p>
+    </div>
+</div>

src/app/pages/seasonal-plan/detail-tab/detail-tab.component.scss

@@ -0,0 +1,19 @@
+.tab-container{
+    padding: 10px;
+    height: 635px;
+    overflow: auto;
+    border: 1px solid #ccc;
+    .hr-line{
+        font-weight: bold;
+    }
+    .message-container{
+        padding: 5px 10px 5px 10px;
+        p{
+            margin: 0;
+            label{
+                width: 80px;
+                text-align: right;
+            }
+        }
+    }
+}

src/app/pages/seasonal-plan/detail-tab/detail-tab.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DetailTabComponent } from './detail-tab.component';
+
+describe('DetailTabComponent', () => {
+  let component: DetailTabComponent;
+  let fixture: ComponentFixture<DetailTabComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ DetailTabComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(DetailTabComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/pages/seasonal-plan/detail-tab/detail-tab.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit, Input } from '@angular/core';
+
+@Component({
+    selector: 'app-detail-tab',
+    templateUrl: './detail-tab.component.html',
+    styleUrls: ['./detail-tab.component.scss']
+})
+export class DetailTabComponent implements OnInit {
+    @Input() flight;
+    constructor() { }
+
+    ngOnInit() {
+    }
+
+}

src/app/pages/seasonal-plan/related-tab/related-tab.component.html

@@ -0,0 +1,19 @@
+<div class="tab-container">
+    <div class="mb-4 fieldset-card">
+        <fieldset>
+            <legend>共享航班代码</legend>
+            <div>
+                <p>共享航班号：{{lines.flightNumber}}</p>
+            </div>
+        </fieldset>
+    </div>
+    <div class="mb-4 fieldset-card">
+        <fieldset>
+            <legend>经停机场</legend>
+            <div>
+                <p *ngFor="let airport of airports"><label>{{airport.airport}}</label>（到达 &nbsp;&nbsp;{{airport.scat?airport.scat:'__ : __'}} &nbsp;&nbsp;| &nbsp;&nbsp;出发 &nbsp;&nbsp;{{airport.scdt?airport.scdt:'__ : __'}}）</p>
+                
+            </div>
+        </fieldset>
+    </div>
+</div>

src/app/pages/seasonal-plan/related-tab/related-tab.component.scss

@@ -0,0 +1,22 @@
+.tab-container {
+    padding: 10px 10px;
+    height: 635px;
+    overflow: auto;
+    border: 1px solid #ccc;
+    .fieldset-card {
+        fieldset {
+            padding: 5px 10px 20px 10px;
+            border: 1px solid #ccc;
+            legend {
+                width: auto;
+                padding: 0 5px;
+                margin: 0;
+                font-size: 14px;
+                font-weight: bold;
+            }
+            p{
+                margin: 0;
+            }
+        }
+    }
+}

src/app/pages/seasonal-plan/related-tab/related-tab.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { RelatedTabComponent } from './related-tab.component';
+
+describe('RelatedTabComponent', () => {
+  let component: RelatedTabComponent;
+  let fixture: ComponentFixture<RelatedTabComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ RelatedTabComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(RelatedTabComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/pages/seasonal-plan/related-tab/related-tab.component.ts

@@ -0,0 +1,41 @@
+import { Component, OnInit, Input } from '@angular/core';
+import timeFormatter from '../../../utils/time-formatter';
+
+@Component({
+    selector: 'app-related-tab',
+    templateUrl: './related-tab.component.html',
+    styleUrls: ['./related-tab.component.scss']
+})
+export class RelatedTabComponent implements OnInit {
+    public lines;
+    public airports;
+    @Input() set flight(flight) {
+        this.lines = Object.assign({}, flight);
+        if (this.lines && !this.lines) {
+            this.airports = this.lines.split(' - ');
+            for (let i = 0; i < this.airports.length; i++) {
+                this.airports[i] = { airport: this.airports[i], scdt: timeFormatter(this.lines[i].departureTime), scat: timeFormatter(this.lines[i].arrivalTime) }
+            }
+        } else if (!this.lines && this.lines) {
+            this.airports = this.lines.split(' - ');
+            for (let i = 0; i < this.airports.length; i++) {
+                this.airports[i] = { airport: this.airports[i], scdt: timeFormatter(this.lines[i].departureTime), scat: timeFormatter(this.lines[i].arrivalTime) }
+            }
+        } else {
+            // this.lines[this.lines.length - 1] = this.lines[0];
+            // let concatArray =  this.lines.arrivalTime.slice(1);
+            // let linkAirport = this.lines.arrivalTime.concat(concatArray)
+            this.airports = this.lines.startAirport.split(' - ');
+            for (let i = 0; i < this.airports.length; i++) {
+                this.airports[i] = { airport: this.airports[i], scdt: timeFormatter(this.lines.departureTime), scat: timeFormatter(this.lines.arrivalTime) }
+            }
+        }
+
+    };
+
+    constructor() { }
+
+    ngOnInit() {
+    }
+
+}

src/app/pages/seasonal-plan/seasonal-plan.component.html

@@ -22,7 +22,7 @@
                       <option value="aircraftTypeCode">机型</option>
                       <option value="flyingDistance">飞行距离(千米)</option>
                       <option value="flyingTime">飞行时间(分钟)</option>
-                      <!-- <option *ngFor="let seasonal of seasonal_lists" [value]="seasonal.COL_CODE">{{seasonal.COL_CN}}</option> -->
+                     <!--  <option *ngFor="let col of col_lists" [value]="col.col_code">{{col.col_chn}}</option> -->
                   </select>
                   <label class="radio-inline custom-radio nowrap mr-4">
                         <input type="radio" [(ngModel)]="FLT_POS" [value]="1" name="filter-position">
@@ -105,18 +105,18 @@
         </div>
         <div class="third-condition row">
           <label class="radio-inline custom-checkbox nowrap mr-4">
-              <input type="checkbox">
+              <input type="checkbox" [(ngModel)]="checkboxGroup.related" (ngModelChange)="checkboxChange()">
               <span>航班关联信息</span>
           </label>
           <label class="radio-inline custom-checkbox nowrap mr-4">
-              <input type="checkbox">
+              <input type="checkbox" [(ngModel)]="checkboxGroup.detail" (ngModelChange)="checkboxChange()">
               <span>详细信息</span>
           </label>
       </div>
       </div>
 
       <div class="airline-table">
-          <div id="table-container" class="table-container">
+          <div id="table-container" class="table-container" [ngClass]="{'table-c': !tabClose,'table-o': tabClose}">
                 <table id="table" class="table table-bordered table-striped">
                   <thead>
                       <tr>
@@ -167,6 +167,16 @@
                   </tbody>
               </table>
           </div>
+          <div class="airline-message" [ngClass]="{'tab-c': tabClose,'tab-o': !tabClose}">
+            <nz-tabset [nzTabPosition]="'top'" [nzType]="'card'" [nzShowPagination]="false">
+                <nz-tab nzTitle="关联信息" (nzClick)="nzClick()" *ngIf="checkboxGroup.related">
+                    <app-related-tab [flight]="row_state"></app-related-tab>
+                </nz-tab>
+                <nz-tab nzTitle="详细信息" (nzClick)="nzClick()" *ngIf="checkboxGroup.detail">
+                    <app-detail-tab [flight]="row_state"></app-detail-tab>
+                </nz-tab>
+            </nz-tabset>
+        </div>
       </div>
   </div>
 </div>

src/app/pages/seasonal-plan/seasonal-plan.component.scss

@@ -1,7 +1,8 @@
 .main-page {
+    position: relative;
     width: 100%;
     height: 100%;
-    overflow-y: scroll;
+    overflow-y: auto;
     padding: 15px 10px;
     background-color: #fff;
     .page-content {
@@ -29,6 +30,7 @@
         }
         .airline-table{
             .table-container{
+                display: inline-block;
                 // border: 1px solid #ccc;
                 width: 100%;
                 height: 700px;
@@ -45,11 +47,70 @@
                     th{
                         background-color: #ddd;
                     }
-                    th,td{
+                    /* th,td{
                         // border: none;
                         text-align: center;
+                    } */
+                }
+                &::-webkit-scrollbar {
+                    width: 15px;
+                    height: 15px;
+                }
+                &::-webkit-scrollbar-thumb {
+                    /*滚动条里面小方块*/
+                    background: rgba(165, 207, 222, 1);
+                    border-radius: 10px;
+                }
+                &::-webkit-scrollbar-track {
+                    background: rgba(0, 0, 0, 0.06);
+                    border-radius: 10px;
+                }
+            }
+            .airline-message {
+                display: inline-block;
+                // box-shadow: 0 0 1px .5px #ddd;
+                vertical-align: top;
+                width: 0;
+                margin-left: 1%;
+                height: 700px;
+                /deep/ .ant-tabs-bar {
+                    border-bottom: 10px solid skyblue;
+                    .ant-tabs-tab {
+                        padding: 0 5px;
+                        &.ant-tabs-tab-active {
+                            background: skyblue;
+                            /* border-color: skyblue; */
+                            color: rgba(0, 0, 0, 0.65);
+                            padding-bottom: 0;
+                        }
                     }
                 }
+                &::-webkit-scrollbar {
+                    width: 15px;
+                    height: 15px;
+                }
+                &::-webkit-scrollbar-thumb {
+                    /*滚动条里面小方块*/
+                    background: rgba(165, 207, 222, 1);
+                    border-radius: 10px;
+                }
+                &::-webkit-scrollbar-track {
+                    background: rgba(0, 0, 0, 0.06);
+                    border-radius: 10px;
+                }
+            }
+            .table-c {
+                width: 75%;
+            }
+            .table-o {
+                width: 100%;
+            }
+            .tab-c {
+                width: 0;
+                display: none;
+            }
+            .tab-o {
+                width: 24%;
             }
         }
     }

src/app/pages/seasonal-plan/seasonal-plan.component.ts

@@ -10,487 +10,520 @@ import { BasicDataService } from '../basic-data-service'
 })
 export class SeasonalPlanComponent implements OnInit {
 
-  constructor(
+    constructor(
-    private httpCilent: HttpClientService,
+        private httpCilent: HttpClientService,
-    private basicDataService: BasicDataService
+        private basicDataService: BasicDataService
-) { }
+    ) { }
 
-// 搜索条件
+    //勾选复选框
-SEARCH = '';    //手动输入条件
+    public checkboxGroup = {
-FLT_POS = 1;    //过滤还是定位
+        'related': false,
-SEL_COL = '';   //选择列名
+        'detail': false
+    }
 
-public filterItems = {
+    // 搜索条件
-    airlineId: '',    //航空公司
+    SEARCH = '';    //手动输入条件
-    routeType: '',  //航线类别
+    FLT_POS = 1;    //过滤还是定位
-    flightTypeCode: '',  //航班类别
+    SEL_COL = '';   //选择列名
-    arriOrDept: '', //到达/出发
-    flightTask: '',    //航班任务
-}
 
-seasonals : Array<any>; 
+    public filterItems = {
-airlines : Array<any>; //航空公司
+        airlineId: '',    //航空公司
-public row_state: any = { renderFlight: {} };
+        routeType: '',  //航线类别
-public render_data: Array<object> = [];  //显示数据，即需要显示的数据
+        flightTypeCode: '',  //航班类别
-public return_data: Array<object> = []; //下拉框显示数据
+        arriOrDept: '', //到达/出发
-ngOnInit() {
+        flightTask: '',    //航班任务
-    /* 获取季度计划信息 */
+    }
-    this.httpCilent.get('/adminapi/schedule/flightSchdSeasons').subscribe(
+    public tabClose: boolean = true;
-        data => {
+
-            this.seasonals = data.body;
+    seasonals : Array<any>; 
-            this.render_data = this.seasonals;
+    airlines : Array<any>; //航空公司
-            if(this.airlines && this.airlines.length > 0){//航空公司列表数据转换
+    public row_state: any = { renderFlight: {} };
-                this.basicDataTransHandle();
+    public render_data: Array<object> = [];  //显示数据，即需要显示的数据
+    public return_data: Array<object> = []; //下拉框显示数据
+    ngOnInit() {
+        /* 获取季度计划信息 */
+        this.httpCilent.get('/adminapi/schedule/flightSchdSeasons').subscribe(
+            data => {
+                this.seasonals = data.body;
+                this.render_data = this.seasonals;
+                if(this.airlines && this.airlines.length > 0){//航空公司列表数据转换
+                    this.basicDataTransHandle();
+                }
+                this.render_data.forEach(element => {//航线类别列表显示数据转换
+                    if (element['routeType'] == 'D') {
+                        element['routeType'] = '国内'
+                        return element['routeType'];
+                    }
+                    if(element['routeType'] == 'I'){
+                        element['routeType'] = '国际'
+                        return element['routeType'];
+                    }
+                    if(element['routeType'] == 'M'){
+                        element['routeType'] = '混合'
+                        return element['routeType'];
+                    }
+                    if(element['routeType'] = 'R'){
+                        element['routeType'] = '地区'
+                        return element['routeType'];
+                    }
+                });
+                this.render_data.forEach(item => {//到达/出发列表显示数据转换
+                    if(item['arriOrDept'] == 'A'){
+                        item['arriOrDept'] = '到达'
+                        return item['arriOrDept']
+                    }
+                    if(item['arriOrDept'] == 'D'){
+                        item['arriOrDept'] = '出发'
+                        return item['arriOrDept']
+                    }
+                });
+                this.render_data.forEach(item => {//航班类别列表显示数据转换
+                    if(item['flightTypeCode'] == 'P'){
+                        item['flightTypeCode'] = '客机'
+                        return item['flightTypeCode']
+                    }
+                    if(item['flightTypeCode'] == 'F'){
+                        item['flightTypeCode'] = '货机'
+                        return item['flightTypeCode']
+                    }
+                    if(item['flightTypeCode'] == 'B'){
+                        item['flightTypeCode'] = '专机'
+                        return item['flightTypeCode']
+                    }
+                    if(item['flightTypeCode'] == 'O'){
+                        item['flightTypeCode'] = '公务机'
+                        return item['flightTypeCode']
+                    }
+                    if(item['flightTypeCode'] == 'M'){
+                        item['flightTypeCode'] = '军机'
+                        return item['flightTypeCode']
+                    }
+                    if(item['flightTypeCode'] == 'X'){
+                        item['flightTypeCode'] = '其他'
+                        return item['flightTypeCode']
+                    }
+                });
+                this.render_data.forEach(item => {//航班任务列表显示数据转换
+                    if(item['flightTask'] == 'S'){
+                        item['flightTask'] = '正班'
+                        return item['flightTask']
+                    }
+                    if(item['flightTask'] == 'N'){
+                        item['flightTask'] = '包机'
+                        return item['flightTask']
+                    }
+                    if(item['flightTask'] == 'E'){
+                        item['flightTask'] = '急救'
+                        return item['flightTask']
+                    }
+                    if(item['flightTask'] == 'B'){
+                        item['flightTask'] = '专机'
+                        return item['flightTask']
+                    }
+                    if(item['flightTask'] == 'G'){
+                        item['flightTask'] = '通用'
+                        return item['flightTask']
+                    }
+                    if(item['flightTask'] == 'J'){
+                        item['flightTask'] = '加班'
+                        return item['flightTask']
+                    }
+                    if(item['flightTask'] == 'M'){
+                        item['flightTask'] = '军用'
+                        return item['flightTask']
+                    }
+                    if(item['flightTask'] == 'Q'){
+                        item['flightTask'] = '补班'
+                        return item['flightTask']
+                    }
+                    if(item['flightTask'] == 'X'){
+                        item['flightTask'] = '其他'
+                        return item['flightTask']
+                    }
+                    if(item['flightTask'] == 'A'){
+                        item['flightTask'] = '计划外'
+                        return item['flightTask']
+                    }
+                });
             }
-            this.render_data.forEach(element => {//航线类别列表显示数据转换
+        )
-                if (element['routeType'] == 'D') {
+        //航空公司
-                    element['routeType'] = '国内'
+        this.airlines = this.basicDataService.airline;
-                    return element['routeType'];
+        this.basicDataService.airline_subject.subscribe(
-                }
+            data=>{
-                if(element['routeType'] == 'I'){
+                this.airlines = data;
-                    element['routeType'] = '国际'
+            }
-                    return element['routeType'];
+        )
-                }
+        /**
-                if(element['routeType'] == 'M'){
+         * 固定表头
-                    element['routeType'] = '混合'
+         */
-                    return element['routeType'];
+        var tableCont = document.querySelector('#table-container');
-                }
+        function scrollHandle (){
-                if(element['routeType'] = 'R'){
+            var scrollTop = this.scrollTop;
-                    element['routeType'] = '地区'
+            this.querySelector('thead').style.transform = 'translateY(' + scrollTop + 'px)';
-                    return element['routeType'];
-                }
-            });
-            this.render_data.forEach(item => {//到达/出发列表显示数据转换
-                if(item['arriOrDept'] == 'A'){
-                    item['arriOrDept'] = '到达'
-                    return item['arriOrDept']
-                }
-                if(item['arriOrDept'] == 'D'){
-                    item['arriOrDept'] = '出发'
-                    return item['arriOrDept']
-                }
-            });
-            this.render_data.forEach(item => {//航班类别列表显示数据转换
-                if(item['flightTypeCode'] == 'P'){
-                    item['flightTypeCode'] = '客机'
-                    return item['flightTypeCode']
-                }
-                if(item['flightTypeCode'] == 'F'){
-                    item['flightTypeCode'] = '货机'
-                    return item['flightTypeCode']
-                }
-                if(item['flightTypeCode'] == 'B'){
-                    item['flightTypeCode'] = '专机'
-                    return item['flightTypeCode']
-                }
-                if(item['flightTypeCode'] == 'O'){
-                    item['flightTypeCode'] = '公务机'
-                    return item['flightTypeCode']
-                }
-                if(item['flightTypeCode'] == 'M'){
-                    item['flightTypeCode'] = '军机'
-                    return item['flightTypeCode']
-                }
-                if(item['flightTypeCode'] == 'X'){
-                    item['flightTypeCode'] = '其他'
-                    return item['flightTypeCode']
-                }
-            });
-            this.render_data.forEach(item => {//航班任务列表显示数据转换
-                if(item['flightTask'] == 'S'){
-                    item['flightTask'] = '正班'
-                    return item['flightTask']
-                }
-                if(item['flightTask'] == 'N'){
-                    item['flightTask'] = '包机'
-                    return item['flightTask']
-                }
-                if(item['flightTask'] == 'E'){
-                    item['flightTask'] = '急救'
-                    return item['flightTask']
-                }
-                if(item['flightTask'] == 'B'){
-                    item['flightTask'] = '专机'
-                    return item['flightTask']
-                }
-                if(item['flightTask'] == 'G'){
-                    item['flightTask'] = '通用'
-                    return item['flightTask']
-                }
-                if(item['flightTask'] == 'J'){
-                    item['flightTask'] = '加班'
-                    return item['flightTask']
-                }
-                if(item['flightTask'] == 'M'){
-                    item['flightTask'] = '军用'
-                    return item['flightTask']
-                }
-                if(item['flightTask'] == 'Q'){
-                    item['flightTask'] = '补班'
-                    return item['flightTask']
-                }
-                if(item['flightTask'] == 'X'){
-                    item['flightTask'] = '其他'
-                    return item['flightTask']
-                }
-                if(item['flightTask'] == 'A'){
-                    item['flightTask'] = '计划外'
-                    return item['flightTask']
-                }
-            });
         }
-    )
+        tableCont.addEventListener('scroll',scrollHandle);
-    //航空公司
+    }
-    this.airlines = this.basicDataService.airline;
+    //航空公司名称数据转换处理
-    this.basicDataService.airline_subject.subscribe(
+    basicDataTransHandle() {
-        data=>{
+        this.render_data.forEach(item => {
-            this.airlines = data;
+            let airlineLinkIndex = this.airlines.findIndex(val => val.airlineId === item['airlineId']);
-        }
+            item['airlineChnName'] = this.airlines[airlineLinkIndex].airlineName;
-    )
+        })
+    }
+
     /**
-     * 固定表头
+     * 复选框勾选事件
      */
-    var tableCont = document.querySelector('#table-container');
+    checkboxChange() {
-    function scrollHandle (){
+        for (const key in this.checkboxGroup) {
-        var scrollTop = this.scrollTop;
+            if (this.checkboxGroup.hasOwnProperty(key)) {
-        this.querySelector('thead').style.transform = 'translateY(' + scrollTop + 'px)';
+                if (this.checkboxGroup[key]) {
-    }
+                    this.tabClose = false;
-    tableCont.addEventListener('scroll',scrollHandle);
-}
-//航空公司名称数据转换处理
-basicDataTransHandle() {
-    this.render_data.forEach(item => {
-        let airlineLinkIndex = this.airlines.findIndex(val => val.airlineId === item['airlineId']);
-        item['airlineChnName'] = this.airlines[airlineLinkIndex].airlineName;
-    })
-}
-
-/**
- * 刷新
- */
-refresh() {
-    this.render_data.reverse();
-}
-
-/**
- * 选中某行
- * @param i 
- */
-selectRow(i) {
-    this.row_state = i;
-}
-
-//输入框回车事件
-inputEnter() {
-    if (this.FLT_POS === 1) {
-        this.inputFilter(this.seasonals)
-    } else {
-        this.inputFilter(this.seasonals)
-        this.inputPosition(this.seasonals)
-    }
-}
-
-//下拉框选择筛选
-selectChange() {
-    this.return_data = this.seasonals.filter(item=>{
-        let is_satis = true;
-        if(item['routeType'] == '国内'){
-            item['routeType'] = 'D'
-        }
-        if(item['routeType'] == '国际'){
-            item['routeType'] = 'I'
-        }
-        if(item['routeType'] == '混合'){
-            item['routeType'] = 'M'
-        }
-        if(item['routeType'] == '地区'){
-            item['routeType'] = 'R'
-        }
-        //到达/出发
-        if(item['arriOrDept'] == '到达'){
-            item['arriOrDept'] = 'A'
-        }
-        if(item['arriOrDept'] == '出发'){
-            item['arriOrDept'] = 'D'
-        }
-        //航班类别
-        if(item['flightTypeCode'] == '客机'){
-            item['flightTypeCode'] = 'P'
-        }
-        if(item['flightTypeCode'] == '货机'){
-            item['flightTypeCode'] = 'F'
-        }
-        if(item['flightTypeCode'] == '专机'){
-            item['flightTypeCode'] = 'B'
-        }
-        if(item['flightTypeCode'] == '公务机'){
-            item['flightTypeCode'] = 'O'
-        }
-        if(item['flightTypeCode'] == '军机'){
-            item['flightTypeCode'] = 'M'
-        }
-        if(item['flightTypeCode'] == '其他'){
-            item['flightTypeCode'] = 'X'
-        }
-        //航班任务
-        if(item['flightTask'] == '正班'){
-            item['flightTask'] = 'S'
-        }
-        if(item['flightTask'] == '包机'){
-            item['flightTask'] = 'N'
-        }
-        if(item['flightTask'] == '急救'){
-            item['flightTask'] = 'E'
-        }
-        if(item['flightTask'] == '专机'){
-            item['flightTask'] = 'B'
-        }
-        if(item['flightTask'] == '通用'){
-            item['flightTask'] = 'G'
-        }
-        if(item['flightTask'] == '加班'){
-            item['flightTask'] = 'J'
-        }
-        if(item['flightTask'] == '军用'){
-            item['flightTask'] = 'M'
-        }
-        if(item['flightTask'] == '补班'){
-            item['flightTask'] = 'Q'
-        }
-        if(item['flightTask'] == '其他'){
-            item['flightTask'] = 'X'
-        }
-        if(item['flightTask'] == '计划外'){
-            item['flightTask'] = 'A'
-        }
-        for (const key in this.filterItems) {
-            if (this.filterItems.hasOwnProperty(key) && this.filterItems[key]) {
-                if (item[key] === +this.filterItems[key] || item[key] === this.filterItems[key]) {
-                    is_satis = true;
-                    continue;
-                }else {
-                    is_satis = false;
                     break;
+                } else {
+                    this.tabClose = true;
+                    continue;
                 }
             }
         }
-        return is_satis;
+    }
-    })
-    this.return_data.forEach(element => {//航线类别列表显示数据转换
-        if (element['routeType'] == 'D') {
-            element['routeType'] = '国内'
-            return element['routeType'];
-        }
-        if(element['routeType'] == 'I'){
-            element['routeType'] = '国际'
-            return element['routeType'];
-        }
-        if(element['routeType'] == 'M'){
-            element['routeType'] = '混合'
-            return element['routeType'];
-        }
-        if(element['routeType'] == 'R'){
-            element['routeType'] = '地区'
-            return element['routeType'];
-        }
-    });
-    this.return_data.forEach(item => {//到达/出发列表显示数据转换
-        if(item['arriOrDept'] == 'A'){
-            item['arriOrDept'] = '到达'
-            return item['arriOrDept']
-        }
-        if(item['arriOrDept'] == 'D'){
-            item['arriOrDept'] = '出发'
-            return item['arriOrDept']
-        }
-    });
-    this.return_data.forEach(item => {//航班类别列表显示数据转换
-        if(item['flightTypeCode'] == 'P'){
-            item['flightTypeCode'] = '客机'
-            return item['flightTypeCode']
-        }
-        if(item['flightTypeCode'] == 'F'){
-            item['flightTypeCode'] = '货机'
-            return item['flightTypeCode']
-        }
-        if(item['flightTypeCode'] == 'B'){
-            item['flightTypeCode'] = '专机'
-            return item['flightTypeCode']
-        }
-        if(item['flightTypeCode'] == 'O'){
-            item['flightTypeCode'] = '公务机'
-            return item['flightTypeCode']
-        }
-        if(item['flightTypeCode'] == 'M'){
-            item['flightTypeCode'] = '军机'
-            return item['flightTypeCode']
-        }
-        if(item['flightTypeCode'] == 'X'){
-            item['flightTypeCode'] = '其他'
-            return item['flightTypeCode']
-        }
-    });
-    this.return_data.forEach(item => {//航班任务列表显示数据转换
-        if(item['flightTask'] == 'S'){
-            item['flightTask'] = '正班'
-            return item['flightTask']
-        }
-        if(item['flightTask'] == 'N'){
-            item['flightTask'] = '包机'
-            return item['flightTask']
-        }
-        if(item['flightTask'] == 'E'){
-            item['flightTask'] = '急救'
-            return item['flightTask']
-        }
-        if(item['flightTask'] == 'B'){
-            item['flightTask'] = '专机'
-            return item['flightTask']
-        }
-        if(item['flightTask'] == 'G'){
-            item['flightTask'] = '通用'
-            return item['flightTask']
-        }
-        if(item['flightTask'] == 'J'){
-            item['flightTask'] = '加班'
-            return item['flightTask']
-        }
-        if(item['flightTask'] == 'M'){
-            item['flightTask'] = '军用'
-            return item['flightTask']
-        }
-        if(item['flightTask'] == 'Q'){
-            item['flightTask'] = '补班'
-            return item['flightTask']
-        }
-        if(item['flightTask'] == 'X'){
-            item['flightTask'] = '其他'
-            return item['flightTask']
-        }
-        if(item['flightTask'] == 'A'){
-            item['flightTask'] = '计划外'
-            return item['flightTask']
-        }
-    });
-    this.render_data = this.return_data;
-}
 
-//输入框筛选
+    /**
-inputFilter(filterData) {
+     * tab项切换事件
-    if (this.SEARCH) {
+     */
+    nzClick() {
+        
+    }
+
+    /**
+     * 刷新
+     */
+    refresh() {
+        this.render_data.reverse();
+    }
+
+    /**
+     * 选中某行
+     * @param i 
+     */
+    selectRow(i) {
+        this.row_state = i;
+    }
+
+    //输入框回车事件
+    inputEnter() {
+        if (this.FLT_POS === 1) {
+            this.inputFilter(this.seasonals)
+        } else {
+            this.inputFilter(this.seasonals)
+            this.inputPosition(this.seasonals)
+        }
+    }
+
+    //下拉框选择筛选
+    selectChange() {
+        this.return_data = this.seasonals.filter(item=>{
+            let is_satis = true;
+            if(item['routeType'] == '国内'){
+                item['routeType'] = 'D'
+            }
+            if(item['routeType'] == '国际'){
+                item['routeType'] = 'I'
+            }
+            if(item['routeType'] == '混合'){
+                item['routeType'] = 'M'
+            }
+            if(item['routeType'] == '地区'){
+                item['routeType'] = 'R'
+            }
+            //到达/出发
+            if(item['arriOrDept'] == '到达'){
+                item['arriOrDept'] = 'A'
+            }
+            if(item['arriOrDept'] == '出发'){
+                item['arriOrDept'] = 'D'
+            }
+            //航班类别
+            if(item['flightTypeCode'] == '客机'){
+                item['flightTypeCode'] = 'P'
+            }
+            if(item['flightTypeCode'] == '货机'){
+                item['flightTypeCode'] = 'F'
+            }
+            if(item['flightTypeCode'] == '专机'){
+                item['flightTypeCode'] = 'B'
+            }
+            if(item['flightTypeCode'] == '公务机'){
+                item['flightTypeCode'] = 'O'
+            }
+            if(item['flightTypeCode'] == '军机'){
+                item['flightTypeCode'] = 'M'
+            }
+            if(item['flightTypeCode'] == '其他'){
+                item['flightTypeCode'] = 'X'
+            }
+            //航班任务
+            if(item['flightTask'] == '正班'){
+                item['flightTask'] = 'S'
+            }
+            if(item['flightTask'] == '包机'){
+                item['flightTask'] = 'N'
+            }
+            if(item['flightTask'] == '急救'){
+                item['flightTask'] = 'E'
+            }
+            if(item['flightTask'] == '专机'){
+                item['flightTask'] = 'B'
+            }
+            if(item['flightTask'] == '通用'){
+                item['flightTask'] = 'G'
+            }
+            if(item['flightTask'] == '加班'){
+                item['flightTask'] = 'J'
+            }
+            if(item['flightTask'] == '军用'){
+                item['flightTask'] = 'M'
+            }
+            if(item['flightTask'] == '补班'){
+                item['flightTask'] = 'Q'
+            }
+            if(item['flightTask'] == '其他'){
+                item['flightTask'] = 'X'
+            }
+            if(item['flightTask'] == '计划外'){
+                item['flightTask'] = 'A'
+            }
+            for (const key in this.filterItems) {
+                if (this.filterItems.hasOwnProperty(key) && this.filterItems[key]) {
+                    if (item[key] === +this.filterItems[key] || item[key] === this.filterItems[key]) {
+                        is_satis = true;
+                        continue;
+                    }else {
+                        is_satis = false;
+                        break;
+                    }
+                }
+            }
+            return is_satis;
+        })
+        this.return_data.forEach(element => {//航线类别列表显示数据转换
+            if (element['routeType'] == 'D') {
+                element['routeType'] = '国内'
+                return element['routeType'];
+            }
+            if(element['routeType'] == 'I'){
+                element['routeType'] = '国际'
+                return element['routeType'];
+            }
+            if(element['routeType'] == 'M'){
+                element['routeType'] = '混合'
+                return element['routeType'];
+            }
+            if(element['routeType'] == 'R'){
+                element['routeType'] = '地区'
+                return element['routeType'];
+            }
+        });
+        this.return_data.forEach(item => {//到达/出发列表显示数据转换
+            if(item['arriOrDept'] == 'A'){
+                item['arriOrDept'] = '到达'
+                return item['arriOrDept']
+            }
+            if(item['arriOrDept'] == 'D'){
+                item['arriOrDept'] = '出发'
+                return item['arriOrDept']
+            }
+        });
+        this.return_data.forEach(item => {//航班类别列表显示数据转换
+            if(item['flightTypeCode'] == 'P'){
+                item['flightTypeCode'] = '客机'
+                return item['flightTypeCode']
+            }
+            if(item['flightTypeCode'] == 'F'){
+                item['flightTypeCode'] = '货机'
+                return item['flightTypeCode']
+            }
+            if(item['flightTypeCode'] == 'B'){
+                item['flightTypeCode'] = '专机'
+                return item['flightTypeCode']
+            }
+            if(item['flightTypeCode'] == 'O'){
+                item['flightTypeCode'] = '公务机'
+                return item['flightTypeCode']
+            }
+            if(item['flightTypeCode'] == 'M'){
+                item['flightTypeCode'] = '军机'
+                return item['flightTypeCode']
+            }
+            if(item['flightTypeCode'] == 'X'){
+                item['flightTypeCode'] = '其他'
+                return item['flightTypeCode']
+            }
+        });
+        this.return_data.forEach(item => {//航班任务列表显示数据转换
+            if(item['flightTask'] == 'S'){
+                item['flightTask'] = '正班'
+                return item['flightTask']
+            }
+            if(item['flightTask'] == 'N'){
+                item['flightTask'] = '包机'
+                return item['flightTask']
+            }
+            if(item['flightTask'] == 'E'){
+                item['flightTask'] = '急救'
+                return item['flightTask']
+            }
+            if(item['flightTask'] == 'B'){
+                item['flightTask'] = '专机'
+                return item['flightTask']
+            }
+            if(item['flightTask'] == 'G'){
+                item['flightTask'] = '通用'
+                return item['flightTask']
+            }
+            if(item['flightTask'] == 'J'){
+                item['flightTask'] = '加班'
+                return item['flightTask']
+            }
+            if(item['flightTask'] == 'M'){
+                item['flightTask'] = '军用'
+                return item['flightTask']
+            }
+            if(item['flightTask'] == 'Q'){
+                item['flightTask'] = '补班'
+                return item['flightTask']
+            }
+            if(item['flightTask'] == 'X'){
+                item['flightTask'] = '其他'
+                return item['flightTask']
+            }
+            if(item['flightTask'] == 'A'){
+                item['flightTask'] = '计划外'
+                return item['flightTask']
+            }
+        });
+        this.render_data = this.return_data;
+    }
+
+    //输入框筛选
+    inputFilter(filterData) {
+        if (this.SEARCH) {
+            if (this.SEL_COL) {
+                let sel_col = this.SEL_COL;
+                filterData = filterData.filter(item => {
+                    if (item[sel_col]) {
+                        if (item[sel_col].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                            return true;
+                        }
+                    } else {
+                        if (this.SEARCH) {
+                            return false;
+                        } else {
+                            return true;
+                        }
+                    }
+                })
+
+            } else {
+                filterData = filterData.filter(item => {
+                    let is_satis = false;
+                    for (const key in item) {
+                        if (item.hasOwnProperty(key)) {
+                            if (item[key]) {
+                                if (item[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                                    is_satis = true;
+                                    break;
+                                } else {
+                                    is_satis = false;
+                                    continue;
+                                }
+                            } else {
+                                if (this.SEARCH) {
+                                    is_satis = false;
+                                    continue;
+                                } else {
+                                    is_satis = true;
+                                    break;
+                                }
+                            }
+                        } else {
+                            continue;
+                        }
+                    }
+                    return is_satis;
+                })
+            }
+        }
+        this.render_data = filterData;
+        this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+    }
+
+    positionArray: Array<any> = [];
+    positionArrayIndex: number = 0;
+    //输入框定位
+    inputPosition(filterData) {
+        let transArray = []
         if (this.SEL_COL) {
             let sel_col = this.SEL_COL;
-            filterData = filterData.filter(item => {
+            filterData.forEach(element => {
-                if (item[sel_col]) {
+                if (element[sel_col]) {
-                    if (item[sel_col].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                    if (element[sel_col].toString().match(new RegExp(this.SEARCH, 'i'))) {
-                        return true;
+                        transArray.push(element)
                     }
                 } else {
-                    if (this.SEARCH) {
+                    if (!this.SEARCH) {
-                        return false;
+                        transArray.push(element)
-                    } else {
-                        return true;
                     }
                 }
-            })
+            });
-
         } else {
-            filterData = filterData.filter(item => {
+            filterData.forEach(element => {
-                let is_satis = false;
+                for (const key in element) {
-                for (const key in item) {
+                    if (element.hasOwnProperty(key)) {
-                    if (item.hasOwnProperty(key)) {
+                        if (element[key]) {
-                        if (item[key]) {
+                            if (element[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
-                            if (item[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                                transArray.push(element)
-                                is_satis = true;
                                 break;
                             } else {
-                                is_satis = false;
                                 continue;
                             }
                         } else {
                             if (this.SEARCH) {
-                                is_satis = false;
                                 continue;
                             } else {
-                                is_satis = true;
+                                transArray.push(element)
                                 break;
                             }
                         }
+
                     } else {
                         continue;
                     }
                 }
-                return is_satis;
+            });
-            })
         }
-    }
-    this.render_data = filterData;
-    this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
-}
 
-positionArray: Array<any> = [];
+        if (transArray.length > 0) {
-positionArrayIndex: number = 0;
+            if (transArray.toString() == this.positionArray.toString()) {
-//输入框定位
+                this.positionArrayIndex++;
-inputPosition(filterData) {
+                if (this.positionArrayIndex === this.positionArray.length) {
-    let transArray = []
+                    this.positionArrayIndex = 0;
-    if (this.SEL_COL) {
-        let sel_col = this.SEL_COL;
-        filterData.forEach(element => {
-            if (element[sel_col]) {
-                if (element[sel_col].toString().match(new RegExp(this.SEARCH, 'i'))) {
-                    transArray.push(element)
                 }
+                this.row_state = this.positionArray[this.positionArrayIndex];
             } else {
-                if (!this.SEARCH) {
+                this.positionArray = transArray;
-                    transArray.push(element)
-                }
-            }
-        });
-    } else {
-        filterData.forEach(element => {
-            for (const key in element) {
-                if (element.hasOwnProperty(key)) {
-                    if (element[key]) {
-                        if (element[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
-                            transArray.push(element)
-                            break;
-                        } else {
-                            continue;
-                        }
-                    } else {
-                        if (this.SEARCH) {
-                            continue;
-                        } else {
-                            transArray.push(element)
-                            break;
-                        }
-                    }
-
-                } else {
-                    continue;
-                }
-            }
-        });
-    }
-
-    if (transArray.length > 0) {
-        if (transArray.toString() == this.positionArray.toString()) {
-            this.positionArrayIndex++;
-            if (this.positionArrayIndex === this.positionArray.length) {
                 this.positionArrayIndex = 0;
+                this.row_state = this.positionArray[this.positionArrayIndex];
             }
-            this.row_state = this.positionArray[this.positionArrayIndex];
         } else {
-            this.positionArray = transArray;
+            alert('没有搜索到相关数据');
-            this.positionArrayIndex = 0;
+        }
-            this.row_state = this.positionArray[this.positionArrayIndex];
+            let tr = $(".selected");
+            let objTr = tr[0];
+            if (objTr) {
+                $("#table-container").animate({ scrollTop: objTr.offsetTop - 42 }, "slow");
+            }
         }
-    } else {
-        alert('没有搜索到相关数据');
-    }
-        let tr = $(".selected");
-        let objTr = tr[0];
-        $("#table-container").animate({ scrollTop: objTr.offsetTop - 42 }, "slow");
-    }
 
-}
+    }

src/app/pages/seasonal-plan/seasonal-plan.module.ts

@@ -3,12 +3,20 @@ import { CommonModule } from '@angular/common';
 import { SeasonalPlanComponent } from './seasonal-plan.component';
 import { SeasonalPlanRouting } from './seasonal-plan-routing.module'
 import { FormsModule } from '@angular/forms';
+import { NgZorroAntdModule } from 'ng-zorro-antd'
+import { RelatedTabComponent } from './related-tab/related-tab.component';
+import { DetailTabComponent } from './detail-tab/detail-tab.component';
 @NgModule({
     imports: [
         CommonModule,
         SeasonalPlanRouting,
+        NgZorroAntdModule,
         FormsModule
     ],
-    declarations: [SeasonalPlanComponent]
+    declarations: [
+        RelatedTabComponent,
+        DetailTabComponent,
+        SeasonalPlanComponent
+    ]
 })
 export class SeasonalPlanModule { }