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 @@ - +
预案/节点名称 - +
diff --git a/src/app/pages/left-domain/left-domain.component.ts b/src/app/pages/left-domain/left-domain.component.ts index 58efc2c..8da1893 100644 --- a/src/app/pages/left-domain/left-domain.component.ts +++ b/src/app/pages/left-domain/left-domain.component.ts @@ -213,6 +213,7 @@ export class LeftDomainComponent implements OnInit { if (!MarkWindow.instance.currentMarkNodeInfo) { //未选中节点 PlanComponent.instance.beforeEmergencyPlan = item PlanComponent.instance.beforePlanNode = e + PlanComponent.instance.nzCurrent = -1 this.selectPlanId = item.id this.selectNodeId = e.id MarkWindow.instance.selectMarkNode(item.id, e.id) @@ -224,6 +225,7 @@ export class LeftDomainComponent implements OnInit { if (isTrue) { PlanComponent.instance.beforeEmergencyPlan = item PlanComponent.instance.beforePlanNode = e + PlanComponent.instance.nzCurrent = -1 this.selectPlanId = item.id this.selectNodeId = e.id MarkWindow.instance.selectMarkNode(item.id, e.id) @@ -235,8 +237,9 @@ export class LeftDomainComponent implements OnInit { isTrue = confirm('切换节点后,没保存的信息将会丢失!') } if (isTrue) { - PlanComponent.instance.beforeEmergencyPlan = null - PlanComponent.instance.beforePlanNode = null + PlanComponent.instance.beforeEmergencyPlan = new MarkPlanData(-99, "请选择节点") + PlanComponent.instance.beforePlanNode = new MarkNodeData(-99, "请选择节点") + PlanComponent.instance.nzCurrent = -1 this.selectPlanId = null this.selectNodeId = null MarkWindow.instance.selectMarkNode(null, null) diff --git a/src/app/pages/plan/plan.component.html b/src/app/pages/plan/plan.component.html index e19ccfb..0217cb3 100644 --- a/src/app/pages/plan/plan.component.html +++ b/src/app/pages/plan/plan.component.html @@ -143,33 +143,35 @@
-

灾情描述

- +

+
- +
diff --git a/src/app/pages/plan/plan.component.scss b/src/app/pages/plan/plan.component.scss index 4dcc908..de97d92 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 0f1cb91..1b591ad 100644 --- a/src/app/pages/plan/plan.component.ts +++ b/src/app/pages/plan/plan.component.ts @@ -132,6 +132,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 @@ -140,6 +143,9 @@ export class PlanComponent implements OnInit { this.selectFence = -1 this.isShowChildComponent = false buildingWindow.changeJYZInfoModel(fenceType, false) + if (type === 7) { //初始化 应急预案模块 + this.initializePlan() + } } } @@ -330,8 +336,112 @@ export class PlanComponent implements OnInit { } allMarkPlanData: AllMarkPlanData; //处置预案节点 数据 - beforeEmergencyPlan: MarkPlanData = null; //当前选择 应急预案 - beforePlanNode: MarkNodeData = null; //当前选择 预案节点 + 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) //清除定时器 + } + + //公用 切换选中节点 + publicToggleNode() { + this.beforePlanNode = this.beforeEmergencyPlan.nodes[this.nzCurrent] + this.leftDomain.selectPlanId = this.beforeEmergencyPlan.id + this.leftDomain.selectNodeId = this.beforePlanNode.id + MarkWindow.instance.selectMarkNode(this.beforeEmergencyPlan.id, this.beforePlanNode.id) + } + + //选中 底部一级节点 开启自动播放 + selectChildNode(item: MarkPlanData) { + if (this.isShowChildComponent && this.leftDomain) { + if (item.nodes.length) { + let isTrue = confirm("即将开始播放节点") + if (isTrue) { + this.nzCurrent = 0 + this.beforeEmergencyPlan = item + this.publicToggleNode() + !this.isSuspend? this.autoPlay() : null + } + } else { + this.message.info('暂无数据节点'); + } + } + } + + //自动播放-切换接点 + autoPlay() { + if (this.nzCurrent === this.beforeEmergencyPlan.nodes.length - 1) { + this.nzCurrent = this.nzCurrent + 1 + this.isSuspend = false //初始化暂停状态 + window.clearTimeout(this.timer) //清除定时器 + this.message.info('已播放至最后一节点'); + return + } + let time: number = this.beforePlanNode.getShowTime() + this.timer = window.setTimeout(()=>{ + this.nzCurrent = this.nzCurrent + 1 + this.publicToggleNode() + !this.isSuspend? this.autoPlay() : null + },time) + } + + //切换预案节点 + changePlanNode(event){ + if (event === this.beforeEmergencyPlan.nodes.length) { + return + } + this.nzCurrent = event + this.publicToggleNode() + } + + //切换预案节点 上一个 + toLast() { + if (this.nzCurrent === 0) { + this.message.info('目前已经是第一节点'); + return + } + this.nzCurrent = this.nzCurrent - 1 + this.publicToggleNode() + !this.isSuspend? this.autoPlay() : null + } + + //切换预案节点 暂停 + suspend(isSuspend: boolean) { + this.isSuspend = isSuspend + let msg: string = this.isSuspend? "目前已暂停" : "目前已开始播放" + this.message.info(msg); + if (this.isSuspend) { //暂停 + window.clearTimeout(this.timer) //清除定时器 + } else { //开启 + MarkWindow.instance.selectMarkNode(this.beforeEmergencyPlan.id, this.beforePlanNode.id) + this.autoPlay() + } + } + + //切换预案节点 初始化 + initialize() { + this.nzCurrent = 0 + this.publicToggleNode() + !this.isSuspend? this.autoPlay() : null + } + + //切换预案节点 下一个 + toNext() { + if (this.nzCurrent === this.beforeEmergencyPlan.nodes.length - 1) { + this.message.info('目前已经是最后一个节点'); + return + } + this.nzCurrent = this.nzCurrent + 1 + this.publicToggleNode() + !this.isSuspend? this.autoPlay() : null + } //选中应急预案 设备 selectSandTableMark(markData: MarkData, select: boolean) { 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;