Skip to content

M
muChangApp
Commit 56932e6c authored by zhuangzhuang's avatar zhuangzhuang
Browse files
Options

修改牛舍配置页: 风机,水槽,照明模式添加或替换

parent f683a72f
Show whitespace changes
Inline Side-by-side
Showing with 151 additions and 125 deletions
src/app/animations/animations.ts
View file @ 56932e6c
......@@ -34,25 +34,24 @@ const opts = {
],
stretch: [
style({ height: '0' }),
animate(styles.easeIn, style({ height: '*' }))
animate(styles.faseOutSlowIn, style({ height: '*' }))
],
flyIn: [
style({ transform: 'translateY(-50%)', zIndex: '-5' }), // translateX(-100%)
animate(styles.easeIn, style({ transform: 'translateY(0)' }))
style({ transform: 'translateX(-100%)' }), // translateX(-100%)
animate(styles.inOutBack, style({ transform: '*' }))
],
flyOut: [
style({ zIndex: '-5' }),
animate(styles.easeIn, style({ transform: 'translateY(-50%)'}))
style({ transform: '*' }),
animate(styles.inOutBack, style({ transform: 'translateX(-100%)' }))
],
up: [
style({ transform: 'translateY(-50%)' }), // translateX(-100%)
animate(styles.inOutBack, style({ transform: '*' }))
],
down: [
style({ transform: '*' }),
animate(styles.inOutBack, style({ transform: 'translateY(-50%)' }))
],
// flyIn: [
// style({ transform: 'translateX(-100%)' }), // translateX(-100%)
// animate(styles.inOutBack, style({ transform: '*' }))
// ],
// flyOut: [
// style({ transform: '*' }),
// animate(styles.inOutBack, style({ transform: 'translateX(-100%)' }))
// ],
zoomIn: [
style({ transform: 'scale(.5)' }),
animate(styles.inOutBack, style({ transform: '*' }))
......@@ -75,6 +74,8 @@ export const flyIn = [trigger('flyIn', [transition('void => *', opts.flyIn)])]
export const flyOut = [trigger('flyOut', [transition('* => void', opts.flyOut)])]
export const zoomIn = [trigger('zoomIn', [transition('void => *', opts.zoomIn)])]
export const zoomOut = [trigger('zoomOut', [transition('* => void', opts.zoomOut)])]
export const up = [trigger('zoomIn', [transition('void => *', opts.up)])]
export const down = [trigger('zoomOut', [transition('* => void', opts.down)])]
export const animations = [
trigger('animations', [
......@@ -85,6 +86,8 @@ export const animations = [
transition('* => flyIn', opts.flyIn),
transition('* => flyOut', opts.flyOut),
transition('* => zoomIn', opts.zoomIn),
transition('* => zoomOut', opts.zoomOut)
transition('* => zoomOut', opts.zoomOut),
transition('* => up', opts.up),
transition('* => down', opts.down)
])
]
src/app/envCtrl/env-cfg/env-cfg.page.html
View file @ 56932e6c
......@@ -24,8 +24,8 @@
<ion-icon name="add" slot="end" class="iconOpen" *ngIf="!isOpenProperty" (click)="openItem('propertyCfg')"></ion-icon>
<ion-icon name="remove" slot="end" class="iconOpen" *ngIf="isOpenProperty" (click)="openItem('propertyCfg')"></ion-icon>
</ion-item-divider>
<!--<ion-item class="fanItem" lines="none" *ngIf="isOpenProperty" @flyIn @flyOut >-->
<ion-item class="fanItem" lines="none" *ngIf="isOpenProperty" @flyIn @flyOut>
<!--<ion-item class="fanItem" lines="none" *ngIf="isOpenProperty" @shrink @stretch @flyIn @flyOut >-->
<ion-item class="fanItem" lines="none" *ngIf="isOpenProperty" @shrink >
<ion-grid>
<ion-row>
<ion-col>
......@@ -55,7 +55,8 @@
<ion-icon name="add" slot="end" class="iconOpen" *ngIf="!isOpenFan" (click)="openItem('fanCfg')"></ion-icon>
<ion-icon name="remove" slot="end" class="iconOpen" *ngIf="isOpenFan" (click)="openItem('fanCfg')"></ion-icon>
</ion-item-divider>
<ion-item class="fanItem" lines="none" *ngIf="isOpenFan">
<div *ngIf="isOpenFan" @shrink >
<ion-item class="fanItem" lines="none" >
<ion-grid>
<ion-row>
<ion-col>
......@@ -80,6 +81,8 @@
</ion-item>
</div>
</div>
<div *ngIf="shower">
<ion-item-divider sticky="true" class="itemDriver subTitle">
<ion-label style="width: 40%">喷淋模式配置</ion-label>
......@@ -90,7 +93,7 @@
<ion-icon name="add" slot="end" class="iconOpen" *ngIf="!isOpenShower" (click)="openItem('showerCfg')"></ion-icon>
<ion-icon name="remove" slot="end" class="iconOpen" *ngIf="isOpenShower" (click)="openItem('showerCfg')"></ion-icon>
</ion-item-divider>
<div *ngIf="isOpenShower">
<div *ngIf="isOpenShower" @shrink >
<ion-item-sliding *ngFor="let cfg of shower.controlConfig">
<ion-item class="fanItem">
<ion-grid>
......@@ -143,15 +146,16 @@
</ion-grid>
</ion-item>
<ion-item-options side="end">
<ion-button color='danger' expand="full" style="width:15%;height:90%" >删除</ion-button>
<ion-button color='danger' expand="full" style="width:15%;height:90%" (click)="deleteShowerModel(cfg)">删除</ion-button>
</ion-item-options>
</ion-item-sliding>
</div>
<ion-item width="100%" lines="none" *ngIf="isOpenShower">
<ion-item width="100%" lines="none">
<ion-button color="secondary" class="addBtn" round (click)="onAddModel()">添加模式</ion-button>
</ion-item>
</div>
</div>
<div *ngIf="light">
<ion-item-divider sticky="true" class="itemDriver subTitle">
<ion-label style="width: 40%">照明配置</ion-label>
......@@ -162,28 +166,28 @@
<ion-icon name="add" slot="end" class="iconOpen" *ngIf="!isOpenLight" (click)="openItem('lightCfg')"></ion-icon>
<ion-icon name="remove" slot="end" class="iconOpen" *ngIf="isOpenLight" (click)="openItem('lightCfg')"></ion-icon>
</ion-item-divider>
<div *ngIf="isOpenLight">
<ion-item-sliding *ngFor="let cfg of light.controlConfig">
<ion-item style="--padding-start: 0px">
<div *ngIf="isOpenLight" @shrink >
<ion-item-sliding *ngFor="let cfg of light.controlConfig" >
<ion-item class="fanItem">
<ion-grid>
<ion-row style="width: 100%">
<ion-col size="auto" style="font-size: 13px;">
<ion-item style="font-size: 13px;--padding-start: 0px" lines="none">
<ion-item class="fanItem" lines="none">
<ion-label style="width:80px">模式名</ion-label>
<ion-input style="width:50px;" [(ngModel)]="cfg.name"></ion-input>
<ion-input style="width:80px;" [(ngModel)]="cfg.name"></ion-input>
</ion-item>
</ion-col>
</ion-row>
<ion-row style="width: 100%">
<ion-col size="auto" style="font-size: 13px;">
<ion-item class="timepickerItem" lines="none">
<ion-item class="fanItem" lines="none">
<ion-label style="width:80px">日期范围</ion-label>
<!--<ion-input placeholder={{cfg.startTime}} (ionFocus)="tempHaveTouch()" style="width:50px;"></ion-input>-->
<ion-datetime [(ngModel)]="cfg.startDate" displayFormat="MM-DD" cancelText="取消" doneText="确认" class="timepicker"></ion-datetime>
</ion-item>
</ion-col>
<ion-col size="auto" style="font-size: 13px;">
<ion-item class="timepickerItem" lines="none">
<ion-item class="fanItem" lines="none">
<ion-label style="width:80px">~</ion-label>
<!--<ion-input placeholder={{cfg.endTime}} (ionFocus)="tempHaveTouch()" style="width:50px;"></ion-input>-->
<ion-datetime [(ngModel)]="cfg.stopDate" displayFormat="MM-DD" cancelText="取消" doneText="确认" class="timepicker"></ion-datetime>
......@@ -192,14 +196,14 @@
</ion-row>
<ion-row style="width: 100%">
<ion-col size="auto" style="font-size: 13px;">
<ion-item style="font-size: 13px;--padding-start: 0px" lines="none">
<ion-item class="fanItem" lines="none">
<ion-label style="width:80px">开灯时间</ion-label>
<ion-datetime [(ngModel)]="cfg.on" displayFormat="HH:mm" cancelText="取消" doneText="确认" class="timepicker"></ion-datetime>
<!--<ion-input style="width:50px;" [(ngModel)]="cfg.on" (ionFocus)="tempHaveTouch()"></ion-input>-->
</ion-item>
</ion-col>
<ion-col size="auto" style="font-size: 13px;">
<ion-item style="font-size: 13px;--padding-start: 0px" lines="none">
<ion-item class="fanItem" lines="none">
<ion-label style="width:80px">关灯时间</ion-label>
<ion-datetime [(ngModel)]="cfg.off" displayFormat="HH:mm" cancelText="取消" doneText="确认" class="timepicker"></ion-datetime>
<!--<ion-input style="width:50px;" [(ngModel)]="cfg.off" (ionFocus)="tempHaveTouch()"></ion-input>-->
......@@ -209,23 +213,24 @@
</ion-grid>
</ion-item>
<ion-item-options side="end">
<ion-button color='danger' expand="full" style="width:15%;height:90%" >删除</ion-button>
<ion-button color='danger' expand="full" style="width:15%;height:90%" (click)="deleteLightModel(cfg)">删除</ion-button>
</ion-item-options>
</ion-item-sliding>
</div>
<ion-item width="100%" lines="none" *ngIf="isOpenLight">
<ion-button color="secondary" class="addBtn" round (click)="onChangeModel()">替换模式</ion-button>
</ion-item>
</div>
</div>
<div *ngIf="waterChannel">
<ion-item-divider sticky="true" class="itemDriver subTitle">
<ion-label>水槽预警时间段配置</ion-label>
<ion-icon name="add" slot="end" class="iconOpen" *ngIf="!isOpenWaterChannel" (click)="openItem('waterChannelCfg')"></ion-icon>
<ion-icon name="remove" slot="end" class="iconOpen" *ngIf="isOpenWaterChannel" (click)="openItem('waterChannelCfg')"></ion-icon>
</ion-item-divider>
<ion-item-sliding *ngIf="isOpenWaterChannel">
<ion-item class="fanItem">
<ion-item class="fanItem" *ngIf="isOpenWaterChannel" @shrink >
<ion-grid>
<ion-row style="width: 100%">
<ion-col size="auto" style="font-size: 13px;">
......@@ -248,10 +253,6 @@
</ion-row>
</ion-grid>
</ion-item>
<ion-item-options side="end">
<ion-button color='danger' expand="full" style="width:15%;height:90%" >删除</ion-button>
</ion-item-options>
</ion-item-sliding>
</div>
<ion-item-divider sticky="true" class="itemDriver subTitle">
......@@ -259,7 +260,7 @@
<ion-icon name="add" slot="end" class="iconOpen" *ngIf="!isOpenInHouse" (click)="openItem('inHouseCfg')"></ion-icon>
<ion-icon name="remove" slot="end" class="iconOpen" *ngIf="isOpenInHouse" (click)="openItem('inHouseCfg')"></ion-icon>
</ion-item-divider>
<ion-item class="fanItem" *ngIf="isOpenInHouse">
<ion-item class="fanItem" *ngIf="isOpenInHouse" @shrink >
<ion-grid>
<!--<ion-row>-->
<!--<ion-col>牛群回舍时需恢复上述的设备</ion-col>-->
......@@ -331,7 +332,7 @@
<ion-icon name="add" slot="end" class="iconOpen" *ngIf="!isOpenEnvironment" (click)="openItem('environmentCfg')"></ion-icon>
<ion-icon name="remove" slot="end" class="iconOpen" *ngIf="isOpenEnvironment" (click)="openItem('environmentCfg')"></ion-icon>
</ion-item-divider>
<ion-item class="fanItem" *ngIf="isOpenEnvironment">
<ion-item class="fanItem" *ngIf="isOpenEnvironment" @shrink >
<ion-grid>
<div style="text-align: center; margin-top:10px; margin-bottom: 10px">
<!--<ngx-datatable class='material' [rows]="environmentConfig" [columnMode]="'force'" style="white-space: nowrap; text-align: center">-->
......@@ -344,29 +345,29 @@
<!--<ngx-datatable-column name="" prop="symbol" width="5px;" style="margin-left: 0px">-->
<!--</ngx-datatable-column>-->
<!--</ngx-datatable>-->
<table style="width:80%; display: inline-block;">
<tr>
<th style="width:20%"></th>
<table style="width:80%; display: inline-block; text-align: center">
<tr style="height: 30px">
<th style="width:15%"></th>
<td style="width:30%">上限</td>
<td style="width:30%">下限</td>
<td style="width:10%"></td>
<td style="width:15%"></td>
</tr>
<tr>
<tr style="height: 30px">
<th>温度</th>
<td><ion-input [(ngModel)]="curCowshed.environmentConfigJson.TU" (ionFocus)="tempHaveTouch($event)"></ion-input></td>
<td><ion-input [(ngModel)]="curCowshed.environmentConfigJson.TL" (ionFocus)="tempHaveTouch($event)"></ion-input></td>
<td><ion-input [(ngModel)]="curCowshed.environmentConfigJson.TU" (ionFocus)="tempHaveTouch($event)" class="tdBorder"></ion-input></td>
<td><ion-input [(ngModel)]="curCowshed.environmentConfigJson.TL" (ionFocus)="tempHaveTouch($event)" class="tdBorder" style="border-right: 1px solid"></ion-input></td>
<td>℃</td>
</tr>
<tr>
<tr style="height: 30px">
<th>湿度</th>
<td><ion-input [(ngModel)]="curCowshed.environmentConfigJson.HU" (ionFocus)="humHaveTouch($event)"></ion-input></td>
<td><ion-input [(ngModel)]="curCowshed.environmentConfigJson.HL" (ionFocus)="humHaveTouch($event)"></ion-input></td>
<td><ion-input [(ngModel)]="curCowshed.environmentConfigJson.HU" (ionFocus)="humHaveTouch($event)" class="tdBorder"></ion-input></td>
<td><ion-input [(ngModel)]="curCowshed.environmentConfigJson.HL" (ionFocus)="humHaveTouch($event)" class="tdBorder" style="border-right: 1px solid"></ion-input></td>
<td>% rH</td>
</tr>
<tr>
<tr style="height: 30px">
<th>氨气</th>
<td><ion-input [(ngModel)]="curCowshed.environmentConfigJson.HU" (ionFocus)="humHaveTouch($event)"></ion-input></td>
<td><ion-input [(ngModel)]="curCowshed.environmentConfigJson.HL" (ionFocus)="humHaveTouch($event)"></ion-input></td>
<td><ion-input [(ngModel)]="curCowshed.environmentConfigJson.HU" (ionFocus)="humHaveTouch($event)" class="tdBorder" style="border-bottom: 1px solid"></ion-input></td>
<td><ion-input [(ngModel)]="curCowshed.environmentConfigJson.HL" (ionFocus)="humHaveTouch($event)" class="tdBorder" style="border-right: 1px solid; border-bottom: 1px solid"></ion-input></td>
<td>ppm</td>
</tr>
......@@ -376,15 +377,12 @@
</ion-item>
<ion-item-divider sticky="true" class="itemDriver subTitle">
<ion-label>环境参数配置</ion-label>
<ion-label>热应激配置</ion-label>
<ion-icon name="add" slot="end" class="iconOpen" *ngIf="!isOpenHeatStress" (click)="openItem('heatStressCfg')"></ion-icon>
<ion-icon name="remove" slot="end" class="iconOpen" *ngIf="isOpenHeatStress" (click)="openItem('heatStressCfg')"></ion-icon>
</ion-item-divider>
<ion-item class="fanItem" *ngIf="isOpenHeatStress">
<ion-item class="fanItem" *ngIf="isOpenHeatStress" @shrink >
<ion-grid>
<ion-row>
<ion-item lines="none" class="thiItem">热应激配置</ion-item>
</ion-row>
<ion-row>
<ion-item lines="none" class="thiItem">计算公式 0.81* 温度 +（0.99*温度-14.3）*湿度+46.3</ion-item>
</ion-row>
......
src/app/envCtrl/env-cfg/env-cfg.page.scss
View file @ 56932e6c
......@@ -59,7 +59,8 @@
border-left: 5px solid #62C7CC;
font-weight: bold;
margin-left: 5px;
margin-bottom: 3px;
// margin-bottom: 3px;
border-bottom: 1px solid rgba(173, 173, 173, 0.5);
}
.selectFont {
......@@ -69,3 +70,8 @@
.popContent {
text-align: center;
}
.tdBorder {
border-left: 1px solid;
border-top: 1px solid;
}
src/app/envCtrl/env-cfg/env-cfg.page.ts
View file @ 56932e6c
......@@ -2,19 +2,19 @@ import {Component, OnInit} from '@angular/core';
import {PickerController, AlertController} from '@ionic/angular';
import {Api} from '../../service/api';
import {Load} from '../../service/load';
import {shrink, stretch, zoomIn, zoomOut, fadeIn, fadeOut, flyIn, flyOut} from '../../animations/animations';
import {shrink, stretch, zoomIn, zoomOut, fadeIn, fadeOut, up, down} from '../../animations/animations';
@Component({
selector: 'v-env-cfg',
templateUrl: './env-cfg.page.html',
styleUrls: ['./env-cfg.page.scss'],
animations: [
shrink, stretch, zoomIn, zoomOut, fadeIn, fadeOut, flyIn, flyOut
shrink, stretch, zoomIn, zoomOut, fadeIn, fadeOut, up, down
]
})
export class EnvCfgPage implements OnInit {
defaultColumnOptions = [];
defaultColumnOptions = [[]];
fanMode = {
'selecting': false,
......@@ -235,7 +235,7 @@ export class EnvCfgPage implements OnInit {
tempHaveTouch(event) {
for (let i = 10; i <= 50; i++) {
this.defaultColumnOptions[0][i - 9] = i.toString();
this.defaultColumnOptions[0][i - 10] = i.toString();
}
if (this.fanMode.selecting === false) {
this.fanMode.selecting = true;
......@@ -246,7 +246,7 @@ export class EnvCfgPage implements OnInit {
humHaveTouch(event) {
for (let i = 0; i <= 100; i++) {
this.defaultColumnOptions[0][i + 1] = i.toString();
this.defaultColumnOptions[0][i] = i.toString();
}
if (this.fanMode.selecting === false) {
this.fanMode.selecting = true;
......@@ -282,13 +282,13 @@ export class EnvCfgPage implements OnInit {
},
{fieldDeviceType: '喷淋',
controlModel: '1',
controlConfig: [{id: '111', name: '模式一', T: 21, A: 35, B: 45, interval: 55},
{id: '222', name: '模式二', T: 21, A: 35, B: 45, interval: 55}]
controlConfig: [{id: 1, name: '模式一', T: 21, A: 35, B: 45, interval: 55},
{id: 2, name: '模式二', T: 21, A: 35, B: 45, interval: 55}]
},
{fieldDeviceType: '照明',
controlModel: '1',
controlConfig: [{id: '111', name: '模式A', startDate: '10-01', stopDate: '11-02', on: '19:00', off: '05:00'},
{id: '111', name: '模式B', startDate: '10-01', stopDate: '11-02', on: '19:00', off: '05:00'}]
controlConfig: [{id: 1, name: '模式A', startDate: '10-01', stopDate: '11-02', on: '19:00', off: '05:00'},
{id: 2, name: '模式B', startDate: '10-01', stopDate: '11-02', on: '19:00', off: '05:00'}]
},
{fieldDeviceType: '水槽',
controlModel: '0',
......@@ -551,18 +551,24 @@ export class EnvCfgPage implements OnInit {
}
}
// 喷淋:替换模式
// 喷淋:添加模式
addModel(models, selectedName) {
if (selectedName) {
const modelCount = this.light.controlConfig.length;
const selectedModel = models.filter(data => data.patternModelName === selectedName);
selectedModel[0].configJson.id = modelCount + 1;
debugger;
this.shower.controlConfig.push(selectedModel[0].configJson);
}
}
// 照明:添加模式
// 照明:替换模式
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;
}
}
......@@ -575,6 +581,13 @@ export class EnvCfgPage implements OnInit {
list.push({type: 'radio', label: item.patternModelName, value: item.patternModelName, checked: false});
});
}
if (2 === device || 3 === device) {
list.push({
type: 'radio',
label: '自定义',
value: 'other',
checked: false});
}
const alert = await this.alerCtrl.create({
header: deviceName + '常用模式选择',
inputs: list,
......@@ -598,13 +611,6 @@ export class EnvCfgPage implements OnInit {
}
}}]
});
if (2 === device || 3 === device) {
alert.inputs.push({
type: 'radio',
label: '自定义',
value: 'other',
checked: false});
}
await alert.present();
}
......@@ -627,4 +633,17 @@ export class EnvCfgPage implements OnInit {
this.isOpenHeatStress = !this.isOpenHeatStress;
}
}
deleteShowerModel(one) {
const updateModel = this.shower.controlConfig.filter(data => data.id !== one.id);
this.shower.controlConfig = updateModel;
this.shower.controlConfig.forEach((item, index) => item.id = index + 1);
}
deleteLightModel(one) {
const updateModel = this.light.controlConfig.filter(data => data.id !== one.id);
this.light.controlConfig = updateModel;
this.light.controlConfig.forEach((item, index) => item.id = index + 1);
}
}
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