完善进度条

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

@@ -230,7 +230,6 @@ export class LeftDomainComponent implements OnInit {
   updateFatherData(index) {
     PlanComponent.instance.nzCurrent = index
     PlanComponent.instance.isSuspend = true //暂停
-    PlanComponent.instance.timer? window.clearTimeout(PlanComponent.instance.timer) : null //清除定时器
     PlanComponent.instance.updateTimer? window.clearTimeout(PlanComponent.instance.updateTimer) : null //清除定时器
   }
 

src/app/pages/pages.module.ts

@@ -37,6 +37,7 @@ import { NzCheckboxModule } from 'ng-zorro-antd/checkbox';
 import { NzTimePickerModule } from 'ng-zorro-antd/time-picker';
 import { NzProgressModule } from 'ng-zorro-antd/progress';
 import { NzPopconfirmModule } from 'ng-zorro-antd/popconfirm';
+import { NzBadgeModule } from 'ng-zorro-antd/badge';
 import { TodayWarningAdminComponent } from './today-warning-admin/today-warning-admin.component';
 import { CriminalRecordsAdminComponent } from './criminal-records-admin/criminal-records-admin.component';
 import { EquipmentInfoComponent } from './equipment-info/equipment-info.component';
@@ -90,7 +91,8 @@ import { NzNotificationModule } from 'ng-zorro-antd/notification';
     NzTimePickerModule,
     NzProgressModule,
     NzNotificationModule,
-    NzPopconfirmModule
+    NzPopconfirmModule,
+    NzBadgeModule
   ],
   entryComponents: [AddequipmentComponent, EditequipmentComponent,GetOutOfLineDetailsComponent],
   schemas: [CUSTOM_ELEMENTS_SCHEMA]

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

@@ -161,7 +161,7 @@
           <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)">
-              <div><nz-progress [nzShowInfo]="false" [nzPercent]="progressList[key]" nzStrokeColor="#1890FF" nzStatus="active"></nz-progress></div>
+              <div><nz-progress [nzShowInfo]="false" [nzPercent]="progressList[key]" nzStrokeColor="#1890FF"></nz-progress></div>
             </div>
           </ng-container>
         </label>
@@ -169,7 +169,7 @@
           <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="border" 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>
         </label>
       </div>
@@ -233,6 +233,10 @@
       </form>
     </nz-modal>
     <!-- 应急预案设备任务弹窗 -->
+    <!-- 全景图/视频弹窗 -->
+    <nz-modal [(nzVisible)]="videoDialogType.url" (nzOnCancel)="videoDialogType.url = null;">
+    </nz-modal>
+    <!-- 全景图/视频弹窗 -->
   </div>
 
 </div>

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

@@ -338,7 +338,6 @@ export class PlanComponent implements OnInit {
   beforePlanNode: MarkNodeData = new MarkNodeData(-99, "请选择节点"); //当前选择 预案节点
   nzCurrent: number = -1; //当前选择 预案节点Index
   isSuspend: boolean = false; //是否暂停 自动切换节点
-  timer: any; //定时器
   progressList: number[] = []; //进度条 条/值
   updateTimer: any; //更新进度条定时器
 
@@ -347,7 +346,6 @@ export class PlanComponent implements OnInit {
     this.beforeEmergencyPlan = new MarkPlanData(-99, "请选择节点")
     this.beforePlanNode = new MarkNodeData(-99, "请选择节点")
     this.isSuspend = false //初始化暂停状态
-    window.clearTimeout(this.timer) //清除定时器
     this.progressList = []
     window.clearTimeout(this.updateTimer) //清除定时器
   }
@@ -369,62 +367,50 @@ export class PlanComponent implements OnInit {
   selectChildNode(item: MarkPlanData) {
     if (this.isShowChildComponent && this.leftDomain) {
       if (item.nodes.length) {
-        let isTrue = confirm("即将开始播放节点")
-        if (isTrue) {
-          this.timer? window.clearTimeout(this.timer) : null //清除定时器
-          this.updateTimer? window.clearTimeout(this.updateTimer) : null //清除定时器
-          this.nzCurrent = 0
-          this.beforeEmergencyPlan = item
-          this.updateProgressList().then(res=>{
-            this.publicToggleNode().then(data=>{
-              !this.isSuspend? this.autoPlay() : null
-            })
-          })
-        }
+        this.updateTimer? window.clearTimeout(this.updateTimer) : null //清除定时器
+        this.nzCurrent = 0
+        this.beforeEmergencyPlan = item
+        this.updateProgressList().then(res=>{
+          this.publicToggleNode()
+        })
       } else {
         this.message.info('暂无数据节点');
       }
     }
   }
 
+  //更新进度条 条数
+  updateProgressList() {
+    return new Promise((resolve, reject) => {
+      this.progressList = []
+      this.beforeEmergencyPlan.nodes.forEach(item=>{ this.progressList.push(0) })
+      resolve(true)
+    })
+  }
+
   //更新进度条 值
   updateProgress() {
     if (this.progressList[this.nzCurrent] >= 100) {
       this.progressList[this.nzCurrent] = 100
       window.clearTimeout(this.updateTimer) //清除定时器
+      !this.isSuspend? this.autoPlay() : null
       return
     }
     let time: number = this.beforePlanNode.getShowTime() || 1
     this.updateTimer = window.setTimeout(()=>{
-      this.progressList[this.nzCurrent] = this.progressList[this.nzCurrent] + Math.ceil(100 / time)
+      this.progressList[this.nzCurrent] = this.progressList[this.nzCurrent] + Number((100 / time).toFixed(2)) / 10
       this.updateProgress()
-    },1000)
-  }
-
-  //更新进度条 条数
-  updateProgressList() {
-    return new Promise((resolve, reject) => {
-      this.progressList = []
-      this.beforeEmergencyPlan.nodes.forEach(item=>{ this.progressList.push(0) })
-      resolve(true)
-    })
+    },100)
   }
 
   //自动播放-切换接点
   autoPlay() {
-    let time: number = this.beforePlanNode.getShowTime() || 1
-    this.timer = window.setTimeout(()=>{
-      if (this.nzCurrent >= this.beforeEmergencyPlan.nodes.length - 1) {
-        this.isSuspend = false //初始化暂停状态
-        window.clearTimeout(this.timer) //清除定时器
-        this.message.info('已播放至最后一节点');
-        return
-      }
-      this.nzCurrent = this.nzCurrent + 1
-      this.publicToggleNode().then(data=>{
-        !this.isSuspend? this.autoPlay() : null
-      })
-    },time * 1000)
+    if (this.nzCurrent >= this.beforeEmergencyPlan.nodes.length - 1) {
+      this.message.info('已播放至最后一节点');
+      return
+    }
+    this.nzCurrent = this.nzCurrent + 1
+    this.publicToggleNode()
   }
 
   //切换预案节点
@@ -432,10 +418,10 @@ export class PlanComponent implements OnInit {
     if (this.progressList.length != this.beforeEmergencyPlan.nodes.length) {
       this.updateProgressList()
     }
-    this.timer? window.clearTimeout(this.timer) : null //清除定时器
     this.updateTimer? window.clearTimeout(this.updateTimer) : null //清除定时器
+    this.isSuspend = true //暂停
     this.nzCurrent = event
-    this.progressList[this.nzCurrent] = 0
+    this.progressList.forEach((item,index)=>{ index >= this.nzCurrent? this.progressList[index] = 0 : null })
     this.publicToggleNode()
   }
 
@@ -452,13 +438,10 @@ export class PlanComponent implements OnInit {
     if (this.progressList.length != this.beforeEmergencyPlan.nodes.length) {
       this.updateProgressList()
     }
-    this.timer? window.clearTimeout(this.timer) : null //清除定时器
     this.updateTimer? window.clearTimeout(this.updateTimer) : null //清除定时器
     this.nzCurrent = this.nzCurrent - 1
-    this.progressList[this.nzCurrent] = 0
-    this.publicToggleNode().then(data=>{
-      //!this.isSuspend? this.autoPlay() : null
-    })
+    this.progressList.forEach((item,index)=>{ index >= this.nzCurrent? this.progressList[index] = 0 : null })
+    this.publicToggleNode()
   }
 
   //切换预案节点 暂停
@@ -474,15 +457,11 @@ export class PlanComponent implements OnInit {
     let msg: string = this.isSuspend? "目前已暂停" : "目前已开始播放"
     this.message.info(msg);
     if (this.isSuspend) { //暂停
-      window.clearTimeout(this.timer) //清除定时器
       window.clearTimeout(this.updateTimer) //清除定时器
     } else { //开启
-      this.timer? window.clearTimeout(this.timer) : null //清除定时器
       this.updateTimer? window.clearTimeout(this.updateTimer) : null //清除定时器
-      this.progressList.forEach((item,index)=>{ index >= this.nzCurrent? this.progressList[index] = 0 : null })
-      MarkWindow.instance.selectMarkNode(this.beforeEmergencyPlan.id, this.beforePlanNode.id, false, true)
+      this.progressList.forEach((item,index)=>{ index > this.nzCurrent? this.progressList[index] = 0 : null })
       this.updateProgress()
-      this.autoPlay()
     }
   }
 
@@ -492,13 +471,10 @@ export class PlanComponent implements OnInit {
       this.message.info('请选择节点');
       return
     }
-    this.timer? window.clearTimeout(this.timer) : null //清除定时器
     this.updateTimer? window.clearTimeout(this.updateTimer) : null //清除定时器
     this.updateProgressList().then(res=>{
       this.nzCurrent = 0
-      this.publicToggleNode().then(data=>{
-        !this.isSuspend? this.autoPlay() : null
-      })
+      this.publicToggleNode()
     })
   }
 
@@ -515,13 +491,10 @@ export class PlanComponent implements OnInit {
     if (this.progressList.length != this.beforeEmergencyPlan.nodes.length) {
       this.updateProgressList()
     }
-    this.timer? window.clearTimeout(this.timer) : null //清除定时器
     this.updateTimer? window.clearTimeout(this.updateTimer) : null //清除定时器
     this.nzCurrent = this.nzCurrent + 1
-    this.progressList[this.nzCurrent] = 0
-    this.publicToggleNode().then(data=>{
-      //!this.isSuspend? this.autoPlay() : null
-    })
+    this.progressList.forEach((item,index)=>{ index >= this.nzCurrent? this.progressList[index] = 0 : null })
+    this.publicToggleNode()
   }
 
   //获取进度条 flex分布
@@ -569,6 +542,8 @@ export class PlanComponent implements OnInit {
     this.contingencyPlanTask = null //关闭弹窗
   }
 
+  videoDialogType: videoDialog = new videoDialog(true, null); //全景图/视频 弹窗
+
   selectRightTopFast: number = 0; //当前选择功能 快捷栏
   selectAdsorb: boolean = false; //吸附状态
   topLevelView: boolean = false; //顶视图状态
@@ -644,6 +619,15 @@ export class PlanComponent implements OnInit {
 
 }
 
+//全景图/视频 type
+export class videoDialog {
+  isVideo: boolean
+  url: string
+  constructor(isVideo: boolean, url: string) {
+    this.isVideo = isVideo
+    this.url = url
+  }
+}
 //设备任务窗口 数据类型
 export class taskDialog {
   institution: string; //单位