From f30867e92b8d273dd9983562416674620113f121 Mon Sep 17 00:00:00 2001 From: zhouyuejun <505127606@qq.com> Date: Thu, 15 Nov 2018 14:57:26 +0800 Subject: [PATCH] =?UTF-8?q?=E8=88=AA=E7=8F=AD=E5=AE=9A=E4=BD=8D=E5=8F=8A?= =?UTF-8?q?=E7=B2=BE=E7=A1=AE=E5=AE=9A=E4=BD=8D?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/pages/main/main.component.html | 16 +- src/app/pages/main/main.component.scss | 2 +- src/app/pages/main/main.component.ts | 374 ++++++++++++++++--------- 3 files changed, 248 insertions(+), 144 deletions(-) diff --git a/src/app/pages/main/main.component.html b/src/app/pages/main/main.component.html index 6eace4d..b8ad70b 100644 --- a/src/app/pages/main/main.component.html +++ b/src/app/pages/main/main.component.html @@ -14,7 +14,7 @@ 查找定位 - +
- @@ -73,7 +73,7 @@
- @@ -135,8 +135,8 @@
-
- +
+
@@ -145,7 +145,7 @@ - + diff --git a/src/app/pages/main/main.component.scss b/src/app/pages/main/main.component.scss index cf17098..61340d4 100644 --- a/src/app/pages/main/main.component.scss +++ b/src/app/pages/main/main.component.scss @@ -36,7 +36,7 @@ width: max-content; tr{ cursor: pointer; - &.active{ + &.selected{ background: rgb(181, 215, 255); } } diff --git a/src/app/pages/main/main.component.ts b/src/app/pages/main/main.component.ts index 5183987..40c8a99 100644 --- a/src/app/pages/main/main.component.ts +++ b/src/app/pages/main/main.component.ts @@ -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 = []; //组合数据，即链接航班，显示信息等组合好之后的数据 + // public filter_data:Array = []; //用于过滤和定位的数据 + public render_data: Array = []; //显示数据，即需要显示的数据 public col_lists: Array; //列数据 public airline_color: Array = []; - 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 = []; + 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"); + } /** * 行排序规则方法
序号
{{i+1}} {{airline_row['renderFlight'][airline_col.COL_CODE]}}