Commit f2f63a92 authored by yating.lin's avatar yating.lin

修改:牛舍新增配置页,替换配置页

parent 0d165c91
...@@ -23,6 +23,7 @@ import {EnvCfgPage} from './envCtrl/env-cfg/env-cfg.page'; ...@@ -23,6 +23,7 @@ import {EnvCfgPage} from './envCtrl/env-cfg/env-cfg.page';
import {EnvHomePage} from './envCtrl/env-home/env-home.page'; import {EnvHomePage} from './envCtrl/env-home/env-home.page';
import {EnvHistoryPage} from './envCtrl/env-history/env-history.page'; import {EnvHistoryPage} from './envCtrl/env-history/env-history.page';
import {EnvAddModelPage} from './envCtrl/env-add-model/env-add-model.page'; import {EnvAddModelPage} from './envCtrl/env-add-model/env-add-model.page';
import {EnvChangeModelPage} from './envCtrl/env-change-model/env-change-model.page';
const routes: Routes = [ const routes: Routes = [
{ {
...@@ -69,6 +70,7 @@ const routes: Routes = [ ...@@ -69,6 +70,7 @@ const routes: Routes = [
{ path: 'env-alarm-detail', loadChildren: './envCtrl/env-alarm-detail/env-alarm-detail.module#EnvAlarmDetailPageModule' }, { path: 'env-alarm-detail', loadChildren: './envCtrl/env-alarm-detail/env-alarm-detail.module#EnvAlarmDetailPageModule' },
{path: 'tabs', loadChildren: './envCtrl/tabs/tabs.module#TabsPageModule'}, {path: 'tabs', loadChildren: './envCtrl/tabs/tabs.module#TabsPageModule'},
{path: 'env-add-model', component: EnvAddModelPage}, {path: 'env-add-model', component: EnvAddModelPage},
{path: 'env-change-model', component: EnvChangeModelPage},
]; ];
@NgModule({ @NgModule({
......
...@@ -57,6 +57,7 @@ import {NgxEchartsModule} from 'ngx-echarts'; ...@@ -57,6 +57,7 @@ import {NgxEchartsModule} from 'ngx-echarts';
import {NgxDatatableModule} from '@swimlane/ngx-datatable'; import {NgxDatatableModule} from '@swimlane/ngx-datatable';
import {EnvAlarmDetailPage} from './envCtrl/env-alarm-detail/env-alarm-detail.page'; import {EnvAlarmDetailPage} from './envCtrl/env-alarm-detail/env-alarm-detail.page';
import {EnvAddModelPage} from './envCtrl/env-add-model/env-add-model.page'; import {EnvAddModelPage} from './envCtrl/env-add-model/env-add-model.page';
import {EnvChangeModelPage} from './envCtrl/env-change-model/env-change-model.page';
@NgModule({ @NgModule({
declarations: [ declarations: [
...@@ -87,6 +88,7 @@ import {EnvAddModelPage} from './envCtrl/env-add-model/env-add-model.page'; ...@@ -87,6 +88,7 @@ import {EnvAddModelPage} from './envCtrl/env-add-model/env-add-model.page';
// EnvCfgPage, // EnvCfgPage,
// EnvHomePage, // EnvHomePage,
EnvAddModelPage, EnvAddModelPage,
EnvChangeModelPage,
], ],
entryComponents: [], entryComponents: [],
imports: [ imports: [
......
<ion-header> <ion-header>
<ion-toolbar color="secondary"> <ion-toolbar color="secondary">
<ion-buttons slot="start"> <ion-buttons slot="start">
<ion-back-button text="" ></ion-back-button> <ion-back-button text=""></ion-back-button>
</ion-buttons> </ion-buttons>
<ion-title mode="ios" class="title">喷淋模式填写</ion-title> <ion-title mode="ios" class="title">喷淋模式填写</ion-title>
</ion-toolbar> </ion-toolbar>
</ion-header> </ion-header>
<ion-content style="background-color: #F3F4F4;"> <ion-content style="background-color: #F3F4F4;">
<ion-item-sliding *ngFor="let cfg of controlConfig"> <div style="max-height: calc(100% - 100px);overflow-y:auto;">
<ion-item class="fanItem"> <ion-item-sliding *ngFor="let cfg of controlConfig">
<ion-grid> <ion-item class="fanItem">
<ion-row style="width: 100%"> <ion-grid>
<ion-col size="auto" style="font-size: 13px;"> <ion-row style="width: 100%">
<ion-item class="fanItem" lines="none"> <ion-col size="auto" style="font-size: 13px;">
<ion-label style="width:80px">模式名</ion-label> <ion-item class="fanItem" lines="none">
<ion-input [(ngModel)]="cfg.name" style="width:80px;"></ion-input> <ion-label style="width:80px">模式名</ion-label>
</ion-item> <ion-input class="inputText" [(ngModel)]="cfg.name" style="width:80px;"></ion-input>
</ion-col> </ion-item>
<ion-col size="auto" style="font-size: 13px;"> </ion-col>
<ion-item class="fanItem" lines="none"> <ion-col size="auto" style="font-size: 13px;">
<ion-label style="width:80px">间隔时间</ion-label> <ion-item class="fanItem" lines="none">
<ion-input style="width:50px;" [(ngModel)]="cfg.interval"></ion-input> <ion-label style="width:80px">间隔时间</ion-label>
<ion-label></ion-label> <ion-input class="inputText" style="width:50px;" [(ngModel)]="cfg.interval"></ion-input>
</ion-item> <ion-label></ion-label>
</ion-col> </ion-item>
</ion-row> </ion-col>
<ion-row style="width: 100%"> </ion-row>
<ion-col size="auto" style="font-size: 13px;"> <ion-row style="width: 100%">
<ion-item class="fanItem" lines="none"> <ion-col size="auto" style="font-size: 13px;">
<ion-label style="width:80px">设置温度</ion-label> <ion-item class="fanItem" lines="none">
<ion-input style="width:50px;" [(ngModel)]="cfg.T" (ionFocus)="tempHaveTouch($event)"></ion-input> <ion-label style="width:80px">设置温度</ion-label>
<ion-label></ion-label> <ion-input class="inputText" style="width:50px;" [(ngModel)]="cfg.T" (ionFocus)="tempHaveTouch($event)"></ion-input>
</ion-item> <ion-label></ion-label>
</ion-col> </ion-item>
</ion-row> </ion-col>
<ion-row style="width: 100%"> </ion-row>
<ion-col size="auto" style="font-size: 13px;"> <ion-row style="width: 100%">
<ion-item class="fanItem" lines="none"> <ion-col size="auto" style="font-size: 13px;">
<ion-label style="width:80px">A区喷淋时间</ion-label> <ion-item class="fanItem" lines="none">
<ion-input style="width:50px;" [(ngModel)]="cfg.A"></ion-input> <ion-label style="width:80px">A区喷淋时间</ion-label>
<ion-label></ion-label> <ion-input class="inputText" style="width:50px;" [(ngModel)]="cfg.A"></ion-input>
</ion-item> <ion-label></ion-label>
</ion-col> </ion-item>
<ion-col size="auto" style="font-size: 13px;"> </ion-col>
<ion-item class="fanItem" lines="none"> <ion-col size="auto" style="font-size: 13px;">
<ion-label style="width:80px">B区喷淋时间</ion-label> <ion-item class="fanItem" lines="none">
<ion-input style="width:50px;" [(ngModel)]="cfg.B"></ion-input> <ion-label style="width:80px">B区喷淋时间</ion-label>
<ion-label></ion-label> <ion-input class="inputText" style="width:50px;" [(ngModel)]="cfg.B"></ion-input>
</ion-item> <ion-label></ion-label>
</ion-col> </ion-item>
</ion-row> </ion-col>
</ion-grid> </ion-row>
</ion-grid>
</ion-item>
<ion-item-options side="end">
<div style="text-content: center; background-color: lightgray;">
<ion-icon name="remove-circle" color='danger' class="deleteIcon" (click)="deleteModel(cfg)" style="margin-top: 120px;"></ion-icon>
</div>
</ion-item-options>
</ion-item-sliding>
<ion-item width="100%" lines="none">
<ion-icon name="add-circle" color="secondary" class="addIcon" (click)="addModel()"></ion-icon>
</ion-item> </ion-item>
<ion-item-options side="end"> </div>
<ion-button color='danger' expand="full" style="width:15%;height:90%" (click)="deleteShowerModel(cfg)">删除</ion-button> <div style="text-align: center; width:100%; position: absolute; bottom: 10px;">
</ion-item-options> <ion-button onclick="backward()" class="btn" color="light" slot="start" style="margin-right: 20px;">取消</ion-button>
</ion-item-sliding> <ion-button onclick="saveModels()" class="btn" color="secondary" slot="end">确认</ion-button>
<ion-item width="100%" lines="none"> </div>
<!--<ion-button color="secondary" class="addBtn" round (click)="onAddModel()">添加模式</ion-button>-->
<ion-icon name="add-circle" (click)="addModel()"></ion-icon>
</ion-item>
</ion-content> </ion-content>
.title{
text-align: center;
padding-left: 0px
}
.fanItem{
font-size: 13px;
--padding-start: 5px;
}
.addIcon {
margin-left: 160px;
}
.deleteIcon {
font-size:25px;
margin-left: 10px;
margin-right: 10px;
}
.btn {
width: 35%;
}
import {Component, OnInit} from '@angular/core'; import {Component, OnInit} from '@angular/core';
import {Api} from '../../service/api'; import {Api} from '../../service/api';
import {NavController} from '@ionic/angular'; import {NavController, PickerController} from '@ionic/angular';
import {ActivatedRoute} from '@angular/router'; import {ActivatedRoute} from '@angular/router';
import {Load} from '../../service/load'; import {Load} from '../../service/load';
import {Transfer} from '../../service/transfer'; import {Transfer} from '../../service/transfer';
...@@ -13,22 +13,90 @@ import {Transfer} from '../../service/transfer'; ...@@ -13,22 +13,90 @@ import {Transfer} from '../../service/transfer';
export class EnvAddModelPage implements OnInit { export class EnvAddModelPage implements OnInit {
constructor(public nav: NavController, constructor(public nav: NavController,
private api: Api, private pickerController: PickerController) {}
private ac: ActivatedRoute,
private load: Load,
private tf: Transfer) {}
fanMode = {
'selecting': false,
};
defaultColumnOptions = [[]];
controlConfig = []; controlConfig = [];
ngOnInit() { ngOnInit() {
this.init(); this.init();
} }
init() { init() {
this.controlConfig = [{name: '', interval: '', T: '', A: '', B: ''}]; this.controlConfig = [{id: 1, name: '', startDate: '', stopDate: '', on: '', off: ''}];
} }
addModel() { addModel() {
this.controlConfig.push({name: '', interval: '', T: '', A: '', B: ''}); const modelCount = this.controlConfig.length;
this.controlConfig.push({id: modelCount + 1, name: '', startDate: '', stopDate: '', on: '', off: ''});
}
deleteModel(one) {
const updateModel = this.controlConfig.filter(data => data.id !== one.id);
this.controlConfig = updateModel;
this.controlConfig.forEach((item, index) => item.id = index + 1);
}
saveModels() {
}
tempHaveTouch(event) {
for (let i = 10; i <= 50; i++) {
this.defaultColumnOptions[0][i - 10] = i.toString();
}
if (this.fanMode.selecting === false) {
this.fanMode.selecting = true;
this.openPicker(1, 41, this.defaultColumnOptions, event);
}
} }
async openPicker(numColumns = 1, numOptions = 5, columnOptions = this.defaultColumnOptions, event) {
const picker = await this.pickerController.create({
columns: this.getColumns(numColumns, numOptions, columnOptions),
buttons: [
{
text: '取消',
role: 'cancel',
handler: () => {
this.fanMode.selecting = false;
}
},
{
text: '确认',
handler: (value) => {
event.target.value = value.col0.text;
console.log(value.value);
this.fanMode.selecting = false;
}
}
]
});
await picker.present();
}
getColumns(numColumns, numOptions, columnOptions) {
const columns = [];
for (let i = 0; i < numColumns; i++) {
columns.push({
name: `col${i}`,
options: this.getColumnOptions(i, numOptions, columnOptions)
});
}
return columns;
}
getColumnOptions(columnIndex, numOptions, columnOptions) {
const options = [];
for (let i = 0; i < numOptions; i++) {
options.push({
text: columnOptions[columnIndex][i % numOptions],
value: i
});
}
return options;
}
} }
...@@ -31,14 +31,14 @@ ...@@ -31,14 +31,14 @@
<ion-col> <ion-col>
<ion-item class="fanItem"> <ion-item class="fanItem">
<ion-label position="fixed">偏差温度</ion-label> <ion-label position="fixed">偏差温度</ion-label>
<ion-input [(ngModel)]="curCowshed.propertyConfig.toft"></ion-input> <ion-input class="inputText" [(ngModel)]="curCowshed.propertyConfig.toft"></ion-input>
<ion-label position="fixed"></ion-label> <ion-label position="fixed"></ion-label>
</ion-item> </ion-item>
</ion-col> </ion-col>
<ion-col> <ion-col>
<ion-item class="fanItem"> <ion-item class="fanItem">
<ion-label position="fixed">偏差湿度</ion-label> <ion-label position="fixed">偏差湿度</ion-label>
<ion-input [(ngModel)]="curCowshed.propertyConfig.hoft"></ion-input> <ion-input class="inputText" [(ngModel)]="curCowshed.propertyConfig.hoft"></ion-input>
<ion-label position="fixed">% rH</ion-label> <ion-label position="fixed">% rH</ion-label>
</ion-item> </ion-item>
</ion-col> </ion-col>
...@@ -62,14 +62,14 @@ ...@@ -62,14 +62,14 @@
<ion-col> <ion-col>
<ion-item class="fanItem"> <ion-item class="fanItem">
<ion-label position="fixed">开启温度</ion-label> <ion-label position="fixed">开启温度</ion-label>
<ion-input (ionFocus)="tempHaveTouch($event)" [(ngModel)]="fan.controlConfig.TU"></ion-input> <ion-input class="inputText" (ionFocus)="tempHaveTouch($event)" [(ngModel)]="fan.controlConfig.TU"></ion-input>
<ion-label position="fixed"></ion-label> <ion-label position="fixed"></ion-label>
</ion-item> </ion-item>
</ion-col> </ion-col>
<ion-col> <ion-col>
<ion-item class="fanItem"> <ion-item class="fanItem">
<ion-label position="fixed">关闭温度</ion-label> <ion-label position="fixed">关闭温度</ion-label>
<ion-input (ionFocus)="tempHaveTouch($event)" [(ngModel)]="fan.controlConfig.TL"></ion-input> <ion-input class="inputText" (ionFocus)="tempHaveTouch($event)" [(ngModel)]="fan.controlConfig.TL"></ion-input>
<ion-label position="fixed"></ion-label> <ion-label position="fixed"></ion-label>
</ion-item> </ion-item>
</ion-col> </ion-col>
...@@ -101,13 +101,13 @@ ...@@ -101,13 +101,13 @@
<ion-col size="auto" style="font-size: 13px;"> <ion-col size="auto" style="font-size: 13px;">
<ion-item class="fanItem" lines="none"> <ion-item class="fanItem" lines="none">
<ion-label style="width:80px">模式名</ion-label> <ion-label style="width:80px">模式名</ion-label>
<ion-input [(ngModel)]="cfg.name" style="width:80px;"></ion-input> <ion-input class="inputText" [(ngModel)]="cfg.name" style="width:80px;"></ion-input>
</ion-item> </ion-item>
</ion-col> </ion-col>
<ion-col size="auto" style="font-size: 13px;"> <ion-col size="auto" style="font-size: 13px;">
<ion-item class="fanItem" lines="none"> <ion-item class="fanItem" lines="none">
<ion-label style="width:80px">间隔时间</ion-label> <ion-label style="width:80px">间隔时间</ion-label>
<ion-input style="width:50px;" [(ngModel)]="cfg.interval"></ion-input> <ion-input class="inputText" style="width:50px;" [(ngModel)]="cfg.interval"></ion-input>
<ion-label></ion-label> <ion-label></ion-label>
</ion-item> </ion-item>
</ion-col> </ion-col>
...@@ -116,7 +116,7 @@ ...@@ -116,7 +116,7 @@
<ion-col size="auto" style="font-size: 13px;"> <ion-col size="auto" style="font-size: 13px;">
<ion-item class="fanItem" lines="none"> <ion-item class="fanItem" lines="none">
<ion-label style="width:80px">设置温度</ion-label> <ion-label style="width:80px">设置温度</ion-label>
<ion-input style="width:50px;" [(ngModel)]="cfg.T" (ionFocus)="tempHaveTouch($event)"></ion-input> <ion-input class="inputText" style="width:50px;" [(ngModel)]="cfg.T" (ionFocus)="tempHaveTouch($event)"></ion-input>
<ion-label></ion-label> <ion-label></ion-label>
</ion-item> </ion-item>
</ion-col> </ion-col>
...@@ -131,14 +131,14 @@ ...@@ -131,14 +131,14 @@
<ion-col size="auto" style="font-size: 13px;"> <ion-col size="auto" style="font-size: 13px;">
<ion-item class="fanItem" lines="none"> <ion-item class="fanItem" lines="none">
<ion-label style="width:80px">A区喷淋时间</ion-label> <ion-label style="width:80px">A区喷淋时间</ion-label>
<ion-input style="width:50px;" [(ngModel)]="cfg.A"></ion-input> <ion-input class="inputText" style="width:50px;" [(ngModel)]="cfg.A"></ion-input>
<ion-label></ion-label> <ion-label></ion-label>
</ion-item> </ion-item>
</ion-col> </ion-col>
<ion-col size="auto" style="font-size: 13px;"> <ion-col size="auto" style="font-size: 13px;">
<ion-item class="fanItem" lines="none"> <ion-item class="fanItem" lines="none">
<ion-label style="width:80px">B区喷淋时间</ion-label> <ion-label style="width:80px">B区喷淋时间</ion-label>
<ion-input style="width:50px;" [(ngModel)]="cfg.B"></ion-input> <ion-input class="inputText" style="width:50px;" [(ngModel)]="cfg.B"></ion-input>
<ion-label></ion-label> <ion-label></ion-label>
</ion-item> </ion-item>
</ion-col> </ion-col>
...@@ -177,7 +177,7 @@ ...@@ -177,7 +177,7 @@
<ion-col size="auto" style="font-size: 13px;"> <ion-col size="auto" style="font-size: 13px;">
<ion-item class="fanItem" lines="none"> <ion-item class="fanItem" lines="none">
<ion-label style="width:80px">模式名</ion-label> <ion-label style="width:80px">模式名</ion-label>
<ion-input style="width:80px;" [(ngModel)]="cfg.name"></ion-input> <ion-input class="inputText" style="width:80px;" [(ngModel)]="cfg.name"></ion-input>
</ion-item> </ion-item>
</ion-col> </ion-col>
</ion-row> </ion-row>
...@@ -186,14 +186,14 @@ ...@@ -186,14 +186,14 @@
<ion-item class="fanItem" lines="none"> <ion-item class="fanItem" lines="none">
<ion-label style="width:80px">日期范围</ion-label> <ion-label style="width:80px">日期范围</ion-label>
<!--<ion-input placeholder={{cfg.startTime}} (ionFocus)="tempHaveTouch()" style="width:50px;"></ion-input>--> <!--<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-datetime class="inputDateTime timepicker" [(ngModel)]="cfg.startDate" displayFormat="MM-DD" cancelText="取消" doneText="确认"></ion-datetime>
</ion-item> </ion-item>
</ion-col> </ion-col>
<ion-col size="auto" style="font-size: 13px;"> <ion-col size="auto" style="font-size: 13px;">
<ion-item class="fanItem" lines="none"> <ion-item class="fanItem" lines="none">
<ion-label style="width:80px">~</ion-label> <ion-label style="width:80px">~</ion-label>
<!--<ion-input placeholder={{cfg.endTime}} (ionFocus)="tempHaveTouch()" style="width:50px;"></ion-input>--> <!--<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> <ion-datetime class="inputDateTime timepicker" [(ngModel)]="cfg.stopDate" displayFormat="MM-DD" cancelText="取消" doneText="确认"></ion-datetime>
</ion-item> </ion-item>
</ion-col> </ion-col>
</ion-row> </ion-row>
...@@ -201,14 +201,14 @@ ...@@ -201,14 +201,14 @@
<ion-col size="auto" style="font-size: 13px;"> <ion-col size="auto" style="font-size: 13px;">
<ion-item class="fanItem" lines="none"> <ion-item class="fanItem" lines="none">
<ion-label style="width:80px">开灯时间</ion-label> <ion-label style="width:80px">开灯时间</ion-label>
<ion-datetime [(ngModel)]="cfg.on" displayFormat="HH:mm" cancelText="取消" doneText="确认" class="timepicker"></ion-datetime> <ion-datetime class="inputDateTime timepicker" [(ngModel)]="cfg.on" displayFormat="HH:mm" cancelText="取消" doneText="确认"></ion-datetime>
<!--<ion-input style="width:50px;" [(ngModel)]="cfg.on" (ionFocus)="tempHaveTouch()"></ion-input>--> <!--<ion-input style="width:50px;" [(ngModel)]="cfg.on" (ionFocus)="tempHaveTouch()"></ion-input>-->
</ion-item> </ion-item>
</ion-col> </ion-col>
<ion-col size="auto" style="font-size: 13px;"> <ion-col size="auto" style="font-size: 13px;">
<ion-item class="fanItem" lines="none"> <ion-item class="fanItem" lines="none">
<ion-label style="width:80px">关灯时间</ion-label> <ion-label style="width:80px">关灯时间</ion-label>
<ion-datetime [(ngModel)]="cfg.off" displayFormat="HH:mm" cancelText="取消" doneText="确认" class="timepicker"></ion-datetime> <ion-datetime class="inputDateTime timepicker" [(ngModel)]="cfg.off" displayFormat="HH:mm" cancelText="取消" doneText="确认"></ion-datetime>
<!--<ion-input style="width:50px;" [(ngModel)]="cfg.off" (ionFocus)="tempHaveTouch()"></ion-input>--> <!--<ion-input style="width:50px;" [(ngModel)]="cfg.off" (ionFocus)="tempHaveTouch()"></ion-input>-->
</ion-item> </ion-item>
</ion-col> </ion-col>
...@@ -243,14 +243,14 @@ ...@@ -243,14 +243,14 @@
<ion-item class="timepickerItem" lines="none"> <ion-item class="timepickerItem" lines="none">
<ion-label style="width:80px">日期范围</ion-label> <ion-label style="width:80px">日期范围</ion-label>
<!--<ion-input placeholder={{cfg.startTime}} (ionFocus)="tempHaveTouch()" style="width:50px;"></ion-input>--> <!--<ion-input placeholder={{cfg.startTime}} (ionFocus)="tempHaveTouch()" style="width:50px;"></ion-input>-->
<ion-datetime [(ngModel)]="waterChannel.controlConfig.startDate" displayFormat="MM-DD" cancelText="取消" doneText="确认" class="timepicker"></ion-datetime> <ion-datetime class="inputDateTime timepicker" [(ngModel)]="waterChannel.controlConfig.startDate" displayFormat="MM-DD" cancelText="取消" doneText="确认"></ion-datetime>
</ion-item> </ion-item>
</ion-col> </ion-col>
<ion-col size="auto" style="font-size: 13px;"> <ion-col size="auto" style="font-size: 13px;">
<ion-item class="timepickerItem" lines="none"> <ion-item class="timepickerItem" lines="none">
<ion-label style="width:80px">~</ion-label> <ion-label style="width:80px">~</ion-label>
<!--<ion-input placeholder={{cfg.endTime}} (ionFocus)="tempHaveTouch()" style="width:50px;"></ion-input>--> <!--<ion-input placeholder={{cfg.endTime}} (ionFocus)="tempHaveTouch()" style="width:50px;"></ion-input>-->
<ion-datetime [(ngModel)]="waterChannel.controlConfig.stopDate" displayFormat="MM-DD" cancelText="取消" doneText="确认" class="timepicker"></ion-datetime> <ion-datetime class="inputDateTime timepicker" [(ngModel)]="waterChannel.controlConfig.stopDate" displayFormat="MM-DD" cancelText="取消" doneText="确认"></ion-datetime>
</ion-item> </ion-item>
</ion-col> </ion-col>
</ion-row> </ion-row>
......
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
} }
.timepicker{ .timepicker{
width:40px; width:50px;
} }
.timepickerItem{ .timepickerItem{
...@@ -72,8 +72,8 @@ ...@@ -72,8 +72,8 @@
} }
.tdBorder { .tdBorder {
border-left: 1px solid; border-left: 1px solid lightgray;
border-top: 1px solid; border-top: 1px solid lightgray;;
} }
.deleteIcon { .deleteIcon {
......
...@@ -643,7 +643,6 @@ export class EnvCfgPage implements OnInit { ...@@ -643,7 +643,6 @@ export class EnvCfgPage implements OnInit {
} }
toNextPage(device) { toNextPage(device) {
debugger;
let query = ''; let query = '';
if (device === 2) { if (device === 2) {
query = '/env-add-model'; query = '/env-add-model';
......
<ion-header> <ion-header>
<ion-toolbar color="secondary"> <ion-toolbar color="secondary">
<ion-buttons slot="start"> <ion-buttons slot="start">
<ion-back-button text="" ></ion-back-button> <ion-back-button text="" id="back"></ion-back-button>
</ion-buttons> </ion-buttons>
<ion-title mode="ios" class="title">照明模式填写</ion-title> <ion-title mode="ios" class="title">照明模式填写</ion-title>
</ion-toolbar> </ion-toolbar>
</ion-header> </ion-header>
<ion-content style="background-color: #F3F4F4;"> <ion-content style="background-color: #F3F4F4;">
<ion-item-sliding *ngFor="let cfg of controlConfig"> <div style="max-height: calc(100% - 100px);overflow-y:auto;">
<ion-item class="fanItem"> <ion-item-sliding *ngFor="let cfg of controlConfig" >
<ion-grid> <ion-item class="fanItem">
<ion-row style="width: 100%"> <ion-grid>
<ion-col size="auto" style="font-size: 13px;"> <ion-row style="width: 100%">
<ion-item class="fanItem" lines="none"> <ion-col size="auto" style="font-size: 13px;">
<ion-label style="width:80px">模式名</ion-label> <ion-item class="fanItem" lines="none">
<ion-input [(ngModel)]="cfg.name" style="width:80px;"></ion-input> <ion-label style="width:80px">模式名</ion-label>
</ion-item> <ion-input class="inputText" style="width:80px;" [(ngModel)]="cfg.name"></ion-input>
</ion-col> </ion-item>
<ion-col size="auto" style="font-size: 13px;"> </ion-col>
<ion-item class="fanItem" lines="none"> </ion-row>
<ion-label style="width:80px">间隔时间</ion-label> <ion-row style="width: 100%">
<ion-input style="width:50px;" [(ngModel)]="cfg.interval"></ion-input> <ion-col size="auto" style="font-size: 13px;">
<ion-label></ion-label> <ion-item class="fanItem" lines="none">
</ion-item> <ion-label style="width:80px">日期范围</ion-label>
</ion-col> <!--<ion-input placeholder={{cfg.startTime}} (ionFocus)="tempHaveTouch()" style="width:50px;"></ion-input>-->
</ion-row> <ion-datetime class="inputDateTime timepicker" [(ngModel)]="cfg.startDate" displayFormat="MM-DD" cancelText="取消" doneText="确认"></ion-datetime>
<ion-row style="width: 100%"> </ion-item>
<ion-col size="auto" style="font-size: 13px;"> </ion-col>
<ion-item class="fanItem" lines="none"> <ion-col size="auto" style="font-size: 13px;">
<ion-label style="width:80px">设置温度</ion-label> <ion-item class="fanItem" lines="none">
<ion-input style="width:50px;" [(ngModel)]="cfg.T" (ionFocus)="tempHaveTouch($event)"></ion-input> <ion-label style="width:80px">~</ion-label>
<ion-label></ion-label> <!--<ion-input placeholder={{cfg.endTime}} (ionFocus)="tempHaveTouch()" style="width:50px;"></ion-input>-->
</ion-item> <ion-datetime class="inputDateTime timepicker" [(ngModel)]="cfg.stopDate" displayFormat="MM-DD" cancelText="取消" doneText="确认"></ion-datetime>
</ion-col> </ion-item>
</ion-row> </ion-col>
<ion-row style="width: 100%"> </ion-row>
<ion-col size="auto" style="font-size: 13px;"> <ion-row style="width: 100%">
<ion-item class="fanItem" lines="none"> <ion-col size="auto" style="font-size: 13px;">
<ion-label style="width:80px">A区喷淋时间</ion-label> <ion-item class="fanItem" lines="none">
<ion-input style="width:50px;" [(ngModel)]="cfg.A"></ion-input> <ion-label style="width:80px">开灯时间</ion-label>
<ion-label></ion-label> <ion-datetime class="inputDateTime timepicker" [(ngModel)]="cfg.on" displayFormat="HH:mm" cancelText="取消" doneText="确认"></ion-datetime>
</ion-item> <!--<ion-input style="width:50px;" [(ngModel)]="cfg.on" (ionFocus)="tempHaveTouch()"></ion-input>-->
</ion-col> </ion-item>
<ion-col size="auto" style="font-size: 13px;"> </ion-col>
<ion-item class="fanItem" lines="none"> <ion-col size="auto" style="font-size: 13px;">
<ion-label style="width:80px">B区喷淋时间</ion-label> <ion-item class="fanItem" lines="none">
<ion-input style="width:50px;" [(ngModel)]="cfg.B"></ion-input> <ion-label style="width:80px">关灯时间</ion-label>
<ion-label></ion-label> <ion-datetime class="inputDateTime timepicker" [(ngModel)]="cfg.off" displayFormat="HH:mm" cancelText="取消" doneText="确认"></ion-datetime>
</ion-item> <!--<ion-input style="width:50px;" [(ngModel)]="cfg.off" (ionFocus)="tempHaveTouch()"></ion-input>-->
</ion-col> </ion-item>
</ion-row> </ion-col>
</ion-grid> </ion-row>
</ion-grid>
</ion-item>
<ion-item-options side="end">
<div style="text-content: center; background-color: lightgray;" (click)="deleteModel(cfg)">
<ion-icon name="remove-circle" color='danger' class="deleteIcon" style="margin-top: 70px;"></ion-icon>
</div>
</ion-item-options>
</ion-item-sliding>
<ion-item width="100%" lines="none">
<!--<ion-button color="secondary" class="addBtn" round (click)="onChangeModel()">替换模式</ion-button>-->
<ion-icon name="add-circle" color="secondary" class="addIcon" (click)="addModel()"></ion-icon>
</ion-item> </ion-item>
<ion-item-options side="end"> </div>
<ion-button color='danger' expand="full" style="width:15%;height:90%" (click)="deleteShowerModel(cfg)">删除</ion-button> <div style="text-align: center; width:100%; position: absolute; bottom: 10px;">
</ion-item-options> <ion-button (click)="goBack()" class="btn" color="light" slot="start" style="margin-right: 20px;">取消</ion-button>
</ion-item-sliding> <ion-button (click)="saveModels()" class="btn" color="secondary" slot="end">确认</ion-button>
<ion-item width="100%" lines="none"> </div>
<!--<ion-button color="secondary" class="addBtn" round (click)="onAddModel()">添加模式</ion-button>-->
<ion-icon name="add-circle" (click)="addModel()"></ion-icon>
</ion-item>
</ion-content> </ion-content>
.title{
text-align: center;
padding-left: 0px
}
.fanItem{
font-size: 13px;
--padding-start: 5px;
}
.timepicker{
width:50px;
}
.addIcon {
margin-left: 160px;
}
.deleteIcon {
font-size:25px;
margin-left: 10px;
margin-right: 10px;
}
.btn {
width: 35%;
}
...@@ -24,10 +24,25 @@ export class EnvChangeModelPage implements OnInit { ...@@ -24,10 +24,25 @@ export class EnvChangeModelPage implements OnInit {
} }
init() { init() {
this.controlConfig = [{name: '', interval: '', T: '', A: '', B: ''}]; this.controlConfig = [{id: 1, name: '', startDate: '', stopDate: '', on: '', off: ''}];
} }
addModel() { addModel() {
this.controlConfig.push({name: '', interval: '', T: '', A: '', B: ''}); const modelCount = this.controlConfig.length;
this.controlConfig.push({id: modelCount + 1, name: '', startDate: '', stopDate: '', on: '', off: ''});
}
deleteModel(one) {
const updateModel = this.controlConfig.filter(data => data.id !== one.id);
this.controlConfig = updateModel;
this.controlConfig.forEach((item, index) => item.id = index + 1);
}
saveModels() {
}
goBack() {
debugger;
document.getElementById('back').click();
} }
} }
...@@ -130,3 +130,20 @@ img { ...@@ -130,3 +130,20 @@ img {
--background: #444444; --background: #444444;
--color: #ffffff; --color: #ffffff;
} }
.inputText {
border: 1px solid lightgray;
border-radius: 3px;
height: 25px;
margin-right: 5px;
text-align: right;
}
.inputDateTime {
border: 1px solid lightgray;
border-radius: 3px;
height: 20px;
margin-right: 5px;
text-align: center;
padding: 5px 0px 0px 0px;
}
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