Commit 6011ef3c authored by yating.lin's avatar yating.lin

调整layout

parent d942ae78
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.witium.muchang.test" version="2.9.2" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<widget id="com.witium.muchang.test" version="2.9.3" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>牧场云</name>
<description>test</description>
<author email="frank.feng@witium.com" href="http://muchang.witium.com/">Van.chen - frank.feng</author>
......
......@@ -11,7 +11,7 @@
<div class="top-line">
</div>
<div class="top-img">
<img src="../../../assets/img/喷淋.png" class="img">
<img src="../../../assets/img/shower-small.png" class="img">
</div>
<div class="top-line">
</div>
......
......@@ -46,6 +46,6 @@
height: 2px;
border-bottom: 1px solid lightgray;
display: inline-block;
margin: 15px 0px 14px 5px;
margin: 15px 1% 14px 1%;;
float: left;
}
......@@ -7,22 +7,25 @@
<ion-title class="appTitle">{{fieldRegionName}}告警详情</ion-title>
</ion-toolbar>
<div style="margin-top:10px;">
<ion-segment mode="ios" style="position: sticky;" color="secondary" (ionChange)="segmentChanged($event)">
<ion-segment-button mode="ios" value="trouble" [checked]="isTroubleDis" class="ion-segment-button">
<div style="">
<ion-segment mode="ios" style="position: sticky; height: 35px;" color="secondary" (ionChange)="segmentChanged($event)">
<ion-segment-button mode="ios" value="trouble" [checked]="isTroubleDis" class="ion-segment-button" style="--border-radius:0xp;">
<ion-label>故障</ion-label>
</ion-segment-button>
<ion-segment-button mode="ios" value="alarm" [checked]="isAlarmDis" class="ion-segment-button">
<ion-segment-button mode="ios" value="alarm" [checked]="isAlarmDis" class="ion-segment-button" style="--border-radius:0xp;">
<ion-label>预警</ion-label>
</ion-segment-button>
</ion-segment>
<ion-item lines="full" class="ionItem" style="height: 45px;"> <!-- color="gray" -->
<div style="float:left; display: inline-block; position: relative; width:40%; padding-top: 10px;">
<!--<ion-select class="selectBtn font-content" interface="popover" placeholder="状态" [(ngModel)]="disposeState" (ionChange)="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 class="selectBtn font-content" interface="popover" placeholder="状态" [(ngModel)]="disposeState" (ionChange)="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-option *ngFor="let option of stateOptions" [value]="option.modelId">{{option.modelValue}}</ion-select-option>
</ion-select>
</div>
<div style="float:left; display: inline-block; position: relative; width:40%; padding-top: 10px;">
......@@ -89,15 +92,15 @@
<div id="parentDiv" >
<div style="width:65%; float: left">
<h3 style="margin-bottom: 5px;" class="font-content-title">{{item.description}}</h3>
<div *ngIf="item.data !== null && item.data.temp !== undefined && item.data.temp !== null && item.data.temp !== ''" class="warnContent font-content">温度: {{item.data.temp}} ℃</div>
<div *ngIf="item.data !== null && item.data.humi !== undefined && item.data.humi !== null && item.data.humi !== ''" class="warnContent font-content">湿度: {{item.data.humi}} %</div>
<div *ngIf="item.data !== null && item.data.temp !== undefined && item.data.temp !== null && item.data.temp !== ''" class="warnContent font-content">温度: {{item.data.temp | number:'0.1-1'}} ℃</div>
<div *ngIf="item.data !== null && item.data.humi !== undefined && item.data.humi !== null && item.data.humi !== ''" class="warnContent font-content">湿度: {{item.data.humi | number:'0.0-0'}} %</div>
<div *ngIf="item.data !== null && item.data.heatStressLevel !== undefined && item.data.heatStressLevel !== null && item.data.heatStressLevel !== ''" class="warnContent font-content">热应激等级: {{item.data.heatStressLevel}}</div>
<div *ngIf="item.data !== null && item.data.liquidPump !== undefined && item.data.liquidPump !== null && item.data.liquidPump !== ''" class="warnContent font-content">供液泵压力: {{item.data.liquidPump}} MPa</div>
<div *ngIf="item.data !== null && item.data.press !== undefined && item.data.press !== null && item.data.press !== ''" class="warnContent font-content">电磁阀压力: {{item.data.press}} MPa</div>
<div *ngIf="item.data !== null && item.data.NH3 !== undefined && item.data.NH3 !== null && item.data.NH3 !== ''" class="warnContent font-content">氨气: {{item.data.NH3}} ppm</div>
<div *ngIf="item.data !== null && item.data.liquidPump !== undefined && item.data.liquidPump !== null && item.data.liquidPump !== ''" class="warnContent font-content">供液泵: {{item.data.liquidPump | number:'0.0-3'}} MPa</div>
<div *ngIf="item.data !== null && item.data.press !== undefined && item.data.press !== null && item.data.press !== ''" class="warnContent font-content">电磁阀: {{item.data.press | number:'0.0-3'}} MPa</div>
<div *ngIf="item.data !== null && item.data.NH3 !== undefined && item.data.NH3 !== null && item.data.NH3 !== ''" class="warnContent font-content">氨气: {{item.data.NH3 | number:'0.0-2'}} ppm</div>
</div>
<div style="width:35%; float: left">
<div *ngIf="displayArea === 'trouble' && item.disposeState === 0" >is
<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">
......@@ -115,7 +118,7 @@
<ion-infinite-scroll threshold="100px" (ionInfinite)="loadData($event)" id="infiniteScroll">
<ion-infinite-scroll-content
loadingSpinner="bubbles"
loadingText="加载中...">
loadingText="">
</ion-infinite-scroll-content>
</ion-infinite-scroll>
</div>
......
......@@ -134,8 +134,8 @@
position: absolute;
width: 8px;
height: 8px;
border: 4px solid #28C0C6;
background-color: #28C0C6;
border: 4px solid #61C7CC;
background-color: #61C7CC;
border-radius: 100%;
top: 35%;
right: -24px;
......
......@@ -6,6 +6,7 @@ import {DatePipe} from '@angular/common';
import { IonInfiniteScroll } from '@ionic/angular';
import {Loading} from '../../service/loading';
import {Load} from '../../service/load';
import {Constants} from '../../service/constants';
@Component({
selector: 'v-env-alarm-detail',
......@@ -43,6 +44,11 @@ export class EnvAlarmDetailPage implements OnInit {
'workModeOld': '1'
};
stateOptions = [
{modelId: '全部', modelValue: '全部'},
{modelId: '0', modelValue: '待修复'},
{modelId: '1', modelValue: '已修复'}];
typeOptions = [
{modelId: '全部', modelValue: '全部'},
{modelId: '环境', modelValue: '环境'},
......@@ -114,6 +120,11 @@ export class EnvAlarmDetailPage implements OnInit {
{modelId: '喷淋', modelValue: '喷淋'},
{modelId: '照明', modelValue: '照明'},
{modelId: '水槽', modelValue: '水槽'}];
this.stateOptions = [
{modelId: '全部', modelValue: '全部'},
{modelId: '0', modelValue: '待修复'},
{modelId: '1', modelValue: '已修复'}];
} else {
this.typeOptions = [
{modelId: '全部', modelValue: '全部'},
......@@ -122,6 +133,11 @@ export class EnvAlarmDetailPage implements OnInit {
{modelId: '喷淋', modelValue: '喷淋'},
{modelId: '照明', modelValue: '照明'},
{modelId: '水槽', modelValue: '水槽'}];
this.stateOptions = [
{modelId: '全部', modelValue: '全部'},
{modelId: '0', modelValue: '待解决'},
{modelId: '1', modelValue: '已解决'}];
}
}
......@@ -295,7 +311,7 @@ export class EnvAlarmDetailPage implements OnInit {
disposeState: 1,
isReal: real === 1 ? 1 : 0
};
this.loading.presentLoading(60);
this.loading.presentLoading(Constants.LOADING_SHORT);
this.api.troubleLog.processingFailure([req, (data) => {
if (data && data.code === 1) {
this.api.presentMsgToast(data.message);
......@@ -354,7 +370,7 @@ export class EnvAlarmDetailPage implements OnInit {
cssClass: 'main-color',
mode: 'ios',
message: '',
duration: 2000
duration: 1500
});
await loading.present();
......
......@@ -21,7 +21,7 @@
</div>
<ion-badge color="danger" mode="ios" *ngIf="item.total > 0" class="badge">{{item.total}}</ion-badge>
</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:#62C7CC">
<ion-select interface="popover" placeholder="" style="padding: 0px; text-align: right;" [(ngModel)]="item.interval" (ionChange)="dismissPopover(item)">
<ion-select-option value="12" class="popLabel">近一年</ion-select-option>
<ion-select-option value="6" class="popLabel">近六个月</ion-select-option>
......
......@@ -76,7 +76,7 @@ export class EnvAlarmPage implements OnInit {
}
toControl(one, displayArea) {
const query = '/env-alarmDetail?no=' + one.fieldRegionNo
+ '&displayArea=' + displayArea + '&interval=' + this.curInterval.toString();
+ '&displayArea=' + displayArea + '&interval=' + one.interval;
// this.tf.transfer({
// url: '/' + one.url,
// query: query,
......
......@@ -9,26 +9,31 @@
<ion-content color='light'>
<ion-item lines="full">
<div style="width:100%; background-color: unset">
<div style="width: 100%">
<div style="width:20%; display: inline-block;">
<span>选择日期</span>
<div style="width:20%; display: inline-block; float: left; padding-top: 8px; padding-left: 20px;">
<span class="font-sub-title" style="display: inline-block; ">选择日期</span>
</div>
<div style="width:70%; text-align: left;padding-left: 20px; display: inline-block;">
<ion-datetime displayFormat="YYYY-MM-DD" cancelText="取消" doneText="确认" [(ngModel)]="today" style="font-size:16px"></ion-datetime>
<div style="width:60%; text-align: left;padding-left: 20px; display: inline-block;">
<div style=" padding-right: 5px; display: inline-block;">
<ion-datetime displayFormat="YYYY-MM-DD" cancelText="取消" doneText="确认" [(ngModel)]="today" class="font-input" style="display: inline-block;"></ion-datetime>
</div>
<!--<div style="float:left; display: inline-block;">-->
<!--&lt;!&ndash;<img src="../../assets/img/calendar-small.png" style="width: 25px !important; display: inline-block;">&ndash;&gt;-->
<!--</div>-->
</div>
</div>
</ion-item>
</div>
<div style="max-height: calc(100% - 100px);overflow-y:auto;">
<ion-item lines="full" class="inputItem" *ngFor="let item of fieldRegionNameList">
<div style="width:45%; font-size:16px;">
<ion-item lines="full" class="inputItem" style="width:94%;margin-left:2%; margin-right:2%;" *ngFor="let item of fieldRegionNameList">
<div style="width:45%;" class="font-content">
{{item.name}}单产奶量
</div>
<div style="width:25%; padding-left:10px; font-size:16px;">
<ion-input class="inputText" [(ngModel)]="item.num"></ion-input>
</div>
<div style="width:30%; text-align:right; padding-right:15px; font-size:14px;">
<div style="width:30%; text-align:right; padding-right:15px;" class="font-smaller">
公斤(kg)/头
</div>
</ion-item>
......@@ -36,7 +41,7 @@
<div style="text-align: center; width:100%; position: absolute; bottom: 10px;">
<ion-item width="100%" lines="none">
<ion-button color="secondary" class="saveBtn" round (click)="save($event)">提交</ion-button>
<ion-button color="secondary" style="height:35px;" class="saveBtn" round (click)="save($event)">提交</ion-button>
</ion-item>
</div>
......
......@@ -29,13 +29,13 @@
<div class="rankIcon">
<img [src]="'../../assets/img/rank1.png'">
</div>
<div class="rankName">
<div class="rankName font-content">
5号牛舍
</div>
<div class="rankProgress">
<ion-progress-bar color="secondary" value="1"></ion-progress-bar>
</div>
<div class="rankValue">
<div class="rankValue font-content">
140
</div>
</ion-item>
......@@ -43,13 +43,13 @@
<div class="rankIcon">
<img [src]="'../../assets/img/rank2.png'">
</div>
<div class="rankName">
<div class="rankName font-content">
8号牛舍
</div>
<div class="rankProgress">
<ion-progress-bar color="secondary" value="0.80"></ion-progress-bar>
</div>
<div class="rankValue">
<div class="rankValue font-content">
125
</div>
</ion-item>
......@@ -58,55 +58,55 @@
<div class="rankIcon">
<img [src]="'../../assets/img/rank3.png'">
</div>
<div class="rankName">
<div class="rankName font-content">
1号牛舍
</div>
<div class="rankProgress">
<ion-progress-bar color="secondary" value="0.75"></ion-progress-bar>
</div>
<div class="rankValue">
<div class="rankValue font-content">
105
</div>
</ion-item>
<ion-item lines="full" class="rankItem fix-item-padding">
<div class="rankIcon">
<div class="rankIcon font-content">
24
</div>
<div class="rankName">
<div class="rankName font-content">
20号牛舍
</div>
<div class="rankProgress">
<ion-progress-bar color="medium" value="0.50"></ion-progress-bar>
</div>
<div class="rankValue">
<div class="rankValue font-content">
55
</div>
</ion-item>
<ion-item lines="full" class="rankItem fix-item-padding">
<div class="rankIcon">
<div class="rankIcon font-content">
25
</div>
<div class="rankName">
<div class="rankName font-content">
23号牛舍
</div>
<div class="rankProgress">
<ion-progress-bar color="medium" value="0.3"></ion-progress-bar>
</div>
<div class="rankValue">
<div class="rankValue font-content">
35
</div>
</ion-item>
<ion-item lines="full" class="rankItem fix-item-padding">
<div class="rankIcon">
<div class="rankIcon font-content">
26
</div>
<div class="rankName">
<div class="rankName font-content">
11号牛舍
</div>
<div class="rankProgress">
<ion-progress-bar color="medium" value="0.2"></ion-progress-bar>
</div>
<div class="rankValue">
<div class="rankValue font-content">
20
</div>
</ion-item>
......@@ -127,8 +127,8 @@
<div style="width:100%; padding-left:10px; padding-right:10px; height: 300px">
<div style="width:95%; background-color: #fff; border-radius: 10px 10px 0px 0px">
<div style="width:85%; margin:auto; padding-top: 10px">
<ion-segment scrollable style="position: sticky; margin-top:10px;" color="secondary" (ionChange)="segmentChanged($event)">
<ion-segment-button style="border-radius: 20px; margin-right:5px" *ngFor="let item of fieldRegionNameList" [value]="item.name" [checked]="item.checked">
<ion-segment mode="ios" scrollable style="position: sticky; margin-top:10px;" color="secondary" (ionChange)="segmentChanged($event)">
<ion-segment-button mode="ios" style="border-radius: 20px; margin-right:5px" *ngFor="let item of fieldRegionNameList" [value]="item.name" [checked]="item.checked">
<ion-label style="font-size:10px">{{item.name}}</ion-label>
</ion-segment-button>
</ion-segment>
......
......@@ -67,7 +67,7 @@
.selectFont {
font-weight: normal;
font-size: 13px;
color: #8e8e8e;
color: #828282;
}
.popContent {
......
......@@ -387,10 +387,12 @@ export class EnvCfgPage implements OnInit {
this.curCowshed.config.push(this.waterChannel);
this.updateDateFormat();
if (this.validate()) {
this.sortShowerModels();
this.updateModels();
// this.load.toLoad('加载中...', false);
// this.comm.remain = 150;
this.loading.presentLoading(150);
this.loading.presentLoading(Constants.LOADING_LONG);
this.curCowshed.isWisdomModel = this.curCowshed.isWisdomModelChecked ? 1 : 0;
// 回舍时默认设备都为打开状态
this.curCowshed.back.forEach(one => (one.flag = true));
......@@ -446,6 +448,17 @@ export class EnvCfgPage implements OnInit {
this.curCowshed.config.push(this.waterChannel);
}
sortShowerModels() {
this.shower.controlConfig.sort( (a, b) => {
// return parseInt(a['T']) > parseInt(b['T']) ? 1 : parseInt(a['T']) === parseInt(b['T']) ? 0 : -1;
return a['config']['T'] > b['config']['T'] ? 1 : a['config']['T'] === b['config']['T'] ? 0 : -1;
});
this.shower.controlConfig.forEach((allCfg, index) => {
allCfg.id = index + 1;
allCfg.config.id = index + 1;
});
}
validate() {
if (this.isEmpty(this.curCowshed.propertyConfig.toft)) {
this.api.presentMsgToast('请输入偏差温度');
......@@ -602,24 +615,33 @@ export class EnvCfgPage implements OnInit {
}
validateDateFromTo(dateFrom, dateTo) {
let hasError = false;
const fromMonth = parseInt(dateFrom.slice(0, 2), 10);
const fromDay = parseInt(dateFrom.slice(3, 5), 10);
const from = new Date(new Date().getFullYear(), fromMonth, fromDay).valueOf();
const toMonth = parseInt(dateTo.slice(0, 2), 10);
const toDay = parseInt(dateTo.slice(3, 5), 10);
const to = new Date(new Date().getFullYear(), toMonth, toDay).valueOf();
if (from > to) {
hasError = true;
}
return hasError;
// 日期范围check不要
// let hasError = false;
// const fromMonth = parseInt(dateFrom.slice(0, 2), 10);
// const fromDay = parseInt(dateFrom.slice(3, 5), 10);
// const from = new Date(new Date().getFullYear(), fromMonth, fromDay).valueOf();
// const toMonth = parseInt(dateTo.slice(0, 2), 10);
// const toDay = parseInt(dateTo.slice(3, 5), 10);
// const to = new Date(new Date().getFullYear(), toMonth, toDay).valueOf();
//
// if (from > to) {
// hasError = true;
// }
return false;
}
onReferenceModel() {
let popFanModels = {};
let popFanModels: any = {};
this.api.devicePatternModel.getByFactoryNoAndType([{factoryNo: this.curCowshed.factoryNo, fieldDeviceType: '风机'}, (data) => {
if (data) {
if (data.constructor === Array && data.length > 0) {
data.forEach(model => {
if (model.configJson !== undefined) {
const configJson = JSON.parse(model.configJson.toString());
model.configJson = configJson;
}
});
}
popFanModels = data;
this.selectModel('风机', 1, popFanModels);
}
......@@ -628,10 +650,16 @@ export class EnvCfgPage implements OnInit {
}
onAddModel() {
let popShowerModels = {};
let popShowerModels: any = {};
this.api.devicePatternModel.getByFactoryNoAndType([{factoryNo: this.curCowshed.factoryNo, fieldDeviceType: '喷淋'}, (data) => {
if (data) {
if (data && data.constructor === Array && data.length > 0) {
data.forEach(model => {
if (model.configJson !== undefined) {
const configJson = JSON.parse(model.configJson.toString());
model.configJson = configJson;
}
});
popShowerModels = data;
this.selectModel('喷淋', 2, popShowerModels);
}
......@@ -640,11 +668,17 @@ export class EnvCfgPage implements OnInit {
}
onChangeModel() {
let popLightModels = {};
let popLightModels: any = {};
this.api.devicePatternModel.getByFactoryNoAndType([{factoryNo: this.curCowshed.factoryNo, fieldDeviceType: '照明'}, (data) => {
if (data) {
if (data && data.constructor === Array && data.length > 0) {
data.forEach(model => {
if (model.configJson !== undefined) {
const configs = JSON.parse(model.configJson);
model.configJson = configs;
}
});
popLightModels = data;
this.selectModel('照明', 3, popLightModels);
}
......@@ -656,18 +690,24 @@ export class EnvCfgPage implements OnInit {
referenceModel(models, selectedName) {
if (selectedName) {
const selectedModel = models.filter(data => data.patternModelName === selectedName);
this.fan.controlConfig.TU = selectedModel[0].configJson.TU;
this.fan.controlConfig.TL = selectedModel[0].configJson.TL;
this.fan.controlConfig.config.TU = selectedModel[0].configJson.TU;
this.fan.controlConfig.config.TL = selectedModel[0].configJson.TL;
}
}
// 喷淋:添加模式
addModel(models, selectedName) {
if (selectedName) {
const modelCount = this.light.controlConfig.length;
const modelCount = this.shower.controlConfig.length;
const selectedModel = models.filter(data => data.patternModelName === selectedName);
selectedModel[0].configJson.id = modelCount + 1;
this.shower.controlConfig.push(selectedModel[0].configJson);
const configs = [];
selectedModel.forEach( (model, index) => {
configs.push( {id: modelCount + index + 1, config: model.configJson});
});
configs.forEach(config => {
this.shower.controlConfig.push(config);
});
}
}
......@@ -675,10 +715,18 @@ export class EnvCfgPage implements OnInit {
changeModel(models, selectedName) {
if (selectedName) {
const selectedModel = models.filter(data => data.patternModelName === selectedName);
selectedModel[0].configJson.forEach((item, index) => {
item.id = index + 1;
});
this.light.controlConfig = selectedModel[0].configJson;
const configs = [];
if (selectedModel[0].configJson.constructor === Array && selectedModel[0].configJson.length > 0) {
selectedModel[0].configJson.forEach( (model, index) => {
model.id = index + 1;
const configValue = {id: 0, config: {}};
configValue.id = index + 1;
configValue.config = model;
configs.push(configValue);
});
}
this.light.controlConfig = configs;
}
}
......
......@@ -7,7 +7,16 @@
</ion-toolbar>
</ion-header>
<ion-content style="background-color: #F3F4F4;">
<div style="max-height: calc(100% - 100px);overflow-y:auto;">
<div style="width: 100%; margin-top:15px;">
<div class="top-line">
</div>
<div class="top-img">
<img src="../../../assets/img/light-small.png" class="img">
</div>
<div class="top-line">
</div>
</div>
<div style="max-height: calc(100% - 100px);overflow-y:auto;" class="parentDiv">
<ion-item-sliding *ngFor="let allCfg of controlConfig" >
<ion-item class="fanItem">
<ion-grid>
......@@ -29,7 +38,7 @@
</ion-col>
<ion-col size="auto" style="font-size: 13px;">
<ion-item class="fanItem" lines="none">
<ion-label style="width:60px">~</ion-label>
<ion-label style="width:15px">~</ion-label>
<!--<ion-input placeholder={{cfg.endTime}} (ionFocus)="tempHaveTouch()" style="width:50px;"></ion-input>-->
<ion-datetime class="inputDateTime timepicker" [(ngModel)]="allCfg.config.stopDate" displayFormat="MM-DD" cancelText="取消" doneText="确认"></ion-datetime>
</ion-item>
......
......@@ -26,3 +26,30 @@
width: 35%;
}
.parentDiv {
width: 94%;
//margin-top: 10px;
background-color: #ffffff;
border-radius: 7px;
padding: 5px;
}
.img {
width:40px !important;
}
.top-img {
width: 16%;
display: inline-block;
text-align: center;
float: left;
}
.top-line {
width: 40%;
height: 2px;
border-bottom: 1px solid lightgray;
display: inline-block;
margin: 15px 1% 14px 1%;;
float: left;
}
......@@ -12,14 +12,14 @@
<span [ngClass]="{'online': item.online, 'offline': !item.online}">{{item.online ? '在线' : '离线'}} </span>
<span *ngIf="item.operationModel === 1 || item.operationModel === 0" class="online">{{item.operationModel ? '远控' :'现控'}} </span>
<span *ngIf="item.operationModel === 4" class="offline">现控 </span>
<span *ngIf="item.operationModel" [ngClass]="{'online': item.isWisdomModel, 'offline': !item.isWisdomModel}" class="online">智控 </span>
<span *ngIf="item.operationModel === 1" [ngClass]="{'online': item.isWisdomModel, 'offline': !item.isWisdomModel}" class="online">智控 </span>
<span *ngIf="item.ts" class="right font-ts">{{item.ts | date: 'yyyy-MM-dd HH:mm'}}</span>
</div>
<div style="background-color: #F0F0F0;" align="center">
<v-kanban-small class="home-bar" name="温度" [inData]="item.temp" iconWidth="50%" unit="℃" [iconImg]="'../../assets/img/icon-temp.png'" [fontColor]="item.tempColor" fontSize="14px"></v-kanban-small>
<v-kanban-small class="home-bar" name="湿度" [inData]="item.humi" iconWidth="50%" unit="% RH" [iconImg]="'../../assets/img/icon-humi.png'" [fontColor]="item.humiColor" fontSize="14px"></v-kanban-small>
<v-kanban-small class="home-bar" name="热应激" [inData]="item.heatStressLevelName" iconWidth="35%" [iconImg]="'../../assets/img/icon-heat.png'" [fontColor]="item.heatStressColor" fontSize="14px"></v-kanban-small>
<v-kanban-small class="home-bar" name="在离舍" [inData]="inHouseName" iconWidth="35%" [iconImg]="'../../assets/img/icon-house.png'" iconColor="#61C7CC" fontSize="14px"></v-kanban-small>
<v-kanban-small class="home-bar" name="在离舍" [inData]="inHouseName" iconWidth="35%" [iconImg]="'../../assets/img/icon-house.png'" iconColor="#62C7CC" fontSize="14px"></v-kanban-small>
</div>
<div class="inHouseDiv font-content-title">
<ion-label class="inHouseLabel normalColor">在离舍开关控制</ion-label>
......
......@@ -34,10 +34,10 @@ export class EnvDetailPage implements OnInit {
fieldRegionName: '',
temp: 0,
humi: 0,
// tempColor: '#61C7CC',
// humiColor: '#61C7CC',
// tempColor: '#62C7CC',
// humiColor: '#62C7CC',
heatStressLevel: 0,
// heatStressColor: '#61C7CC',
// heatStressColor: '#62C7CC',
heatStressLevelName: '无',
online: 0,
operationModel: 1,
......@@ -118,8 +118,8 @@ export class EnvDetailPage implements OnInit {
this.waterchannelLink = '/env-detail/waterchannel/' + this.fieldRegionNo + '/' + this.item.operationModel;
if (this.item) {
this.item.heatStressColor = this.item.heatStressLevel === 0 ? '#61C7CC' :
this.item.heatStressLevel === 1 ? '#61C7CC' :
this.item.heatStressColor = this.item.heatStressLevel === 0 ? '#62C7CC' :
this.item.heatStressLevel === 1 ? '#62C7CC' :
this.item.heatStressLevel === 2 ? '#F8B72D' :
this.item.heatStressLevel === 3 ? '#F2401C' : '#F2401C';
......@@ -140,12 +140,12 @@ export class EnvDetailPage implements OnInit {
console.log('低于下限');
return '#F2401C';
} else {
return '#61C7CC';
return '#62C7CC';
}
}
}
}
return '#61C7CC';
return '#62C7CC';
}
getHeatStressLevelName(level) {
......@@ -198,7 +198,7 @@ export class EnvDetailPage implements OnInit {
opt.ts = new Date().valueOf();
// this.comm.remain = 20;
this.loading.presentLoading(80);
this.loading.presentLoading(Constants.LOADING_LONG);
this.api.control.controlCowedSwitch([opt, (data) => {
// if (data && data.code === 1) {
// this.getData(1);
......@@ -228,7 +228,7 @@ export class EnvDetailPage implements OnInit {
setConfusionModelControll() {
// 混乱模式
if (this.item.operationModel === Constants.CONTROLL_CONFUSION) {
if (+this.item.operationModel === Constants.CONTROLL_CONFUSION) {
this.inHouseDisabled = true;
} else {
this.inHouseDisabled = false;
......
......@@ -42,29 +42,32 @@
<h1 class="main-title-detail">控制状态</h1>
<ion-item *ngIf="batchSwitch" lines="none" insert="false" style="width: 98%;">
<div style="width:100%">
<div style="width:20%; display: inline-block; float:left;">
<div style="width:15%; display: inline-block; float:left;">
<img src="../../assets/img/batchSwitch.png" class="icon-batch-switch">
</div>
<div class="label-batch-switch font-content">
<div class="label-batch-switch font-content" style="width:20%; display: inline-block; float:left;">
一键控制
</div>
<div style="width:30%; display: inline-block; float:left;">
<ion-toggle color="secondary" mode="ios" style="display:inline-block" slot="end" [checked]="batchSwitch.op" [disabled]="batchSwitch.disabled"
[(ngModel)]="batchSwitch.op" (load)="batchSwitch.load" (click)="toggle(batchSwitch)"></ion-toggle>
</div>
</div>
<ion-toggle color="secondary" mode="ios" style="display:inline-block" slot="end" [checked]="batchSwitch.op" [disabled]="batchSwitch.disabled"
[(ngModel)]="batchSwitch.op" (load)="batchSwitch.load" (click)="toggle(batchSwitch)"></ion-toggle>
</ion-item>
<div class="card-div">
<ion-card mode="ios" *ngFor="let device of devices" class="card" color="white">
<ion-card-header mode="ios" class="cardHeader">
<ion-card-subtitle mode="ios" align="center" class="font-mini">{{device.fieldDeviceName}}</ion-card-subtitle>
<ion-card-subtitle *ngIf="device.alarm === 0" mode="ios" align="center" class="font-mini" style="color: #828282 !important;">{{device.fieldDeviceName}}</ion-card-subtitle>
<ion-card-subtitle *ngIf="device.alarm === 1" mode="ios" align="center" class="font-mini" style="color: #F2401C !important;">{{device.fieldDeviceName}}</ion-card-subtitle>
</ion-card-header>
<ion-card-content mode="ios" class="cardContent">
<ion-toggle mode="ios" class="btn-switch" *ngIf="device.alarm === 0" [checked]="device.op" [disabled]="device.disabled" color="secondary"
[(ngModel)]="device.op" (click)="deviceCheck(device)"></ion-toggle>
<ion-toggle mode="ios" class="btn-switch" *ngIf="device.alarm === 1" [checked]="device.op" [disabled]="device.disabled" color="danger"
<ion-toggle mode="ios" class="btn-switch" [checked]="device.op" [disabled]="device.disabled" color="secondary"
[(ngModel)]="device.op" (click)="deviceCheck(device)"></ion-toggle>
<!--<ion-toggle mode="ios" class="btn-switch" *ngIf="device.alarm === 1" [checked]="device.op" [disabled]="device.disabled" color="danger"-->
<!--[(ngModel)]="device.op" (click)="deviceCheck(device)"></ion-toggle>-->
</ion-card-content>
</ion-card>
</div>
......
......@@ -44,7 +44,15 @@ export class EnvFanPage implements OnInit {
commTmr: any;
constructor(private api: Api, private ac: ActivatedRoute, private load: Load, private alertController: AlertController,
public loading: Loading) { }
public loading: Loading) {
this.ac.queryParams.subscribe((data) => {
if (data && data.no !== null) {
this.fieldRegionNo = data.no;
this.operationModel = data.operationModel;
}
});
}
ngOnInit() {
// this.ionViewWillEnter();
......@@ -75,9 +83,12 @@ export class EnvFanPage implements OnInit {
init() {
this.ac.queryParams.subscribe((data) => {
this.fieldRegionNo = data.no;
this.operationModel = data.operationModel;
this.getData(0);
if (data && data.no !== null) {
this.fieldRegionNo = data.no;
this.operationModel = data.operationModel;
this.getData(0);
}
});
}
getData(time) {
......@@ -162,7 +173,7 @@ export class EnvFanPage implements OnInit {
ts: parseInt((new Date().getTime() / 1000).toString(), 10)
};
// this.comm.remain = 150;
this.loading.presentLoading(150);
this.loading.presentLoading(Constants.LOADING_LONG);
// 一键开启设备
this.api.control.controlCowedBatchSwitch([req, (data) => {
// if (data.code === 1) {
......@@ -203,7 +214,7 @@ export class EnvFanPage implements OnInit {
};
// this.comm.remain = 60;
this.loading.presentLoading(80);
this.loading.presentLoading(Constants.LOADING_SHORT);
this.api.control.controlCowedSwitch([req, (data) => {
if (data && data.code === 1) {
......@@ -221,7 +232,7 @@ export class EnvFanPage implements OnInit {
setConfusionModelControll() {
// 混乱模式
if (this.operationModel === Constants.CONTROLL_CONFUSION) {
if (+this.operationModel === Constants.CONTROLL_CONFUSION) {
this.batchSwitch.disabled = true;
this.devices.forEach((device) => {
device.disabled = true;
......
......@@ -9,15 +9,15 @@
<ion-content color='light' style="height: 100%; padding-top: 30px;">
<div style="padding-top: 10px">
<h1 class="subTittle">牛舍热应激状态</h1>
<h1 class="main-title">牛舍热应激状态</h1>
<div style="width:100%; padding: 10px">
<img [src]="'../../assets/img/level-' + heatStressLevel + '.png'" style="width:50px !important">
</div>
<h1 class="subTittle">近8个小时环境参数曲线</h1>
<h1 class="main-title">近8个小时环境参数曲线</h1>
<div echarts [options]="chartOption" class="demo-chart"></div>
<h1 class="subTittle">近8个小时环境参数表</h1>
<div style="width: 98%">
<h1 class="main-title">近8个小时环境参数表</h1>
<div class="div-table">
<!--<ngx-datatable class="material" [rows]="tableRows" [columnMode]="'force'" [scrollbarH]="true" [scrollbarV]="true" style="text-align: center; font-size:14px">-->
<!--<ngx-datatable-column name="时间" prop="ts" [width]="80">-->
<!--</ngx-datatable-column>-->
......@@ -51,20 +51,22 @@
<!--</ngx-datatable>-->
<ngx-datatable class="material"
[rows]="tableRows"
[columnMode]="'force'"
[columnMode]="ColumnMode.force"
[scrollbarH]="true"
[scrollbarV]="true"
[headerHeight]="50"
style="text-align: center; font-size:14px">
<ngx-datatable-column name="时间" prop="ts" [width]="70">
[rowClass]="getRowClass"
[cssClasses]="'font-content'"
style="text-align: center; background-color: #ffffff;" class="font-content">
<ngx-datatable-column name="时间" prop="ts" [width]="70" [headerClass]="getHeaderClass">
</ngx-datatable-column>
<ngx-datatable-column name="热应激" prop="thi" [width]="70">
<ngx-datatable-column name="热应激" prop="thi" [width]="70" [headerClass]="getHeaderClass">
</ngx-datatable-column>
<ngx-datatable-column name="温度<br>℃" prop="temp" [width]="60">
<ngx-datatable-column name="温度<br>℃" prop="temp" [width]="60" [headerClass]="getHeaderClass">
</ngx-datatable-column>
<ngx-datatable-column name="湿度<br>% RH" prop="humi" [width]="60">
<ngx-datatable-column name="湿度<br>% RH" prop="humi" [width]="60" [headerClass]="getHeaderClass">
</ngx-datatable-column>
<ngx-datatable-column name="氨气浓度<br>ppm" prop="NH3" [width]="90">
<ngx-datatable-column name="氨气浓度<br>ppm" prop="NH3" [width]="90" [headerClass]="getHeaderClass">
</ngx-datatable-column>
</ngx-datatable>
</div>
......
......@@ -36,8 +36,11 @@
}
.demo-chart {
width: 100%;
width: 96%;
height: 230px;
margin-left: 2%;
margin-right: 2%;
margin-bottom: 15px;
}
.title {
......@@ -54,3 +57,15 @@
line-height: 25px;
margin-bottom: 5px;
}
.div-table {
width: 96%;
margin-left: 2%;
margin-right: 2%;
margin-bottom: 10px;
}
.table-header {
// background-color: #222428;
// color: #ffffff;
}
......@@ -2,7 +2,7 @@ import {Component, OnInit} from '@angular/core';
import {ActivatedRoute} from '@angular/router';
import {Api} from '../../service/api';
import {Load} from '../../service/load';
import {NgxDatatableModule} from '@swimlane/ngx-datatable';
import {NgxDatatableModule, ColumnMode} from '@swimlane/ngx-datatable';
import {DateFormatter} from '@angular/common/src/pipes/deprecated/intl';
import {DatePipe} from '@angular/common';
......@@ -13,6 +13,7 @@ import {DatePipe} from '@angular/common';
})
export class EnvHistoryPage implements OnInit {
ColumnMode = ColumnMode;
constructor(private api: Api, private ac: ActivatedRoute, private load: Load, private datePipe: DatePipe) {
}
......@@ -37,7 +38,8 @@ export class EnvHistoryPage implements OnInit {
{column: 'temp', width: 70},
{column: 'humi', width: 70},
{column: 'NH3', width: 90}
]
];
rowCount = 0;
ngOnInit() {
this.init();
......@@ -140,8 +142,9 @@ export class EnvHistoryPage implements OnInit {
paintTable(param) {
this.tableRows = [];
param.map(item => {
param.map((item, index) => {
this.tableRows.push({
id: index + 1,
ts: this.datePipe.transform(item.ts, 'hh:mm'),
thi: item.heatStressLevel,
temp: item.temp.toFixed(2),
......@@ -150,11 +153,16 @@ export class EnvHistoryPage implements OnInit {
});
});
// this.tableColumns.forEach((col: any) => {
// const colReWidth = this.tableColumnWidths.find(colWidth => colWidth.column === col.prop);
// if (colReWidth) {
// col.width = colReWidth.width;
// }
// });
}
getRowClass(row) {
return {
'light-color': row.id % 2 === 0
};
}
getHeaderClass() {
return 'table-header';
}
}
......@@ -34,19 +34,25 @@
[iconImg1]="'../../assets/img/level-good.png'"
[iconImg2]="'../../assets/img/level-bad.png'"
[iconImg3]="'../../assets/img/alarm.png'"
iconColor1="#61C7CC" iconColor2="#F8B72D" iconColor3="#F2401C"
iconColor1="#62C7CC" iconColor2="#F8B72D" iconColor3="#F2401C"
fontSize="30px" ></v-kanban-double>
<!--<v-kanban-large class="home-bar" name="热应激" [inData]="thiBad" [iconImg]="'../../assets/img/level-bad.png'" iconColor="#FAB139" fontSize="25px" iconWidth="45px !important"></v-kanban-large>-->
<!--<v-kanban-large class="kanban-large" name="故障总数" [inData]="alarmTotal" [iconImg]="'../../assets/img/alarm.png'" iconColor="#F2401C" fontSize="25px" iconWidth="45px !important"></v-kanban-large>-->
</div>
<h1 class="main-title">牛舍列表</h1>
<ion-list *ngIf="items.length > 0" mode="md" class="listview" insert = "false" line="none" style="width:96%;margin-left: 2%">
<ion-list *ngIf="items.length > 0" mode="md" class="list-view" insert = "false" line="none">
<ion-item *ngFor="let item of items" (click)="toControl(item)" class="ion-item" style="width: 100%; --padding-start: 0px">
<div class="item">
<div class="top">
<div style="float:left;padding-top:3px;"><img [src]="'../../assets/img/house.png'" style="display: inline-block;margin-left: 10px; margin-right: 10px;width:20px !important"> </div>
<div style="width:80%; float:left; padding-top: 4px;">
<span style="text-align: center" class="font-sub-title">{{item.fieldRegionName}}</span><span style="text-align: center; font-size:12px; padding-left:10px; color:red;" *ngIf="item.operationModel === 4">(部分设备处于现控状态)</span></div>
<div style="float:left;padding-top:3px;">
<img [src]="'../../assets/img/house.png'" style="display: inline-block;margin-left: 10px; margin-right: 10px;width:20px !important">
</div>
<div style="width:60%; float:left; padding-top: 4px;">
<span style="text-align: center" class="font-sub-title">{{item.fieldRegionName}}</span><span style="text-align: center; font-size:12px; padding-left:10px; color:red;" *ngIf="item.operationModel === 4">(部分设备处于现控状态)</span>
</div>
<div style="width:25%; float:left; padding-top: 4px; text-align:right;">
<img *ngIf="item.alarm" src="../../../assets/img/alarm-small.png" style="display: inline-block; width:25px !important">
</div>
</div>
<div class="content font-content">
<div class="detailInfo" style="width: 40%">热应激: &nbsp;<span class="warmColor{{item.heatStressLevel}}">{{item.heatStressLevelName}}</span></div>
......@@ -67,7 +73,7 @@
<!-- 1:远控 0:现控 4:混乱 -->
<div *ngIf="item.operationModel === 1 || item.operationModel === 0" class="online">{{item.operationModel === 1 ? '远控' :'现控'}} </div>
<div *ngIf="item.operationModel === 4" class="offline">现控 </div>
<div *ngIf="item.operationModel !== null" [ngClass]="{'online': item.isWisdomModel, 'offline': !item.isWisdomModel}" class="online">智控 </div>
<div *ngIf="item.operationModel === 1" [ngClass]="{'online': item.isWisdomModel, 'offline': !item.isWisdomModel}" class="online">智控 </div>
<div *ngIf="item.ts !== null" class="right font-note">{{item.ts | date: 'yyyy-MM-dd HH:mm'}}</div>
</div>
</div>
......
......@@ -9,7 +9,8 @@
}
.item {
margin-bottom: 10px;
margin-top: 5px;
margin-bottom: 5px;
padding: 0px 3px 0px;
background-color: #ffffff;
display:block;
......@@ -23,6 +24,7 @@
//font-size: 17px;
display: block;
width: 100%;
overflow:hidden;
i.vo.v-tixing{
float: right;
......@@ -43,15 +45,18 @@
.bottom {
//border-top: 1px solid #ccc;
padding: 3px;
padding: 3px 5px 3px 5px;
color: #aaa;
margin-top: 60px;
// margin-top: 60px;
width: 100%;
overflow:hidden;
}
.content{
width:100%;
margin-top: 25px;
padding-left:10px;
// margin-top: 25px;
color: #aaa;
overflow:hidden;
// text-align: center;
}
......@@ -63,7 +68,7 @@
//.online {
// border-radius: 6px;
// background-color: #61C7CC;
// background-color: #62C7CC;
// display: inline-block;
// vertical-align: middle;
// box-shadow: #ccc 0.5px 0.5px 3px;
......@@ -90,6 +95,7 @@
.right {
float: right;
padding-top: 5px;
padding-right: 10px;
}
.topSearch {
......@@ -122,3 +128,9 @@
margin: 3px;
width: 32%;
}
.list-view {
width:96%;
margin-left: 2%;
padding-bottom: 0px;
}
......@@ -39,11 +39,11 @@
</ion-grid>
</ion-item>
<h1 class="main-title-detail">时间模式</h1>
<ion-item lines="none">
<h1 class="main-title-detail" *ngIf="controlModel === 2">时间模式</h1>
<ion-item lines="none" *ngIf="controlModel === 2 || controlModel === 3">
<div style="width:100%">
<div class="div-calender bk-calender">
<div class="font-sub-title div-calender-value">{{name}}</div>
<div class="font-sub-title div-calender-value content-text-color">{{name}}</div>
</div>
<div style="width:35%; display: inline-block; float:left; margin-top:35px">
<span class="font-content"> 开启时间:&nbsp;<span class="main-color">{{on}}</span></span>
......@@ -58,29 +58,32 @@
<h1 class="main-title-detail">控制状态</h1>
<ion-item *ngIf="devices" lines="none" insert="false">
<div style="width:100%">
<div style="width:20%; display: inline-block; float:left;">
<div style="width:15%; display: inline-block; float:left;">
<img src="../../assets/img/batchSwitch.png" class="icon-batch-switch">
</div>
<div class="label-batch-switch font-content">
<div class="label-batch-switch font-content" style="width:20%; display: inline-block; float:left;">
一键控制
</div>
<div style="width:30%; display: inline-block; float:left;">
<ion-toggle color="secondary" mode="ios" style="display:inline-block" slot="end" [checked]="batchSwitch.op" [disabled]="batchSwitch.disabled"
[(ngModel)]="batchSwitch.op" (load)="batchSwitch.load" (click)="toggle(batchSwitch)"></ion-toggle>
</div>
</div>
<ion-toggle color="secondary" mode="ios" style="display:inline-block" slot="end" [checked]="batchSwitch.op" [disabled]="batchSwitch.disabled"
[(ngModel)]="batchSwitch.op" (load)="batchSwitch.load" (click)="toggle(batchSwitch)"></ion-toggle>
<!--<v-switch (click)="allCheck(batchSwitch)" [value]="batchSwitch.op" [disabled]="batchSwitch.disabled" [loading]="batchSwitch.load"></v-switch>-->
</ion-item>
<div class="card-div">
<ion-card *ngFor="let device of devices" class="card" color="white">
<ion-card-header class="cardHeader">
<ion-card-subtitle align="center" class="font-mini">{{device.fieldDeviceName}}</ion-card-subtitle>
<ion-card-subtitle *ngIf="device.alarm === 0" align="center" class="font-mini" style="color: #828282 !important;">{{device.fieldDeviceName}}</ion-card-subtitle>
<ion-card-subtitle *ngIf="device.alarm === 1" align="center" class="font-mini" style="color: #F2401C !important;">{{device.fieldDeviceName}}</ion-card-subtitle>
</ion-card-header>
<ion-card-content class="cardContent">
<ion-toggle mode="ios" class="btn-switch" *ngIf="device.alarm === 0" [checked]="device.op" [disabled]="device.disabled" color="secondary"
<ion-toggle mode="ios" class="btn-switch" [checked]="device.op" [disabled]="device.disabled" color="secondary"
[(ngModel)]="device.op" (click)="deviceCheck(device)"></ion-toggle>
<ion-toggle mode="ios" class="btn-switch" *ngIf="device.alarm === 1" [checked]="device.op" [disabled]="device.disabled" color="danger"
[(ngModel)]="device.op" (click)="deviceCheck(device)"></ion-toggle>
<!--<v-switch class="btn-switch" (click)="deviceCheck(device)" [value]="device.state" [disabled]="device.disabled" [loading]="device.load"></v-switch>-->
<!--<ion-toggle mode="ios" class="btn-switch" *ngIf="device.alarm === 1" [checked]="device.op" [disabled]="device.disabled" color="danger"-->
<!--[(ngModel)]="device.op" (click)="deviceCheck(device)"></ion-toggle>-->
</ion-card-content>
</ion-card>
</div>
......
......@@ -46,5 +46,4 @@ i.vo {
margin-top: 35px;
text-align: center;
font-weight: bold;
color: #565050;
}
......@@ -121,8 +121,8 @@ export class EnvLightPage implements OnInit {
initButtons() {
if (this.controlModel === Constants.CONTROLL_REMOTR || this.controlModel === Constants.CONTROLL_SELF) {
// 远控+自控 的场合
if (this.controlModel === Constants.CONTROLL_REMOTR) {
// 远控(手控) 的场合
// 一键控制: 活性
this.batchSwitch.disabled = false;
this.devices.forEach((device) => {
......@@ -131,7 +131,7 @@ export class EnvLightPage implements OnInit {
} else {
// 其他
// 一键控制: 非活性
this.batchSwitch.disabled = false;
this.batchSwitch.disabled = true;
}
if (this.controlModel === Constants.CONTROLL_REMOTR) {
......@@ -206,7 +206,7 @@ export class EnvLightPage implements OnInit {
ts: parseInt((new Date().getTime() / 1000).toString(), 10)
};
// this.comm.remain = 150;
this.loading.presentLoading(150);
this.loading.presentLoading(Constants.LOADING_LONG);
// 一键开启设备
this.api.control.controlCowedBatchSwitch([req, (data) => {
......@@ -244,7 +244,7 @@ export class EnvLightPage implements OnInit {
ts: parseInt((new Date().getTime() / 1000).toString(), 10)
};
// this.comm.remain = 60;
this.loading.presentLoading(80);
this.loading.presentLoading(Constants.LOADING_SHORT);
this.api.control.controlCowedSwitch([req, (data) => {
if (data && data.code === 1) {
this.comm.remain = 0;
......@@ -262,7 +262,7 @@ export class EnvLightPage implements OnInit {
setConfusionModelControll() {
// 混乱模式
if (this.operationModel === Constants.CONTROLL_CONFUSION) {
if (+this.operationModel === Constants.CONTROLL_CONFUSION) {
this.batchSwitch.disabled = true;
this.devices.forEach((device) => {
device.disabled = true;
......
......@@ -51,7 +51,7 @@
</div>
<div style="display: inline-block; float:left; padding-top: 2px;">
<span class="font-content">{{bump.alarm === 1 ? '异常' : '运行'}}</span>
<span class="font-content" style="margin-left: 30px">压力:&nbsp;<span class="main-color">{{bump.press}} Mpa</span></span>
<span class="font-content" style="margin-left: 30px">压力:&nbsp;<span class="main-color">{{bump.press | number:'0.0-3'}} Mpa</span></span>
</div>
</ion-col>
</ion-row>
......@@ -63,20 +63,20 @@
<ion-grid>
<ion-row>
<ion-col>
<div style="width:100%">
<div style="width:100%;padding-left: 3px;">
<span class="font-content">{{fieldDeviceNameA}}喷淋时间:&nbsp;<span class="main-color">{{controlConfig.a}} 秒</span></span>
</div>
</ion-col>
<ion-col>
<div style="width:100%">
<span class="font-content">{{fieldDeviceNameB}}喷淋时间:&nbsp;<span class="main-color">{{controlConfig.b}} 秒</span></span>
<span class="font-content">间隔时间:&nbsp;<span class="main-color">{{controlConfig.interval}} 秒</span></span>
</div>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<div style="width:100%">
<span class="font-content">间隔时间:&nbsp;<span class="main-color">{{controlConfig.interval}} 秒</span></span>
<div style="width:100%;padding-left: 3px;">
<span class="font-content">{{fieldDeviceNameB}}喷淋时间:&nbsp;<span class="main-color">{{controlConfig.b}} 秒</span></span>
</div>
</ion-col>
</ion-row>
......@@ -90,12 +90,14 @@
<ion-card-title class="card-title">
<div style="width:100%;text-align:center;">
<div class="card-title-label">
<div style="text-align: center;margin:auto">{{device.fieldDeviceName}}</div>
<div *ngIf="device.alarm === 0" style="text-align: center;margin:auto; color: #828282 !important;">{{device.fieldDeviceName}}</div>
<div *ngIf="device.alarm === 1" style="text-align: center;margin:auto; color: #F2401C !important;">{{device.fieldDeviceName}}</div>
</div>
<div style="width:48%;display: inline-block">
<img *ngIf="device.cycle === 1 && device.state === 1" src="../../assets/img/shower-ing.gif" style="width:50px !important; margin: auto;">
<img *ngIf="device.cycle === 1 && device.state === 0" src="../../assets/img/shower-1.png" style="width:50px !important; margin: auto;">
<img *ngIf="device.cycle === 0 && device.state === 0" src="../../assets/img/shower-0.png" style="width:50px !important; margin: auto;">
<img *ngIf="device.cycle === 0 && device.state === 1" src="../../assets/img/shower-0.png" style="width:50px !important; margin: auto;">
</div>
</div>
</ion-card-title>
......@@ -103,16 +105,12 @@
</ion-card-header>
<ion-card-content class="cardContent">
<span class="font-content">压力:&nbsp;<span class="main-color">{{device.press}} MPa</span></span><br>
<!-- <ion-toggle [checked]="a.state"></ion-toggle>-->
<ion-toggle mode="ios" class="btn-switch" *ngIf="device.alarm === 0" [checked]="device.op" [disabled]="device.disabled" color="secondary"
<span class="font-content">压力:&nbsp;<span class="main-color">{{device.press | number:'0.0-3'}} MPa</span></span><br>
<ion-toggle mode="ios" class="btn-switch" [checked]="device.op" [disabled]="device.disabled" color="secondary"
[(ngModel)]="device.op" (click)="deviceCheck(device)"></ion-toggle>
<ion-toggle mode="ios" class="btn-switch" *ngIf="device.alarm === 1" [checked]="device.op" [disabled]="device.disabled" color="danger"
[(ngModel)]="device.op" (click)="deviceCheck(device)"></ion-toggle>
<!--<v-switch class="btn-switch" (click)="deviceCheck(a)" [value]="a.state" [loading]="a.load"></v-switch>-->
</ion-card-content>
</ion-card>
</div>
</div>
<!--<v-loading-bump style="z-index: 9999; color: red" [remain]="comm.remain" *ngIf="comm.isLoading"></v-loading-bump>-->
</ion-content>
......@@ -168,7 +168,7 @@ export class EnvShowerPage implements OnInit {
ts: parseInt((new Date().getTime() / 1000).toString(), 10)
};
// this.comm.remain = 60;
this.loading.presentLoading(80);
this.loading.presentLoading(Constants.LOADING_SHORT);
this.api.control.controlCowedSwitch([req, (data) => {
if (data && data.code === 1) {
this.comm.remain = 0;
......@@ -187,7 +187,7 @@ export class EnvShowerPage implements OnInit {
setConfusionModelControll() {
// 混乱模式
if (this.operationModel === Constants.CONTROLL_CONFUSION) {
if (+this.operationModel === Constants.CONTROLL_CONFUSION) {
this.param.forEach((device) => {
device.disabled = true;
});
......
......@@ -9,15 +9,20 @@
<ion-card-header class="cardTitle">
<ion-card-title class="cardHeader">
<div style="width: 100%">
<div style="width:10%; float:left; display: inline-block"><img src="../../assets/img/model-on.png" class="modelState"></div>
<div style="width:88%; float:left; display: inline-block;padding-top: 2px;" class="font-sub-title">{{device .fieldDeviceName}}</div>
<div style="float:left; display: inline-block">
<img src="../../assets/img/water-channel.png" class="modelState" style="margin-right: 5px !important;"></div>
<div style="width:88%; float:left; display: inline-block;padding-top: 2px;" class="font-content-title">{{device .fieldDeviceName}}</div>
</div>
</ion-card-title>
</ion-card-header>
<ion-card-content class="cardContent font-content" style="margin-top:15px;">
<span>当前功率 : </span> <span style="color:#0bb8cc"> {{device.kw}} KW<br></span>
<span>估计加热设备台数 : </span> <span style="color:#0bb8cc"> {{device.deviceOnlineNum}} 台</span>
<ion-card-content class="cardContent" style="margin-top:5px;">
<div style="width:100%; overflow: hidden;">
<span class="font-content">当前功率 : </span> <span class="main-color font-input"> {{device.kw}} KW<br></span>
</div>
<div style="width:100%; overflow: hidden;">
<span class="font-content">估计加热设备台数 : </span> <span class="main-color font-input"> {{device.deviceOnlineNum}} 台</span>
</div>
</ion-card-content>
</ion-card>
</div>
......
......@@ -13,12 +13,13 @@
.cardHeader {
--padding-inline-start: 0px !important;
--padding-inline-end: 0px !important;
padding: 10px;
padding-top: 10px;
padding-left: 10px;
font-size: 18px;
text-align:left;
}
.cardContent {
padding: 0px 5px 5px 35px;
padding: 0px 5px 5px 38px;
}
.sucCir {
......
<router-outlet name='tabs' (activate)='onActivate($event)'></router-outlet>
<ion-content>
<ion-tabs>
<ion-tab-bar slot="bottom">
<ion-tab-bar slot="bottom" colo="secondary">
<ion-tab-button tab="tab-home" selected="true">
<ion-tab-button tab="tab-home" selected="true" color="">
<ion-label>首页</ion-label>
<ion-icon name="home"></ion-icon>
</ion-tab-button>
......
......@@ -15,4 +15,9 @@ export class Constants {
public static CONTROLL_SELF = 2; // 自控
public static CONTROLL_WISDOM = 3; // 智慧控制
public static CONTROLL_CONFUSION = 4; // 智慧控制
public static LOADING_SHORT = 10; // 单个开关
public static LOADING_LONG = 40; // 一键控制等
}
......@@ -163,7 +163,7 @@ img {
.font-content {
font-size: 13px !important;
color: #8e8e8e !important;
color: #828282 !important;
}
.font-input {
......@@ -172,22 +172,22 @@ img {
.font-note {
font-size: 13px;
color: #8e8e8e;
color: #828282;
}
.font-smaller {
font-size: 12px !important;
color: #8e8e8e !important;
color: #828282 !important;
}
.font-mini {
font-size: 10px;
color: #8e8e8e !important;
font-size: 10px !important;
color: #828282;
}
.font-ts {
font-size: 13px;
color: #8e8e8e;
color: #828282;
}
.font-alarm {
......@@ -196,7 +196,7 @@ img {
}
.content-text-color {
color: #8e8e8e;
color: #828282;
}
.note-text-color {
......@@ -204,12 +204,16 @@ img {
}
.main-color {
color:#61C7CC;
color:#62C7CC;
}
.light-color {
// color: #828282;
// background-color: rgba(119, 249, 254, 0.8);
}
.spinnerColor {
--spinner-color: #61C7CC;
--spinner-color: #62C7CC;
}
.alarmColor {
......@@ -217,13 +221,13 @@ img {
}
.normalColor {
color: #8e8e8e;
color: #828282;
}
.main-title {
font-size: 16px;
padding-left: 5px;
border-left: 5px solid #61C7CC;
border-left: 5px solid #62C7CC;
line-height: 25px;
margin-bottom: 5px;
margin-left: 10px;
......@@ -234,7 +238,7 @@ img {
background-color: #ffffff;
font-size: 16px;
padding-left: 5px;
border-left: 5px solid #61C7CC;
border-left: 5px solid #62C7CC;
line-height: 25px;
margin-bottom: 5px;
margin-left: 5px;
......@@ -277,8 +281,8 @@ img {
}
.online {
border-radius: 6px;
background-color: #61C7CC;
border-radius: 10px;
background-color: #62C7CC;
display: inline-block;
vertical-align: middle;
box-shadow: #ccc 0.5px 0.5px 3px;
......@@ -286,11 +290,11 @@ img {
color: white;
margin-left: 5px;
margin-right: 2px;
font-size: 13px;
font-size: 12px;
}
.offline {
border-radius: 6px;
border-radius: 10px;
background-color: #9ea7b4;
display: inline-block;
vertical-align: middle;
......@@ -299,7 +303,7 @@ img {
color: white;
margin-left: 5px;
margin-right: 2px;
font-size: 13px;
font-size: 12px;
}
......
......@@ -12,13 +12,19 @@
--ion-color-primary-tint: #4c8dff;
/** secondary **/
// --ion-color-secondary: #0cd1e8;
--ion-color-secondary: #61C7CC;
--ion-color-secondary: #62C7CC;
--ion-color-secondary-rgb: 12, 209, 232;
--ion-color-secondary-contrast: #ffffff;
--ion-color-secondary-contrast-rgb: 255, 255, 255;
--ion-color-secondary-shade: #61C7CC;
--ion-color-secondary-tint: #61C7CC;
--ion-color-secondary-shade: #62C7CC;
--ion-color-secondary-tint: #62C7CC;
// --ion-color-secondary: #0cd1e8;
//--ion-color-secondary: #61C7CC;
//--ion-color-secondary-rgb: 12, 209, 232;
//--ion-color-secondary-contrast: #ffffff;
//--ion-color-secondary-contrast-rgb: 255, 255, 255;
//--ion-color-secondary-shade: #61C7CC;
//--ion-color-secondary-tint: #61C7CC;
/** tertiary **/
--ion-color-tertiary: #7044ff;
......
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