Squashed commit of the following:

commit bd73f65860 Author: joylink_zhaoerwei <Bob_Engineer@163.com> Date: Wed Apr 3 14:56:06 2024 +0800 列车驾驶台交互优化 commit e894f02e38 Author: joylink_zhaoerwei <Bob_Engineer@163.com> Date: Wed Apr 3 11:17:12 2024 +0800 列车驾驶台交互调整
2024-04-03 14:58:36 +08:00 · 2024-04-03 14:58:36 +08:00 · f6852212d8
commit f6852212d8
parent 64822d1ab0
5 changed files with 111 additions and 79 deletions
--- 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<TccHandle> {
    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<TccHandle> {
    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<TccHandle>();
    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<TccHandle> {
      }
    }
  }
-  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<TccHandle>();
-    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;
  }
 }
--- 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,44 +168,45 @@ 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;
+            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 !== changeRotation) {
-            this.lastTimenRotation = changeRotation;
-            this.keyInteractionConfig.doAfterChangeRotation(g, changeRotation);
        }
+        if (this.lastTimenRotation !== this.changeRotation) {
+          this.lastTimenRotation = this.changeRotation;
+          this.ratatingSprite.rotation = this.changeRotation;
        }
      } else {
        if (direction == 'ssz') {
@ -218,8 +227,8 @@ export class TccKeyInteraction extends KeyInteraction<TccKey> {
    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<TccKey> {
      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;
  }
 }

--- 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;
--- a/src/graphics/tccHandle/TccHandle.ts
+++ b/src/graphics/tccHandle/TccHandle.ts
@ -54,7 +54,7 @@ export class TccHandle extends JlGraphic {
    return this.getStates<ITccHandleState>();
  }
  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;
  }
 }
--- 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<TccHandle>(
+        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<TccKey>(
+        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 });
+      });
+    },
  },
 });