Browse Source

[完善]基本信息储罐收起以及自定义属性的添加

develop
邵佳豪 5 years ago
parent
commit
636d2f02ae
  1. 13
      src/app/ui/basicinfo/addhouseinfo.component.ts
  2. 398
      src/app/ui/basicinfo/basicinfo.component.html
  3. 24
      src/app/ui/basicinfo/basicinfo.component.scss
  4. 1144
      src/app/ui/basicinfo/basicinfo.component.ts
  5. 7
      src/styles.scss

13
src/app/ui/basicinfo/addhouseinfo.component.ts

@ -23,6 +23,8 @@ import { MatSnackBar } from '@angular/material/snack-bar';
ngOnInit(): void {
this.getallunittype()
}
getallunittype(){
this.http.get("/api/BuildingTypes/Simple").subscribe(data=>{
this.allunittype = data
@ -30,6 +32,12 @@ import { MatSnackBar } from '@angular/material/snack-bar';
}
onSubmit(value){
// console.log(value)
let buildingTypename = ""
this.allunittype.forEach(item => {
if(item.id == value.unittype){
buildingTypename = item.name
}
});
this.http.post("/api/CompanyAccount/Buildings",{
id: "",
name: value.name,
@ -39,11 +47,12 @@ import { MatSnackBar } from '@angular/material/snack-bar';
buildingTypes: [
{
id: value.unittype,
name: ""
name: buildingTypename
}
]
}).subscribe(data=>{
this.dialogRef.close('ooo');
console.log(555,data)
this.dialogRef.close(data);
})
}
}

398
src/app/ui/basicinfo/basicinfo.component.html

@ -16,7 +16,7 @@
</mat-panel-description>
</mat-expansion-panel-header>
<div class="topbox">
<form (ngSubmit)="onSubmit(form.value)" #form="ngForm" class="example-container" >
<form (ngSubmit)="onSubmit(form.value,form.invalid)" #form="ngForm" class="example-container" >
<div class="mainbox" >
<div class="mainleft">
<div class="inputbox" >
@ -105,17 +105,16 @@
</div>
<div class="image" (click)="closeorganizationbox()">
<input required id="selectedfile" type="file" ng2FileSelect [uploader]="uploader" (change)="filechange($event)" name="imgFile" accept=".jpg,.png,.jpeg">
<input id="selectedfile" type="file" ng2FileSelect [uploader]="uploader" (change)="filechange($event)" name="imgFile" accept=".jpg,.png,.jpeg">
</div>
<div class="addbtn">
<!-- <button type="button" mat-raised-button>编辑</button> -->
<button type="submit" color="primary" class="submit1" mat-button mat-raised-button>保存</button>
<button type="submit" color="primary" class="submit1" mat-button mat-raised-button >保存</button>
</div>
</div>
<div class="mainright" (click)="closeorganizationbox()">
<!-- <div class="mainright" (click)="closeorganizationbox()"> -->
<!-- 地图预留位置 -->
</div>
<!-- </div> -->
</div>
</form>
@ -129,6 +128,8 @@
<mat-tab-group style="height: 100%;;" (focusChange)="selecttab($event)" >
<mat-tab [label]="item.username" *ngFor="let item of houses;let key = index">
<form style="height: 100%; overflow-y:auto; display: block;" (ngSubmit)="onSubmit2(form.value,item,key,form.invalid)" #form="ngForm" class="example-container">
<!-- 正常建筑 -->
<div class="highinfo" *ngIf="item.tongyong">
<div class="houseinfoinput" >
<span>建筑名称:</span>
@ -158,6 +159,29 @@
</mat-form-field>
<span style="color: red;" *ngIf="i.required">*</span>
</div>
<div class="CustomData" style="width: 200px;">
<mat-checkbox (change)="checkCustomData($event)" name="checkbuilding" [(ngModel)]="item.isCustomData" style="float: left;margin-right: 10px;"></mat-checkbox>
<h1 style="font-size: 22px;width: 200px;">自定义信息</h1>
</div>
<div *ngIf="item.isCustomData" style="position: relative;">
<button style="position: absolute;left: 0;" type="button" mat-icon-button (click)="addCustomData(item)" class="addCustomData"><mat-icon style="font-size: 38px;">add_circle_outline</mat-icon></button>
<button style="position: absolute;left:60px;" type="button" mat-icon-button (click)="deleteCustomData(item)" class="deleteCustomData"><mat-icon style="font-size: 38px;">remove_circle_outline</mat-icon></button>
<div class="houseinfoinput" style="float: left;margin-left: 250px;" *ngFor="let i of item.buildingCustomData.customProperties;let key = index">
<mat-form-field>
<input matInput type='text' name="{{key}}1CustomData"
required
[(ngModel)]="i.name">
</mat-form-field>
<span>:</span>
<mat-form-field>
<input matInput type='text' name="{{key}}2CustomData"
required
[(ngModel)]="i.value">
</mat-form-field>
<span style="color: red;" *ngIf="i.required">*</span>
</div>
</div>
</div>
<!-- 石油化工 -->
@ -198,15 +222,15 @@
<div class="deviceinfo">
<div style="width: 200px;">
<mat-checkbox *ngIf="item.buildingBasicGroups[1].isOptional" style="float: left;margin-right: 10px;"></mat-checkbox>
<mat-checkbox (change)="checkboxchange(item.buildingBasicGroups[1].submitted)" name="item.buildingBasicGroups[1].name" *ngIf="item.buildingBasicGroups[1].isOptional" [(ngModel)]="item.buildingBasicGroups[1].submitted" style="float: left;margin-right: 10px;"></mat-checkbox>
<h1 style="font-size: 22px;width: 200px;">{{item.buildingBasicGroups[1].name}}</h1>
</div>
<table mat-table [dataSource]="devicedataSourcebox[item.buildingId]" class="mat-elevation-z8">
<table mat-table [dataSource]="devicedataSourcebox[item.buildingId]" class="mat-elevation-z8" *ngIf="item.buildingBasicGroups[1].submitted">
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef>
<button type="button" mat-icon-button class="adddeviceinfo2" (click)="adddeviceinfo(item)"><mat-icon>add_circle_outline</mat-icon></button>
<button type="button" mat-icon-button class="removedeviceinfo" (click)="removedeviceinfo(item)"><mat-icon>remove_circle_outline</mat-icon></button>
<button style="width: 24px;" type="button" mat-icon-button class="adddeviceinfo2" (click)="adddeviceinfo(item)"><mat-icon>add_circle_outline</mat-icon></button>
<button style="width: 24px;" type="button" mat-icon-button class="removedeviceinfo" (click)="removedeviceinfo(item)"><mat-icon>remove_circle_outline</mat-icon></button>
装置区名称<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<textarea style="width: 100px;" [(ngModel)]="element.name" name="{{key}}1" required></textarea>
@ -236,162 +260,190 @@
</div>
<div style="width: 200px;">
<mat-checkbox *ngIf="item.buildingBasicGroups[2].isOptional" style="float: left;margin-right: 10px;"></mat-checkbox>
<mat-checkbox (change)="checkboxchange(item)" *ngIf="item.buildingBasicGroups[2].isOptional" name="item.buildingBasicGroups[2].name" [(ngModel)]="item.buildingBasicGroups[2].submitted" style="float: left;margin-right: 10px;"></mat-checkbox>
<h1 style="font-size: 22px;width: 200px;">储罐信息</h1>
</div>
<button type="button" mat-raised-button color="primary" (click)="addtankbox(item,bigkey)" style="margin-top: 30px;margin-right: 5px;">添加储罐</button>
<button type="button" mat-raised-button color="warn" (click)="removetankbox(item,bigkey)" style="margin-top: 30px;" matTooltip="会将此建筑处于末尾的储罐移除">移除末尾储罐</button>
<div class="tankinfo" *ngFor="let x of item.bigfor;let www = index">
<p style="font-size: 22px; width: 200px;">{{x[0].name}}</p>
<div class="basicinfobox" >
<div class="houseinfoinput" *ngFor="let i of x[0].propertyInfos;let key = index" style="line-height: 65px;">
<span>{{i.propertyName}} {{i.physicalUnit}}:</span>
<mat-form-field *ngIf="i.propertyType == 0">
<input matInput id="floorspace" name="{{www+2}}-tanker-{{key}}" type='text'
required="{{ i.required==true ? 'true' : 'false' }}"
[(ngModel)]="i.propertyValue"
>
</mat-form-field>
<textarea style="width: 180px;height: 60px;" *ngIf="i.propertyType == 1" [(ngModel)]="i.propertyValue" name="{{www+2}}-tanker-{{key}}"></textarea>
<span style="color: red;" *ngIf="i.required">*</span>
</div>
</div>
<button *ngIf="item.buildingBasicGroups[2].submitted" type="button" mat-raised-button color="primary" (click)="addtankbox(item,bigkey)" style="margin-top: 30px;margin-right: 5px;">添加储罐</button>
<button *ngIf="item.buildingBasicGroups[2].submitted" type="button" mat-raised-button color="warn" (click)="removetankbox(item,bigkey)" style="margin-top: 30px;" matTooltip="会将此建筑处于末尾的储罐移除">移除末尾储罐</button>
<div *ngIf="item.buildingBasicGroups[2].submitted" style="margin-top: 30px;">
<div class="tankinfo" *ngFor="let x of item.bigfor;let www = index">
<p style="font-size: 22px; width: 200px;">{{x[0].name}}</p>
<div class="basicinfobox" >
<div class="houseinfoinput" *ngFor="let i of x[0].propertyInfos;let key = index" style="line-height: 65px;">
<span>{{i.propertyName}} {{i.physicalUnit}}:</span>
<mat-form-field *ngIf="i.propertyType == 0">
<input matInput id="floorspace" name="{{www+2}}-tanker-{{key}}" type='text'
required="{{ i.required==true ? 'true' : 'false' }}"
[(ngModel)]="i.propertyValue"
>
</mat-form-field>
<textarea style="width: 180px;height: 60px;" *ngIf="i.propertyType == 1" [(ngModel)]="i.propertyValue" name="{{www+2}}-tanker-{{key}}"></textarea>
<span style="color: red;" *ngIf="i.required">*</span>
</div>
<p style="font-size: 22px; width: 200px;">{{x[1].name}}</p>
<div class="tankdetailinfo">
<table #table mat-table [dataSource]="x[1].propertyInfos" class="mat-elevation-z8" style="position: relative;">
<ng-container matColumnDef="tank">
<th mat-header-cell *matHeaderCellDef>
<button type="button" mat-icon-button class="adddeviceinfo" (click)="adddeviceinfo2(www,item)" style="position: absolute;left: 0;"><mat-icon>add_circle_outline</mat-icon></button>
<button type="button" mat-icon-button class="removedeviceinfo" (click)="removedeviceinfo3(www,item)"><mat-icon>remove_circle_outline</mat-icon></button>
罐区 <span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tank}}tank{{key}}" type='text'
required
[(ngModel)]="element.tank">
</td>
</ng-container>
<ng-container matColumnDef="tankid">
<th mat-header-cell *matHeaderCellDef>罐区编号<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tankid}}tank{{key}}" type='text'
required
[(ngModel)]="element.tankid">
</td>
</div>
<p style="font-size: 22px; width: 200px;">{{x[1].name}}</p>
<div class="tankdetailinfo">
<table #table mat-table [dataSource]="x[1].propertyInfos" class="mat-elevation-z8" style="position: relative;">
<ng-container matColumnDef="tank">
<th mat-header-cell *matHeaderCellDef>
<button type="button" mat-icon-button class="adddeviceinfo" (click)="adddeviceinfo2(www,item)" style="position: absolute;left: 0;"><mat-icon>add_circle_outline</mat-icon></button>
<button type="button" mat-icon-button class="removedeviceinfo" (click)="removedeviceinfo3(www,item)"><mat-icon>remove_circle_outline</mat-icon></button>
罐区 <span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tank}}tank{{key}}" type='text'
required
[(ngModel)]="element.tank">
</td>
</ng-container>
<ng-container matColumnDef="tankid">
<th mat-header-cell *matHeaderCellDef>罐区编号<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tankid}}tank{{key}}" type='text'
required
[(ngModel)]="element.tankid">
</td>
</ng-container>
<ng-container matColumnDef="tankmedium">
<th mat-header-cell *matHeaderCellDef>储存介质<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tankmedium}}tank{{key}}" type='text'
required
[(ngModel)]="element.tankmedium">
</td>
</ng-container>
<ng-container matColumnDef="tanktype">
<th mat-header-cell *matHeaderCellDef>储罐类型<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tanktype}}tank{{key}}" type='text'
required
[(ngModel)]="element.tanktype">
</td>
</ng-container>
<ng-container matColumnDef="tankcapacity">
<th mat-header-cell *matHeaderCellDef>容量<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tankcapacity}}tank{{key}}" type='text'
required
[(ngModel)]="element.tankcapacity">
</td>
</ng-container>
<ng-container matColumnDef="tankdiameter">
<th mat-header-cell *matHeaderCellDef>直径<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tankdiameter}}tank{{key}}" type='text'
required
[(ngModel)]="element.tankdiameter">
</td>
</ng-container>
<ng-container matColumnDef="tankheight">
<th mat-header-cell *matHeaderCellDef>高度<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tankheight}}tank{{key}}" type='text'
required
[(ngModel)]="element.tankheight">
</td>
</ng-container>
<ng-container matColumnDef="tanktectum">
<th mat-header-cell *matHeaderCellDef>顶盖形式</th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tanktectum}}tank{{key}}" type='text'
[(ngModel)]="element.tanktectum">
</td>
</ng-container>
<ng-container matColumnDef="tanktexture">
<th mat-header-cell *matHeaderCellDef>浮盘材质</th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tanktexture}}tank{{key}}" type='text'
[(ngModel)]="element.tanktexture">
</td>
</ng-container>
<ng-container matColumnDef="platetype">
<th mat-header-cell *matHeaderCellDef>浮盘类型</th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.platetype}}tank{{key}}" type='text'
[(ngModel)]="element.platetype">
</td>
</ng-container>
<ng-container matColumnDef="foamgeneratorid">
<th mat-header-cell *matHeaderCellDef>泡沫产生器型号</th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.foamgeneratorid}}tank{{key}}" type='text'
[(ngModel)]="element.foamgeneratorid">
</td>
</ng-container>
<ng-container matColumnDef="foamgeneratortype">
<th mat-header-cell *matHeaderCellDef>泡沫产生器形式</th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.foamgeneratortype}}tank{{key}}" type='text'
[(ngModel)]="element.foamgeneratortype">
</td>
</ng-container>
<ng-container matColumnDef="tankmedium">
<th mat-header-cell *matHeaderCellDef>储存介质<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tankmedium}}tank{{key}}" type='text'
required
[(ngModel)]="element.tankmedium">
</td>
</ng-container>
<ng-container matColumnDef="tanktype">
<th mat-header-cell *matHeaderCellDef>储罐类型<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tanktype}}tank{{key}}" type='text'
required
[(ngModel)]="element.tanktype">
</td>
</ng-container>
<ng-container matColumnDef="tankcapacity">
<th mat-header-cell *matHeaderCellDef>容量<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tankcapacity}}tank{{key}}" type='text'
required
[(ngModel)]="element.tankcapacity">
</td>
</ng-container>
<ng-container matColumnDef="tankdiameter">
<th mat-header-cell *matHeaderCellDef>直径<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tankdiameter}}tank{{key}}" type='text'
required
[(ngModel)]="element.tankdiameter">
</td>
</ng-container>
<ng-container matColumnDef="tankheight">
<th mat-header-cell *matHeaderCellDef>高度<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tankheight}}tank{{key}}" type='text'
required
[(ngModel)]="element.tankheight">
</td>
</ng-container>
<ng-container matColumnDef="tanktectum">
<th mat-header-cell *matHeaderCellDef>顶盖形式</th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tanktectum}}tank{{key}}" type='text'
[(ngModel)]="element.tanktectum">
</td>
</ng-container>
<ng-container matColumnDef="tanktexture">
<th mat-header-cell *matHeaderCellDef>浮盘材质</th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tanktexture}}tank{{key}}" type='text'
[(ngModel)]="element.tanktexture">
</td>
</ng-container>
<ng-container matColumnDef="platetype">
<th mat-header-cell *matHeaderCellDef>浮盘类型</th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.platetype}}tank{{key}}" type='text'
[(ngModel)]="element.platetype">
</td>
</ng-container>
<ng-container matColumnDef="foamgeneratorid">
<th mat-header-cell *matHeaderCellDef>泡沫产生器型号</th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.foamgeneratorid}}tank{{key}}" type='text'
[(ngModel)]="element.foamgeneratorid">
</td>
</ng-container>
<ng-container matColumnDef="foamgeneratortype">
<th mat-header-cell *matHeaderCellDef>泡沫产生器形式</th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.foamgeneratortype}}tank{{key}}" type='text'
[(ngModel)]="element.foamgeneratortype">
</td>
</ng-container>
<ng-container matColumnDef="isprotect">
<th mat-header-cell *matHeaderCellDef>是否设置氮封惰化保护装置</th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.isprotect}}tank{{key}}" type='text'
[(ngModel)]="element.isprotect">
</td>
</ng-container>
<ng-container matColumnDef="fendinggroyneheight">
<th mat-header-cell *matHeaderCellDef>防护堤高度<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.fendinggroyneheight}}tank{{key}}" type='text'
required
[(ngModel)]="element.fendinggroyneheight">
</td>
</ng-container>
<ng-container matColumnDef="portnum">
<th mat-header-cell *matHeaderCellDef>半固定泡沫灭火接口数量<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.portnum}}tank{{key}}" type='text'
required
[(ngModel)]="element.portnum">
</td>
</ng-container>
<ng-container matColumnDef="else">
<th mat-header-cell *matHeaderCellDef>其他设施<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.else}}tank{{key}}" type='text'
required
[(ngModel)]="element.else">
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns2"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns2;"></tr>
</table>
<ng-container matColumnDef="isprotect">
<th mat-header-cell *matHeaderCellDef>是否设置氮封惰化保护装置</th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.isprotect}}tank{{key}}" type='text'
[(ngModel)]="element.isprotect">
</td>
</ng-container>
<ng-container matColumnDef="fendinggroyneheight">
<th mat-header-cell *matHeaderCellDef>防护堤高度<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.fendinggroyneheight}}tank{{key}}" type='text'
required
[(ngModel)]="element.fendinggroyneheight">
</td>
</ng-container>
<ng-container matColumnDef="portnum">
<th mat-header-cell *matHeaderCellDef>半固定泡沫灭火接口数量<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.portnum}}tank{{key}}" type='text'
required
[(ngModel)]="element.portnum">
</td>
</ng-container>
<ng-container matColumnDef="else">
<th mat-header-cell *matHeaderCellDef>其他设施<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.else}}tank{{key}}" type='text'
required
[(ngModel)]="element.else">
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns2"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns2;"></tr>
</table>
</div>
</div>
</div>
<div class="CustomData" style="width: 200px;margin-top: 60px;">
<mat-checkbox (change)="checkCustomData($event)" name="checkbuilding" [(ngModel)]="item.isCustomData" style="float: left;margin-right: 10px;"></mat-checkbox>
<h1 style="font-size: 22px;width: 200px;">自定义信息</h1>
</div>
<div *ngIf="item.isCustomData" style="position: relative;">
<button style="position: absolute;left: 0;font-size: 11px;" type="button" mat-icon-button (click)="addCustomData(item)" class="addCustomData"><mat-icon style="font-size: 38px;">add_circle_outline</mat-icon></button>
<button style="position: absolute;left:60px;" type="button" mat-icon-button (click)="deleteCustomData(item)" class="deleteCustomData"><mat-icon style="font-size: 38px;">remove_circle_outline</mat-icon></button>
<div class="houseinfoinput" style="float: left;margin-left: 250px;" *ngFor="let i of item.buildingCustomData.customProperties;let key = index">
<mat-form-field>
<input matInput type='text' name="{{key}}1CustomData"
required
[(ngModel)]="i.name">
</mat-form-field>
<span>:</span>
<mat-form-field>
<input matInput type='text' name="{{key}}2CustomData"
required
[(ngModel)]="i.value">
</mat-form-field>
<span style="color: red;" *ngIf="i.required">*</span>
</div>
</div>
@ -444,6 +496,29 @@
</div>
</div>
<div class="CustomData" style="width: 200px;">
<mat-checkbox (change)="checkCustomData($event)" name="checkbuilding" [(ngModel)]="item.isCustomData" style="float: left;margin-right: 10px;"></mat-checkbox>
<h1 style="font-size: 22px;width: 200px;">自定义信息</h1>
</div>
<div *ngIf="item.isCustomData" style="position: relative;">
<button style="position: absolute;left: 0;" type="button" mat-icon-button (click)="addCustomData(item)" class="addCustomData"><mat-icon style="font-size: 38px;">add_circle_outline</mat-icon></button>
<button style="position: absolute;left:60px;" type="button" mat-icon-button (click)="deleteCustomData(item)" class="deleteCustomData"><mat-icon style="font-size: 38px;">remove_circle_outline</mat-icon></button>
<div class="houseinfoinput" style="float: left;margin-left: 250px;" *ngFor="let i of item.buildingCustomData.customProperties;let key = index">
<mat-form-field>
<input matInput type='text' name="{{key}}1CustomData"
required
[(ngModel)]="i.name">
</mat-form-field>
<span>:</span>
<mat-form-field>
<input matInput type='text' name="{{key}}2CustomData"
required
[(ngModel)]="i.value">
</mat-form-field>
<span style="color: red;" *ngIf="i.required">*</span>
</div>
</div>
</div>
<div class="infobtnbox">
<!-- <button type="button" color="primary" mat-raised-button>编辑</button> -->
@ -469,3 +544,4 @@

24
src/app/ui/basicinfo/basicinfo.component.scss

@ -6,7 +6,7 @@
height: 100%;
position: relative;
.mainleft{
width: 745px;
width:800px;
height: 100%;
// background-color: yellow;
float: left;
@ -91,10 +91,10 @@
}
.mainright{
float: left;
width: 800px;
width: 50%;
height: 400px;
position: absolute;
right: 170px;
// position: absolute;
// right: 170px;
}
}
@ -186,7 +186,7 @@
// border-bottom: 1px solid black;
}
.deviceinfo{
border-bottom: 1px solid black;;
// border-bottom: 1px solid black;;
padding-bottom: 70px;
}
.tankdetailinfo{
@ -204,10 +204,10 @@
// height: 45px;
text-align: center;
}
.adddeviceinfo{
// position: absolute;
left: 0px;
}
// .adddeviceinfo{
// // position: absolute;
// // left: 0px;
// }
.submit1{
margin-left: -66px !important;
}
@ -218,7 +218,7 @@ textarea {
height: 110px;
resize: none;
}
.basicinfobox{
// .basicinfobox{
}
// }

1144
src/app/ui/basicinfo/basicinfo.component.ts

File diff suppressed because it is too large Load Diff

7
src/styles.scss

@ -3,10 +3,10 @@ html,body{
width: 100%;
height: 100%;
margin:0 auto;
padding:0;
padding:0;
}
ul,ol,dl,li,dt,dd,p,form,input,h1,h2,h3,h4,h5,h6,section,article,aside,header,footer,nav,figure,time,mark,main,canvas{
margin:0;
// margin:0;
padding:0;
}
b,strong,i,em,h1,h2,h3,h4,h5,h6{
@ -62,3 +62,6 @@ table td.mat-footer-cell:last-of-type{
.example-sidenav-content {
overflow-x: hidden; overflow-y: auto;
}
.mat-tab-body-wrapper{
overflow: auto!important
}
Loading…
Cancel
Save