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

部分功能优化

Browse Source
This commit is contained in:
zhouyuejun
2019-01-30 18:14:24 +08:00
parent 70891c1640
commit 33a685e4ce
3 changed files with 195 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/pages/main/main.component.html
+27 -26
View File
@@ -1,4 +1,4 @@
<div class="main-page" >
<div class="main-page">
<div class="page-content" #pageContent>
<div class="search-filter mb-3" #searchFilter>
<div class="first-condition row">
@@ -178,31 +178,32 @@
<div class="list-view-phantom" [ngStyle]="{ 'height': wait_render_data.length * 42 + 'px' }"></div>
<table #tableContent id="table" class="table table-striped">
<tbody>
<tr *ngFor="let airline_row of render_data;let i = index" (click)="selectRow(airline_row)"
[ngClass]="{'selected':getSelectedRow(airline_row)}">
<td style="min-width:55px">{{start+i+1}}</td>
<td style="min-width:120px">
<img class="mr-2" *ngIf="getVipNotes(airline_row)" src="/adminweb/assets/images/important-notes/vip.png"
alt="">
<img class="mr-2" *ngIf="getOutplanNotes(airline_row)" src="/adminweb/assets/images/important-notes/out_plan.png"
alt="">
<img class="mr-2" *ngIf="getAlternateNotes(airline_row)" src="/adminweb/assets/images/important-notes/alternate.png"
alt="">
<img class="mr-2" *ngIf="getDelay30Notes(airline_row)" src="/adminweb/assets/images/important-notes/delay_30.png"
alt="">
<img class="mr-2" *ngIf="getDelayNotes(airline_row)" src="/adminweb/assets/images/important-notes/delay.png"
alt="">
<img class="mr-2" *ngIf="getReturnNotes(airline_row)" src="/adminweb/assets/images/important-notes/return.png"
alt="">
<img class="mr-2" *ngIf="getCancleNotes(airline_row)" src="/adminweb/assets/images/important-notes/cancle.png"
alt="">
<img class="mr-2" *ngIf="getStopoverNotes(airline_row)" src="/adminweb/assets/images/important-notes/stopover.png"
alt="">
</td>
<td style="min-width:165px">{{airline_row['renderFlight']['FLID']}}</td>
<td *ngFor="let airline_col of render_col_lists" [ngClass]="getPosition(airline_col.COL_CODE,airline_row)"
[ngStyle]="getColor(airline_col.COL_CODE,airline_row,airline_col.COL_WIDTH)">{{airline_row['renderFlight'][airline_col.COL_CODE]}}</td>
</tr>
<ng-container *ngFor="let airline_row of render_data;last as isLast;index as i">
<tr *ngIf="setWidth(isLast)" (click)="selectRow(airline_row)" [ngClass]="{'selected':getSelectedRow(airline_row)}">
<td style="min-width:55px">{{start+i+1}}</td>
<td style="min-width:120px">
<img class="mr-2" *ngIf="getVipNotes(airline_row)" src="/adminweb/assets/images/important-notes/vip.png"
alt="">
<img class="mr-2" *ngIf="getOutplanNotes(airline_row)" src="/adminweb/assets/images/important-notes/out_plan.png"
alt="">
<img class="mr-2" *ngIf="getAlternateNotes(airline_row)" src="/adminweb/assets/images/important-notes/alternate.png"
alt="">
<img class="mr-2" *ngIf="getDelay30Notes(airline_row)" src="/adminweb/assets/images/important-notes/delay_30.png"
alt="">
<img class="mr-2" *ngIf="getDelayNotes(airline_row)" src="/adminweb/assets/images/important-notes/delay.png"
alt="">
<img class="mr-2" *ngIf="getReturnNotes(airline_row)" src="/adminweb/assets/images/important-notes/return.png"
alt="">
<img class="mr-2" *ngIf="getCancleNotes(airline_row)" src="/adminweb/assets/images/important-notes/cancle.png"
alt="">
<img class="mr-2" *ngIf="getStopoverNotes(airline_row)" src="/adminweb/assets/images/important-notes/stopover.png"
alt="">
</td>
<td style="min-width:165px">{{airline_row['renderFlight']['FLID']}}</td>
<td *ngFor="let airline_col of render_col_lists" [ngClass]="getPosition(airline_col.COL_CODE,airline_row)"
[ngStyle]="getColor(airline_col.COL_CODE,airline_row,airline_col.COL_WIDTH)">{{airline_row['renderFlight'][airline_col.COL_CODE]}}</td>
</tr>
</ng-container>
</tbody>
</table>
</div>
src/app/pages/main/main.component.ts
+158 -73
View File
@@ -92,8 +92,9 @@ export class MainComponent implements OnInit {
public raw_data: Array<object> = []; //原始数据，未经过任何转换和组合
public combined_data: Array<object> = []; //组合数据，即链接航班，显示信息等组合好之后的数据
public wait_render_data: Array<object> = [];
public wait_render_data: Array<object> = []; //待显示的数据，实际显示从中截取可视区域高度可容纳的数据条数
public render_data: Array<object> = []; //显示数据，即需要显示的数据
public selectedFilterData: Array<object> = [];
public commonCol: Array<object>;
public col_lists: Array<object>; //列数据
@@ -101,7 +102,7 @@ export class MainComponent implements OnInit {
public airline_color: Array<object> = [];
public airline_message_alert: Array<object> = [];
public row_state: any = { renderFlight: {} };
public row_state: any = {};
public checkboxGroup = {
'related': false,
@@ -127,11 +128,6 @@ export class MainComponent implements OnInit {
ngOnInit() {
this.renderer2.setStyle(this.tableContainer.nativeElement, 'height', this.pageContent.nativeElement.offsetHeight - this.searchFilter.nativeElement.offsetHeight - 35 + 'px');
this.renderer2.setStyle(this.tableBody.nativeElement, 'height', this.tableContainer.nativeElement.offsetHeight - this.tableHead.nativeElement.offsetHeight + 'px');
if (!this.tabClose) {
this.renderer2.setStyle(this.tabContainer.nativeElement, 'height', this.pageContent.nativeElement.offsetHeight - this.searchFilter.nativeElement.offsetHeight - 35 + 'px');
}
window.onresize = function () {
this.calcVisibleCount();
}.bind(this)
@@ -142,7 +138,7 @@ export class MainComponent implements OnInit {
let data = JSON.parse(event as string);
if (data.topic === 'schd') {
let message = JSON.parse(data.message);
console.log(message);
// console.log(message);
//是否可以开始处理动态消息
if (this.canHandleDynamicMessage) {
this.dynamicMessageHandle(message);
@@ -151,7 +147,7 @@ export class MainComponent implements OnInit {
}
} else if (data.topic === 'msg') {
let message = JSON.parse(data.message);
console.log(message);
// console.log(message);
if (this.canHandleDynamicAlert) {
this.dynamicAlertHandle(message);
} else {
@@ -248,7 +244,6 @@ export class MainComponent implements OnInit {
)
}
/**
* 数据组合完毕，执行排序、渲染以及动态信息处理
* @param combined_data
@@ -272,22 +267,17 @@ export class MainComponent implements OnInit {
return (a['ORDER'] - b['ORDER']);
})
//计算可视区域高度，渲染数据
this.calcVisibleCount()
this.wait_render_data = combined_data;
this.visibleCount = Math.ceil(this.tableBody.nativeElement.clientHeight / this.trItemHeight);
const scrollTop = this.tableBody.nativeElement.scrollTop;
const fixedScrollTop = scrollTop - scrollTop % this.trItemHeight;
this.tableContent.nativeElement.style.webkitTransform = `translateY(${fixedScrollTop}px)`;
this.start = Math.floor(scrollTop / this.trItemHeight);
this.end = this.start + this.visibleCount;
this.selectedFilterData = combined_data;
this.render_data = this.wait_render_data.slice(this.start, this.end);
setTimeout(() => {
$(".table-body tbody>tr").eq(0).find('td').each((index, element) => {
$(".table-head table thead tr").eq(0).find('th').eq(index).attr('width', $(element).innerWidth() + 'px');
})
}, 500)
this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
//默认选中第一条
if (this.render_data.length > 0) {
this.row_state = this.render_data[0];
}
this.operateSpinServiceService.hideSpin();
//开始处理动态消息
@@ -303,6 +293,19 @@ export class MainComponent implements OnInit {
this.dynamicAlertArray = [];
}
/**
* 设置动态设置单元格的宽度
* @param isLast
*/
setWidth(isLast) {
if (isLast) {
$(".table-body tbody>tr").eq(0).find('td').each((index, element) => {
$(".table-head table thead tr").eq(0).find('th').eq(index).attr('width', $(element).innerWidth() + 'px');
})
}
return true;
}
/**
* 纵向滚动条滚动渲染数据
*/
@@ -314,11 +317,6 @@ export class MainComponent implements OnInit {
this.start = Math.floor(scrollTop / this.trItemHeight);
this.end = this.start + this.visibleCount;
this.render_data = this.wait_render_data.slice(this.start, this.end);
setTimeout(() => {
$(".table-body tbody>tr").eq(0).find('td').each((index, element) => {
$(".table-head table thead tr").eq(0).find('th').eq(index).attr('width', $(element).innerWidth() + 'px');
})
}, 500)
}
/**
@@ -338,11 +336,6 @@ export class MainComponent implements OnInit {
this.start = Math.floor(scrollTop / this.trItemHeight);
this.end = this.start + this.visibleCount;
this.render_data = this.wait_render_data.slice(this.start, this.end);
setTimeout(() => {
$(".table-body tbody>tr").eq(0).find('td').each((index, element) => {
$(".table-head table thead tr").eq(0).find('th').eq(index).attr('width', $(element).innerWidth() + 'px');
})
}, 500)
}
/**
@@ -356,7 +349,6 @@ export class MainComponent implements OnInit {
}, 10)
}
/**
* 刷新
*/
@@ -422,7 +414,6 @@ export class MainComponent implements OnInit {
)
}
/**
* 动态消息处理方法
* @param message
@@ -456,15 +447,6 @@ export class MainComponent implements OnInit {
this.flightTypeSelections = e.data.flightTypeSelections;
this.selectChange('dynamic');
}.bind(this);
// const promise = this.webWorkerService.run(webWorkerHandle, dynamicData);
// promise.then(function (response) {
// this.combined_data = response.combined_data;
// this.raw_data = response.raw_data;
// this.airlinesSelections = response.airlinesSelections;
// this.flightTypeSelections = response.flightTypeSelections;
// this.selectChange('dynamic');
// this.webWorkerService.terminate(promise);
// }.bind(this));
}
/**
@@ -529,8 +511,6 @@ export class MainComponent implements OnInit {
}
}
/**
* 过滤及定位
* @param filterItems
@@ -549,8 +529,6 @@ export class MainComponent implements OnInit {
FTSS: '', //运营状态
TRML: '', //航站楼
Abnormal_state: '', //异常状态
// Start_time: '',
// End_time: '',
FHAG: '', //机坪代理
MHAG: '', //维护代理
PHAG: '', //旅客代理
@@ -563,7 +541,9 @@ export class MainComponent implements OnInit {
if (this.FLT_POS === 1) {
this.LAST_SEL_COL = this.SEL_COL;
this.LASTSEARCH = this.SEARCH;
this.selectChange('filter')
// this.selectChange('filter')
this.operateSpinServiceService.showSpin();
this.inputFilter(this.selectedFilterData);
} else {
this.inputPosition(this.render_data)
}
@@ -576,7 +556,7 @@ export class MainComponent implements OnInit {
if (type === 'filter') {
this.operateSpinServiceService.showSpin();
}
// setTimeout(() => {
let filter_data = [];
let filterItems = this.filterItems;
this.combined_data.forEach(item => {
@@ -699,21 +679,51 @@ export class MainComponent implements OnInit {
}
}
})
this.selectedFilterData = filter_data;
if (this.FLT_POS === 1) {
this.inputFilter(filter_data);
} else {
this.wait_render_data = filter_data;
this.render_data = this.wait_render_data.slice(this.start, this.end);
setTimeout(() => {
$(".table-body tbody>tr").eq(0).find('td').each((index, element) => {
$(".table-head table thead tr").eq(0).find('th').eq(index).attr('width', $(element).innerWidth() + 'px');
})
}, 500)
// this.render_data = filter_data;
this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
let hasSelectedRow: boolean = false;
for (let i = 0; i < this.wait_render_data.length; i++) {
let flight = this.wait_render_data[i];
if (flight['preFlight'] && !flight['reaFlight']) {
if (this.row_state['preFlight'] && !this.row_state['reaFlight']) {
if (flight['preFlight']['FLID'] === this.row_state['preFlight']['FLID']) {
this.row_state = flight;
hasSelectedRow = true;
break;
}
}
} else if (!flight['preFlight'] && flight['reaFlight']) {
if (!this.row_state['preFlight'] && this.row_state['reaFlight']) {
if (flight['reaFlight']['FLID'] === this.row_state['reaFlight']['FLID']) {
this.row_state = flight;
hasSelectedRow = true;
break;
}
}
} else {
if (this.row_state['preFlight'] && this.row_state['reaFlight']) {
if ((flight['preFlight']['FLID'] === this.row_state['preFlight']['FLID']) && (flight['reaFlight']['FLID'] === this.row_state['reaFlight']['FLID'])) {
this.row_state = flight;
hasSelectedRow = true;
break;
}
}
}
}
if (!hasSelectedRow) {
if (this.render_data.length > 0) {
this.row_state = this.render_data[0];
}
}
this.operateSpinServiceService.hideSpin();
}
// }, 10)
}
/**
@@ -726,7 +736,7 @@ export class MainComponent implements OnInit {
let sel_col = this.LAST_SEL_COL;
filterData = filterData.filter(item => {
if (item['renderFlight'][sel_col]) {
if (item['renderFlight'][sel_col].toString().match(new RegExp(this.SEARCH, 'i'))) {
if (item['renderFlight'][sel_col].toString().match(new RegExp(this.LASTSEARCH, 'i'))) {
return true;
}
} else {
@@ -758,20 +768,49 @@ export class MainComponent implements OnInit {
}
this.wait_render_data = filterData;
this.render_data = this.wait_render_data.slice(this.start, this.end);
setTimeout(() => {
$(".table-body tbody>tr").eq(0).find('td').each((index, element) => {
$(".table-head table thead tr").eq(0).find('th').eq(index).attr('width', $(element).innerWidth() + 'px');
})
}, 500)
// this.render_data = filterData;
// this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
let hasSelectedRow: boolean = false;
for (let i = 0; i < this.wait_render_data.length; i++) {
let flight = this.wait_render_data[i];
if (flight['preFlight'] && !flight['reaFlight']) {
if (this.row_state['preFlight'] && !this.row_state['reaFlight']) {
if (flight['preFlight']['FLID'] === this.row_state['preFlight']['FLID']) {
this.row_state = flight;
hasSelectedRow = true;
break;
}
}
} else if (!flight['preFlight'] && flight['reaFlight']) {
if (!this.row_state['preFlight'] && this.row_state['reaFlight']) {
if (flight['reaFlight']['FLID'] === this.row_state['reaFlight']['FLID']) {
this.row_state = flight;
hasSelectedRow = true;
break;
}
}
} else {
if (this.row_state['preFlight'] && this.row_state['reaFlight']) {
if ((flight['preFlight']['FLID'] === this.row_state['preFlight']['FLID']) && (flight['reaFlight']['FLID'] === this.row_state['reaFlight']['FLID'])) {
this.row_state = flight;
hasSelectedRow = true;
break;
}
}
}
}
if (!hasSelectedRow) {
if (this.render_data.length > 0) {
this.row_state = this.render_data[0];
}
}
this.operateSpinServiceService.hideSpin();
}
/**
* 输入框定位
*/
positionArray: Array<any> = [];
positionedArray: Array<any> = [];
positionArrayIndex: number = 0;
inputPosition(filterData) {
@@ -813,16 +852,16 @@ export class MainComponent implements OnInit {
}
if (transArray.length > 0) {
if (transArray.toString() == this.positionArray.toString()) {
if (transArray.toString() == this.positionedArray.toString()) {
this.positionArrayIndex++;
if (this.positionArrayIndex === this.positionArray.length) {
if (this.positionArrayIndex === this.positionedArray.length) {
this.positionArrayIndex = 0;
}
this.row_state = this.positionArray[this.positionArrayIndex];
this.row_state = this.positionedArray[this.positionArrayIndex];
} else {
this.positionArray = transArray;
this.positionedArray = transArray;
this.positionArrayIndex = 0;
this.row_state = this.positionArray[this.positionArrayIndex];
this.row_state = this.positionedArray[this.positionArrayIndex];
}
} else {
alert('没有搜索到相关数据');
@@ -1161,4 +1200,50 @@ export class MainComponent implements OnInit {
}, 10)
}
}
}
}
// if (this.SEL_COL) {
// let sel_col = this.SEL_COL;
// for (let i = 0; i < filterData.length; i++) {
// let fliterElement = filterData[i];
// if (fliterElement['renderFlight'][sel_col]) {
// if (fliterElement['renderFlight'][sel_col].toString().match(new RegExp(this.SEARCH, 'i'))) {
// let positionedIsMarry = false;
// for (let k = 0; k < this.positionedArray.length; k++) {
// let positionedElement = this.positionedArray[k];
// if (positionedElement['preFlight'] && !positionedElement['reaFlight']) {
// if (fliterElement['preFlight'] && !fliterElement['reaFlight']) {
// if (positionedElement['preFlight']['FLID'] === fliterElement['preFlight']['FLID']) {
// positionedIsMarry = true;
// break;
// }
// }
// } else if (!positionedElement['preFlight'] && positionedElement['reaFlight']) {
// if (!fliterElement['preFlight'] && fliterElement['reaFlight']) {
// if (positionedElement['reaFlight']['FLID'] === fliterElement['reaFlight']['FLID']) {
// positionedIsMarry = true;
// break;
// }
// }
// } else {
// if (fliterElement['preFlight'] && fliterElement['reaFlight']) {
// if ((positionedElement['preFlight']['FLID'] === fliterElement['preFlight']['FLID']) && (positionedElement['reaFlight']['FLID'] === fliterElement['reaFlight']['FLID'])) {
// positionedIsMarry = true;
// break;
// }
// }
// }
// };
// if(!positionedIsMarry){
// this.row_state = fliterElement;
// this.positionedArray.push(fliterElement);
// break;
// }
// }
// }
// }
// }
src/app/pages/main/related-tab/related-tab.component.ts
+10 -10
View File
@@ -62,7 +62,7 @@ export class RelatedTabComponent implements OnInit {
if (delyIndex > -1) {
let delyMessage = this.lines.preFlight['ABN'][delyIndex].BODY
this.predelay = delyMessage[delyMessage.length - 1];
this.predelay = Object.assign({}, delyMessage[delyMessage.length - 1]);
let fimsFlightstatusDefinition = null;
if (this.flightDefinitions && this.flightDefinitions.length > 0) {
@@ -81,13 +81,13 @@ export class RelatedTabComponent implements OnInit {
this.predelay['DURA'] = parseInt(this.predelay['DURA'].substr(0, 2)) * 3600000 + parseInt(this.predelay['DURA'].substr(2, 3)) * 60000 + this.predelay['STRT']
}
if (cancleIndex > -1) {
this.precancle = this.lines.preFlight['ABN'][cancleIndex].BODY;
this.precancle = new Date(dateFormatter(this.precancle)).getTime();
let cancle = this.lines.preFlight['ABN'][cancleIndex].BODY;
this.precancle = new Date(dateFormatter(cancle)).getTime();
}
if (fdivIndex > -1) {
let fdiv = this.lines.preFlight['ABN'][fdivIndex].BODY;
if (fdiv.DDES) {
this.prefdiv = fdiv;
this.prefdiv = Object.assign({}, fdiv);
let airportIndex = this.allAirports.findIndex(val => val.airportCodeIata === this.prefdiv.DDES);
if (airportIndex > -1) {
this.prefdiv.DDES = this.allAirports[airportIndex].briefNameChn
@@ -97,7 +97,7 @@ export class RelatedTabComponent implements OnInit {
if (fretIndex > -1) {
let fret = this.lines.preFlight['ABN'][fretIndex].BODY;
if (fret.VALUE && fret.REID) {
this.prefret = fret;
this.prefret = Object.assign({}, fret);
}
}
}
@@ -109,7 +109,7 @@ export class RelatedTabComponent implements OnInit {
if (delyIndex > -1) {
let delyMessage = this.lines.reaFlight['ABN'][delyIndex].BODY
this.readelay = delyMessage[delyMessage.length - 1];
this.readelay = Object.assign({}, delyMessage[delyMessage.length - 1]);
let fimsFlightstatusDefinition = null;
if (this.flightDefinitions && this.flightDefinitions.length > 0) {
@@ -129,13 +129,13 @@ export class RelatedTabComponent implements OnInit {
this.readelay['DURA'] = parseInt(this.readelay['DURA'].substr(0, 2)) * 3600000 + parseInt(this.readelay['DURA'].substr(2, 3)) * 60000 + this.readelay['STRT'];
}
if (cancleIndex > -1) {
this.reacancle = this.lines.reaFlight['ABN'][cancleIndex].BODY;
this.reacancle = new Date(dateFormatter(this.reacancle)).getTime();
let cancle = this.lines.reaFlight['ABN'][cancleIndex].BODY;
this.reacancle = new Date(dateFormatter(cancle)).getTime();
}
if (fdivIndex > -1) {
let fdiv = this.lines.reaFlight['ABN'][fdivIndex].BODY;
if (fdiv.DDES) {
this.reafdiv = fdiv;
this.reafdiv = Object.assign({}, fdiv);
let airportIndex = this.allAirports.findIndex(val => val.airportCodeIata === this.reafdiv.DDES);
if (airportIndex > -1) {
this.reafdiv.DDES = this.allAirports[airportIndex].briefNameChn
@@ -146,7 +146,7 @@ export class RelatedTabComponent implements OnInit {
if (fretIndex > -1) {
let fret = this.lines.reaFlight['ABN'][fretIndex].BODY;
if (fret.VALUE && fret.REID) {
this.reafret = fret;
this.reafret = Object.assign({}, fret);
}
}
}