接口数据对接

2018-11-21 18:24:06 +08:00
parent 93f9dc0940
commit afa2130c8d
2 changed files with 210 additions and 328 deletions
@@ -14,12 +14,12 @@
                        <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()">
+                    <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" (click)="clearFiter()">刷新</button>
              </div>
          </div>
      </div>
@@ -30,18 +30,17 @@
                  <thead>
                      <tr>
                          <th>序号</th>
-                          <!-- <th>值机岛代码</th>
-                          <th>值机岛名称</th> -->
-                          <th *ngFor="let airline_col of col_lists">{{airline_col.COL_CN}}</th>
+                          <th>值机岛代码</th>
+                          <th>值机岛名称</th>
+                          <!-- th *ngFor="let airline_col of col_lists">{{airline_col.COL_CN}}</th> -->
                      </tr>
                  </thead>
                  <tbody>
-                      <tr *ngFor="let airline_row of render_data;let i = index" (click)="selectRow(airline_row)"
-                          [ngClass]="{'selected':row_state['renderFlight']===airline_row['renderFlight']}">
+                      <tr *ngFor="let checkinGroup of checkinGroups;let i = index">
                          <td>{{i+1}}</td>
-                          <!-- <td>{{airline_col.checkinGroupCode}}</td>
-                          <td>{{airline_col.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>
+                          <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>
@@ -1,9 +1,8 @@
 import { Component, OnInit } from '@angular/core';
-import { ChangeDetectorRef } from '@angular/core';
 import { HttpClientService } from '../../../services/http-client.service';
-import dateFormatter from '../../../utils/data-formatter';
 import { HttpParams } from '@angular/common/http';
 import * as $ from 'jquery';
+import { BasicDataService } from '../../basic-data-service'
@Component({
  selector: 'app-checkin-group',
  templateUrl: './checkin-group.component.html',
@@ -13,367 +12,251 @@ export class CheckinGroupComponent implements OnInit {

  constructor(
    private httpCilent: HttpClientService,
-    private changeDetectorRef: ChangeDetectorRef
+    private basicDataService: BasicDataService
 ) { }

-public raw_data: Array<object> = [];    //原始数据，即航班计划
-
-public combined_data: Array<object> = [];    //组合数据，即链接航班，显示信息等组合好之后的数据
-
-public render_data: Array<object> = [];  //显示数据，即需要显示的数据
-
-public col_lists: Array<object>;    //列数据
-
-public row_state: any = { renderFlight: {} };
-
 // 搜索条件
 SEARCH = '';    //手动输入条件
 FLT_POS = 1;    //过滤还是定位
 SEL_COL = '';   //选择列名

-public filterItems = {
-
-}
-
-public formatter = {
-    'SODT': dateFormatter,
-    'ESTT': dateFormatter,
-    'ACTT': dateFormatter
-}
-
-selectRow(i) {
-    this.row_state = i;
-    this.changeDetectorRef.detectChanges();
-}
-
-getColor(col_CODE) {
-    if (col_CODE === 'SODT') {
-        return 'skyblue'
-    } else {
-        return null
-    }
-}
-
+checkinGroups : Array<any>;
+public row_state: any = { renderFlight: {} };
+public render_data: Array<object> = [];  //显示数据，即需要显示的数据
 ngOnInit() {
-    this.changeDetectorRef.detach();
-    /* 获取显示列 */
-    this.httpCilent.get('/assets/mock-data/checkin-group.json').subscribe(
-        data => {
-            data.sort(function (a, b) {
-                return (a['COL_ORDER'] - b['COL_ORDER']);
-            })
-            this.col_lists = data;
+    this.checkinGroups = this.basicDataService.checkin_group;
+    this.basicDataService.checkin_group_subject.subscribe(
+        data=>{
+            this.checkinGroups = data;
+            this.render_data = this.checkinGroups;
        }
    )
-    /* 获取值机岛信息 */
-    this.httpCilent.get('/assets/mock-data/checkin-data.json').subscribe(
-        data => {
-            //解析数据
-            data.forEach(element => {
-                this.raw_data.push(JSON.parse(element.value));
-            });
-
-            let combined_linked_data = this.raw_data
-
-            combined_linked_data.forEach(element => {
-                let row_flights = {};
-                let render_flight = {};
-                let render_pre_flight = {};
-                let render_rea_flight = {};
-                row_flights['preFlight'] = element;
-
-                for (let i = 0; i < this.col_lists.length; i++) {
-                    let key = this.col_lists[i]['COL_CODE']
-                    render_flight[key] = typeof (this.formatter[key]) === 'function' ? this.formatter[key](row_flights['preFlight'][key], 1) : this.formatter[key] ? this.formatter[key][row_flights['preFlight'][key]] : row_flights['preFlight'][key];
-                }
-                row_flights['renderFlight'] = render_flight;
-                if (element['isLinked']) {
-                    row_flights['preFlight'] = element['linkFlight'];
-                    delete element['linkFlight'];
-                    delete element['isLinked'];
-                    row_flights['reaFlight'] = element;
-
-                    for (let i = 0; i < this.col_lists.length; i++) {
-                        let key = this.col_lists[i]['COL_CODE']
-                        if (this.formatter.hasOwnProperty(key)) {
-                            if (typeof (this.formatter[key]) === 'function') {
-                                render_flight[key] = (row_flights['preFlight'][key] === row_flights['reaFlight'][key]) ? (this.formatter[key](row_flights['preFlight'][key], 1)) : (this.formatter[key](row_flights['preFlight'][key], 1) + '/' + this.formatter[key](row_flights['reaFlight'][key], 1));
-                                render_pre_flight[key] = this.formatter[key](row_flights['preFlight'][key], 1);
-                                render_rea_flight[key] = this.formatter[key](row_flights['reaFlight'][key], 1);
-                            } else {
-                                render_flight[key] = (row_flights['preFlight'][key] === row_flights['reaFlight'][key]) ? (this.formatter[key][row_flights['preFlight'][key]]) : (this.formatter[key][row_flights['preFlight'][key]] + '/' + this.formatter[key][row_flights['reaFlight'][key]]);
-                                render_pre_flight[key] = this.formatter[key][row_flights['preFlight'][key]];
-                                render_rea_flight[key] = this.formatter[key][row_flights['reaFlight'][key]];
-                            }
-                        } else {
-                            render_flight[key] = (row_flights['preFlight'][key] === row_flights['reaFlight'][key]) ? (row_flights['preFlight'][key]) : (row_flights['preFlight'][key] + '/' + row_flights['reaFlight'][key]);
-                            render_pre_flight[key] = row_flights['preFlight'][key];
-                            render_rea_flight[key] = row_flights['reaFlight'][key];
-                        }
-                    }
-                    row_flights['renderFlight'] = render_flight;
-                    row_flights['renderPreFlight'] = render_pre_flight;
-                    row_flights['renderReaFlight'] = render_rea_flight;
-                }
-                this.combined_data.push(row_flights)
-            })
-           // this.doSequence(this.combined_data);
-            this.render_data = this.combined_data
-            this.changeDetectorRef.detectChanges();
-        }
-    )
-        /**
-         * 固定表头
-         */
-        var tableCont = document.querySelector('#table-container')
-        function scrollHandle (){
-          var scrollTop = this.scrollTop;
-          this.querySelector('thead').style.transform = 'translateY(' + scrollTop + 'px)';
-        }
-        tableCont.addEventListener('scroll',scrollHandle)
+    /**
+     * 固定表头
+     */
+    var tableCont = document.querySelector('#table-container');
+    function scrollHandle (){
+      var scrollTop = this.scrollTop;
+      this.querySelector('thead').style.transform = 'translateY(' + scrollTop + 'px)';
+    }
+    tableCont.addEventListener('scroll',scrollHandle);
 }

-/**
- * 执行排序并渲染
- */
-/* doSequence(sequenceData) {
-    sequenceData.forEach(element => {
-        element['ORDER'] = '+' + element['order']
-    })
-
-    sequenceData.sort(function (a, b) {
-        return (a['ORDER'] - b['ORDER']);
-    })
-
-    this.render_data = sequenceData;
-    this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
-    this.changeDetectorRef.detectChanges();
-} */
-
-/**
- * 过滤及定位
- * @param filterItems
- * @return
- */
+//刷新
+clearFiter(){
+    $("#inputerInfo").val(""); //清空过滤或查找定位文本框
+    this.ngOnInit();
+}
 //输入框回车事件
 inputEnter() {
-    if (this.FLT_POS === 1) {
-        this.selectChange()
-    } else {
-        this.selectChange()
-        this.inputPosition(this.render_data)
-    }
+if (this.FLT_POS === 1) {
+    this.selectChange()
+} else {
+    this.selectChange()
+    this.inputPosition(this.render_data)
+}
 }

 //下拉框选择筛选
 selectChange() {
-    let filter_data = [];
-    let filterItems = this.filterItems;
-    this.combined_data.forEach(item => {
-        filter_data.push(Object.assign({}, item));
-    })
-    //下拉框筛选
-    filter_data = filter_data.filter(item => {
-        if (item) {
-            let is_satis = true;
-            for (const key in filterItems) {
-                if (filterItems.hasOwnProperty(key) && filterItems[key]) {
-                    if (item['preFlight'][key] === filterItems[key]) {
-                        is_satis = true;
-                        continue;
-                    } else {
-                        is_satis = false;
-                        break;
-                    }
-
+let filter_data = [];
+let filtercheckinGroups = this.render_data;
+this.render_data.forEach(item => {
+    filter_data.push(Object.assign({}, item));
+})
+if (this.FLT_POS === 1) {
+    this.inputFilter(filter_data);
+} else {
+    this.checkinGroups = filter_data;
+    this.row_state = this.checkinGroups.length > 0 ? this.checkinGroups[0] : { renderFlight: {} };
+}
+//下拉框筛选
+filter_data = filter_data.filter(item => {
+    if (item) {
+        let is_satis = true;
+        for (const key in filtercheckinGroups) {
+            if (filtercheckinGroups.hasOwnProperty(key) && filtercheckinGroups[key]) {
+                if (item[key] === filtercheckinGroups[key]) {
+                    is_satis = true;
+                    continue;
+                } else {
+                    is_satis = false;
+                    break;
                }
-            }
-            return is_satis;
-        } else if (item) {
-            let is_satis = true;
-            for (const key in filterItems) {
-                if (filterItems.hasOwnProperty(key) && filterItems[key]) {
-                    if (item['reaFlight'][key] === filterItems[key]) {
-                        is_satis = true;
-                        continue;
-                    } else {
-                        is_satis = false;
-                        break;
-                    }

-                }
-            }
-            return is_satis;
-        } else {
-            let pre_satis = true;
-            let rea_satis = true;
-            for (const key in filterItems) {
-                if (filterItems.hasOwnProperty(key) && filterItems[key]) {
-                    if (item['preFlight'][key] === filterItems[key]) {
-                        pre_satis = true;
-                        continue;
-                    } else {
-                        pre_satis = false;
-                        break;
-                    }
-
-                }
-            }
-            for (const key in filterItems) {
-                if (filterItems.hasOwnProperty(key) && filterItems[key]) {
-                    if (item['reaFlight'][key] === filterItems[key]) {
-                        rea_satis = true;
-                        continue;
-                    } else {
-                        rea_satis = false;
-                        break;
-                    }
-
-                }
-            }
-
-            if (pre_satis && !rea_satis) {
-                item['renderFlight'] = item['renderPreFlight'];
-                return pre_satis;
-            } else if (!pre_satis && rea_satis) {
-                item['renderFlight'] = item['renderReaFlight'];
-                return rea_satis;
-            } else if (pre_satis && rea_satis) {
-                return pre_satis && rea_satis;
-            } else {
-                return false;
            }
        }
-    })
-    if (this.FLT_POS === 1) {
-        this.inputFilter(filter_data);
+        return is_satis;
+    } else if (item) {
+        let is_satis = true;
+        for (const key in filtercheckinGroups) {
+            if (filtercheckinGroups.hasOwnProperty(key) && filtercheckinGroups[key]) {
+                if (item[key] === filtercheckinGroups[key]) {
+                    is_satis = true;
+                    continue;
+                } else {
+                    is_satis = false;
+                    break;
+                }
+
+            }
+        }
+        return is_satis;
    } else {
-        this.render_data = filter_data;
-        this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
-        // this.inputPosition(this.render_data);
-        this.changeDetectorRef.detectChanges();
+        let pre_satis = true;
+        let rea_satis = true;
+        for (const key in filtercheckinGroups) {
+            if (filtercheckinGroups.hasOwnProperty(key) && filtercheckinGroups[key]) {
+                if (item[key] === filtercheckinGroups[key]) {
+                    pre_satis = true;
+                    continue;
+                } else {
+                    pre_satis = false;
+                    break;
+                }
+
+            }
+        }
+        for (const key in filtercheckinGroups) {
+            if (filtercheckinGroups.hasOwnProperty(key) && filtercheckinGroups[key]) {
+                if (item[key] === filtercheckinGroups[key]) {
+                    rea_satis = true;
+                    continue;
+                } else {
+                    rea_satis = false;
+                    break;
+                }
+
+            }
+        }
+
+        if (pre_satis && !rea_satis) {
+            item = item;
+            return pre_satis;
+        } else if (!pre_satis && rea_satis) {
+            item = item;
+            return rea_satis;
+        } else if (pre_satis && rea_satis) {
+            return pre_satis && rea_satis;
+        } else {
+            return false;
+        }
    }
+})
 }

 //输入框筛选
 inputFilter(filterData) {
-    if (this.SEARCH) {
-        if (this.SEL_COL) {
-            let sel_col = this.SEL_COL;
-            filterData = filterData.filter(item => {
-                if (item['renderFlight'][sel_col]) {
-                    if (item['renderFlight'][sel_col].toString().match(new RegExp(this.SEARCH, 'i'))) {
-                        return true;
-                    }
-                } else {
-                    if (this.SEARCH) {
-                        return false;
-                    } else {
-                        return true;
-                    }
+if (this.SEARCH) {
+    if (this.SEL_COL) {
+        let sel_col = this.SEL_COL;
+        filterData = filterData.filter(item => {
+            if (item[sel_col]) {
+                if (item[sel_col].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                    return true;
                }
-            })
-        } else {
-            filterData = filterData.filter(item => {
-                let is_satis = false;
-                for (const key in item['renderFlight']) {
-                    if (item['renderFlight'].hasOwnProperty(key)) {
-                        if (item['renderFlight'][key]) {
-                            if (item['renderFlight'][key].toString().match(new RegExp(this.SEARCH, 'i'))) {
-                                is_satis = true;
-                                break;
-                            } else {
-                                is_satis = false;
-                                continue;
-                            }
+            } else {
+                if (this.SEARCH) {
+                    return false;
+                } else {
+                    return true;
+                }
+            }
+        })
+
+    } else {
+        filterData = filterData.filter(item => {
+            let is_satis = false;
+            for (const key in item) {
+                if (item.hasOwnProperty(key)) {
+                    if (item[key]) {
+                        if (item[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                            is_satis = true;
+                            break;
                        } else {
-                            if (this.SEARCH) {
-                                is_satis = false;
-                                continue;
-                            } else {
-                                is_satis = true;
-                                break;
-                            }
+                            is_satis = false;
+                            continue;
                        }
                    } else {
-                        continue;
+                        if (this.SEARCH) {
+                            is_satis = false;
+                            continue;
+                        } else {
+                            is_satis = true;
+                            break;
+                        }
                    }
+                } else {
+                    continue;
                }
-                return is_satis;
-            })
-        }
+            }
+            return is_satis;
+        })
    }
-    this.render_data = filterData;
-    this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
-    this.changeDetectorRef.detectChanges();
+}
+this.checkinGroups = filterData;
+this.row_state = this.checkinGroups.length > 0 ? this.checkinGroups[0] : { renderFlight: {} };
 }

 positionArray: Array<any> = [];
 positionArrayIndex: number = 0;
 //输入框定位
 inputPosition(filterData) {
-    let transArray = []
-    if (this.SEL_COL) {
-        let sel_col = this.SEL_COL;
-        filterData.forEach(element => {
-            if (element['renderFlight'][sel_col]) {
-                if (element['renderFlight'][sel_col].toString().match(new RegExp(this.SEARCH, 'i'))) {
-                    transArray.push(element)
-                }
-            } else {
-                if (!this.SEARCH) {
-                    transArray.push(element)
-                }
+let transArray = []
+if (this.SEL_COL) {
+    let sel_col = this.SEL_COL;
+    filterData.forEach(element => {
+        if (element[sel_col]) {
+            if (element[sel_col].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                transArray.push(element)
            }
-        });
-    } else {
-        filterData.forEach(element => {
-            for (const key in element['renderFlight']) {
-                if (element['renderFlight'].hasOwnProperty(key)) {
-                    if (element['renderFlight'][key]) {
-                        if (element['renderFlight'][key].toString().match(new RegExp(this.SEARCH, 'i'))) {
-                            transArray.push(element)
-                            break;
-                        } else {
-                            continue;
-                        }
-                    } else {
-                        if (this.SEARCH) {
-                            continue;
-                        } else {
-                            transArray.push(element)
-                            break;
-                        }
-                    }
-
-                } else {
-                    continue;
-                }
-            }
-        });
-    }
-
-    if (transArray.length > 0) {
-        if (transArray.toString() == this.positionArray.toString()) {
-            this.positionArrayIndex++;
-            if (this.positionArrayIndex === this.positionArray.length) {
-                this.positionArrayIndex = 0;
-            }
-            this.row_state = this.positionArray[this.positionArrayIndex];
        } else {
-            this.positionArray = transArray;
-            this.positionArrayIndex = 0;
-            this.row_state = this.positionArray[this.positionArrayIndex];
+            if (!this.SEARCH) {
+                transArray.push(element)
+            }
        }
-    } else {
-        alert('没有搜索到相关数据');
-    }
+    });
+} else {
+    filterData.forEach(element => {
+        for (const key in element) {
+            if (element.hasOwnProperty(key)) {
+                if (element[key]) {
+                    if (element[key].toString().match(new RegExp(this.SEARCH, 'i'))) {
+                        transArray.push(element)
+                        break;
+                    } else {
+                        continue;
+                    }
+                } else {
+                    if (this.SEARCH) {
+                        continue;
+                    } else {
+                        transArray.push(element)
+                        break;
+                    }
+                }

-    this.changeDetectorRef.detectChanges();
+            } else {
+                continue;
+            }
+        }
+    });
+}

-    let tr = $(".selected");
-    let objTr = tr[0];
-    $("#table-container").animate({ scrollTop: objTr.offsetTop - 42 }, "slow");
-
+if (transArray.length > 0) {
+    if (transArray.toString() == this.positionArray.toString()) {
+        this.positionArrayIndex++;
+        if (this.positionArrayIndex === this.positionArray.length) {
+            this.positionArrayIndex = 0;
+        }
+        this.row_state = this.positionArray[this.positionArrayIndex];
+    } else {
+        this.positionArray = transArray;
+        this.positionArrayIndex = 0;
+        this.row_state = this.positionArray[this.positionArrayIndex];
    }
+} else {
+    alert('没有搜索到相关数据');
+}
+}
 }