diff --git a/src/drawApp/graphics/TccHandleInteraction.ts b/src/drawApp/graphics/TccHandleInteraction.ts index 812429e..c625b47 100644 --- a/src/drawApp/graphics/TccHandleInteraction.ts +++ b/src/drawApp/graphics/TccHandleInteraction.ts @@ -10,10 +10,6 @@ import { state } from 'src/protos/device_state'; import { GraphicInteractionPlugin, IGraphicScene, JlGraphic } from 'jl-graphic'; import { type FederatedMouseEvent, DisplayObject } from 'pixi.js'; import { useTccStore } from 'src/stores/tcc-store'; -import { useLineStore } from 'src/stores/line-store'; -import { tccOperation } from 'src/api/Simulation'; -import { errorNotify } from 'src/utils/CommonNotify'; -import { request } from 'src/protos/request'; export class TccHandleData extends GraphicDataBase implements ITccHandleData { constructor(data?: tccGraphicData.TccHandle) { @@ -103,15 +99,15 @@ export class TccHandleInteraction extends GraphicInteractionPlugin { g._tccHandle.eventMode = 'static'; g._tccHandle.cursor = 'Move'; g._tccHandle.onmousedown = (e) => { + e.stopPropagation(); this.onMouseDown(e); }; g._tccHandle.onmouseup = (e) => { - this.onMouseUp(e); + e.stopPropagation(); + this.onMouseUp(); }; g.onmousemove = (e) => { - this.onMouseMove(e); - }; - g.onmouseleave = (e) => { + e.stopPropagation(); this.onMouseMove(e); }; } @@ -120,12 +116,13 @@ export class TccHandleInteraction extends GraphicInteractionPlugin { g._tccHandle.onmousedown = null; g._tccHandle.onmouseup = null; g.onmousemove = null; - g.onmouseleave = null; } onMouseDown(e: FederatedMouseEvent) { const target = e.target as DisplayObject; const tccHandle = target.getGraphic(); if (!tccHandle) return; + useTccStore().tccHandleId = tccHandle.id; + useTccStore().mouseDownOnTccHandle = true; this.isMouseDown = true; this.mouseDownBeginPos = e.clientY; this.mouseDownTccHandleBeginPos = tccHandle._tccHandle.y; @@ -149,25 +146,8 @@ export class TccHandleInteraction extends GraphicInteractionPlugin { } } } - onMouseUp(e: FederatedMouseEvent) { + onMouseUp() { this.isMouseDown = false; - const simulationId = useLineStore().simulationId; - const mapId = useLineStore().mapId; - const tccId = useTccStore().tccId; - const target = e.target as DisplayObject; - const tccHandle = target.getGraphic(); - if (!tccHandle || !simulationId || !mapId) return; - const handleVal = Math.floor(-(tccHandle._tccHandle.y / 144) * 100); - tccOperation({ - simulationId, - trainId: tccId + '', - deviceId: tccHandle.id, - controlType: request.TrainControl.TrainControlType.HANDLER, - handler: { - val: handleVal, - }, - }).catch((err) => { - errorNotify('操作失败', { message: err.origin.response.data.title }); - }); + useTccStore().mouseDownOnTccHandle = false; } } diff --git a/src/drawApp/graphics/TccKeyInteraction.ts b/src/drawApp/graphics/TccKeyInteraction.ts index 32e6059..25b61ea 100644 --- a/src/drawApp/graphics/TccKeyInteraction.ts +++ b/src/drawApp/graphics/TccKeyInteraction.ts @@ -96,7 +96,7 @@ export enum KeyRotationMethod { export interface IKeyInteractionConfig { gearPositionAmount?: number; keyRotationMethod: KeyRotationMethod; - doAfterChangeRotation: (g: JlGraphic, rotation: number) => void; + doAfterChangeRotation: () => void; } export abstract class KeyInteraction< G extends JlGraphic @@ -105,6 +105,7 @@ export abstract class KeyInteraction< ratatingSprite: Sprite = new Sprite(); mouseDownBeginPos = new Point(); mouseDownBeginRotation = 0; + changeRotation = 0; keyInteractionConfig: IKeyInteractionConfig; lastTimenRotation = 0; constructor( @@ -122,11 +123,17 @@ export abstract class KeyInteraction< g.onmouseup = (e) => { e.stopPropagation(); this.isMouseDown = false; + this.keyInteractionConfig.doAfterChangeRotation(); + }; + g.onmousedown = () => { + useTccStore().tccKeyDirId = g.id; + useTccStore().mouseDownOnTccKeyDir = true; }; } totalUnbind(g: G): void { g.onmousemove = null; g.onmouseup = null; + g.onmousedown = null; } keyBind(g: Sprite): void { this.ratatingSprite = g; @@ -147,6 +154,7 @@ export abstract class KeyInteraction< this.isMouseDown = true; this.mouseDownBeginPos = this.app.toCanvasCoordinates(e.global); this.mouseDownBeginRotation = this.ratatingSprite.rotation; + this.changeRotation = this.mouseDownBeginRotation; this.lastTimenRotation = this.ratatingSprite.rotation; } onMousemove(e: FederatedMouseEvent) { @@ -160,45 +168,46 @@ export abstract class KeyInteraction< g.position, mouseEndPos ); - let changeRotation = 0; if ( this.keyInteractionConfig.keyRotationMethod == KeyRotationMethod.jumpChange ) { if (direction == 'ssz') { if (angle < 45) { - changeRotation = this.mouseDownBeginRotation; - } - if ( + this.changeRotation = this.mouseDownBeginRotation; + } else if ( angle >= 45 && angle < 90 && this.mouseDownBeginRotation !== Math.PI / 4 ) { - changeRotation = this.mouseDownBeginRotation + Math.PI / 4; + this.changeRotation = this.mouseDownBeginRotation + Math.PI / 4; } else if ( angle >= 90 && this.mouseDownBeginRotation == -Math.PI / 4 ) { - changeRotation = this.mouseDownBeginRotation + Math.PI / 2; - } - if (this.lastTimenRotation !== changeRotation) { - this.lastTimenRotation = changeRotation; - this.keyInteractionConfig.doAfterChangeRotation(g, changeRotation); + this.changeRotation = this.mouseDownBeginRotation + Math.PI / 2; } } if (direction == 'nsz') { if (angle < 45) { - changeRotation = this.mouseDownBeginRotation; - } else if (angle >= 45 && angle < 90) { - changeRotation = this.mouseDownBeginRotation - Math.PI / 4; - } else if (angle >= 90 && changeRotation == Math.PI / 4) { - changeRotation = this.mouseDownBeginRotation - Math.PI / 2; - } - if (this.lastTimenRotation !== changeRotation) { - this.lastTimenRotation = changeRotation; - this.keyInteractionConfig.doAfterChangeRotation(g, changeRotation); + this.changeRotation = this.mouseDownBeginRotation; + } else if ( + angle >= 45 && + angle < 90 && + this.mouseDownBeginRotation !== -Math.PI / 4 + ) { + this.changeRotation = this.mouseDownBeginRotation - Math.PI / 4; + } else if ( + angle >= 90 && + this.mouseDownBeginRotation == Math.PI / 4 + ) { + this.changeRotation = this.mouseDownBeginRotation - Math.PI / 2; } } + if (this.lastTimenRotation !== this.changeRotation) { + this.lastTimenRotation = this.changeRotation; + this.ratatingSprite.rotation = this.changeRotation; + } } else { if (direction == 'ssz') { this.ratatingSprite.rotation = @@ -218,8 +227,8 @@ export class TccKeyInteraction extends KeyInteraction { super(TccKeyInteraction.Name, app, { gearPositionAmount: 3, keyRotationMethod: KeyRotationMethod.jumpChange, - doAfterChangeRotation: (g: JlGraphic, rotation: number) => { - this.changeState(g, rotation); + doAfterChangeRotation: () => { + this.changeState(); }, }); } @@ -276,34 +285,8 @@ export class TccKeyInteraction extends KeyInteraction { errorNotify('操作失败', { message: err.origin.response.data.title }); }); } - changeState(g: JlGraphic, rotation: number) { - let position = 0; - switch (rotation) { - case Math.PI / 4: - position = 0; - break; - case -Math.PI / 4: - position = 1; - break; - default: - position = 2; - break; - } - (g as TccKey).state.position = position; - const simulationId = useLineStore().simulationId; - const tccId = useTccStore().tccId; - if (!simulationId) return; - tccOperation({ - simulationId, - trainId: tccId + '', - deviceId: g.id, - controlType: request.TrainControl.TrainControlType.DIRECTION_KEY_SWITCH, - dirKey: { - val: position, - }, - }).catch((err) => { - errorNotify('操作失败', { message: err.origin.response.data.title }); - }); + changeState() { + useTccStore().mouseDownOnTccKeyDir = false; } } diff --git a/src/drawApp/tccScene.ts b/src/drawApp/tccScene.ts index c007eb9..1e5fb60 100644 --- a/src/drawApp/tccScene.ts +++ b/src/drawApp/tccScene.ts @@ -59,6 +59,14 @@ export function initTccScene(lineApp: IGraphicApp, sceneName: string) { }; tccScene.canvas.onmouseup = () => { tccStore.canvasMouseDown = false; + if (tccStore.mouseDownOnTccHandle) { + tccStore.onMouseUpFromTccHandle(); + tccStore.mouseDownOnTccHandle = false; + } + if (tccStore.mouseDownOnTccKeyDir) { + tccStore.onMouseUpFromTccKeyDir(); + tccStore.mouseDownOnTccKeyDir = false; + } }; lineApp.on('destroy', () => { tccScene.canvas.onmousedown = null; diff --git a/src/graphics/tccHandle/TccHandle.ts b/src/graphics/tccHandle/TccHandle.ts index c346e01..9a9ee93 100644 --- a/src/graphics/tccHandle/TccHandle.ts +++ b/src/graphics/tccHandle/TccHandle.ts @@ -54,7 +54,7 @@ export class TccHandle extends JlGraphic { return this.getStates(); } doRepaint(): void { - this._tccHandle.y = -Math.floor((this.state.gear * 144) / 100); + this._tccHandle.y = -(this.state.gear * 144) / 100; this._tccHandle.texture = this.tccHandleTextures.tccHandle; } } diff --git a/src/stores/tcc-store.ts b/src/stores/tcc-store.ts index 1b7c1de..77dad4b 100644 --- a/src/stores/tcc-store.ts +++ b/src/stores/tcc-store.ts @@ -1,6 +1,12 @@ import { defineStore } from 'pinia'; import { initTccScene } from 'src/drawApp/tccScene'; import { getLineApp } from 'src/drawApp/lineApp'; +import { useLineStore } from './line-store'; +import { tccOperation } from 'src/api/Simulation'; +import { errorNotify } from 'src/utils/CommonNotify'; +import { request } from 'src/protos/request'; +import { TccHandle } from 'src/graphics/tccHandle/TccHandle'; +import { TccKey } from 'src/graphics/tccKey/TccKey'; export const useTccStore = defineStore('tcc', { state: () => ({ @@ -8,6 +14,10 @@ export const useTccStore = defineStore('tcc', { tccId: 0, isTccDialogOpen: false, canvasMouseDown: false, + mouseDownOnTccHandle: false, + tccHandleId: 0, + mouseDownOnTccKeyDir: false, + tccKeyDirId: 0, }), actions: { getTccScene() { @@ -30,5 +40,56 @@ export const useTccStore = defineStore('tcc', { this.trainControlMapId = 0; this.isTccDialogOpen = false; }, + onMouseUpFromTccHandle() { + const simulationId = useLineStore().simulationId; + const tccHandle = this.getTccScene().queryStore.queryById( + this.tccHandleId + ); + if (!simulationId) return; + const handleVal = Number( + (-(tccHandle._tccHandle.y / 144) * 100).toFixed() + ); + tccOperation({ + simulationId, + trainId: this.tccId + '', + deviceId: this.tccHandleId, + controlType: request.TrainControl.TrainControlType.HANDLER, + handler: { + val: handleVal, + }, + }).catch((err) => { + errorNotify('操作失败', { message: err.origin.response.data.title }); + }); + }, + onMouseUpFromTccKeyDir() { + const tccKeyDir = this.getTccScene().queryStore.queryById( + this.tccKeyDirId + ); + let position = 0; + switch (tccKeyDir._tccKey.rotation) { + case Math.PI / 4: + position = 0; + break; + case -Math.PI / 4: + position = 1; + break; + default: + position = 2; + break; + } + const simulationId = useLineStore().simulationId; + if (!simulationId) return; + tccOperation({ + simulationId, + trainId: this.tccId + '', + deviceId: this.tccKeyDirId, + controlType: request.TrainControl.TrainControlType.DIRECTION_KEY_SWITCH, + dirKey: { + val: position, + }, + }).catch((err) => { + errorNotify('操作失败', { message: err.origin.response.data.title }); + }); + }, }, });