From afd27d4b3ebcc3943c0a53f073a062e2ac80ab05 Mon Sep 17 00:00:00 2001 From: joylink_fanyuhong <18706759286@163.com> Date: Tue, 22 Oct 2024 17:52:37 +0800 Subject: [PATCH] =?UTF-8?q?=E6=B6=88=E9=98=B2=E6=B3=B5=E4=BB=A3=E7=A0=81?= =?UTF-8?q?=E6=8F=90=E4=BA=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/drawIcon.svg | 9 ++ .../graphics/FAS/FirePumpInteraction.ts | 38 ++++++ src/drawApp/iscsApp.ts | 10 ++ src/graphics/FAS/firePump/FirePump.ts | 63 ++++++++++ .../FAS/firePump/FirePumpAssistant.ts | 115 ++++++++++++++++++ src/layouts/IscsDrawLayout.vue | 2 + 6 files changed, 237 insertions(+) create mode 100644 src/drawApp/graphics/FAS/FirePumpInteraction.ts diff --git a/public/drawIcon.svg b/public/drawIcon.svg index 81078a9..65cadd3 100644 --- a/public/drawIcon.svg +++ b/public/drawIcon.svg @@ -118,4 +118,13 @@ + + + + + + + + + diff --git a/src/drawApp/graphics/FAS/FirePumpInteraction.ts b/src/drawApp/graphics/FAS/FirePumpInteraction.ts new file mode 100644 index 0000000..ebee646 --- /dev/null +++ b/src/drawApp/graphics/FAS/FirePumpInteraction.ts @@ -0,0 +1,38 @@ +import * as pb_1 from 'google-protobuf'; +import { GraphicDataBase } from '../GraphicDataBase'; +import { FirePump, IFirePumpData } from 'src/graphics/FAS/firePump/FirePump'; +import { iscsGraphicData } from 'src/protos/iscs_graphic_data'; + +export class FirePumpData extends GraphicDataBase implements IFirePumpData { + constructor(data?: iscsGraphicData.FirePump) { + let firePump; + if (data) { + firePump = data; + } else { + firePump = new iscsGraphicData.FirePump({ + common: GraphicDataBase.defaultCommonInfo(FirePump.Type), + }); + } + super(firePump); + } + + public get data(): iscsGraphicData.FirePump { + return this.getData(); + } + + get code(): string { + return this.data.code; + } + set code(v: string) { + this.data.code = v; + } + clone(): FirePumpData { + return new FirePumpData(this.data.cloneMessage()); + } + copyFrom(data: FirePumpData): void { + pb_1.Message.copyInto(data.data, this.data); + } + eq(other: FirePumpData): boolean { + return pb_1.Message.equals(this.data, other.data); + } +} diff --git a/src/drawApp/iscsApp.ts b/src/drawApp/iscsApp.ts index c984482..c7738cc 100644 --- a/src/drawApp/iscsApp.ts +++ b/src/drawApp/iscsApp.ts @@ -65,6 +65,9 @@ import { EscalatorTemplate, } from 'src/graphics/BAS/escalator/Escalator'; import { EscalatorData } from './graphics/BAS/EscalatorInteraction'; +import { FirePump, FirePumpTemplate } from 'src/graphics/FAS/firePump/FirePump'; +import { FirePumpDraw } from 'src/graphics/FAS/firePump/FirePumpAssistant'; +import { FirePumpData } from './graphics/FAS/FirePumpInteraction'; // import { getOnlyToken } from 'src/configs/TokenManage'; let drawApp: IDrawApp | null = null; @@ -118,6 +121,7 @@ export function initIscsDrawApp(): IDrawApp { new TemperatureDetectorTemplate(new TemperatureDetectorData()) ); new FireShutterDraw(app, new FireShutterTemplate(new FireShutterData())); + new FirePumpDraw(app, new FirePumpTemplate(new FirePumpData())); app.addKeyboardListener( new KeyListener({ @@ -303,6 +307,9 @@ export async function loadDrawDatas(): Promise { fasOfPlatformAlarm.fireShutters.forEach((fireShutter) => { datas.push(new FireShutterData(fireShutter)); }); + fasOfPlatformAlarm.firePumps.forEach((firePump) => { + datas.push(new FirePumpData(firePump)); + }); break; } } @@ -442,6 +449,9 @@ export function saveDrawDatas(app: IDrawApp) { fasStorage.fireShutters.push( (fireShutterData as FireShutterData).data ); + } else if (g instanceof FirePump) { + const firePumpData = g.saveData(); + fasStorage.firePumps.push((firePumpData as FirePumpData).data); } }); storage.fasOfPlatformAlarmStorages[i] = fasStorage; diff --git a/src/graphics/FAS/firePump/FirePump.ts b/src/graphics/FAS/firePump/FirePump.ts index e69de29..af89a36 100644 --- a/src/graphics/FAS/firePump/FirePump.ts +++ b/src/graphics/FAS/firePump/FirePump.ts @@ -0,0 +1,63 @@ +import { GraphicData, JlGraphic, JlGraphicTemplate } from 'jl-graphic'; +import { Assets, Sprite, Spritesheet, Texture } from 'pixi.js'; +// import { iscsGraphicData } from 'src/protos/iscs_graphic_data'; +import FirePumpJson from './FirePump.json'; +import FirePumpAssets from './FirePump.png'; + +export interface IFirePumpData extends GraphicData { + get code(): string; + set code(v: string); +} + +interface FirePumpTextures { + normal: Texture; +} + +export class FirePump extends JlGraphic { + static Type = 'FirePump'; + _firePump: Sprite; + firePumpTextures: FirePumpTextures; + __state = 0; + + constructor(firePumpTextures: FirePumpTextures) { + super(FirePump.Type); + this._firePump = new Sprite(); + this.firePumpTextures = firePumpTextures; + this._firePump.anchor.set(0.5); + this.addChild(this._firePump); + this._firePump.texture = this.firePumpTextures.normal; + } + get code(): string { + return this.datas.code; + } + get datas(): IFirePumpData { + return this.getDatas(); + } + + doRepaint(): void {} +} + +export class FirePumpTemplate extends JlGraphicTemplate { + firePumpTextures?: FirePumpTextures; + constructor(dataTemplate: IFirePumpData) { + super(FirePump.Type, { dataTemplate }); + this.loadAssets(); + } + new(): FirePump { + if (this.firePumpTextures) { + const g = new FirePump(this.firePumpTextures); + g.loadData(this.datas); + return g; + } + throw new Error('资源未加载/加载失败'); + } + async loadAssets(): Promise { + const texture = await Assets.load(FirePumpAssets); + const firePumpSheet = new Spritesheet(texture, FirePumpJson); + const result = await firePumpSheet.parse(); + this.firePumpTextures = { + normal: result['normal.png'], + }; + return this.firePumpTextures as FirePumpTextures; + } +} diff --git a/src/graphics/FAS/firePump/FirePumpAssistant.ts b/src/graphics/FAS/firePump/FirePumpAssistant.ts index e69de29..6a5a79d 100644 --- a/src/graphics/FAS/firePump/FirePumpAssistant.ts +++ b/src/graphics/FAS/firePump/FirePumpAssistant.ts @@ -0,0 +1,115 @@ +import { DisplayObject, FederatedMouseEvent, Point } from 'pixi.js'; +import { + AbsorbableLine, + AbsorbablePosition, + GraphicDrawAssistant, + GraphicInteractionPlugin, + GraphicTransformEvent, + IDrawApp, + JlGraphic, +} from 'jl-graphic'; +import { IFirePumpData, FirePump, FirePumpTemplate } from './FirePump'; + +export class FirePumpDraw extends GraphicDrawAssistant< + FirePumpTemplate, + IFirePumpData +> { + _firePump: FirePump | null = null; + constructor(app: IDrawApp, template: FirePumpTemplate) { + super(app, template, 'svguse:../drawIcon.svg#icon-fire-pump', '消防泵'); + FirePumpInteraction.init(app); + } + + bind(): void { + super.bind(); + if (!this._firePump) { + this._firePump = this.graphicTemplate.new(); + this.container.addChild(this._firePump); + } + } + + public get firePump(): FirePump { + if (!this._firePump) { + this._firePump = this.graphicTemplate.new(); + this.container.addChild(this._firePump); + } + return this._firePump; + } + + redraw(cp: Point): void { + this.firePump.position.copyFrom(cp); + } + onLeftUp(e: FederatedMouseEvent): void { + this.firePump.position.copyFrom(this.toCanvasCoordinates(e.global)); + this.createAndStore(true); + } + prepareData(data: IFirePumpData): boolean { + data.transform = this.firePump.saveTransform(); + return true; + } + onEsc(): void { + this.finish(); + } +} + +/** + * 构建吸附线 + * @param firePump + */ +function buildAbsorbablePositions(firePump: FirePump): AbsorbablePosition[] { + const aps: AbsorbablePosition[] = []; + const firePumps = firePump.queryStore.queryByType(FirePump.Type); + const canvas = firePump.getCanvas(); + firePumps.forEach((item) => { + if (item.id === firePump.id) { + return; + } + const ala = new AbsorbableLine( + new Point(item.x, 0), + new Point(item.x, canvas.height) + ); + const alb = new AbsorbableLine( + new Point(0, item.y), + new Point(canvas.width, item.y) + ); + aps.push(ala); + aps.push(alb); + }); + + return aps; +} + +export class FirePumpInteraction extends GraphicInteractionPlugin { + static Name = 'fire_pump_transform'; + constructor(app: IDrawApp) { + super(FirePumpInteraction.Name, app); + } + static init(app: IDrawApp) { + return new FirePumpInteraction(app); + } + filter(...grahpics: JlGraphic[]): FirePump[] | undefined { + return grahpics + .filter((g) => g.type === FirePump.Type) + .map((g) => g as FirePump); + } + bind(g: FirePump): void { + g.eventMode = 'static'; + g.cursor = 'pointer'; + g.scalable = true; + g.rotatable = true; + g.on('transformstart', this.transformstart, this); + } + unbind(g: FirePump): void { + g.eventMode = 'none'; + g.scalable = false; + g.rotatable = false; + g.off('transformstart', this.transformstart, this); + } + transformstart(e: GraphicTransformEvent) { + const target = e.target as DisplayObject; + const firePump = target.getGraphic() as FirePump; + firePump.getGraphicApp().setOptions({ + absorbablePositions: buildAbsorbablePositions(firePump), + }); + } +} diff --git a/src/layouts/IscsDrawLayout.vue b/src/layouts/IscsDrawLayout.vue index 5caf7d6..26a5637 100644 --- a/src/layouts/IscsDrawLayout.vue +++ b/src/layouts/IscsDrawLayout.vue @@ -313,6 +313,7 @@ import { SmokeDetector } from 'src/graphics/FAS/smokeDetector/SmokeDetector'; import { Escalator } from 'src/graphics/BAS/escalator/Escalator'; import { TemperatureDetector } from 'src/graphics/FAS/temperatureDetector/TemperatureDetector'; import { FireShutter } from 'src/graphics/FAS/fireShutter/FireShutter'; +import { FirePump } from 'src/graphics/FAS/firePump/FirePump'; const $q = useQuasar(); const route = useRoute(); @@ -403,6 +404,7 @@ function handleUtilsOption() { drawAssistantsTypes.push(SmokeDetector.Type); drawAssistantsTypes.push(TemperatureDetector.Type); drawAssistantsTypes.push(FireShutter.Type); + drawAssistantsTypes.push(FirePump.Type); break; } drawAssistantsTypes.forEach((type) => {