From 32a8fd3d96aafa4ce04a50a36ca145b9b188b59d Mon Sep 17 00:00:00 2001 From: username <1105965053@qq.com> Date: Mon, 21 Sep 2020 11:08:54 +0800 Subject: [PATCH 1/6] =?UTF-8?q?[=E5=AE=8C=E5=96=84]=20=E9=A2=84=E6=A1=88?= =?UTF-8?q?=E8=BE=85=E5=8A=A9=E9=A1=B5=E9=9D=A2=E5=B8=83=E5=B1=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../plan-assistance.component.html | 23 ++++++- .../plan-assistance.component.scss | 65 ++++++++++++++++++- 2 files changed, 85 insertions(+), 3 deletions(-) diff --git a/src/app/ui/plan-assistance/plan-assistance.component.html b/src/app/ui/plan-assistance/plan-assistance.component.html index 5abcce6..f994b21 100644 --- a/src/app/ui/plan-assistance/plan-assistance.component.html +++ b/src/app/ui/plan-assistance/plan-assistance.component.html @@ -1,11 +1,30 @@
- +
到场力量
+
+
+
+
+

{{item.Name}}

+

{{item.Name}}

+
+
+ 已到场 +
+
+
+
- +
+
总平面图
+
+
+ +
+
diff --git a/src/app/ui/plan-assistance/plan-assistance.component.scss b/src/app/ui/plan-assistance/plan-assistance.component.scss index 379ad01..5acd36c 100644 --- a/src/app/ui/plan-assistance/plan-assistance.component.scss +++ b/src/app/ui/plan-assistance/plan-assistance.component.scss @@ -11,10 +11,73 @@ .left { width: 300px; height: 100%; - background-color: #000; + box-sizing: border-box; + padding: 1px; + display: flex; + flex-direction: column; + .list { + flex: 1; + overflow: hidden; + .tableDiv { + height: 100%; + overflow-y: auto; + border-left: 1px solid #30bbec; + border-top: 1px solid #30bbec; + } + } + //每一行 + .tableRows { + height: 40px; + overflow: hidden; + display: flex; + margin: 5px 0; + .contentText { + font-size: 12px; + color: #fff; + cursor: pointer; + } + } +} + +//选中状态 +.selectIcon { + background-color: rgba(7,89,155,0.7); } //右侧工作区 .center { flex: 1; + box-sizing: border-box; + display: flex; + flex-direction: column; + .canvas { + flex: 1; + } +} + +//header +.header { + width: 100%; + height: 40px; + min-height: 40px; + cursor: pointer; +} +.leftHeader { + line-height: 40px; + text-align: center; + font-size: 20px; + font-weight: 550; + color: #F7bA2A; +} +.title { + margin: 1px 0; + width: 120px; + height: 38px; + line-height: 38px; + background: url('../../../assets/images/标签正常.png'); + -moz-background-size:100% 100%; + background-size:100% 100%; + font-size: 20px; + color: #fff; + padding-left: 25px; } \ No newline at end of file From 3e92ad35cc7c3d0038292fa9b1937627f809273e Mon Sep 17 00:00:00 2001 From: username <1105965053@qq.com> Date: Mon, 21 Sep 2020 18:31:16 +0800 Subject: [PATCH 2/6] =?UTF-8?q?[=E5=AE=8C=E5=96=84]=20=E9=A2=84=E6=A1=88?= =?UTF-8?q?=E8=B5=8B=E8=83=BD=E5=9F=BA=E6=9C=AC=E5=AE=8C=E6=88=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/canvas-share-data.service.ts | 5 + src/app/navigation/navigation.component.ts | 2 +- .../plan-assistance.component.html | 81 ++- .../plan-assistance.component.scss | 201 +++++- .../plan-assistance.component.ts | 663 +++++++++++++++++- src/assets/images/direction.png | Bin 0 -> 2132 bytes src/assets/images/route.png | Bin 0 -> 1491 bytes src/index.html | 2 +- 8 files changed, 916 insertions(+), 38 deletions(-) create mode 100644 src/assets/images/direction.png create mode 100644 src/assets/images/route.png diff --git a/src/app/canvas-share-data.service.ts b/src/app/canvas-share-data.service.ts index 0bcbbde..f8097f2 100644 --- a/src/app/canvas-share-data.service.ts +++ b/src/app/canvas-share-data.service.ts @@ -25,6 +25,11 @@ export class CanvasShareDataService { selectPanelPoint:any = {disposalNodeId:''}; //选择当前 数据节点 selectPanelPointBaseData:any = {description: '', notes: '',weather: '',airTemperature: '',windDirection: '',windScale: ''}; //当前 数据节点 所对应的 天气,详情 数据节点 //处置 节点 + + //预案赋能 选择 车辆 + selectCar:any = {Id: '', WaterYield: '', Foam: '', PeopleNum: '', Tonnage: '', Assignment: '', LinkCar: '', WaterOccupy: ''} + //预案赋能 选择 车辆 + /** * 游戏模式 */ diff --git a/src/app/navigation/navigation.component.ts b/src/app/navigation/navigation.component.ts index a5c9acd..c0ac672 100644 --- a/src/app/navigation/navigation.component.ts +++ b/src/app/navigation/navigation.component.ts @@ -28,7 +28,7 @@ export class NavigationComponent implements OnInit { {name:'危化品', url: '/ui/dangerous'}, {name:'类似预案', url: '/ui/similarPlans'}, {name:'真实战例', url: '/ui/realCases'}, - {name:'预案辅助', url: '/ui/planAssistance'} + {name:'预案赋能', url: '/ui/planAssistance'} ] ngOnInit () { diff --git a/src/app/ui/plan-assistance/plan-assistance.component.html b/src/app/ui/plan-assistance/plan-assistance.component.html index f994b21..75c38b5 100644 --- a/src/app/ui/plan-assistance/plan-assistance.component.html +++ b/src/app/ui/plan-assistance/plan-assistance.component.html @@ -3,13 +3,14 @@
到场力量
-
-
-

{{item.Name}}

-

{{item.Name}}

+
+
+

{{item.Name}}

+

{{item.FireTeamName}}

-
- 已到场 +
已到场
+
+
@@ -17,11 +18,75 @@
-
-
+
+
总平面图
+
+ + +
+
+ volume_up +
+
+
冷却
+
登罐
+
注入泡沫
+
+
+ settings_voice + + search +
+
+
+ +
+
+ +
+
+
+
+

载水量

+

载泡沫

+

载人数

+

吨位

+

执行任务

+

连接车辆

+

水源占用

+
+
+

{{canvasData.selectCar.WaterYield}}

+

{{canvasData.selectCar.Foam}}

+

{{canvasData.selectCar.PeopleNum}}

+

{{canvasData.selectCar.Tonnage}}

+

+ +

+

{{canvasData.selectCar.LinkCar}}

+

{{canvasData.selectCar.WaterOccupy}}

+
+
+
+ +
+
+
+ + +
keyboard_arrow_left
+
+
+ +
+
+
+
+
+
diff --git a/src/app/ui/plan-assistance/plan-assistance.component.scss b/src/app/ui/plan-assistance/plan-assistance.component.scss index 5acd36c..c1ea7e3 100644 --- a/src/app/ui/plan-assistance/plan-assistance.component.scss +++ b/src/app/ui/plan-assistance/plan-assistance.component.scss @@ -7,10 +7,40 @@ display: flex; } +//左右侧 header +.header { + width: 100%; + height: 40px; + min-height: 40px; +} +.leftHeader { + line-height: 40px; + text-align: center; + font-size: 20px; + font-weight: 550; + color: #F7bA2A; + cursor: pointer; +} +.title { + display: inline-block; + margin: 1px 0; + width: 120px; + height: 38px; + line-height: 38px; + background: url('../../../assets/images/标签正常.png'); + -moz-background-size:100% 100%; + background-size:100% 100%; + font-size: 20px; + color: #fff; + padding-left: 25px; + cursor: pointer; +} + //左侧菜单 .left { width: 300px; height: 100%; + min-width: 250px; box-sizing: border-box; padding: 1px; display: flex; @@ -27,21 +57,24 @@ } //每一行 .tableRows { - height: 40px; + height: 50px; overflow: hidden; display: flex; - margin: 5px 0; + margin: 13px 0; .contentText { font-size: 12px; color: #fff; cursor: pointer; + overflow: hidden; + text-overflow:ellipsis; + white-space: nowrap; } } } //选中状态 .selectIcon { - background-color: rgba(7,89,155,0.7); + background-color: rgba(13, 139, 241, 0.7); } //右侧工作区 @@ -52,32 +85,152 @@ flex-direction: column; .canvas { flex: 1; + position: relative; } } -//header -.header { - width: 100%; - height: 40px; - min-height: 40px; - cursor: pointer; +.mat-icon { vertical-align: middle; cursor: pointer; } +//下方 车辆信息 UI +.bottomWork { + width: 800px; + height: 100px; + position: absolute; + bottom: 5px; + left: 50%; + margin-left: -400px; + z-index: 10; + display: flex; + flex-direction: column; + >div{ background-color:rgba(2, 44, 73, 0.9); } + button { width: 50px; height: 40px; background-color: #67c23a; color: #fff; } + //table表格 + .publicRow { + height: 50%; + display: flex; + align-items: center; + justify-content: center; + p { flex: 1; text-align: center; line-height: 35px; } + } + .taskInput { + width: 100px; + height: 24px; + padding-left: 5px; + outline: none; + border: none; + background-color:rgba(255,255,255,0); + background: url('../../../assets/images/输入框.png') no-repeat; + background-size: 100% 100%; + color: #fff; + } } -.leftHeader { - line-height: 40px; + +//右侧 楼层UI +.rightStorey { + width: 100px; + height: 250px; + position: absolute; + right: 2px; + top: 50%; + margin-top: -125px; + z-index: 10; + display: flex; + flex-direction: column; + background-color:rgba(2, 44, 73, 0.9); + color: #fff; + font-weight: 300; + >div {text-align: center; line-height: 25px;} +} +.showRightStorey { + position: absolute; + right: 0; + top: 50%; + margin-top: -13px; + z-index: 10; + width: 26px; + height: 26px; + line-height: 26px; text-align: center; - font-size: 20px; - font-weight: 550; - color: #F7bA2A; + background-color:rgba(2, 44, 73, 0.9); + color: #fff; } -.title { - margin: 1px 0; - width: 120px; - height: 38px; - line-height: 38px; - background: url('../../../assets/images/标签正常.png'); - -moz-background-size:100% 100%; - background-size:100% 100%; - font-size: 20px; +//打开关闭右侧 楼层 +.openRight { + margin-right: 0px; + transition: margin-right 0.5s; +} +.closeRight { + margin-right: -300px; + transition: margin-right 0.5s; +} + +//右侧语音 UI +.rightSpeak { + position: absolute; + top: 40px; + left: -275px; + width: 310px; + height: 320px; + z-index: 11; + box-sizing: border-box; + padding: 3px; + border: 1px solid #30bbec; + background-color:rgba(2, 44, 73, 0.9); color: #fff; - padding-left: 25px; + display: flex; + flex-direction: column; + .mat-icon { + font-size: 28px; + width: 28px; + height: 28px; + margin: 3px 10px; + } + .sayBgc { + flex: 1; + box-sizing: border-box; + background: url('../../../assets/images/输入框.png'); + background-size: 100% 100%; + color: #30bbec; + } + .iconButton { + margin: 10px; + border-radius: 18px; + width: 70px; + height: 30px; + text-align: center; + line-height: 30px; + display: inline-block; + font-size: 13px; + color: white; + cursor: pointer; + } +} + +//右侧 绘制工具 +.draw { + display: inline-block; + position: absolute; + width: 80px; + height: 38px; + top: 1px; + left: 50%; + margin-left: -40px; + padding-top: 6px; + label { + display: inline-block; + width: 24px; + height: 24px; + margin: 0 5px; + border-radius: 50%; + cursor: pointer; + } + :first-child { + background: url('../../../assets/images/route.png') no-repeat center center; + background-size: 16px 16px; + background-color: #fff; + } + :last-child { + background: url('../../../assets/images/direction.png') no-repeat center center; + background-size: 16px 16px; + background-color: #fff; + } } \ No newline at end of file diff --git a/src/app/ui/plan-assistance/plan-assistance.component.ts b/src/app/ui/plan-assistance/plan-assistance.component.ts index e8e6fe6..184ef01 100644 --- a/src/app/ui/plan-assistance/plan-assistance.component.ts +++ b/src/app/ui/plan-assistance/plan-assistance.component.ts @@ -1,5 +1,7 @@ -import { Component, OnInit, AfterViewInit, ViewChild } from '@angular/core'; +import { Component, OnInit, AfterViewInit, ViewChild, } from '@angular/core'; import { WorkingAreaComponent } from 'src/app/working-area/working-area.component'; +import {CanvasShareDataService} from '../../canvas-share-data.service' +import * as ObjectID from 'bson-objectid'; @Component({ selector: 'app-plan-assistance', @@ -7,12 +9,11 @@ import { WorkingAreaComponent } from 'src/app/working-area/working-area.componen styleUrls: ['./plan-assistance.component.scss'] }) export class PlanAssistanceComponent implements OnInit, AfterViewInit { - constructor() { } + constructor(public canvasData:CanvasShareDataService) { } @ViewChild('workingArea') workingArea: WorkingAreaComponent; - demoData = [ { TemplateId: null, @@ -1408,10 +1409,664 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { GameMode: 2 }; ngOnInit(): void { - + let that = this + window.setTimeout(()=>{ + document.getElementById("center").oncontextmenu = function (event) { + that.workingArea.cancelPaint() + event.preventDefault(); + }; + }) } ngAfterViewInit(): void { this.workingArea.loadDemoScene(this.demoData, 0.149); } + + //所有车辆信息 + allCarsData = [ + { + TemplateId: null, + FloorId: null, + Angle: 0, + Color: 0, + Enabled: true, + FillMode: 0, + FireElementId: 0, + FixedSize: false, + Height: 32, + Width: 32, + Id: ObjectID.default.generate(), + ImageUrl: './assets/images/水罐消防车.png', + InteractiveMode: 0, + MultiPoint: null, + Point: { + x: 1295, + y: 1237 + }, + Name: '水罐消防车', + FireTeamName: '港北区解放路消防救援站', //所属消防队 + ReachTime: 0, //到场剩余时间 + WaterYield: '8t',//载水量 + Foam: '0t', //载泡沫 + PeopleNum: 6, //载人数 + Tonnage: '10t', //吨位 + Assignment: '供液', //执行任务 + LinkCar: '', //连接车辆 + WaterOccupy: '', //水源占用 + PropertyInfos: [ + { + Enabled: true, + Order: 0, + PhysicalUnit: '', + PropertyName: '名称/编号', + PropertyType: 0, + PropertyValue: '港北区解放路消防救援站', + Required: false, + RuleName: '', + RuleValue: '', + Tag: '', + Visible: true + } + ], + Border: null, + DrawMode: null, + Thickness: 0, + IsFromBuilding: false, + GameMode: 2 + }, + { + TemplateId: null, + FloorId: null, + Angle: 0, + Color: 0, + Enabled: true, + FillMode: 0, + FireElementId: 0, + FixedSize: false, + Height: 32, + Width: 32, + Id: ObjectID.default.generate(), + ImageUrl: './assets/images/泡沫消防车.png', + InteractiveMode: 0, + MultiPoint: null, + Point: { + x: 1295, + y: 1237 + }, + Name: '水罐泡沫消防车', + FireTeamName: '港北区解放路消防救援站', //所属消防队 + ReachTime: 0, //到场剩余时间 + WaterYield: '10t',//载水量 + Foam: '2t', //载泡沫 + PeopleNum: 6, //载人数 + Tonnage: '12t', //吨位 + Assignment: '灭火', //执行任务 + LinkCar: '', //连接车辆 + WaterOccupy: '', //水源占用 + PropertyInfos: [ + { + Enabled: true, + Order: 0, + PhysicalUnit: '', + PropertyName: '名称/编号', + PropertyType: 0, + PropertyValue: '港北区解放路消防救援站', + Required: false, + RuleName: '', + RuleValue: '', + Tag: '', + Visible: true + } + ], + Border: null, + DrawMode: null, + Thickness: 0, + IsFromBuilding: false, + GameMode: 2 + }, + { + TemplateId: null, + FloorId: null, + Angle: 0, + Color: 0, + Enabled: true, + FillMode: 0, + FireElementId: 0, + FixedSize: false, + Height: 32, + Width: 32, + Id: ObjectID.default.generate(), + ImageUrl: './assets/images/泡沫消防车.png', + InteractiveMode: 0, + MultiPoint: null, + Point: { + x: 1295, + y: 1237 + }, + Name: '水罐泡沫消防车', + FireTeamName: '港北区解放路消防救援站', //所属消防队 + ReachTime: 0, //到场剩余时间 + WaterYield: '4t',//载水量 + Foam: '1t', //载泡沫 + PeopleNum: 6, //载人数 + Tonnage: '6t', //吨位 + Assignment: '灭火', //执行任务 + LinkCar: '', //连接车辆 + WaterOccupy: '', //水源占用 + PropertyInfos: [ + { + Enabled: true, + Order: 0, + PhysicalUnit: '', + PropertyName: '名称/编号', + PropertyType: 0, + PropertyValue: '港北区解放路消防救援站', + Required: false, + RuleName: '', + RuleValue: '', + Tag: '', + Visible: true + } + ], + Border: null, + DrawMode: null, + Thickness: 0, + IsFromBuilding: false, + GameMode: 2 + }, + { + TemplateId: null, + FloorId: null, + Angle: 0, + Color: 0, + Enabled: true, + FillMode: 0, + FireElementId: 0, + FixedSize: false, + Height: 32, + Width: 32, + Id: ObjectID.default.generate(), + ImageUrl: './assets/images/压缩空气泡沫消防车.png', + InteractiveMode: 0, + MultiPoint: null, + Point: { + x: 1295, + y: 1237 + }, + Name: '举高喷射消防车', + FireTeamName: '港北区解放路消防救援站', //所属消防队 + ReachTime: 0, //到场剩余时间 + WaterYield: '18t',//载水量 + Foam: '2t', //载泡沫 + PeopleNum: 6, //载人数 + Tonnage: '20t', //吨位 + Assignment: '灭火', //执行任务 + LinkCar: '', //连接车辆 + WaterOccupy: '', //水源占用 + PropertyInfos: [ + { + Enabled: true, + Order: 0, + PhysicalUnit: '', + PropertyName: '名称/编号', + PropertyType: 0, + PropertyValue: '港北区解放路消防救援站', + Required: false, + RuleName: '', + RuleValue: '', + Tag: '', + Visible: true + } + ], + Border: null, + DrawMode: null, + Thickness: 0, + IsFromBuilding: false, + GameMode: 2 + }, + { + TemplateId: null, + FloorId: null, + Angle: 0, + Color: 0, + Enabled: true, + FillMode: 0, + FireElementId: 0, + FixedSize: false, + Height: 32, + Width: 32, + Id: ObjectID.default.generate(), + ImageUrl: './assets/images/水罐消防车.png', + InteractiveMode: 0, + MultiPoint: null, + Point: { + x: 1295, + y: 1237 + }, + Name: '水罐消防车', + FireTeamName: '八塘消防救援站', //所属消防队 + ReachTime: 3, //到场剩余时间 + WaterYield: '12t',//载水量 + Foam: '0t', //载泡沫 + PeopleNum: 6, //载人数 + Tonnage: '14t', //吨位 + Assignment: '冷却', //执行任务 + LinkCar: '', //连接车辆 + WaterOccupy: '', //水源占用 + PropertyInfos: [ + { + Enabled: true, + Order: 0, + PhysicalUnit: '', + PropertyName: '名称/编号', + PropertyType: 0, + PropertyValue: '八塘消防救援站', + Required: false, + RuleName: '', + RuleValue: '', + Tag: '', + Visible: true + } + ], + Border: null, + DrawMode: null, + Thickness: 0, + IsFromBuilding: false, + GameMode: 2 + }, + { + TemplateId: null, + FloorId: null, + Angle: 0, + Color: 0, + Enabled: true, + FillMode: 0, + FireElementId: 0, + FixedSize: false, + Height: 32, + Width: 32, + Id: ObjectID.default.generate(), + ImageUrl: './assets/images/泡沫消防车.png', + InteractiveMode: 0, + MultiPoint: null, + Point: { + x: 1295, + y: 1237 + }, + Name: '水罐泡沫消防车', + FireTeamName: '八塘消防救援站', //所属消防队 + ReachTime: 3, //到场剩余时间 + WaterYield: '6t',//载水量 + Foam: '2t', //载泡沫 + PeopleNum: 6, //载人数 + Tonnage: '8t', //吨位 + Assignment: '冷却', //执行任务 + LinkCar: '', //连接车辆 + WaterOccupy: '', //水源占用 + PropertyInfos: [ + { + Enabled: true, + Order: 0, + PhysicalUnit: '', + PropertyName: '名称/编号', + PropertyType: 0, + PropertyValue: '八塘消防救援站', + Required: false, + RuleName: '', + RuleValue: '', + Tag: '', + Visible: true + } + ], + Border: null, + DrawMode: null, + Thickness: 0, + IsFromBuilding: false, + GameMode: 2 + }, + { + TemplateId: null, + FloorId: null, + Angle: 0, + Color: 0, + Enabled: true, + FillMode: 0, + FireElementId: 0, + FixedSize: false, + Height: 32, + Width: 32, + Id: ObjectID.default.generate(), + ImageUrl: './assets/images/泡沫消防车.png', + InteractiveMode: 0, + MultiPoint: null, + Point: { + x: 1295, + y: 1237 + }, + Name: '水罐泡沫消防车', + FireTeamName: '八塘消防救援站', //所属消防队 + ReachTime: 3, //到场剩余时间 + WaterYield: '3t',//载水量 + Foam: '1t', //载泡沫 + PeopleNum: 8, //载人数 + Tonnage: '5t', //吨位 + Assignment: '堵截', //执行任务 + LinkCar: '', //连接车辆 + WaterOccupy: '', //水源占用 + PropertyInfos: [ + { + Enabled: true, + Order: 0, + PhysicalUnit: '', + PropertyName: '名称/编号', + PropertyType: 0, + PropertyValue: '八塘消防救援站', + Required: false, + RuleName: '', + RuleValue: '', + Tag: '', + Visible: true + } + ], + Border: null, + DrawMode: null, + Thickness: 0, + IsFromBuilding: false, + GameMode: 2 + }, + { + TemplateId: null, + FloorId: null, + Angle: 0, + Color: 0, + Enabled: true, + FillMode: 0, + FireElementId: 0, + FixedSize: false, + Height: 32, + Width: 32, + Id: ObjectID.default.generate(), + ImageUrl: './assets/images/压缩空气泡沫消防车.png', + InteractiveMode: 0, + MultiPoint: null, + Point: { + x: 1295, + y: 1237 + }, + Name: '举高喷射消防车', + FireTeamName: '八塘消防救援站', //所属消防队 + ReachTime: 4, //到场剩余时间 + WaterYield: '16t',//载水量 + Foam: '2t', //载泡沫 + PeopleNum: 4, //载人数 + Tonnage: '18t', //吨位 + Assignment: '灭火', //执行任务 + LinkCar: '', //连接车辆 + WaterOccupy: '', //水源占用 + PropertyInfos: [ + { + Enabled: true, + Order: 0, + PhysicalUnit: '', + PropertyName: '名称/编号', + PropertyType: 0, + PropertyValue: '八塘消防救援站', + Required: false, + RuleName: '', + RuleValue: '', + Tag: '', + Visible: true + } + ], + Border: null, + DrawMode: null, + Thickness: 0, + IsFromBuilding: false, + GameMode: 2 + }, + { + TemplateId: null, + FloorId: null, + Angle: 0, + Color: 0, + Enabled: true, + FillMode: 0, + FireElementId: 0, + FixedSize: false, + Height: 32, + Width: 32, + Id: ObjectID.default.generate(), + ImageUrl: './assets/images/泡沫消防车.png', + InteractiveMode: 0, + MultiPoint: null, + Point: { + x: 1295, + y: 1237 + }, + Name: '水罐泡沫消防车', + FireTeamName: '龚州消防救援站', //所属消防队 + ReachTime: 11, //到场剩余时间 + WaterYield: '6t',//载水量 + Foam: '2t', //载泡沫 + PeopleNum: 6, //载人数 + Tonnage: '8t', //吨位 + Assignment: '供液', //执行任务 + LinkCar: '', //连接车辆 + WaterOccupy: '', //水源占用 + PropertyInfos: [ + { + Enabled: true, + Order: 0, + PhysicalUnit: '', + PropertyName: '名称/编号', + PropertyType: 0, + PropertyValue: '龚州消防救援站', + Required: false, + RuleName: '', + RuleValue: '', + Tag: '', + Visible: true + } + ], + Border: null, + DrawMode: null, + Thickness: 0, + IsFromBuilding: false, + GameMode: 2 + }, + { + TemplateId: null, + FloorId: null, + Angle: 0, + Color: 0, + Enabled: true, + FillMode: 0, + FireElementId: 0, + FixedSize: false, + Height: 32, + Width: 32, + Id: ObjectID.default.generate(), + ImageUrl: './assets/images/泡沫消防车.png', + InteractiveMode: 0, + MultiPoint: null, + Point: { + x: 1295, + y: 1237 + }, + Name: '水罐泡沫消防车', + FireTeamName: '龚州消防救援站', //所属消防队 + ReachTime: 15, //到场剩余时间 + WaterYield: '5t',//载水量 + Foam: '1t', //载泡沫 + PeopleNum: 6, //载人数 + Tonnage: '7t', //吨位 + Assignment: '供液', //执行任务 + LinkCar: '', //连接车辆 + WaterOccupy: '', //水源占用 + PropertyInfos: [ + { + Enabled: true, + Order: 0, + PhysicalUnit: '', + PropertyName: '名称/编号', + PropertyType: 0, + PropertyValue: '龚州消防救援站', + Required: false, + RuleName: '', + RuleValue: '', + Tag: '', + Visible: true + } + ], + Border: null, + DrawMode: null, + Thickness: 0, + IsFromBuilding: false, + GameMode: 2 + }, + { + TemplateId: null, + FloorId: null, + Angle: 0, + Color: 0, + Enabled: true, + FillMode: 0, + FireElementId: 0, + FixedSize: false, + Height: 32, + Width: 32, + Id: ObjectID.default.generate(), + ImageUrl: './assets/images/泡沫消防车.png', + InteractiveMode: 0, + MultiPoint: null, + Point: { + x: 1295, + y: 1237 + }, + Name: '水罐泡沫消防车', + FireTeamName: '龚州消防救援站', //所属消防队 + ReachTime: 15, //到场剩余时间 + WaterYield: '3t',//载水量 + Foam: '1t', //载泡沫 + PeopleNum: 6, //载人数 + Tonnage: '5t', //吨位 + Assignment: '供液', //执行任务 + LinkCar: '', //连接车辆 + WaterOccupy: '', //水源占用 + PropertyInfos: [ + { + Enabled: true, + Order: 0, + PhysicalUnit: '', + PropertyName: '名称/编号', + PropertyType: 0, + PropertyValue: '龚州消防救援站', + Required: false, + RuleName: '', + RuleValue: '', + Tag: '', + Visible: true + } + ], + Border: null, + DrawMode: null, + Thickness: 0, + IsFromBuilding: false, + GameMode: 2 + }, + { + TemplateId: null, + FloorId: null, + Angle: 0, + Color: 0, + Enabled: true, + FillMode: 0, + FireElementId: 0, + FixedSize: false, + Height: 32, + Width: 32, + Id: ObjectID.default.generate(), + ImageUrl: './assets/images/压缩空气泡沫消防车.png', + InteractiveMode: 0, + MultiPoint: null, + Point: { + x: 1295, + y: 1237 + }, + Name: '举高喷射消防车', + FireTeamName: '龚州消防救援站', //所属消防队 + ReachTime: 15, //到场剩余时间 + WaterYield: '18t',//载水量 + Foam: '2t', //载泡沫 + PeopleNum: 4, //载人数 + Tonnage: '20t', //吨位 + Assignment: '灭火', //执行任务 + LinkCar: '', //连接车辆 + WaterOccupy: '', //水源占用 + PropertyInfos: [ + { + Enabled: true, + Order: 0, + PhysicalUnit: '', + PropertyName: '名称/编号', + PropertyType: 0, + PropertyValue: '龚州消防救援站', + Required: false, + RuleName: '', + RuleValue: '', + Tag: '', + Visible: true + } + ], + Border: null, + DrawMode: null, + Thickness: 0, + IsFromBuilding: false, + GameMode: 2 + } + ] + + //开始绘制 + plot (e) { + + } + + bottomIsShow:boolean = false; //底部车辆信息是否展示 + rightIsShow:boolean = true; //右侧楼层是否展示 + rightSayIsShow:boolean = false; //右侧语音是否展示 + + //选择 车辆 + selectCar (e) { + console.log(e) + this.canvasData.selectCar = e + this.bottomIsShow = true + } + + //倒计时结束 + handleEvent (e,item) { + console.log(e,item) + } + + //关闭 底部车辆信息 + closeBottom () { + this.bottomIsShow = false + } + + //打开 右侧楼层 + openRight () { + this.rightIsShow = true + } + + //关闭 右侧楼层 + closeRight () { + this.rightIsShow = false + } + + //打开 关闭 右侧语音 + toggleSay () { + this.rightSayIsShow = !this.rightSayIsShow + } + + + } diff --git a/src/assets/images/direction.png b/src/assets/images/direction.png new file mode 100644 index 0000000000000000000000000000000000000000..46e0beceff445041959b8aaa5b4b96b405367dcd GIT binary patch literal 2132 zcmbVNc~nz(77h_)UqwI!48bZegsfzPfFTKsCLx8eNGTGMM~GQX9wfk6Q5NOcj!Idq zva}Wi)GCD*5mXdhkXm&jpn!!+ZP6)*!b(@DhLgO1%>ET0-+QD5vhP!qM#wC+B=X4iHL@b z58z-pDh7})iO5z1G1*+cFk335h>#({h#(ymav%pl0YWF2DKu0a4f)nD6`C8i(MZHw z6HrP+z9W^u;UO4GHGl~4C!&N{JQ+cv_+tYoWE{Z{fx}>lXbc67C7>`^DuzPEU=fQC z5{jl4rBS1qVT-Y#6%CmVf+{K+t<`G%wRnG}T8ze0C=@gXhsNPhkOfMUr2qvwltSaR z+Zk8taci%jJf9y|vbW z(ZGLce9&6M&r$*CXh5UPPz#}aqOFZ4Us|{isgTbXK4$nNW=7fD?p3)%>*c* z4pKv{;;wJ&hrx`Y%+dL}!HQU^%rVw6c;-gsSCzlC43)Q(I1KW)uJMV!Y)3fKYq!H? zby4b<$9#M@u5~TKKB+sD&L$W?-{<+FI`)~ft0%VBxA^Oq-f{J}wC#y)6PePXUnZ`P zU%!__yS@9s!BH_Qm+Q zcHg|K)?NF@+wH@DjIG6b;1oua7pzeQFqJ!(^38kNoXfP+j-U$>TLv;niZ=gy@R zv+m=++6R^F-EF~hN8DfD=iGjMMylj)LAuv@6`F3`w991EN}tvwn*@_}W`52_xS0j< z(cDIM_?-Gy&cj~Wjm#c1vzQCh*28s7YC~Vee6jbns^(|MkF4tc>E^Wg%UAQVuEPtg z>dK;qjMqb3;SGDQH&J-TUM_*u()kg;IFXslnfQR6QXL&`_S^Ao{RCO_Ruhv4Ww~=bn@Nx6rj-ZTPxUwU z=>E)0)|ZWT8#%|H?kxSO?qgPbitD}Q_1zf`SG7`()l8@R!e~T}t-R1}<)72P_c!f1 z*eBkUB;5U&aN($1;EO@xQ}uan+vYpeqWiK7>r{%8rzGi`tM zZcjcMwH)kk$g!IE!Rf9zY@pEtj^8#JICi(O2_>lA7ks`b2wz^Pk(_tzYAM$@kG%Ov zDfEPIpFT1ENW-e`{i7y4kKI<5WRH$v6qTl{{dmb6Y2HpPWx%f6Yu<0JoehxxSWwfnDvue1o6^Pd!oSKLjn8Fg>(&MTemxk;!g-pL5; z?f(>rJMG&@9U8NbjP8@Z!Bw=@qlmFwUevzuu?Mvmy)h#imeFjN@-LJSX| zQFuPS4EF9>&k6PUxhK?rMd~Gs4#ElfXYOpwH0E*~?Sf*Y+teezmQ+!jT(i_|HeOxXhEGDZBmxR=84_ literal 0 HcmV?d00001 diff --git a/src/assets/images/route.png b/src/assets/images/route.png new file mode 100644 index 0000000000000000000000000000000000000000..84452266f8986e02fc367841b8da59819f4f3094 GIT binary patch literal 1491 zcmaJ>eN5D59KPukWMMj;@tf3=ICb{=alN~?p)kDOAyE+TZo;OEmfi~#XnVFj?;sj8 zIM@`wadU)-h|%B{(J{k}TjnrRWJ~7!%+PJl`E@h<&_tA&%J@}GR1TknLe$=42wFjWCyfjfaEG- zDewX@P_?QTWLPXCqq4uqEXrHNNt$96<2Kfa5`<`rB_k^m6r~DaBE_IoR(bUAFOH*# z9N^JHdmfP&bb&H?LA4Hi)%kv@xVQbiC)$~%FWLXv`D4e1&Xn`43swqY=)kse;2*8kZIcUn7 zio_YkVl8CyC{#KWf)dQjdqS)l!-;|^!y{r4C#?joDDk)ktqs!){+IDgYr|g^1h^L% zT1b~*JxbCOV3@n-JBk}ZHQZudhD8x81x*SmKs9p(9)(}50Xe|24#1ESjFzJ9EaoKX z0LGS3B*wCUbkGvz1Qe6tc^00e<~s$4%j0y}Xp(d@tj*>2&_XuFx;=u;?M`5GRl^ij z2_$^W(DyLb{ah^P(t&7dx?j^O6J1bHrkR>irUem~D_(UcGP_V#16tUa6ED+H)B@1u z)ga)}H3b>WGbcYo16@o3hF}S-1lTD|V&n1KoDPg7SU}k%y98Sc9mWTq%HL3*!V?%r zFd>I4W&*GW2?}$t4gw=dz+g- zP~kl3aByCmFy)BF^1{trA=@9heB{EJg|CX!d+zO8?b~>eZalZKfZ(GW&`@J+`=lkw zGoxIrdtuwVl|OW6b=R8XYwxa1%09eeT*{1NJ6b($^`qb3)-f;I)Ny&yO%a~DXm}K*QhY@+7 zc(|YGNxr)9P}Z%S*?8uS`x9#i)+Zf(@6n?EucC7Ynp0m-6O-0XZteM#`Mt3H`jlU; zr*s{j6zlf=7*6YK@%b8jy-ECp1C}gv?dYU|I<)9s>GE^o=96x}l)dSAeW<_l<-)W3 zHRa)oYy0?$Jr~RSNBwkSS!LVEX&<>h2_;vwdq*CRJ))NuZ2qjsllJX7J#=B6!+ zg{yEML%2Q@MS4_JOJ6d#dVse!UZZV?u9r+NH9ak(#{^e#YqbJ)dqJ+rCv! zeKURay;pWl%-nmod0^Axl!Hss|KQ&#o8K|w>dF)KeZ8G*^g`{ToR;e5k6+q%DZTM# zbn4oi=98JH&Thf(wDmcXoZqcmb;i5ue7Vxr|69kbKBF9^XPsuRUD71Fz#!Ty78Y_)uw2T}0Yen6<7bjb$ooW2A Tg&w;z{+rEp=L;S4SJwOoTuCM? literal 0 HcmV?d00001 diff --git a/src/index.html b/src/index.html index ebc3ab9..b039ca4 100644 --- a/src/index.html +++ b/src/index.html @@ -2,7 +2,7 @@ - 实战指挥预案 + 智能实战指挥平台 From b34af8b0f3cb02e55fbd5c1b3670ee728eabf695 Mon Sep 17 00:00:00 2001 From: username <1105965053@qq.com> Date: Mon, 21 Sep 2020 18:33:48 +0800 Subject: [PATCH 3/6] =?UTF-8?q?[=E5=AE=8C=E5=96=84]=20css=E6=A0=B7?= =?UTF-8?q?=E5=BC=8F=E5=AE=8C=E5=96=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/ui/plan-assistance/plan-assistance.component.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/app/ui/plan-assistance/plan-assistance.component.html b/src/app/ui/plan-assistance/plan-assistance.component.html index 75c38b5..dfabde3 100644 --- a/src/app/ui/plan-assistance/plan-assistance.component.html +++ b/src/app/ui/plan-assistance/plan-assistance.component.html @@ -9,7 +9,7 @@

{{item.FireTeamName}}

已到场
-
+
From 2f037f8216279b204e89d76318824963c8ed73bd Mon Sep 17 00:00:00 2001 From: Shaojihao <55341701@qq.com> Date: Mon, 21 Sep 2020 18:46:45 +0800 Subject: [PATCH 4/6] =?UTF-8?q?[=E6=96=B0=E5=A2=9E]=E5=8D=B1=E5=8C=96?= =?UTF-8?q?=E5=93=81=E5=9F=BA=E6=9C=AC=E5=AE=8C=E6=88=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/pipes/boolean.pipe.ts | 11 + src/app/ui/dangerous/dangerous.component.html | 53 ++-- src/app/ui/dangerous/dangerous.component.scss | 65 ++++- src/app/ui/dangerous/dangerous.component.ts | 269 +++++++++++++++--- src/app/ui/dangerous/gis.html | 11 + .../ui/plan/collection-tools.component.html | 8 +- .../ui/plan/collection-tools.component.scss | 1 + src/app/ui/plan/collection-tools.component.ts | 6 +- src/app/ui/ui.module.ts | 6 +- 9 files changed, 338 insertions(+), 92 deletions(-) create mode 100644 src/app/ui/dangerous/gis.html diff --git a/src/app/pipes/boolean.pipe.ts b/src/app/pipes/boolean.pipe.ts index 56b7930..8604d14 100644 --- a/src/app/pipes/boolean.pipe.ts +++ b/src/app/pipes/boolean.pipe.ts @@ -1,5 +1,6 @@ import { Pipe, PipeTransform } from '@angular/core'; import { isno , PlanTypeEnum , AuditStatusEnum , PlanLevelEnum} from '../interface' +import {DomSanitizer} from '@angular/platform-browser' @Pipe({name: 'isno'}) export class IsnoPipe implements PipeTransform { transform(value: boolean): string { @@ -29,4 +30,14 @@ export class PlanLevel implements PipeTransform { transform(value: number): string { return PlanLevelEnum[value] } +} + +@Pipe({name: 'safeHtml'}) +export class SafeHtmlPipe implements PipeTransform { + constructor(private sanitizer: DomSanitizer) { + } + + transform(html) { + return this.sanitizer.bypassSecurityTrustHtml(html) + } } \ No newline at end of file diff --git a/src/app/ui/dangerous/dangerous.component.html b/src/app/ui/dangerous/dangerous.component.html index 5d15e2d..3a49d5b 100644 --- a/src/app/ui/dangerous/dangerous.component.html +++ b/src/app/ui/dangerous/dangerous.component.html @@ -7,7 +7,7 @@
- +
{{item.name}}
@@ -18,51 +18,36 @@ - - - - - - - - - - - - - - - - - - - - + + + + + + +
分类 查看详情
row 1, cell 1row 1, cell 2row 1, cell 1row 1, cell 2查看详情
row 1, cell 1row 1, cell 2row 1, cell 1row 1, cell 2查看详情
row 1, cell 1row 1, cell 2row 1, cell 1row 1, cell 2查看详情
{{item.name}}{{item.englishname}}{{item.molecularformula}}{{item.type}}查看详情
-
- -
+ -
-
-

name

+
+
+

{{detailNode.name}}

x
-
品名
-
理化属性
-
危害特性
-
灭火剂
-
储运注意事项
+
品名
+
理化属性
+
危害特性
+
灭火剂
+
储运注意事项
-
- +
+
diff --git a/src/app/ui/dangerous/dangerous.component.scss b/src/app/ui/dangerous/dangerous.component.scss index f68c763..3c70771 100644 --- a/src/app/ui/dangerous/dangerous.component.scss +++ b/src/app/ui/dangerous/dangerous.component.scss @@ -35,6 +35,28 @@ // flex: 20%; width: 16%; border-right: 1px solid #26b5fb; + div{ + white-space: nowrap;/*一行显示*/ + overflow: hidden;/*超出部分隐藏*/ + text-overflow: ellipsis;/*用...代替超出部分*/ + width: 100%; + height:46px; + line-height:46px; + letter-spacing: 3px; + font-size: 20px; + color: white; + // padding-left: 5px; + cursor: pointer; + span{ + margin-left: 6px; + } + } + div:hover{ + background-color: #e6963c; + } + .divselected{ + background-color: #e88108; + } } .rightbox{ width: 100%; @@ -73,14 +95,14 @@ border-bottom: 1px solid #26b5fb; width: 100%; } + tr:nth-child(2){ + margin-top: 8px; + } } } } - .size{ - width: 100%; - height: 100%; - } + .openDiv{ z-index: 3000; width:600px; @@ -94,12 +116,16 @@ background: #063659; opacity: 0.9; border: 1px solid #26b5fb; + div{ + float: left; + } .top{ width: 100%; height: 32px; line-height: 32px; text-align: center; - border-bottom: 1px solid #26b5fb; + border-bottom: 1px solid #ff4949; + font-size: 18px; position: relative; h4{ color: red; @@ -117,10 +143,11 @@ } .details{ width: 100%; - height: 100%; + height: 468px; + display: flex; .left{ height: 100%; - width: 24%; + flex: 2; border-right:1px solid #26b5fb; div{ width: 100%; @@ -135,7 +162,29 @@ background: #041f33; } } + .right{ + flex: 8; + height: 468px; + color: white; + letter-spacing: 2px; + padding: 5px 8px; + } } } } -} \ No newline at end of file +} + +.size{ + width: 100%; + height: 100%; + position: relative; + z-index: 100; +} +#selectedBox{ + width: 120px; + height: 20px; + position: absolute; + z-index: 101; + left: 6px; + top: 0; +} diff --git a/src/app/ui/dangerous/dangerous.component.ts b/src/app/ui/dangerous/dangerous.component.ts index 11c0e4e..3fe0e24 100644 --- a/src/app/ui/dangerous/dangerous.component.ts +++ b/src/app/ui/dangerous/dangerous.component.ts @@ -12,50 +12,139 @@ export class DangerousComponent implements OnInit { ngOnInit(): void { } - //地图范围圆圈 - circle = new AMap.Circle({ - center: [109.656839, 23.098685], - radius: 500, //半径 - strokeOpacity: 1, - fillOpacity: 0.4, - strokeStyle: 'dashed', - strokeDasharray: [10, 10], - // 线样式还支持 'dashed' - fillColor: '#1791fc', - zIndex: 50, - }) + selectedIndex = 0 + typedata = [ + {name:"爆炸品",details:[ + {name:"点火绳",englishname:"Det donating Cords",molecularformula:"无",type:"点火绳"}, + {name:"乙二硝胺",englishname:"Ethylene Dinitramine",molecularformula:"(CH2NHNO2)2",type:"炸药及爆炸性药品"}, + {name:"导爆锁",englishname:"Detonating Cords",molecularformula:"无",type:"起爆器材"} + ]}, + {name:"气体",details:[ + {name:"乙炔",englishname:"Acetylene",molecularformula:"C2H2",type:"易燃气体"}, + {name:"二氟氯甲烷",englishname:"Chlorodifluoromethane",molecularformula:"CHCF2",type:"非易燃无毒气体"}, + {name:"二氧化硫",englishname:"Sulfur die oxIde",molecularformula:"SO2",type:"毒性气体"} + ]}, + {name:"易燃液体",details:[ + {name:"2-乙基-1-丁烯",englishname:"2-Ethyl-1-butene",molecularformula:"CH3CH2(C2Hb)CCH2",type:"低闪点液体",content:[ + {data:"2-乙基-1-丁烯"}, + {data:"无色液体,不溶于水,能溶于乙醇丙酮和乙醚。相对密度:0.69(20℃) ,沸点:62℃ ,闪点:<-20℃, 自燃点:315℃"}, + {data:`易燃,遇热、明火、强氧化剂,均有引起燃烧爆炸的危险。
其蒸气能与空气形成爆炸性混合物,遇火星易爆炸。`}, + {data:"泡沫、二氧化碳、干粉、1211。"}, + {data:"储存于阴凉通风仓间内,仓温不超过30℃,远离火种、热源,防止阳光直射。应与硝酸等氧化剂分仓间储存。不宜久储,以防聚合变质。搬运时应轻装轻卸,防止包装破损。"}, + ]}, + {name:"2-乙基丁醛",englishname:"Diethyl Acetaldehyde",molecularformula:"C212 CHCHO",type:"中闪点液体",content:[ + {data:"2-乙基丁醛"}, + {data:`无色液体,不溶于水。能与乙醇、乙燃醚混溶。 + 相对密度:0.8164(20℃) + 凝固点:-89℃ + 沸点:116.8℃ + 闪点:21.1℃(开杯 + 爆炸极限:1.2%~7.7% + 蒸气压:1.827kPa(20℃)`}, + {data:`遇明火、高温、氧化剂,有引起燃烧爆 + 炸的危险。`}, + {data:`泡沫、干粉、二氧化碳、砂土。`}, + {data:`包装要密封。储存于阴凉通风 + 的仓间内,防止阳光直射,仓温不超过30℃,远离火 + 种、热源。应与酸类、氧化剂分仓间存放,切勿混储混 + 运。搬运时轻装轻卸,防止包装破损。不宜久储。若 + 触及皮肤,应及时用水冲洗。`}, + ]}, + {name:"乙二醇一乙醚",englishname:"Ethylene Glycol Monoethyl Ether",molecularformula:"CH2OHCH2OC2H5",type:"高闪点液体",content:[ + {data:`乙二醇一乙醚`}, + {data:`无色液体,几无气味。能与水和醇等 + 大多数有机溶剂混溶。稍有毒,空气中的最高容许浓 + 度为2.0×10-4。 + 相对密度:0.9360(15℃) + 凝固点:-70 + 沸点:135.1℃ + 闪点:43℃ + 自燃点:235℃ + 爆炸极限:1.8%~14% + 蒸气压:506.6Pa(20℃)`}, + {data:`遇明火、高温或氧化剂,有发生燃烧 + 的危险。`}, + {data:`泡沫、二氧化碳、砂土、干粉。`}, + {data:`储存于阴凉通风仓间内,远离火 + 种、热源。应与氧化剂分开堆放。包装要密封,防止损 + 耗和变质。搬运时轻装轻卸,保持包装完整`}, + ]} + ]}, + {name:"易燃固体",details:[ + {name:"N,N-二亚硝基五亚甲基四胺",englishname:"N,N- Dinitrosopentamethylene",molecularformula:"(CH2)(NO)2N",type:"一级易燃固体",content:[ + {data:`N,N-二亚硝基五亚甲基四胺`}, + {data:`淡黄色粉末或砂粒状固体。易燃,有毒。易溶于丙酮,略溶于醇,微溶于氯仿,不溶于乙醚及水。温度≥199℃时分解,与酸或酸雾接触,将迅速起火燃烧。 + 相对密度:1.4~1.4 + 熔点:200℃(分解)`}, + {data:`遇高温、明火或与酸(无机酸、有机酸)接触,容易引起剧烈燃烧。与氧化剂混和,能成为爆炸性混合物`}, + {data:"水、砂土。"}, + {data:"储存于阴凉通风干燥的库房内。远离火种及热源。严禁与无机酸、有机酸、碱性物质、氧化剂混储混运。要经常检查同库混放物质观其性能是否抵触。储存期最长不超过6个月(自出厂日起)。搬运时应轻装轻卸,防止摩擦、撞击引起燃烧"}, + ]}, + {name:"2,4-二亚硝基间苯二酚",englishname:"2,4- Dinitrosores",molecularformula:"C6H2(OH)2(NO)2",type:"二级易燃固体",content:[ + {data:`2,4-二亚硝基间苯二酚`}, + {data:`从50%乙醇中析出者,呈黄褐色叶片 + 状结晶。易溶于乙醚和苯,难溶于冷水和乙醇。遇铜铁和钴盐溶液,分别显褐色、黄绿色和黄褐色。受热剧烈分解。自甲醇及水中析出者,具有1个分子结晶水, + 不溶于水,其熔点为162~163℃ + 熔点:168℃ + 自燃点:115℃`}, + {data:`受热或与氧化剂接触,有燃烧爆炸的 + 危险。`}, + {data:`砂土、二氧化碳、雾状水。`}, + {data:`储存于阴凉通风仓间内。最高仓温不宜超过30℃。远离火种及热源。应与氧化剂分仓间存放,与金属粉末及酸类隔离堆放。搬运时应轻装轻卸,防止猛撞引起爆炸。`}, + ]}, + {name:"乙基膦",englishname:"Ethylphosphine",molecularformula:"C2H5PH2",type:"一级易于自燃物质",content:[ + {data:`乙基膦`}, + {data:`无色液体。遇水分解。 + 相对密度:<1 + 沸点:25℃`}, + {data:`在空气中能自燃,接触溴、氯和发烟 + 硝酸会发生爆炸。遇浓硫酸会燃烧`}, + {data:`干砂、干粉。禁止用水、泡沫`}, + {data:`储存于阴凉干燥仓间内。最高仓温不超过20℃。包装必须完整、密封,防止与空气接触。堆放时应与卤素、酸类、潮解性物质、氧化剂分开。远离火种、热源。搬运时轻装轻卸,保持包装完整。`}, + ]} + ]}, + {name:"氧化物和有机过氧化物",details:[ + {name:"三氟化溴",englishname:"Bromine Trifluoride",molecularformula:"BrF3",type:"一级氧化性物质"}, + {name:"三氧化铬(无水)",englishname:"Chromic Anhydride",molecularformula:"CrO3",type:"二级氧化性物质"}, + {name:"2,5-二甲基-2,5-双",englishname:"2,5- Dimethyl-2",molecularformula:"C16H30O4",type:"有机过氧化物"} + ]}, + {name:"毒性物质",details:[ + {name:"二氧化硒",englishname:"Selenium dioxide",molecularformula:"SeO2",type:"一级无机毒性物质"}, + {name:"一氯乙醛",englishname:"Chloroacetaldehyde",molecularformula:"C2H3OCl",type:"一级有机毒性物质"}, + {name:"一氧化铅",englishname:"Lead Oxide",molecularformula:"PbO",type:"二级无机毒性物质"} + ]}, + {name:"化学毒剂",details:[ + {name:"二氧二甲胺基氰磷酸乙酯化硒",englishname:"Tabun",molecularformula:"(CH3)2 NPOCNO2H5O",type:"化学毒剂"} + ]}, + {name:"生物战剂",details:[ + {name:"炭疽杆菌",englishname:"Bacillus Anthracis",molecularformula:"无",type:"生物战剂"} + ]}, + {name:"杂项危险物质",details:[ + {name:"乙二醇",englishname:"Ethylene Glycol",molecularformula:"HOCH2CH2OH",type:"杂项危险物质"} + ]}, + ] + + + num = 0 + clickNode(num){ + this.num = num + } + + + + + detaildata = this.typedata[0].details + selectedDiv(index,item){ + this.selectedIndex = index + this.detaildata = item.details + } //类型选择 istype = true//默认选择危化品类型 - typeSelect(type){ - if(type ==1 ){ - this.istype = true + if(type == 1){ + this.istype = true }else{ this.istype = false - - setTimeout(() => { - var satellite = new AMap.TileLayer.Satellite(); - var roadNet = new AMap.TileLayer.RoadNet(); - // 创建一个 icon - var viaMarker = new AMap.Marker({ - position: new AMap.LngLat(116.38,39.92), - // 将一张图片的地址设置为 icon - icon: '//a.amap.com/jsapi_demos/static/demo-center/icons/dir-via-marker.png', - // 设置了 icon 以后，设置 icon 的偏移量，以 icon 的 [center bottom] 为原点 - offset: new AMap.Pixel(-13, -30) - }); - this.map = new AMap.Map('size',{ - center: [109.656839, 23.098685],//中心点坐标 - zoom: 16, - layers:[ - satellite, - // roadNet - ] - }); - this.circle.setMap(this.map) - this.map.add([viaMarker]); - // this.map.setFitView([ circle ]) - }, 0); } } @@ -64,7 +153,107 @@ export class DangerousComponent implements OnInit { closeDiv(){ this.isOpen = false } - openDetails(){ + + detailNode = null + openDetails(item){ + this.detailNode = item this.isOpen = true + this.num = 0 } + + } + + +@Component({ + selector: 'app-gis', + templateUrl: './gis.html', + styleUrls: ['./dangerous.component.scss'] +}) +export class GisComponent implements OnInit { + + constructor() { } + map:any //地图 + ngOnInit(): void { + setTimeout(() => { + this.creatMap() + }, 0); + } + + markerIcon = new AMap.Icon({ + image:"//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png", + size: new AMap.Size(52, 52), //图标大小 + imageSize: new AMap.Size(26,36) + }) + //地图范围圆圈 + circle = new AMap.Circle({ + center: [109.660144, 23.100172], + radius: 500, //半径 + strokeOpacity: 1, + fillOpacity: 0.4, + strokeStyle: 'dashed', + strokeDasharray: [10, 10], + // 线样式还支持 'dashed' + fillColor: '#1791fc', + zIndex: 50, + }) + + creatMap(){ + var satellite = new AMap.TileLayer.Satellite(); + var roadNet = new AMap.TileLayer.RoadNet(); + + // 创建一个 icon + var startIcon = new AMap.Icon({ + // 图标尺寸 + // size: new AMap.Size(150, 60), + // 图标的取图地址 + image: '../../../assets/images/fire.png', + // // 图标所用图片大小 + imageSize: new AMap.Size(60, 60), + // // 图标取图偏移量 + // imageOffset: new AMap.Pixel(-9, -3) + }); + var viaMarker = new AMap.Marker({ + position: new AMap.LngLat(109.660144, 23.100172), + icon: startIcon, + offset: new AMap.Pixel(-20, -30) + }); + let marker1 = new AMap.Marker({ + icon: this.markerIcon, + position: [109.644436,23.101842], + offset: new AMap.Pixel(-7, -34) + }); + let marker2 = new AMap.Marker({ + icon: this.markerIcon, + position: [109.666768,23.104276], + offset: new AMap.Pixel(0, -20) + }); + let marker3 = new AMap.Marker({ + icon: this.markerIcon, + position: [109.660118,23.095472], + offset: new AMap.Pixel(-13, -8) + }); + + this.map = new AMap.Map('size',{ + center: [109.661536,23.098726],//中心点坐标 + zoom: 15.8, + layers:[ + satellite, + roadNet + ] + }); + this.circle.setMap(this.map);//增加范围圆圈 + this.map.add([viaMarker]);//火源标点 + marker1.setMap(this.map); + marker2.setMap(this.map); + marker3.setMap(this.map); + } + + //范围选择 + rangevalue = 500 + + rangeSelect(e){ + this.circle.setRadius(Number(this.rangevalue)) + this.circle.setMap(this.map);//增加范围圆圈 + } +} \ No newline at end of file diff --git a/src/app/ui/dangerous/gis.html b/src/app/ui/dangerous/gis.html new file mode 100644 index 0000000..c4a8e15 --- /dev/null +++ b/src/app/ui/dangerous/gis.html @@ -0,0 +1,11 @@ +
+
+ +
+
+ +
+
diff --git a/src/app/ui/plan/collection-tools.component.html b/src/app/ui/plan/collection-tools.component.html index 7cca24a..2fcbec8 100644 --- a/src/app/ui/plan/collection-tools.component.html +++ b/src/app/ui/plan/collection-tools.component.html @@ -225,17 +225,17 @@ - + {{node.name}} ({{node.children.length}}) - visibility + visibility - +