From ee836e78a64c3d8b62c4cffcb9b2a690309d1556 Mon Sep 17 00:00:00 2001
From: cpf <1105965053@qq.com>
Date: Tue, 23 Nov 2021 15:19:12 +0800
Subject: [PATCH] =?UTF-8?q?=E5=BA=94=E6=80=A5=E9=A2=84=E6=A1=88=E5=AE=8C?=
 =?UTF-8?q?=E5=96=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../left-domain/left-domain.component.html    |  4 +-
 src/app/pages/plan/plan.component.html        | 14 +++---
 src/app/pages/plan/plan.component.scss        |  8 +++-
 src/app/pages/plan/plan.component.ts          | 48 +++++++++++++++++--
 src/styles.scss                               |  2 +
 5 files changed, 64 insertions(+), 12 deletions(-)

diff --git a/src/app/pages/left-domain/left-domain.component.html b/src/app/pages/left-domain/left-domain.component.html
index 37a8d9f..9c4dca5 100644
--- a/src/app/pages/left-domain/left-domain.component.html
+++ b/src/app/pages/left-domain/left-domain.component.html
@@ -157,12 +157,12 @@
     </div>
     <!-- 处置预案 -->
     <!-- 弹窗 -->
-    <nz-modal [(nzVisible)]="addDisposalPop || addNodePop" nzTitle="创建预案/节点" (nzOnCancel)="addDisposalPop = false; addNodePop = null;" (nzOnOk)="addDisposal(form.value)" [nzOkDisabled]='name.invalid'>
+    <nz-modal [(nzVisible)]="addDisposalPop || addNodePop" nzTitle="创建预案/节点" (nzOnCancel)="addDisposalPop = false; addNodePop = null;" (nzOnOk)="addDisposal(form.value)" [nzOkDisabled]='nodeName.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 name="name" required/>
+            <input nz-input #nodeName='ngModel' ngModel name="name" required/>
           </nz-form-control>
         </nz-form-item>
       </form>
diff --git a/src/app/pages/plan/plan.component.html b/src/app/pages/plan/plan.component.html
index 0845604..1a47969 100644
--- a/src/app/pages/plan/plan.component.html
+++ b/src/app/pages/plan/plan.component.html
@@ -144,7 +144,7 @@
       <div class="pulicPlanDiv bottomPlanHeader">
         <div class="planHeaderText">
           <p><input type="text" [(ngModel)]="beforePlanNode.name" [disabled]="!editMode"></p>
-          <textarea [(ngModel)]="beforePlanNode.describe"></textarea>
+          <textarea [(ngModel)]="beforePlanNode.describe" [disabled]="!editMode"></textarea>
         </div>
         <div class="planHeaderImg"><a href="javascript:;" class="bottomPlanUpload"><input type="file"><img src="../../../assets/images/uploadImg.png"></a></div>
         <div class="planHeaderVideo"><a href="javascript:;" class="bottomPlanUpload" style="width: 100px;"><input type="file"><img src="../../../assets/images/uploadVideo.png"></a></div>
@@ -158,12 +158,14 @@
           </ul>
         </nz-dropdown-menu>
         <label>
-          <nz-steps *ngIf="beforeEmergencyPlan.nodes && beforeEmergencyPlan.nodes.length">
-            <nz-step [nzIcon]="voidTemplate"></nz-step>
-            <nz-step [nzIcon]="iconTemplate" *ngFor="let item of beforeEmergencyPlan.nodes"></nz-step>
-            <ng-template #voidTemplate></ng-template>
-            <ng-template #iconTemplate><img src="../../../assets/images/stepIcon.png"></ng-template>
+          <nz-steps *ngIf="beforeEmergencyPlan.nodes && beforeEmergencyPlan.nodes.length" [nzCurrent]="nzCurrent" [nzProgressDot]="progressTemplate" (nzIndexChange)="changePlanNode($event)">
+            <nz-step *ngFor="let item of beforeEmergencyPlan.nodes;" title="{{item.name}}"></nz-step>
+            <nz-step></nz-step>
           </nz-steps>
+          <ng-template #progressTemplate let-index="index">
+            <img src="../../../assets/images/stepIcon.png" style="margin-left: -100%;" *ngIf="index != beforeEmergencyPlan.nodes.length">
+            <i nz-icon nzType="play-circle" nzTheme="outline" *ngIf="index === nzCurrent && index != beforeEmergencyPlan.nodes.length"></i>
+          </ng-template>
         </label>
         <label>
           <i nz-icon nzType="backward" nzTheme="outline" (click)="toLast()"></i>
diff --git a/src/app/pages/plan/plan.component.scss b/src/app/pages/plan/plan.component.scss
index 4dcc908..7898fd7 100644
--- a/src/app/pages/plan/plan.component.scss
+++ b/src/app/pages/plan/plan.component.scss
@@ -332,6 +332,7 @@
       flex: 1;
       font-size: 14px;
       p{ margin: 0; height: 20px; line-height: 18px; }
+      input{ border: none; outline: none; background-color: transparent; width: 100%; height: 100%; }
       textarea{ width: 100%; height: 50px; background: rgba(145, 204, 255, 0.41); border: 1px solid #91CCFF; padding: 0; resize: none; outline: none; }
     }
     .planHeaderImg{ width: 100px; height: 100%; text-align: center; }
@@ -359,7 +360,12 @@
         border: 1px solid rgba(35, 217, 255, 0.4);
       }
     }
-    label:nth-child(2){ flex: 1; overflow: hidden; img{ height: 35px; width: auto; vertical-align: top; } }
+    label:nth-child(2){
+      flex: 1;
+      overflow: hidden;
+      .anticon{ font-size: 16px;  color: #23D9FF; }
+      img{ height: 35px; width: auto; vertical-align: top; }
+    }
     label:last-child{
       width: 15%;
       height: 100%;
diff --git a/src/app/pages/plan/plan.component.ts b/src/app/pages/plan/plan.component.ts
index f3ffb32..7dc8483 100644
--- a/src/app/pages/plan/plan.component.ts
+++ b/src/app/pages/plan/plan.component.ts
@@ -119,6 +119,9 @@ export class PlanComponent implements OnInit {
     let fenceType: JYZInfoMoudleType = this.getFenceType(type)
     this.isShowNature = false //隐藏属性栏
     if (this.selectFence != type) {
+      if (this.selectFence === 7) { //初始化 应急预案模块
+        this.initializePlan()
+      }
       this.isShowChildComponent && this.leftDomain && type != 4 ? this.leftDomain.initComponent(type) : null; //手动初始化子组件
       this.selectFence = type
       this.isShowChildComponent = true
@@ -127,6 +130,9 @@ export class PlanComponent implements OnInit {
       this.selectFence = -1
       this.isShowChildComponent = false
       buildingWindow.changeJYZInfoModel(fenceType, false)
+      if (type === 7) { //初始化 应急预案模块
+        this.initializePlan()
+      }
     }
   }
 
@@ -319,18 +325,54 @@ export class PlanComponent implements OnInit {
   allMarkPlanData: AllMarkPlanData; //处置预案节点 数据
   beforeEmergencyPlan: MarkPlanData = new MarkPlanData(-99, "请选择节点"); //当前选择 应急预案
   beforePlanNode: MarkNodeData = new MarkNodeData(-99, "请选择节点"); //当前选择 预案节点
+  nzCurrent: number = -1; //当前选择 预案节点Index
+  isSuspend: boolean = false; //是否暂停 自动切换节点
+  timer: any; //定时器
 
-  //选中 子组件预案节点
+  //初始化 应急预案模块
+  initializePlan() {
+    this.beforeEmergencyPlan = new MarkPlanData(-99, "请选择节点")
+    this.beforePlanNode = new MarkNodeData(-99, "请选择节点")
+    this.isSuspend = false //初始化暂停状态
+    window.clearTimeout(this.timer) //清除定时器
+  }
+
+  //选中 底部一级节点 开启自动播放
   selectChildNode(item: MarkPlanData) {
-    if (this.isShowChildComponent && this.leftDomain) {
+    if (this.isShowChildComponent && this.leftDomain && this.beforeEmergencyPlan != item) {
       if (item.nodes.length) {
-        this.leftDomain.selectNode(item, item.nodes[0])
+        this.nzCurrent = 0
+        this.beforeEmergencyPlan = item
+        this.beforePlanNode = item.nodes[0]
+        this.leftDomain.selectPlanId = item.id
+        this.leftDomain.selectNodeId = item.nodes[0].id
+        MarkWindow.instance.selectMarkNode(item.id, item.nodes[0].id)
+        this.autoPlay()
       } else {
         this.message.info('暂无数据节点');
       }
     }
   }
 
+  //自动播放-切换接点
+  autoPlay() {
+    let time: number = MarkWindow.instance.currentMarkNodeInfo.getShowTime()
+    console.log(time,777)
+  }
+
+  //切换预案节点
+  changePlanNode(event){
+    if (event === this.beforeEmergencyPlan.nodes.length) {
+      return
+    }
+    this.nzCurrent = event
+    this.beforePlanNode = this.beforeEmergencyPlan.nodes[event]
+    this.leftDomain.selectPlanId = this.beforeEmergencyPlan.id
+    this.leftDomain.selectNodeId =  this.beforePlanNode.id
+    MarkWindow.instance.selectMarkNode(this.beforeEmergencyPlan.id, this.beforePlanNode.id)
+    console.log(event)
+  }
+
   //切换预案节点 上一个
   toLast() {
 
diff --git a/src/styles.scss b/src/styles.scss
index 79eb5e9..500789c 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -136,6 +136,8 @@ h1 {
     .ant-collapse-arrow{ left: 5px; } //可展开面板
   }
 
+  .ant-steps-dot .ant-steps-item-tail, .ant-steps-dot.ant-steps-small .ant-steps-item-tail{ top: 15px; } //步骤条
+
   //滚动条样式	
   ::-webkit-scrollbar {
     width: 5px;