cdia/airport-chengdu-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

航班定位及精确定位

Browse Source
This commit is contained in:
zhouyuejun
2018-11-15 14:57:26 +08:00
parent 94ad045cd5
commit f30867e92b
3 changed files with 248 additions and 144 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/pages/main/main.component.html
+8 -8
View File
@@ -14,7 +14,7 @@
<input type="radio" [(ngModel)]="FLT_POS" [value]="2" name="filter-position">
<span>查找定位</span>
</label>
<input class="form-control" [(ngModel)]="SEARCH" type="text" (keyup.enter) = "inputFliter()">
<input class="form-control" [(ngModel)]="SEARCH" type="text" (keyup.enter) = "inputEnter()">
</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>
@@ -33,7 +33,7 @@
</div>
<div class="input-container mr-4">
<label for="">航线类别：&nbsp;&nbsp;</label>
<select [(ngModel)]="filterItems.FLIN" class="form-control">
<select [(ngModel)]="filterItems.FLIN" (ngModelChange)="selectChange()" class="form-control">
<option value=""></option>
<option value="D">国内</option>
<option value="I">国际</option>
@@ -43,7 +43,7 @@
</div>
<div class="input-container mr-4">
<label for="">航班类别：&nbsp;&nbsp;</label>
<select [(ngModel)]="filterItems.FLTY" class="form-control">
<select [(ngModel)]="filterItems.FLTY" (ngModelChange)="selectChange()" class="form-control">
<option value=""></option>
<option value="">客机</option>
<option value="">货机</option>
@@ -59,7 +59,7 @@
</div> -->
<div class="input-container mr-4">
<label for="">到达/出发：</label>
<select [(ngModel)]="filterItems.MVIN" class="form-control">
<select [(ngModel)]="filterItems.MVIN" (ngModelChange)="selectChange()" class="form-control">
<option value=""></option>
<option value="A">到达</option>
<option value="D">离港</option>
@@ -73,7 +73,7 @@
</div>
<div class="input-container mr-4">
<label for="">航站楼：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
<select [(ngModel)]="filterItems.TRML" class="form-control">
<select [(ngModel)]="filterItems.TRML" (ngModelChange)="selectChange()" class="form-control">
<option value=""></option>
<option value="T1">T1</option>
<option value="T2">T2</option>
@@ -135,8 +135,8 @@
</div>
</div>
<div class="airline-table">
<div class="table-container">
<table class="table table-bordered table-striped">
<div id="table-container" class="table-container">
<table id="table" class="table table-bordered table-striped">
<thead>
<tr>
<th>序号</th>
@@ -145,7 +145,7 @@
</tr>
</thead>
<tbody>
<tr *ngFor="let airline_row of render_data;let i = index" (click)="selectRow(i)" [ngClass]="{'active':row_state===i}">
<tr *ngFor="let airline_row of render_data;let i = index" (click)="selectRow(airline_row)" [ngClass]="{'selected':row_state['renderFlight']['FLNO']===airline_row['renderFlight']['FLNO']}">
<td>{{i+1}}</td>
<td></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>
src/app/pages/main/main.component.scss
+1 -1
View File
@@ -36,7 +36,7 @@
width: max-content;
tr{
cursor: pointer;
&.active{
&.selected{
background: rgb(181, 215, 255);
}
}
src/app/pages/main/main.component.ts
+239 -135
View File
@@ -7,7 +7,9 @@ import dateFormatter from '../../utils/data-formatter';
import routeType from '../../utils/route-type';
import flightType from '../../utils/flight-type';
import arriDept from '../../utils/arri-dept';
import { HttpParams } from '@angular/common/http';
import * as $ from 'jquery';
@Component({
selector: 'app-main',
templateUrl: './main.component.html',
@@ -24,13 +26,15 @@ export class MainComponent implements OnInit {
public combined_data: Array<object> = []; //组合数据，即链接航班，显示信息等组合好之后的数据
// public filter_data:Array<object> = []; //用于过滤和定位的数据
public render_data: Array<object> = []; //显示数据，即需要显示的数据
public col_lists: Array<object>; //列数据
public airline_color: Array<object> = [];
public row_state: number;
public row_state: any = { renderFlight: {} };
public TOP_1 = 1000000000000;
@@ -99,6 +103,7 @@ export class MainComponent implements OnInit {
}
ngOnInit() {
// console.log($)
this.changeDetectorRef.detach();
/* 获取显示列 */
this.httpCilent.get('/assets/mock-data/airline-col_code.json').subscribe(
@@ -117,7 +122,7 @@ export class MainComponent implements OnInit {
this.raw_data.push(JSON.parse(element.value));
});
let combined_linked_data = this.raw_data
let combined_linked_data = this.raw_data;
// this.combined_data = this.raw_data
//查找链接航班并将其组合成一条数据
@@ -187,156 +192,255 @@ export class MainComponent implements OnInit {
this.combined_data.push(row_flights)
})
//排序
this.combined_data.forEach(element => {
element['ORDER'] = this.sequence(element)
})
this.combined_data.sort(function (a, b) {
return (a['ORDER'] - b['ORDER']);
})
this.render_data = this.combined_data
this.changeDetectorRef.detectChanges();
this.doSequence(this.combined_data);
}
)
}
/**
* 过滤机定位
* @param filterItems
* @return
* 执行排序并渲染
*/
doSequence(sequenceData) {
sequenceData.forEach(element => {
element['ORDER'] = this.sequence(element);
})
inputFliter() {
let filterItems = this.filterItems;
let combined_data = this.combined_data;
let filter_data = [];
let sel_col = this.SEL_COL;
if (this.FLT_POS === 1) { //过滤
//手动输入框筛选
if(sel_col){
combined_data.forEach(item=>{
if(item['renderFlight'][sel_col]){
if (item['renderFlight'][sel_col].toString().match(new RegExp(this.SEARCH, 'i'))) {
filter_data.push(Object.assign({}, item))
}
}else{
if(!this.SEARCH){
filter_data.push(Object.assign({}, item))
}
}
})
}else{
combined_data.forEach(item => {
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'))) {
filter_data.push(Object.assign({}, item))
break;
}
} else {
continue;
}
}
}
})
}
//下拉框筛选
filter_data = filter_data.filter(item => {
if (this.isArriFlight(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;
}
}
}
return is_satis;
} else if (this.isDeptFlight(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;
}
}
})
this.render_data = filter_data;
} else { //定位
}
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
*/
//输入框回车事件
inputEnter() {
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 (this.isArriFlight(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;
}
}
}
return is_satis;
} else if (this.isDeptFlight(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);
} 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();
}
}
//输入框筛选
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;
}
}
})
} 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) {
is_satis = false;
continue;
} else {
is_satis = true;
break;
}
}
} else {
continue;
}
}
return is_satis;
})
}
}
this.render_data = filterData;
this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
this.changeDetectorRef.detectChanges();
}
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)
}
}
});
} 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];
}
} else {
alert('没有搜索到相关数据');
}
this.changeDetectorRef.detectChanges();
let tr = $(".selected");
let objTr = tr[0];
$("#table-container").animate({ scrollTop: objTr.offsetTop }, "slow");
}
/**
* 行排序规则方法