diff --git a/src/app/canvas-share-data.service.ts b/src/app/canvas-share-data.service.ts index a1aa7ca..0bcbbde 100644 --- a/src/app/canvas-share-data.service.ts +++ b/src/app/canvas-share-data.service.ts @@ -1,23 +1,14 @@ import { Injectable } from '@angular/core'; -import {ReplaySubject} from "rxjs"; -import { Observable } from "rxjs"; +import {ReplaySubject} from 'rxjs'; +import { Observable } from 'rxjs'; @Injectable({ providedIn: 'root' }) export class CanvasShareDataService { + constructor() { } private _sendMessage: ReplaySubject = new ReplaySubject(1); GameMode: any; - /** * 向其他组件发送信息 * - * @param message 需要发送的信息 * @returns {Observavle} */ - public sendMessage(message: any){ - this._sendMessage.next(message); - } - public getMessage(): Observable { - return this._sendMessage.asObservable(); - } - constructor() { } - isChange = false; // 数据 是否改动 selectTemplateData: any; // 选择当前 模板数据 @@ -39,17 +30,6 @@ export class CanvasShareDataService { */ gameMode: GameMode = GameMode.BasicInformation; - // 处置节点 筛选出 匹配数据 匹配不到 return undefined - findDisposalNode (parentId:string=null, name:string=null) { - if (parentId && name) { //匹配 父id, name - let returnData = this.allDisposalNode.find(item=>{ return item.parentId === parentId && item.name === name }) - return returnData - } else { //匹配 id - let returnData = this.allDisposalNode.find(item=>{ return item.id === parentId }) - return returnData - } - } - facilityAssetsName = new Map([ [ '消防水池', '消防水池'], [ '疏散楼梯', '疏散楼梯'], @@ -81,6 +61,26 @@ export class CanvasShareDataService { [ '消防管网', '消防管网'], [ 'DCS控制室', 'DCS控制室'] ]); + + /** * 向其他组件发送信息 * + * @param message 需要发送的信息 * @returns {Observavle} */ + public sendMessage(message: any){ + this._sendMessage.next(message); + } + public getMessage(): Observable { + return this._sendMessage.asObservable(); + } + + // 处置节点 筛选出 匹配数据 匹配不到 return undefined + findDisposalNode (parentId:string=null, name:string=null) { + if (parentId && name) { //匹配 父id, name + let returnData = this.allDisposalNode.find(item=>{ return item.parentId === parentId && item.name === name }) + return returnData + } else { //匹配 id + let returnData = this.allDisposalNode.find(item=>{ return item.id === parentId }) + return returnData + } + } /** * 获取单位毗邻信息 */ @@ -663,7 +663,8 @@ export class AssetData { */ export enum GameMode { BasicInformation, - Assignment + Assignment, + Demo } /** * 填充模式 diff --git a/src/app/ui/dangerous/dangerous.component.html b/src/app/ui/dangerous/dangerous.component.html index 8a22dfe..5d15e2d 100644 --- a/src/app/ui/dangerous/dangerous.component.html +++ b/src/app/ui/dangerous/dangerous.component.html @@ -1,6 +1,70 @@
-
危化品类型
-
危化品分布
+
危化品类型
+
危化品分布
+
+
+ +
+
+ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
品名英文名分子式分类查看详情
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查看详情
+
+
+ +
+ +
+ +
+
+

name

+ +
x
+
+
+
+
品名
+
理化属性
+
危害特性
+
灭火剂
+
储运注意事项
+
+
+ +
+
+
diff --git a/src/app/ui/dangerous/dangerous.component.scss b/src/app/ui/dangerous/dangerous.component.scss index fe3b9a5..f68c763 100644 --- a/src/app/ui/dangerous/dangerous.component.scss +++ b/src/app/ui/dangerous/dangerous.component.scss @@ -1,17 +1,141 @@ .box{ width: 100%; height: 100%; - border: 1px solid red; + // border: 1px solid red; display: flex; flex-direction: column; .title{ flex: 2%; width: 100%; + padding-top: 10px; div{ display: inline-block; - width: 200px; - height: 80%; - border: #26b5fb; + width: 126px; + height: 35px; + line-height: 35px; + text-align: center; + border:1px solid #26b5fb; + color: white; + cursor: pointer; + } + .selectedBtn{ + background-color: #e88108; + } + } + .body{ + width: 99.9%; + height: 100%; + border:1px solid #26b5fb; + .type{ + width: 100%; + height: 100%; + display: flex; + .leftbox{ + height: 100%; + // flex: 20%; + width: 16%; + border-right: 1px solid #26b5fb; + } + .rightbox{ + width: 100%; + height: 100%; + table{ + width: 100%; + height: 100%; + tr{ + width: 100%; + display: flex; + height: 38px; + line-height: 38px; + th{ + text-align: center; + flex: 1; + color: #f7ba2a; + font-size: 20px; + height: 30px; + line-height: 30px; + } + td{ + text-align: center; + flex: 1; + color: white; + } + td:last-child{ + cursor: pointer; + color: #f0c398; + } + td:last-child:hover{ + color: #f7ba2a; + } + } + tr:first-child{ + margin-top:6px; + border-bottom: 1px solid #26b5fb; + width: 100%; + } + } + + } + } + .size{ + width: 100%; + height: 100%; + } + .openDiv{ + z-index: 3000; + width:600px; + height: 500px; + position: fixed; + left: 0; + top:0; + right: 0; + bottom: 0; + margin:auto; + background: #063659; + opacity: 0.9; + border: 1px solid #26b5fb; + .top{ + width: 100%; + height: 32px; + line-height: 32px; + text-align: center; + border-bottom: 1px solid #26b5fb; + position: relative; + h4{ + color: red; + } + .btn{ + width: 30px; + height: 30px; + position: absolute; + top: 0; + right: 0; + color: #919191; + cursor: pointer; + font-size: 18px; + } + } + .details{ + width: 100%; + height: 100%; + .left{ + height: 100%; + width: 24%; + border-right:1px solid #26b5fb; + div{ + width: 100%; + height: 33px; + line-height: 33px; + text-align: center; + color: #8aadce; + border-bottom:1px solid #999b9d ; + cursor: pointer; + } + div:hover{ + background: #041f33; + } + } + } } } } \ No newline at end of file diff --git a/src/app/ui/dangerous/dangerous.component.ts b/src/app/ui/dangerous/dangerous.component.ts index 6401696..11c0e4e 100644 --- a/src/app/ui/dangerous/dangerous.component.ts +++ b/src/app/ui/dangerous/dangerous.component.ts @@ -1,5 +1,5 @@ import { Component, OnInit } from '@angular/core'; - +declare var AMap: any; @Component({ selector: 'app-dangerous', templateUrl: './dangerous.component.html', @@ -8,8 +8,63 @@ import { Component, OnInit } from '@angular/core'; export class DangerousComponent implements OnInit { constructor() { } - + map:any //地图 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, + }) + //类型选择 + istype = true//默认选择危化品类型 + + typeSelect(type){ + 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); + } + + } + //查看详情框打开 + isOpen = false + closeDiv(){ + this.isOpen = false + } + openDetails(){ + this.isOpen = true } - } diff --git a/src/app/ui/plan-assistance/plan-assistance.component.ts b/src/app/ui/plan-assistance/plan-assistance.component.ts index e0f413c..e8e6fe6 100644 --- a/src/app/ui/plan-assistance/plan-assistance.component.ts +++ b/src/app/ui/plan-assistance/plan-assistance.component.ts @@ -22,7 +22,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048cae9d', @@ -49,7 +49,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048cae9e', @@ -76,7 +76,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048cae9f', @@ -103,7 +103,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caea0', @@ -130,7 +130,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caea1', @@ -157,7 +157,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caea2', @@ -184,7 +184,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caea3', @@ -211,7 +211,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caea4', @@ -238,7 +238,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caea5', @@ -265,7 +265,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caea6', @@ -292,7 +292,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caea7', @@ -319,7 +319,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caea8', @@ -346,7 +346,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caea9', @@ -373,7 +373,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caeaa', @@ -400,7 +400,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caeab', @@ -427,7 +427,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caeac', @@ -454,7 +454,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caead', @@ -481,7 +481,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caeae', @@ -508,7 +508,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caeaf', @@ -535,7 +535,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caeb0', @@ -562,7 +562,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caeb1', @@ -589,7 +589,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caeb2', @@ -616,7 +616,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caeb3', @@ -643,7 +643,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caeb4', @@ -670,7 +670,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caeb5', @@ -697,7 +697,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caeb6', @@ -724,7 +724,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caeb7', @@ -751,7 +751,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caeb8', @@ -778,7 +778,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caeb9', @@ -805,7 +805,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caeba', @@ -832,7 +832,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caebb', @@ -859,7 +859,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caebc', @@ -886,7 +886,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caebd', @@ -913,7 +913,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caebe', @@ -940,7 +940,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caebf', @@ -967,7 +967,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caec0', @@ -994,7 +994,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caec1', @@ -1021,7 +1021,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caec2', @@ -1048,7 +1048,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caec3', @@ -1075,7 +1075,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caec4', @@ -1102,7 +1102,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caec5', @@ -1129,7 +1129,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caec6', @@ -1156,7 +1156,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caec7', @@ -1183,7 +1183,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caec8', @@ -1210,7 +1210,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caec9', @@ -1237,7 +1237,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caeca', @@ -1264,7 +1264,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caecb', @@ -1291,7 +1291,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caecc', @@ -1318,7 +1318,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caecd', @@ -1345,7 +1345,7 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { Enabled: true, FillMode: 0, FireElementId: 0, - FixedSize: true, + FixedSize: false, Height: 32, Width: 32, Id: '5f67f92238f13cd2048caece', @@ -1366,11 +1366,52 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { } ]; + tempCarData = { + TemplateId: null, + FloorId: null, + Angle: 0, + Color: 0, + Enabled: true, + FillMode: 0, + FireElementId: 0, + FixedSize: false, + Height: 32, + Width: 32, + Id: '5f67f92238f13cd2048cae9d', + ImageUrl: './assets/images/泡沫消防车.png', + InteractiveMode: 0, + MultiPoint: null, + Point: { + x: 1295, + y: 1237 + }, + Name: '泡沫消防车', + 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 + }; ngOnInit(): void { } ngAfterViewInit(): void { - this.workingArea.loadDemoScene(this.demoData); + this.workingArea.loadDemoScene(this.demoData, 0.149); } } diff --git a/src/app/working-area/working-area.component.ts b/src/app/working-area/working-area.component.ts index a75b04b..79a0531 100644 --- a/src/app/working-area/working-area.component.ts +++ b/src/app/working-area/working-area.component.ts @@ -116,17 +116,17 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV const token = sessionStorage.getItem('token'); // 判断 是否登录状态 if (token) { // this.init.getAllLibrary() //获取素材库 - this.init.getAllBuildings() //获取所有建筑 - this.init.getAllFirePlan() //获取所有灾情 - this.init.getSitePlan() //调用父组件 初始化方法 + this.init.getAllBuildings(); // 获取所有建筑 + this.init.getAllFirePlan(); // 获取所有灾情 + this.init.getSitePlan(); // 调用父组件 初始化方法 } else { - this.token.login().then(res=>{ - this.init.params.companyId = sessionStorage.getItem('companyId') + this.token.login().then(res => { + this.init.params.companyId = sessionStorage.getItem('companyId'); // this.init.getAllLibrary() //获取素材库 - this.init.getAllBuildings() //获取所有建筑 - this.init.getAllFirePlan() //获取所有灾情 - this.init.getSitePlan() //调用父组件 初始化方法 - }) + this.init.getAllBuildings(); // 获取所有建筑 + this.init.getAllFirePlan(); // 获取所有灾情 + this.init.getSitePlan(); // 调用父组件 初始化方法 + }); } } // 是否登录 @@ -263,13 +263,16 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV if (item.assetData.FixedSize) { const data = 1 / scale; item.scale.set(data); + } else { + const data = 1 / scale; + item.text.scale.set(data); } } else if (item instanceof MultipointIcon) { const data = 1 / scale; - item.text.scale.set(scale); + item.text.scale.set(data); } else if (item instanceof PolygonIcon) { const data = 1 / scale; - item.text.scale.set(scale); + item.text.scale.set(data); } }); }); @@ -397,14 +400,111 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV /** * 加载测试界面 */ - public loadDemoScene(list: any[]) { + public loadDemoScene(list: any[], backgroundScale: number) { this.backgroundImage.texture = PIXI.Texture.from('./assets/images/demo.jpg'); + this.setBackgroundScale(backgroundScale); list.forEach(element => { const single = new SinglePointIcon(element, this); }); this.setNameVisible(false, GameMode.BasicInformation); - this.allowEdit = false; + this.allowEdit = true; + + + const tempData = { + TemplateId: null, + FloorId: null, + Angle: 0, + Color: 0, + Enabled: true, + FillMode: 0, + FireElementId: 0, + FixedSize: false, + Height: 45, + Width: 45, + Id: '5f67f92238f13cd2048cae9d', + ImageUrl: './assets/images/泡沫消防车.png', + InteractiveMode: 0, + MultiPoint: null, + Point: { + x: 1295, + y: 1237 + }, + Name: '', + 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 + }; + const tempCar = new Car(tempData, this); + tempCar.setParent(this.app.stage); + tempCar.position.set(25, 25); + + const tempData2 = { + TemplateId: null, + FloorId: null, + Angle: 0, + Color: 0, + Enabled: true, + FillMode: 0, + FireElementId: 0, + FixedSize: false, + Height: 45, + Width: 45, + Id: '5f67f92238f13cd2048cae9d', + ImageUrl: './assets/images/水罐消防车.png', + InteractiveMode: 0, + MultiPoint: null, + Point: { + x: 1295, + y: 1237 + }, + Name: '', + 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 + }; + const tempCar2 = new Car(tempData2, this); + tempCar2.setParent(this.app.stage); + tempCar2.position.set(25, 50); + + this.cancelPaint(); + this.paintMode = PaintMode.connection; + this.previewSinglePointIcon.texture = PIXI.Texture.from('./assets/images/水罐消防车.png'); } + /** * * @param id 图标ID @@ -611,6 +711,9 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV // this.backgroundImage.removeChild(this.paintingIcon); // } // this.paintingIcon = new PolygonIcon(this.paintPoints, this); + break; + case PaintMode.connection: + break; } } else if (!event.currentTarget.dragging && this.selection.isMultiselection === true) { @@ -686,7 +789,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV */ public destroyBackgroundImage(): void { this.app.stage.removeChild(this.backgroundImage); - this.removeAllListeners('backgroundScale'); + // this.removeAllListeners('backgroundScale'); } /** * 设置背景图缩放 @@ -940,6 +1043,7 @@ enum PaintMode { polygonIcon, beginPainting, endPaint, + connection } /** * 单点图标 @@ -962,10 +1066,13 @@ export class SinglePointIcon extends PIXI.Container { wordWrapWidth: 100, }); - private text = new PIXI.Text(this.assetData.Name + public text = new PIXI.Text(this.assetData.Name + '\r\n' + this.assetData.PropertyInfos?.find(item => item.PropertyName === '名称/编号')?.PropertyValue, this.style); private image = PIXI.Sprite.from(this.assetData.ImageUrl); + // 是否可以被链接 + canConnection: boolean; + constructor(public assetData: any, private workingArea: WorkingAreaComponent) { super(); this.workingArea.backgroundImage.addChild(this); @@ -985,10 +1092,10 @@ export class SinglePointIcon extends PIXI.Container { this.image.interactive = true; this.image .on('mousedown', event => { - console.log(this.assetData.Name); + console.log(this.assetData); event.stopPropagation(); this.workingArea.selection.selectOne(this); - if (this.workingArea.allowEdit) { + if (this.workingArea.allowEdit || this.assetData.GameMode === 2) { event.currentTarget.parent.data = event.data; event.currentTarget.parent.alpha = 0.5; event.currentTarget.parent.dragging = true; @@ -1010,6 +1117,14 @@ export class SinglePointIcon extends PIXI.Container { }) .on('mousemove', event => { if (event.currentTarget.parent.dragging) { + // 如果拖动过程中发现父对象不是背景图 + if (this.parent !== this.workingArea.backgroundImage) { + this.setParent(this.workingArea.backgroundImage); + if (this.assetData.FixedSize) { + const scale = 1 / this.workingArea.backgroundImage.scale.x; + this.scale.set(scale); + } + } const newPosition = event.currentTarget.parent.data.getLocalPosition(event.currentTarget.parent.parent); event.currentTarget.parent.x = newPosition.x; event.currentTarget.parent.y = newPosition.y; @@ -1535,10 +1650,14 @@ export class PolygonIcon extends PIXI.Container { this.polygonGraphics.endFill(); } } +export class Car extends SinglePointIcon { -export class Line extends PIXI.Container { +} +export class Conection extends PIXI.Container { } + + /** * 选择器 */