Skip to content

M
muChangApp
Commit 2ea83299 authored by yating.lin's avatar yating.lin
Browse files
Options

修改告警页 告警详情页

parent 6c74cf51
Hide whitespace changes
Inline Side-by-side
Showing with 82 additions and 63 deletions
src/app/envCtrl/env-alarm-detail/env-alarm-detail.page.html
View file @ 2ea83299
...@@ -7,57 +7,60 @@ ...@@ -7,57 +7,60 @@
<ion-title class="appTitle">{{fieldRegionName}}告警详情</ion-title> <ion-title class="appTitle">{{fieldRegionName}}告警详情</ion-title>
</ion-toolbar> </ion-toolbar>
</ion-header> <div>
<ion-segment scrollable style="position: sticky; margin-top:10px;" color="secondary" (click)="segmentChanged($event)">
<ion-content color="light" style="background-color: #F3F4F4;"> <ion-segment-button value="trouble" [checked]="isTroubleDis">
<ion-segment scrollable style="position: sticky; margin-top:10px;" color="secondary" (click)="segmentChanged($event)"> <ion-label>故障</ion-label>
<ion-segment-button value="trouble" [checked]="isTroubleDis"> </ion-segment-button>
<ion-label>故障</ion-label> <ion-segment-button value="alarm" [checked]="isAlarmDis">
</ion-segment-button> <ion-label>预警</ion-label>
<ion-segment-button value="alarm" [checked]="isAlarmDis"> </ion-segment-button>
<ion-label>预警</ion-label> </ion-segment>
</ion-segment-button>
</ion-segment>
<ion-item lines="full" class="ionItem" color="gray"> <ion-item lines="full" class="ionItem" color="gray">
<ion-select interface="popover" placeholder="状态" [(ngModel)]="disposeState" (click)="refresh()" id="selectState"> <ion-select interface="popover" placeholder="状态" [(ngModel)]="disposeState" (click)="refresh()" id="selectState">
<ion-select-option value="全部" class="popLabel">全部</ion-select-option> <ion-select-option value="全部" class="popLabel">全部</ion-select-option>
<ion-select-option value="0" class="popLabel">待修复</ion-select-option> <ion-select-option value="0" class="popLabel">待修复</ion-select-option>
<ion-select-option value="1" class="popLabel">已修复</ion-select-option> <ion-select-option value="1" class="popLabel">已修复</ion-select-option>
</ion-select> </ion-select>
<ion-select interface="popover" placeholder="类型" [(ngModel)]="fieldDeviceType" (click)="refresh()" id="selectType"> <ion-select interface="popover" placeholder="类型" [(ngModel)]="fieldDeviceType" (click)="refresh()" id="selectType">
<ion-select-option value="全部" class="popLabel">全部</ion-select-option> <ion-select-option value="全部" class="popLabel">全部</ion-select-option>
<ion-select-option value="环境" class="popLabel">环境</ion-select-option> <ion-select-option value="环境" class="popLabel">环境</ion-select-option>
<ion-select-option value="风机" class="popLabel">风机</ion-select-option> <ion-select-option value="风机" class="popLabel">风机</ion-select-option>
<ion-select-option value="喷淋" class="popLabel">喷淋</ion-select-option> <ion-select-option value="喷淋" class="popLabel">喷淋</ion-select-option>
<ion-select-option value="照明" class="popLabel">照明</ion-select-option> <ion-select-option value="照明" class="popLabel">照明</ion-select-option>
<ion-select-option value="水槽" class="popLabel">水槽</ion-select-option> <ion-select-option value="水槽" class="popLabel">水槽</ion-select-option>
</ion-select> </ion-select>
</ion-item> </ion-item>
<ion-item lines="full" class="ionItem" style="height: 45px;"> <ion-item lines="full" class="ionItem" style="height: 45px;">
<div style="width: 28%"> <div style="width: 28%">
<ion-datetime style="position: relative;" displayFormat="YYYY/MM" cancelText="取消" doneText="确认" [(ngModel)]="startTime" (click)="refresh()" id="selectStartTime"></ion-datetime> <ion-datetime style="position: relative;" displayFormat="YYYY/MM" cancelText="取消" doneText="确认" [(ngModel)]="startTime" (click)="refresh()" id="selectStartTime"></ion-datetime>
</div>
<div style="width: 2%">
<span>~</span>
</div>
<div style="width: 30%">
<ion-datetime style="position: relative;" displayFormat="YYYY/MM" cancelText="取消" doneText="确认" [(ngModel)]="stopTime" style="margin-left: 3px;" (click)="refresh()" id="selectStopTime"></ion-datetime>
</div>
<div style="width: 40%">
<div class="note" style="margin-bottom: 5px;">
<span style="text-align: right; padding-right:5px; width:60%;">未解决数</span>
<span style="width:40%" *ngIf="isTroubleDis">{{detailInfo.devErr}}</span>
<span style="width:40%" *ngIf="isAlarmDis">{{detailInfo.alarm}}</span>
</div> </div>
<div class="note"> <div style="width: 2%">
<span style="text-align: right; padding-right:5px; width:60%;">总数</span> <span>~</span>
<span style="width:40%" *ngIf="isTroubleDis">{{detailInfo.devErrTotal}}</span>
<span style="width:40%" *ngIf="isAlarmDis">{{detailInfo.alarmTotal}}</span>
</div> </div>
</div> <div style="width: 30%">
</ion-item> <ion-datetime style="position: relative;" displayFormat="YYYY/MM" cancelText="取消" doneText="确认" [(ngModel)]="stopTime" style="margin-left: 3px;" (click)="refresh()" id="selectStopTime"></ion-datetime>
</div>
<div style="width: 40%">
<div class="note" style="margin-bottom: 5px;">
<span style="text-align: right; padding-right:5px; width:60%;">未解决数</span>
<span style="width:40%" *ngIf="isTroubleDis">{{detailInfo.devErr}}</span>
<span style="width:40%" *ngIf="isAlarmDis">{{detailInfo.alarm}}</span>
</div>
<div class="note">
<span style="text-align: right; padding-right:5px; width:60%;">总数</span>
<span style="width:40%" *ngIf="isTroubleDis">{{detailInfo.devErrTotal}}</span>
<span style="width:40%" *ngIf="isAlarmDis">{{detailInfo.alarmTotal}}</span>
</div>
</div>
</ion-item>
</div>
</ion-header>
<ion-content color="light" style="background-color: #F3F4F4;" scroll="false">
<div style="padding:5px;"> <div style="padding:5px;">
<div class="detailContent"> <div class="detailContent">
...@@ -95,7 +98,7 @@ ...@@ -95,7 +98,7 @@
</div> </div>
<!--<ion-list id="troubleList"></ion-list>--> <!--<ion-list id="troubleList"></ion-list>-->
<ion-infinite-scroll threshold="100px" (ionInfinite)="loadData($event)"> <ion-infinite-scroll threshold="100px" (ionInfinite)="loadData($event)" id="infiniteScroll">
<ion-infinite-scroll-content <ion-infinite-scroll-content
loadingSpinner="bubbles" loadingSpinner="bubbles"
loadingText="加载中..."> loadingText="加载中...">
......
src/app/envCtrl/env-alarm-detail/env-alarm-detail.page.ts
View file @ 2ea83299
...@@ -21,7 +21,7 @@ export class EnvAlarmDetailPage implements OnInit { ...@@ -21,7 +21,7 @@ export class EnvAlarmDetailPage implements OnInit {
detailInfo: any = {}; detailInfo: any = {};
troubleList = []; troubleList = [];
// detailInfoLength = 0; detailInfoLength = 0;
disposeState = ''; disposeState = '';
fieldDeviceType = ''; fieldDeviceType = '';
startTime = null; startTime = null;
...@@ -127,8 +127,8 @@ export class EnvAlarmDetailPage implements OnInit { ...@@ -127,8 +127,8 @@ export class EnvAlarmDetailPage implements OnInit {
if (isInit) { if (isInit) {
this.detailInfo = data; this.detailInfo = data;
} }
this.detailInfoLength = data.devErrTotal;
this.appendItems(data.trouble, data.devErrTotal); this.appendItems(data.trouble, data.devErrTotal);
// this.detailInfoLength = data.trouble.length;
}]); }]);
} }
} }
...@@ -159,8 +159,8 @@ export class EnvAlarmDetailPage implements OnInit { ...@@ -159,8 +159,8 @@ export class EnvAlarmDetailPage implements OnInit {
if (isInit) { if (isInit) {
this.detailInfo = data; this.detailInfo = data;
} }
this.detailInfoLength = data.alarmTotal;
this.appendItems(data.trouble, data.alarmTotal); this.appendItems(data.trouble, data.alarmTotal);
// this.detailInfoLength = data.trouble.length;
}]); }]);
} }
} }
...@@ -176,33 +176,39 @@ export class EnvAlarmDetailPage implements OnInit { ...@@ -176,33 +176,39 @@ export class EnvAlarmDetailPage implements OnInit {
} }
// this.infiniteScroll.disabled = false; // this.infiniteScroll.disabled = false;
this.page = this.page + 1; this.page = this.page + 1;
console.log(this.infiniteScroll.disabled);
} else { } else {
document.getElementById('infiniteScroll').setAttribute('disabled', 'disabled');
// this.infiniteScroll.disabled = true; // this.infiniteScroll.disabled = true;
} }
} }
loadData(event) { async loadData(event) {
setTimeout(() => { setTimeout(async () => {
console.log('loadData Done'); console.log('loadData Done');
this.getTroubleList(false); this.getTroubleList(false);
this.getAlarmList(false); this.getAlarmList(false);
event.target.complete(); event.target.complete();
// App logic to determine if all data is loaded // App logic to determine if all data is loaded
// and disable the infinite scroll // and disable the infinite scroll
// if (data.length == 1000) { await this.wait(1000);
// event.target.disabled = true; if (this.troubleList.length === this.detailInfoLength) {
// } event.target.disabled = true;
}, 500); }
}, 1000);
} }
segmentChanged(ev: any) { segmentChanged(ev: any) {
console.log('segment changed'); console.log('segment changed');
console.log(this.infiniteScroll.disabled);
this.page = 1; this.page = 1;
this.disposeState = ''; this.disposeState = '';
this.fieldDeviceType = ''; this.fieldDeviceType = '';
this.detailInfo = {}; this.detailInfo = {};
this.troubleList = []; this.troubleList = [];
this.infiniteScroll.disabled = false; this.infiniteScroll.disabled = false;
console.log(this.infiniteScroll.disabled);
document.getElementById('infiniteScroll').removeAttribute('disabled');
if (ev.target.value === 'alarm') { if (ev.target.value === 'alarm') {
this.displayArea = 'alarm'; this.displayArea = 'alarm';
this.getAlarmList(true); this.getAlarmList(true);
......
src/app/envCtrl/env-alarm/env-alarm.page.html
View file @ 2ea83299
...@@ -5,7 +5,9 @@ ...@@ -5,7 +5,9 @@
</ion-header> </ion-header>
<ion-content color="light"> <ion-content color="light">
<ion-refresher slot="fixed" (ionRefresh)="doRefresh($event)">
<ion-refresher-content></ion-refresher-content>
</ion-refresher>
<ion-card *ngFor="let item of alarmItems" style="margin-top:10px; margin-bottom:0px;"> <ion-card *ngFor="let item of alarmItems" style="margin-top:10px; margin-bottom:0px;">
<ion-card-header style="padding-top: 3px; padding-bottom: 3px;"> <ion-card-header style="padding-top: 3px; padding-bottom: 3px;">
<ion-card-title style="display: inline-block" style="width:100%"> <ion-card-title style="display: inline-block" style="width:100%">
...@@ -16,7 +18,7 @@ ...@@ -16,7 +18,7 @@
<span class="alarmNum">{{item.total}}</span> <span class="alarmNum">{{item.total}}</span>
</div> </div>
<div style="width: 30%; padding-right: 5px; display: inline-block; font-size: 13px; color:#61C7CC"> <div style="width: 30%; padding-right: 5px; display: inline-block; font-size: 13px; color:#61C7CC">
<ion-select interface="popover" placeholder="" [(ngModel)]="curInterval" (ionChange)="dismissPopover(curInterval, item)"> <ion-select interface="popover" placeholder="" style="padding: 0px;" [(ngModel)]="item.interval" (ionChange)="dismissPopover(item)">
<ion-select-option value="12" class="popLabel">近一年</ion-select-option> <ion-select-option value="12" class="popLabel">近一年</ion-select-option>
<ion-select-option value="6" class="popLabel">近六个月</ion-select-option> <ion-select-option value="6" class="popLabel">近六个月</ion-select-option>
<ion-select-option value="3" class="popLabel">近三个月</ion-select-option> <ion-select-option value="3" class="popLabel">近三个月</ion-select-option>
......
src/app/envCtrl/env-alarm/env-alarm.page.ts
View file @ 2ea83299
...@@ -69,6 +69,7 @@ export class EnvAlarmPage implements OnInit { ...@@ -69,6 +69,7 @@ export class EnvAlarmPage implements OnInit {
if (data.total > 0) { if (data.total > 0) {
if (data.rows && data.rows.constructor === Array) { if (data.rows && data.rows.constructor === Array) {
this.alarmItems = data.rows; this.alarmItems = data.rows;
this.alarmItems.forEach(item => (item.interval = this.curInterval));
} }
} }
}]); }]);
...@@ -113,12 +114,12 @@ export class EnvAlarmPage implements OnInit { ...@@ -113,12 +114,12 @@ export class EnvAlarmPage implements OnInit {
// }); // });
// } // }
dismissPopover(interval, fieldRegionInfo) { dismissPopover(one) { // interval, fieldRegionInfo
this.curFieldRegion = fieldRegionInfo; this.curFieldRegion = one;
this.load.toLoad('加载中...', false); this.load.toLoad('加载中...', false);
const condition = { const condition = {
fieldRegionNo: this.curFieldRegion.fieldRegionNo, fieldRegionNo: this.curFieldRegion.fieldRegionNo,
startTime: this.getStartTime(interval).valueOf(), startTime: this.getStartTime(one.interval).valueOf(),
stopTime: new Date().valueOf() stopTime: new Date().valueOf()
}; };
...@@ -159,4 +160,11 @@ export class EnvAlarmPage implements OnInit { ...@@ -159,4 +160,11 @@ export class EnvAlarmPage implements OnInit {
} }
document.getElementById(this.curFieldRegion.fieldRegionNo).innerText = displayValue; document.getElementById(this.curFieldRegion.fieldRegionNo).innerText = displayValue;
} }
doRefresh(event) {
setTimeout(() => {
this.init();
event.target.complete();
}, 3000);
}
} }
src/app/envCtrl/env-detail/env-detail.page.ts
View file @ 2ea83299
...@@ -144,7 +144,7 @@ export class EnvDetailPage implements OnInit { ...@@ -144,7 +144,7 @@ export class EnvDetailPage implements OnInit {
} }
getInHouseState(state) { getInHouseState(state) {
let stateName = ''; let stateName = '离舍';
switch (state) { switch (state) {
case 0: case 0:
stateName = '离舍'; stateName = '离舍';
......
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