Skip to content

M
muChangApp
Commit 6aae8883 authored by yating.lin's avatar yating.lin
Browse files
Options

修改预警页显示数据个数（分页）

parent 6e8680c6
Show whitespace changes
Inline Side-by-side
Showing with 103 additions and 23 deletions
src/app/envCtrl/env-alarm-detail/env-alarm-detail.page.html
View file @ 6aae8883
......@@ -94,6 +94,13 @@
</div>
</div>
</div>
<ion-list id="list"></ion-list>
<ion-infinite-scroll threshold="100px" id="infinite-scroll">
<ion-infinite-scroll-content loading-spinner="bubbles" loading-text="">
</ion-infinite-scroll-content>
</ion-infinite-scroll>
</div>
</ion-content>
......
src/app/envCtrl/env-alarm-detail/env-alarm-detail.page.ts
View file @ 6aae8883
......@@ -26,6 +26,10 @@ export class EnvAlarmDetailPage implements OnInit {
stopTime = null;
curInterval = 12;
page = 0;
rows = 10;
displayLength = 0;
// 工作模式
workModeSetting = {
'workMode': '风机',
......@@ -33,7 +37,7 @@ export class EnvAlarmDetailPage implements OnInit {
'workModeOld': '1'
};
// commTmr: any;
infiniteScroll = document.getElementById('infinite-scroll');
constructor(private ac: ActivatedRoute, private api: Api,
private alterContoller: AlertController, private datePipe: DatePipe) {
......@@ -41,15 +45,6 @@ export class EnvAlarmDetailPage implements OnInit {
ngOnInit() {
this.init();
// this.commTmr = window.setInterval(() => {
// console.log(1);
// if (this.displayArea === 'trouble') {
// this.showAlarmList = this.troubleList;
// } else {
// this.showAlarmList = this.alarmList;
// }
//
// }, 1000) ;
}
init() {
......@@ -60,9 +55,77 @@ export class EnvAlarmDetailPage implements OnInit {
this.setDateInterval(this.curInterval);
this.showArea(data.displayArea);
this.getData();
});
}
getData() {
this.infiniteScroll.addEventListener('ionInfinite', async function () {
if (this.displayLength < this.detailInfoLength) {
console.log('Loading data...');
await this.wait(500);
this.infiniteScroll.complete();
this.appendPage();
console.log('Done');
} else {
console.log('No More Data');
this.infiniteScroll.disabled = true;
}
});
}
appendPage() {
this.page = this.page + 1;
this.getTroubleList();
this.getAlarmList();
});
}
appendItems() {
const originalLength = length;
for (let i = 0; i < 10; i++) {
const el = document.createElement('div');
el.innerHTML = `
<div class="title">
<div><img [src]="'../../assets/img/' + item.fieldDeviceType + '.png'" class="deviceIcon"></div>
<p style="font-size: 14px">{{item.troubleTime}}</p>
</div>
<div class="body">
<h3 style="margin-bottom: 5px;">{{item.description}}</h3>
<div>
<div style="width:65%; float: left">
<div *ngIf="item.data !== null && item.data.temp !== undefined && item.data.temp !== null && item.data.temp !== ''"
class="warnContent">温度: {{item.data.temp}} ℃</div>
<div *ngIf="item.data !== null && item.data.humi !== undefined && item.data.humi !== null && item.data.humi !== ''"
class="warnContent">湿度: {{item.data.humi}} %</div>
<div *ngIf="item.data !== null && item.data.heatStressLevel !== undefined && item.data.heatStressLevel !== null && item.data.heatStressLevel !== ''"
class="warnContent">热应激等级: {{item.data.heatStressLevel}}</div>
<div *ngIf="item.data !== null && item.data.liquidPump !== undefined && item.data.liquidPump !== null && item.data.liquidPump !== ''"
class="warnContent">供液泵压力: {{item.data.liquidPump}} MPa</div>
<div *ngIf="item.data !== null && item.data.press !== undefined && item.data.press !== null && item.data.press !== ''"
class="warnContent">电磁阀压力: {{item.data.press}} MPa</div>
<div *ngIf="item.data !== null && item.data.NH3 !== undefined && item.data.NH3 !== null && item.data.NH3 !== ''"
class="warnContent">氨气: {{item.data.NH3}} ppm</div>
</div>
<div style="width:35%; float: left">
<div *ngIf="displayArea === 'trouble' && item.disposeState === 0" >
<ion-button color="secondary" style="display: inline-block; width: 55px; height: 30px; font-size: 12px; border-radius: 20px;"
(click)="onRecvClick(item)">确认修复</ion-button>
</div>
<img *ngIf="displayArea === 'trouble' && item.disposeState === 1"
[src]="'../../assets/img/troubleDisposeState' + item.disposeState + '.png'" class="warnIcon">
<img *ngIf="displayArea === 'alarm'"
[src]="'../../assets/img/disposeState' + item.disposeState + '.png'" class="warnIcon">
</div>
</div>
</div>
`;
list.appendChild(el);
length++;
}
}
setDateInterval(interval) {
......@@ -92,14 +155,16 @@ export class EnvAlarmDetailPage implements OnInit {
if (this.fieldDeviceType !== null && this.fieldDeviceType !== '' && this.fieldDeviceType !== '全部') {
req.fieldDeviceType = this.fieldDeviceType;
}
this.api.troubleLog.getByTerm([req, (data) => {
this.api.troubleLog.getByTerm(this.page, this.rows, [req, (data) => {
this.detailInfo = data;
if (data.trouble && data.trouble.constructor === Array) {
data.trouble.forEach((value) => {
value.troubleTime = this.api.formatTime('yyyy-MM-dd hh:mm:ss', new Date(value.troubleTime));
});
this.setTrouble(data);
}
// if (data.trouble && data.trouble.constructor === Array) {
// data.trouble.forEach((value) => {
// value.troubleTime = this.api.formatTime('yyyy-MM-dd hh:mm:ss', new Date(value.troubleTime));
// });
// this.setTrouble(data);
// }
this.appendItems();
}]);
}
}
......@@ -121,7 +186,7 @@ export class EnvAlarmDetailPage implements OnInit {
if (this.fieldDeviceType !== null && this.fieldDeviceType !== '' && this.fieldDeviceType !== '全部') {
req.fieldDeviceType = this.fieldDeviceType;
}
this.api.alarm.getCowshedAlarm([req, (data) => {
this.api.alarm.getCowshedAlarm(this.page, this.rows, [req, (data) => {
this.detailInfo = data;
if (data.trouble && data.trouble.constructor === Array) {
data.trouble.forEach((value) => {
......@@ -232,4 +297,12 @@ export class EnvAlarmDetailPage implements OnInit {
this.getTroubleList();
this.getAlarmList();
}
wait(time) {
return new Promise(resolve => {
setTimeout(() => {
resolve();
}, time);
});
}
}
src/app/service/api.ts
View file @ 6aae8883
......@@ -62,7 +62,7 @@ export class Api {
public troubleLog = {
// 根据条件获取所有的故障信息
getByTerm: (data) => this.trans('post', '/troubleLog/getByTerm', data),
getByTerm: (page, rows, data) => this.trans('post', '/troubleLog/getByTerm?page=' + page + '&rows=' + rows, data),
// 处理故障
processingFailure: (data) => this.trans('post', '/troubleLog/processingFailure', data),
}
......@@ -82,7 +82,7 @@ export class Api {
getAlarmByTerm: (data) => this.trans('post', '/alarm/getAlarmByTerm', data),
getAllAlarm: (data) => this.trans('get', '/alarm/getAllAlarm', data),
getByTerm: (data) => this.trans('post', '/alarm/getByTerm', data),
getCowshedAlarm: (data) => this.trans('post', '/alarm/getCowshedAlarm', data),
getCowshedAlarm: (page, rows, data) => this.trans('post', '/alarm/getCowshedAlarm?page=' + page + '&rows=' + rows, data),
getLatestAlarm: (data) => this.trans('get', '/alarm/getLatestAlarm', data)
};
......
tslint.json
View file @ 6aae8883
......@@ -29,7 +29,7 @@
"label-position": true,
"max-line-length": [
true,
140
200
],
"member-access": false,
"member-ordering": [
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment