列车驾驶台交互调整

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);
+      e.stopPropagation();
-    };
-    g.onmouseleave = (e) => {
       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;
+    useTccStore().mouseDownOnTccHandle = false;
-    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 });
-    });
   }
 }

src/drawApp/tccScene.ts

@@ -59,6 +59,9 @@ export function initTccScene(lineApp: IGraphicApp, sceneName: string) {
   };
   tccScene.canvas.onmouseup = () => {
     tccStore.canvasMouseDown = false;
+    if (tccStore.mouseDownOnTccHandle) {
+      tccStore.onMouseUpFromTccHandle();
+    }
   };
   lineApp.on('destroy', () => {
     tccScene.canvas.onmousedown = null;

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;
   }
 }

src/stores/tcc-store.ts

@@ -1,6 +1,11 @@
 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';
 
 export const useTccStore = defineStore('tcc', {
   state: () => ({
@@ -8,6 +13,8 @@ export const useTccStore = defineStore('tcc', {
     tccId: 0,
     isTccDialogOpen: false,
     canvasMouseDown: false,
+    mouseDownOnTccHandle: false,
+    tccHandleId: 0,
   }),
   actions: {
     getTccScene() {
@@ -30,5 +37,26 @@ 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 });
+      });
+    },
   },
 });