Merge branch 'develop-3'

src/app/pages/basic-data-service.ts

@@ -32,6 +32,14 @@ export class BasicDataService {
     public terminal_area_subject = new Subject<any>();
     public airline: Array<any>;
     public airline_subject = new Subject<any>();
+    public country: Array<any>;
+    public country_subject = new Subject<any>();
+    public aircraft_type_group: Array<any>;
+    public aircraft_type_group_subject = new Subject<any>();
+    public airportgroup: Array<any>;
+    public airportgroup_subject = new Subject<any>();
+    public airlinegroup: Array<any>;
+    public airlinegroup_subject = new Subject<any>();
 
     constructor(
         private httpClient: HttpClientService
@@ -52,6 +60,10 @@ export class BasicDataService {
         let aircraftHttp = this.httpClient.get('/adminapi/basicdata/sysAircrafts');
         let terminalAreaHttp = this.httpClient.get('/adminapi/basicdata/ormsTerminalareas');
         let airlineHttp = this.httpClient.get('/adminapi/basicdata/sysAirlines');
+        let countryHttp = this.httpClient.get('/adminapi/basicdata/sysCountry');
+        let aircrafttypesGroupHttp = this.httpClient.get('/adminapi/basicdata/sysAircrafttypesGroup');
+        let airportGroupsHttp = this.httpClient.get('/adminapi/basicdata/sysAirportGroups');
+        let airlineGroupHttp = this.httpClient.get('/adminapi/basicdata/sysAirlineGroup');
         zip(
             flightStatusHttp,
             checkinGroupHttp,
@@ -66,7 +78,11 @@ export class BasicDataService {
             aircraftTypeHttp,
             aircraftHttp,
             terminalAreaHttp,
-            airlineHttp
+            airlineHttp,
+            countryHttp,
+            aircrafttypesGroupHttp,
+            airportGroupsHttp,
+            airlineGroupHttp
         ).subscribe(
             ([
                 flightStatusRes,
@@ -82,7 +98,11 @@ export class BasicDataService {
                 aircraftTypeRes,
                 aircraftRes,
                 terminalAreaRes,
-                airlineRes
+                airlineRes,
+                countryRes,
+                aircraftTypeGroupRes,
+                airportGroupRes,
+                airlineGroupRes
             ]) => {
                 this.flightStatus = flightStatusRes.body;
                 this.flightStatus_subject.next(flightStatusRes.body);
@@ -112,6 +132,14 @@ export class BasicDataService {
                 this.city_subject.next(cityRes.body);
                 this.airport = airportRes.body;
                 this.airport_subject.next(airportRes.body);
+                this.country = countryRes.body;
+                this.country_subject.next(countryRes.body);
+                this.aircraft_type_group = aircraftTypeGroupRes.body;
+                this.aircraft_type_group_subject.next(aircraftTypeGroupRes.body);
+                this.airportgroup = airportGroupRes.body;
+                this.airportgroup_subject.next(airportGroupRes.body);
+                this.airlinegroup = airlineGroupRes.body;
+                this.airlinegroup_subject.next(airlineGroupRes.body);
             }
         )
     }

src/app/pages/basic-data/aircraft-type/aircraft-type.component.html

@@ -5,19 +5,7 @@
                 <div class="line-operator-left input-container mb-3 col-xlg-8 col-mlg-8 col-xl-8 col-lg-10">
                     <select class="mr-4 form-control"  [(ngModel)]="SEL_COL" name="" id="">
                         <option value="">选择列名</option>
-                        <option value="aircraftTypeCode">机型代码</option>
+                        <option *ngFor="let col of col_lists" [value]="col.col_code">{{col.col_chn}}</option>
-                        <option value="aircraftTypeName">机型名称</option>
-                        <option value="aircraftLength">飞机长度</option>
-                        <option value="aircraftWidth">翼展</option>
-                        <option value="aircraftHeight">机身高度</option>
-                        <option value="maxPassengers">最大乘客数</option>
-                        <option value="maxFreightWeight">最大货物重量</option>
-                        <option value="maxTakeoffWeight">最大起飞重量</option>
-                        <option value="maxAirbridges">最大廊桥数</option>
-                        <option value="aircrafttypegroupId">机型组</option>
-                        <option value="aircraftTypeCodeCaa">CAA码</option>
-                        <option value="aircraftTypeCodeIata">CAA码</option>
-                        <option value="aircraftTypeCodeIcao">ICAO码</option>
                     </select>
                     <label class="radio-inline custom-radio nowrap mr-4">
                         <input type="radio" [(ngModel)]="FLT_POS" [value]="1" name="filter-position">
@@ -29,23 +17,14 @@
                     </label>
                     <input class="form-control" [(ngModel)]="SEARCH" type="text" (keyup.enter) = "inputEnter()" id="inputerInfo">
                 </div>
-                <div class="line-operator-right mb-3 col-xlg-4 col-mlg-4 col-xl-4 col-lg-1">
-                    <!-- <button type="button" class="btn btn-info mr-3">打印</button>
-                    <button type="button" class="btn btn-info mr-3">飞机登记</button>
-                    <button type="button" class="btn btn-info mr-3">定制查询</button> -->
-                    <!-- <button type="button" class="btn btn-info mr-3">刷新</button> -->
-                </div>
             </div>
   
             <div class="second-condition mb-3 row">
               <div class="input-container mr-4">
-                  <label for="aircrafttypegroupId">机型组：&nbsp;&nbsp;</label>
+                  <label for="aircraftTypeGroupId">机型组：&nbsp;&nbsp;</label>
-                  <select  class="form-control" [(ngModel)]="filterItems.aircrafttypegroupId" (ngModelChange)="selectChange()" id="jgroup">
+                  <select  class="form-control" [(ngModel)]="filterItems.aircraftTypeGroupId" (ngModelChange)="selectChange()" id="jgroup">
                       <option value=""></option>
-                      <option *ngFor="let item of aircraftTypes" [value]="item.aircrafttypegroupId">{{item.aircrafttypegroupId}}</option>
+                      <option *ngFor="let item of aircraftTypesGroups" [value]="item.aircraftTypeGroupId">{{item.aircraftTypeGroupName}}</option>
-                      <!-- <option value="E">E-类飞机机型</option>
-                      <option value="T">T-类飞机机型</option>
-                      <option value="G">G-类飞机机型</option> -->
                   </select>
               </div>
             </div>
@@ -70,7 +49,6 @@
                             <th>CAA码</th>
                             <th>IATA码</th>
                             <th>ICAO码</th>
-                            <!-- <th *ngFor="let airline_col of aircrafttype_lists">{{airline_col.COL_CN}}</th> -->
                         </tr>
                     </thead>
                     <tbody>
@@ -86,11 +64,10 @@
                             <td>{{aircraftType.maxFreightWeight}}</td>
                             <td>{{aircraftType.maxTakeoffWeight}}</td>
                             <td>{{aircraftType.maxAirbridges}}</td>
-                            <td>{{aircraftType.aircrafttypegroupId}}</td>
+                            <td>{{aircraftType.aircraftTypeGroupName}}</td>
                             <td>{{aircraftType.aircraftTypeCodeCaa}}</td>
                             <td>{{aircraftType.aircraftTypeCodeIata}}</td>
                             <td>{{aircraftType.aircraftTypeCodeIcao}}</td>
-                            <!-- <td *ngFor="let airline_col of aircrafttype_lists" [ngStyle]="{'background-color':getColor(airline_col.COL_CODE)}">{{airline_row['renderFlight'][airline_col.COL_CODE]}}</td> -->
                         </tr>
                     </tbody>
                 </table>

src/app/pages/basic-data/aircraft-type/aircraft-type.component.scss

@@ -44,6 +44,7 @@
                     }
                     th{
                         background-color: #ddd;
+                        color: rgb(0, 0, 255);
                     }
                     th,td{
                         // border: none;

src/app/pages/basic-data/aircraft-type/aircraft-type.component.ts

@@ -1,78 +1,118 @@
 import { Component, OnInit } from '@angular/core';
-import { HttpClientService } from '../../../services/http-client.service';
+import { BasicDataService } from '../../basic-data-service';
-import { BasicDataService } from '../../basic-data-service'
+import { ChangeDetectorRef } from '@angular/core';
-import { HttpParams } from '@angular/common/http';
 import * as $ from 'jquery';
 @Component({
     selector: 'app-aircraft-type',
     templateUrl: './aircraft-type.component.html',
     styleUrls: ['./aircraft-type.component.scss']
-  })
+})
 export class AircraftTypeComponent implements OnInit {
 
     constructor(
-    private httpCilent: HttpClientService,
+        private basicDataService: BasicDataService,
-    private basicDataService: BasicDataService
+        private changeDetectorRef: ChangeDetectorRef
-) { }
+    ) { }
 
-// 搜索条件
+    public col_lists = [
-SEARCH = '';    //手动输入条件
+        { col_code: 'aircraftTypeCode', col_chn: '机型代码' },
-FLT_POS = 1;    //过滤还是定位
+        { col_code: 'aircraftTypeName', col_chn: '机型名称' },
-SEL_COL = '';   //选择列名
+        { col_code: 'aircraftLength', col_chn: '飞机长度' },
+        { col_code: 'aircraftWidth', col_chn: '翼展' },
+        { col_code: 'aircraftHeight', col_chn: '机身高度' },
+        { col_code: 'maxPassengers', col_chn: '最大乘客数' },
+        { col_code: 'maxFreightWeight', col_chn: '最大货物重量' },
+        { col_code: 'maxTakeoffWeight', col_chn: '最大起飞重量' },
+        { col_code: 'maxAirbridges', col_chn: '最大廊桥数' },
+        { col_code: 'aircraftTypeGroupName', col_chn: '机型组' },
+        { col_code: 'aircraftTypeCodeCaa', col_chn: 'CAA码' },
+        { col_code: 'aircraftTypeCodeIata', col_chn: 'IATA码' },
+        { col_code: 'aircraftTypeCodeIcao', col_chn: 'ICAO码' },
+    ]
 
-//下拉框
+    // 搜索条件
-public filterItems = {
+    SEARCH = '';    //手动输入条件
-    aircrafttypegroupId:'',
+    FLT_POS = 1;    //过滤还是定位
-}
+    SEL_COL = '';   //选择列名
 
-aircraftTypes : Array<any>;
+    //下拉框
-public row_state: any = { renderFlight: {} };
+    public filterItems = {
-public render_data: Array<object> = [];  //显示数据，即需要显示的数据
+        aircrafttypegroupId: '',
-public return_data: Array<object> = []; //下拉框显示数据
+    }
-ngOnInit() {
+
+    aircraftTypesGroups: Array<any>; //机型组
+    aircraftTypes: Array<any>;
+    public row_state: any = { renderFlight: {} };
+    public render_data: Array<object> = [];  //显示数据，即需要显示的数据
+
+    ngOnInit() {
+        this.aircraftTypesGroups = this.basicDataService.aircraft_type_group;
         this.aircraftTypes = this.basicDataService.aircraft_type;
+        this.render_data = this.basicDataService.aircraft_type;
         this.basicDataService.aircraft_type_subject.subscribe(
-        data=>{
+            data => {
                 this.aircraftTypes = data;
-            this.render_data = this.aircraftTypes;
+                this.render_data = data;
             }
         )
+        //机型组
+        this.basicDataService.aircraft_type_group_subject.subscribe(
+            data => {
+                this.aircraftTypesGroups = data;
+                if(this.aircraftTypesGroups && this.aircraftTypesGroups.length > 0){ //机型组转换处理
+                    this.aircraftTypesGroupsHandle();
+                }
+            }
+        )
+        //机型组转换处理
+        if(this.render_data){
+            this.aircraftTypesGroupsHandle();
+        }
         /**
          * 固定表头
          */
         var tableCont = document.querySelector('#table-container');
-    function scrollHandle (){
+        function scrollHandle() {
             var scrollTop = this.scrollTop;
             this.querySelector('thead').style.transform = 'translateY(' + scrollTop + 'px)';
         }
-    tableCont.addEventListener('scroll',scrollHandle);
+        tableCont.addEventListener('scroll', scrollHandle);
-}
+    }
 
-/**
+    //机型组转换处理
+    aircraftTypesGroupsHandle() {
+        this.render_data.forEach(item => {
+            let aircraftTypesGroupsLinkIndex = this.aircraftTypesGroups.findIndex(val => val.aircraftTypeGroupId === item['aircraftTypeGroupId']);
+            if(this.aircraftTypesGroups[aircraftTypesGroupsLinkIndex]){
+                item['aircraftTypeGroupName'] = this.aircraftTypesGroups[aircraftTypesGroupsLinkIndex].aircraftTypeGroupName;
+            }
+        })
+    }
+
+    /**
      * 选中某行
      * @param i 
      */
-selectRow(i) {
+    selectRow(i) {
         this.row_state = i;
-}
-
-///输入框回车事件
-inputEnter() {
-    if (this.FLT_POS === 1) {
-        this.inputFilter(this.aircraftTypes)
-    } else {
-        this.inputFilter(this.aircraftTypes)
-        this.inputPosition(this.aircraftTypes)
     }
-}
 
-//下拉框选择筛选
+    ///输入框回车事件
-selectChange() {
+    inputEnter() {
-    this.return_data = this.aircraftTypes.filter(item=>{
+        if (this.FLT_POS === 1) {
+            this.selectChange()
+        } else {
+            this.inputPosition(this.render_data)
+        }
+    }
+
+    //下拉框选择筛选
+    selectChange() {
+        this.render_data = this.aircraftTypes.filter(item => {
             let is_satis = true;
             for (const key in this.filterItems) {
                 if (this.filterItems.hasOwnProperty(key) && this.filterItems[key]) {
-                    if (item[key] === this.filterItems[key]) {
+                    if (item[key] == this.filterItems[key]) {
                         is_satis = true;
                         continue;
                     } else {
@@ -83,35 +123,35 @@ selectChange() {
             }
             return is_satis;
         })
-    this.render_data = this.return_data;
+        if (this.FLT_POS === 1) {
-}
+            this.inputFilter(this.render_data);
+        } else {
+            this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
+    }
 
-//输入框筛选
+    //输入框筛选
-inputFilter(filterData) {
+    inputFilter(filterData) {
         if (this.SEARCH) {
             if (this.SEL_COL) {
                 let sel_col = this.SEL_COL;
-            filterData = filterData.filter(item => {
+                this.render_data = 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 => {
+                this.render_data = filterData.filter(item => {
                     let is_satis = false;
-                for (const key in item) {
+                    let cols = this.col_lists;
-                    if (item.hasOwnProperty(key)) {
+                    for (let i = 0; i < cols.length; i++) {
-                        if (item[key]) {
+                        if (item[cols[i].col_code]) {
-                            if (item[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                            if (item[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                                 is_satis = true;
                                 break;
                             } else {
@@ -119,30 +159,22 @@ inputFilter(filterData) {
                                 continue;
                             }
                         } else {
-                            if (this.SEARCH) {
                             is_satis = false;
                             continue;
-                            } else {
-                                is_satis = true;
-                                break;
-                            }
-                        }
-                    } else {
-                        continue;
                         }
                     }
                     return is_satis;
                 })
             }
-    }
+        } else {
             this.render_data = filterData;
-    this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
-}
+    }
 
-positionArray: Array<any> = [];
+    positionArray: Array<any> = [];
-positionArrayIndex: number = 0;
+    positionArrayIndex: number = 0;
-//输入框定位
+    //输入框定位
-inputPosition(filterData) {
+    inputPosition(filterData) {
         let transArray = []
         if (this.SEL_COL) {
             let sel_col = this.SEL_COL;
@@ -159,10 +191,10 @@ inputPosition(filterData) {
             });
         } else {
             filterData.forEach(element => {
-            for (const key in element) {
+                let cols = this.col_lists;
-                if (element.hasOwnProperty(key)) {
+                for (let i = 0; i < cols.length; i++) {
-                    if (element[key]) {
+                    if (element[cols[i].col_code]) {
-                        if (element[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                        if (element[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                             transArray.push(element)
                             break;
                         } else {
@@ -176,10 +208,6 @@ inputPosition(filterData) {
                             break;
                         }
                     }
-
-                } else {
-                    continue;
-                }
                 }
             });
         }
@@ -199,8 +227,12 @@ inputPosition(filterData) {
         } else {
             alert('没有搜索到相关数据');
         }
+        this.changeDetectorRef.detectChanges();
         let tr = $(".selected");
         let objTr = tr[0];
+        if (objTr) {
             $("#table-container").animate({ scrollTop: objTr.offsetTop - 42 }, "slow");
         }
+
+    }
 }

src/app/pages/basic-data/aircraft/aircraft.component.html

@@ -5,14 +5,7 @@
                 <div class="line-operator-left input-container mb-3 col-xlg-8 col-mlg-8 col-xl-8 col-lg-10">
                     <select class="mr-4 form-control" [(ngModel)]="SEL_COL" name="" id="">
                         <option value="">选择列名</option>
-                        <option value="aircraftNumber">飞机号</option>
+                        <option *ngFor="let col of col_lists" [value]="col.col_code">{{col.col_chn}}</option>
-                        <option value="maxPassengers">最大乘客数</option>
-                        <option value="maxFreightWeight">最大货物重量</option>
-                        <option value="maxTakeoffWeight">最大起飞重量</option>
-                        <option value="maxAirbridges">最大廊桥数</option>
-                        <option value="aircraftOwnerCode">机主航空公司</option>
-                        <option value="airlineName">航空公司</option>
-                        <option value="aircraftTypeName">机型</option>
                     </select>
                     <label class="radio-inline custom-radio nowrap mr-4">
                         <input type="radio" [(ngModel)]="FLT_POS" [value]="1" name="filter-position">
@@ -24,12 +17,6 @@
                     </label>
                     <input class="form-control" [(ngModel)]="SEARCH" type="text" (keyup.enter) = "inputEnter()" id="inputerInfo">
                 </div>
-                <div class="line-operator-right mb-3 col-xlg-4 col-mlg-4 col-xl-4 col-lg-1">
-                    <!-- <button type="button" class="btn btn-info mr-3">打印</button>
-                    <button type="button" class="btn btn-info mr-3">飞机登记</button>
-                    <button type="button" class="btn btn-info mr-3">定制查询</button> -->
-                    <!-- <button type="button" class="btn btn-info mr-3">刷新</button> -->
-                </div>
             </div>
   
             <div class="second-condition mb-3 row">
@@ -64,7 +51,6 @@
                             <th>机主航空公司</th>
                             <th>航空公司</th>
                             <th>机型</th>
-                            <!-- <th *ngFor="let airline_col of aircraft_lists">{{airline_col.COL_CN}}</th> -->
                         </tr>
                     </thead>
                     <tbody>
@@ -79,7 +65,6 @@
                             <td>{{aircraft.aircraftOwnerCode}}</td>
                             <td>{{aircraft.airlineName}}</td>
                             <td>{{aircraft.aircraftTypeName}}</td>
-                            <!-- <td *ngFor="let airline_col of aircraft_lists" [ngStyle]="{'background-color':getColor(airline_col.COL_CODE)}">{{airline_row['renderFlight'][airline_col.COL_CODE]}}</td> -->
                         </tr>
                     </tbody>
                 </table>

src/app/pages/basic-data/aircraft/aircraft.component.scss

@@ -44,6 +44,7 @@
                     }
                     th{
                         background-color: #ddd;
+                        color: rgb(0, 0, 255);
                     }
                     th,td{
                         // border: none;

src/app/pages/basic-data/aircraft/aircraft.component.ts

@@ -1,117 +1,134 @@
 import { Component, OnInit } from '@angular/core';
-import { HttpClientService } from '../../../services/http-client.service';
+import { BasicDataService } from '../../basic-data-service';
-import { BasicDataService } from '../../basic-data-service'
+import { ChangeDetectorRef } from '@angular/core';
-import { HttpParams } from '@angular/common/http';
 import * as $ from 'jquery';
 @Component({
     selector: 'app-aircraft',
     templateUrl: './aircraft.component.html',
     styleUrls: ['./aircraft.component.scss']
-  })
+})
-  export class AircraftComponent implements OnInit {
+export class AircraftComponent implements OnInit {
 
     constructor(
-    private httpCilent: HttpClientService,
+        private basicDataService: BasicDataService,
-    private basicDataService: BasicDataService
+        private changeDetectorRef: ChangeDetectorRef
-) { }
+    ) { }
 
-// 搜索条件
+    public col_lists = [
-SEARCH = '';    //手动输入条件
+        { col_code: 'aircraftNumber', col_chn: '飞机号' },
-FLT_POS = 1;    //过滤还是定位
+        { col_code: 'maxPassengers', col_chn: '最大乘客数' },
-SEL_COL = '';   //选择列名
+        { col_code: 'maxFreightWeight', col_chn: '最大货物重量' },
+        { col_code: 'maxTakeoffWeight', col_chn: '最大起飞重量' },
+        { col_code: 'maxAirbridges', col_chn: '最大廊桥数' },
+        { col_code: 'aircraftOwnerCode', col_chn: '机主航空公司' },
+        { col_code: 'airlineName', col_chn: '航空公司' },
+        { col_code: 'aircraftTypeName', col_chn: '机型' }
+    ]
 
-//下拉框
+    // 搜索条件
-public filterItems = {
+    SEARCH = '';    //手动输入条件
-    airlineCode:'',
+    FLT_POS = 1;    //过滤还是定位
-    aircraftTypeCode:'',
+    SEL_COL = '';   //选择列名
-}
-airlines : Array<any>; //航空公司
-aircraftTypes : Array<any>; //机型
-aircrafts : Array<any>;
-public row_state: any = { renderFlight: {} };
-public render_data: Array<object> = [];  //显示数据，即需要显示的数据
-public return_data: Array<object> = []; //下拉框显示数据
 
-ngOnInit() {
+    //下拉框
+    public filterItems = {
+        airlineCode: '',
+        aircraftTypeCode: '',
+    }
+    airlines: Array<any>; //航空公司
+    aircraftTypes: Array<any>; //机型
+    aircrafts: Array<any>;
+    public row_state: any = { renderFlight: {} };
+    public render_data: Array<object> = [];  //显示数据，即需要显示的数据
+
+    ngOnInit() {
+        this.airlines = this.basicDataService.airline;
+        this.aircraftTypes = this.basicDataService.aircraft_type;
         this.aircrafts = this.basicDataService.aircraft;
+        this.render_data = this.basicDataService.aircraft;
         this.basicDataService.aircraft_subject.subscribe(
-        data=>{
+            data => {
                 this.aircrafts = data;
-            this.render_data = this.aircrafts;
+                this.render_data = data;
                 if(this.aircraftTypes && this.aircraftTypes.length > 0){//机型列表数据转换
                     this.basicDataTransHandle();
                 }
-            if(this.airlines && this.airlines.length > 0){//航空公司数据处理
-                this.basicDataAirlinesHandle();
-            }
             }
         )
-    //航空公司
-    this.airlines = this.basicDataService.airline;
         this.basicDataService.airline_subject.subscribe(
-        data=>{
+            data => {
                 this.airlines = data;
+                if(this.airlines && this.airlines.length > 0){//航空公司数据转换处理
+                    this.airlinesHandle();
+                }
             }
         )
-    //机型
-    this.aircraftTypes = this.basicDataService.aircraft_type;
         this.basicDataService.aircraft_type_subject.subscribe(
-        data=>{
+            data => {
                 this.aircraftTypes = data;
             }
         )
-    
+        if(this.render_data){
+            //机型数据转换处理
+            this.basicDataTransHandle();
+            //航空公司数据转换处理
+            this.airlinesHandle();
+        }
         /**
          * 固定表头
          */
         var tableCont = document.querySelector('#table-container');
-    function scrollHandle (){
+        function scrollHandle() {
             var scrollTop = this.scrollTop;
             this.querySelector('thead').style.transform = 'translateY(' + scrollTop + 'px)';
         }
-    tableCont.addEventListener('scroll',scrollHandle);
+        tableCont.addEventListener('scroll', scrollHandle);
-}
+    }
 
-basicDataTransHandle() {
+    //航空公司数据转换处理
+    airlinesHandle() {
         this.render_data.forEach(item => {
-        //机型数据转换处理
-        let aircraftTypesLinkIndex = this.aircraftTypes.findIndex(val => val.aircraftTypeCode === item['aircraftTypeCode']);
-        item['aircraftTypeName'] = this.aircraftTypes[aircraftTypesLinkIndex].aircraftTypeName;
-    })
-}
-
-basicDataAirlinesHandle() {
-    this.render_data.forEach(item => {
-        //航空公司数据处理
             let airlinesLinkIndex = this.airlines.findIndex(val => val.airlineCode === item['airlineCode']);
+            if(this.airlines[airlinesLinkIndex]){
                 item['airlineName'] = this.airlines[airlinesLinkIndex].airlineName;
+            }
         })
-}
+    }
-/**
+
+     //机型数据转换处理
+     basicDataTransHandle() {
+        this.render_data.forEach(item => {
+            let aircraftTypesLinkIndex = this.aircraftTypes.findIndex(val => val.aircraftTypeCode === item['aircraftTypeCode']);
+            if(this.aircraftTypes[aircraftTypesLinkIndex]){
+                item['aircraftTypeName'] = this.aircraftTypes[aircraftTypesLinkIndex].aircraftTypeName;
+            }
+        })
+    }
+
+    /**
      * 选中某行
      * @param i 
      */
-selectRow(i) {
+    selectRow(i) {
         this.row_state = i;
-}
-
-//输入框回车事件
-inputEnter() {
-    if (this.FLT_POS === 1) {
-        this.inputFilter(this.aircrafts)
-    } else {
-        this.inputFilter(this.aircrafts)
-        this.inputPosition(this.aircrafts)
     }
-}
 
-//下拉框选择筛选
+    //输入框回车事件
-selectChange() {
+    inputEnter() {
-    this.return_data = this.aircrafts.filter(item=>{
+        if (this.FLT_POS === 1) {
+            this.selectChange()
+        } else {
+            this.inputPosition(this.render_data)
+        }
+    }
+
+    //下拉框选择筛选
+    selectChange() {
+        this.render_data = this.aircrafts.filter(item => {
             let is_satis = true;
             for (const key in this.filterItems) {
                 if (this.filterItems.hasOwnProperty(key) && this.filterItems[key]) {
-                    if (item[key] === this.filterItems[key]) {
+                    if (item[key] == this.filterItems[key]) {
                         is_satis = true;
                         continue;
                     } else {
@@ -122,35 +139,35 @@ selectChange() {
             }
             return is_satis;
         })
-    this.render_data = this.return_data;
+        if (this.FLT_POS === 1) {
-}
+            this.inputFilter(this.render_data);
+        } else {
+            this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
+    }
 
-//输入框筛选
+    //输入框筛选
-inputFilter(filterData) {
+    inputFilter(filterData) {
         if (this.SEARCH) {
             if (this.SEL_COL) {
                 let sel_col = this.SEL_COL;
-            filterData = filterData.filter(item => {
+                this.render_data = 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 => {
+                this.render_data = filterData.filter(item => {
                     let is_satis = false;
-                for (const key in item) {
+                    let cols = this.col_lists;
-                    if (item.hasOwnProperty(key)) {
+                    for (let i = 0; i < cols.length; i++) {
-                        if (item[key]) {
+                        if (item[cols[i].col_code]) {
-                            if (item[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                            if (item[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                                 is_satis = true;
                                 break;
                             } else {
@@ -158,30 +175,22 @@ inputFilter(filterData) {
                                 continue;
                             }
                         } else {
-                            if (this.SEARCH) {
                             is_satis = false;
                             continue;
-                            } else {
-                                is_satis = true;
-                                break;
-                            }
-                        }
-                    } else {
-                        continue;
                         }
                     }
                     return is_satis;
                 })
             }
-    }
+        } else {
             this.render_data = filterData;
-    this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
-}
+    }
 
-positionArray: Array<any> = [];
+    positionArray: Array<any> = [];
-positionArrayIndex: number = 0;
+    positionArrayIndex: number = 0;
-//输入框定位
+    //输入框定位
-inputPosition(filterData) {
+    inputPosition(filterData) {
         let transArray = []
         if (this.SEL_COL) {
             let sel_col = this.SEL_COL;
@@ -198,10 +207,10 @@ inputPosition(filterData) {
             });
         } else {
             filterData.forEach(element => {
-            for (const key in element) {
+                let cols = this.col_lists;
-                if (element.hasOwnProperty(key)) {
+                for (let i = 0; i < cols.length; i++) {
-                    if (element[key]) {
+                    if (element[cols[i].col_code]) {
-                        if (element[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                        if (element[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                             transArray.push(element)
                             break;
                         } else {
@@ -215,10 +224,6 @@ inputPosition(filterData) {
                             break;
                         }
                     }
-
-                } else {
-                    continue;
-                }
                 }
             });
         }
@@ -238,8 +243,12 @@ inputPosition(filterData) {
         } else {
             alert('没有搜索到相关数据');
         }
+        this.changeDetectorRef.detectChanges();
         let tr = $(".selected");
         let objTr = tr[0];
+        if (objTr) {
             $("#table-container").animate({ scrollTop: objTr.offsetTop - 42 }, "slow");
         }
+
+    }
 }

src/app/pages/basic-data/airline/airline.component.html

@@ -5,15 +5,7 @@
                 <div class="line-operator-left input-container mb-3 col-xlg-8 col-mlg-8 col-xl-8 col-lg-10">
                     <select class="mr-4 form-control" [(ngModel)]="SEL_COL" name="" id="">
                         <option value="">选择列名</option>
-                        <option value="airlineCode">航空公司代码</option>
+                        <option *ngFor="let col of col_lists" [value]="col.col_code">{{col.col_chn}}</option>
-                        <option value="airlineName">航空公司中文名</option>
-                        <option value="briefNameChn">中文简称</option>
-                        <option value="airlineNameEng">航空公司英文名</option>
-                        <option value="briefNameEng">英文简称</option>
-                        <option value="airlineCodeIata">IATA码</option>
-                        <option value="airlineCodeCaa">CAA码</option>
-                        <option value="airlineCodeIcao">ICAO码</option>
-                        <option value="parentAirlineId">上级母公司</option>
                     </select>
                     <label class="radio-inline custom-radio nowrap mr-4">
                         <input type="radio" [(ngModel)]="FLT_POS" [value]="1" name="filter-position">
@@ -25,22 +17,14 @@
                     </label>
                     <input class="form-control" [(ngModel)]="SEARCH" type="text" (keyup.enter) = "inputEnter()" id="gl">
                 </div>
-                <div class="line-operator-right mb-3 col-xlg-4 col-mlg-4 col-xl-4 col-lg-1">
-                    <!-- <button type="button" class="btn btn-info mr-3">打印</button>
-                    <button type="button" class="btn btn-info mr-3">航空公司登记</button>
-                    <button type="button" class="btn btn-info mr-3">航空集团登记</button>
-                    <button type="button" class="btn btn-info mr-3">航空代理登记</button>
-                    <button type="button" class="btn btn-info mr-3">定制查询</button> -->
-                   <!--  <button type="button" class="btn btn-info mr-3">刷新</button> -->
-                </div>
             </div>
   
             <div class="second-condition mb-3 row">
               <div class="input-container mr-4">
-                <label for="airlineName">航空集团：&nbsp;&nbsp;</label>
+                <label for="airlineGroupId">航空集团：&nbsp;&nbsp;</label>
-                <select class="form-control" [(ngModel)]="filterItems.airlineName" (ngModelChange)="selectChange()" id="handkong">
+                <select class="form-control" [(ngModel)]="filterItems.airlineGroupId" (ngModelChange)="selectChange()" id="handkong">
                     <option value=""></option>
-                    <option *ngFor="let item of airlines" [value]="item.airlineName" >{{item.airlineName}}</option>
+                    <option *ngFor="let item of airlinegroups" [value]="item.airlineGroupId" >{{item.airlineGroupName}}</option>
                 </select>
             </div>
             <div class="input-container mr-4">
@@ -68,7 +52,6 @@
                             <th>CAA码</th>
                             <th>ICAO码</th>
                             <th>上级母公司</th>
-                            <!-- <th *ngFor="let airline_col of airline_lists">{{airline_col.COL_CN}}</th> -->
                         </tr>
                     </thead>
                     <tbody>
@@ -84,7 +67,6 @@
                             <td>{{airline.airlineCodeCaa}}</td>
                             <td>{{airline.airlineCodeIcao}}</td>
                             <td>{{airline.parentAirlineId}}</td>
-                            <!-- <td *ngFor="let airline_col of airline_lists" [ngStyle]="{'background-color':getColor(airline_col.COL_CODE)}">{{airline_row['renderFlight'][airline_col.COL_CODE]}}</td> -->
                         </tr>
                     </tbody>
                 </table>

src/app/pages/basic-data/airline/airline.component.scss

@@ -44,6 +44,7 @@
                     }
                     th{
                         background-color: #ddd;
+                        color: rgb(0, 0, 255);
                     }
                     th,td{
                         // border: none;

src/app/pages/basic-data/airline/airline.component.ts

@@ -1,7 +1,6 @@
 import { Component, OnInit } from '@angular/core';
-import { HttpClientService } from '../../../services/http-client.service';
+import { BasicDataService } from '../../basic-data-service';
-import { BasicDataService } from '../../basic-data-service'
+import { ChangeDetectorRef } from '@angular/core';
-import { HttpParams } from '@angular/common/http';
 import * as $ from 'jquery';
 @Component({
     selector: 'app-airline',
@@ -10,69 +9,86 @@ import * as $ from 'jquery';
 })
 export class AirlineComponent implements OnInit {
 
-constructor(
+    constructor(
-    private httpCilent: HttpClientService,
+        private basicDataService: BasicDataService,
-    private basicDataService: BasicDataService
+        private changeDetectorRef: ChangeDetectorRef
-) { }
+    ) { }
 
-// 搜索条件
+    public col_lists = [
-SEARCH = '';    //手动输入条件
+        { col_code: 'airlineCode', col_chn: '航空公司代码' },
-FLT_POS = 1;    //过滤还是定位
+        { col_code: 'airlineName', col_chn: '航空公司中文名' },
-SEL_COL = '';   //选择列名
+        { col_code: 'briefNameChn', col_chn: '中文简称' },
+        { col_code: 'airlineNameEng', col_chn: '航空公司英文名' },
+        { col_code: 'briefNameEng', col_chn: '英文简称' },
+        { col_code: 'airlineCodeIata', col_chn: 'IATA码' },
+        { col_code: 'airlineCodeCaa', col_chn: 'CAA码' },
+        { col_code: 'airlineCodeIcao', col_chn: 'ICAO码' },
+        { col_code: 'parentAirlineId', col_chn: '上级母公司' },
+    ]
 
-airlines:Array<any>;
+    // 搜索条件
-public row_state: any = { renderFlight: {} };
+    SEARCH = '';    //手动输入条件
-public render_data: Array<object> = [];  //显示数据，即需要显示的数据
+    FLT_POS = 1;    //过滤还是定位
-public return_data: Array<object> = []; //下拉框显示数据
+    SEL_COL = '';   //选择列名
-//下拉框
+
-public filterItems = {
+    airlinegroups: Array<any>; //航空集团
-    airlineName:'',
+    airlines: Array<any>;
-    briefNameChn:'',
+    public row_state: any = { renderFlight: {} };
-}
+    public render_data: Array<object> = [];  //显示数据，即需要显示的数据
-ngOnInit() {
+
-    this.airlines = this.basicDataService.airline;
+    //下拉框
-    this.basicDataService.airline_subject.subscribe(
+    public filterItems = {
-        data=>{
+        airlineName: '',
-            this.airlines = data;
+        briefNameChn: '',
-            this.render_data = this.airlines;
     }
+    ngOnInit() {
+        this.airlinegroups = this.basicDataService.airlinegroup;
+        this.airlines = this.basicDataService.airline;
+        this.render_data = this.basicDataService.airline;
+        this.basicDataService.airline_subject.subscribe(
+            data => {
+                this.airlines = data;
+                this.render_data = data;
+            }
+        )
+        this.basicDataService.airlinegroup_subject.subscribe(
+            data => this.airlinegroups = data
         )
         /**
          * 固定表头
          */
         var tableCont = document.querySelector('#table-container');
-    function scrollHandle (){
+        function scrollHandle() {
             var scrollTop = this.scrollTop;
             this.querySelector('thead').style.transform = 'translateY(' + scrollTop + 'px)';
         }
-    tableCont.addEventListener('scroll',scrollHandle);
+        tableCont.addEventListener('scroll', scrollHandle);
-}
+    }
 
-/**
+    /**
      * 选中某行
      * @param i 
      */
-selectRow(i) {
+    selectRow(i) {
         this.row_state = i;
-}
-
-//输入框回车事件
-inputEnter() {
-    if (this.FLT_POS === 1) {
-        this.inputFilter(this.airlines)
-    } else {
-        this.inputFilter(this.airlines)
-        this.inputPosition(this.airlines)
     }
-}
 
-//下拉框选择筛选
+    //输入框回车事件
-selectChange() {
+    inputEnter() {
-    this.return_data = this.airlines.filter(item=>{
+        if (this.FLT_POS === 1) {
+            this.selectChange()
+        } else {
+            this.inputPosition(this.render_data)
+        }
+    }
+
+    //下拉框选择筛选
+    selectChange() {
+        this.render_data = this.airlines.filter(item => {
             let is_satis = true;
             for (const key in this.filterItems) {
                 if (this.filterItems.hasOwnProperty(key) && this.filterItems[key]) {
-                    if (item[key] === this.filterItems[key]) {
+                    if (item[key] == this.filterItems[key]) {
                         is_satis = true;
                         continue;
                     } else {
@@ -83,35 +99,34 @@ selectChange() {
             }
             return is_satis;
         })
-    this.render_data = this.return_data;
+        if (this.FLT_POS === 1) {
-}
+            this.inputFilter(this.render_data);
+        } else {
+            this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
+    }
 
-//输入框筛选
+    //输入框筛选
-inputFilter(filterData) {
+    inputFilter(filterData) {
         if (this.SEARCH) {
             if (this.SEL_COL) {
                 let sel_col = this.SEL_COL;
-            filterData = filterData.filter(item => {
+                this.render_data = 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 => {
+                this.render_data = filterData.filter(item => {
                     let is_satis = false;
-                for (const key in item) {
+                    let cols = this.col_lists;
-                    if (item.hasOwnProperty(key)) {
+                    for (let i = 0; i < cols.length; i++) {
-                        if (item[key]) {
+                        if (item[cols[i].col_code]) {
-                            if (item[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                            if (item[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                                 is_satis = true;
                                 break;
                             } else {
@@ -119,30 +134,22 @@ inputFilter(filterData) {
                                 continue;
                             }
                         } else {
-                            if (this.SEARCH) {
                             is_satis = false;
                             continue;
-                            } else {
-                                is_satis = true;
-                                break;
-                            }
-                        }
-                    } else {
-                        continue;
                         }
                     }
                     return is_satis;
                 })
             }
-    }
+        } else {
             this.render_data = filterData;
-    this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
-}
+    }
 
-positionArray: Array<any> = [];
+    positionArray: Array<any> = [];
-positionArrayIndex: number = 0;
+    positionArrayIndex: number = 0;
-//输入框定位
+    //输入框定位
-inputPosition(filterData) {
+    inputPosition(filterData) {
         let transArray = []
         if (this.SEL_COL) {
             let sel_col = this.SEL_COL;
@@ -159,10 +166,10 @@ inputPosition(filterData) {
             });
         } else {
             filterData.forEach(element => {
-            for (const key in element) {
+                let cols = this.col_lists;
-                if (element.hasOwnProperty(key)) {
+                for (let i = 0; i < cols.length; i++) {
-                    if (element[key]) {
+                    if (element[cols[i].col_code]) {
-                        if (element[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                        if (element[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                             transArray.push(element)
                             break;
                         } else {
@@ -176,10 +183,6 @@ inputPosition(filterData) {
                             break;
                         }
                     }
-
-                } else {
-                    continue;
-                }
                 }
             });
         }
@@ -199,8 +202,11 @@ inputPosition(filterData) {
         } else {
             alert('没有搜索到相关数据');
         }
+        this.changeDetectorRef.detectChanges();
         let tr = $(".selected");
         let objTr = tr[0];
+        if (objTr) {
             $("#table-container").animate({ scrollTop: objTr.offsetTop - 42 }, "slow");
         }
+    }
 }

src/app/pages/basic-data/airport/airport.component.html

@@ -5,16 +5,7 @@
               <div class="line-operator-left input-container mb-3 col-xlg-8 col-mlg-8 col-xl-8 col-lg-10">
                     <select class="mr-4 form-control" [(ngModel)]="SEL_COL" name="" id="">
                             <option value="">选择列名</option>
-                            <option value="airportCode">机场代码</option>
+                            <option *ngFor="let col of col_lists" [value]="col.col_code">{{col.col_chn}}</option>
-                            <option value="airportNameChn">机场中文名</option>
-                            <option value="briefNameChn">中文简称</option>
-                            <option value="airportNameEng">机场英文名</option>
-                            <option value="briefNameEng">英文简称</option>
-                            <option value="airportCodeIata">IATA码</option>
-                            <option value="airportCodeCaa">CAA码</option>
-                            <option value="airportCodeIcao">ICAO码</option>
-                            <option value="airportGroupId">机场集团</option>
-                            <option value="cityName">所在城市</option>
                     </select>
                     <label class="radio-inline custom-radio nowrap mr-4">
                             <input type="radio" [(ngModel)]="FLT_POS" [value]="1" name="filter-position">
@@ -26,13 +17,6 @@
                     </label>
                     <input class="form-control" [(ngModel)]="SEARCH" type="text" (keyup.enter) = "inputEnter()" id="inputInfo">
               </div>
-              <div class="line-operator-right mb-3 col-xlg-4 col-mlg-4 col-xl-4 col-lg-1">
-                  <!-- <button type="button" class="btn btn-info mr-3">打印</button>
-                  <button type="button" class="btn btn-info mr-3">机场管理</button>
-                  <button type="button" class="btn btn-info mr-3">机场集团管理</button>
-                  <button type="button" class="btn btn-info mr-3">定制查询</button> -->
-                  <!-- <button type="button" class="btn btn-info mr-3">刷新</button> -->
-              </div>
           </div>
 
           <div class="second-condition mb-3 row">
@@ -40,18 +24,13 @@
               <label for="airportGroupId">机场集团：&nbsp;&nbsp;</label>
               <select  class="form-control" [(ngModel)]="filterItems.airportGroupId" (ngModelChange)="selectChange()" id="jt">
                   <option value=""></option>
-                  <!-- <option value="GH">国内机场</option>
+                  <option *ngFor="let item of airportgroups" [value]="item.airportGroupId">{{item.airportGroupName}}</option>
-                  <option value="CH">国际机场</option> -->
-                  <option *ngFor="let item of airports" [value]="item.airportGroupId">{{item.airportGroupId}}</option>
               </select>
           </div>
           <div class="input-container mr-4">
               <label for="cityId">城市：&nbsp;&nbsp;</label>
               <select  class="form-control" [(ngModel)]="filterItems.cityId" (ngModelChange)="selectChange()" id="city">
                   <option value=""></option>
-                  <!-- <option value="GZ">广州</option>
-                  <option value="SH">上海</option>
-                  <option value="BJ">北京</option> -->
                   <option *ngFor="let item of citys" [value]="item.cityId">{{item.cityNameChn}}</option>
               </select>
           </div>
@@ -74,7 +53,6 @@
                           <th>ICAO码</th>
                           <th>机场集团</th>
                           <th>所在城市</th>
-                          <!-- <th *ngFor="let airline_col of airport_lists">{{airline_col.COL_CN}}</th> -->
                       </tr>
                   </thead>
                   <tbody>
@@ -89,9 +67,8 @@
                           <td>{{airport.airportCodeIata}}</td>
                           <td>{{airport.airportCodeCaa}}</td>
                           <td>{{airport.airportCodeIcao}}</td>
-                          <td>{{airport.airportGroupId}}</td>
+                          <td>{{airport.airportGroupName}}</td>
-                          <td>{{airport.cityName}}</td>
+                          <td>{{airport.cityNameChn}}</td>
-                          <!-- <td *ngFor="let airline_col of airport_lists" [ngStyle]="{'background-color':getColor(airline_col.COL_CODE)}">{{airline_row['renderFlight'][airline_col.COL_CODE]}}</td> -->
                       </tr>
                   </tbody>
               </table>

src/app/pages/basic-data/airport/airport.component.scss

@@ -44,6 +44,7 @@
                     }
                     th{
                         background-color: #ddd;
+                        color: rgb(0, 0, 255);
                     }
                     th,td{
                         // border: none;

src/app/pages/basic-data/airport/airport.component.ts

@@ -1,8 +1,8 @@
 import { Component, OnInit } from '@angular/core';
-import { HttpClientService } from '../../../services/http-client.service';
+import { BasicDataService } from '../../basic-data-service';
-import { HttpParams } from '@angular/common/http';
+import { ChangeDetectorRef } from '@angular/core';
 import * as $ from 'jquery';
-import { BasicDataService } from '../../basic-data-service'
+
 @Component({
     selector: 'app-airport',
     templateUrl: './airport.component.html',
@@ -11,88 +11,128 @@ import { BasicDataService } from '../../basic-data-service'
 export class AirportComponent implements OnInit {
 
     constructor(
-    private httpCilent: HttpClientService,
+        private basicDataService: BasicDataService,
-    private basicDataService: BasicDataService
+        private changeDetectorRef: ChangeDetectorRef
-) { }
+    ) { }
 
-// 搜索条件
+    public col_lists = [
-SEARCH = '';    //手动输入条件
+        { col_code: 'airportCode', col_chn: '机场代码' },
-FLT_POS = 1;    //过滤还是定位
+        { col_code: 'airportNameChn', col_chn: '机场中文名' },
-SEL_COL = '';   //选择列名
+        { col_code: 'briefNameChn', col_chn: '中文简称' },
+        { col_code: 'airportNameEng', col_chn: '机场英文名' },
+        { col_code: 'briefNameEng', col_chn: '英文简称' },
+        { col_code: 'airportCodeIata', col_chn: 'IATA码' },
+        { col_code: 'airportCodeCaa', col_chn: 'CAA码' },
+        { col_code: 'airportCodeIcao', col_chn: 'ICAO码' },
+        { col_code: 'airportGroupName', col_chn: '机场集团' },
+        { col_code: 'cityNameChn', col_chn: '所在城市' },
+    ]
 
-//下拉框
+    // 搜索条件
-public filterItems = {
+    SEARCH = '';    //手动输入条件
-    airportGroupId:'',
+    FLT_POS = 1;    //过滤还是定位
-    cityId:'',
+    SEL_COL = '';   //选择列名
-}
-citys : Array<any>; //城市
-airports : Array<any>;
-public row_state: any = { renderFlight: {} };
-public render_data: Array<object> = [];  //显示数据，即需要显示的数据
-public return_data: Array<object> = []; //下拉框显示数据
 
-ngOnInit() {
+    //下拉框
+    public filterItems = {
+        airportGroupId: '',
+        cityId: '',
+    }
+
+    airportgroups: Array<any>; //机场集团
+    citys: Array<any>; //城市
+    airports: Array<any>;
+    public row_state: any = { renderFlight: {} };
+    public render_data: Array<object> = [];  //显示数据，即需要显示的数据
+
+    ngOnInit() {
+        this.airportgroups = this.basicDataService.airportgroup;
+        this.citys = this.basicDataService.city;
         this.airports = this.basicDataService.airport;
+        this.render_data = this.basicDataService.airport;
         this.basicDataService.airport_subject.subscribe(
-        data=>{
+            data => {
                 this.airports = data;
-            this.render_data = this.airports;
+                this.render_data = data;
-            if(this.citys && this.citys.length > 0){//所在城市列表数据转换
+                if(this.citys && this.citys.length > 0){//城市数据列表转换处理
                     this.basicDataTransHandle();
                 }
             }
         )
-    //城市
-    this.citys = this.basicDataService.city;
         this.basicDataService.city_subject.subscribe(
-        data=>{
+            data => {
                 this.citys = data;
             }
         )
+        this.basicDataService.airportgroup_subject.subscribe(
+            data => {
+                this.airportgroups = data
+                if(this.airportgroups && this.airportgroups.length > 0){//机场集团数据列表转换处理
+                    this.airportgroupsHandle();
+                }
+            }
+        )
+        if(this.render_data){
+            //城市数据转换处理
+            this.basicDataTransHandle();
+            //机场集团数据转换处理
+            this.airportgroupsHandle();
+        }
         /**
          * 固定表头
          */
         var tableCont = document.querySelector('#table-container');
-    function scrollHandle (){
+        function scrollHandle() {
             var scrollTop = this.scrollTop;
             this.querySelector('thead').style.transform = 'translateY(' + scrollTop + 'px)';
         }
-    tableCont.addEventListener('scroll',scrollHandle);
+        tableCont.addEventListener('scroll', scrollHandle);
-}
+    }
 
-//所在城市数据转换处理
+    //机场集团数据转换处理
-basicDataTransHandle() {
+    airportgroupsHandle() {
+        this.render_data.forEach(item => {
+            let airportgroupsLinkIndex = this.airportgroups.findIndex(val => val.airportGroupId === item['airportGroupId']);
+            if(this.airportgroups[airportgroupsLinkIndex]){
+                item['airportGroupName'] = this.airportgroups[airportgroupsLinkIndex].airportGroupName;
+            }
+        })
+    }
+
+    //城市数据转换处理
+    basicDataTransHandle() {
         this.render_data.forEach(item => {
             let citysLinkIndex = this.citys.findIndex(val => val.cityId === item['cityId']);
-        item['cityName'] = this.citys[citysLinkIndex].cityNameChn;
+            if(this.citys[citysLinkIndex]){
+                item['cityNameChn'] = this.citys[citysLinkIndex].cityNameChn;
+            }
         })
-}
+    }
 
-/**
+    /**
      * 选中某行
      * @param i 
      */
-selectRow(i) {
+    selectRow(i) {
         this.row_state = i;
-}
-
-//输入框回车事件
-inputEnter() {
-    if (this.FLT_POS === 1) {
-        this.inputFilter(this.airports)
-    } else {
-        this.inputFilter(this.airports)
-        this.inputPosition(this.airports)
     }
-}
 
-//下拉框选择筛选
+    //输入框回车事件
-selectChange() {
+    inputEnter() {
-    this.return_data = this.airports.filter(item=>{
+        if (this.FLT_POS === 1) {
+            this.selectChange()
+        } else {
+            this.inputPosition(this.render_data)
+        }
+    }
+
+    //下拉框选择筛选
+    selectChange() {
+        this.render_data = this.airports.filter(item => {
             let is_satis = true;
             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]) {
+                    if (item[key] == this.filterItems[key]) {
                         is_satis = true;
                         continue;
                     } else {
@@ -103,35 +143,34 @@ selectChange() {
             }
             return is_satis;
         })
-    this.render_data = this.return_data;
+        if (this.FLT_POS === 1) {
-}
+            this.inputFilter(this.render_data);
+        } else {
+            this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
+    }
 
-//输入框筛选
+    //输入框筛选
-inputFilter(filterData) {
+    inputFilter(filterData) {
         if (this.SEARCH) {
             if (this.SEL_COL) {
                 let sel_col = this.SEL_COL;
-            filterData = filterData.filter(item => {
+                this.render_data = 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 => {
+                this.render_data = filterData.filter(item => {
                     let is_satis = false;
-                for (const key in item) {
+                    let cols = this.col_lists;
-                    if (item.hasOwnProperty(key)) {
+                    for (let i = 0; i < cols.length; i++) {
-                        if (item[key]) {
+                        if (item[cols[i].col_code]) {
-                            if (item[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                            if (item[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                                 is_satis = true;
                                 break;
                             } else {
@@ -139,30 +178,22 @@ inputFilter(filterData) {
                                 continue;
                             }
                         } else {
-                            if (this.SEARCH) {
                             is_satis = false;
                             continue;
-                            } else {
-                                is_satis = true;
-                                break;
-                            }
-                        }
-                    } else {
-                        continue;
                         }
                     }
                     return is_satis;
                 })
             }
-    }
+        } else {
             this.render_data = filterData;
-    this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
-}
+    }
 
-positionArray: Array<any> = [];
+    positionArray: Array<any> = [];
-positionArrayIndex: number = 0;
+    positionArrayIndex: number = 0;
-//输入框定位
+    //输入框定位
-inputPosition(filterData) {
+    inputPosition(filterData) {
         let transArray = []
         if (this.SEL_COL) {
             let sel_col = this.SEL_COL;
@@ -179,10 +210,10 @@ inputPosition(filterData) {
             });
         } else {
             filterData.forEach(element => {
-            for (const key in element) {
+                let cols = this.col_lists;
-                if (element.hasOwnProperty(key)) {
+                for (let i = 0; i < cols.length; i++) {
-                    if (element[key]) {
+                    if (element[cols[i].col_code]) {
-                        if (element[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                        if (element[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                             transArray.push(element)
                             break;
                         } else {
@@ -196,10 +227,6 @@ inputPosition(filterData) {
                             break;
                         }
                     }
-
-                } else {
-                    continue;
-                }
                 }
             });
         }
@@ -219,8 +246,11 @@ inputPosition(filterData) {
         } else {
             alert('没有搜索到相关数据');
         }
+        this.changeDetectorRef.detectChanges();
         let tr = $(".selected");
         let objTr = tr[0];
+        if (objTr) {
             $("#table-container").animate({ scrollTop: objTr.offsetTop - 42 }, "slow");
         }
+    }
 }

src/app/pages/basic-data/basic-data.module.ts

@@ -1,5 +1,9 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { BasicDataPipesModule } from '../../pipes/basic-data-pipes/basic-data-pipes.module';
+
 import { BasicDataComponent } from './basic-data.component';
 import { BasicDataRouting } from './basic-data-routing.module';
 import { CheckinGroupComponent } from './checkin-group/checkin-group.component';
@@ -15,12 +19,13 @@ import { AircraftTypeComponent } from './aircraft-type/aircraft-type.component';
 import { AircraftComponent } from './aircraft/aircraft.component';
 import { TerminalAreaComponent } from './terminal-area/terminal-area.component';
 import { AirlineComponent } from './airline/airline.component';
-import { FormsModule } from '@angular/forms';
+
 @NgModule({
     imports: [
         CommonModule,
         BasicDataRouting,
-        FormsModule
+        FormsModule,
+        BasicDataPipesModule
     ],
     declarations: [
         BasicDataComponent,

src/app/pages/basic-data/carousel/carousel.component.html

@@ -5,10 +5,7 @@
                 <div class="line-operator-left input-container mb-3 col-xlg-8 col-mlg-8 col-xl-8 col-lg-10">
                     <select class="mr-4 form-control" [(ngModel)]="SEL_COL" name="" id="">
                         <option value="">选择列名</option>
-                            <option value="carouselCode">行李转盘代码</option>
+                        <option *ngFor="let col of col_lists" [value]="col.col_code">{{col.col_chn}}</option>
-                            <option value="carouselName">行李转盘名称</option>
-                            <option value="terminalAreaName">航站楼区域</option>
-                            <option value="carouselStatus">资源状态</option>
                     </select>
                     <label class="radio-inline custom-radio nowrap mr-4">
                         <input type="radio" [(ngModel)]="FLT_POS" [value]="1" name="filter-position">
@@ -18,31 +15,24 @@
                         <input type="radio" [(ngModel)]="FLT_POS" [value]="2" name="filter-position">
                         <span>查找定位</span>
                     </label>
-                    <input class="form-control" [(ngModel)]="SEARCH" type="text" (keyup.enter) = "inputEnter()" id="inputerInfo">
+                    <input class="form-control" [(ngModel)]="SEARCH" type="text" (keyup.enter)="inputEnter()" id="inputerInfo">
-              </div>
-              <div class="line-operator-right mb-3 col-xlg-4 col-mlg-4 col-xl-4 col-lg-1">
-                  <!-- <button type="button" class="btn btn-info mr-3">行李转盘编辑</button>
-                  <button type="button" class="btn btn-info mr-3">打印</button> -->
-                  <!-- <button type="button" class="btn btn-info mr-3">刷新</button> -->
                 </div>
             </div>
 
             <div class="second-condition mb-3 row">
                 <div class="input-container mr-4">
                     <label for="terminalAreaCode">所属航站楼区域：&nbsp;&nbsp;</label>
-              <select  class="form-control" [(ngModel)]="filterItems.terminalAreaCode" (ngModelChange)="selectChange()" id="qy">
+                    <select class="form-control" [(ngModel)]="filterItems.terminalAreaCode" (ngModelChange)="selectChange()"
+                        id="qy">
                         <option value=""></option>
-                   <option *ngFor="let item of terminalAreas" [value]="item.terminalAreaCode" >{{item.terminalAreaName}}</option>
+                        <option *ngFor="let item of terminalAreas" [value]="item.terminalAreaCode">{{item.terminalAreaName}}</option>
-                   <!-- <option value="GH">国内区域</option>
-                   <option value="CH">国际区域</option>
-                   <option value="QT">其他区域</option> -->
                     </select>
                 </div>
                 <div class="input-container mr-4">
                     <label for="carouselStatus">资源状态：&nbsp;&nbsp;</label>
-              <select  class="form-control" [(ngModel)]="filterItems.carouselStatus" (ngModelChange)="selectChange()" id="zy">
+                    <select class="form-control" [(ngModel)]="filterItems.carouselStatus" (ngModelChange)="selectChange()"
+                        id="zy">
                         <option value=""></option>
-                   <!-- <option *ngFor="let item of carousels" [value]="item.carouselStatus" >{{item.carouselStatus}}</option> -->
                         <option value="0">可用</option>
                         <option value="1">在用</option>
                         <option value="2">锁定</option>
@@ -63,18 +53,15 @@
                             <th>行李转盘名称</th>
                             <th>航站楼区域</th>
                             <th>资源状态</th>
-                         <!--  <th *ngFor="let airline_col of carousel_lists">{{airline_col.COL_CN}}</th> -->
                         </tr>
                     </thead>
                     <tbody>
-                      <tr *ngFor="let carousel of render_data;let i = index" (click)="selectRow(carousel)"
+                        <tr *ngFor="let carousel of render_data;let i = index" (click)="selectRow(carousel)" [ngClass]="{'selected':row_state===carousel}">
-                          [ngClass]="{'selected':row_state===carousel}">
                             <td>{{i+1}}</td>
                             <td>{{carousel.carouselCode}}</td>
                             <td>{{carousel.carouselName}}</td>
                             <td>{{carousel.terminalAreaName}}</td>
                             <td>{{carousel.carouselStatus}}</td>
-                          <!-- <td *ngFor="let airline_col of carousel_lists" [ngStyle]="{'background-color':getColor(airline_col.COL_CODE)}">{{airline_row['renderFlight'][airline_col.COL_CODE]}}</td> -->
                         </tr>
                     </tbody>
                 </table>

src/app/pages/basic-data/carousel/carousel.component.scss

@@ -44,6 +44,7 @@
                     }
                     th{
                         background-color: #ddd;
+                        color: rgb(0, 0, 255);
                     }
                     th,td{
                         // border: none;

src/app/pages/basic-data/carousel/carousel.component.ts

@@ -1,7 +1,6 @@
 import { Component, OnInit } from '@angular/core';
-import { HttpClientService } from '../../../services/http-client.service';
 import { BasicDataService } from '../../basic-data-service'
-import { HttpParams } from '@angular/common/http';
+import { ChangeDetectorRef } from '@angular/core';
 import * as $ from 'jquery';
 
 @Component({
@@ -12,123 +11,101 @@ import * as $ from 'jquery';
 export class CarouselComponent implements OnInit {
 
     constructor(
-    private httpCilent: HttpClientService,
+        private basicDataService: BasicDataService,
-    private basicDataService: BasicDataService
+        private changeDetectorRef: ChangeDetectorRef
-) { }
+    ) { }
 
-// 搜索条件
+    public col_lists = [
-SEARCH = '';    //手动输入条件
+        { col_code: 'carouselCode', col_chn: '行李转盘代码' },
-FLT_POS = 1;    //过滤还是定位
+        { col_code: 'carouselName', col_chn: '行李转盘名称' },
-SEL_COL = '';   //选择列名
+        { col_code: 'terminalAreaName', col_chn: '航站楼区域' },
-//下拉框
+        { col_code: 'carouselStatus', col_chn: '资源状态' },
-public filterItems = {
+    ]
-    terminalAreaCode:'',
+
-    carouselStatus:'',
+    // 搜索条件
-}
+    SEARCH = '';    //手动输入条件
-terminalAreas:Array<any>; //所属航站楼区域
+    FLT_POS = 1;    //过滤还是定位
-carousels:Array<any>;
+    SEL_COL = '';   //选择列名
-public row_state: any = { renderFlight: {} };
+
-public render_data: Array<object> = [];  //显示数据，即需要显示的数据
+    //下拉框
-public return_data: Array<object> = []; //下拉框显示数据
+    public filterItems = {
-ngOnInit() {
+        terminalAreaCode: '',
-    this.carousels = this.basicDataService.carousel;
+        carouselStatus: '',
-    this.basicDataService.carousel_subject.subscribe(
-        data=>{
-            this.carousels = data;
-            this.render_data = this.carousels;
-            if(this.terminalAreas && this.terminalAreas.length > 0){//所属航站楼区域数据显示处理
-                this.terminalAreasHandle();
     }
-            this.render_data.forEach(element => {//资源状态列表显示数据转换
+    terminalAreas: Array<any>; //所属航站楼区域
-                if (element['carouselStatus'] == '0') {
+    carousels: Array<any>;
-                    element['carouselStatus'] = '可用'
+
-                    return element['carouselStatus'];
+    public row_state: any = { renderFlight: {} };
-                }
+    public render_data: Array<object> = [];  //显示数据，即需要显示的数据
-                if(element['carouselStatus'] == '1'){
+
-                    element['carouselStatus'] = '在用'
+    ngOnInit() {
-                    return element['carouselStatus'];
-                }
-                if(element['carouselStatus'] == '2'){
-                    element['carouselStatus'] = '锁定'
-                    return element['carouselStatus'];
-                }
-                if(element['carouselStatus'] == '3'){
-                    element['carouselStatus'] = '禁用'
-                    return element['carouselStatus'];
-                }
-                if(element['carouselStatus'] == '4'){
-                    element['carouselStatus'] = '预分'
-                    return element['carouselStatus'];
-                }
-            });
-        }
-    )
-    //所属航站楼区域
         this.terminalAreas = this.basicDataService.terminal_area;
+        this.carousels = this.basicDataService.carousel;
+        this.render_data = this.basicDataService.carousel;
+        this.basicDataService.carousel_subject.subscribe(
+            data => {
+                this.carousels = data;
+                this.render_data = data;
+            }
+        );
         this.basicDataService.terminal_area_subject.subscribe(
-        data=>{
+            data => {
                 this.terminalAreas = data;
+                //航站楼区域数据转换处理
+                if(this.terminalAreas && this.terminalAreas.length > 0){
+                    this.basicDataTransHandle();
+                }
+            }
+        );
+        //航站楼区域数据转换处理
+        if(this.render_data){
+            this.basicDataTransHandle();
         }
-    )
         /**
          * 固定表头
          */
         var tableCont = document.querySelector('#table-container');
-    function scrollHandle (){
+        function scrollHandle() {
             var scrollTop = this.scrollTop;
             this.querySelector('thead').style.transform = 'translateY(' + scrollTop + 'px)';
         }
-    tableCont.addEventListener('scroll',scrollHandle);
+        tableCont.addEventListener('scroll', scrollHandle);
-}
+    }
 
-//所属航站楼区域数据转换处理
+    //航站楼区域数据转换处理
-terminalAreasHandle() {
+    basicDataTransHandle() {
         this.render_data.forEach(item => {
             let terminalAreasLinkIndex = this.terminalAreas.findIndex(val => val.terminalAreaCode === item['terminalAreaCode']);
+            if(this.terminalAreas[terminalAreasLinkIndex]){
                 item['terminalAreaName'] = this.terminalAreas[terminalAreasLinkIndex].terminalAreaName;
+            }
         })
-}
+    }
 
-/**
+    /**
      * 选中某行
      * @param i 
      */
-selectRow(i) {
+    selectRow(i) {
         this.row_state = i;
-}
+    }
 
-//输入框回车事件
+    //输入框回车事件
-inputEnter() {
+    inputEnter() {
         if (this.FLT_POS === 1) {
-        this.inputFilter(this.carousels)
+            this.selectChange()
         } else {
-        this.inputFilter(this.carousels)
+            this.inputPosition(this.render_data)
-        this.inputPosition(this.carousels)
+        }
     }
-}
 
-//下拉框选择筛选
+    //下拉框选择筛选
-selectChange() {
+    selectChange() {
-    this.return_data = this.carousels.filter(item=>{
+        this.render_data = this.carousels.filter(item => {
             let is_satis = true;
-            if (item['carouselStatus'] == '可用') {
-                item['carouselStatus'] = '0'
-            }
-            if(item['carouselStatus'] == '在用'){
-                item['carouselStatus'] = '1'
-            }
-            if(item['carouselStatus'] == '锁定'){
-                item['carouselStatus'] = '2'
-            }
-            if(item['carouselStatus'] == '禁用'){
-                item['carouselStatus'] = '3'
-            }
-            if(item['carouselStatus'] == '预分'){
-                item['carouselStatus'] = '4'
-            }
             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]) {
+                    if (item[key] == this.filterItems[key]) {
                         is_satis = true;
                         continue;
                     } else {
@@ -139,57 +116,35 @@ selectChange() {
             }
             return is_satis;
         })
-    this.return_data.forEach(element => {//资源状态列表显示数据转换
+        if (this.FLT_POS === 1) {
-        if (element['carouselStatus'] == '0') {
+            this.inputFilter(this.render_data);
-            element['carouselStatus'] = '可用'
+        } else {
-            return element['carouselStatus'];
+            this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
         }
-        if(element['carouselStatus'] == '1'){
-            element['carouselStatus'] = '在用'
-            return element['carouselStatus'];
-        }
-        if(element['carouselStatus'] == '2'){
-            element['carouselStatus'] = '锁定'
-            return element['carouselStatus'];
-        }
-        if(element['carouselStatus'] == '3'){
-            element['carouselStatus'] = '禁用'
-            return element['carouselStatus'];
-        }
-        if(element['carouselStatus'] == '4'){
-            element['carouselStatus'] = '预分'
-            return element['carouselStatus'];
-        }
-    });
-    this.render_data = this.return_data;
-}
 
-//输入框筛选
+    }
-inputFilter(filterData) {
+
+    //输入框筛选
+    inputFilter(filterData) {
         if (this.SEARCH) {
             if (this.SEL_COL) {
                 let sel_col = this.SEL_COL;
-            filterData = filterData.filter(item => {
+                this.render_data = 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 => {
+                this.render_data = filterData.filter(item => {
                     let is_satis = false;
-                for (const key in item) {
+                    let cols = this.col_lists;
-                    if (item.hasOwnProperty(key)) {
+                    for (let i = 0; i < cols.length; i++) {
-                        if (item[key]) {
+                        if (item[cols[i].col_code]) {
-                            if (item[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                            if (item[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                                 is_satis = true;
                                 break;
                             } else {
@@ -197,30 +152,22 @@ inputFilter(filterData) {
                                 continue;
                             }
                         } else {
-                            if (this.SEARCH) {
                             is_satis = false;
                             continue;
-                            } else {
-                                is_satis = true;
-                                break;
-                            }
-                        }
-                    } else {
-                        continue;
                         }
                     }
                     return is_satis;
                 })
             }
-    }
+        } else {
             this.render_data = filterData;
-    this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
-}
+    }
 
-positionArray: Array<any> = [];
+    positionArray: Array<any> = [];
-positionArrayIndex: number = 0;
+    positionArrayIndex: number = 0;
-//输入框定位
+    //输入框定位
-inputPosition(filterData) {
+    inputPosition(filterData) {
         let transArray = []
         if (this.SEL_COL) {
             let sel_col = this.SEL_COL;
@@ -237,10 +184,10 @@ inputPosition(filterData) {
             });
         } else {
             filterData.forEach(element => {
-            for (const key in element) {
+                let cols = this.col_lists;
-                if (element.hasOwnProperty(key)) {
+                for (let i = 0; i < cols.length; i++) {
-                    if (element[key]) {
+                    if (element[cols[i].col_code]) {
-                        if (element[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                        if (element[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                             transArray.push(element)
                             break;
                         } else {
@@ -254,14 +201,9 @@ inputPosition(filterData) {
                             break;
                         }
                     }
-
-                } else {
-                    continue;
-                }
                 }
             });
         }
-
         if (transArray.length > 0) {
             if (transArray.toString() == this.positionArray.toString()) {
                 this.positionArrayIndex++;
@@ -277,8 +219,12 @@ inputPosition(filterData) {
         } else {
             alert('没有搜索到相关数据');
         }
+        this.changeDetectorRef.detectChanges();
         let tr = $(".selected");
         let objTr = tr[0];
+        if (objTr) {
             $("#table-container").animate({ scrollTop: objTr.offsetTop - 42 }, "slow");
         }
+
+    }
 }

src/app/pages/basic-data/checkin-desk/checkin-desk.component.html

@@ -5,11 +5,7 @@
               <div class="line-operator-left input-container mb-3 col-xlg-8 col-mlg-8 col-xl-8 col-lg-10">
                     <select class="mr-4 form-control" [(ngModel)]="SEL_COL" name="" id="">
                             <option value="">选择列名</option>
-                            <option value="checkindeskCode">值机柜台代码</option>
+                            <option *ngFor="let col of col_lists" [value]="col.col_code">{{col.col_chn}}</option>
-                            <option value="checkindeskName">值机柜台名称</option>
-                            <option value="checkinGroupName">值机岛</option>
-                            <option value="chutName">行李传送带</option>
-                            <option value="terminalAreaName">航站楼区域</option>
                     </select>
                     <label class="radio-inline custom-radio nowrap mr-4">
                             <input type="radio" [(ngModel)]="FLT_POS" [value]="1" name="filter-position">
@@ -21,11 +17,6 @@
                     </label>
                     <input class="form-control" [(ngModel)]="SEARCH" type="text" (keyup.enter) = "inputEnter()" id="inputerInfo">
               </div>
-              <div class="line-operator-right mb-3 col-xlg-4 col-mlg-4 col-xl-4 col-lg-1">
-                  <!-- <button type="button" class="btn btn-info mr-3">值机柜台编辑</button>
-                  <button type="button" class="btn btn-info mr-3">打印</button> -->
-                  <!-- <button type="button" class="btn btn-info mr-3">刷新</button> -->
-              </div>
           </div>
 
           <div class="second-condition mb-3 row">
@@ -34,9 +25,6 @@
               <select  class="form-control" [(ngModel)]="filterItems.terminalAreaCode" (ngModelChange)="selectChange()" id="qy">
                   <option value=""></option>
                   <option *ngFor="let items of terminalAreas" [value]="items.terminalAreaCode">{{items.terminalAreaName}}</option>
-                  <!-- <option value="GH">国内区域</option>
-                  <option value="CH">国外区域</option>
-                  <option value="QH">其他区域</option> -->
               </select>
           </div>
           <div class="input-container mr-4">
@@ -44,9 +32,6 @@
               <select  class="form-control" [(ngModel)]="filterItems.checkinGroupCode" (ngModelChange)="selectChange()" id="zjd">
                   <option value=""></option>
                   <option *ngFor="let items of checkinGroups" [value]="items.checkinGroupCode">{{items.checkinGroupName}}</option>
-                  <!-- <option value="A">A岛</option>
-                  <option value="B">B岛</option>
-                  <option value="C">C岛</option> -->
               </select>
           </div>
           <div class="input-container mr-4">
@@ -54,9 +39,6 @@
             <select  class="form-control" [(ngModel)]="filterItems.chutCode" (ngModelChange)="selectChange()" id="xl">
                 <option value=""></option>
                 <option *ngFor="let items of chuts" [value]="items.chutCode">{{items.chutName}}</option>
-                <!-- <option value="X">X行李</option>
-                <option value="Z">Z行李</option>
-                <option value="Y">Y行李</option> -->
             </select>
         </div>
         </div>
@@ -73,7 +55,6 @@
                           <th>值机岛</th>
                           <th>行李传送带</th>
                           <th>航站楼区域</th>
-                          <!-- <th *ngFor="let airline_col of checkindesk_lists">{{airline_col.COL_CN}}</th> -->
                       </tr>
                   </thead>
                   <tbody>
@@ -85,7 +66,6 @@
                           <td>{{checkinDesk.checkinGroupName}}</td>
                           <td>{{checkinDesk.chutName}}</td>
                           <td>{{checkinDesk.terminalAreaName}}</td>
-                          <!-- <td *ngFor="let airline_col of checkindesk_lists" [ngStyle]="{'background-color':getColor(airline_col.COL_CODE)}">{{airline_row['renderFlight'][airline_col.COL_CODE]}}</td> -->
                       </tr>
                   </tbody>
               </table>

src/app/pages/basic-data/checkin-desk/checkin-desk.component.scss

@@ -44,6 +44,7 @@
                     }
                     th{
                         background-color: #ddd;
+                        color: rgb(0, 0, 255);
                     }
                     th,td{
                         // border: none;

src/app/pages/basic-data/checkin-desk/checkin-desk.component.ts

@@ -1,7 +1,6 @@
 import { Component, OnInit } from '@angular/core';
-import { HttpClientService } from '../../../services/http-client.service';
+import { BasicDataService } from '../../basic-data-service';
-import { BasicDataService } from '../../basic-data-service'
+import { ChangeDetectorRef } from '@angular/core';
-import { HttpParams } from '@angular/common/http';
 import * as $ from 'jquery';
 @Component({
     selector: 'app-checkin-desk',
@@ -11,133 +10,149 @@ import * as $ from 'jquery';
 export class CheckinDeskComponent implements OnInit {
 
     constructor(
-    private httpCilent: HttpClientService,
+        private basicDataService: BasicDataService,
-    private basicDataService: BasicDataService
+        private changeDetectorRef: ChangeDetectorRef
-) { }
+    ) { }
 
-// 搜索条件
+    public col_lists = [
-SEARCH = '';    //手动输入条件
+        { col_code: 'checkindeskCode', col_chn: '值机柜台代码' },
-FLT_POS = 1;    //过滤还是定位
+        { col_code: 'checkindeskName', col_chn: '值机柜台名称' },
-SEL_COL = '';   //选择列名
+        { col_code: 'checkinGroupName', col_chn: '值机岛' },
+        { col_code: 'chutName', col_chn: '行李传送带' },
+        { col_code: 'terminalAreaName', col_chn: '航站楼区域' },
+    ]
 
-//下拉框
+    // 搜索条件
-public filterItems = {
+    SEARCH = '';    //手动输入条件
-    terminalAreaCode:'',
+    FLT_POS = 1;    //过滤还是定位
-    checkinGroupCode:'',
+    SEL_COL = '';   //选择列名
-    chutCode:'',
-}
 
-checkinGroups : Array<any>; //值机岛
+    //下拉框
-terminalAreas : Array<any>; //所属航站楼区域
+    public filterItems = {
-chuts : Array<any>; //行李传送带
+        terminalAreaCode: '',
-checkinDesks : Array<any>;
+        checkinGroupCode: '',
-public row_state: any = { renderFlight: {} };
+        chutCode: '',
-public render_data: Array<object> = [];  //显示数据，即需要显示的数据
+    }
-public return_data: Array<object> = []; //下拉框显示数据
+
-ngOnInit() {
+    checkinGroups: Array<any>; //值机岛
+    terminalAreas: Array<any>; //所属航站楼区域
+    chuts: Array<any>; //行李传送带
+    checkinDesks: Array<any>;
+    public row_state: any = { renderFlight: {} };
+    public render_data: Array<object> = [];  //显示数据，即需要显示的数据
+
+    ngOnInit() {
+        this.terminalAreas = this.basicDataService.terminal_area;
+        this.checkinGroups = this.basicDataService.checkin_group;
+        this.chuts = this.basicDataService.chut;
         this.checkinDesks = this.basicDataService.checkin_desk;
+        this.render_data = this.basicDataService.checkin_desk;
+
         this.basicDataService.checkin_desk_subject.subscribe(
-        data=>{
+            data => {
                 this.checkinDesks = data;
-            this.render_data = this.checkinDesks;
+                this.render_data = data;
-            if(this.terminalAreas && this.terminalAreas.length>0){//所属航站楼区域数据转换处理
+                if(this.checkinGroups && this.checkinGroups.length > 0){//值机岛列表数据转换
-                this.terminalAreasHandle();
+                    this.basicDataTransHandle();
                 }
-            if(this.checkinGroups && this.checkinGroups.length>0){//值机岛数据转换处理
+                if(this.chuts && this.chuts.length > 0){//行李传送带列表数据转换
-                this.checkinGroupsHandle();
-            }
-            if(this.checkinGroups && this.checkinGroups.length>0){//行李传送带数据转换处理
                     this.chutsHandle();
                 }
             }
         )
-    //所属航站楼区域
-    this.terminalAreas = this.basicDataService.terminal_area;
         this.basicDataService.terminal_area_subject.subscribe(
-        data=>{
+            data => {
                 this.terminalAreas = data;
+                //航站楼区域数据转换处理
+                if(this.terminalAreas && this.terminalAreas.length > 0){
+                    this.terminalAreasHandle();
+                }
             }
         )
-    //值机岛
-    this.checkinGroups = this.basicDataService.checkin_group;
         this.basicDataService.checkin_group_subject.subscribe(
-        data=>{
+            data => {
                 this.checkinGroups = data;
             }
         )
-    //行李传送带
-    this.chuts = this.basicDataService.chut;
         this.basicDataService.chut_subject.subscribe(
-        data=>{
+            data => {
                 this.chuts = data;
             }
         )
+        if(this.render_data){
+            //值机岛列表数据转换
+            this.basicDataTransHandle();
+            //行李传送带数据转换处理
+            this.chutsHandle();
+            //航站楼区域数据转换处理
+            this.terminalAreasHandle();
+        }
+        
         /**
          * 固定表头
          */
         var tableCont = document.querySelector('#table-container');
-    function scrollHandle (){
+        function scrollHandle() {
             var scrollTop = this.scrollTop;
             this.querySelector('thead').style.transform = 'translateY(' + scrollTop + 'px)';
         }
-    tableCont.addEventListener('scroll',scrollHandle);
+        tableCont.addEventListener('scroll', scrollHandle);
-}
+    }
 
-//所属航站楼区域数据转换处理
+    //值机岛数据转换处理
-terminalAreasHandle() {
+    basicDataTransHandle() {
-    this.render_data.forEach(item => {
-        let terminalAreasLinkIndex = this.terminalAreas.findIndex(val => val.terminalAreaCode === item['terminalAreaCode']);
-        item['terminalAreaName'] = this.terminalAreas[terminalAreasLinkIndex].terminalAreaName;
-    })
-}
-
-//值机岛数据转换处理
-checkinGroupsHandle() {
         this.render_data.forEach(item => {
             let checkinGroupsLinkIndex = this.checkinGroups.findIndex(val => val.checkinGroupCode === item['checkinGroupCode']);
-        let checkinGroups = this.checkinGroups[checkinGroupsLinkIndex].checkinGroupName
+            if(this.checkinGroups[checkinGroupsLinkIndex]){
-        if(checkinGroups !=null){
+                item['checkinGroupName'] = this.checkinGroups[checkinGroupsLinkIndex].checkinGroupName;
-            item['checkinGroupName'] = checkinGroups;
             }
         })
-}
+    }
 
-//行李传送带数据转换处理
+    //行李传送带数据转换处理
-chutsHandle() {
+    chutsHandle() {
         this.render_data.forEach(item => {
             let chutsLinkIndex = this.chuts.findIndex(val => val.chutCode === item['chutCode']);
-        let chuts = this.chuts[chutsLinkIndex].chutName
+            if(this.chuts[chutsLinkIndex]){
-        if(chuts !=null && chuts !=""){
+                item['chutName'] = this.chuts[chutsLinkIndex].chutName;
-            item['chutName'] = chuts;
             }
         })
-}
+    }
 
-/**
+    //航站楼区域数据转换处理
+    terminalAreasHandle() {
+        this.render_data.forEach(item => {
+            let terminalAreasLinkIndex = this.terminalAreas.findIndex(val => val.terminalAreaCode === item['terminalAreaCode']);
+            if(this.terminalAreas[terminalAreasLinkIndex]){
+                item['terminalAreaName'] = this.terminalAreas[terminalAreasLinkIndex].terminalAreaName;
+            }
+        })
+    }
+
+    /**
      * 选中某行
      * @param i 
      */
-selectRow(i) {
+    selectRow(i) {
         this.row_state = i;
-}
-
-//输入框回车事件
-inputEnter() {
-    if (this.FLT_POS === 1) {
-        this.inputFilter(this.checkinDesks)
-    } else {
-        this.inputFilter(this.checkinDesks)
-        this.inputPosition(this.checkinDesks)
     }
-}
 
-//下拉框选择筛选
+    //输入框回车事件
-selectChange() {
+    inputEnter() {
-    this.return_data = this.checkinDesks.filter(item=>{
+        if (this.FLT_POS === 1) {
+            this.selectChange()
+        } else {
+            this.inputPosition(this.render_data)
+        }
+    }
+
+    //下拉框选择筛选
+    selectChange() {
+        this.render_data = this.checkinDesks.filter(item => {
             let is_satis = true;
             for (const key in this.filterItems) {
                 if (this.filterItems.hasOwnProperty(key) && this.filterItems[key]) {
-                    if (item[key] === this.filterItems[key]) {
+                    if (item[key] == this.filterItems[key]) {
                         is_satis = true;
                         continue;
                     } else {
@@ -148,35 +163,35 @@ selectChange() {
             }
             return is_satis;
         })
-    this.render_data = this.return_data;
+        if (this.FLT_POS === 1) {
-}
+            this.inputFilter(this.render_data);
+        } else {
+            this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
+    }
 
-//输入框筛选
+    //输入框筛选
-inputFilter(filterData) {
+    inputFilter(filterData) {
         if (this.SEARCH) {
             if (this.SEL_COL) {
                 let sel_col = this.SEL_COL;
-            filterData = filterData.filter(item => {
+                this.render_data = 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 => {
+                this.render_data = filterData.filter(item => {
                     let is_satis = false;
-                for (const key in item) {
+                    let cols = this.col_lists;
-                    if (item.hasOwnProperty(key)) {
+                    for (let i = 0; i < cols.length; i++) {
-                        if (item[key]) {
+                        if (item[cols[i].col_code]) {
-                            if (item[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                            if (item[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                                 is_satis = true;
                                 break;
                             } else {
@@ -184,30 +199,22 @@ inputFilter(filterData) {
                                 continue;
                             }
                         } else {
-                            if (this.SEARCH) {
                             is_satis = false;
                             continue;
-                            } else {
-                                is_satis = true;
-                                break;
-                            }
-                        }
-                    } else {
-                        continue;
                         }
                     }
                     return is_satis;
                 })
             }
-    }
+        } else {
             this.render_data = filterData;
-    this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
-}
+    }
 
-positionArray: Array<any> = [];
+    positionArray: Array<any> = [];
-positionArrayIndex: number = 0;
+    positionArrayIndex: number = 0;
-//输入框定位
+    //输入框定位
-inputPosition(filterData) {
+    inputPosition(filterData) {
         let transArray = []
         if (this.SEL_COL) {
             let sel_col = this.SEL_COL;
@@ -224,10 +231,10 @@ inputPosition(filterData) {
             });
         } else {
             filterData.forEach(element => {
-            for (const key in element) {
+                let cols = this.col_lists;
-                if (element.hasOwnProperty(key)) {
+                for (let i = 0; i < cols.length; i++) {
-                    if (element[key]) {
+                    if (element[cols[i].col_code]) {
-                        if (element[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                        if (element[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                             transArray.push(element)
                             break;
                         } else {
@@ -241,10 +248,6 @@ inputPosition(filterData) {
                             break;
                         }
                     }
-
-                } else {
-                    continue;
-                }
                 }
             });
         }
@@ -264,8 +267,12 @@ inputPosition(filterData) {
         } else {
             alert('没有搜索到相关数据');
         }
+        this.changeDetectorRef.detectChanges();
         let tr = $(".selected");
         let objTr = tr[0];
+        if (objTr) {
             $("#table-container").animate({ scrollTop: objTr.offsetTop - 42 }, "slow");
         }
+
+    }
 }

src/app/pages/basic-data/checkin-group/checkin-group.component.html

@@ -5,8 +5,7 @@
               <div class="line-operator-left input-container mb-3 col-xlg-8 col-mlg-8 col-xl-8 col-lg-10">
                   <select class="mr-4 form-control" [(ngModel)]="SEL_COL" name="" id="">
                         <option value="">选择列名</option>
-                        <option value="checkinGroupCode">值机岛代码</option>
+                        <option *ngFor="let col of col_lists" [value]="col.col_code">{{col.col_chn}}</option>
-                        <option value="checkinGroupName">值机岛名称</option>
                   </select>
                   <label class="radio-inline custom-radio nowrap mr-4">
                         <input type="radio" [(ngModel)]="FLT_POS" [value]="1" name="filter-position">
@@ -18,11 +17,6 @@
                     </label>
                     <input class="form-control" [(ngModel)]="SEARCH" type="text" (keyup.enter) = "inputEnter()" id="inputerInfo">
               </div>
-              <div class="line-operator-right mb-3 col-xlg-4 col-mlg-4 col-xl-4 col-lg-1">
-                  <!-- <button type="button" class="btn btn-info mr-3">值机岛编辑</button>
-                  <button type="button" class="btn btn-info mr-3">打印</button> -->
-                 <!--  <button type="button" class="btn btn-info mr-3">刷新</button> -->
-              </div>
           </div>
       </div>
 
@@ -34,7 +28,6 @@
                           <th>序号</th>
                           <th>值机岛代码</th>
                           <th>值机岛名称</th>
-                          <!-- th *ngFor="let airline_col of col_lists">{{airline_col.COL_CN}}</th> -->
                       </tr>
                   </thead>
                   <tbody>
@@ -43,7 +36,6 @@
                           <td>{{i+1}}</td>
                           <td>{{checkinGroup.checkinGroupCode}}</td>
                           <td>{{checkinGroup.checkinGroupName}}</td>
-                          <!-- <td *ngFor="let airline_col of col_lists" [ngStyle]="{'background-color':getColor(airline_col.COL_CODE)}">{{airline_row['renderFlight'][airline_col.COL_CODE]}}</td> -->
                       </tr>
                   </tbody>
               </table>

src/app/pages/basic-data/checkin-group/checkin-group.component.scss

@@ -9,16 +9,6 @@
         padding: 10px 20px;
         .search-filter {
             padding: 0 15px;
-            .first-condition {
-                .line-operator-right {
-                    text-align: right;
-                    padding: 0;
-                    .btn-info {
-                        background-color: rgb(122, 156, 204);
-                        border-color: rgb(122, 156, 204);
-                    }
-                }
-            }
             .input-container {
                 padding: 0;
                 > .form-control {
@@ -44,6 +34,7 @@
                     }
                     th{
                         background-color: #ddd;
+                        color: rgb(0, 0, 255);
                     }
                     th,td{
                         // border: none;

src/app/pages/basic-data/checkin-group/checkin-group.component.ts

@@ -1,8 +1,8 @@
 import { Component, OnInit } from '@angular/core';
-import { HttpClientService } from '../../../services/http-client.service';
+import { BasicDataService } from '../../basic-data-service';
-import { HttpParams } from '@angular/common/http';
+import { ChangeDetectorRef } from '@angular/core';
 import * as $ from 'jquery';
-import { BasicDataService } from '../../basic-data-service'
+
 @Component({
     selector: 'app-checkin-group',
     templateUrl: './checkin-group.component.html',
@@ -11,107 +11,85 @@ import { BasicDataService } from '../../basic-data-service'
 export class CheckinGroupComponent implements OnInit {
 
     constructor(
-    private httpCilent: HttpClientService,
+        private basicDataService: BasicDataService,
-    private basicDataService: BasicDataService
+        private changeDetectorRef: ChangeDetectorRef
-) { }
+    ) { }
 
-// 搜索条件
+    public col_lists = [
-SEARCH = '';    //手动输入条件
+        { col_code: 'checkinGroupCode', col_chn: '值机岛代码' },
-FLT_POS = 1;    //过滤还是定位
+        { col_code: 'checkinGroupName', col_chn: '值机岛名称' }
-SEL_COL = '';   //选择列名
+    ]
 
-//下拉框
+    // 搜索条件
-public filterItems = {
+    SEARCH = '';    //手动输入条件
+    FLT_POS = 1;    //过滤还是定位
+    SEL_COL = '';   //选择列名
 
-}
+    checkinGroups: Array<any> = [];
+    public render_data: Array<object> = [];  //显示数据，即需要显示的数据
 
-checkinGroups : Array<any>;
+    public row_state: any = {};
-public row_state: any = { renderFlight: {} };
+
-public render_data: Array<object> = [];  //显示数据，即需要显示的数据
+    ngOnInit() {
-public return_data: Array<object> = []; //下拉框显示数据
-ngOnInit() {
         this.checkinGroups = this.basicDataService.checkin_group;
+        this.render_data = this.basicDataService.checkin_group;
         this.basicDataService.checkin_group_subject.subscribe(
-        data=>{
+            data => {
                 this.checkinGroups = data;
-            this.render_data = this.checkinGroups;
+                this.render_data = data;
             }
         )
         /**
          * 固定表头
          */
         var tableCont = document.querySelector('#table-container');
-    function scrollHandle (){
+        function scrollHandle() {
             var scrollTop = this.scrollTop;
             this.querySelector('thead').style.transform = 'translateY(' + scrollTop + 'px)';
         }
-    tableCont.addEventListener('scroll',scrollHandle);
+        tableCont.addEventListener('scroll', scrollHandle);
-}
+    }
 
-/**
+    /**
      * 选中某行
      * @param i 
      */
-selectRow(i) {
+    selectRow(i) {
         this.row_state = i;
-}
+    }
 
-//输入框回车事件
+    //输入框回车事件
-inputEnter() {
+    inputEnter() {
         if (this.FLT_POS === 1) {
             this.inputFilter(this.checkinGroups)
         } else {
-        this.inputFilter(this.checkinGroups)
+            this.inputPosition(this.render_data)
-        this.inputPosition(this.checkinGroups)
+        }
     }
-}
 
-//下拉框选择筛选
-selectChange() {
-    this.return_data = this.checkinGroups.filter(item=>{
-            let is_satis = true;
-            for (const key in this.filterItems) {
-                if (this.filterItems.hasOwnProperty(key) && this.filterItems[key]) {
-                    if (item[key] === this.filterItems[key]) {
-                        is_satis = true;
-                        continue;
-                    } else {
-                        is_satis = false;
-                        break;
-                    }
-                }
-            }
-            return is_satis;
-    })
-    this.render_data = this.return_data;
-}
 
-//输入框筛选
+    //输入框筛选
-inputFilter(filterData) {
+    inputFilter(filterData) {
         if (this.SEARCH) {
             if (this.SEL_COL) {
                 let sel_col = this.SEL_COL;
-            filterData = filterData.filter(item => {
+                this.render_data = 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 => {
+                this.render_data = filterData.filter(item => {
                     let is_satis = false;
-                for (const key in item) {
+                    let cols = this.col_lists;
-                    if (item.hasOwnProperty(key)) {
+                    for (let i = 0; i < cols.length; i++) {
-                        if (item[key]) {
+                        if (item[cols[i].col_code]) {
-                            if (item[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                            if (item[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                                 is_satis = true;
                                 break;
                             } else {
@@ -119,30 +97,22 @@ inputFilter(filterData) {
                                 continue;
                             }
                         } else {
-                            if (this.SEARCH) {
                             is_satis = false;
                             continue;
-                            } else {
-                                is_satis = true;
-                                break;
-                            }
-                        }
-                    } else {
-                        continue;
                         }
                     }
                     return is_satis;
                 })
             }
-    }
+        } else {
             this.render_data = filterData;
-    this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
-}
+    }
 
-positionArray: Array<any> = [];
+    positionArray: Array<any> = [];
-positionArrayIndex: number = 0;
+    positionArrayIndex: number = 0;
-//输入框定位
+    //输入框定位
-inputPosition(filterData) {
+    inputPosition(filterData) {
         let transArray = []
         if (this.SEL_COL) {
             let sel_col = this.SEL_COL;
@@ -159,10 +129,10 @@ inputPosition(filterData) {
             });
         } else {
             filterData.forEach(element => {
-            for (const key in element) {
+                let cols = this.col_lists;
-                if (element.hasOwnProperty(key)) {
+                for (let i = 0; i < cols.length; i++) {
-                    if (element[key]) {
+                    if (element[cols[i].col_code]) {
-                        if (element[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                        if (element[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                             transArray.push(element)
                             break;
                         } else {
@@ -176,10 +146,6 @@ inputPosition(filterData) {
                             break;
                         }
                     }
-
-                } else {
-                    continue;
-                }
                 }
             });
         }
@@ -199,8 +165,12 @@ inputPosition(filterData) {
         } else {
             alert('没有搜索到相关数据');
         }
+        this.changeDetectorRef.detectChanges();
         let tr = $(".selected");
         let objTr = tr[0];
+        if (objTr) {
             $("#table-container").animate({ scrollTop: objTr.offsetTop - 42 }, "slow");
         }
+
+    }
 }

src/app/pages/basic-data/chut/chut.component.html

@@ -5,8 +5,7 @@
               <div class="line-operator-left input-container mb-3 col-xlg-8 col-mlg-8 col-xl-8 col-lg-10">
                     <select class="mr-4 form-control" [(ngModel)]="SEL_COL" name="" id="">
                             <option value="">选择列名</option>
-                            <option value="chutCode">行李传送带代码</option>
+                            <option *ngFor="let col of col_lists" [value]="col.col_code">{{col.col_chn}}</option>
-                            <option value="chutName">行李传送带名称</option>
                     </select>
                     <label class="radio-inline custom-radio nowrap mr-4">
                             <input type="radio" [(ngModel)]="FLT_POS" [value]="1" name="filter-position">
@@ -18,11 +17,6 @@
                     </label>
                     <input class="form-control" [(ngModel)]="SEARCH" type="text" (keyup.enter) = "inputEnter()" id="inputerInfo">
               </div>
-              <div class="line-operator-right mb-3 col-xlg-4 col-mlg-4 col-xl-4 col-lg-1">
-                  <!-- <button type="button" class="btn btn-info mr-3">行李传送带编辑</button>
-                  <button type="button" class="btn btn-info mr-3">打印</button> -->
-                  <!-- <button type="button" class="btn btn-info mr-3">刷新</button> -->
-              </div>
           </div>
       </div>
 
@@ -34,7 +28,6 @@
                           <th>序号</th>
                           <th>行李传送带代码</th>
                           <th>行李传送带名称</th>
-                          <!-- <th *ngFor="let airline_col of chut_lists">{{airline_col.COL_CN}}</th> -->
                       </tr>
                   </thead>
                   <tbody>
@@ -43,7 +36,6 @@
                           <td>{{i+1}}</td>
                           <td>{{chut.chutCode}}</td>
                           <td>{{chut.chutName}}</td>
-                          <!-- <td *ngFor="let airline_col of chut_lists" [ngStyle]="{'background-color':getColor(airline_col.COL_CODE)}">{{airline_row['renderFlight'][airline_col.COL_CODE]}}</td> -->
                       </tr>
                   </tbody>
               </table>

src/app/pages/basic-data/chut/chut.component.scss

@@ -44,6 +44,7 @@
                     }
                     th{
                         background-color: #ddd;
+                        color: rgb(0, 0, 255);
                     }
                     th,td{
                         // border: none;

src/app/pages/basic-data/chut/chut.component.ts

@@ -1,8 +1,8 @@
 import { Component, OnInit } from '@angular/core';
-import { HttpClientService } from '../../../services/http-client.service';
 import { BasicDataService } from '../../basic-data-service'
-import { HttpParams } from '@angular/common/http';
+import { ChangeDetectorRef } from '@angular/core';
 import * as $ from 'jquery';
+
 @Component({
     selector: 'app-chut',
     templateUrl: './chut.component.html',
@@ -11,107 +11,83 @@ import * as $ from 'jquery';
 export class ChutComponent implements OnInit {
 
     constructor(
-    private httpCilent: HttpClientService,
+        private basicDataService: BasicDataService,
-    private basicDataService: BasicDataService
+        private changeDetectorRef: ChangeDetectorRef
-) { }
+    ) { }
 
-// 搜索条件
+    public col_lists = [
-SEARCH = '';    //手动输入条件
+        { col_code: 'chutCode', col_chn: '行李传送带代码' },
-FLT_POS = 1;    //过滤还是定位
+        { col_code: 'chutName', col_chn: '行李传送带名称' }
-SEL_COL = '';   //选择列名
+    ]
 
-//下拉框
+    // 搜索条件
-public filterItems = {
+    SEARCH = '';    //手动输入条件
+    FLT_POS = 1;    //过滤还是定位
+    SEL_COL = '';   //选择列名
 
-}
+    chuts: Array<any>;
+    public row_state: any = { renderFlight: {} };
+    public render_data: Array<object> = [];  //显示数据，即需要显示的数据
 
-chuts : Array<any>;
+    ngOnInit() {
-public row_state: any = { renderFlight: {} };
-public render_data: Array<object> = [];  //显示数据，即需要显示的数据
-public return_data: Array<object> = []; //下拉框显示数据
-ngOnInit() {
         this.chuts = this.basicDataService.chut;
+        this.render_data = this.basicDataService.chut;
         this.basicDataService.chut_subject.subscribe(
-        data=>{
+            data => {
                 this.chuts = data;
-            this.render_data = this.chuts;
+                this.render_data = data;
             }
         )
         /**
          * 固定表头
          */
         var tableCont = document.querySelector('#table-container');
-    function scrollHandle (){
+        function scrollHandle() {
             var scrollTop = this.scrollTop;
             this.querySelector('thead').style.transform = 'translateY(' + scrollTop + 'px)';
         }
-    tableCont.addEventListener('scroll',scrollHandle);
+        tableCont.addEventListener('scroll', scrollHandle);
-}
+    }
 
-/**
+    /**
      * 选中某行
      * @param i 
      */
-selectRow(i) {
+    selectRow(i) {
         this.row_state = i;
-}
+    }
 
-//输入框回车事件
+    //输入框回车事件
-inputEnter() {
+    inputEnter() {
         if (this.FLT_POS === 1) {
             this.inputFilter(this.chuts)
         } else {
-        this.inputFilter(this.chuts)
+            this.inputPosition(this.render_data)
-        this.inputPosition(this.chuts)
+        }
     }
-}
 
-//下拉框选择筛选
+    //输入框筛选
-selectChange() {
+    inputFilter(filterData) {
-    this.return_data = this.chuts.filter(item=>{
-            let is_satis = true;
-            for (const key in this.filterItems) {
-                if (this.filterItems.hasOwnProperty(key) && this.filterItems[key]) {
-                    if (item[key] === this.filterItems[key]) {
-                        is_satis = true;
-                        continue;
-                    } else {
-                        is_satis = false;
-                        break;
-                    }
-                }
-            }
-            return is_satis;
-    })
-    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 => {
+                this.render_data = 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 => {
+                this.render_data = filterData.filter(item => {
                     let is_satis = false;
-                for (const key in item) {
+                    let cols = this.col_lists;
-                    if (item.hasOwnProperty(key)) {
+                    for (let i = 0; i < cols.length; i++) {
-                        if (item[key]) {
+                        if (item[cols[i].col_code]) {
-                            if (item[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                            if (item[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                                 is_satis = true;
                                 break;
                             } else {
@@ -119,30 +95,22 @@ inputFilter(filterData) {
                                 continue;
                             }
                         } else {
-                            if (this.SEARCH) {
                             is_satis = false;
                             continue;
-                            } else {
-                                is_satis = true;
-                                break;
-                            }
-                        }
-                    } else {
-                        continue;
                         }
                     }
                     return is_satis;
                 })
             }
-    }
+        } else {
             this.render_data = filterData;
-    this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
-}
+    }
 
-positionArray: Array<any> = [];
+    positionArray: Array<any> = [];
-positionArrayIndex: number = 0;
+    positionArrayIndex: number = 0;
-//输入框定位
+    //输入框定位
-inputPosition(filterData) {
+    inputPosition(filterData) {
         let transArray = []
         if (this.SEL_COL) {
             let sel_col = this.SEL_COL;
@@ -159,10 +127,10 @@ inputPosition(filterData) {
             });
         } else {
             filterData.forEach(element => {
-            for (const key in element) {
+                let cols = this.col_lists;
-                if (element.hasOwnProperty(key)) {
+                for (let i = 0; i < cols.length; i++) {
-                    if (element[key]) {
+                    if (element[cols[i].col_code]) {
-                        if (element[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                        if (element[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                             transArray.push(element)
                             break;
                         } else {
@@ -176,10 +144,6 @@ inputPosition(filterData) {
                             break;
                         }
                     }
-
-                } else {
-                    continue;
-                }
                 }
             });
         }
@@ -199,8 +163,12 @@ inputPosition(filterData) {
         } else {
             alert('没有搜索到相关数据');
         }
+        this.changeDetectorRef.detectChanges();
         let tr = $(".selected");
         let objTr = tr[0];
+        if (objTr) {
             $("#table-container").animate({ scrollTop: objTr.offsetTop - 42 }, "slow");
         }
+
+    }
 }

src/app/pages/basic-data/city/city.component.html

@@ -5,10 +5,7 @@
                 <div class="line-operator-left input-container mb-3 col-xlg-8 col-mlg-8 col-xl-8 col-lg-10">
                     <select class="mr-4 form-control" [(ngModel)]="SEL_COL" name="" id="">
                         <option value="">选择列名</option>
-                            <option value="cityCode">城市代码</option>
+                        <option *ngFor="let col of col_lists" [value]="col.col_code">{{col.col_chn}}</option>
-                            <option value="cityNameChn">城市中文名</option>
-                            <option value="cityNameEng">城市英文名</option>
-                            <option value="countryId">所在国家</option>
                     </select>
                     <label class="radio-inline custom-radio nowrap mr-4">
                         <input type="radio" [(ngModel)]="FLT_POS" [value]="1" name="filter-position">
@@ -18,51 +15,23 @@
                         <input type="radio" [(ngModel)]="FLT_POS" [value]="2" name="filter-position">
                         <span>查找定位</span>
                     </label>
-                    <input class="form-control" [(ngModel)]="SEARCH" type="text" (keyup.enter) = "inputEnter()" id="inputerInfo">
+                    <input class="form-control" [(ngModel)]="SEARCH" type="text" (keyup.enter)="inputEnter()" id="inputerInfo">
-              </div>
-              <div class="line-operator-right mb-3 col-xlg-4 col-mlg-4 col-xl-4 col-lg-1">
-                <!-- <button type="button" class="btn btn-info mr-3">打印</button>
-                  <button type="button" class="btn btn-info mr-3">城市登记</button>
-                  <button type="button" class="btn btn-info mr-3">国家登记</button>
-                  <button type="button" class="btn btn-info mr-3">洲/地区登记</button> 
-                  <button type="button" class="btn btn-info mr-3">定制查询</button> -->
-                  <!-- <button type="button" class="btn btn-info mr-3">刷新</button> -->
                 </div>
             </div>
 
             <div class="second-condition mb-3 row">
-            <!-- <div class="input-container mr-4">
-              <label for="">洲/地区：&nbsp;&nbsp;</label>
-              <select  class="form-control">
-                  <option value=""></option>
-              </select>
-            </div> -->
                 <div class="input-container mr-4">
                     <label for="countryId">国家：&nbsp;&nbsp;</label>
                     <select class="form-control" [(ngModel)]="filterItems.countryId" (ngModelChange)="selectChange()" id="citry">
                         <option value=""></option>
-                  <option *ngFor="let item of citys" [value]="item.countryId">{{item.countryId}}</option>
+                        <option *ngFor="let item of countrys" [value]="item.countryId">{{item.countryNameChn}}</option>
-                  <!-- <option value="ZG">中国</option>
-                  <option value="MG">美国</option>
-                  <option value="YG">英国</option> -->
                     </select>
                 </div>
-          <div class="third-condition row">
-            <!-- <label class="radio-inline custom-checkbox nowrap checkInfo mr-4">
-                <input type="checkbox">
-                <span>洲/地区-国家关联</span>
-            </label> -->
-            <label class="radio-inline custom-checkbox nowrap checkInfo mr-4">
-                <input type="checkbox">
-                <span>国家-城市关联</span>
-            </label>
-          </div>
             </div>
         </div>
 
         <div class="airline-table">
             <div id="table-container" class="table-container">
-                <!-- <div id="divFieldset_title" class="divFieldseTitle">城市</div> -->
                 <table id="table" class="table table-bordered table-striped">
                     <thead>
                         <tr>
@@ -71,18 +40,15 @@
                             <th>城市中文名</th>
                             <th>城市英文名</th>
                             <th>所在国家</th>
-                           <!--  <th *ngFor="let airline_col of city_lists">{{airline_col.COL_CN}}</th> -->
                         </tr>
                     </thead>
                     <tbody>
-                        <tr *ngFor="let city of render_data;let i = index" (click)="selectRow(city)"
+                        <tr *ngFor="let city of render_data;let i = index" (click)="selectRow(city)" [ngClass]="{'selected':row_state===city}">
-                            [ngClass]="{'selected':row_state===city}">
                             <td>{{i+1}}</td>
                             <td>{{city.cityCode}}</td>
                             <td>{{city.cityNameChn}}</td>
                             <td>{{city.cityNameEng}}</td>
-                            <td>{{city.countryId}}</td>
+                            <td>{{city.countryNameChn}}</td>
-                            <!-- <td *ngFor="let airline_col of city_lists" [ngStyle]="{'background-color':getColor(airline_col.COL_CODE)}">{{airline_row['renderFlight'][airline_col.COL_CODE]}}</td> -->
                         </tr>
                     </tbody>
                 </table>

src/app/pages/basic-data/city/city.component.scss

@@ -44,6 +44,7 @@
                     }
                     th{
                         background-color: #ddd;
+                        color: rgb(0, 0, 255);
                     }
                     th,td{
                         // border: none;

src/app/pages/basic-data/city/city.component.ts

@@ -1,7 +1,6 @@
 import { Component, OnInit } from '@angular/core';
-import { HttpClientService } from '../../../services/http-client.service';
+import { ChangeDetectorRef } from '@angular/core';
-import { BasicDataService } from '../../basic-data-service'
+import { BasicDataService } from '../../basic-data-service';
-import { HttpParams } from '@angular/common/http';
 import * as $ from 'jquery';
 @Component({
     selector: 'app-city',
@@ -11,68 +10,98 @@ import * as $ from 'jquery';
 export class CityComponent implements OnInit {
 
     constructor(
-    private httpCilent: HttpClientService,
+        private basicDataService: BasicDataService,
-    private basicDataService: BasicDataService
+        private changeDetectorRef: ChangeDetectorRef
-) { }
+    ) { }
 
-// 搜索条件
+    public col_lists = [
-SEARCH = '';    //手动输入条件
+        { col_code: 'cityCode', col_chn: '城市代码' },
-FLT_POS = 1;    //过滤还是定位
+        { col_code: 'cityNameChn', col_chn: '城市中文名' },
-SEL_COL = '';   //选择列名
+        { col_code: 'cityNameEng', col_chn: '城市英文名' },
+        { col_code: 'countryNameChn', col_chn: '所在国家' },
+    ];
 
-//下拉框
+    // 搜索条件
-public filterItems = {
+    SEARCH = '';    //手动输入条件
-    countryId:'',
+    FLT_POS = 1;    //过滤还是定位
-}
+    SEL_COL = '';   //选择列名
 
-citys : Array<any>;
+    //下拉框
-public row_state: any = { renderFlight: {} };
+    public filterItems = {
-public render_data: Array<object> = [];  //显示数据，即需要显示的数据
+        countryId: '',
-public return_data: Array<object> = []; //下拉框显示数据
+    }
-ngOnInit() {
+
+    countrys: Array<any>; //国家
+    citys: Array<any>;
+    public row_state: any = { renderFlight: {} };
+    public render_data: Array<object> = [];  //显示数据，即需要显示的数据
+
+    ngOnInit() {
+        this.countrys = this.basicDataService.country;
         this.citys = this.basicDataService.city;
+        this.render_data = this.basicDataService.city;
         this.basicDataService.city_subject.subscribe(
-        data=>{
+            data => {
                 this.citys = data;
-            this.render_data = this.citys;
+                this.render_data = data;
             }
         )
+        this.basicDataService.country_subject.subscribe(
+            data => {
+                this.countrys = data
+                if(this.countrys && this.countrys.length > 0){//国家列表数据转换
+                    this.basicDataTransHandle();
+                }
+            }
+        )
+        if(this.render_data){
+            //国家列表数据转换
+            this.basicDataTransHandle();
+        }
         /**
          * 固定表头
          */
         var tableCont = document.querySelector('#table-container');
-    function scrollHandle (){
+        function scrollHandle() {
             var scrollTop = this.scrollTop;
             this.querySelector('thead').style.transform = 'translateY(' + scrollTop + 'px)';
         }
-    tableCont.addEventListener('scroll',scrollHandle);
+        tableCont.addEventListener('scroll', scrollHandle);
-}
+    }
 
-/**
+     //国家数据转换处理
+     basicDataTransHandle() {
+        this.render_data.forEach(item => {
+            let countryLinkIndex = this.countrys.findIndex(val => val.countryId === item['countryId']);
+            if(this.countrys[countryLinkIndex]){
+                item['countryNameChn'] = this.countrys[countryLinkIndex].countryNameChn;
+            }
+        })
+    }
+    /**
      * 选中某行
      * @param i 
      */
-selectRow(i) {
+    selectRow(i) {
         this.row_state = i;
-}
-
-//输入框回车事件
-inputEnter() {
-    if (this.FLT_POS === 1) {
-        this.inputFilter(this.citys)
-    } else {
-        this.inputFilter(this.citys)
-        this.inputPosition(this.citys)
     }
-}
 
-//下拉框选择筛选
+    //输入框回车事件
-selectChange() {
+    inputEnter() {
-    this.return_data = this.citys.filter(item=>{
+        if (this.FLT_POS === 1) {
+            this.selectChange()
+        } else {
+            this.inputPosition(this.render_data)
+        }
+    }
+
+    //下拉框选择筛选
+    selectChange() {
+        this.render_data = this.citys.filter(item => {
             let is_satis = true;
             for (const key in this.filterItems) {
                 if (this.filterItems.hasOwnProperty(key) && this.filterItems[key]) {
-                    if (item[key] === this.filterItems[key]) {
+                    if (item[key] == this.filterItems[key]) {
                         is_satis = true;
                         continue;
                     } else {
@@ -83,35 +112,35 @@ selectChange() {
             }
             return is_satis;
         })
-    this.render_data = this.return_data;
+        if (this.FLT_POS === 1) {
-}
+            this.inputFilter(this.render_data);
+        } else {
+            this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
+    }
 
-//输入框筛选
+    //输入框筛选
-inputFilter(filterData) {
+    inputFilter(filterData) {
         if (this.SEARCH) {
             if (this.SEL_COL) {
                 let sel_col = this.SEL_COL;
-            filterData = filterData.filter(item => {
+                this.render_data = 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 => {
+                this.render_data = filterData.filter(item => {
                     let is_satis = false;
-                for (const key in item) {
+                    let cols = this.col_lists;
-                    if (item.hasOwnProperty(key)) {
+                    for (let i = 0; i < cols.length; i++) {
-                        if (item[key]) {
+                        if (item[cols[i].col_code]) {
-                            if (item[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                            if (item[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                                 is_satis = true;
                                 break;
                             } else {
@@ -119,30 +148,22 @@ inputFilter(filterData) {
                                 continue;
                             }
                         } else {
-                            if (this.SEARCH) {
                             is_satis = false;
                             continue;
-                            } else {
-                                is_satis = true;
-                                break;
-                            }
-                        }
-                    } else {
-                        continue;
                         }
                     }
                     return is_satis;
                 })
             }
-    }
+        } else {
             this.render_data = filterData;
-    this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
-}
+    }
 
-positionArray: Array<any> = [];
+    positionArray: Array<any> = [];
-positionArrayIndex: number = 0;
+    positionArrayIndex: number = 0;
-//输入框定位
+    //输入框定位
-inputPosition(filterData) {
+    inputPosition(filterData) {
         let transArray = []
         if (this.SEL_COL) {
             let sel_col = this.SEL_COL;
@@ -159,10 +180,10 @@ inputPosition(filterData) {
             });
         } else {
             filterData.forEach(element => {
-            for (const key in element) {
+                let cols = this.col_lists;
-                if (element.hasOwnProperty(key)) {
+                for (let i = 0; i < cols.length; i++) {
-                    if (element[key]) {
+                    if (element[cols[i].col_code]) {
-                        if (element[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                        if (element[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                             transArray.push(element)
                             break;
                         } else {
@@ -176,10 +197,6 @@ inputPosition(filterData) {
                             break;
                         }
                     }
-
-                } else {
-                    continue;
-                }
                 }
             });
         }
@@ -199,8 +216,12 @@ inputPosition(filterData) {
         } else {
             alert('没有搜索到相关数据');
         }
+        this.changeDetectorRef.detectChanges();
         let tr = $(".selected");
         let objTr = tr[0];
+        if (objTr) {
             $("#table-container").animate({ scrollTop: objTr.offsetTop - 42 }, "slow");
         }
+
+    }
 }

src/app/pages/basic-data/gate/gate.component.html

@@ -5,11 +5,7 @@
                 <div class="line-operator-left input-container mb-3 col-xlg-8 col-mlg-8 col-xl-8 col-lg-10">
                     <select class="mr-4 form-control" [(ngModel)]="SEL_COL" name="" id="">
                         <option value="">选择列名</option>
-                        <option value="gateCode">登机门代码</option>
+                        <option *ngFor="let col of col_lists" [value]="col.col_code">{{col.col_chn}}</option>
-                        <option value="gateName">登机门名称</option>
-                        <option value="terminalAreaName">航站楼区域</option>
-                        <option value="gateStatus">资源状态</option>
-                        <!-- <option *ngFor="let items of gates" [value]="items.titleInfo">{{items.titleInfo}}</option> -->
                     </select>
                     <label class="radio-inline custom-radio nowrap mr-4">
                         <input type="radio" [(ngModel)]="FLT_POS" [value]="1" name="filter-position">
@@ -19,26 +15,23 @@
                         <input type="radio" [(ngModel)]="FLT_POS" [value]="2" name="filter-position">
                         <span>查找定位</span>
                     </label>
-                      <input class="form-control" [(ngModel)]="SEARCH" type="text" (keyup.enter) = "inputEnter()" id="inputerInfo">
+                    <input class="form-control" [(ngModel)]="SEARCH" type="text" (keyup.enter)="inputEnter()" id="inputerInfo">
-                </div>
-                <div class="line-operator-right mb-3 col-xlg-4 col-mlg-4 col-xl-4 col-lg-1">
-                    <!-- <button type="button" class="btn btn-info mr-3">登机门编辑</button>
-                    <button type="button" class="btn btn-info mr-3">打印</button> -->
-                    <!-- <button type="button" class="btn btn-info mr-3">刷新</button> -->
                 </div>
             </div>
 
             <div class="second-condition mb-3 row">
                 <div class="input-container mr-4">
                     <label for="terminalAreaCode">所属航站楼区域：&nbsp;&nbsp;</label>
-                <select  class="form-control" [(ngModel)]="filterItems.terminalAreaCode" (ngModelChange)="selectChange()" id="qy">
+                    <select class="form-control" [(ngModel)]="filterItems.terminalAreaCode" (ngModelChange)="selectChange()"
+                        id="qy">
                         <option value=""></option>
                         <option *ngFor="let items of terminalAreas" [value]="items.terminalAreaCode">{{items.terminalAreaName}}</option>
                     </select>
                 </div>
                 <div class="input-container mr-4">
                     <label for="gateStatus">资源状态：&nbsp;&nbsp;</label>
-                <select  class="form-control" [(ngModel)]="filterItems.gateStatus" (ngModelChange)="selectChange()" id="zy">
+                    <select class="form-control" [(ngModel)]="filterItems.gateStatus" (ngModelChange)="selectChange()"
+                        id="zy">
                         <option value=""></option>
                         <option value="0">可用</option>
                         <option value="1">在用</option>
@@ -61,22 +54,19 @@
                             <th>登机门名称</th>
                             <th>航站楼区域</th>
                             <th>资源状态</th>
-                            <!-- <th *ngFor="let airline_col of gate_lists">{{airline_col.COL_CN}}</th> -->
                         </tr>
                     </thead>
                     <tbody>
-                        <tr *ngFor="let gate of render_data;let i = index" (click)="selectRow(gate)"
+                        <tr *ngFor="let gate of render_data;let i = index" (click)="selectRow(gate)" [ngClass]="{'selected':row_state===gate}">
-                            [ngClass]="{'selected':row_state===gate}">
                             <td>{{i+1}}</td>
                             <td>{{gate.gateCode}}</td>
                             <td>{{gate.gateName}}</td>
                             <td>{{gate.terminalAreaName}}</td>
                             <td>{{gate.gateStatus}}</td>
-                            <!-- <td *ngFor="let airline_col of gate_lists" [ngStyle]="{'background-color':getColor(airline_col.COL_CODE)}">{{airline_row['renderFlight'][airline_col.COL_CODE]}}</td> -->
                         </tr>
                     </tbody>
                 </table>
             </div>
         </div>
     </div>
-  </div>
+</div>

src/app/pages/basic-data/gate/gate.component.scss

@@ -44,6 +44,7 @@
                     }
                     th{
                         background-color: #ddd;
+                        color: rgb(0, 0, 255);
                     }
                     th,td{
                         // border: none;

src/app/pages/basic-data/gate/gate.component.ts

@@ -1,7 +1,6 @@
 import { Component, OnInit } from '@angular/core';
-import { HttpClientService } from '../../../services/http-client.service';
 import { BasicDataService } from '../../basic-data-service'
-import { HttpParams } from '@angular/common/http';
+import { ChangeDetectorRef } from '@angular/core';
 import * as $ from 'jquery';
 @Component({
     selector: 'app-gate',
@@ -11,124 +10,101 @@ import * as $ from 'jquery';
 export class GateComponent implements OnInit {
 
     constructor(
-    private httpCilent: HttpClientService,
+        private basicDataService: BasicDataService,
-    private basicDataService: BasicDataService
+        private changeDetectorRef: ChangeDetectorRef
-) { }
+    ) { }
 
-// 搜索条件
+    public col_lists = [
-SEARCH = '';    //手动输入条件
+        { col_code: 'gateCode', col_chn: '登机门代码' },
-FLT_POS = 1;    //过滤还是定位
+        { col_code: 'gateName', col_chn: '登机门名称' },
-SEL_COL = '';   //选择列名
+        { col_code: 'terminalAreaName', col_chn: '航站楼区域' },
+        { col_code: 'gateStatus', col_chn: '资源状态' },
+    ]
 
-//下拉框
+    // 搜索条件
-public filterItems = {
+    SEARCH = '';    //手动输入条件
-    terminalAreaCode:'',
+    FLT_POS = 1;    //过滤还是定位
-    gateStatus:'',
+    SEL_COL = '';   //选择列名
-}
+
-terminalAreas : Array<any>; //所属航站楼区域
+    //下拉框
-gates : Array<any>;
+    public filterItems = {
-public row_state: any = { renderFlight: {} };
+        terminalAreaCode: '',
-public render_data: Array<object> = [];  //显示数据，即需要显示的数据
+        gateStatus: '',
-public return_data: Array<object> = []; //下拉框显示数据
-ngOnInit() {
-    this.gates = this.basicDataService.gate;
-    this.basicDataService.gate_subject.subscribe(
-        data=>{
-            this.gates = data;
-            this.render_data = this.gates;
-            if(this.terminalAreas && this.terminalAreas.length > 0){//所属航站楼区域数据显示处理
-                this.terminalAreasHandle();
     }
-            this.render_data.forEach(element => {//资源状态列表显示数据转换
+    terminalAreas: Array<any>; //所属航站楼区域
-                if (element['gateStatus'] == '0') {
+    gates: Array<any>;
-                    element['gateStatus'] = '可用'
+
-                    return element['gateStatus'];
+    public row_state: any = { renderFlight: {} };
-                }
+    public render_data: Array<object> = [];  //显示数据，即需要显示的数据
-                if(element['gateStatus'] == '1'){
+
-                    element['gateStatus'] = '在用'
+    ngOnInit() {
-                    return element['gateStatus'];
-                }
-                if(element['gateStatus'] == '2'){
-                    element['gateStatus'] = '锁定'
-                    return element['gateStatus'];
-                }
-                if(element['gateStatus'] == '3'){
-                    element['gateStatus'] = '禁用'
-                    return element['gateStatus'];
-                }
-                if(element['gateStatus'] == '4'){
-                    element['gateStatus'] = '预分'
-                    return element['gateStatus'];
-                }
-            });
-        }
-    )
-    //所属航站楼区域
         this.terminalAreas = this.basicDataService.terminal_area;
-    this.basicDataService.terminal_area_subject.subscribe(
+        this.gates = this.basicDataService.gate;
-        data=>{
+        this.render_data = this.basicDataService.gate;
-            this.terminalAreas = data;
+        this.basicDataService.gate_subject.subscribe(
+            data => {
+                this.gates = data;
+                this.render_data = data;
             }
         )
+        this.basicDataService.terminal_area_subject.subscribe(
+            data => {
+                this.terminalAreas = data;
+                //航站楼区域数据转换处理
+                if(this.terminalAreas && this.terminalAreas.length > 0){
+                    this.basicDataTransHandle();
+                }
+            }
+        )
+        //航站楼区域数据转换处理
+        if(this.render_data){
+            this.basicDataTransHandle();
+        }
         /**
          * 固定表头
          */
         var tableCont = document.querySelector('#table-container');
-    function scrollHandle (){
+        function scrollHandle() {
             var scrollTop = this.scrollTop;
             this.querySelector('thead').style.transform = 'translateY(' + scrollTop + 'px)';
         }
-    tableCont.addEventListener('scroll',scrollHandle);
+        tableCont.addEventListener('scroll', scrollHandle);
-}
+    }
 
-//所属航站楼区域数据转换处理
+    //航站楼区域数据转换处理
-terminalAreasHandle() {
+    basicDataTransHandle() {
         this.render_data.forEach(item => {
             let terminalAreasLinkIndex = this.terminalAreas.findIndex(val => val.terminalAreaCode === item['terminalAreaCode']);
+            if(this.terminalAreas[terminalAreasLinkIndex]){
                 item['terminalAreaName'] = this.terminalAreas[terminalAreasLinkIndex].terminalAreaName;
+            }
         })
-}
+    }
 
-/**
+    /**
      * 选中某行
      * @param i 
      */
-selectRow(i) {
+    selectRow(i) {
         this.row_state = i;
-}
+    }
 
-//输入框回车事件
+    //输入框回车事件
-inputEnter() {
+    inputEnter() {
         if (this.FLT_POS === 1) {
-        this.inputFilter(this.gates)
+            this.selectChange()
         } else {
-        this.inputFilter(this.gates)
+            this.inputPosition(this.render_data)
-        this.inputPosition(this.gates)
+        }
     }
-}
 
-//下拉框选择筛选
+    //下拉框选择筛选
-selectChange() {
+    selectChange() {
-    this.return_data = this.gates.filter(item=>{
+        this.render_data = this.gates.filter(item => {
             let is_satis = true;
-            if (item['gateStatus'] == '可用') {
-                item['gateStatus'] = '0'
-            }
-            if(item['gateStatus'] == '在用'){
-                item['gateStatus'] = '1'
-            }
-            if(item['gateStatus'] == '锁定'){
-                item['gateStatus'] = '2'
-            }
-            if(item['gateStatus'] == '禁用'){
-                item['gateStatus'] = '3'
-            }
-            if(item['gateStatus'] == '预分'){
-                item['gateStatus'] = '4'
-            }
             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]) {
+                    if (item[key] == this.filterItems[key]) {
                         is_satis = true;
                         continue;
                     } else {
@@ -139,57 +115,34 @@ selectChange() {
             }
             return is_satis;
         })
-    this.return_data.forEach(element => {//资源状态列表显示数据转换
+        if (this.FLT_POS === 1) {
-        if (element['gateStatus'] == '0') {
+            this.inputFilter(this.render_data);
-            element['gateStatus'] = '可用'
+        } else {
-            return element['gateStatus'];
+            this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
         }
-        if(element['gateStatus'] == '1'){
-            element['gateStatus'] = '在用'
-            return element['gateStatus'];
     }
-        if(element['gateStatus'] == '2'){
-            element['gateStatus'] = '锁定'
-            return element['gateStatus'];
-        }
-        if(element['gateStatus'] == '3'){
-            element['gateStatus'] = '禁用'
-            return element['gateStatus'];
-        }
-        if(element['gateStatus'] = '4'){
-            element['gateStatus'] = '预分'
-            return element['gateStatus'];
-        }
-    });
-    this.render_data = this.return_data;
-}
 
-//输入框筛选
+    //输入框筛选
-inputFilter(filterData) {
+    inputFilter(filterData) {
         if (this.SEARCH) {
             if (this.SEL_COL) {
                 let sel_col = this.SEL_COL;
-            filterData = filterData.filter(item => {
+                this.render_data = 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 => {
+                this.render_data = filterData.filter(item => {
                     let is_satis = false;
-                for (const key in item) {
+                    let cols = this.col_lists;
-                    if (item.hasOwnProperty(key)) {
+                    for (let i = 0; i < cols.length; i++) {
-                        if (item[key]) {
+                        if (item[cols[i].col_code]) {
-                            if (item[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                            if (item[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                                 is_satis = true;
                                 break;
                             } else {
@@ -197,30 +150,22 @@ inputFilter(filterData) {
                                 continue;
                             }
                         } else {
-                            if (this.SEARCH) {
                             is_satis = false;
                             continue;
-                            } else {
-                                is_satis = true;
-                                break;
-                            }
-                        }
-                    } else {
-                        continue;
                         }
                     }
                     return is_satis;
                 })
             }
-    }
+        } else {
             this.render_data = filterData;
-    this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
-}
+    }
 
-positionArray: Array<any> = [];
+    positionArray: Array<any> = [];
-positionArrayIndex: number = 0;
+    positionArrayIndex: number = 0;
-//输入框定位
+    //输入框定位
-inputPosition(filterData) {
+    inputPosition(filterData) {
         let transArray = []
         if (this.SEL_COL) {
             let sel_col = this.SEL_COL;
@@ -237,10 +182,10 @@ inputPosition(filterData) {
             });
         } else {
             filterData.forEach(element => {
-            for (const key in element) {
+                let cols = this.col_lists;
-                if (element.hasOwnProperty(key)) {
+                for (let i = 0; i < cols.length; i++) {
-                    if (element[key]) {
+                    if (element[cols[i].col_code]) {
-                        if (element[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                        if (element[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                             transArray.push(element)
                             break;
                         } else {
@@ -254,10 +199,6 @@ inputPosition(filterData) {
                             break;
                         }
                     }
-
-                } else {
-                    continue;
-                }
                 }
             });
         }
@@ -277,8 +218,12 @@ inputPosition(filterData) {
         } else {
             alert('没有搜索到相关数据');
         }
+        this.changeDetectorRef.detectChanges();
         let tr = $(".selected");
         let objTr = tr[0];
+        if (objTr) {
             $("#table-container").animate({ scrollTop: objTr.offsetTop - 42 }, "slow");
         }
+
+    }
 }

src/app/pages/basic-data/stand/stand.component.html

@@ -5,11 +5,7 @@
               <div class="line-operator-left input-container mb-3 col-xlg-8 col-mlg-8 col-xl-8 col-lg-10">
                     <select class="mr-4 form-control" [(ngModel)]="SEL_COL" name="" id="">
                             <option value="">选择列名</option>
-                            <option value="standCode">机位代码</option>
+                            <option *ngFor="let col of col_lists" [value]="col.col_code">{{col.col_chn}}</option>
-                            <option value="standName">机位名称</option>
-                            <option value="standType">机位类型</option>
-                            <option value="standStatus">资源状态</option>
-                            <option value="terminalAreaName">航站楼区域</option>
                     </select>
                     <label class="radio-inline custom-radio nowrap mr-4">
                             <input type="radio" [(ngModel)]="FLT_POS" [value]="1" name="filter-position">
@@ -21,11 +17,6 @@
                     </label>
                     <input class="form-control" [(ngModel)]="SEARCH" type="text" (keyup.enter) = "inputEnter()" id="inputerInfo">
               </div>
-              <div class="line-operator-right mb-3 col-xlg-4 col-mlg-4 col-xl-4 col-lg-1">
-                  <!-- <button type="button" class="btn btn-info mr-3">机位编辑</button>
-                  <button type="button" class="btn btn-info mr-3">打印</button> -->
-                  <!-- <button type="button" class="btn btn-info mr-3">刷新</button> -->
-              </div>
           </div>
 
           <div class="second-condition mb-3 row">
@@ -34,9 +25,6 @@
               <select  class="form-control" [(ngModel)]="filterItems.terminalAreaCode" (ngModelChange)="selectChange()" id="qy">
                   <option value=""></option>
                   <option *ngFor="let items of terminalAreas" [value]="items.terminalAreaCode">{{items.terminalAreaName}}</option>
-                  <!-- <option value="GH">国内区域</option>
-                  <option value="CH">国际区域</option>
-                  <option value="QH">其他区域</option> -->
               </select>
           </div>
           <div class="input-container mr-4">
@@ -77,7 +65,6 @@
                           <th>机位类型</th>
                           <th>资源状态</th>
                           <th>航站楼区域</th>
-                          <!-- <th *ngFor="let airline_col of stand_lists">{{airline_col.COL_CN}}</th> -->
                       </tr>
                   </thead>
                   <tbody>
@@ -89,7 +76,6 @@
                           <td>{{stand.standType}}</td>
                           <td>{{stand.standStatus}}</td>
                           <td>{{stand.terminalAreaName}}</td>
-                          <!-- <td *ngFor="let airline_col of stand_lists" [ngStyle]="{'background-color':getColor(airline_col.COL_CODE)}">{{airline_row['renderFlight'][airline_col.COL_CODE]}}</td> -->
                       </tr>
                   </tbody>
               </table>

src/app/pages/basic-data/stand/stand.component.scss

@@ -44,6 +44,7 @@
                     }
                     th{
                         background-color: #ddd;
+                        color: rgb(0, 0, 255);
                     }
                     th,td{
                         // border: none;

src/app/pages/basic-data/stand/stand.component.ts

@@ -1,7 +1,6 @@
 import { Component, OnInit } from '@angular/core';
-import { HttpClientService } from '../../../services/http-client.service';
+import { BasicDataService } from '../../basic-data-service';
-import { BasicDataService } from '../../basic-data-service'
+import { ChangeDetectorRef } from '@angular/core';
-import { HttpParams } from '@angular/common/http';
 import * as $ from 'jquery';
 @Component({
     selector: 'app-stand',
@@ -11,165 +10,103 @@ import * as $ from 'jquery';
 export class StandComponent implements OnInit {
 
     constructor(
-    private httpCilent: HttpClientService,
+        private basicDataService: BasicDataService,
-    private basicDataService: BasicDataService
+        private changeDetectorRef: ChangeDetectorRef
-) { }
+    ) { }
 
-// 搜索条件
+    public col_lists = [
-SEARCH = '';    //手动输入条件
+        { col_code: 'standCode', col_chn: '机位代码' },
-FLT_POS = 1;    //过滤还是定位
+        { col_code: 'standName', col_chn: '机位名称' },
-SEL_COL = '';   //选择列名
+        { col_code: 'standType', col_chn: '机位类型' },
+        { col_code: 'standStatus', col_chn: '资源状态' },
+        { col_code: 'terminalAreaName', col_chn: '航站楼区域' },
+    ]
 
-//下拉框
+    // 搜索条件
-public filterItems = {
+    SEARCH = '';    //手动输入条件
-    terminalAreaCode:'',
+    FLT_POS = 1;    //过滤还是定位
-    standType:'',
+    SEL_COL = '';   //选择列名
-    standStatus:'',
-}
 
-terminalAreas : Array<any>; //所属航站楼区域
+    //下拉框
-stands : Array<any>;
+    public filterItems = {
-public row_state: any = { renderFlight: {} };
+        terminalAreaCode: '',
-public render_data: Array<object> = [];  //显示数据，即需要显示的数据
+        standType: '',
-public return_data: Array<object> = []; //下拉框显示数据
+        standStatus: '',
-ngOnInit() {
-    this.stands = this.basicDataService.stand;
-    this.basicDataService.stand_subject.subscribe(
-        data=>{
-            this.stands = data;
-            this.render_data = this.stands;
-            if(this.terminalAreas && this.terminalAreas.length>0){//所属航站楼区域数据转换处理
-                this.terminalAreasHandle();
     }
-            this.render_data.forEach(element => {//机位类型列表显示数据转换
+
-                if (element['standType'] == 'bridge') {
+    terminalAreas: Array<any>; //所属航站楼区域
-                    element['standType'] = '靠桥机位'
+    stands: Array<any>;
-                    return element['standType'];
+    public row_state: any = { renderFlight: {} };
-                }
+    public render_data: Array<object> = [];  //显示数据，即需要显示的数据
-                if(element['standType'] == 'remote'){
+
-                    element['standType'] = '远机位'
+    ngOnInit() {
-                    return element['standType'];
-                }
-                if(element['standType'] == 'near'){
-                    element['standType'] = '近机位'
-                    return element['standType'];
-                }
-                if(element['standType'] == 'night'){
-                    element['standType'] = '过夜机位'
-                    return element['standType'];
-                }
-                if(element['standType'] == 'specific'){
-                    element['standType'] = '专机位'
-                    return element['standType'];
-                }
-            });
-            this.render_data.forEach(element => {//资源状态列表显示数据转换
-                if (element['standStatus'] == '0') {
-                    element['standStatus'] = '可用'
-                    return element['standStatus'];
-                }
-                if(element['standStatus'] == '1'){
-                    element['standStatus'] = '在用'
-                    return element['standStatus'];
-                }
-                if(element['standStatus'] == '2'){
-                    element['standStatus'] = '锁定'
-                    return element['standStatus'];
-                }
-                if(element['standStatus'] == '3'){
-                    element['standStatus'] = '禁用'
-                    return element['standStatus'];
-                }
-                if(element['standStatus'] == '4'){
-                    element['standStatus'] = '预分'
-                    return element['standStatus'];
-                }
-            });
-        }
-    )
-    //所属航站楼区域
         this.terminalAreas = this.basicDataService.terminal_area;
-    this.basicDataService.terminal_area_subject.subscribe(
+        this.stands = this.basicDataService.stand;
-        data=>{
+        this.render_data = this.basicDataService.stand;
-            this.terminalAreas = data;
+        this.basicDataService.stand_subject.subscribe(
+            data => {
+                this.stands = data;
+                this.render_data = data;
             }
         )
+        this.basicDataService.terminal_area_subject.subscribe(
+            data => {
+                this.terminalAreas = data;
+                //航站楼区域数据转换处理
+                if(this.terminalAreas && this.terminalAreas.length > 0){
+                    this.basicDataTransHandle();
+                }
+            }
+        )
+        //航站楼区域数据转换处理
+        if(this.render_data){
+            this.basicDataTransHandle();
+        }
         /**
          * 固定表头
          */
         var tableCont = document.querySelector('#table-container');
-    function scrollHandle (){
+        function scrollHandle() {
             var scrollTop = this.scrollTop;
             this.querySelector('thead').style.transform = 'translateY(' + scrollTop + 'px)';
         }
-    tableCont.addEventListener('scroll',scrollHandle);
+        tableCont.addEventListener('scroll', scrollHandle);
-}
+    }
 
-//所属航站楼区域数据转换处理
+    //航站楼区域数据转换处理
-terminalAreasHandle() {
+    basicDataTransHandle() {
         this.render_data.forEach(item => {
             let terminalAreasLinkIndex = this.terminalAreas.findIndex(val => val.terminalAreaCode === item['terminalAreaCode']);
+            if(this.terminalAreas[terminalAreasLinkIndex]){
                 item['terminalAreaName'] = this.terminalAreas[terminalAreasLinkIndex].terminalAreaName;
-    })
-}
-
-//输入框回车事件
-inputEnter() {
-    if (this.FLT_POS === 1) {
-        this.inputFilter(this.stands)
-    } else {
-        this.inputFilter(this.stands)
-        this.inputPosition(this.stands)
             }
-}
+        })
+    }
 
-/**
+    //输入框回车事件
+    inputEnter() {
+        if (this.FLT_POS === 1) {
+            this.selectChange()
+        } else {
+            this.inputPosition(this.render_data)
+        }
+    }
+
+    /**
      * 选中某行
      * @param i 
      */
-selectRow(i) {
+    selectRow(i) {
         this.row_state = i;
-}
+    }
 
-//下拉框选择筛选
+    //下拉框选择筛选
-selectChange() {
+    selectChange() {
-    this.return_data = this.stands.filter(item=>{
+        this.render_data = this.stands.filter(item => {
             let is_satis = true;
-            //资源状态
-            if (item['standStatus'] == '可用') {
-                item['standStatus'] = '0'
-            }
-            if(item['standStatus'] == '在用'){
-                item['standStatus'] = '1'
-            }
-            if(item['standStatus'] == '锁定'){
-                item['standStatus'] = '2'
-            }
-            if(item['standStatus'] == '禁用'){
-                item['standStatus'] = '3'
-            }
-            if(item['standStatus'] == '预分'){
-                item['standStatus'] = '4'
-            }
-            //机位类型
-            if (item['standType'] == '靠桥机位') {
-                item['standType'] = 'bridge'
-            }
-            if(item['standType'] == '远机位'){
-                item['standType'] = 'remote'
-            }
-            if(item['standType'] == '近机位'){
-                item['standType'] = 'near'
-            }
-            if(item['standType'] == '过夜机位'){
-                item['standType'] = 'night'
-            }
-            if(item['standType'] == '专机位'){
-                item['standType'] = 'specific'
-            }
             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]) {
+                    if (item[key] == this.filterItems[key]) {
                         is_satis = true;
                         continue;
                     } else {
@@ -180,79 +117,34 @@ selectChange() {
             }
             return is_satis;
         })
-    this.return_data.forEach(element => {  //机位类型列表显示数据转换
+        if (this.FLT_POS === 1) {
-        if (element['standType'] == 'bridge') {
+            this.inputFilter(this.render_data);
-            element['standType'] = '靠桥机位'
+        } else {
-            return element['standType'];
+            this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
         }
-        if(element['standType'] == 'remote'){
-            element['standType'] = '远机位'
-            return element['standType'];
     }
-        if(element['standType'] == 'near'){
-            element['standType'] = '近机位'
-            return element['standType'];
-        }
-        if(element['standType'] == 'night'){
-            element['standType'] = '过夜机位'
-            return element['standType'];
-        }
-        if(element['standType'] == 'specific'){
-            element['standType'] = '专机位'
-            return element['standType'];
-        }
-    });
-    this.return_data.forEach(element => {  //资源状态列表显示数据转换
-        if (element['standStatus'] == '0') {
-            element['standStatus'] = '可用'
-            return element['standStatus'];
-        }
-        if(element['standStatus'] == '1'){
-            element['standStatus'] = '在用'
-            return element['standStatus'];
-        }
-        if(element['standStatus'] == '2'){
-            element['standStatus'] = '锁定'
-            return element['standStatus'];
-        }
-        if(element['standStatus'] == '3'){
-            element['standStatus'] = '禁用'
-            return element['standStatus'];
-        }
-        if(element['standStatus'] == '4'){
-            element['standStatus'] = '预分'
-            return element['standStatus'];
-        }
-    });
-    this.render_data = this.return_data;
-}
 
-//输入框筛选
+    //输入框筛选
-inputFilter(filterData) {
+    inputFilter(filterData) {
         if (this.SEARCH) {
             if (this.SEL_COL) {
                 let sel_col = this.SEL_COL;
-            filterData = filterData.filter(item => {
+                this.render_data = 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 => {
+                this.render_data = filterData.filter(item => {
                     let is_satis = false;
-                for (const key in item) {
+                    let cols = this.col_lists;
-                    if (item.hasOwnProperty(key)) {
+                    for (let i = 0; i < cols.length; i++) {
-                        if (item[key]) {
+                        if (item[cols[i].col_code]) {
-                            if (item[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                            if (item[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                                 is_satis = true;
                                 break;
                             } else {
@@ -260,30 +152,22 @@ inputFilter(filterData) {
                                 continue;
                             }
                         } else {
-                            if (this.SEARCH) {
                             is_satis = false;
                             continue;
-                            } else {
-                                is_satis = true;
-                                break;
-                            }
-                        }
-                    } else {
-                        continue;
                         }
                     }
                     return is_satis;
                 })
             }
-    }
+        } else {
             this.render_data = filterData;
-    this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
-}
+    }
 
-positionArray: Array<any> = [];
+    positionArray: Array<any> = [];
-positionArrayIndex: number = 0;
+    positionArrayIndex: number = 0;
-//输入框定位
+    //输入框定位
-inputPosition(filterData) {
+    inputPosition(filterData) {
         let transArray = []
         if (this.SEL_COL) {
             let sel_col = this.SEL_COL;
@@ -300,10 +184,10 @@ inputPosition(filterData) {
             });
         } else {
             filterData.forEach(element => {
-            for (const key in element) {
+                let cols = this.col_lists;
-                if (element.hasOwnProperty(key)) {
+                for (let i = 0; i < cols.length; i++) {
-                    if (element[key]) {
+                    if (element[cols[i].col_code]) {
-                        if (element[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                        if (element[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                             transArray.push(element)
                             break;
                         } else {
@@ -317,14 +201,9 @@ inputPosition(filterData) {
                             break;
                         }
                     }
-
-                } else {
-                    continue;
-                }
                 }
             });
         }
-
         if (transArray.length > 0) {
             if (transArray.toString() == this.positionArray.toString()) {
                 this.positionArrayIndex++;
@@ -340,8 +219,12 @@ inputPosition(filterData) {
         } else {
             alert('没有搜索到相关数据');
         }
+        this.changeDetectorRef.detectChanges();
         let tr = $(".selected");
         let objTr = tr[0];
+        if (objTr) {
             $("#table-container").animate({ scrollTop: objTr.offsetTop - 42 }, "slow");
         }
+
+    }
 }

src/app/pages/basic-data/terminal-area/terminal-area.component.html

@@ -5,8 +5,7 @@
                 <div class="line-operator-left input-container mb-3 col-xlg-8 col-mlg-8 col-xl-8 col-lg-10">
                     <select class="mr-4 form-control" [(ngModel)]="SEL_COL" name="" id="">
                          <option value="">选择列名</option>
-                         <option value="terminalAreaCode">航站楼区域代码</option>
+                         <option *ngFor="let col of col_lists" [value]="col.col_code">{{col.col_chn}}</option>
-                         <option value="terminalAreaName">航站楼区域名称</option>
                     </select>
                     <label class="radio-inline custom-radio nowrap mr-4">
                          <input type="radio" [(ngModel)]="FLT_POS" [value]="1" name="filter-position">
@@ -18,11 +17,6 @@
                     </label>
                     <input class="form-control" [(ngModel)]="SEARCH" type="text" (keyup.enter) = "inputEnter()" id="inputerInfo">
                 </div>
-                <div class="line-operator-right mb-3 col-xlg-4 col-mlg-4 col-xl-4 col-lg-1">
-                    <!-- <button type="button" class="btn btn-info mr-3">航站楼区域编辑</button>
-                    <button type="button" class="btn btn-info mr-3">打印</button> -->
-                    <!-- <button type="button" class="btn btn-info mr-3">刷新</button> -->
-                </div>
             </div>
         </div>
   
@@ -34,7 +28,6 @@
                             <th>序号</th>
                             <th>航站楼区域代码</th>
                             <th>航站楼区域名称</th>
-                            <!-- <th *ngFor="let airline_col of terminalarea_lists">{{airline_col.COL_CN}}</th> -->
                         </tr>
                     </thead>
                     <tbody>
@@ -43,7 +36,6 @@
                             <td>{{i+1}}</td>
                             <td>{{terminalArea.terminalAreaCode}}</td>
                             <td>{{terminalArea.terminalAreaName}}</td>
-                            <!-- <td *ngFor="let airline_col of terminalarea_lists" [ngStyle]="{'background-color':getColor(airline_col.COL_CODE)}">{{airline_row['renderFlight'][airline_col.COL_CODE]}}</td> -->
                         </tr>
                     </tbody>
                 </table>

src/app/pages/basic-data/terminal-area/terminal-area.component.scss

@@ -44,6 +44,7 @@
                     }
                     th{
                         background-color: #ddd;
+                        color: rgb(0, 0, 255);
                     }
                     th,td{
                         // border: none;

src/app/pages/basic-data/terminal-area/terminal-area.component.ts

@@ -1,7 +1,6 @@
 import { Component, OnInit } from '@angular/core';
-import { HttpClientService } from '../../../services/http-client.service';
+import { BasicDataService } from '../../basic-data-service';
-import { BasicDataService } from '../../basic-data-service'
+import { ChangeDetectorRef } from '@angular/core';
-import { HttpParams } from '@angular/common/http';
 import * as $ from 'jquery';
 @Component({
     selector: 'app-terminal-area',
@@ -11,107 +10,85 @@ import * as $ from 'jquery';
 export class TerminalAreaComponent implements OnInit {
 
     constructor(
-    private httpCilent: HttpClientService,
+        private basicDataService: BasicDataService,
-    private basicDataService: BasicDataService
+        private changeDetectorRef: ChangeDetectorRef
-) { }
+    ) { }
 
-// 搜索条件
+    public col_lists = [
-SEARCH = '';    //手动输入条件
+        { col_code: 'terminalAreaCode', col_chn: '航站楼区域代码' },
-FLT_POS = 1;    //过滤还是定位
+        { col_code: 'terminalAreaName', col_chn: '航站楼区域名称' }
-SEL_COL = '';   //选择列名
+    ];
 
-//下拉框
+    // 搜索条件
-public filterItems = {
+    SEARCH = '';    //手动输入条件
+    FLT_POS = 1;    //过滤还是定位
+    SEL_COL = '';   //选择列名
 
-}
 
-terminalAreas : Array<any>;
+    terminalAreas: Array<any>;
-public row_state: any = { renderFlight: {} };
+    public row_state: any = { renderFlight: {} };
-public render_data: Array<object> = [];  //显示数据，即需要显示的数据
+    public render_data: Array<object> = [];  //显示数据，即需要显示的数据
-public return_data: Array<object> = []; //下拉框显示数据
+
-ngOnInit() {
+    ngOnInit() {
         this.terminalAreas = this.basicDataService.terminal_area;
+        this.render_data = this.basicDataService.terminal_area;
         this.basicDataService.terminal_area_subject.subscribe(
-        data=>{
+            data => {
                 this.terminalAreas = data;
-            this.render_data = this.terminalAreas;
+                this.render_data = data;
             }
         )
         /**
          * 固定表头
          */
         var tableCont = document.querySelector('#table-container');
-    function scrollHandle (){
+        function scrollHandle() {
             var scrollTop = this.scrollTop;
             this.querySelector('thead').style.transform = 'translateY(' + scrollTop + 'px)';
         }
-    tableCont.addEventListener('scroll',scrollHandle);
+        tableCont.addEventListener('scroll', scrollHandle);
-}
+    }
 
-/**
+    /**
      * 选中某行
      * @param i 
      */
-selectRow(i) {
+    selectRow(i) {
         this.row_state = i;
-}
+    }
 
-//输入框回车事件
+    //输入框回车事件
-inputEnter() {
+    inputEnter() {
         if (this.FLT_POS === 1) {
             this.inputFilter(this.terminalAreas)
         } else {
-        this.inputFilter(this.terminalAreas)
+            this.inputPosition(this.render_data)
-        this.inputPosition(this.terminalAreas)
+        }
     }
-}
 
-//下拉框选择筛选
-selectChange() {
-    this.return_data = this.terminalAreas.filter(item=>{
-            let is_satis = true;
-            for (const key in this.filterItems) {
-                if (this.filterItems.hasOwnProperty(key) && this.filterItems[key]) {
-                    if (item[key] === this.filterItems[key]) {
-                        is_satis = true;
-                        continue;
-                    } else {
-                        is_satis = false;
-                        break;
-                    }
-                }
-            }
-            return is_satis;
-    })
-    this.render_data = this.return_data;
-}
 
-//输入框筛选
+    //输入框筛选
-inputFilter(filterData) {
+    inputFilter(filterData) {
         if (this.SEARCH) {
             if (this.SEL_COL) {
                 let sel_col = this.SEL_COL;
-            filterData = filterData.filter(item => {
+                this.render_data = 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 => {
+                this.render_data = filterData.filter(item => {
                     let is_satis = false;
-                for (const key in item) {
+                    let cols = this.col_lists;
-                    if (item.hasOwnProperty(key)) {
+                    for (let i = 0; i < cols.length; i++) {
-                        if (item[key]) {
+                        if (item[cols[i].col_code]) {
-                            if (item[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                            if (item[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                                 is_satis = true;
                                 break;
                             } else {
@@ -119,30 +96,22 @@ inputFilter(filterData) {
                                 continue;
                             }
                         } else {
-                            if (this.SEARCH) {
                             is_satis = false;
                             continue;
-                            } else {
-                                is_satis = true;
-                                break;
-                            }
-                        }
-                    } else {
-                        continue;
                         }
                     }
                     return is_satis;
                 })
             }
-    }
+        } else {
             this.render_data = filterData;
-    this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
-}
+    }
 
-positionArray: Array<any> = [];
+    positionArray: Array<any> = [];
-positionArrayIndex: number = 0;
+    positionArrayIndex: number = 0;
-//输入框定位
+    //输入框定位
-inputPosition(filterData) {
+    inputPosition(filterData) {
         let transArray = []
         if (this.SEL_COL) {
             let sel_col = this.SEL_COL;
@@ -159,10 +128,10 @@ inputPosition(filterData) {
             });
         } else {
             filterData.forEach(element => {
-            for (const key in element) {
+                let cols = this.col_lists;
-                if (element.hasOwnProperty(key)) {
+                for (let i = 0; i < cols.length; i++) {
-                    if (element[key]) {
+                    if (element[cols[i].col_code]) {
-                        if (element[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                        if (element[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                             transArray.push(element)
                             break;
                         } else {
@@ -176,10 +145,6 @@ inputPosition(filterData) {
                             break;
                         }
                     }
-
-                } else {
-                    continue;
-                }
                 }
             });
         }
@@ -199,8 +164,12 @@ inputPosition(filterData) {
         } else {
             alert('没有搜索到相关数据');
         }
+        this.changeDetectorRef.detectChanges();
         let tr = $(".selected");
         let objTr = tr[0];
+        if (objTr) {
             $("#table-container").animate({ scrollTop: objTr.offsetTop - 42 }, "slow");
         }
+
+    }
 }

src/app/pages/basic-data/terminal/terminal.component.html

@@ -5,8 +5,7 @@
               <div class="line-operator-left input-container mb-3 col-xlg-8 col-mlg-8 col-xl-8 col-lg-10">
                   <select class="mr-4 form-control" [(ngModel)]="SEL_COL" name="" id="">
                       <option value="">选择列名</option>
-                      <option value="terminalCode">航站楼代码</option>
+                      <option *ngFor="let col of col_lists" [value]="col.col_code">{{col.col_chn}}</option>
-                      <option value="terminalName">航站楼名称</option>
                   </select>
                   <label class="radio-inline custom-radio nowrap mr-4">
                         <input type="radio" [(ngModel)]="FLT_POS" [value]="1" name="filter-position">
@@ -18,11 +17,6 @@
                     </label>
                     <input class="form-control" [(ngModel)]="SEARCH" type="text" (keyup.enter) = "inputEnter()" id="inputerInfo">
               </div>
-              <div class="line-operator-right mb-3 col-xlg-4 col-mlg-4 col-xl-4 col-lg-1">
-                  <!-- <button type="button" class="btn btn-info mr-3">航站楼编辑</button>
-                  <button type="button" class="btn btn-info mr-3">打印</button> -->
-                 <!--  <button type="button" class="btn btn-info mr-3">刷新</button> -->
-              </div>
           </div>
       </div>
 
@@ -34,7 +28,6 @@
                           <th>序号</th>
                           <th>航站楼代码</th>
                           <th>航站楼名称</th>
-                          <!-- <th *ngFor="let airline_col of terminal_lists">{{airline_col.COL_CN}}</th> -->
                       </tr>
                   </thead>
                   <tbody>
@@ -43,7 +36,6 @@
                           <td>{{i+1}}</td>
                           <td>{{terminal.terminalCode}}</td>
                           <td>{{terminal.terminalName}}</td>
-                          <!-- <td *ngFor="let airline_col of terminal_lists" [ngStyle]="{'background-color':getColor(airline_col.COL_CODE)}">{{airline_row['renderFlight'][airline_col.COL_CODE]}}</td> -->
                       </tr>
                   </tbody>
               </table>

src/app/pages/basic-data/terminal/terminal.component.scss

@@ -44,6 +44,7 @@
                     }
                     th{
                         background-color: #ddd;
+                        color: rgb(0, 0, 255);
                     }
                     th,td{
                         // border: none;

src/app/pages/basic-data/terminal/terminal.component.ts

@@ -1,8 +1,8 @@
 import { Component, OnInit } from '@angular/core';
-import { HttpClientService } from '../../../services/http-client.service';
 import { BasicDataService } from '../../basic-data-service'
-import { HttpParams } from '@angular/common/http';
+import { ChangeDetectorRef } from '@angular/core';
 import * as $ from 'jquery';
+
 @Component({
     selector: 'app-terminal',
     templateUrl: './terminal.component.html',
@@ -11,107 +11,84 @@ import * as $ from 'jquery';
 export class TerminalComponent implements OnInit {
 
     constructor(
-    private httpCilent: HttpClientService,
+        private basicDataService: BasicDataService,
-    private basicDataService: BasicDataService
+        private changeDetectorRef: ChangeDetectorRef
-) { }
+    ) { }
 
-// 搜索条件
+    public col_lists = [
-SEARCH = '';    //手动输入条件
+        { col_code: 'terminalCode', col_chn: '航站楼代码' },
-FLT_POS = 1;    //过滤还是定位
+        { col_code: 'terminalName', col_chn: '航站楼名称' }
-SEL_COL = '';   //选择列名
+    ]
 
-//下拉框
+    // 搜索条件
-public filterItems = {
+    SEARCH = '';    //手动输入条件
+    FLT_POS = 1;    //过滤还是定位
+    SEL_COL = '';   //选择列名
 
-}
+    terminals: Array<any>;
+    public row_state: any = { renderFlight: {} };
+    public render_data: Array<object> = [];  //显示数据，即需要显示的数据
 
-terminals : Array<any>;
+    ngOnInit() {
-public row_state: any = { renderFlight: {} };
-public render_data: Array<object> = [];  //显示数据，即需要显示的数据
-public return_data: Array<object> = []; //下拉框显示数据
-ngOnInit() {
         this.terminals = this.basicDataService.terminal;
+        this.render_data = this.basicDataService.terminal;
         this.basicDataService.terminal_subject.subscribe(
-        data=>{
+            data => {
                 this.terminals = data;
-            this.render_data = this.terminals;
+                this.render_data = data;
             }
         )
         /**
          * 固定表头
          */
         var tableCont = document.querySelector('#table-container');
-    function scrollHandle (){
+        function scrollHandle() {
             var scrollTop = this.scrollTop;
             this.querySelector('thead').style.transform = 'translateY(' + scrollTop + 'px)';
         }
-    tableCont.addEventListener('scroll',scrollHandle);
+        tableCont.addEventListener('scroll', scrollHandle);
-}
+    }
 
-/**
+    /**
      * 选中某行
      * @param i 
      */
-selectRow(i) {
+    selectRow(i) {
         this.row_state = i;
-}
+    }
 
-//输入框回车事件
+    //输入框回车事件
-inputEnter() {
+    inputEnter() {
         if (this.FLT_POS === 1) {
             this.inputFilter(this.terminals)
         } else {
-        this.inputFilter(this.terminals)
+            this.inputPosition(this.render_data)
-        this.inputPosition(this.terminals)
+        }
     }
-}
 
-//下拉框选择筛选
-selectChange() {
-    this.return_data = this.terminals.filter(item=>{
-            let is_satis = true;
-            for (const key in this.filterItems) {
-                if (this.filterItems.hasOwnProperty(key) && this.filterItems[key]) {
-                    if (item[key] === this.filterItems[key]) {
-                        is_satis = true;
-                        continue;
-                    } else {
-                        is_satis = false;
-                        break;
-                    }
-                }
-            }
-            return is_satis;
-    })
-    this.render_data = this.return_data;
-}
 
-//输入框筛选
+    //输入框筛选
-inputFilter(filterData) {
+    inputFilter(filterData) {
         if (this.SEARCH) {
             if (this.SEL_COL) {
                 let sel_col = this.SEL_COL;
-            filterData = filterData.filter(item => {
+                this.render_data = 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 => {
+                this.render_data = filterData.filter(item => {
                     let is_satis = false;
-                for (const key in item) {
+                    let cols = this.col_lists;
-                    if (item.hasOwnProperty(key)) {
+                    for (let i = 0; i < cols.length; i++) {
-                        if (item[key]) {
+                        if (item[cols[i].col_code]) {
-                            if (item[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                            if (item[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                                 is_satis = true;
                                 break;
                             } else {
@@ -119,30 +96,22 @@ inputFilter(filterData) {
                                 continue;
                             }
                         } else {
-                            if (this.SEARCH) {
                             is_satis = false;
                             continue;
-                            } else {
-                                is_satis = true;
-                                break;
-                            }
-                        }
-                    } else {
-                        continue;
                         }
                     }
                     return is_satis;
                 })
             }
-    }
+        } else {
             this.render_data = filterData;
-    this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
-}
+    }
 
-positionArray: Array<any> = [];
+    positionArray: Array<any> = [];
-positionArrayIndex: number = 0;
+    positionArrayIndex: number = 0;
-//输入框定位
+    //输入框定位
-inputPosition(filterData) {
+    inputPosition(filterData) {
         let transArray = []
         if (this.SEL_COL) {
             let sel_col = this.SEL_COL;
@@ -159,10 +128,10 @@ inputPosition(filterData) {
             });
         } else {
             filterData.forEach(element => {
-            for (const key in element) {
+                let cols = this.col_lists;
-                if (element.hasOwnProperty(key)) {
+                for (let i = 0; i < cols.length; i++) {
-                    if (element[key]) {
+                    if (element[cols[i].col_code]) {
-                        if (element[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                        if (element[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                             transArray.push(element)
                             break;
                         } else {
@@ -176,10 +145,6 @@ inputPosition(filterData) {
                             break;
                         }
                     }
-
-                } else {
-                    continue;
-                }
                 }
             });
         }
@@ -199,8 +164,11 @@ inputPosition(filterData) {
         } else {
             alert('没有搜索到相关数据');
         }
+        this.changeDetectorRef.detectChanges();
         let tr = $(".selected");
         let objTr = tr[0];
+        if (objTr) {
             $("#table-container").animate({ scrollTop: objTr.offsetTop - 42 }, "slow");
         }
+    }
 }

src/app/pages/main/main.module.ts

@@ -3,7 +3,6 @@ import { CommonModule } from '@angular/common';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { NgZorroAntdModule } from 'ng-zorro-antd'
 
-import { PipesModule } from '../../pipes/pipes.module';
 import { MainComponent } from './main.component';
 import { MainRoutingModule } from './main-routing.module';
 import { RelatedTabComponent } from './related-tab/related-tab.component';
@@ -18,7 +17,6 @@ import { SpecialTabComponent } from './special-tab/special-tab.component';
         FormsModule,
         ReactiveFormsModule,
         NgZorroAntdModule,
-        PipesModule,
         MainRoutingModule
     ],
     declarations: [

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,44 @@
+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)
+            if(this.lines.startAirport){
+                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

@@ -5,24 +5,7 @@
               <div class="line-operator-left input-container mb-3 col-xlg-8 col-mlg-8 col-xl-8 col-lg-10">
                   <select class="mr-4 form-control" [(ngModel)]="SEL_COL" name="" id="">
                       <option value="">选择列名</option>
-                      <option value="flightNumber">航班号</option>
+                      <option *ngFor="let col of col_lists" [value]="col.col_code">{{col.col_chn}}</option>
-                      <option value="seasonRecId">航班季度</option>
-                      <option value="internationalCode">国际代码</option>
-                      <option value="airlineChnName">航空公司</option>
-                      <option value="routeType">航线类别</option>
-                      <option value="flightTypeCode">航班类别</option>
-                      <option value="flightTask">航班任务</option>
-                      <option value="operationDays">运营日</option>
-                      <option value="startDate">开始日期</option>
-                      <option value="endDate">结束日期</option>
-                      <option value="startAirport">航线</option>
-                      <option value="arriOrDept">进/出港</option>
-                      <option value="arrivalTime">到达时间</option>
-                      <option value="departureTime">出发时间</option>
-                      <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> -->
                   </select>
                   <label class="radio-inline custom-radio nowrap mr-4">
                         <input type="radio" [(ngModel)]="FLT_POS" [value]="1" name="filter-position">
@@ -105,18 +88,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>
@@ -159,7 +142,7 @@
                           <td>{{seasonal.arriOrDept}}</td>
                           <td>{{seasonal.arrivalTime}}</td>
                           <td>{{seasonal.departureTime}}</td>
-                          <td>{{seasonal.aircraftTypeCode}}</td>
+                          <td>{{seasonal.aircraftTypeName}}</td>
                           <td>{{seasonal.flyingDistance}}</td>
                           <td>{{seasonal.flyingTime}}</td>
                          <!--  <td *ngFor="let seasonal of seasonal_lists" [ngStyle]="{'background-color':getColor(seasonal.COL_CODE)}">{{airline_row['renderFlight'][seasonal.COL_CODE]}}</td> -->
@@ -167,6 +150,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;
@@ -44,12 +46,72 @@
                     }
                     th{
                         background-color: #ddd;
+                        color: rgb(0, 0, 255);
                     }
-                    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

@@ -1,8 +1,8 @@
 import { Component, OnInit } from '@angular/core';
 import { HttpClientService } from '../../services/http-client.service';
-import { HttpParams } from '@angular/common/http';
+import { BasicDataService } from '../basic-data-service';
+import { ChangeDetectorRef } from '@angular/core';
 import * as $ from 'jquery';
-import { BasicDataService } from '../basic-data-service'
 @Component({
   selector: 'app-seasonal-plan',
   templateUrl: './seasonal-plan.component.html',
@@ -12,28 +12,58 @@ export class SeasonalPlanComponent implements OnInit {
 
     constructor(
         private httpCilent: HttpClientService,
-    private basicDataService: BasicDataService
+        private basicDataService: BasicDataService,
-) { }
+        private changeDetectorRef: ChangeDetectorRef
+    ) { }
 
-// 搜索条件
+    //勾选复选框
-SEARCH = '';    //手动输入条件
+    public checkboxGroup = {
-FLT_POS = 1;    //过滤还是定位
+        'related': false,
-SEL_COL = '';   //选择列名
+        'detail': false
+    }
 
-public filterItems = {
+    //选择列名
+    public col_lists = [
+        { col_code: 'flightNumber', col_chn: '航班号' },
+        { col_code: 'seasonRecId', col_chn: '航班季度' },
+        { col_code: 'internationalCode', col_chn: '国际代码' },
+        { col_code: 'airlineChnName', col_chn: '航空公司' },
+        { col_code: 'routeType', col_chn: '航线类别' },
+        { col_code: 'flightTypeCode', col_chn: '航班类别' },
+        { col_code: 'flightTask', col_chn: '航班任务' },
+        { col_code: 'operationDays', col_chn: '运营日' },
+        { col_code: 'startDate', col_chn: '开始日期' },
+        { col_code: 'endDate', col_chn: '结束日期' },
+        { col_code: 'startAirport', col_chn: '航线' },
+        { col_code: 'arriOrDept', col_chn: '进/出港' },
+        { col_code: 'arrivalTime', col_chn: '到达时间' },
+        { col_code: 'departureTime', col_chn: '出发时间' },
+        { col_code: 'aircraftTypeCode', col_chn: '机型' },
+        { col_code: 'flyingDistance', col_chn: '飞行距离(千米)' },
+        { col_code: 'flyingTime', col_chn: '飞行时间(分钟)' },
+    ]
+
+    // 搜索条件
+    SEARCH = '';    //手动输入条件
+    FLT_POS = 1;    //过滤还是定位
+    SEL_COL = '';   //选择列名
+
+    public filterItems = {
         airlineId: '',    //航空公司
         routeType: '',  //航线类别
         flightTypeCode: '',  //航班类别
         arriOrDept: '', //到达/出发
         flightTask: '',    //航班任务
-}
+    }
+    public tabClose: boolean = true;
 
-seasonals : Array<any>; 
+    seasonals : Array<any>; 
-airlines : Array<any>; //航空公司
+    airlines : Array<any>; //航空公司
-public row_state: any = { renderFlight: {} };
+    aircraftTypes : Array<any>; //机型
-public render_data: Array<object> = [];  //显示数据，即需要显示的数据
+    public row_state: any = { renderFlight: {} };
-public return_data: Array<object> = []; //下拉框显示数据
+    public render_data: Array<object> = [];  //显示数据，即需要显示的数据
-ngOnInit() {
+    public return_data: Array<object> = []; //下拉框显示数据
+    ngOnInit() {
         /* 获取季度计划信息 */
         this.httpCilent.get('/adminapi/schedule/flightSchdSeasons').subscribe(
             data => {
@@ -42,6 +72,9 @@ ngOnInit() {
                 if(this.airlines && this.airlines.length > 0){//航空公司列表数据转换
                     this.basicDataTransHandle();
                 }
+                if(this.aircraftTypes && this.aircraftTypes.length > 0){//机型列表数据转换
+                    this.aircraftTypesHandle();
+                }
                 this.render_data.forEach(element => {//航线类别列表显示数据转换
                     if (element['routeType'] == 'D') {
                         element['routeType'] = '国内'
@@ -147,6 +180,13 @@ ngOnInit() {
                 this.airlines = data;
             }
         )
+        //机型
+        this.aircraftTypes = this.basicDataService.aircraft_type;
+        this.basicDataService.aircraft_type_subject.subscribe(
+            data => {
+                this.aircraftTypes = data;
+            }
+        )
         /**
          * 固定表头
          */
@@ -156,42 +196,77 @@ ngOnInit() {
             this.querySelector('thead').style.transform = 'translateY(' + scrollTop + 'px)';
         }
         tableCont.addEventListener('scroll',scrollHandle);
-}
+    }
-//航空公司名称数据转换处理
+    //航空公司名称数据转换处理
-basicDataTransHandle() {
+    basicDataTransHandle() {
         this.render_data.forEach(item => {
             let airlineLinkIndex = this.airlines.findIndex(val => val.airlineId === item['airlineId']);
+            if(this.airlines[airlineLinkIndex]){
                 item['airlineChnName'] = this.airlines[airlineLinkIndex].airlineName;
+            }
         })
-}
+    }
 
-/**
+    //机型数据转换处理
+    aircraftTypesHandle() {
+        this.render_data.forEach(item => {
+            let aircraftTypesLinkIndex = this.aircraftTypes.findIndex(val => val.aircraftTypeCode === item['aircraftTypeCode']);
+            if(this.aircraftTypes[aircraftTypesLinkIndex]){
+                item['aircraftTypeName'] = this.aircraftTypes[aircraftTypesLinkIndex].aircraftTypeName;
+            }
+        })
+    }
+
+    /**
+     * 复选框勾选事件
+     */
+    checkboxChange() {
+        for (const key in this.checkboxGroup) {
+            if (this.checkboxGroup.hasOwnProperty(key)) {
+                if (this.checkboxGroup[key]) {
+                    this.tabClose = false;
+                    break;
+                } else {
+                    this.tabClose = true;
+                    continue;
+                }
+            }
+        }
+    }
+
+    /**
+     * tab项切换事件
+     */
+    nzClick() {
+        
+    }
+
+    /**
      * 刷新
      */
-refresh() {
+    refresh() {
         this.render_data.reverse();
-}
+    }
 
-/**
+    /**
      * 选中某行
      * @param i 
      */
-selectRow(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() {
+    inputEnter() {
+        if (this.FLT_POS === 1) {
+            this.selectChange()
+        } else {
+            this.inputPosition(this.render_data)
+        }
+    }
+
+    //下拉框选择筛选
+    selectChange() {
         this.return_data = this.seasonals.filter(item=>{
             let is_satis = true;
             if(item['routeType'] == '国内'){
@@ -265,10 +340,10 @@ selectChange() {
             }
             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]) {
+                    if (item[key] == this.filterItems[key]) {
                         is_satis = true;
                         continue;
-                }else {
+                    } else {
                         is_satis = false;
                         break;
                     }
@@ -276,6 +351,7 @@ selectChange() {
             }
             return is_satis;
         })
+        
         this.return_data.forEach(element => {//航线类别列表显示数据转换
             if (element['routeType'] == 'D') {
                 element['routeType'] = '国内'
@@ -373,34 +449,34 @@ selectChange() {
             }
         });
         this.render_data = this.return_data;
-}
+        if (this.FLT_POS === 1) {
+            this.inputFilter(this.render_data);
+        } else {
+            this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
+    }
 
-//输入框筛选
+    //输入框筛选
-inputFilter(filterData) {
+    inputFilter(filterData) {
         if (this.SEARCH) {
             if (this.SEL_COL) {
                 let sel_col = this.SEL_COL;
-            filterData = filterData.filter(item => {
+                this.render_data = 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 => {
+                this.render_data = filterData.filter(item => {
                     let is_satis = false;
-                for (const key in item) {
+                    let cols = this.col_lists;
-                    if (item.hasOwnProperty(key)) {
+                    for (let i = 0; i < cols.length; i++) {
-                        if (item[key]) {
+                        if (item[cols[i].col_code]) {
-                            if (item[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                            if (item[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                                 is_satis = true;
                                 break;
                             } else {
@@ -408,30 +484,22 @@ inputFilter(filterData) {
                                 continue;
                             }
                         } else {
-                            if (this.SEARCH) {
                             is_satis = false;
                             continue;
-                            } else {
-                                is_satis = true;
-                                break;
-                            }
-                        }
-                    } else {
-                        continue;
                         }
                     }
                     return is_satis;
                 })
             }
-    }
+        } else {
             this.render_data = filterData;
-    this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+        }
-}
+    }
 
-positionArray: Array<any> = [];
+    positionArray: Array<any> = [];
-positionArrayIndex: number = 0;
+    positionArrayIndex: number = 0;
-//输入框定位
+    //输入框定位
-inputPosition(filterData) {
+    inputPosition(filterData) {
         let transArray = []
         if (this.SEL_COL) {
             let sel_col = this.SEL_COL;
@@ -448,10 +516,10 @@ inputPosition(filterData) {
             });
         } else {
             filterData.forEach(element => {
-            for (const key in element) {
+                let cols = this.col_lists;
-                if (element.hasOwnProperty(key)) {
+                for (let i = 0; i < cols.length; i++) {
-                    if (element[key]) {
+                    if (element[cols[i].col_code]) {
-                        if (element[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                        if (element[cols[i].col_code].toString().match(new RegExp(this.SEARCH, 'i'))) {
                             transArray.push(element)
                             break;
                         } else {
@@ -465,10 +533,6 @@ inputPosition(filterData) {
                             break;
                         }
                     }
-
-                } else {
-                    continue;
-                }
                 }
             });
         }
@@ -488,9 +552,12 @@ inputPosition(filterData) {
         } else {
             alert('没有搜索到相关数据');
         }
+        this.changeDetectorRef.detectChanges();
         let tr = $(".selected");
         let objTr = tr[0];
+        if (objTr) {
             $("#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 { }

src/app/pipes/basic-data-pipes/basic-data-pipes.module.spec.ts

@@ -0,0 +1,13 @@
+import { BasicDataPipesModule } from './basic-data-pipes.module';
+
+describe('BasicDataPipesModule', () => {
+  let basicDataPipesModule: BasicDataPipesModule;
+
+  beforeEach(() => {
+    basicDataPipesModule = new BasicDataPipesModule();
+  });
+
+  it('should create an instance', () => {
+    expect(basicDataPipesModule).toBeTruthy();
+  });
+});

src/app/pipes/basic-data-pipes/basic-data-pipes.module.ts

@@ -0,0 +1,13 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { TerminalAreaPipe } from './terminal-area.pipe';
+import { GateStatusPipe } from './gate-status.pipe';
+
+@NgModule({
+    imports: [
+        CommonModule
+    ],
+    declarations: [TerminalAreaPipe, GateStatusPipe],
+    exports: [TerminalAreaPipe, GateStatusPipe]
+})
+export class BasicDataPipesModule { }

src/app/pipes/basic-data-pipes/gate-status.pipe.spec.ts

@@ -0,0 +1,8 @@
+import { GateStatusPipe } from './gate-status.pipe';
+
+describe('GateStatusPipe', () => {
+  it('create an instance', () => {
+    const pipe = new GateStatusPipe();
+    expect(pipe).toBeTruthy();
+  });
+});

src/app/pipes/basic-data-pipes/gate-status.pipe.ts

@@ -0,0 +1,17 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+  name: 'gateStatus'
+})
+export class GateStatusPipe implements PipeTransform {
+
+  transform(value: any, args?: any): any {
+      if(value){
+        
+      }else{
+        return null;
+      }
+    
+  }
+
+}

src/app/pipes/basic-data-pipes/terminal-area.pipe.spec.ts

@@ -0,0 +1,8 @@
+import { TerminalAreaPipe } from './terminal-area.pipe';
+
+describe('TerminalAreaPipe', () => {
+  it('create an instance', () => {
+    const pipe = new TerminalAreaPipe();
+    expect(pipe).toBeTruthy();
+  });
+});

src/app/pipes/basic-data-pipes/terminal-area.pipe.ts

@@ -0,0 +1,22 @@
+import { Pipe, PipeTransform, OnInit } from '@angular/core';
+import { BasicDataService } from '../../pages/basic-data-service';
+
+@Pipe({
+    name: 'terminalArea'
+})
+export class TerminalAreaPipe implements PipeTransform {
+    constructor(
+        private basicDataService: BasicDataService
+    ) { }
+
+    transform(value: any, args?: any): any {
+        let terminal_area = this.basicDataService.terminal_area.find(val => val.terminalAreaCode === value)
+        if (terminal_area) {
+            return terminal_area.terminalAreaName
+        } else {
+            return null;
+        }
+
+    }
+
+}

src/app/pipes/pipes.module.ts

@@ -1,11 +0,0 @@
-import { NgModule } from '@angular/core';
-
-@NgModule({
-    imports: [],
-    declarations: [
-    ],
-    exports: [
-    ]
-})
-
-export class PipesModule { }