shaojiahao
/
ShangHaiYuan-AnXin
2
0
Fork 0
Code Issues 11 Pull Requests Projects Releases Wiki Activity
Browse Source

[新增]单位基本信息模块替换为最新版本

zhuzhou
邵佳豪 4 years ago
parent
8207a876ad
commit
525fa30f75
8 changed files with 1474 additions and 4090 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 465
      src/app/key-unit/basicinfo-look/basicinfo.component.html
  2. 164
      src/app/key-unit/basicinfo-look/basicinfo.component.scss
  3. 1805
      src/app/key-unit/basicinfo-look/basicinfo.component.ts
  4. 11
      src/app/key-unit/basicinfo-look/lookmaster.component.html
  5. 12
      src/app/key-unit/basicinfo/addhouseinfo.component.ts
  6. 429
      src/app/key-unit/basicinfo/basicinfo.component.html
  7. 122
      src/app/key-unit/basicinfo/basicinfo.component.scss
  8. 1870
      src/app/key-unit/basicinfo/basicinfo.component.ts

465
src/app/key-unit/basicinfo-look/basicinfo.component.html
Unescape View File

@ -1,11 +1,10 @@
<div style="height: 100%;display: flex; flex-direction: column;"> <div style="height: 100%;display: flex; flex-direction: column;overflow: hidden;">
<!-- header --> <!-- header -->
<mat-accordion> <mat-accordion>
<mat-expansion-panel expanded hideToggle> <mat-expansion-panel expanded>
<mat-expansion-panel-header style="color: black;"> <mat-expansion-panel-header style="color: black;">
<mat-panel-title> <mat-panel-title>
单位信息 单位信息
<mat-icon style="position: absolute;right:30px;">keyboard_arrow_down</mat-icon>
</mat-panel-title> </mat-panel-title>
</mat-expansion-panel-header> </mat-expansion-panel-header>
<div class="topbox"> <div class="topbox">
@ -16,7 +15,7 @@
<span style="color: red;">*</span> <span style="color: red;">*</span>
<span>统一社会信用代码：</span> <span>统一社会信用代码：</span>
<mat-form-field> <mat-form-field>
<input readonly matInput id="creditcode" name="creditcode" type='text' #usci="ngModel" <input matInput id="creditcode" name="creditcode" type='text' #usci="ngModel"
required minlength="1" maxlength="18" required minlength="1" maxlength="18"
[(ngModel)]="unitinfo.usci" [(ngModel)]="unitinfo.usci"
(focus)="closeorganizationbox()" (focus)="closeorganizationbox()"
@ -31,8 +30,8 @@
<div class="inputbox"> <div class="inputbox">
<span style="color: red;">*</span> <span style="color: red;">*</span>
<span>单位类型：</span> <span>单位类型：</span>
<mat-form-field> <mat-form-field (click)="closeorganizationbox()">
<mat-select disabled readonly required name="unittype" [(ngModel)]="defaultbuildingTypes"> <mat-select required name="unittype" [(ngModel)]="defaultbuildingTypes">
<mat-option [value]="item.id" *ngFor="let item of allunittype">{{item.name}}</mat-option> <mat-option [value]="item.id" *ngFor="let item of allunittype">{{item.name}}</mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
@ -41,7 +40,7 @@
<span style="color: red;">*</span> <span style="color: red;">*</span>
<span>联系人：</span> <span>联系人：</span>
<mat-form-field> <mat-form-field>
<input readonly matInput id="linkman" name="linkman" type='text' <input matInput id="linkman" name="linkman" type='text'
required minlength="1" required minlength="1"
[(ngModel)]="unitinfo.contacts" [(ngModel)]="unitinfo.contacts"
(focus)="closeorganizationbox()" (focus)="closeorganizationbox()"
@ -52,7 +51,7 @@
<span style="color: red;">*</span> <span style="color: red;">*</span>
<span>联系电话：</span> <span>联系电话：</span>
<mat-form-field> <mat-form-field>
<input readonly matInput id="linkphone" name="linkphone" type='text' #linkphone="ngModel" <input matInput id="linkphone" name="linkphone" type='text' #linkphone="ngModel"
required pattern="^(?:\+?86)?1(?:3\d{3}|5[^4\D]\d{2}|8\d{3}|7(?:[35-8]\d{2}|4(?:0\d|1[0-2]|9\d))|9[0135-9]\d{2}|66\d{2})\d{6}$" required pattern="^(?:\+?86)?1(?:3\d{3}|5[^4\D]\d{2}|8\d{3}|7(?:[35-8]\d{2}|4(?:0\d|1[0-2]|9\d))|9[0135-9]\d{2}|66\d{2})\d{6}$"
[(ngModel)]="unitinfo.phone" [(ngModel)]="unitinfo.phone"
(focus)="closeorganizationbox()" (focus)="closeorganizationbox()"
@ -68,41 +67,59 @@
<span style="color: red;">*</span> <span style="color: red;">*</span>
<span>辖区中队：</span> <span>辖区中队：</span>
<mat-form-field style="width: 538px;"> <mat-form-field style="width: 538px;">
<input readonly matInput id="organization" name="organization" type='text' <input matInput id="organization" name="organization" type='text'
required minlength="1" required minlength="1"
[(ngModel)]="selectedorganization" [(ngModel)]="selectedorganization"
(focus)="openorganizationbox()"
readonly="value" > readonly="value" >
</mat-form-field> </mat-form-field>
</div> </div>
<div id="organizationbox" class="organizationbox" *ngIf="isorganizationbox">
<mat-tree [dataSource]="dataSource" [treeControl]="treeControl">
<mat-tree-node *matTreeNodeDef="let node" matTreeNodePadding (click)='add(node)' class="organizationlist">
<button type="button" mat-icon-button disabled ></button>
<li>{{node.name}}</li>
</mat-tree-node>
<mat-tree-node *matTreeNodeDef="let node;when: hasChild" matTreeNodePadding (click)='add(node)' class="organizationlist">
<button
type="button"
mat-icon-button
matTreeNodeToggle
[attr.aria-label]="'toggle ' + node.name">
<mat-icon class="mat-icon-rtl-mirror">
{{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}
</mat-icon>
</button>
<li>{{node.name}}</li>
</mat-tree-node>
</mat-tree>
</div>
<div class="inputbox" style="width: 700px;"> <div class="inputbox" style="width: 700px;">
<span style="color: red;">*</span> <span style="color: red;">*</span>
<span>单位地址：</span> <span>单位地址：</span>
<mat-form-field style="width: 538px;"> <mat-form-field style="width: 538px;">
<input readonly matInput id="unitaddress" name="unitaddress" type='text' <input matInput id="unitaddress" name="unitaddress" type='text'
required minlength="1" required minlength="1"
[(ngModel)]="unitinfo.address" [(ngModel)]="unitinfo.address"
(focus)="closeorganizationbox()"> (focus)="closeorganizationbox()">
</mat-form-field> </mat-form-field>
</div> </div>
<div class="uploadimg" (click)="lookmaster()"> <div class="uploadimg">
<span>单位照片：</span> <span>单位照片：</span>
<div class="uploadingimg"> <div class="uploadingimg" (click)="lookmaster()">
<img [src]="imgsrc" alt="" style="width: 299px; height: 170px;" > <img [src]="imgsrc ? imgsrc : noImg" alt="" style="width: 299px; height: 170px;" >
</div> </div>
<mat-spinner *ngIf="isspinner" diameter= 50></mat-spinner> <mat-spinner *ngIf="isspinner" diameter= 50></mat-spinner>
</div> </div>
<!-- <div class="image"> <!-- <div class="image" (click)="closeorganizationbox()">
<input id="selectedfile" type="file" name="imgFile" accept=".jpg,.png,.jpeg,.gif,.webp"> <input id="selectedfile" type="file" ng2FileSelect [uploader]="uploader" (change)="filechange($event)" name="imgFile" accept=".jpg,.png,.jpeg,.gif,.webp">
</div> -->
<!-- <div class="addbtn">
<button type="submit" color="primary" class="submit1" mat-button mat-raised-button>保存</button>
</div> --> </div> -->
</div> </div>
<div class="mainright" id="setPosition"> <div class="mainright" id="setPosition">
<div style="width: 100%;height: 100%;" id="container"> <div style="width: 100%;height: 100%;" id="container">
</div> </div>
<div class="gistopbox" *ngIf="isGisTopBox"> <div class="gistopbox" *ngIf="isGisTopBox">
<div class="positionItem"> <div class="positionItem">
<span> <span>
@ -120,9 +137,18 @@
{{markerPosition.y || '暂未标注'}} {{markerPosition.y || '暂未标注'}}
</div> </div>
</div> </div>
<!-- <div class="setPosition" (click)="setPosition()"> <div class="setPosition">
<mat-icon style="width: 22px;height: 22px;font-size: 22px;">place</mat-icon> 位置 <mat-icon style="width: 22px;height: 22px;font-size: 22px;">place</mat-icon> 位置
</div> --> </div>
</div>
<div class="gistopbox hidden" [ngClass]="{'show': isGisTopBoxTwo}">
<div class="inputBox">
<span>位置: </span>
<input name="position" [(ngModel)]="searchTitle" id="tipinput" class="positionInput" type="text" autocomplete="off">
</div>
<div class="setPosition">
搜索
</div>
</div> </div>
</div> </div>
</div> </div>
@ -130,61 +156,56 @@
</div> </div>
</mat-expansion-panel> </mat-expansion-panel>
</mat-accordion> </mat-accordion>
<!-- body --> <!-- body -->
<div class="bottombox" style="flex: 70%;overflow-y: auto;" > <div class="bodyBox" id="basicInfoBody">
<div class="houseinfobox" style="height: 100%; overflow-y: auto;padding-bottom: 34px; box-sizing:border-box"> <!-- <div>
<!-- <button type="button" mat-icon-button class="addhouseinfo"><mat-icon style="font-size: 38px;">add_circle_outline</mat-icon></button> --> <button type="button" mat-icon-button (click)="addhouseinfo()" class="addBuilding"><mat-icon>add_circle_outline</mat-icon></button>
<mat-tab-group style="height: 100%;;" > </div> -->
<mat-tab [label]="item.username" *ngFor="let item of houses;let key = index"> <div style="height: 100%; box-sizing:border-box;overflow-y: auto;padding-left: 26px;">
<form style="height: 100%; overflow-y:auto; display: block;" (ngSubmit)="onSubmit2(form.value,item,key,form.invalid)" #form="ngForm" class="example-container"> <mat-tab-group style="height: 100%;" [selectedIndex]="selectedIndex" (selectedTabChange)="selectedTabChange($event)">
<mat-tab *ngFor="let item of houses;let key = index" label="{{item.name}}">
<!-- 正常建筑 --> <ng-template matTabContent>
<div class="highinfo" *ngIf="item.tongyong"> <form *ngIf="item.data && item.data.length!=0" style="height: 100%; overflow-y:auto; display: block;" (ngSubmit)="onSubmitBuildingInfo(form.value,item,key,form.invalid)" #form="ngForm" class="example-container">
<div class="houseinfoinput" > <div class="buildInfoInput" >
<span>建筑名称：</span> <span>建筑名称：</span>
<mat-form-field> <mat-form-field>
<input readonly matInput id="housename" name="housename" type='text' <input required matInput name="buildingName" type='text' minlength="1" [(ngModel)]="item.name">
minlength="1" [(ngModel)]="item.name"
>
</mat-form-field> </mat-form-field>
<span style="color: red;">*</span> <span style="color: red;">*</span>
</div> </div>
<div class="houseinfoinput"> <div class="buildInfoInput">
<span>建筑类型：</span> <span>建筑类型：</span>
<mat-form-field> <mat-form-field>
<mat-select disabled readonly name="unittype" [(ngModel)]="item.buildtype"> <mat-select disabled name="buildingTypeName" [(ngModel)]="item.buildingTypes[0].name">
<mat-option [value]="n.name" *ngFor="let n of allunittype">{{n.name}}</mat-option> <mat-option [value]="n.name" *ngFor="let n of allunittype" (click)="templateBuildtype(n,item,key)">{{n.name}}</mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<span style="color: red;">*</span> <span style="color: red;">*</span>
</div> </div>
<div *ngFor="let element of item.data[0].buildingBasicGroups;let groupsIndex = index "style="float: left;width:100%">
<div *ngFor="let item of item.buildingBasicGroups;let www = index" style="float: left;"> <!-- 类型为表单并且不是 罐区 -->
<h1 style="font-size: 22px;">{{item.name}}</h1> <div *ngIf="element.type == 0 && element.name.indexOf('罐区') == -1">
<div class="houseinfoinput" *ngFor="let i of item.propertyInfos" style="float: left;margin-left: 250px;position: relative;"> <p style="font-size: 22px;">{{element.name}}</p>
<div class="buildInfoInput" *ngFor="let i of element.propertyInfos;let inputIndex = index" style="float: left;margin-left: 250px;position: relative;">
<span>{{i.propertyName}}<span *ngIf="i.physicalUnit">({{i.physicalUnit}})</span>：</span> <span>{{i.propertyName}}<span *ngIf="i.physicalUnit">({{i.physicalUnit}})</span>：</span>
<!-- 如果类型是文本 --> <!-- 如果类型是文本 -->
<mat-form-field *ngIf="i.propertyType == 0 && i.propertyName != '耐火等级'"> <mat-form-field *ngIf="i.propertyType == 0 && i.propertyName != '耐火等级'">
<input readonly matInput name="{{i.propertyName}}{{www}}" type='text' <input matInput name="{{groupsIndex}}{{inputIndex}}" type='text'
required="{{ i.required==true ? 'true' : 'false' }}" required="{{ i.required==true ? 'true' : 'false' }}"
[(ngModel)]="i.propertyValue"> [(ngModel)]="i.propertyValue">
</mat-form-field> </mat-form-field>
<!-- 如果类型是数字 --> <!-- 如果类型是数字 -->
<mat-form-field *ngIf="i.propertyType == 2 && i.propertyName != '耐火等级'"> <mat-form-field *ngIf="i.propertyType == 2 && i.propertyName != '耐火等级'">
<input readonly matInput name="{{i.propertyName}}{{www}}" type='number' <input matInput name="{{groupsIndex}}{{inputIndex}}" type='number'
required="{{ i.required==true ? 'true' : 'false' }}" required="{{ i.required==true ? 'true' : 'false' }}"
[(ngModel)]="i.propertyValue" [(ngModel)]="i.propertyValue"
(change)="inputchange($event,i.ruleName,i.ruleValue,i)"
> >
<!-- <mat-error *ngIf="isshowrule">{{rulevalue}}</mat-error> -->
</mat-form-field> </mat-form-field>
<!-- 如果类型是耐火等级 --> <!-- 如果类型是耐火等级 -->
<mat-form-field *ngIf="i.propertyName == '耐火等级'"> <mat-form-field *ngIf="i.propertyName == '耐火等级'">
<mat-select readonly name="{{i.propertyName}}{{www}}" required="{{ i.required==true ? 'true' : 'false' }}" placeholder="请选择耐火等级" [(ngModel)]="i.propertyValue"> <mat-select name="{{groupsIndex}}{{inputIndex}}" required="{{ i.required==true ? 'true' : 'false' }}" placeholder="请选择耐火等级" [(ngModel)]="i.propertyValue">
<mat-option value="0">1级</mat-option> <mat-option value="0">1级</mat-option>
<mat-option value="1">2级</mat-option> <mat-option value="1">2级</mat-option>
<mat-option value="2">3级</mat-option> <mat-option value="2">3级</mat-option>
@ -192,89 +213,65 @@
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<!-- 如果类型是多行文本 --> <!-- 如果类型是多行文本 -->
<textarea readonly *ngIf="i.propertyType == 1 && i.propertyName != '耐火等级'" style="width: 180px;height: 60px;" required="{{ i.required==true ? 'true' : 'false' }}" [(ngModel)]="i.propertyValue" name="{{i.propertyName}}{{key}}"></textarea> <textarea *ngIf="i.propertyType == 1 && i.propertyName != '耐火等级'" style="width: 180px;height: 60px;" required="{{ i.required==true ? 'true' : 'false' }}" [(ngModel)]="i.propertyValue" name="{{groupsIndex}}{{inputIndex}}"></textarea>
<span style="color: red;" *ngIf="i.required">*</span> <span style="color: red;" *ngIf="i.required">*</span>
<div *ngIf="i.isshowrule" style="position: absolute; <div *ngIf="i.isshowrule" style="position: absolute;left: 205px;top: 45px;font-size: 11px;color: red;">
left: 205px;
top: 45px;
font-size: 11px;
color: red;">
<span>{{i.rulevalue}}</span> <span>{{i.rulevalue}}</span>
</div> </div>
</div> </div>
</div> </div>
<!-- 类型为表格 并且不是 罐区 -->
<div class="CustomData" style="width: 200px;"> <div *ngIf="element.type == 1 && element.name.indexOf('罐区') == -1">
<!-- <mat-checkbox name="checkbuilding" [(ngModel)]="item.isCustomData" style="float: left;margin-right: 10px;"></mat-checkbox> --> <p style="font-size: 22px;">
<h1 style="font-size: 22px;width: 200px;">自定义信息</h1> {{element.name}}
</div> </p>
<div *ngIf="item.isCustomData" style="position: relative;"> <table *ngIf="element.submitted">
<!-- <button style="position: absolute;left: 0;" type="button" mat-icon-button class="addCustomData"><mat-icon style="font-size: 38px;">add_circle_outline</mat-icon></button> <tr>
<button style="position: absolute;left:60px;" type="button" mat-icon-button class="deleteCustomData"><mat-icon style="font-size: 38px;">remove_circle_outline</mat-icon></button> --> <th *ngFor="let item of element.propertyInfos[0].origin;let index = index">
<div class="houseinfoinput" style="float: left;margin-left: 250px;" *ngFor="let i of item.buildingCustomData.customProperties;let key = index"> {{item.propertyName}}
<mat-form-field> <span style="color: red;" *ngIf="item.required">*</span>
<input readonly matInput type='text' name="{{key}}1CustomData" </th>
required </tr>
[(ngModel)]="i.name"> <tr *ngFor="let item of element.propertyInfos;let line = index">
</mat-form-field> <td *ngFor="let i of item.origin;let list = index">
<span>:</span> <input *ngIf="i.propertyType != 1" style="height:45px" class="tankinfo" name="{{element.name}}{{line + 1}}-{{list + 1}}" type="{{i.propertyType == 0 ? 'text' : 'number'}}"
<mat-form-field> required="{{ i.required==true ? 'true' : 'false' }}" [(ngModel)]="i.propertyValue">
<input readonly matInput type='text' name="{{key}}2CustomData" <textarea class="tankinfo" *ngIf="i.propertyType == 1" required="{{ i.required==true ? 'true' : 'false' }}" [(ngModel)]="i.propertyValue" name="{{element.name}}{{line + 1}}{{list + 1}}">
required
[(ngModel)]="i.value"> </textarea>
</mat-form-field> </td>
<span style="color: red;" *ngIf="i.required">*</span> </tr>
</div> </table>
</div>
</div> </div>
<!-- 类型为表单 是罐区-->
<div *ngIf="element.type == 0 && element.name.indexOf('罐区') != -1">
<p style="font-size: 22px;">
<span *ngIf="element.name == '罐区1'">罐区信息</span>
</p>
<div *ngIf="element.submitted" >
<p style="font-size: 22px;">{{element.name}}</p>
<!-- 石油化工 --> <div class="buildInfoInput" *ngFor="let i of element.propertyInfos;let inputIndex = index" style="float: left;margin-left: 250px;position: relative;">
<div class="highinfo" *ngIf="item.isshiyou;let bigkey = index">
<div class="basicinfobox">
<div class="houseinfoinput">
<span>建筑名称：</span>
<mat-form-field>
<input readonly matInput id="housename" name="housename" type='text'
required minlength="1" [(ngModel)]="item.name"
>
</mat-form-field>
<span style="color: red;">*</span>
</div>
<div class="houseinfoinput" >
<span>建筑类型：</span>
<mat-form-field>
<mat-select disabled required name="unittype" [(ngModel)]="item.buildtype">
<mat-option [value]="n.name" *ngFor="let n of allunittype">{{n.name}}</mat-option>
</mat-select>
</mat-form-field>
<span style="color: red;">*</span>
</div>
<h1 style="font-size: 22px;">{{item.buildingBasicGroups[0].name}}</h1>
<div class="houseinfoinput" *ngFor="let i of item.buildingBasicGroups[0].propertyInfos;let smkey = index" style="float: left;margin-left: 250px;position: relative;">
<span>{{i.propertyName}}<span *ngIf="i.physicalUnit">({{i.physicalUnit}})</span>：</span> <span>{{i.propertyName}}<span *ngIf="i.physicalUnit">({{i.physicalUnit}})</span>：</span>
<!-- 如果类型是文本 --> <!-- 如果类型是文本 -->
<mat-form-field *ngIf="i.propertyType == 0 && i.propertyName != '耐火等级'"> <mat-form-field *ngIf="i.propertyType == 0 && i.propertyName != '耐火等级'">
<input readonly matInput name="{{i.propertyName}}" type='text' <input matInput name="{{groupsIndex}}{{inputIndex}}" type='text'
required="{{ i.required==true ? 'true' : 'false' }}" required="{{ i.required==true ? 'true' : 'false' }}"
[(ngModel)]="i.propertyValue"> [(ngModel)]="i.propertyValue">
</mat-form-field> </mat-form-field>
<!-- 如果类型是数字 --> <!-- 如果类型是数字 -->
<mat-form-field *ngIf="i.propertyType == 2 && i.propertyName != '耐火等级'"> <mat-form-field *ngIf="i.propertyType == 2 && i.propertyName != '耐火等级'">
<input readonly matInput name="{{i.propertyName}}" type='number' <input matInput name="{{groupsIndex}}{{inputIndex}}" type='number'
required="{{ i.required==true ? 'true' : 'false' }}" required="{{ i.required==true ? 'true' : 'false' }}"
[(ngModel)]="i.propertyValue" [(ngModel)]="i.propertyValue"
(change)="inputchange($event,i.ruleName,i.ruleValue,i)"
> >
<!-- <mat-error *ngIf="isshowrule">{{rulevalue}}</mat-error> -->
</mat-form-field> </mat-form-field>
<!-- 如果类型是耐火等级 --> <!-- 如果类型是耐火等级 -->
<mat-form-field *ngIf="i.propertyName == '耐火等级'"> <mat-form-field *ngIf="i.propertyName == '耐火等级'">
<mat-select readonly name="{{i.propertyName}}" required="{{ i.required==true ? 'true' : 'false' }}" placeholder="请选择耐火等级" [(ngModel)]="i.propertyValue"> <mat-select name="{{groupsIndex}}{{inputIndex}}" required="{{ i.required==true ? 'true' : 'false' }}" placeholder="请选择耐火等级" [(ngModel)]="i.propertyValue">
<mat-option value="0">1级</mat-option> <mat-option value="0">1级</mat-option>
<mat-option value="1">2级</mat-option> <mat-option value="1">2级</mat-option>
<mat-option value="2">3级</mat-option> <mat-option value="2">3级</mat-option>
@ -282,262 +279,66 @@
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<!-- 如果类型是多行文本 --> <!-- 如果类型是多行文本 -->
<textarea readonly *ngIf="i.propertyType == 1 && i.propertyName != '耐火等级'" style="width: 180px;height: 60px;" required="{{ i.required==true ? 'true' : 'false' }}" [(ngModel)]="i.propertyValue" name="{{i.propertyName}}"></textarea> <textarea *ngIf="i.propertyType == 1 && i.propertyName != '耐火等级'" style="width: 180px;height: 60px;" required="{{ i.required==true ? 'true' : 'false' }}" [(ngModel)]="i.propertyValue" name="{{groupsIndex}}{{inputIndex}}"></textarea>
<span style="color: red;" *ngIf="i.required">*</span> <span style="color: red;" *ngIf="i.required">*</span>
<div *ngIf="i.isshowrule" style=" position: absolute; <div *ngIf="i.isshowrule" style="position: absolute;left: 205px;top: 45px;font-size: 11px;color: red;">
left: 205px;
top: 45px;
font-size: 11px;
color: red;">
<span>{{i.rulevalue}}</span> <span>{{i.rulevalue}}</span>
</div> </div>
</div> </div>
</div> </div>
<div class="deviceinfo">
<div style="width: 200px;">
<!-- <mat-checkbox 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> </div>
<!-- 类型为表格 是罐区 -->
<table mat-table [dataSource]="devicedataSourcebox[item.buildingId]" class="mat-elevation-z8" *ngIf="item.buildingBasicGroups[1].submitted"> <div *ngIf="element.type == 1 && element.name.indexOf('罐区') != -1">
<ng-container matColumnDef="name"> <p style="font-size: 22px;" *ngIf="element.submitted">
<th mat-header-cell *matHeaderCellDef> {{element.name}}
<button style="width: 24px;" type="button" mat-icon-button class="adddeviceinfo2" ><mat-icon>add_circle_outline</mat-icon></button> </p>
<button style="width: 24px;" type="button" mat-icon-button class="removedeviceinfo" ><mat-icon>remove_circle_outline</mat-icon></button> <table *ngIf="element.submitted">
装置区名称<span style="color: red;">*</span></th> <tr>
<td mat-cell *matCellDef="let element;let key = index"> <th *ngFor="let item of element.propertyInfos[0].origin;let index = index">
<textarea readonly style="width: 100px;" [(ngModel)]="element.name" name="{{key}}1" required></textarea> {{item.propertyName}}
</td> <span style="color: red;" *ngIf="item.required">*</span>
</ng-container> </th>
<ng-container matColumnDef="flow"> </tr>
<th mat-header-cell *matHeaderCellDef>工艺流程<span style="color: red;">*</span></th> <tr *ngFor="let item of element.propertyInfos;let line = index">
<td mat-cell *matCellDef="let element;let key = index"> <td *ngFor="let i of item.origin;let list = index">
<textarea readonly [(ngModel)]="element.flow" name="{{key}}2" required></textarea> <input type="{{i.propertyType == 0 ? 'text' : 'number'}}" style="height:45px" class="tankinfo" name="{{element.name}}{{line + 1}}-{{list + 1}}"
</td> required="{{ i.required==true ? 'true' : 'false' }}" [(ngModel)]="i.propertyValue">
</ng-container>
<ng-container matColumnDef="danger">
<th mat-header-cell *matHeaderCellDef>火灾危险性<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<textarea readonly [(ngModel)]="element.danger" name="{{key}}3" required></textarea>
</td>
</ng-container>
<ng-container matColumnDef="payattentionto">
<th mat-header-cell *matHeaderCellDef>灭火注意事项</th>
<td mat-cell *matCellDef="let element;let key = index">
<textarea readonly style="width: 100px;" [(ngModel)]="element.payattentionto" name="{{key}}4"></textarea>
</td> </td>
</ng-container> </tr>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table> </table>
</div> </div>
<div style="width: 200px;">
<!-- <mat-checkbox *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 *ngIf="item.buildingBasicGroups[2].submitted" type="button" mat-raised-button color="primary" style="margin-top: 30px;margin-right: 5px;">添加储罐</button>
<button *ngIf="item.buildingBasicGroups[2].submitted" type="button" mat-raised-button color="warn" 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 readonly matInput name="{{www+2}}-tanker-{{key}}" type='text'
required="{{ i.required==true ? 'true' : 'false' }}"
[(ngModel)]="i.propertyValue"
>
</mat-form-field>
<textarea readonly style="width: 180px;height: 45px;" *ngIf="i.propertyType == 1" [(ngModel)]="i.propertyValue" name="{{www+2}}-tanker-{{key}}"></textarea>
<span style="color: red;" *ngIf="i.required">*</span>
</div>
</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" style="position: absolute;left: 0;"><mat-icon>add_circle_outline</mat-icon></button>
<button type="button" mat-icon-button class="removedeviceinfo"><mat-icon>remove_circle_outline</mat-icon></button> -->
罐区 </th>
<td mat-cell *matCellDef="let element;let key = index">
<input readonly style="height:45px" class="tankinfo" name="{{www}}{{element.tank}}tank{{key}}" type='text'
[(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 readonly 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 readonly 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 readonly 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>容量(m³)<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input readonly 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>直径(m)<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input readonly 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>高度(m)<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input readonly 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 readonly 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 readonly 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 readonly 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 readonly 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 readonly 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 readonly 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>防护堤高度(m)<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<input readonly 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>半固定泡沫灭火接口数量</th>
<td mat-cell *matCellDef="let element;let key = index">
<input readonly style="height:45px" class="tankinfo" name="{{www}}{{element.portnum}}tank{{key}}" type='text'
[(ngModel)]="element.portnum">
</td>
</ng-container>
<ng-container matColumnDef="else">
<th mat-header-cell *matHeaderCellDef>其它设施</th>
<td mat-cell *matCellDef="let element;let key = index">
<input readonly style="height:45px" class="tankinfo" name="{{www}}{{element.else}}tank{{key}}" type='text'
[(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>
<div class="CustomData" style="width: 200px;margin-top: 60px;"> <div class="CustomData" style="width: 200px;margin-top: 60px;">
<!-- <mat-checkbox name="checkbuilding" [(ngModel)]="item.isCustomData" style="float: left;margin-right: 10px;"></mat-checkbox> -->
<h1 style="font-size: 22px;width: 200px;">自定义信息</h1> <h1 style="font-size: 22px;width: 200px;">自定义信息</h1>
</div> </div>
<div *ngIf="item.isCustomData" style="position: relative;"> <div style="position: relative;" *ngIf="item.isCustomData">
<button style="position: absolute;left: 0;font-size: 11px;" type="button" mat-icon-button 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 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.customData.customProperties;let key = index">
<div class="houseinfoinput" style="float: left;margin-left: 250px;" *ngFor="let i of item.buildingCustomData.customProperties;let key = index">
<mat-form-field> <mat-form-field>
<input readonly matInput type='text' name="{{key}}1CustomData" <input matInput type='text' name="customData{{key}}Name"
required required
[(ngModel)]="i.name"> [(ngModel)]="i.name">
</mat-form-field> </mat-form-field>
<span>:</span> <span>:</span>
<mat-form-field> <mat-form-field>
<input readonly matInput type='text' name="{{key}}2CustomData" <input matInput type='text' name="customData{{key}}Value"
required required
[(ngModel)]="i.value"> [(ngModel)]="i.value">
</mat-form-field> </mat-form-field>
<span style="color: red;" *ngIf="i.required">*</span> <span style="color: red;" *ngIf="i.required">*</span>
</div> </div>
</div> </div>
</form>
</ng-template>
</div>
<!-- <div class="infobtnbox">
<button type="submit()" mat-button mat-raised-button color="primary" >保存</button>
<button type="button" mat-raised-button color="warn">删除</button>
</div> -->
</form>
</mat-tab> </mat-tab>
</mat-tab-group> </mat-tab-group>
</div> </div>
</div> </div>
</div> </div>

164
src/app/key-unit/basicinfo-look/basicinfo.component.scss
Unescape View File

@ -1,7 +1,7 @@
.topbox{ .topbox{
height: 485px; height: 485px;
width: 100%; width: 100%;
// border-bottom: 1px solid black; padding-bottom: 20px;
.mainbox{ .mainbox{
height: 100%; height: 100%;
position: relative; position: relative;
@ -9,7 +9,6 @@
.mainleft{ .mainleft{
width:800px; width:800px;
height: 100%; height: 100%;
// background-color: yellow;
float: left; float: left;
.inputbox{ .inputbox{
width: 343px; width: 343px;
@ -41,13 +40,8 @@
} }
.addbtn{ .addbtn{
width: 695px; width: 695px;
position: absolute; margin:20px 0;
bottom: -495px; padding-bottom: 20px;
text-align: center;
margin-bottom:20px;
button{
margin: 0 4px;
}
} }
.uploadimg{ .uploadimg{
width: 400px; width: 400px;
@ -56,18 +50,13 @@
margin-top:12px; margin-top:12px;
position: relative; position: relative;
margin-left: 80px; margin-left: 80px;
cursor: pointer;
span{ span{
float: left; float: left;
} }
// img{
// float: left;
// }
.uploadingimg{ .uploadingimg{
width: 299px; width: 299px;
height: 170px; height: 170px;
// background: url('../../../assets/images/upload2.png') no-repeat center center; cursor: pointer;
position: absolute; position: absolute;
top: 0px; top: 0px;
left: 79px; left: 79px;
@ -77,20 +66,11 @@
} }
.image{ .image{
// position: absolute;
// top: 199px;
// left: 160px;
// width: 299px;
// height: 170px;
input{ input{
// width: 299px;
// height: 170px;
width: 190px; width: 190px;
margin-top: 160px; margin-top: 160px;
cursor: pointer; cursor: pointer;
} }
// opacity:0;
} }
} }
.mainright{ .mainright{
@ -107,7 +87,6 @@
} }
.gistopbox{ .gistopbox{
position: absolute; position: absolute;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16); box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
border-radius: 4px; border-radius: 4px;
left: 5%; left: 5%;
@ -146,32 +125,49 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.inputBox{
width: 63%;
display: flex;
align-items: center;
.positionInput{
border: 0;
border-radius: 6px;
width: 90%;
height: 34px;
background: #F2F2F2;
margin-left: 8px;
box-sizing: border-box;
padding-left: 10px;
}
}
} }
.hidden{
opacity: 0;
z-index: -1;
} }
.show{
opacity: 1;
z-index: 1;
} }
} }
.bottombox{ }
// height:400px; }
width: 100%; .bodyBox{
// background-color: skyblue; flex: 70%;overflow-y: auto;
position: relative;
.bottomtitle{ .addBuilding{
height: 60px; position: absolute;
// background-color: orange; z-index: 999;
line-height: 60px; left: 0;
border-top: 1px solid black; top: 3px;
border-bottom: 1px solid black; }
} .buildInfoInput{
.houseinfobox{ width: 393px;
// height:340px; text-align: end;
overflow: auto; margin-left:240px;
.addhouseinfo{
float: left;
} }
.infobtnbox{ .infobtnbox{
margin-left: 800px;
position: absolute; position: absolute;
top: 30px; top: 30px;
right: 75px; right: 75px;
@ -182,19 +178,7 @@
margin-top: 15px; margin-top: 15px;
} }
} }
.infotitle{
font-size: 28px;
font-weight: 900;
margin-left: 180px;
}
.houseinfoinput{
width: 393px;
text-align: end;
margin-left:240px;
}
}
} }
.btn{ .btn{
width: 100%; width: 100%;
text-align: center; text-align: center;
@ -206,37 +190,29 @@
margin-top: 58px; margin-top: 58px;
margin-left: 203px; margin-left: 203px;
} }
.mat-table{
width: 99%;
}
table{ table{
width: 1000px; width: 99%;
thead{
tr{ tr{
th{ display: flex;
width: 60px; td,th{
display: block; flex: 1;
float: left;
}
}
} }
tbody{ th{
tr{ display: flex;
align-items: center;
justify-content: center;
td{
width: 60px;
display: block;
float: left;
text-align: center;
} }
input{
border: 0px ;
} }
} }
} }
table,table tr th, table tr td { border: 0.1px solid gray; }
table { text-align: center; border-collapse: collapse; padding:2px;}
.deviceinfo{ .deviceinfo{
// border-bottom: 1px solid black;;
padding-bottom: 60px; padding-bottom: 60px;
} }
.tankdetailinfo{ .tankdetailinfo{
@ -250,14 +226,10 @@ table{
} }
.tankinfo{ .tankinfo{
display: block; display: block;
width: 100%; width: 97.5%;
// height: 45px;
text-align: center; text-align: center;
border: 0px;
} }
// .adddeviceinfo{
// // position: absolute;
// // left: 0px;
// }
.submit1{ .submit1{
margin-left: -66px !important; margin-left: -66px !important;
} }
@ -269,31 +241,7 @@ textarea {
height: 110px; height: 110px;
resize: none; resize: none;
} }
//预览图片旋转角度
.img1{
transform:rotate(90deg) scale(0.55);
height: 100%;
}
.img2{
transform:rotate(180deg);
// height: 100%;
}
.img3{
transform:rotate(270deg) scale(0.55);
// height: 100%;
}
.img4{
transform:rotate(90deg) scale(1.3);
// height: 100%;
}
.img5{
transform:rotate(180deg);
// height: 100%;
}
.img6{
transform:rotate(270deg) scale(1.3);
// height: 100%;
}
.imgbox{ .imgbox{
text-align: center; text-align: center;
height: 750px; height: 750px;

1805
src/app/key-unit/basicinfo-look/basicinfo.component.ts
View File

File diff suppressed because it is too large Load Diff

11
src/app/key-unit/basicinfo-look/lookmaster.component.html
Unescape View File

@ -4,7 +4,7 @@
<ng-container *ngIf="isshowimg; else elseTemplate"> <ng-container *ngIf="isshowimg; else elseTemplate">
<div class="imgbox"> <div class="imgbox">
<img class="imgitemdefault" [src]="ImgUrl"> <img class="imgitemdefault" [src]="ImgUrl">
<!-- <img class="imgitemdefault" [src]="ImgUrl" [ngClass]="{'img1': rotateA==90,'img2': rotateA==180,'img3': rotateA==270,'img4': rotateB==10,'img5': rotateB==20,'img6': rotateB==30}" > -->
</div> </div>
</ng-container> </ng-container>
<ng-template #elseTemplate > <ng-template #elseTemplate >
@ -14,4 +14,13 @@
</div> </div>
<!--
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div> -->
<!-- <div class="previewImgBottom">
<button type="button" mat-icon-button (click)='rotate()'><mat-icon>refresh</mat-icon></button>
</div> -->

12
src/app/key-unit/basicinfo/addhouseinfo.component.ts
Unescape View File

@ -21,7 +21,6 @@ import { MatSnackBar } from '@angular/material/snack-bar';
this.dialogRef.close(); this.dialogRef.close();
} }
ngOnInit(): void { ngOnInit(): void {
// console.log(this.data)
this.getallunittype() this.getallunittype()
} }
getallunittype(){ getallunittype(){
@ -30,27 +29,24 @@ import { MatSnackBar } from '@angular/material/snack-bar';
}) })
} }
onSubmit(value){ onSubmit(value){
this.http.get("/api/Buildings",{ this.http.get("/api/Buildings",{
params:{ params:{
companyId:this.data.unitId companyId:this.data.unitId
} }
}).subscribe((data:any)=>{ }).subscribe((data:any)=>{
this.data.allBuildings = data let allBuildings = data
let order let order
if(data.length == 0){ if(allBuildings.length == 0){
order = 0 order = 0
}else{ }else{
order = data[data.length - 1].order + 1 order = allBuildings[allBuildings.length-1].order + 1
} }
let buildingTypename = "" let buildingTypename = ""
this.allunittype.forEach(item => { this.allunittype.forEach(item => {
if(item.id == value.unittype){ if(item.id == value.unittype){
buildingTypename = item.name buildingTypename = item.name
} }
}); });
this.http.post("/api/Buildings",{ this.http.post("/api/Buildings",{
id: "", id: "",
name: value.name, name: value.name,
@ -68,10 +64,12 @@ import { MatSnackBar } from '@angular/material/snack-bar';
}}).subscribe(data=>{ }}).subscribe(data=>{
this.dialogRef.close(data); this.dialogRef.close(data);
}) })
}) })
} }
} }

429
src/app/key-unit/basicinfo/basicinfo.component.html
Unescape View File

@ -1,11 +1,10 @@
<div style="height: 100%;display: flex; flex-direction: column;"> <div style="height: 100%;display: flex; flex-direction: column;overflow: hidden;">
<!-- header --> <!-- header -->
<mat-accordion> <mat-accordion>
<mat-expansion-panel expanded hideToggle > <mat-expansion-panel expanded>
<mat-expansion-panel-header style="color: black;"> <mat-expansion-panel-header style="color: black;">
<mat-panel-title> <mat-panel-title>
单位信息 单位信息
<mat-icon style="position: absolute;right:30px;">keyboard_arrow_down</mat-icon>
</mat-panel-title> </mat-panel-title>
</mat-expansion-panel-header> </mat-expansion-panel-header>
<div class="topbox"> <div class="topbox">
@ -66,7 +65,7 @@
</div> </div>
<div class="inputbox" style="width: 700px;"> <div class="inputbox" style="width: 700px;">
<span style="color: red;">*</span> <span style="color: red;">*</span>
<span>消防救援站：</span> <span>辖区中队：</span>
<mat-form-field style="width: 538px;"> <mat-form-field style="width: 538px;">
<input matInput id="organization" name="organization" type='text' <input matInput id="organization" name="organization" type='text'
required minlength="1" required minlength="1"
@ -105,16 +104,15 @@
(focus)="closeorganizationbox()"> (focus)="closeorganizationbox()">
</mat-form-field> </mat-form-field>
</div> </div>
<div class="uploadimg" (click)="lookmaster()"> <div class="uploadimg">
<span>单位照片：</span> <span>单位照片：</span>
<div class="uploadingimg"> <div class="uploadingimg" (click)="lookmaster()">
<img *ngIf="imgsrc" [src]="imgsrc" alt="" style="width: 299px; height: 170px;"> <img [src]="imgsrc ? imgsrc : noImg" alt="" style="width: 299px; height: 170px;" >
<img *ngIf="!imgsrc" [src]="noImgSrc" alt="" style="width: 299px; height: 170px;">
</div> </div>
<mat-spinner *ngIf="isspinner" diameter= 50></mat-spinner> <mat-spinner *ngIf="isspinner" diameter= 50></mat-spinner>
</div> </div>
<div class="image" (click)="closeorganizationbox()"> <div class="image" (click)="closeorganizationbox()">
<input id="selectedfile" type="file" (change)="filechange($event)" name="imgFile" accept=".jpg,.png,.jpeg,.gif,.webp"> <input id="selectedfile" type="file" ng2FileSelect [uploader]="uploader" (change)="filechange($event)" name="imgFile" accept=".jpg,.png,.jpeg,.gif,.webp">
</div> </div>
<div class="addbtn"> <div class="addbtn">
<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>
@ -124,6 +122,7 @@
<div style="width: 100%;height: 100%;" id="container"> <div style="width: 100%;height: 100%;" id="container">
</div> </div>
<div class="gistopbox" *ngIf="isGisTopBox"> <div class="gistopbox" *ngIf="isGisTopBox">
<div class="positionItem"> <div class="positionItem">
<span> <span>
@ -160,61 +159,56 @@
</div> </div>
</mat-expansion-panel> </mat-expansion-panel>
</mat-accordion> </mat-accordion>
<!-- body --> <!-- body -->
<div class="bottombox" style="flex: 70%;overflow-y: auto;" > <div class="bodyBox" id="basicInfoBody">
<div class="houseinfobox" style="height: 100%; overflow-y: auto;box-sizing:border-box"> <div>
<button type="button" mat-icon-button (click)="addhouseinfo()" class="addhouseinfo"><mat-icon style="font-size: 38px;">add_circle_outline</mat-icon></button> <button type="button" mat-icon-button (click)="addhouseinfo()" class="addBuilding"><mat-icon>add_circle_outline</mat-icon></button>
<mat-tab-group style="height: 100%;;" (focusChange)="selecttab($event)" > </div>
<mat-tab [label]="item.username" *ngFor="let item of houses;let key = index"> <div style="height: 100%; box-sizing:border-box;overflow-y: auto;padding-left: 26px;">
<form style="height: 100%; overflow-y:auto; display: block;" (ngSubmit)="onSubmit2(form.value,item,key,form.invalid)" #form="ngForm" class="example-container"> <mat-tab-group style="height: 100%;" [selectedIndex]="selectedIndex" (selectedTabChange)="selectedTabChange($event)">
<mat-tab *ngFor="let item of houses;let key = index" label="{{item.name}}">
<!-- 正常建筑 --> <ng-template matTabContent>
<div class="highinfo" *ngIf="item.tongyong"> <form *ngIf="item.data && item.data.length!=0" style="height: 100%; overflow-y:auto; display: block;" (ngSubmit)="onSubmitBuildingInfo(form.value,item,key,form.invalid)" #form="ngForm" class="example-container">
<div class="houseinfoinput" > <div class="buildInfoInput" >
<span>建筑名称：</span> <span>建筑名称：</span>
<mat-form-field> <mat-form-field>
<input matInput id="housename" name="housename" type='text' <input required matInput name="buildingName" type='text' minlength="1" [(ngModel)]="item.name">
minlength="1" [(ngModel)]="item.name"
>
</mat-form-field> </mat-form-field>
<span style="color: red;">*</span> <span style="color: red;">*</span>
</div> </div>
<div class="houseinfoinput"> <div class="buildInfoInput">
<span>建筑类型：</span> <span>建筑类型：</span>
<mat-form-field> <mat-form-field>
<mat-select name="unittype" [(ngModel)]="item.buildtype"> <mat-select name="buildingTypeName" [(ngModel)]="item.buildingTypes[0].name">
<mat-option [value]="n.name" *ngFor="let n of allunittype" (click)="templatebuildtype(n,item,key)">{{n.name}}</mat-option> <mat-option [value]="n.name" *ngFor="let n of allunittype" (click)="templateBuildtype(n,item,key)">{{n.name}}</mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<span style="color: red;">*</span> <span style="color: red;">*</span>
</div> </div>
<div *ngFor="let element of item.data[0].buildingBasicGroups;let groupsIndex = index "style="float: left;width:100%">
<div *ngFor="let item of item.buildingBasicGroups;let www = index" style="float: left;"> <!-- 类型为表单并且不是 罐区 -->
<h1 style="font-size: 22px;">{{item.name}}</h1> <div *ngIf="element.type == 0 && element.name.indexOf('罐区') == -1">
<div class="houseinfoinput" *ngFor="let i of item.propertyInfos" style="float: left;margin-left: 250px;position: relative;"> <p style="font-size: 22px;">{{element.name}}</p>
<div class="buildInfoInput" *ngFor="let i of element.propertyInfos;let inputIndex = index" style="float: left;margin-left: 250px;position: relative;">
<span>{{i.propertyName}}<span *ngIf="i.physicalUnit">({{i.physicalUnit}})</span>：</span> <span>{{i.propertyName}}<span *ngIf="i.physicalUnit">({{i.physicalUnit}})</span>：</span>
<!-- 如果类型是文本 --> <!-- 如果类型是文本 -->
<mat-form-field *ngIf="i.propertyType == 0 && i.propertyName != '耐火等级'"> <mat-form-field *ngIf="i.propertyType == 0 && i.propertyName != '耐火等级'">
<input matInput name="{{i.propertyName}}{{www}}" type='text' <input matInput name="{{groupsIndex}}{{inputIndex}}" type='text'
required="{{ i.required==true ? 'true' : 'false' }}" required="{{ i.required==true ? 'true' : 'false' }}"
[(ngModel)]="i.propertyValue"> [(ngModel)]="i.propertyValue">
</mat-form-field> </mat-form-field>
<!-- 如果类型是数字 --> <!-- 如果类型是数字 -->
<mat-form-field *ngIf="i.propertyType == 2 && i.propertyName != '耐火等级'"> <mat-form-field *ngIf="i.propertyType == 2 && i.propertyName != '耐火等级'">
<input matInput name="{{i.propertyName}}{{www}}" type='number' <input matInput name="{{groupsIndex}}{{inputIndex}}" type='number'
required="{{ i.required==true ? 'true' : 'false' }}" required="{{ i.required==true ? 'true' : 'false' }}"
[(ngModel)]="i.propertyValue" [(ngModel)]="i.propertyValue"
(change)="inputchange($event,i.ruleName,i.ruleValue,i)" (change)="inputchange($event,i.ruleName,i.ruleValue,i)"
> >
<!-- <mat-error *ngIf="isshowrule">{{rulevalue}}</mat-error> -->
</mat-form-field> </mat-form-field>
<!-- 如果类型是耐火等级 --> <!-- 如果类型是耐火等级 -->
<mat-form-field *ngIf="i.propertyName == '耐火等级'"> <mat-form-field *ngIf="i.propertyName == '耐火等级'">
<mat-select name="{{i.propertyName}}{{www}}" required="{{ i.required==true ? 'true' : 'false' }}" placeholder="请选择耐火等级" [(ngModel)]="i.propertyValue"> <mat-select name="{{groupsIndex}}{{inputIndex}}" required="{{ i.required==true ? 'true' : 'false' }}" placeholder="请选择耐火等级" [(ngModel)]="i.propertyValue">
<mat-option value="0">1级</mat-option> <mat-option value="0">1级</mat-option>
<mat-option value="1">2级</mat-option> <mat-option value="1">2级</mat-option>
<mat-option value="2">3级</mat-option> <mat-option value="2">3级</mat-option>
@ -222,89 +216,74 @@
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<!-- 如果类型是多行文本 --> <!-- 如果类型是多行文本 -->
<textarea *ngIf="i.propertyType == 1 && i.propertyName != '耐火等级'" style="width: 180px;height: 60px;" required="{{ i.required==true ? 'true' : 'false' }}" [(ngModel)]="i.propertyValue" name="{{i.propertyName}}{{key}}"></textarea> <textarea *ngIf="i.propertyType == 1 && i.propertyName != '耐火等级'" style="width: 180px;height: 60px;" required="{{ i.required==true ? 'true' : 'false' }}" [(ngModel)]="i.propertyValue" name="{{groupsIndex}}{{inputIndex}}"></textarea>
<span style="color: red;" *ngIf="i.required">*</span> <span style="color: red;" *ngIf="i.required">*</span>
<div *ngIf="i.isshowrule" style="position: absolute; <div *ngIf="i.isshowrule" style="position: absolute;left: 205px;top: 45px;font-size: 11px;color: red;">
left: 205px;
top: 45px;
font-size: 11px;
color: red;">
<span>{{i.rulevalue}}</span> <span>{{i.rulevalue}}</span>
</div> </div>
</div> </div>
</div> </div>
<!-- 类型为表格 并且不是 罐区 -->
<div class="CustomData" style="width: 200px;"> <div *ngIf="element.type == 1 && element.name.indexOf('罐区') == -1">
<mat-checkbox color="primary" (change)="checkCustomData($event)" name="checkbuilding" [(ngModel)]="item.isCustomData" style="float: left;margin-right: 10px;"></mat-checkbox> <p style="font-size: 22px;">
<h1 style="font-size: 22px;width: 200px;">自定义信息</h1> <mat-checkbox color="primary" (change)="checkboxChange(element,$event,item)" *ngIf="element.isOptional" [name]="element.name" [(ngModel)]="element.submitted" style="float: left;margin-right: 10px;"></mat-checkbox>
</div> {{element.name}}
<div *ngIf="item.isCustomData" style="position: relative;"> </p>
<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> <table *ngIf="element.submitted">
<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> <tr>
<div class="houseinfoinput" style="float: left;margin-left: 250px;" *ngFor="let i of item.buildingCustomData.customProperties;let key = index"> <th *ngFor="let item of element.propertyInfos[0].origin;let index = index">
<mat-form-field> <button *ngIf="index == 0" style="width: 24px;" type="button" mat-icon-button class="addline" (click)="addline(element.propertyInfos)"><mat-icon>add_circle_outline</mat-icon></button>
<input matInput type='text' name="{{key}}1CustomData" <button *ngIf="index == 0" style="width: 24px;" type="button" mat-icon-button class="removeline" (click)="removeline(element.propertyInfos)"><mat-icon>remove_circle_outline</mat-icon></button>
required {{item.propertyName}}
[(ngModel)]="i.name"> <span style="color: red;" *ngIf="item.required">*</span>
</mat-form-field> </th>
<span>:</span> </tr>
<mat-form-field> <tr *ngFor="let item of element.propertyInfos;let line = index">
<input matInput type='text' name="{{key}}2CustomData" <td *ngFor="let i of item.origin;let list = index">
required <input *ngIf="i.propertyType != 1" style="height:45px" class="tankinfo" name="{{element.name}}{{line + 1}}-{{list + 1}}" type="{{i.propertyType == 0 ? 'text' : 'number'}}"
[(ngModel)]="i.value"> required="{{ i.required==true ? 'true' : 'false' }}" [(ngModel)]="i.propertyValue">
</mat-form-field> <textarea class="tankinfo" *ngIf="i.propertyType == 1" required="{{ i.required==true ? 'true' : 'false' }}" [(ngModel)]="i.propertyValue" name="{{element.name}}{{line + 1}}{{list + 1}}">
<span style="color: red;" *ngIf="i.required">*</span>
</div> </textarea>
</div> </td>
</div> </tr>
</table>
<!-- 石油化工 -->
<div class="highinfo" *ngIf="item.isshiyou;let bigkey = index">
<div class="basicinfobox">
<div class="houseinfoinput">
<span>建筑名称：</span>
<mat-form-field>
<input matInput id="housename" name="housename" type='text'
required minlength="1" [(ngModel)]="item.name"
>
</mat-form-field>
<span style="color: red;">*</span>
</div>
<div class="houseinfoinput" >
<span>建筑类型：</span>
<mat-form-field>
<mat-select required name="unittype" [(ngModel)]="item.buildtype">
<mat-option [value]="n.name" *ngFor="let n of allunittype" (click)="templatebuildtype(n,item,key)">{{n.name}}</mat-option>
</mat-select>
</mat-form-field>
<span style="color: red;">*</span>
</div> </div>
<h1 style="font-size: 22px;">{{item.buildingBasicGroups[0].name}}</h1> <!-- 类型为表单 是罐区-->
<div class="houseinfoinput" *ngFor="let i of item.buildingBasicGroups[0].propertyInfos;let smkey = index" style="float: left;margin-left: 250px;position: relative;"> <div *ngIf="element.type == 0 && element.name.indexOf('罐区') != -1">
<p style="font-size: 22px;">
<mat-checkbox color="primary" (change)="checkboxChange(element,$event,item)" *ngIf="element.isOptional && element.name == '罐区1'" [name]="element.name" [(ngModel)]="element.submitted" style="float: left;margin-right: 10px;"></mat-checkbox>
<span *ngIf="element.name == '罐区1'">罐区信息</span>
</p>
<div *ngIf="element.submitted" >
<p *ngIf="element.name == '罐区1'" style="margin: 5px 0;">
<button type="button" mat-raised-button color="primary" (click)="addTankBox(item,groupsIndex)" style="margin-right: 5px;">添加罐区</button>
<button type="button" mat-raised-button color="warn" (click)="removeTankBox(item,groupsIndex)" matTooltip="会将此建筑处于末尾的罐区移除">移除末尾罐区</button>
</p>
<p style="font-size: 22px;">{{element.name}}</p>
<div class="buildInfoInput" *ngFor="let i of element.propertyInfos;let inputIndex = index" style="float: left;margin-left: 250px;position: relative;">
<span>{{i.propertyName}}<span *ngIf="i.physicalUnit">({{i.physicalUnit}})</span>：</span> <span>{{i.propertyName}}<span *ngIf="i.physicalUnit">({{i.physicalUnit}})</span>：</span>
<!-- 如果类型是文本 --> <!-- 如果类型是文本 -->
<mat-form-field *ngIf="i.propertyType == 0 && i.propertyName != '耐火等级'"> <mat-form-field *ngIf="i.propertyType == 0 && i.propertyName != '耐火等级'">
<input matInput name="{{i.propertyName}}" type='text' <input matInput name="{{groupsIndex}}{{inputIndex}}" type='text'
required="{{ i.required==true ? 'true' : 'false' }}" required="{{ i.required==true ? 'true' : 'false' }}"
[(ngModel)]="i.propertyValue"> [(ngModel)]="i.propertyValue">
</mat-form-field> </mat-form-field>
<!-- 如果类型是数字 --> <!-- 如果类型是数字 -->
<mat-form-field *ngIf="i.propertyType == 2 && i.propertyName != '耐火等级'"> <mat-form-field *ngIf="i.propertyType == 2 && i.propertyName != '耐火等级'">
<input matInput name="{{i.propertyName}}" type='number' <input matInput name="{{groupsIndex}}{{inputIndex}}" type='number'
required="{{ i.required==true ? 'true' : 'false' }}" required="{{ i.required==true ? 'true' : 'false' }}"
[(ngModel)]="i.propertyValue" [(ngModel)]="i.propertyValue"
(change)="inputchange($event,i.ruleName,i.ruleValue,i)" (change)="inputchange($event,i.ruleName,i.ruleValue,i)"
> >
<!-- <mat-error *ngIf="isshowrule">{{rulevalue}}</mat-error> -->
</mat-form-field> </mat-form-field>
<!-- 如果类型是耐火等级 --> <!-- 如果类型是耐火等级 -->
<mat-form-field *ngIf="i.propertyName == '耐火等级'"> <mat-form-field *ngIf="i.propertyName == '耐火等级'">
<mat-select name="{{i.propertyName}}" required="{{ i.required==true ? 'true' : 'false' }}" placeholder="请选择耐火等级" [(ngModel)]="i.propertyValue"> <mat-select name="{{groupsIndex}}{{inputIndex}}" required="{{ i.required==true ? 'true' : 'false' }}" placeholder="请选择耐火等级" [(ngModel)]="i.propertyValue">
<mat-option value="0">1级</mat-option> <mat-option value="0">1级</mat-option>
<mat-option value="1">2级</mat-option> <mat-option value="1">2级</mat-option>
<mat-option value="2">3级</mat-option> <mat-option value="2">3级</mat-option>
@ -312,262 +291,78 @@
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<!-- 如果类型是多行文本 --> <!-- 如果类型是多行文本 -->
<textarea *ngIf="i.propertyType == 1 && i.propertyName != '耐火等级'" style="width: 180px;height: 60px;" required="{{ i.required==true ? 'true' : 'false' }}" [(ngModel)]="i.propertyValue" name="{{i.propertyName}}"></textarea> <textarea *ngIf="i.propertyType == 1 && i.propertyName != '耐火等级'" style="width: 180px;height: 60px;" required="{{ i.required==true ? 'true' : 'false' }}" [(ngModel)]="i.propertyValue" name="{{groupsIndex}}{{inputIndex}}"></textarea>
<span style="color: red;" *ngIf="i.required">*</span> <span style="color: red;" *ngIf="i.required">*</span>
<div *ngIf="i.isshowrule" style=" position: absolute; <div *ngIf="i.isshowrule" style="position: absolute;left: 205px;top: 45px;font-size: 11px;color: red;">
left: 205px;
top: 45px;
font-size: 11px;
color: red;">
<span>{{i.rulevalue}}</span> <span>{{i.rulevalue}}</span>
</div> </div>
</div> </div>
</div> </div>
<div class="deviceinfo">
<div style="width: 200px;">
<mat-checkbox color="primary" (change)="checkboxchange(item.buildingBasicGroups[1].submitted,$event)" 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> </div>
<!-- 类型为表格 是罐区 -->
<table mat-table [dataSource]="devicedataSourcebox[item.buildingId]" class="mat-elevation-z8" *ngIf="item.buildingBasicGroups[1].submitted"> <div *ngIf="element.type == 1 && element.name.indexOf('罐区') != -1">
<ng-container matColumnDef="name"> <p style="font-size: 22px;" *ngIf="element.submitted">
<th mat-header-cell *matHeaderCellDef> {{element.name}}
<button style="width: 24px;" type="button" mat-icon-button class="adddeviceinfo2" (click)="adddeviceinfo(item)"><mat-icon>add_circle_outline</mat-icon></button> </p>
<button style="width: 24px;" type="button" mat-icon-button class="removedeviceinfo" (click)="removedeviceinfo(item)"><mat-icon>remove_circle_outline</mat-icon></button> <table *ngIf="element.submitted">
装置区名称<span style="color: red;">*</span></th> <tr>
<td mat-cell *matCellDef="let element;let key = index"> <th *ngFor="let item of element.propertyInfos[0].origin;let index = index">
<textarea style="width: 100px;" [(ngModel)]="element.name" name="{{key}}1" required></textarea> <button *ngIf="index == 0" style="width: 24px;" type="button" mat-icon-button class="addline" (click)="addline(element.propertyInfos)"><mat-icon>add_circle_outline</mat-icon></button>
</td> <button *ngIf="index == 0" style="width: 24px;" type="button" mat-icon-button class="removeline" (click)="removeline(element.propertyInfos)"><mat-icon>remove_circle_outline</mat-icon></button>
</ng-container> {{item.propertyName}}
<ng-container matColumnDef="flow"> <span style="color: red;" *ngIf="item.required">*</span>
<th mat-header-cell *matHeaderCellDef>工艺流程<span style="color: red;">*</span></th> </th>
<td mat-cell *matCellDef="let element;let key = index"> </tr>
<textarea [(ngModel)]="element.flow" name="{{key}}2" required></textarea> <tr *ngFor="let item of element.propertyInfos;let line = index">
</td> <td *ngFor="let i of item.origin;let list = index">
</ng-container> <input type="{{i.propertyType == 0 ? 'text' : 'number'}}" style="height:45px" class="tankinfo" name="{{element.name}}{{line + 1}}-{{list + 1}}"
<ng-container matColumnDef="danger"> required="{{ i.required==true ? 'true' : 'false' }}" [(ngModel)]="i.propertyValue">
<th mat-header-cell *matHeaderCellDef>火灾危险性<span style="color: red;">*</span></th>
<td mat-cell *matCellDef="let element;let key = index">
<textarea [(ngModel)]="element.danger" name="{{key}}3" required></textarea>
</td>
</ng-container>
<ng-container matColumnDef="payattentionto">
<th mat-header-cell *matHeaderCellDef>灭火注意事项</th>
<td mat-cell *matCellDef="let element;let key = index">
<textarea style="width: 100px;" [(ngModel)]="element.payattentionto" name="{{key}}4"></textarea>
</td> </td>
</ng-container> </tr>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table> </table>
</div> </div>
<div style="width: 200px;">
<mat-checkbox color="primary" (change)="checkboxchange(item,$event)" *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> </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 name="{{www+2}}-tanker-{{key}}" type='text'
required="{{ i.required==true ? 'true' : 'false' }}"
[(ngModel)]="i.propertyValue"
>
</mat-form-field>
<textarea style="width: 180px;height: 45px;" *ngIf="i.propertyType == 1" [(ngModel)]="i.propertyValue" name="{{www+2}}-tanker-{{key}}"></textarea>
<span style="color: red;" *ngIf="i.required">*</span>
</div>
</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>
罐区 </th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.tank}}tank{{key}}" type='text'
[(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>容量(m³)<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>直径(m)<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>高度(m)<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>防护堤高度(m)<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>半固定泡沫灭火接口数量</th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.portnum}}tank{{key}}" type='text'
[(ngModel)]="element.portnum">
</td>
</ng-container>
<ng-container matColumnDef="else">
<th mat-header-cell *matHeaderCellDef>其它设施</th>
<td mat-cell *matCellDef="let element;let key = index">
<input style="height:45px" class="tankinfo" name="{{www}}{{element.else}}tank{{key}}" type='text'
[(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;"> <div class="CustomData" style="width: 200px;margin-top: 60px;">
<mat-checkbox color="primary" (change)="checkCustomData($event)" name="checkbuilding" [(ngModel)]="item.isCustomData" style="float: left;margin-right: 10px;"></mat-checkbox> <mat-checkbox color="primary" (change)="checkCustomData($event)" name="checkbuilding" [(ngModel)]="item.isCustomData" style="float: left;margin-right: 10px;"></mat-checkbox>
<h1 style="font-size: 22px;width: 200px;">自定义信息</h1> <h1 style="font-size: 22px;width: 200px;">自定义信息</h1>
</div> </div>
<div *ngIf="item.isCustomData" style="position: relative;"> <div style="position: relative;" *ngIf="item.isCustomData">
<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: 100px;top: 5px;" type="button" mat-icon-button (click)="addCustomData(item)" class="addCustomData">
<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> <mat-icon>add_circle_outline</mat-icon>
<div class="houseinfoinput" style="float: left;margin-left: 250px;" *ngFor="let i of item.buildingCustomData.customProperties;let key = index"> </button>
<button style="position: absolute;left:150px;top: 5px;" type="button" mat-icon-button (click)="popCustomData(item)" class="deleteCustomData">
<mat-icon>remove_circle_outline</mat-icon>
</button>
<div class="houseinfoinput" style="float: left;margin-left: 250px;" *ngFor="let i of item.customData.customProperties;let key = index">
<mat-form-field> <mat-form-field>
<input matInput type='text' name="{{key}}1CustomData" <input matInput type='text' name="customData{{key}}Name"
required required
[(ngModel)]="i.name"> [(ngModel)]="i.name">
</mat-form-field> </mat-form-field>
<span>:</span> <span>:</span>
<mat-form-field> <mat-form-field>
<input matInput type='text' name="{{key}}2CustomData" <input matInput type='text' name="customData{{key}}Value"
required required
[(ngModel)]="i.value"> [(ngModel)]="i.value">
</mat-form-field> </mat-form-field>
<span style="color: red;" *ngIf="i.required">*</span> <span style="color: red;" *ngIf="i.required">*</span>
</div> </div>
</div> </div>
</div>
<div class="infobtnbox"> <div class="infobtnbox">
<button type="submit()" mat-button mat-raised-button color="primary" >保存</button> <button type="submit" mat-button mat-raised-button color="primary">保存</button>
<button type="button" mat-raised-button (click)="deletedbuilding(item)" color="warn">删除</button> <button type="button" mat-raised-button (click)="deletedbuilding(item,key)" color="warn">删除</button>
</div> </div>
</form> </form>
</mat-tab> </ng-template>
</mat-tab-group>
</mat-tab>
</mat-tab-group>
</div> </div>
</div> </div>
</div> </div>

122
src/app/key-unit/basicinfo/basicinfo.component.scss
Unescape View File

@ -1,7 +1,7 @@
.topbox{ .topbox{
height: 485px; height: 485px;
width: 100%; width: 100%;
// border-bottom: 1px solid black; padding-bottom: 20px;
.mainbox{ .mainbox{
height: 100%; height: 100%;
position: relative; position: relative;
@ -40,7 +40,8 @@
} }
.addbtn{ .addbtn{
width: 695px; width: 695px;
margin:9px 0; margin:20px 0;
padding-bottom: 20px;
} }
.uploadimg{ .uploadimg{
width: 400px; width: 400px;
@ -150,29 +151,23 @@
z-index: 1; z-index: 1;
} }
} }
} }
} }
.bottombox{ .bodyBox{
// height:400px; flex: 70%;overflow-y: auto;
width: 100%; position: relative;
// background-color: skyblue; .addBuilding{
position: absolute;
.bottomtitle{ z-index: 999;
height: 60px; left: 0;
// background-color: orange; top: 3px;
line-height: 60px; }
border-top: 1px solid black; .buildInfoInput{
border-bottom: 1px solid black; width: 393px;
} text-align: end;
.houseinfobox{ margin-left:240px;
// height:340px;
overflow: auto;
.addhouseinfo{
float: left;
} }
.infobtnbox{ .infobtnbox{
margin-left: 800px;
position: absolute; position: absolute;
top: 30px; top: 30px;
right: 75px; right: 75px;
@ -183,19 +178,7 @@
margin-top: 15px; margin-top: 15px;
} }
} }
.infotitle{
font-size: 28px;
font-weight: 900;
margin-left: 180px;
} }
.houseinfoinput{
width: 393px;
text-align: end;
margin-left:240px;
}
}
}
.btn{ .btn{
width: 100%; width: 100%;
text-align: center; text-align: center;
@ -207,37 +190,29 @@
margin-top: 58px; margin-top: 58px;
margin-left: 203px; margin-left: 203px;
} }
.mat-table{
width: 100%;
}
table{ table{
width: 1000px; width: 99%;
thead{
tr{ tr{
th{ display: flex;
width: 60px; td,th{
display: block; flex: 1;
float: left;
}
}
} }
tbody{ th{
tr{ display: flex;
align-items: center;
justify-content: center;
td{
width: 60px;
display: block;
float: left;
text-align: center;
} }
input{
border: 0px ;
} }
} }
} }
table,table tr th, table tr td { border: 0.1px solid gray; }
table { text-align: center; border-collapse: collapse; padding:2px;}
.deviceinfo{ .deviceinfo{
// border-bottom: 1px solid black;;
padding-bottom: 60px; padding-bottom: 60px;
} }
.tankdetailinfo{ .tankdetailinfo{
@ -251,14 +226,10 @@ table{
} }
.tankinfo{ .tankinfo{
display: block; display: block;
width: 100%; width: 97.5%;
// height: 45px;
text-align: center; text-align: center;
border: 0px;
} }
// .adddeviceinfo{
// // position: absolute;
// // left: 0px;
// }
.submit1{ .submit1{
margin-left: -66px !important; margin-left: -66px !important;
} }
@ -270,31 +241,7 @@ textarea {
height: 110px; height: 110px;
resize: none; resize: none;
} }
//预览图片旋转角度
.img1{
transform:rotate(90deg) scale(0.55);
height: 100%;
}
.img2{
transform:rotate(180deg);
// height: 100%;
}
.img3{
transform:rotate(270deg) scale(0.55);
// height: 100%;
}
.img4{
transform:rotate(90deg) scale(1.3);
// height: 100%;
}
.img5{
transform:rotate(180deg);
// height: 100%;
}
.img6{
transform:rotate(270deg) scale(1.3);
// height: 100%;
}
.imgbox{ .imgbox{
text-align: center; text-align: center;
height: 750px; height: 750px;
@ -313,8 +260,3 @@ textarea {
font-size: 12px; font-size: 12px;
color: red; color: red;
} }
.mat-expansion-panel{
span{
color: black;
}
}

1870
src/app/key-unit/basicinfo/basicinfo.component.ts
View File

File diff suppressed because it is too large Load Diff
Write Preview
Loading…
Cancel
Save