Browse Source

[完善]格式化代码

beijing
邵佳豪 3 years ago
parent
commit
febffe16fa
  1. 224
      src/app/pages/left-domain/left-domain.component.html
  2. 239
      src/app/pages/plan/plan.component.html

224
src/app/pages/left-domain/left-domain.component.html

@ -4,11 +4,17 @@
<!-- 基本信息 -->
<div class="publicBox baseInfo" *ngIf="beforeFence === 0 && baseInfo">
<div class="interval">
<p class="title">{{baseInfo.stationName || '暂无数据'}}<button class="titleBotton"><label *ngIf="baseInfo.stationType == 0">自营</label><label *ngIf="baseInfo.stationType == 1">加盟</label><label *ngIf="baseInfo.stationType != 0 && baseInfo.stationType != 1">其他</label></button></p>
<p class="text"><img src="../../../assets/images/baseInfo/position.png" class="textIcon">{{baseInfo.address || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/building.png" class="textIcon">{{baseInfo.locationName || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/date.png" class="textIcon">{{baseInfo.openTime | date:"yyyy/MM/dd" || ''}} 开业</p>
<p class="text"><img src="../../../assets/images/baseInfo/road.png" class="textIcon">{{baseInfo.laneCount || '0'}} 车道</p>
<p class="title">{{baseInfo.stationName || '暂无数据'}}<button class="titleBotton"><label
*ngIf="baseInfo.stationType == 0">自营</label><label *ngIf="baseInfo.stationType == 1">加盟</label><label
*ngIf="baseInfo.stationType != 0 && baseInfo.stationType != 1">其他</label></button></p>
<p class="text"><img src="../../../assets/images/baseInfo/position.png" class="textIcon">{{baseInfo.address ||
'暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/building.png" class="textIcon">{{baseInfo.locationName
|| '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/date.png" class="textIcon">{{baseInfo.openTime |
date:"yyyy/MM/dd" || ''}} 开业</p>
<p class="text"><img src="../../../assets/images/baseInfo/road.png" class="textIcon">{{baseInfo.laneCount ||
'0'}} 车道</p>
<p class="text">公司名称: {{baseInfo.companyName || '暂无数据'}}</p>
<p class="text">联系人: {{baseInfo.leaderName || '暂无数据'}}</p>
<p class="text">联系电话: {{baseInfo.leaderContact || '暂无数据'}}</p>
@ -19,40 +25,56 @@
</div>
<div class="interval" *ngIf="baseInfo.govUnitDetail && baseInfo.govUnitDetail.policeStation">
<p class="title">辖区派出所</p>
<p class="text"><img src="../../../assets/images/baseInfo/police.png" class="textIcon">{{baseInfo.govUnitDetail.policeStation.name || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/position.png" class="textIcon">{{baseInfo.govUnitDetail.policeStation.address || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/phone.png" class="textIcon">{{baseInfo.govUnitDetail.policeStation.contactInformation || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/road.png" class="textIcon">{{baseInfo.govUnitDetail.policeStation.distance || '0公里'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/police.png"
class="textIcon">{{baseInfo.govUnitDetail.policeStation.name || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/position.png"
class="textIcon">{{baseInfo.govUnitDetail.policeStation.address || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/phone.png"
class="textIcon">{{baseInfo.govUnitDetail.policeStation.contactInformation || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/road.png"
class="textIcon">{{baseInfo.govUnitDetail.policeStation.distance || '0公里'}}</p>
</div>
<div class="interval" *ngIf="baseInfo.govUnitDetail && baseInfo.govUnitDetail.hospital">
<p class="title">辖区医院</p>
<p class="text"><img src="../../../assets/images/baseInfo/hospital.png" class="textIcon">{{baseInfo.govUnitDetail.hospital.name || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/position.png" class="textIcon">{{baseInfo.govUnitDetail.hospital.address || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/phone.png" class="textIcon">{{baseInfo.govUnitDetail.hospital.contactInformation || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/road.png" class="textIcon">{{baseInfo.govUnitDetail.hospital.distance || '0公里'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/hospital.png"
class="textIcon">{{baseInfo.govUnitDetail.hospital.name || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/position.png"
class="textIcon">{{baseInfo.govUnitDetail.hospital.address || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/phone.png"
class="textIcon">{{baseInfo.govUnitDetail.hospital.contactInformation || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/road.png"
class="textIcon">{{baseInfo.govUnitDetail.hospital.distance || '0公里'}}</p>
</div>
<div class="interval" *ngIf="baseInfo.govUnitDetail && baseInfo.govUnitDetail.fireBrigade">
<p class="title">辖区消防队</p>
<p class="text"><img src="../../../assets/images/baseInfo/police.png" class="textIcon">{{baseInfo.govUnitDetail.fireBrigade.name || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/position.png" class="textIcon">{{baseInfo.govUnitDetail.fireBrigade.address || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/phone.png" class="textIcon">{{baseInfo.govUnitDetail.fireBrigade.contactInformation || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/road.png" class="textIcon">{{baseInfo.govUnitDetail.fireBrigade.distance || '0公里'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/police.png"
class="textIcon">{{baseInfo.govUnitDetail.fireBrigade.name || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/position.png"
class="textIcon">{{baseInfo.govUnitDetail.fireBrigade.address || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/phone.png"
class="textIcon">{{baseInfo.govUnitDetail.fireBrigade.contactInformation || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/road.png"
class="textIcon">{{baseInfo.govUnitDetail.fireBrigade.distance || '0公里'}}</p>
</div>
<div class="interval baseInfoImg" *ngIf="baseInfo.businessLicenseImage">
<p class="title">营业执照</p>
<p class="text" *ngIf="baseInfo.validityStartTime && baseInfo.validityEndTime">有效时间: {{baseInfo.validityStartTime | date:"yyyy/MM/dd"}} - {{baseInfo.validityEndTime | date:"yyyy/MM/dd"}}</p>
<p class="text" *ngIf="baseInfo.validityStartTime && baseInfo.validityEndTime">有效时间:
{{baseInfo.validityStartTime | date:"yyyy/MM/dd"}} - {{baseInfo.validityEndTime | date:"yyyy/MM/dd"}}</p>
<p class="text">提前预警时间天数: {{baseInfo.validityTermDays}}天</p>
<p class="textImage"><img [src]="baseInfo.businessLicenseImage"></p>
</div>
<div class="interval baseInfoImg" *ngIf="baseInfo.dangerousChemicalLicenseImage">
<p class="title">危险化学品经营许可证</p>
<p class="text" *ngIf="baseInfo.dangerousStartTime && baseInfo.dangerousEndTime">有效时间: {{baseInfo.dangerousStartTime | date:"yyyy/MM/dd"}} - {{baseInfo.dangerousEndTime | date:"yyyy/MM/dd"}}</p>
<p class="text" *ngIf="baseInfo.dangerousStartTime && baseInfo.dangerousEndTime">有效时间:
{{baseInfo.dangerousStartTime | date:"yyyy/MM/dd"}} - {{baseInfo.dangerousEndTime | date:"yyyy/MM/dd"}}</p>
<p class="text">提前预警时间天数: {{baseInfo.dangerousTermDays}}天</p>
<p class="textImage"><img [src]="baseInfo.dangerousChemicalLicenseImage"></p>
</div>
<div class="interval baseInfoImg" *ngIf="baseInfo.gasSellLicenseImage">
<p class="title">成品油零售经营许可证</p>
<p class="text" *ngIf="baseInfo.sellLicenseStartTime && baseInfo.sellLicenseEndTime">有效时间: {{baseInfo.sellLicenseStartTime | date:"yyyy/MM/dd"}} - {{baseInfo.sellLicenseEndTime | date:"yyyy/MM/dd"}}</p>
<p class="text" *ngIf="baseInfo.sellLicenseStartTime && baseInfo.sellLicenseEndTime">有效时间:
{{baseInfo.sellLicenseStartTime | date:"yyyy/MM/dd"}} - {{baseInfo.sellLicenseEndTime | date:"yyyy/MM/dd"}}
</p>
<p class="text">提前预警时间天数: {{baseInfo.sellLicenseTermDays}}天</p>
<p class="textImage"><img [src]="baseInfo.gasSellLicenseImage"></p>
</div>
@ -60,8 +82,10 @@
<!-- 基本信息 -->
<!-- 加油机 -->
<div class="publicBox refueller" *ngIf="beforeFence === 1">
<div class="interval" *ngFor="let item of FacilityList | facilitySort" (click)="selectFacility($event, item)" [ngClass]="{'selectFacility': selectFacilityId === item.getID()}">
<p class="title"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().name" (click)="stopBubbling($event)"></p>
<div class="interval" *ngFor="let item of FacilityList | facilitySort" (click)="selectFacility($event, item)"
[ngClass]="{'selectFacility': selectFacilityId === item.getID()}">
<p class="title"><input type="text" class="tableInput" [disabled]="!editMode"
[(ngModel)]="item.getPropertyData().name" (click)="stopBubbling($event)"></p>
<div class="table">
<div class="tableHeader">
<p>品牌</p>
@ -70,10 +94,17 @@
<p class="overflowP" id="title{{item.modelInfo.key}}">油枪编号</p>
</div>
<div class="tableContent">
<p [title]="item.getPropertyData().brand"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().brand" (click)="stopBubbling($event)"></p>
<p [title]="item.getPropertyData().oilGunNum"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().oilGunNum" (click)="stopBubbling($event)"></p>
<p [title]="item.getPropertyData().oilProductNo"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().oilProductNo" (click)="stopBubbling($event)"></p>
<p [title]="item.getPropertyData().oilGunNo" class="overflowP" id="content{{item.modelInfo.key}}"><textarea nz-input nzAutosize id="num{{item.modelInfo.key}}" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().oilGunNo" (click)="stopBubbling($event)" (input)="textInput(item)"></textarea></p>
<p [title]="item.getPropertyData().brand"><input type="text" class="tableInput" [disabled]="!editMode"
[(ngModel)]="item.getPropertyData().brand" (click)="stopBubbling($event)"></p>
<p [title]="item.getPropertyData().oilGunNum"><input type="text" class="tableInput" [disabled]="!editMode"
[(ngModel)]="item.getPropertyData().oilGunNum" (click)="stopBubbling($event)"></p>
<p [title]="item.getPropertyData().oilProductNo"><input type="text" class="tableInput"
[disabled]="!editMode" [(ngModel)]="item.getPropertyData().oilProductNo" (click)="stopBubbling($event)">
</p>
<p [title]="item.getPropertyData().oilGunNo" class="overflowP" id="content{{item.modelInfo.key}}"><textarea
nz-input nzAutosize id="num{{item.modelInfo.key}}" [disabled]="!editMode"
[(ngModel)]="item.getPropertyData().oilGunNo" (click)="stopBubbling($event)"
(input)="textInput(item)"></textarea></p>
</div>
</div>
</div>
@ -81,8 +112,10 @@
<!-- 加油机 -->
<!-- 油罐设备 -->
<div class="publicBox refueller" *ngIf="beforeFence === 2">
<div class="interval" *ngFor="let item of FacilityList | facilitySort" (click)="selectFacility($event, item)" [ngClass]="{'selectFacility': selectFacilityId === item.getID()}">
<p class="title"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().name" (click)="stopBubbling($event)"></p>
<div class="interval" *ngFor="let item of FacilityList | facilitySort" (click)="selectFacility($event, item)"
[ngClass]="{'selectFacility': selectFacilityId === item.getID()}">
<p class="title"><input type="text" class="tableInput" [disabled]="!editMode"
[(ngModel)]="item.getPropertyData().name" (click)="stopBubbling($event)"></p>
<div class="table">
<div class="tableHeader">
<p>油品品号</p>
@ -93,18 +126,28 @@
<p>油泵类型</p>
</div>
<div class="tableContent">
<p [title]="item.getPropertyData().oilProductNo"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().oilProductNo" (click)="stopBubbling($event)"></p>
<p [title]="item.getPropertyData().oilGunNo" class="overflowP" id="content{{item.modelInfo.key}}"><textarea nz-input nzAutosize id="num{{item.modelInfo.key}}" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().oilGunNo" (click)="stopBubbling($event)" (input)="textInput(item)"></textarea></p>
<p [title]="item.getPropertyData().oilTankVolume"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().oilTankVolume" (click)="stopBubbling($event)"></p>
<p [title]="item.getPropertyData().safeVolume"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().safeVolume" (click)="stopBubbling($event)"></p>
<p [title]="item.getPropertyData().oilProductNo"><input type="text" class="tableInput"
[disabled]="!editMode" [(ngModel)]="item.getPropertyData().oilProductNo" (click)="stopBubbling($event)">
</p>
<p [title]="item.getPropertyData().oilGunNo" class="overflowP" id="content{{item.modelInfo.key}}"><textarea
nz-input nzAutosize id="num{{item.modelInfo.key}}" [disabled]="!editMode"
[(ngModel)]="item.getPropertyData().oilGunNo" (click)="stopBubbling($event)"
(input)="textInput(item)"></textarea></p>
<p [title]="item.getPropertyData().oilTankVolume"><input type="text" class="tableInput"
[disabled]="!editMode" [(ngModel)]="item.getPropertyData().oilTankVolume"
(click)="stopBubbling($event)"></p>
<p [title]="item.getPropertyData().safeVolume"><input type="text" class="tableInput" [disabled]="!editMode"
[(ngModel)]="item.getPropertyData().safeVolume" (click)="stopBubbling($event)"></p>
<p style="padding-left: 8px;" (click)="stopBubbling($event)">
<nz-select class="tableSelect" [nzBorderless]="true" [nzDisabled]="!editMode" [(ngModel)]="item.getPropertyData().oilTankType">
<nz-select class="tableSelect" [nzBorderless]="true" [nzDisabled]="!editMode"
[(ngModel)]="item.getPropertyData().oilTankType">
<nz-option nzValue="双层罐" nzLabel="双层罐"></nz-option>
<nz-option nzValue="单层罐+防渗罐池" nzLabel="单层罐+防渗罐池"></nz-option>
</nz-select>
</p>
<p style="padding-left: 8px;" (click)="stopBubbling($event)">
<nz-select class="tableSelect" [nzBorderless]="true" [nzDisabled]="!editMode" [(ngModel)]="item.getPropertyData().oilPumpType">
<nz-select class="tableSelect" [nzBorderless]="true" [nzDisabled]="!editMode"
[(ngModel)]="item.getPropertyData().oilPumpType">
<nz-option nzValue="自吸泵" nzLabel="自吸泵"></nz-option>
<nz-option nzValue="潜油泵" nzLabel="潜油泵"></nz-option>
</nz-select>
@ -118,40 +161,54 @@
<div class="publicBox fireFacilities" *ngIf="beforeFence === 3">
<nz-tree [nzData]="treeData" [nzTreeTemplate]="nzTreeTemplate" (nzClick)="nzClick($event)"></nz-tree>
<ng-template #nzTreeTemplate let-node let-origin="origin">
<div class="treeRow"><p>{{node.title}}</p><p><i nz-icon nzType="eye" nzTheme="outline" *ngIf="node.isSelected"></i>{{getFacilityNum(node.key)}}</p></div>
<div class="treeRow">
<p>{{node.title}}</p>
<p><i nz-icon nzType="eye" nzTheme="outline" *ngIf="node.isSelected"></i>{{getFacilityNum(node.key)}}</p>
</div>
</ng-template>
</div>
<!-- 消防设施 -->
<!-- 输油管线 -->
<div class="publicBox refueller" *ngIf="beforeFence === 5">
<div class="interval" *ngFor="let item of FacilityList" (click)="selectFacility($event, item)" [ngClass]="{'selectFacility': selectFacilityId === item.getID()}">
<p class="title"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().name" (click)="stopBubbling($event)"></p>
<div class="interval" *ngFor="let item of FacilityList" (click)="selectFacility($event, item)"
[ngClass]="{'selectFacility': selectFacilityId === item.getID()}">
<p class="title"><input type="text" class="tableInput" [disabled]="!editMode"
[(ngModel)]="item.getPropertyData().name" (click)="stopBubbling($event)"></p>
<div class="table">
<div class="tableHeader" style="flex: 50%;">
<p>连接的加油机</p>
<p>连接的油罐</p>
</div>
<div class="tableContent" style="flex: 50%;">
<p [title]="item.getPropertyData().linkJYJ"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().linkJYJ" (click)="stopBubbling($event)"></p>
<p [title]="item.getPropertyData().linkYG"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().linkYG" (click)="stopBubbling($event)"></p>
<p [title]="item.getPropertyData().linkJYJ"><input type="text" class="tableInput" [disabled]="!editMode"
[(ngModel)]="item.getPropertyData().linkJYJ" (click)="stopBubbling($event)"></p>
<p [title]="item.getPropertyData().linkYG"><input type="text" class="tableInput" [disabled]="!editMode"
[(ngModel)]="item.getPropertyData().linkYG" (click)="stopBubbling($event)"></p>
</div>
</div>
<div class="propertyImage" id="pipelineViewer{{item.getID()}}">
<p class="imgTitle">设计图纸</p>
<img [hidden]="!item.getPropertyData().img" [src]="item.getPropertyData().img" [attr.data-original]="item.getPropertyData().img">
<div class="positionHandleImgVideo" style="width: 120px;" *ngIf="editMode && item.getPropertyData().img" (click)="stopBubbling($event)">
<a href="javascript:;" class="imgAndVideoUpload"><input type="file" accept="image/*" (change)='uploadLeftDomainImg($event, item)'><i nz-icon nzType="upload" nzTheme="outline"></i></a>
<img [hidden]="!item.getPropertyData().img" [src]="item.getPropertyData().img"
[attr.data-original]="item.getPropertyData().img">
<div class="positionHandleImgVideo" style="width: 120px;" *ngIf="editMode && item.getPropertyData().img"
(click)="stopBubbling($event)">
<a href="javascript:;" class="imgAndVideoUpload"><input type="file" accept="image/*"
(change)='uploadLeftDomainImg($event, item)'><i nz-icon nzType="upload" nzTheme="outline"></i></a>
<i nz-icon nzType="delete" nzTheme="outline" (click)="deleteImg(item)"></i>
</div>
<a href="javascript:;" class="bottomPlanUpload uploadImgBox" *ngIf="editMode && !item.getPropertyData().img" (click)="stopBubbling($event)"><input type="file" accept="image/*" (change)='uploadLeftDomainImg($event, item)'><i nz-icon nzType="plus" nzTheme="outline"></i></a>
<a href="javascript:;" class="bottomPlanUpload uploadImgBox" *ngIf="editMode && !item.getPropertyData().img"
(click)="stopBubbling($event)"><input type="file" accept="image/*"
(change)='uploadLeftDomainImg($event, item)'><i nz-icon nzType="plus" nzTheme="outline"></i></a>
</div>
</div>
</div>
<!-- 输油管线 -->
<!-- 油气回收 -->
<div class="publicBox refueller" *ngIf="beforeFence === 6">
<div class="interval" *ngFor="let item of FacilityList" (click)="selectFacility($event, item)" [ngClass]="{'selectFacility': selectFacilityId === item.getID()}">
<p class="title"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().name" (click)="stopBubbling($event)"></p>
<div class="interval" *ngFor="let item of FacilityList" (click)="selectFacility($event, item)"
[ngClass]="{'selectFacility': selectFacilityId === item.getID()}">
<p class="title"><input type="text" class="tableInput" [disabled]="!editMode"
[(ngModel)]="item.getPropertyData().name" (click)="stopBubbling($event)"></p>
<div class="table">
<div class="tableHeader orvrTableHeader" style="flex: 58%;">
<p class="overflowP" id="orvrTitle{{item.modelInfo.key}}">一次油气回收系统类型</p>
@ -161,26 +218,41 @@
<p class="overflowP" id="title{{item.modelInfo.key}}">油气回收在线监测装置</p>
</div>
<div class="tableContent orvrTableContent" style="flex: 42%;">
<p [title]="item.getPropertyData().VRUType" class="overflowP" id="orvrContent{{item.modelInfo.key}}"><textarea nz-input nzAutosize id="orvrNum{{item.modelInfo.key}}" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().VRUType" (click)="stopBubbling($event)" (input)="textInput(item)"></textarea></p>
<p [title]="item.getPropertyData().VRUType" class="overflowP" id="orvrContent{{item.modelInfo.key}}">
<textarea nz-input nzAutosize id="orvrNum{{item.modelInfo.key}}" [disabled]="!editMode"
[(ngModel)]="item.getPropertyData().VRUType" (click)="stopBubbling($event)"
(input)="textInput(item)"></textarea></p>
<p style="padding-left: 8px;" (click)="stopBubbling($event)">
<nz-select class="tableSelect" [nzBorderless]="true" [nzDisabled]="!editMode" [(ngModel)]="item.getPropertyData().VRUType_2">
<nz-select class="tableSelect" [nzBorderless]="true" [nzDisabled]="!editMode"
[(ngModel)]="item.getPropertyData().VRUType_2">
<nz-option nzValue="分散式" nzLabel="分散式"></nz-option>
<nz-option nzValue="集中式" nzLabel="集中式"></nz-option>
</nz-select>
</p>
<p [title]="item.getPropertyData().VRUPumpType"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().VRUPumpType" (click)="stopBubbling($event)"></p>
<p [title]="item.getPropertyData().VRUPumpDevice"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().VRUPumpDevice" (click)="stopBubbling($event)"></p>
<p [title]="item.getPropertyData().MonitoringDevice" class="overflowP" id="content{{item.modelInfo.key}}"><textarea nz-input nzAutosize id="num{{item.modelInfo.key}}" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().MonitoringDevice" (click)="stopBubbling($event)" (input)="textInput(item)"></textarea></p>
<p [title]="item.getPropertyData().VRUPumpType"><input type="text" class="tableInput" [disabled]="!editMode"
[(ngModel)]="item.getPropertyData().VRUPumpType" (click)="stopBubbling($event)"></p>
<p [title]="item.getPropertyData().VRUPumpDevice"><input type="text" class="tableInput"
[disabled]="!editMode" [(ngModel)]="item.getPropertyData().VRUPumpDevice"
(click)="stopBubbling($event)"></p>
<p [title]="item.getPropertyData().MonitoringDevice" class="overflowP" id="content{{item.modelInfo.key}}">
<textarea nz-input nzAutosize id="num{{item.modelInfo.key}}" [disabled]="!editMode"
[(ngModel)]="item.getPropertyData().MonitoringDevice" (click)="stopBubbling($event)"
(input)="textInput(item)"></textarea></p>
</div>
</div>
<div class="propertyImage" id="orvrViewer{{item.getID()}}">
<p class="imgTitle">设计图纸</p>
<img [hidden]="!item.getPropertyData().img" [src]="item.getPropertyData().img" [attr.data-original]="item.getPropertyData().img">
<div class="positionHandleImgVideo" style="width: 120px;" *ngIf="editMode && item.getPropertyData().img" (click)="stopBubbling($event)">
<a href="javascript:;" class="imgAndVideoUpload"><input type="file" accept="image/*" (change)='uploadLeftDomainImg($event, item)'><i nz-icon nzType="upload" nzTheme="outline"></i></a>
<img [hidden]="!item.getPropertyData().img" [src]="item.getPropertyData().img"
[attr.data-original]="item.getPropertyData().img">
<div class="positionHandleImgVideo" style="width: 120px;" *ngIf="editMode && item.getPropertyData().img"
(click)="stopBubbling($event)">
<a href="javascript:;" class="imgAndVideoUpload"><input type="file" accept="image/*"
(change)='uploadLeftDomainImg($event, item)'><i nz-icon nzType="upload" nzTheme="outline"></i></a>
<i nz-icon nzType="delete" nzTheme="outline" (click)="deleteImg(item)"></i>
</div>
<a href="javascript:;" class="bottomPlanUpload uploadImgBox" *ngIf="editMode && !item.getPropertyData().img" (click)="stopBubbling($event)"><input type="file" accept="image/*" (change)='uploadLeftDomainImg($event, item)'><i nz-icon nzType="plus" nzTheme="outline"></i></a>
<a href="javascript:;" class="bottomPlanUpload uploadImgBox" *ngIf="editMode && !item.getPropertyData().img"
(click)="stopBubbling($event)"><input type="file" accept="image/*"
(change)='uploadLeftDomainImg($event, item)'><i nz-icon nzType="plus" nzTheme="outline"></i></a>
</div>
</div>
</div>
@ -188,7 +260,8 @@
<!-- 处置预案 -->
<div class="publicBox disposalPlan" *ngIf="beforeFence === 8 && allMarkPlanData" id="disposalPlan">
<nz-collapse>
<nz-collapse-panel *ngFor="let item of allMarkPlanData.datas;let key = index;" [nzHeader]="extraTpl" nzActive="true" nzShowArrow="false">
<nz-collapse-panel *ngFor="let item of allMarkPlanData.datas;let key = index;" [nzHeader]="extraTpl"
nzActive="true" nzShowArrow="false">
<ng-template #extraTpl>
<div class="publicDisposal disposalHeader">
<span>{{item.name}}</span>
@ -201,8 +274,12 @@
</ng-template>
<ul>
<li class="publicDisposal disposalContent" *ngFor="let items of item.nodes;let keys = index;">
<span nz-popconfirm nzPopconfirmTitle="切换节点后,没保存的信息将会丢失!" [nzCondition]="!editMode" (nzOnConfirm)="selectNode(item,items,keys)" [ngClass]="{'selectNode': selectNodeId == items.id && selectPlanId == item.id}">{{items.name}}</span>
<label *ngIf="editMode"><i nz-icon nzType="save" nzTheme="outline" (click)="saveDisposal(item.id,items.id)"></i><i nz-icon nzType="delete" nzTheme="outline" (click)="deleteDisposal($event,item,items)"></i></label>
<span nz-popconfirm nzPopconfirmTitle="切换节点后,没保存的信息将会丢失!" [nzCondition]="!editMode"
(nzOnConfirm)="selectNode(item,items,keys)"
[ngClass]="{'selectNode': selectNodeId == items.id && selectPlanId == item.id}">{{items.name}}</span>
<label *ngIf="editMode"><i nz-icon nzType="save" nzTheme="outline"
(click)="saveDisposal(item.id,items.id)"></i><i nz-icon nzType="delete" nzTheme="outline"
(click)="deleteDisposal($event,item,items)"></i></label>
</li>
</ul>
</nz-collapse-panel>
@ -211,29 +288,36 @@
<!-- 处置预案 -->
<!-- 阀门 -->
<div class="publicBox refueller" *ngIf="beforeFence === 7">
<div class="interval" *ngFor="let item of FacilityList" (click)="selectFacility($event, item)" [ngClass]="{'selectFacility': selectFacilityId === item.getID()}">
<p class="title"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().name" (click)="stopBubbling($event)"></p>
<div class="interval" *ngFor="let item of FacilityList" (click)="selectFacility($event, item)"
[ngClass]="{'selectFacility': selectFacilityId === item.getID()}">
<p class="title"><input type="text" class="tableInput" [disabled]="!editMode"
[(ngModel)]="item.getPropertyData().name" (click)="stopBubbling($event)"></p>
<div class="table">
<div class="tableHeader">
<p class="overflowP" id="title{{item.modelInfo.key}}" style="text-align: center; padding: 0;">描述</p>
</div>
<div class="tableContent">
<p [title]="item.getPropertyData().describe" class="overflowP" id="content{{item.modelInfo.key}}"><textarea nz-input nzAutosize id="num{{item.modelInfo.key}}" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().describe" (click)="stopBubbling($event)" (input)="textInput(item)"></textarea></p>
<p [title]="item.getPropertyData().describe" class="overflowP" id="content{{item.modelInfo.key}}"><textarea
nz-input nzAutosize id="num{{item.modelInfo.key}}" [disabled]="!editMode"
[(ngModel)]="item.getPropertyData().describe" (click)="stopBubbling($event)"
(input)="textInput(item)"></textarea></p>
</div>
</div>
</div>
</div>
<!-- 阀门 -->
<!-- 弹窗 -->
<nz-modal nzClassName="baseInfoDialog" [(nzVisible)]="isShowBaseDialog" nzFooter="null" (nzOnCancel)="closeBaseInfoDialog()" nzWidth="70%">
<nz-modal nzClassName="baseInfoDialog" [(nzVisible)]="isShowBaseDialog" nzFooter="null"
(nzOnCancel)="closeBaseInfoDialog()" nzWidth="70%">
<app-oil-station-info *ngIf="isShowBaseDialog"></app-oil-station-info>
</nz-modal>
<nz-modal [(nzVisible)]="addDisposalPop || addNodePop" nzTitle="创建预案/节点" (nzOnCancel)="addDisposalPop = false; addNodePop = null;" (nzOnOk)="addDisposal(form.value)">
<nz-modal [(nzVisible)]="addDisposalPop || addNodePop" nzTitle="创建预案/节点"
(nzOnCancel)="addDisposalPop = false; addNodePop = null;" (nzOnOk)="addDisposal(form.value)">
<form nz-form #form='ngForm'>
<nz-form-item>
<nz-form-label [nzSpan]="6">预案/节点名称</nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请输入必填项">
<input nz-input #nodeName='ngModel' ngModel name="name"/>
<input nz-input #nodeName='ngModel' ngModel name="name" />
</nz-form-control>
</nz-form-item>
<nz-form-item *ngIf="addDisposalPop">
@ -253,7 +337,7 @@
<nz-form-item>
<nz-form-label [nzSpan]="6">预案名称</nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请输入必填项">
<input nz-input #name='ngModel' [(ngModel)]="editDisposalName" name="name" required/>
<input nz-input #name='ngModel' [(ngModel)]="editDisposalName" name="name" required />
</nz-form-control>
</nz-form-item>
</form>
@ -263,23 +347,25 @@
<button nz-button nzType="primary" (click)="editDisposal(editForm.value)">确定</button>
</div>
</nz-modal>
<nz-modal [(nzVisible)]="saveDisposalDialog" nzTitle="处置节点保存" (nzOnCancel)="saveDisposalDialog = false;" [nzFooter]="null">
<nz-modal [(nzVisible)]="saveDisposalDialog" nzTitle="处置节点保存" (nzOnCancel)="saveDisposalDialog = false;"
[nzFooter]="null">
<div class="submitBottom">
<button (click)='saveNode(true)'>新建节点并保存</button><button (click)='saveNode(false)'>保存到已有节点</button>
</div>
</nz-modal>
<nz-modal [(nzVisible)]="saveType" [nzTitle]="saveType === 1? '新建节点并保存' : '保存到已有节点'" (nzOnCancel)="saveType = null;" (nzOnOk)="saveDisposalNode(saveForm.value)">
<nz-modal [(nzVisible)]="saveType" [nzTitle]="saveType === 1? '新建节点并保存' : '保存到已有节点'" (nzOnCancel)="saveType = null;"
(nzOnOk)="saveDisposalNode(saveForm.value)">
<form nz-form #saveForm='ngForm'>
<nz-form-item *ngIf="saveType === 1">
<nz-form-label [nzSpan]="6">节点名称<span style="color: red;">*</span></nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请输入必填项">
<input nz-input #name='ngModel' ngModel name="name" required/>
<input nz-input #name='ngModel' ngModel name="name" required />
</nz-form-control>
</nz-form-item>
<nz-form-item *ngIf="saveType === 1">
<nz-form-label [nzSpan]="6"><span></span>节点</nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请选择节点">
<nz-select #root='ngModel'ngModel name="root" required>
<nz-select #root='ngModel' ngModel name="root" required>
<nz-option *ngFor="let item of allNodeList" [nzValue]="item" [nzLabel]="item.name"></nz-option>
</nz-select>
</nz-form-control>
@ -287,7 +373,7 @@
<nz-form-item *ngIf="saveType === 2">
<nz-form-label [nzSpan]="6">节点</nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请选择节点">
<nz-select #node='ngModel'ngModel name="node" required>
<nz-select #node='ngModel' ngModel name="node" required>
<nz-option *ngFor="let item of allNodeList" [nzValue]="item" [nzLabel]="item.name"></nz-option>
</nz-select>
</nz-form-control>

239
src/app/pages/plan/plan.component.html

@ -1,24 +1,36 @@
<div class="loading" *ngIf="isShowLoading"><nz-spin nzSimple [nzSize]="'large'"></nz-spin></div>
<div class="loading" *ngIf="isShowLoading">
<nz-spin nzSimple [nzSize]="'large'"></nz-spin>
</div>
<div class="content" id="threeDimensional">
<div class="header">
<button *ngFor="let item of allFence; let key = index;" [ngClass]="{'selectFence': selectFence === key}" (click)="toggleHeaderFence(key)">
<label nz-dropdown [nzDropdownMenu]="menu" [nzDisabled]="item != '基本信息' || selectFence != 0">{{item}}<i nz-icon nzType="caret-up" nzTheme="outline" *ngIf="key === 0"></i></label>
<button *ngFor="let item of allFence; let key = index;" [ngClass]="{'selectFence': selectFence === key}"
(click)="toggleHeaderFence(key)">
<label nz-dropdown [nzDropdownMenu]="menu" [nzDisabled]="item != '基本信息' || selectFence != 0">{{item}}<i nz-icon
nzType="caret-up" nzTheme="outline" *ngIf="key === 0"></i></label>
</button>
<nz-dropdown-menu #menu="nzDropdownMenu">
<ul nz-menu class="dropDown">
<li nz-menu-item *ngFor="let item of baseInfoMarks"><label nz-checkbox [(ngModel)]="item.isShow" [nzDisabled]="selectFence != 0" (ngModelChange)="toggleBaseInfoMark($event, item)">{{item.markerName}}</label></li>
<li nz-menu-item *ngFor="let item of baseInfoMarks"><label nz-checkbox [(ngModel)]="item.isShow"
[nzDisabled]="selectFence != 0"
(ngModelChange)="toggleBaseInfoMark($event, item)">{{item.markerName}}</label></li>
</ul>
</nz-dropdown-menu>
<div class="rightFence">
<img src="../../../assets/images/awningShow.png" [hidden]="!isOpenAwning" (click)="toggleHeaderAwning(false)">
<img src="../../../assets/images/awningHide.png" [hidden]="isOpenAwning" (click)="toggleHeaderAwning(true)">
<img src="../../../assets/images/rangeFinding.png" title="测量距离" [hidden]="selectMeasure === 1" (click)="toggleMeasure(1)">
<img src="../../../assets/images/selectRangeFinding.png" title="测量距离" [hidden]="selectMeasure != 1" (click)="toggleMeasure(1)">
<img src="../../../assets/images/heightFinding.png" title="测量高度" [hidden]="selectMeasure === 2" (click)="toggleMeasure(2)">
<img src="../../../assets/images/selectHeightFinding.png" title="测量高度" [hidden]="selectMeasure != 2" (click)="toggleMeasure(2)">
<img src="../../../assets/images/measuredArea.png" title="测量面积" [hidden]="selectMeasure === 3" (click)="toggleMeasure(3)">
<img src="../../../assets/images/selectMeasuredArea.png" title="测量面积" [hidden]="selectMeasure != 3" (click)="toggleMeasure(3)">
<img src="../../../assets/images/rangeFinding.png" title="测量距离" [hidden]="selectMeasure === 1"
(click)="toggleMeasure(1)">
<img src="../../../assets/images/selectRangeFinding.png" title="测量距离" [hidden]="selectMeasure != 1"
(click)="toggleMeasure(1)">
<img src="../../../assets/images/heightFinding.png" title="测量高度" [hidden]="selectMeasure === 2"
(click)="toggleMeasure(2)">
<img src="../../../assets/images/selectHeightFinding.png" title="测量高度" [hidden]="selectMeasure != 2"
(click)="toggleMeasure(2)">
<img src="../../../assets/images/measuredArea.png" title="测量面积" [hidden]="selectMeasure === 3"
(click)="toggleMeasure(3)">
<img src="../../../assets/images/selectMeasuredArea.png" title="测量面积" [hidden]="selectMeasure != 3"
(click)="toggleMeasure(3)">
<img src="../../../assets/images/save3DPlan.png" title="保存" (click)="preserve(true)" *ngIf="editMode">
</div>
</div>
@ -27,30 +39,43 @@
<canvas id="center"></canvas>
<!-- 左侧子组件 -->
<div class="leftChildComponent" *ngIf="isShowChildComponent && selectFence != 4" [ngStyle]="{ 'left': isShowLeftBuilding && editMode && userMode? '15%' : null }" [ngClass]="{'publicMoveUp': selectFence === 8}">
<div class="leftChildComponent" *ngIf="isShowChildComponent && selectFence != 4"
[ngStyle]="{ 'left': isShowLeftBuilding && editMode && userMode? '15%' : null }"
[ngClass]="{'publicMoveUp': selectFence === 8}">
<div class="leftChildHeader">
<div><i nz-icon nzType="star" nzTheme="outline"></i></div>
<div>{{allFence[selectFence]}}<i nz-icon nzType="plus-circle" nzTheme="outline" *ngIf="selectFence === 8 && editMode" (click)="noticeChildComponent(true)"></i><i nz-icon nzType="save" nzTheme="outline" *ngIf="selectFence === 8 && editMode" (click)="noticeChildComponent(false)"></i></div>
<div (click)="toggleHeaderFence(selectFence)" title="关闭"><i nz-icon nzType="close-circle" nzTheme="outline"></i></div>
<div>{{allFence[selectFence]}}<i nz-icon nzType="plus-circle" nzTheme="outline"
*ngIf="selectFence === 8 && editMode" (click)="noticeChildComponent(true)"></i><i nz-icon nzType="save"
nzTheme="outline" *ngIf="selectFence === 8 && editMode" (click)="noticeChildComponent(false)"></i></div>
<div (click)="toggleHeaderFence(selectFence)" title="关闭"><i nz-icon nzType="close-circle" nzTheme="outline"></i>
</div>
</div>
<div class="leftChildCenter">
<app-left-domain #leftDomain></app-left-domain>
</div>
<div class="leftChildCenter"><app-left-domain #leftDomain></app-left-domain></div>
</div>
<!-- 左侧子组件 -->
<!-- 左侧建筑栏 -->
<div class="showLeftBuilding" title="显示" *ngIf="!isShowLeftBuilding && editMode && userMode" (click)="toggleLeftBuilding(true)"><i nz-icon nzType="right" nzTheme="outline"></i></div>
<div class="leftBuilding" *ngIf="editMode && userMode" [ngClass]="{'isShowLeftBuilding': isShowLeftBuilding === false, 'publicMoveUp': selectFence === 8}">
<div class="hideLeft"><i nz-icon nzType="close" nzTheme="outline" title="隐藏" (click)="toggleLeftBuilding(false)"></i></div>
<div class="showLeftBuilding" title="显示" *ngIf="!isShowLeftBuilding && editMode && userMode"
(click)="toggleLeftBuilding(true)"><i nz-icon nzType="right" nzTheme="outline"></i></div>
<div class="leftBuilding" *ngIf="editMode && userMode"
[ngClass]="{'isShowLeftBuilding': isShowLeftBuilding === false, 'publicMoveUp': selectFence === 8}">
<div class="hideLeft"><i nz-icon nzType="close" nzTheme="outline" title="隐藏"
(click)="toggleLeftBuilding(false)"></i></div>
<div class="leftHeader">
<h1><label>模型列表</label></h1>
<button nz-button nzType="primary" (click)="addBuildingPop = true">新建</button>
</div>
<div class="leftCenter">
<div class="everyBuilding" *ngFor="let item of buildingUIItems" (click)='selectLeftBuilding(item)' [ngClass]="{'selectLeftBuilding': beforeOneBuildingID == item.getBuildingID()}">
<div class="everyBuilding" *ngFor="let item of buildingUIItems" (click)='selectLeftBuilding(item)'
[ngClass]="{'selectLeftBuilding': beforeOneBuildingID == item.getBuildingID()}">
<label style="flex: 1;" class="overflowText modelTitle">{{item.getBuildingName()}}</label>
<label style="width: 65px; overflow: hidden;">
<i nz-icon nzType="plus-circle" nzTheme="outline" title="聚焦" (click)="positionModelBuilding($event,item)"></i>
<i nz-icon nzType="edit" nzTheme="outline" title="编辑" (click)="editModelBuilding($event,item)" style="margin: 0 5px;"></i>
<i nz-icon nzType="plus-circle" nzTheme="outline" title="聚焦"
(click)="positionModelBuilding($event,item)"></i>
<i nz-icon nzType="edit" nzTheme="outline" title="编辑" (click)="editModelBuilding($event,item)"
style="margin: 0 5px;"></i>
<i nz-icon nzType="delete" nzTheme="outline" title="删除" (click)="deleteModelBuilding($event,item)"></i>
</label>
</div>
@ -60,75 +85,117 @@
<!-- 右侧属性栏 -->
<!-- 油罐罐区总览 -->
<div class="tankFarm" *ngIf="selectFence === 2 && tankFarm.isHave" [ngStyle]="{ 'left': isShowLeftBuilding && editMode && userMode? '15%' : null }">
<div class="tankFarm" *ngIf="selectFence === 2 && tankFarm.isHave"
[ngStyle]="{ 'left': isShowLeftBuilding && editMode && userMode? '15%' : null }">
<div class="tankFarmLeft">油罐罐区</div>
<div style="flex: 1;"><input type="text" [(ngModel)]="tankFarm.content" (ngModelChange)="changeTankFarmValue()" [disabled]="!editMode"></div>
<div style="flex: 1;"><input type="text" [(ngModel)]="tankFarm.content" (ngModelChange)="changeTankFarmValue()"
[disabled]="!editMode"></div>
</div>
<!-- 油罐罐区总览 -->
<div class="nature" *ngIf="isShowNature && selectFence === 0 && beforeOnePropertyData && beforeOnePropertyData.getPropertyData()" [ngStyle]="{'right': editMode? '5%' : null}">
<div class="natureHeader"><i nz-icon nzType="close-circle" nzTheme="outline" title="关闭" (click)="isShowNature = false;"></i></div>
<div class="nature"
*ngIf="isShowNature && selectFence === 0 && beforeOnePropertyData && beforeOnePropertyData.getPropertyData()"
[ngStyle]="{'right': editMode? '5%' : null}">
<div class="natureHeader"><i nz-icon nzType="close-circle" nzTheme="outline" title="关闭"
(click)="isShowNature = false;"></i></div>
<div class="natureContent" *ngIf="beforeOnePropertyData.getPropertyData().textDirection != undefined">
<div class="natureTitle">方向</div>
<div><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().textDirection" [disabled]="!editMode"></div>
<div><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().textDirection"
[disabled]="!editMode"></div>
</div>
<div class="natureContent" *ngIf="beforeOnePropertyData.getPropertyData().info != undefined">
<div class="natureTitle">详情</div>
<div><textarea [(ngModel)]="beforeOnePropertyData.getPropertyData().info" [disabled]="!editMode"></textarea></div>
<div><textarea [(ngModel)]="beforeOnePropertyData.getPropertyData().info" [disabled]="!editMode"></textarea>
</div>
</div>
<div class="natureContent" *ngIf="beforeOnePropertyData.getPropertyData().img != undefined" id="propertyImg">
<div class="natureTitle">图片</div>
<div class="natureTitle" *ngIf="beforeOnePropertyData.getPropertyData().is360 != undefined"><label nz-checkbox [(ngModel)]="beforeOnePropertyData.getPropertyData().is360" [nzDisabled]="!editMode" (ngModelChange)="togglePanorama($event)">全景照片</label></div>
<div class="natureTitle" *ngIf="beforeOnePropertyData.getPropertyData().is360 != undefined"><label nz-checkbox
[(ngModel)]="beforeOnePropertyData.getPropertyData().is360" [nzDisabled]="!editMode"
(ngModelChange)="togglePanorama($event)">全景照片</label></div>
<div class="natureImg" *ngIf="beforeOnePropertyData.getPropertyData().img">
<img [src]="beforeOnePropertyData.getPropertyData().img" [attr.data-original]="beforeOnePropertyData.getPropertyData().img" (click)="lookPanorama()">
<div class="positionHandleImgVideo" style="width: 120px;" *ngIf="editMode && beforeOnePropertyData.getPropertyData().img">
<a href="javascript:;" class="imgAndVideoUpload"><input type="file" accept="image/*" (change)='uploadPropertyImg($event)'><i nz-icon nzType="upload" nzTheme="outline"></i></a>
<img [src]="beforeOnePropertyData.getPropertyData().img"
[attr.data-original]="beforeOnePropertyData.getPropertyData().img" (click)="lookPanorama()">
<div class="positionHandleImgVideo" style="width: 120px;"
*ngIf="editMode && beforeOnePropertyData.getPropertyData().img">
<a href="javascript:;" class="imgAndVideoUpload"><input type="file" accept="image/*"
(change)='uploadPropertyImg($event)'><i nz-icon nzType="upload" nzTheme="outline"></i></a>
<i nz-icon nzType="delete" nzTheme="outline" (click)="deleteImgVideo(1)"></i>
</div>
</div>
<div *ngIf="editMode && !beforeOnePropertyData.getPropertyData().img"><a href="javascript:;" class="bottomPlanUpload natureUpload"><input type="file" accept="image/*" (change)='uploadPropertyImg($event)'><i nz-icon nzType="plus" nzTheme="outline"></i></a></div>
<div *ngIf="editMode && !beforeOnePropertyData.getPropertyData().img"><a href="javascript:;"
class="bottomPlanUpload natureUpload"><input type="file" accept="image/*"
(change)='uploadPropertyImg($event)'><i nz-icon nzType="plus" nzTheme="outline"></i></a></div>
</div>
</div>
<div class="nature natureLook" *ngIf="isShowNature && (selectFence === 1 || selectFence === 2) && beforeOnePropertyData" [ngStyle]="{'top': naturePosition.top,'left': naturePosition.left}">
<div class="nature natureLook"
*ngIf="isShowNature && (selectFence === 1 || selectFence === 2) && beforeOnePropertyData"
[ngStyle]="{'top': naturePosition.top,'left': naturePosition.left}">
<div *ngIf="selectFence === 1" class="naturePosition">
<div class="positionLeftTop"></div><div class="positionLeftBottom"></div><div class="positionRightTop"></div><div class="positionRightBottom"></div>
<div class="natureTitle"><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().name" [disabled]="!editMode"></div>
<div class="positionLeftTop"></div>
<div class="positionLeftBottom"></div>
<div class="positionRightTop"></div>
<div class="positionRightBottom"></div>
<div class="natureTitle"><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().name"
[disabled]="!editMode"></div>
<div class="flowPower">
<div>
<img src="../../../assets/images/flow.png">
<label><p>流量</p><p><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().flow" [disabled]="!editMode"></p></label>
<label>
<p>流量</p>
<p><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().flow" [disabled]="!editMode">
</p>
</label>
</div>
<div>
<img src="../../../assets/images/power.png">
<label><p>功率</p><p><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().power" [disabled]="!editMode"></p></label>
<label>
<p>功率</p>
<p><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().power" [disabled]="!editMode">
</p>
</label>
</div>
</div>
<div class="everyNature"><span>品牌 :</span><label><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().brand" [disabled]="!editMode"></label></div>
<div class="everyNature"><span>油枪数量 :</span><label><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().oilGunNum" [disabled]="!editMode"></label></div>
<div class="everyNature"><span>油品品号 :</span><label><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().oilProductNo" [disabled]="!editMode"></label></div>
<div class="everyNature"><span>品牌 :</span><label><input type="text"
[(ngModel)]="beforeOnePropertyData.getPropertyData().brand" [disabled]="!editMode"></label></div>
<div class="everyNature"><span>油枪数量 :</span><label><input type="text"
[(ngModel)]="beforeOnePropertyData.getPropertyData().oilGunNum" [disabled]="!editMode"></label></div>
<div class="everyNature"><span>油品品号 :</span><label><input type="text"
[(ngModel)]="beforeOnePropertyData.getPropertyData().oilProductNo" [disabled]="!editMode"></label></div>
</div>
<div *ngIf="selectFence === 2" class="naturePosition">
<div class="positionLeftTop"></div><div class="positionLeftBottom"></div><div class="positionRightTop"></div><div class="positionRightBottom"></div>
<div class="natureTitle"><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().name" [disabled]="!editMode"></div>
<div class="everyNature"><span>油品品号 :</span><label><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().oilProductNo" [disabled]="!editMode"></label></div>
<div class="everyNature"><span>油罐容积 :</span><label><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().oilTankVolume" [disabled]="!editMode"></label></div>
<div class="everyNature"><span>安全容积 :</span><label><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().safeVolume" [disabled]="!editMode"></label></div>
<div class="positionLeftTop"></div>
<div class="positionLeftBottom"></div>
<div class="positionRightTop"></div>
<div class="positionRightBottom"></div>
<div class="natureTitle"><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().name"
[disabled]="!editMode"></div>
<div class="everyNature"><span>油品品号 :</span><label><input type="text"
[(ngModel)]="beforeOnePropertyData.getPropertyData().oilProductNo" [disabled]="!editMode"></label></div>
<div class="everyNature"><span>油罐容积 :</span><label><input type="text"
[(ngModel)]="beforeOnePropertyData.getPropertyData().oilTankVolume" [disabled]="!editMode"></label></div>
<div class="everyNature"><span>安全容积 :</span><label><input type="text"
[(ngModel)]="beforeOnePropertyData.getPropertyData().safeVolume" [disabled]="!editMode"></label></div>
</div>
</div>
<!-- 右侧属性栏 -->
<!-- 右侧图标栏 -->
<div class="rightIcons" *ngIf="editMode && (selectFence === 0 || selectFence === 8)" [ngClass]="{'publicMoveUp': selectFence === 8}" [ngStyle]="{'width': selectFence === 8? '100px' : null}">
<div class="rightIcons" *ngIf="editMode && (selectFence === 0 || selectFence === 8)"
[ngClass]="{'publicMoveUp': selectFence === 8}" [ngStyle]="{'width': selectFence === 8? '100px' : null}">
<div class="bottomCenter" id="bottomCenter">
<ng-container *ngIf="selectFence === 0">
<div class="everyIcon" (click)='selectBottomIcon(item)' *ngFor="let item of allFacilityUIItemes" [ngClass]="{'selectLeftIcon': beforeOneIcon == item.getIconID()}">
<div class="everyIcon" (click)='selectBottomIcon(item)' *ngFor="let item of allFacilityUIItemes"
[ngClass]="{'selectLeftIcon': beforeOneIcon == item.getIconID()}">
<img [src]="item.getIconURL()">
<p>{{item.getIconName()}}</p>
</div>
</ng-container>
<ng-container *ngIf="selectFence === 8">
<nz-collapse [nzBordered]="false">
<nz-collapse-panel [nzHeader]="allMarkData.iconsName[key]" [nzActive]="true" *ngFor="let element of allMarkData.icons; let key = index;">
<div class="everyIcon" (click)='selectBottomIcon(item)' *ngFor="let item of element" [ngClass]="{'selectLeftIcon': beforeOneIcon == item.key}">
<nz-collapse-panel [nzHeader]="allMarkData.iconsName[key]" [nzActive]="true"
*ngFor="let element of allMarkData.icons; let key = index;">
<div class="everyIcon" (click)='selectBottomIcon(item)' *ngFor="let item of element"
[ngClass]="{'selectLeftIcon': beforeOneIcon == item.key}">
<img [src]="item.iconURL">
<p>{{item.name}}</p>
</div>
@ -163,45 +230,61 @@
<div class="pulicPlanDiv bottomPlanHeader">
<div class="planHeaderText">
<p><input type="text" [(ngModel)]="beforePlanNode.name" [disabled]="!editMode"></p>
<textarea [(ngModel)]="beforePlanNode.describe" [disabled]="!editMode" [ngClass]="{'lookModelTextarea': !editMode}"></textarea>
<textarea [(ngModel)]="beforePlanNode.describe" [disabled]="!editMode"
[ngClass]="{'lookModelTextarea': !editMode}"></textarea>
</div>
<div class="planHeaderImg" id="planNodeImg">
<img class="imgSrc" [src]="beforePlanNode.texture" [hidden]="!beforePlanNode.texture" [attr.data-original]="beforePlanNode.texture">
<img class="imgSrc" [src]="beforePlanNode.texture" [hidden]="!beforePlanNode.texture"
[attr.data-original]="beforePlanNode.texture">
<div class="positionHandleImgVideo" style="width: 100px;" *ngIf="editMode && beforePlanNode.texture">
<a href="javascript:;" class="imgAndVideoUpload"><input type="file" accept="image/*" (change)='uploadImgVideo($event, false)'><i nz-icon nzType="upload" nzTheme="outline"></i></a>
<a href="javascript:;" class="imgAndVideoUpload"><input type="file" accept="image/*"
(change)='uploadImgVideo($event, false)'><i nz-icon nzType="upload" nzTheme="outline"></i></a>
<i nz-icon nzType="delete" nzTheme="outline" (click)="deleteImgVideo(2)"></i>
</div>
<a href="javascript:;" class="bottomPlanUpload" *ngIf="editMode && !beforePlanNode.texture"><input type="file" accept="image/*" (change)='uploadImgVideo($event, false)'><img src="../../../assets/images/uploadImg.png"></a>
<a href="javascript:;" class="bottomPlanUpload" *ngIf="editMode && !beforePlanNode.texture"><input type="file"
accept="image/*" (change)='uploadImgVideo($event, false)'><img
src="../../../assets/images/uploadImg.png"></a>
</div>
<div class="planHeaderVideo">
<video [src]="beforePlanNode.video" [hidden]="!beforePlanNode.video" (click)="openVideo(beforePlanNode.video)"></video>
<video [src]="beforePlanNode.video" [hidden]="!beforePlanNode.video"
(click)="openVideo(beforePlanNode.video)"></video>
<div class="positionHandleImgVideo" style="width: 120px;" *ngIf="editMode && beforePlanNode.video">
<a href="javascript:;" class="imgAndVideoUpload"><input type="file" accept=".mp4,.ogg,.webm" (change)='uploadImgVideo($event, true)'><i nz-icon nzType="upload" nzTheme="outline"></i></a>
<a href="javascript:;" class="imgAndVideoUpload"><input type="file" accept=".mp4,.ogg,.webm"
(change)='uploadImgVideo($event, true)'><i nz-icon nzType="upload" nzTheme="outline"></i></a>
<i nz-icon nzType="delete" nzTheme="outline" (click)="deleteImgVideo(3)"></i>
</div>
<a href="javascript:;" class="bottomPlanUpload" style="width: 100px;" *ngIf="editMode && !beforePlanNode.video"><input type="file" accept=".mp4,.ogg,.webm" (change)='uploadImgVideo($event, true)'><img src="../../../assets/images/uploadVideo.png"></a>
<a href="javascript:;" class="bottomPlanUpload" style="width: 100px;"
*ngIf="editMode && !beforePlanNode.video"><input type="file" accept=".mp4,.ogg,.webm"
(change)='uploadImgVideo($event, true)'><img src="../../../assets/images/uploadVideo.png"></a>
</div>
</div>
<div style="height: 5px;"></div>
<div class="pulicPlanDiv bottomPlanCenter">
<label><button nz-dropdown [nzDropdownMenu]="plan" nzTrigger="click">{{beforeEmergencyPlan.name}}</button></label>
<label><button nz-dropdown [nzDropdownMenu]="plan"
nzTrigger="click">{{beforeEmergencyPlan.name}}</button></label>
<nz-dropdown-menu #plan="nzDropdownMenu">
<ul nz-menu class="dropDown dropDownPlan" *ngIf="allMarkPlanData">
<li nz-menu-item *ngFor="let item of allMarkPlanData.datas;let key = index;" (click)="selectChildNode(item)" [ngStyle]="{'color': beforeEmergencyPlan.id === item.id? '#23D9FF' : null}">{{item.name}}</li>
<li nz-menu-item *ngFor="let item of allMarkPlanData.datas;let key = index;" (click)="selectChildNode(item)"
[ngStyle]="{'color': beforeEmergencyPlan.id === item.id? '#23D9FF' : null}">{{item.name}}</li>
</ul>
</nz-dropdown-menu>
<label>
<ng-container *ngIf="beforeEmergencyPlan.nodes && beforeEmergencyPlan.nodes.length">
<div class="progress" *ngFor="let item of beforeEmergencyPlan.nodes;let key = index;" title="{{item.name}}" [ngStyle]="{'flex': getProgressFlex(item)}">
<img src="../../../assets/images/stepIcon.png" nz-popconfirm nzPopconfirmTitle="切换节点后,没保存的信息将会丢失!" [nzCondition]="!editMode" (nzOnConfirm)="changePlanNode(key)">
<div><nz-progress [nzShowInfo]="false" [nzPercent]="progressList[key]" nzStrokeColor="#1890FF"></nz-progress></div>
<div class="progress" *ngFor="let item of beforeEmergencyPlan.nodes;let key = index;" title="{{item.name}}"
[ngStyle]="{'flex': getProgressFlex(item)}">
<img src="../../../assets/images/stepIcon.png" nz-popconfirm nzPopconfirmTitle="切换节点后,没保存的信息将会丢失!"
[nzCondition]="!editMode" (nzOnConfirm)="changePlanNode(key)">
<div>
<nz-progress [nzShowInfo]="false" [nzPercent]="progressList[key]" nzStrokeColor="#1890FF"></nz-progress>
</div>
</div>
</ng-container>
</label>
<label>
<i nz-icon nzType="backward" nzTheme="outline" (click)="toLast()" title="上一个节点"></i>
<i nz-icon nzType="pause" nzTheme="outline" (click)="suspend(true)" [hidden]="isSuspend" title="暂停"></i>
<i nz-icon nzType="play-circle" nzTheme="outline" (click)="suspend(false)" [hidden]="!isSuspend" title="开启"></i>
<i nz-icon nzType="play-circle" nzTheme="outline" (click)="suspend(false)" [hidden]="!isSuspend"
title="开启"></i>
<i nz-icon nzType="reload" nzTheme="outline" (click)="initialize()" title="重播"></i>
<i nz-icon nzType="forward" nzTheme="outline" (click)="toNext()" title="下一个节点"></i>
</label>
@ -210,12 +293,14 @@
<!-- 底部处置预案 -->
<!-- 新增/编辑左侧建筑弹窗 -->
<nz-modal [(nzVisible)]="addBuildingPop || editBuildingPop" nzTitle="创建/编辑建筑" (nzOnCancel)="addBuildingPop = false; editBuildingPop = null;" (nzOnOk)="addModelBuilding(form.value)" [nzOkDisabled]='name.invalid||modelType.invalid'>
<nz-modal [(nzVisible)]="addBuildingPop || editBuildingPop" nzTitle="创建/编辑建筑"
(nzOnCancel)="addBuildingPop = false; editBuildingPop = null;" (nzOnOk)="addModelBuilding(form.value)"
[nzOkDisabled]='name.invalid||modelType.invalid'>
<form nz-form #form='ngForm'>
<nz-form-item>
<nz-form-label [nzSpan]="6">名称</nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请输入必填项">
<input nz-input #name='ngModel' [(ngModel)]="modelBuilding.name" name="name" required/>
<input nz-input #name='ngModel' [(ngModel)]="modelBuilding.name" name="name" required />
</nz-form-control>
</nz-form-item>
<nz-form-item>
@ -230,29 +315,36 @@
<nz-form-item>
<nz-form-label [nzSpan]="6">上传文件</nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请上传文件">
<a href="javascript:;" class="uploadBackGround"><input type="file" (change)='selectFile($event)' multiple>上传文件<i nz-icon nzType="cloud-upload" nzTheme="outline"></i></a>
<p *ngIf="uploadList.length" style="font-size: 14px; text-align: left; max-height: 500px; overflow: hidden;">选择文件: <label *ngFor="let item of uploadList">{{item.name}}, </label></p>
<a href="javascript:;" class="uploadBackGround"><input type="file" (change)='selectFile($event)'
multiple>上传文件<i nz-icon nzType="cloud-upload" nzTheme="outline"></i></a>
<p *ngIf="uploadList.length"
style="font-size: 14px; text-align: left; max-height: 500px; overflow: hidden;">选择文件: <label
*ngFor="let item of uploadList">{{item.name}}, </label></p>
</nz-form-control>
</nz-form-item>
</form>
</nz-modal>
<!-- 新增/编辑左侧建筑弹窗 -->
<!-- 应急预案设备任务弹窗 -->
<nz-modal nzClassName="taskDialog" [(nzVisible)]="contingencyPlanTask" nzTitle="设备任务栏" (nzOnCancel)="contingencyPlanTask = null;" (nzOnOk)="submitTaskForm(taskForm.value)" [nzOkDisabled]='companyName.invalid'>
<nz-modal nzClassName="taskDialog" [(nzVisible)]="contingencyPlanTask" nzTitle="设备任务栏"
(nzOnCancel)="contingencyPlanTask = null;" (nzOnOk)="submitTaskForm(taskForm.value)"
[nzOkDisabled]='companyName.invalid'>
<form nz-form #taskForm='ngForm'>
<nz-form-item>
<nz-form-label [nzSpan]="6">名称</nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请输入必填项">
<input nz-input #companyName='ngModel' [(ngModel)]="taskDialog.institution" name="companyName" required/>
<input nz-input #companyName='ngModel' [(ngModel)]="taskDialog.institution" name="companyName" required />
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="6">任务</nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请输入必填项">
<input nz-input #taskName='ngModel' [(ngModel)]="taskDialog.task" name="taskName" autocomplete="off" nz-dropdown [nzDropdownMenu]="taskList"/>
<input nz-input #taskName='ngModel' [(ngModel)]="taskDialog.task" name="taskName" autocomplete="off"
nz-dropdown [nzDropdownMenu]="taskList" />
<nz-dropdown-menu #taskList="nzDropdownMenu">
<ul nz-menu>
<li nz-menu-item *ngFor="let item of allTaskList" (click)="taskDialog.task = item.taskName;">{{item.taskName}}</li>
<li nz-menu-item *ngFor="let item of allTaskList" (click)="taskDialog.task = item.taskName;">
{{item.taskName}}</li>
</ul>
</nz-dropdown-menu>
</nz-form-control>
@ -260,7 +352,8 @@
<nz-form-item>
<nz-form-label [nzSpan]="6">备注</nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请输入必填项">
<textarea nz-input #description='ngModel' [(ngModel)]="taskDialog.description" name="description"></textarea>
<textarea nz-input #description='ngModel' [(ngModel)]="taskDialog.description"
name="description"></textarea>
</nz-form-control>
</nz-form-item>
<nz-form-item>
@ -273,8 +366,10 @@
</nz-modal>
<!-- 应急预案设备任务弹窗 -->
<!-- 全景图/视频弹窗 -->
<nz-modal nzClassName="videoDialog" [(nzVisible)]="videoDialogType.url" nzFooter="null" (nzOnCancel)="closePanorama()" nzWidth="90%">
<video [src]="videoDialogType.url" controls="controls" autoplay style="width: 100%; height: 100%;" *ngIf="videoDialogType.isVideo"></video>
<nz-modal nzClassName="videoDialog" [(nzVisible)]="videoDialogType.url" nzFooter="null"
(nzOnCancel)="closePanorama()" nzWidth="90%">
<video [src]="videoDialogType.url" controls="controls" autoplay style="width: 100%; height: 100%;"
*ngIf="videoDialogType.isVideo"></video>
<canvas id="panorama" [hidden]="videoDialogType.isVideo"></canvas>
</nz-modal>
<!-- 全景图/视频弹窗 -->

Loading…
Cancel
Save