Commit 6c74cf51 authored by yating.lin's avatar yating.lin

修改预警页显示数据个数(分页)

parent 6aae8883
......@@ -10,7 +10,7 @@
</ion-header>
<ion-content color="light" style="background-color: #F3F4F4;">
<ion-segment scrollable style="position: sticky; margin-top:10px;" color="secondary" (ionChange)="segmentChanged($event)">
<ion-segment scrollable style="position: sticky; margin-top:10px;" color="secondary" (click)="segmentChanged($event)">
<ion-segment-button value="trouble" [checked]="isTroubleDis">
<ion-label>故障</ion-label>
</ion-segment-button>
......@@ -20,12 +20,12 @@
</ion-segment>
<ion-item lines="full" class="ionItem" color="gray">
<ion-select interface="popover" placeholder="状态" [(ngModel)]="disposeState" (ionChange)="refresh()">
<ion-select interface="popover" placeholder="状态" [(ngModel)]="disposeState" (click)="refresh()" id="selectState">
<ion-select-option value="全部" 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>
<ion-select interface="popover" placeholder="类型" [(ngModel)]="fieldDeviceType" (ionChange)="refresh()">
<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>
......@@ -37,13 +37,13 @@
<ion-item lines="full" class="ionItem" style="height: 45px;">
<div style="width: 28%">
<ion-datetime style="position: relative;" displayFormat="YYYY/MM" cancelText="取消" doneText="确认" [(ngModel)]="startTime" (ionChange)="refresh()"></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;" (ionChange)="refresh()"></ion-datetime>
<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;">
......@@ -61,8 +61,9 @@
<div style="padding:5px;">
<div class="detailContent">
<div class="timeline" *ngIf="detailInfoLength > 0">
<div class="entry" *ngFor="let item of detailInfo.trouble">
<div class="timeline" *ngIf="troubleList.length > 0">
<div class="entry" *ngFor="let item of troubleList">
<div class="title">
<div><img [src]="'../../assets/img/' + item.fieldDeviceType + '.png'" class="deviceIcon"></div>
<p style="font-size: 14px">{{item.troubleTime}}</p>
......@@ -82,8 +83,6 @@
<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 === 0" [src]="'../../assets/img/troubleDisposeState' + item.disposeState + '.png'" class="warnIcon" (click)="onRecvClick(item)">-->
<!-- <ion-button color="primary" size="small" style="display: inline-block" *ngIf="a.disposeState === 0" (click)='onRecvClick(a)'>确认修复</ion-button>-->
<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">
......@@ -94,14 +93,17 @@
</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-list id="troubleList"></ion-list>-->
<ion-infinite-scroll threshold="100px" (ionInfinite)="loadData($event)">
<ion-infinite-scroll-content
loadingSpinner="bubbles"
loadingText="加载中...">
</ion-infinite-scroll-content>
</ion-infinite-scroll>
</div>
</ion-content>
......@@ -10,13 +10,25 @@
<ion-card-header style="padding-top: 3px; padding-bottom: 3px;">
<ion-card-title style="display: inline-block" style="width:100%">
<div class="cardTitle">
<i class="vo v-fangzi"></i>
<span style="margin-left:10px">{{item.fieldRegionName}}</span>
<span class="alarmNum">{{item.total}}</span>
<span style="float:right; padding-right: 5px;">
<!--<ion-popover-controller></ion-popover-controller>-->
<a (click)="presentPopover(item)" [id]="item.fieldRegionNo">近一年</a>
</span>
<div style="width: 65%; padding-right: 5px; display: inline-block">
<i class="vo v-fangzi"></i>
<span style="margin-left:10px">{{item.fieldRegionName}}</span>
<span class="alarmNum">{{item.total}}</span>
</div>
<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-option value="12" 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="1" class="popLabel">近一个月</ion-select-option>
</ion-select>
</div>
<!--<span style="float:right; padding-right: 5px;">-->
<!--&lt;!&ndash;<ion-popover-controller></ion-popover-controller>&ndash;&gt;-->
<!--&lt;!&ndash;<a (click)="presentPopover(item)" [id]="item.fieldRegionNo">近一年</a>&ndash;&gt;-->
<!---->
<!--</span>-->
</div>
</ion-card-title>
</ion-card-header>
......
......@@ -12,48 +12,6 @@ import {Load} from '../../service/load';
export class EnvAlarmPage implements OnInit {
alarmItems = [];
// TODO 测试用数据
// alarmItems = [{
// factoryNo: 'FN108050436279648256',
// factoryName: '一厂',
// fieldRegionNo: 'FRN110268534764224511',
// fieldRegionName: '1号牛舍',
// devErr: 36,
// devErrTotal: 55,
// alarm: 20,
// alarmTotal: 55,
// total: 56
// }, {
// factoryNo: 'FN108050436279648256',
// factoryName: '一厂',
// fieldRegionNo: 'FRN110268534764224512',
// fieldRegionName: '2号牛舍',
// devErr: 36,
// devErrTotal: 55,
// alarm: 20,
// alarmTotal: 55,
// total: 56
// }, {
// factoryNo: 'FN108050436279648256',
// factoryName: '一厂',
// fieldRegionNo: 'FRN110268534764224513',
// fieldRegionName: '3号牛舍',
// devErr: 36,
// devErrTotal: 55,
// alarm: 20,
// alarmTotal: 55,
// total: 56
// }, {
// factoryNo: 'FN108050436279648256',
// factoryName: '一厂',
// fieldRegionNo: 'FRN110268534764224514',
// fieldRegionName: '4号牛舍',
// devErr: 36,
// devErrTotal: 55,
// alarm: 20,
// alarmTotal: 55,
// total: 56
// }];
curFieldRegion = {factoryNo: '',
factoryName: '',
......@@ -65,36 +23,36 @@ export class EnvAlarmPage implements OnInit {
alarmTotal: 0,
total: 0};
curInterval = 12;
curInterval = '12';
popoverElement = null;
constructor(private api: Api, public nav: NavController, private load: Load) {
customElements.define('popover-page', class ModalContent extends HTMLElement {
connectedCallback() {
this.innerHTML = `
<ion-list class="popContent">
<ion-radio-group style="">
<ion-item style="">
<ion-label class="popLabel">近一年</ion-label>
<ion-radio slot="start" value="12" checked id="popSelect1"></ion-radio>
</ion-item>
<ion-item style="">
<ion-label class="popLabel">近六个月</ion-label>
<ion-radio slot="start" value="6" id="popSelect2"></ion-radio>
</ion-item>
<ion-item style="">
<ion-label class="popLabel">近三个月</ion-label>
<ion-radio slot="start" value="3" id="popSelect3"></ion-radio>
</ion-item>
<ion-item style="">
<ion-label class="popLabel">近一个月</ion-label>
<ion-radio slot="start" value="1" id="popSelect4"></ion-radio>
</ion-item>
</ion-radio-group>
</ion-list>
`;
}
});
// customElements.define('popover-page', class ModalContent extends HTMLElement {
// connectedCallback() {
// this.innerHTML = `
// <ion-list class="popContent">
// <ion-radio-group style="">
// <ion-item style="">
// <ion-label class="popLabel">近一年</ion-label>
// <ion-radio slot="start" value="12" checked id="popSelect1"></ion-radio>
// </ion-item>
// <ion-item style="">
// <ion-label class="popLabel">近六个月</ion-label>
// <ion-radio slot="start" value="6" id="popSelect2"></ion-radio>
// </ion-item>
// <ion-item style="">
// <ion-label class="popLabel">近三个月</ion-label>
// <ion-radio slot="start" value="3" id="popSelect3"></ion-radio>
// </ion-item>
// <ion-item style="">
// <ion-label class="popLabel">近一个月</ion-label>
// <ion-radio slot="start" value="1" id="popSelect4"></ion-radio>
// </ion-item>
// </ion-radio-group>
// </ion-list>
// `;
// }
// });
}
......@@ -102,7 +60,11 @@ export class EnvAlarmPage implements OnInit {
this.init();
}
ionViewWillLeave() {
}
init () {
this.curInterval = '12';
this.api.alert.getAll([{fieldRegionType: '牛舍'}, (data) => {
if (data.total > 0) {
if (data.rows && data.rows.constructor === Array) {
......@@ -113,7 +75,7 @@ export class EnvAlarmPage implements OnInit {
}
toControl(one, displayArea) {
const query = '/env-alarmDetail?no=' + one.fieldRegionNo
+ '&displayArea=' + displayArea + '&interval=' + this.curInterval;
+ '&displayArea=' + displayArea + '&interval=' + this.curInterval.toString();
// this.tf.transfer({
// url: '/' + one.url,
// query: query,
......@@ -123,35 +85,36 @@ export class EnvAlarmPage implements OnInit {
this.nav.navigateForward(query);
}
async presentPopover(fieldRegionInfo) {
this.curFieldRegion = fieldRegionInfo;
this.popoverElement = Object.assign(document.createElement('ion-popover'), {
component: 'popover-page',
event: event,
cssClass: ['width: 150px']
});
document.body.appendChild(this.popoverElement);
return await this.popoverElement.present().then( (res) => {
document.getElementById('popSelect1').onclick = () => {
this.dismissPopover(12);
this.curInterval = 12;
};
document.getElementById('popSelect2').onclick = () => {
this.dismissPopover(6);
this.curInterval = 6;
};
document.getElementById('popSelect3').onclick = () => {
this.dismissPopover(3);
this.curInterval = 3;
};
document.getElementById('popSelect4').onclick = () => {
this.dismissPopover(1);
this.curInterval = 1;
};
});
}
// async presentPopover(fieldRegionInfo) {
// this.curFieldRegion = fieldRegionInfo;
// this.popoverElement = Object.assign(document.createElement('ion-popover'), {
// component: 'popover-page',
// event: event,
// cssClass: ['width: 150px']
// });
// document.body.appendChild(this.popoverElement);
// return await this.popoverElement.present().then( (res) => {
// document.getElementById('popSelect1').onclick = () => {
// this.dismissPopover(12);
// this.curInterval = 12;
// };
// document.getElementById('popSelect2').onclick = () => {
// this.dismissPopover(6);
// this.curInterval = 6;
// };
// document.getElementById('popSelect3').onclick = () => {
// this.dismissPopover(3);
// this.curInterval = 3;
// };
// document.getElementById('popSelect4').onclick = () => {
// this.dismissPopover(1);
// this.curInterval = 1;
// };
// });
// }
dismissPopover(interval) {
dismissPopover(interval, fieldRegionInfo) {
this.curFieldRegion = fieldRegionInfo;
this.load.toLoad('加载中...', false);
const condition = {
fieldRegionNo: this.curFieldRegion.fieldRegionNo,
......@@ -170,10 +133,10 @@ export class EnvAlarmPage implements OnInit {
}
this.load.offLoad();
}]);
if (this.popoverElement) {
this.popoverElement.dismiss().then(() => { this.popoverElement = null; });
}
this.displayInterval(interval);
// if (this.popoverElement) {
// this.popoverElement.dismiss().then(() => { this.popoverElement = null; });
// }
// this.displayInterval(interval);
}
getStartTime(interval) {
......
......@@ -29,7 +29,7 @@
"label-position": true,
"max-line-length": [
true,
200
300
],
"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