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/plan-assistance/plan-assistance.component.ts b/src/app/ui/plan-assistance/plan-assistance.component.ts index e0f413c..631f3c9 100644 --- a/src/app/ui/plan-assistance/plan-assistance.component.ts +++ b/src/app/ui/plan-assistance/plan-assistance.component.ts @@ -1366,6 +1366,47 @@ export class PlanAssistanceComponent implements OnInit, AfterViewInit { } ]; + tempCarData = { + TemplateId: null, + FloorId: null, + Angle: 0, + Color: 0, + Enabled: true, + FillMode: 0, + FireElementId: 0, + FixedSize: true, + 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 { } diff --git a/src/app/working-area/working-area.component.ts b/src/app/working-area/working-area.component.ts index a75b04b..03ad560 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(); // 调用父组件 初始化方法 + }); } } // 是否登录 @@ -403,7 +403,102 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV 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: true, + 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 + }; + const tempCar = new SinglePointIcon(tempData, this); + tempCar.setParent(this.app.stage); + tempCar.position.set(300, 66); + + const tempData2 = { + TemplateId: null, + FloorId: null, + Angle: 0, + Color: 0, + Enabled: true, + FillMode: 0, + FireElementId: 0, + FixedSize: true, + 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 + }; + const tempCar2 = new SinglePointIcon(tempData2, this); + tempCar2.setParent(this.app.stage); + tempCar2.position.set(300, 148); + + this.cancelPaint(); + this.paintMode = PaintMode.connection; + this.previewSinglePointIcon.texture = PIXI.Texture.from('./assets/images/水罐消防车.png'); } /** * @@ -611,6 +706,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) { @@ -940,6 +1038,7 @@ enum PaintMode { polygonIcon, beginPainting, endPaint, + connection } /** * 单点图标 @@ -966,6 +1065,9 @@ export class SinglePointIcon extends PIXI.Container { + '\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 +1087,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 +1112,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; @@ -1536,9 +1646,11 @@ export class PolygonIcon extends PIXI.Container { } } -export class Line extends PIXI.Container { +export class Conection extends PIXI.Container { } + + /** * 选择器 */