Browse Source

[完善]格式化代码

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

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

@ -4,55 +4,77 @@
<!-- 基本信息 --> <!-- 基本信息 -->
<div class="publicBox baseInfo" *ngIf="beforeFence === 0 && baseInfo"> <div class="publicBox baseInfo" *ngIf="beforeFence === 0 && baseInfo">
<div class="interval"> <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="title">{{baseInfo.stationName || '暂无数据'}}<button class="titleBotton"><label
<p class="text"><img src="../../../assets/images/baseInfo/position.png" class="textIcon">{{baseInfo.address || '暂无数据'}}</p> *ngIf="baseInfo.stationType == 0">自营</label><label *ngIf="baseInfo.stationType == 1">加盟</label><label
<p class="text"><img src="../../../assets/images/baseInfo/building.png" class="textIcon">{{baseInfo.locationName || '暂无数据'}}</p> *ngIf="baseInfo.stationType != 0 && baseInfo.stationType != 1">其他</label></button></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/position.png" class="textIcon">{{baseInfo.address ||
<p class="text"><img src="../../../assets/images/baseInfo/road.png" class="textIcon">{{baseInfo.laneCount || '0'}} 车道</p> '暂无数据'}}</p>
<p class="text">公司名称: {{baseInfo.companyName || '暂无数据'}}</p> <p class="text"><img src="../../../assets/images/baseInfo/building.png" class="textIcon">{{baseInfo.locationName
<p class="text">联系人: {{baseInfo.leaderName || '暂无数据'}}</p> || '暂无数据'}}</p>
<p class="text">联系电话: {{baseInfo.leaderContact || '暂无数据'}}</p> <p class="text"><img src="../../../assets/images/baseInfo/date.png" class="textIcon">{{baseInfo.openTime |
<p class="text">油站等级: {{baseInfo.stationLevel || '暂无数据'}}</p> date:"yyyy/MM/dd" || ''}} 开业</p>
<p class="text">经营品种: {{baseInfo.sellVariety || '暂无数据'}}</p> <p class="text"><img src="../../../assets/images/baseInfo/road.png" class="textIcon">{{baseInfo.laneCount ||
<p class="text">油机数量: {{baseInfo.gasStationCount || '暂无数据'}}</p> '0'}} 车道</p>
<p class="text">油罐容积: {{baseInfo.tankVolume || '暂无数据'}}</p> <p class="text">公司名称: {{baseInfo.companyName || '暂无数据'}}</p>
<p class="text">联系人: {{baseInfo.leaderName || '暂无数据'}}</p>
<p class="text">联系电话: {{baseInfo.leaderContact || '暂无数据'}}</p>
<p class="text">油站等级: {{baseInfo.stationLevel || '暂无数据'}}</p>
<p class="text">经营品种: {{baseInfo.sellVariety || '暂无数据'}}</p>
<p class="text">油机数量: {{baseInfo.gasStationCount || '暂无数据'}}</p>
<p class="text">油罐容积: {{baseInfo.tankVolume || '暂无数据'}}</p>
</div> </div>
<div class="interval" *ngIf="baseInfo.govUnitDetail && baseInfo.govUnitDetail.policeStation"> <div class="interval" *ngIf="baseInfo.govUnitDetail && baseInfo.govUnitDetail.policeStation">
<p class="title">辖区派出所</p> <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/police.png"
<p class="text"><img src="../../../assets/images/baseInfo/position.png" class="textIcon">{{baseInfo.govUnitDetail.policeStation.address || '暂无数据'}}</p> class="textIcon">{{baseInfo.govUnitDetail.policeStation.name || '暂无数据'}}</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/position.png"
<p class="text"><img src="../../../assets/images/baseInfo/road.png" class="textIcon">{{baseInfo.govUnitDetail.policeStation.distance || '0公里'}}</p> 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>
<div class="interval" *ngIf="baseInfo.govUnitDetail && baseInfo.govUnitDetail.hospital"> <div class="interval" *ngIf="baseInfo.govUnitDetail && baseInfo.govUnitDetail.hospital">
<p class="title">辖区医院</p> <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/hospital.png"
<p class="text"><img src="../../../assets/images/baseInfo/position.png" class="textIcon">{{baseInfo.govUnitDetail.hospital.address || '暂无数据'}}</p> class="textIcon">{{baseInfo.govUnitDetail.hospital.name || '暂无数据'}}</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/position.png"
<p class="text"><img src="../../../assets/images/baseInfo/road.png" class="textIcon">{{baseInfo.govUnitDetail.hospital.distance || '0公里'}}</p> 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>
<div class="interval" *ngIf="baseInfo.govUnitDetail && baseInfo.govUnitDetail.fireBrigade"> <div class="interval" *ngIf="baseInfo.govUnitDetail && baseInfo.govUnitDetail.fireBrigade">
<p class="title">辖区消防队</p> <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/police.png"
<p class="text"><img src="../../../assets/images/baseInfo/position.png" class="textIcon">{{baseInfo.govUnitDetail.fireBrigade.address || '暂无数据'}}</p> class="textIcon">{{baseInfo.govUnitDetail.fireBrigade.name || '暂无数据'}}</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/position.png"
<p class="text"><img src="../../../assets/images/baseInfo/road.png" class="textIcon">{{baseInfo.govUnitDetail.fireBrigade.distance || '0公里'}}</p> 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>
<div class="interval baseInfoImg" *ngIf="baseInfo.businessLicenseImage"> <div class="interval baseInfoImg" *ngIf="baseInfo.businessLicenseImage">
<p class="title">营业执照</p> <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="text">提前预警时间天数: {{baseInfo.validityTermDays}}天</p>
<p class="textImage"><img [src]="baseInfo.businessLicenseImage"></p> <p class="textImage"><img [src]="baseInfo.businessLicenseImage"></p>
</div> </div>
<div class="interval baseInfoImg" *ngIf="baseInfo.dangerousChemicalLicenseImage"> <div class="interval baseInfoImg" *ngIf="baseInfo.dangerousChemicalLicenseImage">
<p class="title">危险化学品经营许可证</p> <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="text">提前预警时间天数: {{baseInfo.dangerousTermDays}}天</p>
<p class="textImage"><img [src]="baseInfo.dangerousChemicalLicenseImage"></p> <p class="textImage"><img [src]="baseInfo.dangerousChemicalLicenseImage"></p>
</div> </div>
<div class="interval baseInfoImg" *ngIf="baseInfo.gasSellLicenseImage"> <div class="interval baseInfoImg" *ngIf="baseInfo.gasSellLicenseImage">
<p class="title">成品油零售经营许可证</p> <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="text">提前预警时间天数: {{baseInfo.sellLicenseTermDays}}天</p>
<p class="textImage"><img [src]="baseInfo.gasSellLicenseImage"></p> <p class="textImage"><img [src]="baseInfo.gasSellLicenseImage"></p>
</div> </div>
@ -60,8 +82,10 @@
<!-- 基本信息 --> <!-- 基本信息 -->
<!-- 加油机 --> <!-- 加油机 -->
<div class="publicBox refueller" *ngIf="beforeFence === 1"> <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()}"> <div class="interval" *ngFor="let item of FacilityList | facilitySort" (click)="selectFacility($event, item)"
<p class="title"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().name" (click)="stopBubbling($event)"></p> [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="table">
<div class="tableHeader"> <div class="tableHeader">
<p>品牌</p> <p>品牌</p>
@ -69,11 +93,18 @@
<p>油品品号</p> <p>油品品号</p>
<p class="overflowP" id="title{{item.modelInfo.key}}">油枪编号</p> <p class="overflowP" id="title{{item.modelInfo.key}}">油枪编号</p>
</div> </div>
<div class="tableContent"> <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().brand"><input type="text" class="tableInput" [disabled]="!editMode"
<p [title]="item.getPropertyData().oilGunNum"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().oilGunNum" (click)="stopBubbling($event)"></p> [(ngModel)]="item.getPropertyData().brand" (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().oilGunNum"><input type="text" class="tableInput" [disabled]="!editMode"
<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> [(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> </div>
</div> </div>
@ -81,8 +112,10 @@
<!-- 加油机 --> <!-- 加油机 -->
<!-- 油罐设备 --> <!-- 油罐设备 -->
<div class="publicBox refueller" *ngIf="beforeFence === 2"> <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()}"> <div class="interval" *ngFor="let item of FacilityList | facilitySort" (click)="selectFacility($event, item)"
<p class="title"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().name" (click)="stopBubbling($event)"></p> [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="table">
<div class="tableHeader"> <div class="tableHeader">
<p>油品品号</p> <p>油品品号</p>
@ -93,18 +126,28 @@
<p>油泵类型</p> <p>油泵类型</p>
</div> </div>
<div class="tableContent"> <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().oilProductNo"><input type="text" class="tableInput"
<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> [disabled]="!editMode" [(ngModel)]="item.getPropertyData().oilProductNo" (click)="stopBubbling($event)">
<p [title]="item.getPropertyData().oilTankVolume"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().oilTankVolume" (click)="stopBubbling($event)"></p> </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().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)"> <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-option nzValue="单层罐+防渗罐池" nzLabel="单层罐+防渗罐池"></nz-option> <nz-option nzValue="单层罐+防渗罐池" nzLabel="单层罐+防渗罐池"></nz-option>
</nz-select> </nz-select>
</p> </p>
<p style="padding-left: 8px;" (click)="stopBubbling($event)"> <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-option nzValue="潜油泵" nzLabel="潜油泵"></nz-option> <nz-option nzValue="潜油泵" nzLabel="潜油泵"></nz-option>
</nz-select> </nz-select>
@ -118,40 +161,54 @@
<div class="publicBox fireFacilities" *ngIf="beforeFence === 3"> <div class="publicBox fireFacilities" *ngIf="beforeFence === 3">
<nz-tree [nzData]="treeData" [nzTreeTemplate]="nzTreeTemplate" (nzClick)="nzClick($event)"></nz-tree> <nz-tree [nzData]="treeData" [nzTreeTemplate]="nzTreeTemplate" (nzClick)="nzClick($event)"></nz-tree>
<ng-template #nzTreeTemplate let-node let-origin="origin"> <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> </ng-template>
</div> </div>
<!-- 消防设施 --> <!-- 消防设施 -->
<!-- 输油管线 --> <!-- 输油管线 -->
<div class="publicBox refueller" *ngIf="beforeFence === 5"> <div class="publicBox refueller" *ngIf="beforeFence === 5">
<div class="interval" *ngFor="let item of FacilityList" (click)="selectFacility($event, item)" [ngClass]="{'selectFacility': selectFacilityId === item.getID()}"> <div class="interval" *ngFor="let item of FacilityList" (click)="selectFacility($event, item)"
<p class="title"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().name" (click)="stopBubbling($event)"></p> [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="table">
<div class="tableHeader" style="flex: 50%;"> <div class="tableHeader" style="flex: 50%;">
<p>连接的加油机</p> <p>连接的加油机</p>
<p>连接的油罐</p> <p>连接的油罐</p>
</div> </div>
<div class="tableContent" style="flex: 50%;"> <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().linkJYJ"><input type="text" class="tableInput" [disabled]="!editMode"
<p [title]="item.getPropertyData().linkYG"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().linkYG" (click)="stopBubbling($event)"></p> [(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> </div>
<div class="propertyImage" id="pipelineViewer{{item.getID()}}"> <div class="propertyImage" id="pipelineViewer{{item.getID()}}">
<p class="imgTitle">设计图纸</p> <p class="imgTitle">设计图纸</p>
<img [hidden]="!item.getPropertyData().img" [src]="item.getPropertyData().img" [attr.data-original]="item.getPropertyData().img"> <img [hidden]="!item.getPropertyData().img" [src]="item.getPropertyData().img"
<div class="positionHandleImgVideo" style="width: 120px;" *ngIf="editMode && item.getPropertyData().img" (click)="stopBubbling($event)"> [attr.data-original]="item.getPropertyData().img">
<a href="javascript:;" class="imgAndVideoUpload"><input type="file" accept="image/*" (change)='uploadLeftDomainImg($event, item)'><i nz-icon nzType="upload" nzTheme="outline"></i></a> <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> <i nz-icon nzType="delete" nzTheme="outline" (click)="deleteImg(item)"></i>
</div> </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>
</div> </div>
<!-- 输油管线 --> <!-- 输油管线 -->
<!-- 油气回收 --> <!-- 油气回收 -->
<div class="publicBox refueller" *ngIf="beforeFence === 6"> <div class="publicBox refueller" *ngIf="beforeFence === 6">
<div class="interval" *ngFor="let item of FacilityList" (click)="selectFacility($event, item)" [ngClass]="{'selectFacility': selectFacilityId === item.getID()}"> <div class="interval" *ngFor="let item of FacilityList" (click)="selectFacility($event, item)"
<p class="title"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().name" (click)="stopBubbling($event)"></p> [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="table">
<div class="tableHeader orvrTableHeader" style="flex: 58%;"> <div class="tableHeader orvrTableHeader" style="flex: 58%;">
<p class="overflowP" id="orvrTitle{{item.modelInfo.key}}">一次油气回收系统类型</p> <p class="overflowP" id="orvrTitle{{item.modelInfo.key}}">一次油气回收系统类型</p>
@ -161,26 +218,41 @@
<p class="overflowP" id="title{{item.modelInfo.key}}">油气回收在线监测装置</p> <p class="overflowP" id="title{{item.modelInfo.key}}">油气回收在线监测装置</p>
</div> </div>
<div class="tableContent orvrTableContent" style="flex: 42%;"> <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)"> <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-option nzValue="集中式" nzLabel="集中式"></nz-option> <nz-option nzValue="集中式" nzLabel="集中式"></nz-option>
</nz-select> </nz-select>
</p> </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().VRUPumpType"><input type="text" class="tableInput" [disabled]="!editMode"
<p [title]="item.getPropertyData().VRUPumpDevice"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().VRUPumpDevice" (click)="stopBubbling($event)"></p> [(ngModel)]="item.getPropertyData().VRUPumpType" (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().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> </div>
<div class="propertyImage" id="orvrViewer{{item.getID()}}"> <div class="propertyImage" id="orvrViewer{{item.getID()}}">
<p class="imgTitle">设计图纸</p> <p class="imgTitle">设计图纸</p>
<img [hidden]="!item.getPropertyData().img" [src]="item.getPropertyData().img" [attr.data-original]="item.getPropertyData().img"> <img [hidden]="!item.getPropertyData().img" [src]="item.getPropertyData().img"
<div class="positionHandleImgVideo" style="width: 120px;" *ngIf="editMode && item.getPropertyData().img" (click)="stopBubbling($event)"> [attr.data-original]="item.getPropertyData().img">
<a href="javascript:;" class="imgAndVideoUpload"><input type="file" accept="image/*" (change)='uploadLeftDomainImg($event, item)'><i nz-icon nzType="upload" nzTheme="outline"></i></a> <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> <i nz-icon nzType="delete" nzTheme="outline" (click)="deleteImg(item)"></i>
</div> </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>
</div> </div>
@ -188,7 +260,8 @@
<!-- 处置预案 --> <!-- 处置预案 -->
<div class="publicBox disposalPlan" *ngIf="beforeFence === 8 && allMarkPlanData" id="disposalPlan"> <div class="publicBox disposalPlan" *ngIf="beforeFence === 8 && allMarkPlanData" id="disposalPlan">
<nz-collapse> <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> <ng-template #extraTpl>
<div class="publicDisposal disposalHeader"> <div class="publicDisposal disposalHeader">
<span>{{item.name}}</span> <span>{{item.name}}</span>
@ -201,8 +274,12 @@
</ng-template> </ng-template>
<ul> <ul>
<li class="publicDisposal disposalContent" *ngFor="let items of item.nodes;let keys = index;"> <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> <span nz-popconfirm nzPopconfirmTitle="切换节点后,没保存的信息将会丢失!" [nzCondition]="!editMode"
<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> (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> </li>
</ul> </ul>
</nz-collapse-panel> </nz-collapse-panel>
@ -211,29 +288,36 @@
<!-- 处置预案 --> <!-- 处置预案 -->
<!-- 阀门 --> <!-- 阀门 -->
<div class="publicBox refueller" *ngIf="beforeFence === 7"> <div class="publicBox refueller" *ngIf="beforeFence === 7">
<div class="interval" *ngFor="let item of FacilityList" (click)="selectFacility($event, item)" [ngClass]="{'selectFacility': selectFacilityId === item.getID()}"> <div class="interval" *ngFor="let item of FacilityList" (click)="selectFacility($event, item)"
<p class="title"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().name" (click)="stopBubbling($event)"></p> [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="table">
<div class="tableHeader"> <div class="tableHeader">
<p class="overflowP" id="title{{item.modelInfo.key}}" style="text-align: center; padding: 0;">描述</p> <p class="overflowP" id="title{{item.modelInfo.key}}" style="text-align: center; padding: 0;">描述</p>
</div> </div>
<div class="tableContent"> <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>
</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> <app-oil-station-info *ngIf="isShowBaseDialog"></app-oil-station-info>
</nz-modal> </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'> <form nz-form #form='ngForm'>
<nz-form-item> <nz-form-item>
<nz-form-label [nzSpan]="6">预案/节点名称</nz-form-label> <nz-form-label [nzSpan]="6">预案/节点名称</nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请输入必填项"> <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-control>
</nz-form-item> </nz-form-item>
<nz-form-item *ngIf="addDisposalPop"> <nz-form-item *ngIf="addDisposalPop">
@ -253,7 +337,7 @@
<nz-form-item> <nz-form-item>
<nz-form-label [nzSpan]="6">预案名称</nz-form-label> <nz-form-label [nzSpan]="6">预案名称</nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请输入必填项"> <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-control>
</nz-form-item> </nz-form-item>
</form> </form>
@ -263,23 +347,25 @@
<button nz-button nzType="primary" (click)="editDisposal(editForm.value)">确定</button> <button nz-button nzType="primary" (click)="editDisposal(editForm.value)">确定</button>
</div> </div>
</nz-modal> </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"> <div class="submitBottom">
<button (click)='saveNode(true)'>新建节点并保存</button><button (click)='saveNode(false)'>保存到已有节点</button> <button (click)='saveNode(true)'>新建节点并保存</button><button (click)='saveNode(false)'>保存到已有节点</button>
</div> </div>
</nz-modal> </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'> <form nz-form #saveForm='ngForm'>
<nz-form-item *ngIf="saveType === 1"> <nz-form-item *ngIf="saveType === 1">
<nz-form-label [nzSpan]="6">节点名称<span style="color: red;">*</span></nz-form-label> <nz-form-label [nzSpan]="6">节点名称<span style="color: red;">*</span></nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请输入必填项"> <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-control>
</nz-form-item> </nz-form-item>
<nz-form-item *ngIf="saveType === 1"> <nz-form-item *ngIf="saveType === 1">
<nz-form-label [nzSpan]="6"><span></span>节点</nz-form-label> <nz-form-label [nzSpan]="6"><span></span>节点</nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请选择节点"> <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-option *ngFor="let item of allNodeList" [nzValue]="item" [nzLabel]="item.name"></nz-option>
</nz-select> </nz-select>
</nz-form-control> </nz-form-control>
@ -287,7 +373,7 @@
<nz-form-item *ngIf="saveType === 2"> <nz-form-item *ngIf="saveType === 2">
<nz-form-label [nzSpan]="6">节点</nz-form-label> <nz-form-label [nzSpan]="6">节点</nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请选择节点"> <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-option *ngFor="let item of allNodeList" [nzValue]="item" [nzLabel]="item.name"></nz-option>
</nz-select> </nz-select>
</nz-form-control> </nz-form-control>
@ -302,4 +388,4 @@
<button (click)="deriveExcel()"><i nz-icon nzType="file-excel" nzTheme="outline"></i>导出Excel</button> <button (click)="deriveExcel()"><i nz-icon nzType="file-excel" nzTheme="outline"></i>导出Excel</button>
</div> </div>
</div> </div>

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="content" id="threeDimensional">
<div class="header"> <div class="header">
<button *ngFor="let item of allFence; let key = index;" [ngClass]="{'selectFence': selectFence === key}" (click)="toggleHeaderFence(key)"> <button *ngFor="let item of allFence; let key = index;" [ngClass]="{'selectFence': selectFence === key}"
<label nz-dropdown [nzDropdownMenu]="menu" [nzDisabled]="item != '基本信息' || selectFence != 0">{{item}}<i nz-icon nzType="caret-up" nzTheme="outline" *ngIf="key === 0"></i></label> (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> </button>
<nz-dropdown-menu #menu="nzDropdownMenu"> <nz-dropdown-menu #menu="nzDropdownMenu">
<ul nz-menu class="dropDown"> <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> </ul>
</nz-dropdown-menu> </nz-dropdown-menu>
<div class="rightFence"> <div class="rightFence">
<img src="../../../assets/images/awningShow.png" [hidden]="!isOpenAwning" (click)="toggleHeaderAwning(false)"> <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/awningHide.png" [hidden]="isOpenAwning" (click)="toggleHeaderAwning(true)">
<img src="../../../assets/images/rangeFinding.png" title="测量距离" [hidden]="selectMeasure === 1" (click)="toggleMeasure(1)"> <img src="../../../assets/images/rangeFinding.png" title="测量距离" [hidden]="selectMeasure === 1"
<img src="../../../assets/images/selectRangeFinding.png" title="测量距离" [hidden]="selectMeasure != 1" (click)="toggleMeasure(1)"> (click)="toggleMeasure(1)">
<img src="../../../assets/images/heightFinding.png" title="测量高度" [hidden]="selectMeasure === 2" (click)="toggleMeasure(2)"> <img src="../../../assets/images/selectRangeFinding.png" title="测量距离" [hidden]="selectMeasure != 1"
<img src="../../../assets/images/selectHeightFinding.png" title="测量高度" [hidden]="selectMeasure != 2" (click)="toggleMeasure(2)"> (click)="toggleMeasure(1)">
<img src="../../../assets/images/measuredArea.png" title="测量面积" [hidden]="selectMeasure === 3" (click)="toggleMeasure(3)"> <img src="../../../assets/images/heightFinding.png" title="测量高度" [hidden]="selectMeasure === 2"
<img src="../../../assets/images/selectMeasuredArea.png" title="测量面积" [hidden]="selectMeasure != 3" (click)="toggleMeasure(3)"> (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"> <img src="../../../assets/images/save3DPlan.png" title="保存" (click)="preserve(true)" *ngIf="editMode">
</div> </div>
</div> </div>
@ -27,30 +39,43 @@
<canvas id="center"></canvas> <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 class="leftChildHeader">
<div><i nz-icon nzType="star" nzTheme="outline"></i></div> <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>{{allFence[selectFence]}}<i nz-icon nzType="plus-circle" nzTheme="outline"
<div (click)="toggleHeaderFence(selectFence)" title="关闭"><i nz-icon nzType="close-circle" nzTheme="outline"></i></div> *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>
<div class="leftChildCenter"><app-left-domain #leftDomain></app-left-domain></div>
</div> </div>
<!-- 左侧子组件 --> <!-- 左侧子组件 -->
<!-- 左侧建筑栏 --> <!-- 左侧建筑栏 -->
<div class="showLeftBuilding" title="显示" *ngIf="!isShowLeftBuilding && editMode && userMode" (click)="toggleLeftBuilding(true)"><i nz-icon nzType="right" nzTheme="outline"></i></div> <div class="showLeftBuilding" title="显示" *ngIf="!isShowLeftBuilding && editMode && userMode"
<div class="leftBuilding" *ngIf="editMode && userMode" [ngClass]="{'isShowLeftBuilding': isShowLeftBuilding === false, 'publicMoveUp': selectFence === 8}"> (click)="toggleLeftBuilding(true)"><i nz-icon nzType="right" nzTheme="outline"></i></div>
<div class="hideLeft"><i nz-icon nzType="close" nzTheme="outline" title="隐藏" (click)="toggleLeftBuilding(false)"></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"> <div class="leftHeader">
<h1><label>模型列表</label></h1> <h1><label>模型列表</label></h1>
<button nz-button nzType="primary" (click)="addBuildingPop = true">新建</button> <button nz-button nzType="primary" (click)="addBuildingPop = true">新建</button>
</div> </div>
<div class="leftCenter"> <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="flex: 1;" class="overflowText modelTitle">{{item.getBuildingName()}}</label>
<label style="width: 65px; overflow: hidden;"> <label style="width: 65px; overflow: hidden;">
<i nz-icon nzType="plus-circle" nzTheme="outline" title="聚焦" (click)="positionModelBuilding($event,item)"></i> <i nz-icon nzType="plus-circle" nzTheme="outline" title="聚焦"
<i nz-icon nzType="edit" nzTheme="outline" title="编辑" (click)="editModelBuilding($event,item)" style="margin: 0 5px;"></i> (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> <i nz-icon nzType="delete" nzTheme="outline" title="删除" (click)="deleteModelBuilding($event,item)"></i>
</label> </label>
</div> </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 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>
<!-- 油罐罐区总览 --> <!-- 油罐罐区总览 -->
<div class="nature" *ngIf="isShowNature && selectFence === 0 && beforeOnePropertyData && beforeOnePropertyData.getPropertyData()" [ngStyle]="{'right': editMode? '5%' : null}"> <div class="nature"
<div class="natureHeader"><i nz-icon nzType="close-circle" nzTheme="outline" title="关闭" (click)="isShowNature = false;"></i></div> *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="natureContent" *ngIf="beforeOnePropertyData.getPropertyData().textDirection != undefined">
<div class="natureTitle">方向</div> <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>
<div class="natureContent" *ngIf="beforeOnePropertyData.getPropertyData().info != undefined"> <div class="natureContent" *ngIf="beforeOnePropertyData.getPropertyData().info != undefined">
<div class="natureTitle">详情</div> <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>
<div class="natureContent" *ngIf="beforeOnePropertyData.getPropertyData().img != undefined" id="propertyImg"> <div class="natureContent" *ngIf="beforeOnePropertyData.getPropertyData().img != undefined" id="propertyImg">
<div class="natureTitle">图片</div> <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"> <div class="natureImg" *ngIf="beforeOnePropertyData.getPropertyData().img">
<img [src]="beforeOnePropertyData.getPropertyData().img" [attr.data-original]="beforeOnePropertyData.getPropertyData().img" (click)="lookPanorama()"> <img [src]="beforeOnePropertyData.getPropertyData().img"
<div class="positionHandleImgVideo" style="width: 120px;" *ngIf="editMode && beforeOnePropertyData.getPropertyData().img"> [attr.data-original]="beforeOnePropertyData.getPropertyData().img" (click)="lookPanorama()">
<a href="javascript:;" class="imgAndVideoUpload"><input type="file" accept="image/*" (change)='uploadPropertyImg($event)'><i nz-icon nzType="upload" nzTheme="outline"></i></a> <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> <i nz-icon nzType="delete" nzTheme="outline" (click)="deleteImgVideo(1)"></i>
</div> </div>
</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> </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 *ngIf="selectFence === 1" class="naturePosition">
<div class="positionLeftTop"></div><div class="positionLeftBottom"></div><div class="positionRightTop"></div><div class="positionRightBottom"></div> <div class="positionLeftTop"></div>
<div class="natureTitle"><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().name" [disabled]="!editMode"></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 class="flowPower">
<div> <div>
<img src="../../../assets/images/flow.png"> <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>
<div> <div>
<img src="../../../assets/images/power.png"> <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> </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"
<div class="everyNature"><span>油枪数量 :</span><label><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().oilGunNum" [disabled]="!editMode"></label></div> [(ngModel)]="beforeOnePropertyData.getPropertyData().brand" [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().oilGunNum" [disabled]="!editMode"></label></div>
<div class="everyNature"><span>油品品号 :</span><label><input type="text"
[(ngModel)]="beforeOnePropertyData.getPropertyData().oilProductNo" [disabled]="!editMode"></label></div>
</div> </div>
<div *ngIf="selectFence === 2" class="naturePosition"> <div *ngIf="selectFence === 2" class="naturePosition">
<div class="positionLeftTop"></div><div class="positionLeftBottom"></div><div class="positionRightTop"></div><div class="positionRightBottom"></div> <div class="positionLeftTop"></div>
<div class="natureTitle"><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().name" [disabled]="!editMode"></div> <div class="positionLeftBottom"></div>
<div class="everyNature"><span>油品品号 :</span><label><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().oilProductNo" [disabled]="!editMode"></label></div> <div class="positionRightTop"></div>
<div class="everyNature"><span>油罐容积 :</span><label><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().oilTankVolume" [disabled]="!editMode"></label></div> <div class="positionRightBottom"></div>
<div class="everyNature"><span>安全容积 :</span><label><input type="text" [(ngModel)]="beforeOnePropertyData.getPropertyData().safeVolume" [disabled]="!editMode"></label></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> </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"> <div class="bottomCenter" id="bottomCenter">
<ng-container *ngIf="selectFence === 0"> <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()"> <img [src]="item.getIconURL()">
<p>{{item.getIconName()}}</p> <p>{{item.getIconName()}}</p>
</div> </div>
</ng-container> </ng-container>
<ng-container *ngIf="selectFence === 8"> <ng-container *ngIf="selectFence === 8">
<nz-collapse [nzBordered]="false"> <nz-collapse [nzBordered]="false">
<nz-collapse-panel [nzHeader]="allMarkData.iconsName[key]" [nzActive]="true" *ngFor="let element of allMarkData.icons; let key = index;"> <nz-collapse-panel [nzHeader]="allMarkData.iconsName[key]" [nzActive]="true"
<div class="everyIcon" (click)='selectBottomIcon(item)' *ngFor="let item of element" [ngClass]="{'selectLeftIcon': beforeOneIcon == item.key}"> *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"> <img [src]="item.iconURL">
<p>{{item.name}}</p> <p>{{item.name}}</p>
</div> </div>
@ -163,45 +230,61 @@
<div class="pulicPlanDiv bottomPlanHeader"> <div class="pulicPlanDiv bottomPlanHeader">
<div class="planHeaderText"> <div class="planHeaderText">
<p><input type="text" [(ngModel)]="beforePlanNode.name" [disabled]="!editMode"></p> <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>
<div class="planHeaderImg" id="planNodeImg"> <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"> <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> <i nz-icon nzType="delete" nzTheme="outline" (click)="deleteImgVideo(2)"></i>
</div> </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>
<div class="planHeaderVideo"> <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"> <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> <i nz-icon nzType="delete" nzTheme="outline" (click)="deleteImgVideo(3)"></i>
</div> </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> </div>
<div style="height: 5px;"></div> <div style="height: 5px;"></div>
<div class="pulicPlanDiv bottomPlanCenter"> <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"> <nz-dropdown-menu #plan="nzDropdownMenu">
<ul nz-menu class="dropDown dropDownPlan" *ngIf="allMarkPlanData"> <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> </ul>
</nz-dropdown-menu> </nz-dropdown-menu>
<label> <label>
<ng-container *ngIf="beforeEmergencyPlan.nodes && beforeEmergencyPlan.nodes.length"> <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)}"> <div class="progress" *ngFor="let item of beforeEmergencyPlan.nodes;let key = index;" title="{{item.name}}"
<img src="../../../assets/images/stepIcon.png" nz-popconfirm nzPopconfirmTitle="切换节点后,没保存的信息将会丢失!" [nzCondition]="!editMode" (nzOnConfirm)="changePlanNode(key)"> [ngStyle]="{'flex': getProgressFlex(item)}">
<div><nz-progress [nzShowInfo]="false" [nzPercent]="progressList[key]" nzStrokeColor="#1890FF"></nz-progress></div> <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> </div>
</ng-container> </ng-container>
</label> </label>
<label> <label>
<i nz-icon nzType="backward" nzTheme="outline" (click)="toLast()" title="上一个节点"></i> <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="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="reload" nzTheme="outline" (click)="initialize()" title="重播"></i>
<i nz-icon nzType="forward" nzTheme="outline" (click)="toNext()" title="下一个节点"></i> <i nz-icon nzType="forward" nzTheme="outline" (click)="toNext()" title="下一个节点"></i>
</label> </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'> <form nz-form #form='ngForm'>
<nz-form-item> <nz-form-item>
<nz-form-label [nzSpan]="6">名称</nz-form-label> <nz-form-label [nzSpan]="6">名称</nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请输入必填项"> <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-control>
</nz-form-item> </nz-form-item>
<nz-form-item> <nz-form-item>
@ -230,29 +315,36 @@
<nz-form-item> <nz-form-item>
<nz-form-label [nzSpan]="6">上传文件</nz-form-label> <nz-form-label [nzSpan]="6">上传文件</nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请上传文件"> <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> <a href="javascript:;" class="uploadBackGround"><input type="file" (change)='selectFile($event)'
<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> 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-control>
</nz-form-item> </nz-form-item>
</form> </form>
</nz-modal> </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'> <form nz-form #taskForm='ngForm'>
<nz-form-item> <nz-form-item>
<nz-form-label [nzSpan]="6">名称</nz-form-label> <nz-form-label [nzSpan]="6">名称</nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请输入必填项"> <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-control>
</nz-form-item> </nz-form-item>
<nz-form-item> <nz-form-item>
<nz-form-label [nzSpan]="6">任务</nz-form-label> <nz-form-label [nzSpan]="6">任务</nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请输入必填项"> <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"> <nz-dropdown-menu #taskList="nzDropdownMenu">
<ul nz-menu> <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> </ul>
</nz-dropdown-menu> </nz-dropdown-menu>
</nz-form-control> </nz-form-control>
@ -260,7 +352,8 @@
<nz-form-item> <nz-form-item>
<nz-form-label [nzSpan]="6">备注</nz-form-label> <nz-form-label [nzSpan]="6">备注</nz-form-label>
<nz-form-control [nzSpan]="18" nzErrorTip="请输入必填项"> <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-control>
</nz-form-item> </nz-form-item>
<nz-form-item> <nz-form-item>
@ -273,8 +366,10 @@
</nz-modal> </nz-modal>
<!-- 应急预案设备任务弹窗 --> <!-- 应急预案设备任务弹窗 -->
<!-- 全景图/视频弹窗 --> <!-- 全景图/视频弹窗 -->
<nz-modal nzClassName="videoDialog" [(nzVisible)]="videoDialogType.url" nzFooter="null" (nzOnCancel)="closePanorama()" nzWidth="90%"> <nz-modal nzClassName="videoDialog" [(nzVisible)]="videoDialogType.url" nzFooter="null"
<video [src]="videoDialogType.url" controls="controls" autoplay style="width: 100%; height: 100%;" *ngIf="videoDialogType.isVideo"></video> (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> <canvas id="panorama" [hidden]="videoDialogType.isVideo"></canvas>
</nz-modal> </nz-modal>
<!-- 全景图/视频弹窗 --> <!-- 全景图/视频弹窗 -->

Loading…
Cancel
Save