diff --git a/public/drawIcon.svg b/public/drawIcon.svg index 0639126..26ebc9a 100644 --- a/public/drawIcon.svg +++ b/public/drawIcon.svg @@ -96,4 +96,8 @@ + + + + diff --git a/rtss-proto-msg b/rtss-proto-msg index 4ce6d52..c3ebea5 160000 --- a/rtss-proto-msg +++ b/rtss-proto-msg @@ -1 +1 @@ -Subproject commit 4ce6d5206d9ac578adb4305df8cbff59746d8d2f +Subproject commit c3ebea56bd46e93f4bd5204bdc3966b5b9fb9d58 diff --git a/src/drawApp/graphics/FAS/FasFailureControlHostInteraction.ts b/src/drawApp/graphics/FAS/FasFailureControlHostInteraction.ts new file mode 100644 index 0000000..1de14d3 --- /dev/null +++ b/src/drawApp/graphics/FAS/FasFailureControlHostInteraction.ts @@ -0,0 +1,44 @@ +import * as pb_1 from 'google-protobuf'; +import { GraphicDataBase } from '../GraphicDataBase'; +import { + FasFailureControlHost, + IFasFailureControlHostData, +} from 'src/graphics/FAS/fireFailureControlHost/FasFailureControlHost'; +import { iscsGraphicData } from 'src/protos/iscs_graphic_data'; + +export class FasFailureControlHostData + extends GraphicDataBase + implements IFasFailureControlHostData +{ + constructor(data?: iscsGraphicData.FasFailureControlHost) { + let cctvButton; + if (data) { + cctvButton = data; + } else { + cctvButton = new iscsGraphicData.FasFailureControlHost({ + common: GraphicDataBase.defaultCommonInfo(FasFailureControlHost.Type), + }); + } + super(cctvButton); + } + + public get data(): iscsGraphicData.FasFailureControlHost { + return this.getData(); + } + + get code(): string { + return this.data.code; + } + set code(v: string) { + this.data.code = v; + } + clone(): FasFailureControlHostData { + return new FasFailureControlHostData(this.data.cloneMessage()); + } + copyFrom(data: FasFailureControlHostData): void { + pb_1.Message.copyInto(data.data, this.data); + } + eq(other: FasFailureControlHostData): boolean { + return pb_1.Message.equals(this.data, other.data); + } +} diff --git a/src/drawApp/iscsApp.ts b/src/drawApp/iscsApp.ts index 8c74311..a797413 100644 --- a/src/drawApp/iscsApp.ts +++ b/src/drawApp/iscsApp.ts @@ -32,6 +32,12 @@ import { getWebsocketUrl } from 'src/configs/UrlManage'; import { sync_data_message } from 'src/protos/sync_data_message'; import { useAuthStore } from 'src/stores/auth-store'; import { common } from 'src/protos/common'; +import { + FasFailureControlHost, + FasFailureControlHostTemplate, +} from 'src/graphics/FAS/fireFailureControlHost/FasFailureControlHost'; +import { FasFailureControlHostData } from './graphics/FAS/FasFailureControlHostInteraction'; +import { FasFailureControlHostDraw } from 'src/graphics/FAS/fireFailureControlHost/FasFailureContorlHostAssistant'; // import { getOnlyToken } from 'src/configs/TokenManage'; let drawApp: IDrawApp | null = null; @@ -67,6 +73,10 @@ export function initIscsDrawApp(): IDrawApp { const app = drawApp; initCommonDrawApp(app); new CCTVButtonDraw(app, new CCTVButtonTemplate(new CCTVButtonData())); + new FasFailureControlHostDraw( + app, + new FasFailureControlHostTemplate(new FasFailureControlHostData()) + ); app.addKeyboardListener( new KeyListener({ @@ -225,6 +235,13 @@ export async function loadDrawDatas(): Promise { ) { canvasProperty = fasOfPlatformAlarm.canvas; datas = loadCommonDrawDatas(fasOfPlatformAlarm); + fasOfPlatformAlarm.fasFailureControlHosts.forEach( + (fasFailureControlHost) => { + datas.push( + new FasFailureControlHostData(fasFailureControlHost) + ); + } + ); break; } } @@ -306,6 +323,14 @@ export function saveDrawDatas(app: IDrawApp) { app, fasOfPlatformAlarm ) as iscsGraphicData.FASOfPlatformAlarmStorage; + graphics.forEach((g) => { + if (g instanceof FasFailureControlHost) { + const fasFailureControlHostData = g.saveData(); + fasStorage.fasFailureControlHosts.push( + (fasFailureControlHostData as FasFailureControlHostData).data + ); + } + }); storage.fasOfPlatformAlarmStorages[i] = fasStorage; break; } diff --git a/src/graphics/FAS/fireFailureControlHost/FasFailureContorlHostAssistant.ts b/src/graphics/FAS/fireFailureControlHost/FasFailureContorlHostAssistant.ts new file mode 100644 index 0000000..7d814ba --- /dev/null +++ b/src/graphics/FAS/fireFailureControlHost/FasFailureContorlHostAssistant.ts @@ -0,0 +1,131 @@ +import { DisplayObject, FederatedMouseEvent, Point } from 'pixi.js'; +import { + AbsorbableLine, + AbsorbablePosition, + GraphicDrawAssistant, + GraphicInteractionPlugin, + GraphicTransformEvent, + IDrawApp, + JlGraphic, +} from 'jl-graphic'; +import { + IFasFailureControlHostData, + FasFailureControlHost, + FasFailureControlHostTemplate, +} from './FasFailureControlHost'; + +export class FasFailureControlHostDraw extends GraphicDrawAssistant< + FasFailureControlHostTemplate, + IFasFailureControlHostData +> { + _fasFailureControlHost: FasFailureControlHost | null = null; + constructor(app: IDrawApp, template: FasFailureControlHostTemplate) { + super( + app, + template, + 'svguse:../drawIcon.svg#icon-fas-failure-control-host', + '火灾故障控制主机' + ); + FasFailureControlHostInteraction.init(app); + } + + bind(): void { + super.bind(); + if (!this._fasFailureControlHost) { + this._fasFailureControlHost = this.graphicTemplate.new(); + this.container.addChild(this._fasFailureControlHost); + } + } + + public get fasFailureControlHost(): FasFailureControlHost { + if (!this._fasFailureControlHost) { + this._fasFailureControlHost = this.graphicTemplate.new(); + this.container.addChild(this._fasFailureControlHost); + } + return this._fasFailureControlHost; + } + + redraw(cp: Point): void { + this.fasFailureControlHost.position.copyFrom(cp); + } + onLeftUp(e: FederatedMouseEvent): void { + this.fasFailureControlHost.position.copyFrom( + this.toCanvasCoordinates(e.global) + ); + this.createAndStore(true); + } + prepareData(data: IFasFailureControlHostData): boolean { + data.transform = this.fasFailureControlHost.saveTransform(); + return true; + } + onEsc(): void { + this.finish(); + } +} + +/** + * 构建吸附线 + * @param fasFailureControlHost + */ +function buildAbsorbablePositions( + fasFailureControlHost: FasFailureControlHost +): AbsorbablePosition[] { + const aps: AbsorbablePosition[] = []; + const fasFailureControlHosts = + fasFailureControlHost.queryStore.queryByType( + FasFailureControlHost.Type + ); + const canvas = fasFailureControlHost.getCanvas(); + fasFailureControlHosts.forEach((item) => { + if (item.id === fasFailureControlHost.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 FasFailureControlHostInteraction extends GraphicInteractionPlugin { + static Name = 'fas_failure_control_host_transform'; + constructor(app: IDrawApp) { + super(FasFailureControlHostInteraction.Name, app); + } + static init(app: IDrawApp) { + return new FasFailureControlHostInteraction(app); + } + filter(...grahpics: JlGraphic[]): FasFailureControlHost[] | undefined { + return grahpics + .filter((g) => g.type === FasFailureControlHost.Type) + .map((g) => g as FasFailureControlHost); + } + bind(g: FasFailureControlHost): void { + g.eventMode = 'static'; + g.cursor = 'pointer'; + g.scalable = true; + g.rotatable = true; + g.on('transformstart', this.transformstart, this); + } + unbind(g: FasFailureControlHost): 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 fasFailureControlHost = target.getGraphic() as FasFailureControlHost; + fasFailureControlHost.getGraphicApp().setOptions({ + absorbablePositions: buildAbsorbablePositions(fasFailureControlHost), + }); + } +} diff --git a/src/graphics/FAS/fireFailureControlHost/FasFailureControlHost.json b/src/graphics/FAS/fireFailureControlHost/FasFailureControlHost.json new file mode 100644 index 0000000..4de970d --- /dev/null +++ b/src/graphics/FAS/fireFailureControlHost/FasFailureControlHost.json @@ -0,0 +1,21 @@ +{ + "frames": { + "normal.png": { + "frame": { "x": 0, "y": 0, "w": 32, "h": 53 }, + "rotated": false, + "trimmed": false, + "spriteSourceSize": { "x": 0, "y": 0, "w": 32, "h": 53 }, + "sourceSize": { "w": 32, "h": 53 }, + "anchor": { "x": 0.5, "y": 0.5 } + } + }, + "meta": { + "app": "https://www.codeandweb.com/texturepacker", + "version": "1.1", + "image": "FasFailureControlHost.png", + "format": "RGBA8888", + "size": { "w": 32, "h": 53 }, + "scale": "1", + "smartupdate": "$TexturePacker:SmartUpdate:e7620bd2d73cc0b3e2deea9704e7eefc:f129a1d9e4b9ba57720b3861c22b155b:eb2d421f7759984b7713aa4aa5354134$" + } +} diff --git a/src/graphics/FAS/fireFailureControlHost/FasFailureControlHost.png b/src/graphics/FAS/fireFailureControlHost/FasFailureControlHost.png new file mode 100644 index 0000000..c789ff6 Binary files /dev/null and b/src/graphics/FAS/fireFailureControlHost/FasFailureControlHost.png differ diff --git a/src/graphics/FAS/fireFailureControlHost/FasFailureControlHost.ts b/src/graphics/FAS/fireFailureControlHost/FasFailureControlHost.ts new file mode 100644 index 0000000..95b1bfb --- /dev/null +++ b/src/graphics/FAS/fireFailureControlHost/FasFailureControlHost.ts @@ -0,0 +1,70 @@ +import { GraphicData, JlGraphic, JlGraphicTemplate } from 'jl-graphic'; +import { Assets, Sprite, Spritesheet, Texture } from 'pixi.js'; +// import { iscsGraphicData } from 'src/protos/iscs_graphic_data'; +import FasFailureControlHostJson from './FasFailureControlHost.json'; +import FasFailureControlHostAssets from './FasFailureControlHost.png'; + +export interface IFasFailureControlHostData extends GraphicData { + get code(): string; + set code(v: string); +} + +interface FasFailureControlHostTextures { + normal: Texture; +} + +export class FasFailureControlHost extends JlGraphic { + static Type = 'FasFailureControlHost'; + _fasFailureControlHost: Sprite; + fasFailureControlHostTextures: FasFailureControlHostTextures; + __state = 0; + + constructor(fasFailureControlHostTextures: FasFailureControlHostTextures) { + super(FasFailureControlHost.Type); + this._fasFailureControlHost = new Sprite(); + this.fasFailureControlHostTextures = fasFailureControlHostTextures; + this._fasFailureControlHost.anchor.set(0.5); + this.addChild(this._fasFailureControlHost); + this._fasFailureControlHost.texture = + this.fasFailureControlHostTextures.normal; + } + get code(): string { + return this.datas.code; + } + get datas(): IFasFailureControlHostData { + return this.getDatas(); + } + + doRepaint(): void { + // this._fasFailureControlHost.texture = + // this.fasFailureControlHostTextures.normal; + } +} + +export class FasFailureControlHostTemplate extends JlGraphicTemplate { + fasFailureControlHostTextures?: FasFailureControlHostTextures; + constructor(dataTemplate: IFasFailureControlHostData) { + super(FasFailureControlHost.Type, { dataTemplate }); + this.loadAssets(); + } + new(): FasFailureControlHost { + if (this.fasFailureControlHostTextures) { + const g = new FasFailureControlHost(this.fasFailureControlHostTextures); + g.loadData(this.datas); + return g; + } + throw new Error('资源未加载/加载失败'); + } + async loadAssets(): Promise { + const texture = await Assets.load(FasFailureControlHostAssets); + const fasFailureControlHostSheet = new Spritesheet( + texture, + FasFailureControlHostJson + ); + const result = await fasFailureControlHostSheet.parse(); + this.fasFailureControlHostTextures = { + normal: result['normal.png'], + }; + return this.fasFailureControlHostTextures as FasFailureControlHostTextures; + } +} diff --git a/src/layouts/IscsDrawLayout.vue b/src/layouts/IscsDrawLayout.vue index ac4c9af..efaba86 100644 --- a/src/layouts/IscsDrawLayout.vue +++ b/src/layouts/IscsDrawLayout.vue @@ -306,6 +306,7 @@ import { Circle } from 'src/graphics/circle/Circle'; import IscsBottomAlarm from 'src/components/Iscs/IscsBottomAlarm.vue'; import CCTVMonitoring from 'src/components/Iscs/CCTVMonitoring.vue'; import FASPlaneGraph from 'src/components/Iscs/FASPlaneGraph.vue'; +import { FasFailureControlHost } from 'src/graphics/FAS/fireFailureControlHost/FasFailureControlHost'; const $q = useQuasar(); const route = useRoute(); @@ -388,6 +389,9 @@ function handleUtilsOption() { case '监控布局图': drawAssistantsTypes.push(CCTVButton.Type); break; + case '火灾报警平面图': + drawAssistantsTypes.push(FasFailureControlHost.Type); + break; } drawAssistantsTypes.forEach((type) => { const drawAssistant = drawStore.getDrawApp().getDrawAssistant(type); @@ -566,19 +570,16 @@ const showComponent = reactive({ }); function onHeaderResize(size: { height: number; width: number }) { - console.log(size, '11111'); headerHeight.value = size.height; onResize(); } function onFooterResize(size: { height: number; width: number }) { - console.log(size, '----'); footerHeight.value = size.height; onResize(); } function onRightResize(size: { height: number; width: number }) { - console.log(size, '==='); rightWidth.value = size.width; onResize(); } @@ -683,6 +684,11 @@ const subMenuOption = ref< >([]); function selectedSubMenu(subName: string) { drawStore.selectSubmenuAndStation.submenu = subName; + if (drawStore.selectSubmenuAndStation.submenu === '火灾报警平面图') { + drawStore.selectSubmenuAndStation.partition = '设备分区一'; + } else { + drawStore.selectSubmenuAndStation.partition = ''; + } subMenuDisplayForm.value = subMenuOption.value.find( (subMenu) => subMenu.value == subName ).displayForm;