进度条修改

src/app/pages/left-domain/left-domain.component.ts

@@ -210,6 +210,9 @@ export class LeftDomainComponent implements OnInit {
   //选中 数据节点
   selectNode(item: MarkPlanData, e: MarkNodeData, index: number) {
     if (this.selectPlanId != item.id || this.selectNodeId != e.id) { //选中
+      if (PlanComponent.instance.progressList.length != item.nodes.length) {
+        PlanComponent.instance.updateProgressList()
+      }
       this.updateFatherData(index) //更新/初始化父组件 数据
       this.selectPlanId = item.id
       this.selectNodeId = e.id
@@ -228,6 +231,7 @@ export class LeftDomainComponent implements OnInit {
 
   //更新/初始化父组件 数据
   updateFatherData(index) {
+    PlanComponent.instance.progressList.forEach((item,key)=>{ key >= index? PlanComponent.instance.progressList[key] = 0 : PlanComponent.instance.progressList[key] = 100 })
     PlanComponent.instance.nzCurrent = index
     PlanComponent.instance.isSuspend = true //暂停
     PlanComponent.instance.updateTimer? window.clearTimeout(PlanComponent.instance.updateTimer) : null //清除定时器

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

@@ -26,7 +26,7 @@
     <canvas id="center"></canvas>
 
     <!-- 左侧子组件 -->
-    <div class="leftChildComponent" *ngIf="isShowChildComponent && selectFence != 4" [ngStyle]="{ 'left': isShowLeftBuilding && editMode && userMode? '15%' : null }" [ngClass]="{'publicMoveUp': selectFence === 7}">
+    <div class="leftChildComponent" *ngIf="editMode && isShowChildComponent && selectFence != 4" [ngStyle]="{ 'left': isShowLeftBuilding && editMode && userMode? '15%' : null }" [ngClass]="{'publicMoveUp': selectFence === 7}">
       <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 === 7 && editMode" (click)="noticeChildComponent(true)"></i><i nz-icon nzType="save" nzTheme="outline" *ngIf="selectFence === 7 && editMode" (click)="noticeChildComponent(false)"></i></div>
@@ -160,7 +160,7 @@
         <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" (click)="changePlanNode(key)">
+              <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>
@@ -234,7 +234,9 @@
     </nz-modal>
     <!-- 应急预案设备任务弹窗 -->
     <!-- 全景图/视频弹窗 -->
-    <nz-modal [(nzVisible)]="videoDialogType.url" (nzOnCancel)="videoDialogType.url = null;">
+    <nz-modal nzClassName="videoDialog" [(nzVisible)]="videoDialogType.url" nzFooter="null" (nzOnCancel)="videoDialogType.url = null;" nzWidth="90%">
+      <video [src]="videoDialogType.url" style="width: 100%; height: 100%;" [hidden]="!videoDialogType.isVideo"></video>
+      <canvas id="panorama" [hidden]="videoDialogType.isVideo"></canvas>
     </nz-modal>
     <!-- 全景图/视频弹窗 -->
   </div>

src/app/pages/plan/plan.component.ts

@@ -354,8 +354,8 @@ export class PlanComponent implements OnInit {
   publicToggleNode() {
     return new Promise((resolve, reject) => {
       this.beforePlanNode = this.beforeEmergencyPlan.nodes[this.nzCurrent]
-      this.leftDomain.selectPlanId = this.beforeEmergencyPlan.id
-      this.leftDomain.selectNodeId = this.beforePlanNode.id
+      this.isShowChildComponent && this.leftDomain? this.leftDomain.selectPlanId = this.beforeEmergencyPlan.id : null
+      this.isShowChildComponent && this.leftDomain? this.leftDomain.selectNodeId = this.beforePlanNode.id : null
       MarkWindow.instance.selectMarkNode(this.beforeEmergencyPlan.id, this.beforePlanNode.id, false, true)
       this.beforePlanNode = MarkWindow.instance.currentMarkNodeInfo.nodeData
       this.updateProgress() //更新进度条
@@ -421,7 +421,7 @@ export class PlanComponent implements OnInit {
     this.updateTimer? window.clearTimeout(this.updateTimer) : null //清除定时器
     this.isSuspend = true //暂停
     this.nzCurrent = event
-    this.progressList.forEach((item,index)=>{ index >= this.nzCurrent? this.progressList[index] = 0 : null })
+    this.progressList.forEach((item,index)=>{ index >= this.nzCurrent? this.progressList[index] = 0 : this.progressList[index] = 100 })
     this.publicToggleNode()
   }
 
@@ -440,7 +440,7 @@ export class PlanComponent implements OnInit {
     }
     this.updateTimer? window.clearTimeout(this.updateTimer) : null //清除定时器
     this.nzCurrent = this.nzCurrent - 1
-    this.progressList.forEach((item,index)=>{ index >= this.nzCurrent? this.progressList[index] = 0 : null })
+    this.progressList.forEach((item,index)=>{ index >= this.nzCurrent? this.progressList[index] = 0 : this.progressList[index] = 100 })
     this.publicToggleNode()
   }
 
@@ -493,7 +493,7 @@ export class PlanComponent implements OnInit {
     }
     this.updateTimer? window.clearTimeout(this.updateTimer) : null //清除定时器
     this.nzCurrent = this.nzCurrent + 1
-    this.progressList.forEach((item,index)=>{ index >= this.nzCurrent? this.progressList[index] = 0 : null })
+    this.progressList.forEach((item,index)=>{ index >= this.nzCurrent? this.progressList[index] = 0 : this.progressList[index] = 100 })
     this.publicToggleNode()
   }
 

src/styles.scss

@@ -125,6 +125,11 @@ h1 {
   .ant-input { background: rgba(145, 204, 255, 0.41); border: 1px solid #91CCFF; }
   textarea { resize: none; outline: none; }
 }
+.videoDialog{
+  height: 80%;
+  .ant-modal-footer { padding: 0; }
+  .ant-modal-body,.ant-modal-content { height: 100%; }
+}
 #threeDimensional {
   .ant-tree{ color: #C4E2FC; } //tree
   .ant-tree,.ant-tree-node-content-wrapper:hover,.ant-tree-node-content-wrapper.ant-tree-node-selected { background-color: transparent; } //tree