Skip to content

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

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

parent 6aae8883
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 202 additions and 230 deletions
src/app/envCtrl/env-alarm-detail/env-alarm-detail.page.html
View file @ 6c74cf51
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
</ion-header> </ion-header>
<ion-content color="light" style="background-color: #F3F4F4;"> <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-segment-button value="trouble" [checked]="isTroubleDis">
<ion-label>故障</ion-label> <ion-label>故障</ion-label>
</ion-segment-button> </ion-segment-button>
...@@ -20,12 +20,12 @@ ...@@ -20,12 +20,12 @@
</ion-segment> </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" (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="全部" 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" (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> <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 @@ ...@@ -37,13 +37,13 @@
<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" (ionChange)="refresh()"></ion-datetime> <ion-datetime style="position: relative;" displayFormat="YYYY/MM" cancelText="取消" doneText="确认" [(ngModel)]="startTime" (click)="refresh()" id="selectStartTime"></ion-datetime>
</div> </div>
<div style="width: 2%"> <div style="width: 2%">
<span>~</span> <span>~</span>
</div> </div>
<div style="width: 30%"> <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>
<div style="width: 40%"> <div style="width: 40%">
<div class="note" style="margin-bottom: 5px;"> <div class="note" style="margin-bottom: 5px;">
...@@ -61,8 +61,9 @@ ...@@ -61,8 +61,9 @@
<div style="padding:5px;"> <div style="padding:5px;">
<div class="detailContent"> <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 class="title">
<div><img [src]="'../../assets/img/' + item.fieldDeviceType + '.png'" class="deviceIcon"></div> <div><img [src]="'../../assets/img/' + item.fieldDeviceType + '.png'" class="deviceIcon"></div>
<p style="font-size: 14px">{{item.troubleTime}}</p> <p style="font-size: 14px">{{item.troubleTime}}</p>
...@@ -82,8 +83,6 @@ ...@@ -82,8 +83,6 @@
<div *ngIf="displayArea === 'trouble' && item.disposeState === 0" > <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> <ion-button color="secondary" style="display: inline-block; width: 55px; height: 30px; font-size: 12px; border-radius: 20px;" (click)="onRecvClick(item)">确认修复</ion-button>
</div> </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 === '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"> <img *ngIf="displayArea === 'alarm'" [src]="'../../assets/img/disposeState' + item.disposeState + '.png'" class="warnIcon">
...@@ -94,14 +93,17 @@ ...@@ -94,14 +93,17 @@
</div> </div>
</div> </div>
</div> </div>
<ion-list id="list"></ion-list>
<ion-infinite-scroll threshold="100px" id="infinite-scroll"> <!--<ion-list id="troubleList"></ion-list>-->
<ion-infinite-scroll-content loading-spinner="bubbles" loading-text=""> <ion-infinite-scroll threshold="100px" (ionInfinite)="loadData($event)">
<ion-infinite-scroll-content
loadingSpinner="bubbles"
loadingText="加载中...">
</ion-infinite-scroll-content> </ion-infinite-scroll-content>
</ion-infinite-scroll> </ion-infinite-scroll>
</div> </div>
</ion-content> </ion-content>
src/app/envCtrl/env-alarm/env-alarm.page.html
View file @ 6c74cf51
...@@ -10,13 +10,25 @@ ...@@ -10,13 +10,25 @@
<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%">
<div class="cardTitle"> <div class="cardTitle">
<i class="vo v-fangzi"></i> <div style="width: 65%; padding-right: 5px; display: inline-block">
<span style="margin-left:10px">{{item.fieldRegionName}}</span> <i class="vo v-fangzi"></i>
<span class="alarmNum">{{item.total}}</span> <span style="margin-left:10px">{{item.fieldRegionName}}</span>
<span style="float:right; padding-right: 5px;"> <span class="alarmNum">{{item.total}}</span>
<!--<ion-popover-controller></ion-popover-controller>--> </div>
<a (click)="presentPopover(item)" [id]="item.fieldRegionNo">近一年</a> <div style="width: 30%; padding-right: 5px; display: inline-block; font-size: 13px; color:#61C7CC">
</span> <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> </div>
</ion-card-title> </ion-card-title>
</ion-card-header> </ion-card-header>
......
src/app/envCtrl/env-alarm/env-alarm.page.ts
View file @ 6c74cf51
...@@ -12,48 +12,6 @@ import {Load} from '../../service/load'; ...@@ -12,48 +12,6 @@ import {Load} from '../../service/load';
export class EnvAlarmPage implements OnInit { export class EnvAlarmPage implements OnInit {
alarmItems = []; 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: '', curFieldRegion = {factoryNo: '',
factoryName: '', factoryName: '',
...@@ -65,36 +23,36 @@ export class EnvAlarmPage implements OnInit { ...@@ -65,36 +23,36 @@ export class EnvAlarmPage implements OnInit {
alarmTotal: 0, alarmTotal: 0,
total: 0}; total: 0};
curInterval = 12; curInterval = '12';
popoverElement = null; popoverElement = null;
constructor(private api: Api, public nav: NavController, private load: Load) { constructor(private api: Api, public nav: NavController, private load: Load) {
customElements.define('popover-page', class ModalContent extends HTMLElement { // customElements.define('popover-page', class ModalContent extends HTMLElement {
connectedCallback() { // connectedCallback() {
this.innerHTML = ` // this.innerHTML = `
<ion-list class="popContent"> // <ion-list class="popContent">
<ion-radio-group style=""> // <ion-radio-group style="">
<ion-item style=""> // <ion-item style="">
<ion-label class="popLabel">近一年</ion-label> // <ion-label class="popLabel">近一年</ion-label>
<ion-radio slot="start" value="12" checked id="popSelect1"></ion-radio> // <ion-radio slot="start" value="12" checked id="popSelect1"></ion-radio>
</ion-item> // </ion-item>
<ion-item style=""> // <ion-item style="">
<ion-label class="popLabel">近六个月</ion-label> // <ion-label class="popLabel">近六个月</ion-label>
<ion-radio slot="start" value="6" id="popSelect2"></ion-radio> // <ion-radio slot="start" value="6" id="popSelect2"></ion-radio>
</ion-item> // </ion-item>
<ion-item style=""> // <ion-item style="">
<ion-label class="popLabel">近三个月</ion-label> // <ion-label class="popLabel">近三个月</ion-label>
<ion-radio slot="start" value="3" id="popSelect3"></ion-radio> // <ion-radio slot="start" value="3" id="popSelect3"></ion-radio>
</ion-item> // </ion-item>
<ion-item style=""> // <ion-item style="">
<ion-label class="popLabel">近一个月</ion-label> // <ion-label class="popLabel">近一个月</ion-label>
<ion-radio slot="start" value="1" id="popSelect4"></ion-radio> // <ion-radio slot="start" value="1" id="popSelect4"></ion-radio>
</ion-item> // </ion-item>
</ion-radio-group> // </ion-radio-group>
</ion-list> // </ion-list>
`; // `;
} // }
}); // });
} }
...@@ -102,7 +60,11 @@ export class EnvAlarmPage implements OnInit { ...@@ -102,7 +60,11 @@ export class EnvAlarmPage implements OnInit {
this.init(); this.init();
} }
ionViewWillLeave() {
}
init () { init () {
this.curInterval = '12';
this.api.alert.getAll([{fieldRegionType: '牛舍'}, (data) => { this.api.alert.getAll([{fieldRegionType: '牛舍'}, (data) => {
if (data.total > 0) { if (data.total > 0) {
if (data.rows && data.rows.constructor === Array) { if (data.rows && data.rows.constructor === Array) {
...@@ -113,7 +75,7 @@ export class EnvAlarmPage implements OnInit { ...@@ -113,7 +75,7 @@ export class EnvAlarmPage implements OnInit {
} }
toControl(one, displayArea) { toControl(one, displayArea) {
const query = '/env-alarmDetail?no=' + one.fieldRegionNo const query = '/env-alarmDetail?no=' + one.fieldRegionNo
+ '&displayArea=' + displayArea + '&interval=' + this.curInterval; + '&displayArea=' + displayArea + '&interval=' + this.curInterval.toString();
// this.tf.transfer({ // this.tf.transfer({
// url: '/' + one.url, // url: '/' + one.url,
// query: query, // query: query,
...@@ -123,35 +85,36 @@ export class EnvAlarmPage implements OnInit { ...@@ -123,35 +85,36 @@ export class EnvAlarmPage implements OnInit {
this.nav.navigateForward(query); this.nav.navigateForward(query);
} }
async presentPopover(fieldRegionInfo) { // async presentPopover(fieldRegionInfo) {
this.curFieldRegion = fieldRegionInfo; // this.curFieldRegion = fieldRegionInfo;
this.popoverElement = Object.assign(document.createElement('ion-popover'), { // this.popoverElement = Object.assign(document.createElement('ion-popover'), {
component: 'popover-page', // component: 'popover-page',
event: event, // event: event,
cssClass: ['width: 150px'] // cssClass: ['width: 150px']
}); // });
document.body.appendChild(this.popoverElement); // document.body.appendChild(this.popoverElement);
return await this.popoverElement.present().then( (res) => { // return await this.popoverElement.present().then( (res) => {
document.getElementById('popSelect1').onclick = () => { // document.getElementById('popSelect1').onclick = () => {
this.dismissPopover(12); // this.dismissPopover(12);
this.curInterval = 12; // this.curInterval = 12;
}; // };
document.getElementById('popSelect2').onclick = () => { // document.getElementById('popSelect2').onclick = () => {
this.dismissPopover(6); // this.dismissPopover(6);
this.curInterval = 6; // this.curInterval = 6;
}; // };
document.getElementById('popSelect3').onclick = () => { // document.getElementById('popSelect3').onclick = () => {
this.dismissPopover(3); // this.dismissPopover(3);
this.curInterval = 3; // this.curInterval = 3;
}; // };
document.getElementById('popSelect4').onclick = () => { // document.getElementById('popSelect4').onclick = () => {
this.dismissPopover(1); // this.dismissPopover(1);
this.curInterval = 1; // this.curInterval = 1;
}; // };
}); // });
} // }
dismissPopover(interval) { dismissPopover(interval, fieldRegionInfo) {
this.curFieldRegion = fieldRegionInfo;
this.load.toLoad('加载中...', false); this.load.toLoad('加载中...', false);
const condition = { const condition = {
fieldRegionNo: this.curFieldRegion.fieldRegionNo, fieldRegionNo: this.curFieldRegion.fieldRegionNo,
...@@ -170,10 +133,10 @@ export class EnvAlarmPage implements OnInit { ...@@ -170,10 +133,10 @@ export class EnvAlarmPage implements OnInit {
} }
this.load.offLoad(); this.load.offLoad();
}]); }]);
if (this.popoverElement) { // if (this.popoverElement) {
this.popoverElement.dismiss().then(() => { this.popoverElement = null; }); // this.popoverElement.dismiss().then(() => { this.popoverElement = null; });
} // }
this.displayInterval(interval); // this.displayInterval(interval);
} }
getStartTime(interval) { getStartTime(interval) {
......
tslint.json
View file @ 6c74cf51
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
"label-position": true, "label-position": true,
"max-line-length": [ "max-line-length": [
true, true,
200 300
], ],
"member-access": false, "member-access": false,
"member-ordering": [ "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