Compare commits
5 Commits
b5448207ba
...
bc6501efed
Author | SHA1 | Date | |
---|---|---|---|
|
bc6501efed | ||
|
d3e57cc444 | ||
|
5910740c65 | ||
|
b75bc9b9f0 | ||
|
a474415b9d |
@ -1 +1 @@
|
||||
Subproject commit f566f96c40882d7691c57de3f5c9989cde85b82c
|
||||
Subproject commit e64115ada314a096debd061cf54ee774f1091aa7
|
@ -184,6 +184,53 @@ export async function ibpKeyOperation(params: IbpKeyOperationParams) {
|
||||
return await api.post(`${UriBase}/ibp/key/operation`, params);
|
||||
}
|
||||
|
||||
export interface TccButtonOperationParams {
|
||||
buttonId: number;
|
||||
down: boolean;
|
||||
mapId: number;
|
||||
simulationId: string;
|
||||
tccId: number;
|
||||
}
|
||||
export async function tccButtonOperation(params: TccButtonOperationParams) {
|
||||
return await api.post(`${UriBase}/tcc/btn/operation`, params);
|
||||
}
|
||||
|
||||
export interface TccKeyOperationParams {
|
||||
simulationId: string;
|
||||
mapId: number;
|
||||
tccId: number;
|
||||
val: boolean;
|
||||
keyId: number;
|
||||
}
|
||||
|
||||
export async function tccKeyOperation(params: TccKeyOperationParams) {
|
||||
return await api.post(`${UriBase}/tcc/key/operation`, params);
|
||||
}
|
||||
|
||||
export interface TccKeyDirOperationParams {
|
||||
simulationId: string;
|
||||
mapId: number;
|
||||
tccId: number;
|
||||
val: number;
|
||||
keyId: number;
|
||||
}
|
||||
|
||||
export async function tccKeyDirOperation(params: TccKeyDirOperationParams) {
|
||||
return await api.post(`${UriBase}/tcc/key/operation`, params);
|
||||
}
|
||||
|
||||
export interface TccHandleOperationParams {
|
||||
simulationId: string;
|
||||
mapId: number;
|
||||
tccId: number;
|
||||
val: number;
|
||||
handleId: number;
|
||||
}
|
||||
|
||||
export async function tccHandleOperation(params: TccHandleOperationParams) {
|
||||
return await api.post(`${UriBase}/tcc/handle/operation`, params);
|
||||
}
|
||||
|
||||
export function checkMapData(data: { mapProto: string }) {
|
||||
return api.post(`${UriBase}/check/data`, data);
|
||||
}
|
||||
|
@ -14,6 +14,13 @@
|
||||
@blur="onUpdate"
|
||||
label="名称"
|
||||
/>
|
||||
<q-input
|
||||
outlined
|
||||
class="q-mt-sm"
|
||||
v-model.number="carWashingModel.duanNum"
|
||||
@blur="onUpdate"
|
||||
label="段数"
|
||||
/>
|
||||
<q-select
|
||||
outlined
|
||||
style="margin-top: 10px"
|
||||
|
@ -43,6 +43,12 @@ export class CarWashingData extends GraphicDataBase implements ICarWashingData {
|
||||
set centralizedStations(v: number[]) {
|
||||
this.data.centralizedStations = v;
|
||||
}
|
||||
get duanNum(): number {
|
||||
return this.data.duanNum;
|
||||
}
|
||||
set duanNum(v: number) {
|
||||
this.data.duanNum = v;
|
||||
}
|
||||
clone(): CarWashingData {
|
||||
return new CarWashingData(this.data.cloneMessage());
|
||||
}
|
||||
|
@ -11,6 +11,8 @@ import {
|
||||
ITccButtonState,
|
||||
TccButton,
|
||||
} from 'src/graphics/tccButton/TccButton';
|
||||
import { tccButtonOperation } from 'src/api/Simulation';
|
||||
import { errorNotify } from 'src/utils/CommonNotify';
|
||||
|
||||
export class TccButtonData extends GraphicDataBase implements ITccButtonData {
|
||||
constructor(data?: tccGraphicData.TccButton) {
|
||||
@ -112,11 +114,22 @@ export class TccButtonOperateInteraction extends GraphicInteractionPlugin<TccBut
|
||||
}
|
||||
|
||||
onClick(e: FederatedMouseEvent): void {
|
||||
const simulationId = useLineStore().simulationId;
|
||||
const mapId = useLineStore().mapId;
|
||||
const tccId = useTccStore().tccId;
|
||||
const target = e.target as DisplayObject;
|
||||
const tccButton = target.getGraphic<TccButton>();
|
||||
if (!tccButton) return;
|
||||
if (!tccButton || !simulationId || !mapId) return;
|
||||
tccButton.states.down = !tccButton.states.down;
|
||||
tccButton.doRepaint();
|
||||
console.log(tccButton.states.down);
|
||||
/* tccButtonOperation({
|
||||
simulationId,
|
||||
mapId,
|
||||
buttonId: tccButton.id,
|
||||
tccId,
|
||||
down: !tccButton.states.down,
|
||||
}).catch((err) => {
|
||||
errorNotify('操作失败', { message: err.origin.response.data.title });
|
||||
}); */
|
||||
}
|
||||
}
|
||||
|
@ -10,6 +10,9 @@ 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 { tccHandleOperation } from 'src/api/Simulation';
|
||||
import { errorNotify } from 'src/utils/CommonNotify';
|
||||
|
||||
export class TccHandleData extends GraphicDataBase implements ITccHandleData {
|
||||
constructor(data?: tccGraphicData.TccHandle) {
|
||||
@ -101,14 +104,14 @@ export class TccHandleInteraction extends GraphicInteractionPlugin<TccHandle> {
|
||||
g._tccHandle.onmousedown = (e) => {
|
||||
this.onMouseDown(e);
|
||||
};
|
||||
g._tccHandle.onmouseup = () => {
|
||||
this.isMouseDown = false;
|
||||
g._tccHandle.onmouseup = (e) => {
|
||||
this.onMouseUp(e);
|
||||
};
|
||||
g.onmousemove = (e) => {
|
||||
this.onMouseMove(e);
|
||||
};
|
||||
g.onmouseleave = () => {
|
||||
this.isMouseDown = false;
|
||||
g.onmouseleave = (e) => {
|
||||
this.onMouseMove(e);
|
||||
};
|
||||
}
|
||||
unbind(g: TccHandle): void {
|
||||
@ -132,6 +135,7 @@ export class TccHandleInteraction extends GraphicInteractionPlugin<TccHandle> {
|
||||
if (!tccHandle) return;
|
||||
if (
|
||||
this.isMouseDown &&
|
||||
useTccStore().canvasMouseDown &&
|
||||
tccHandle._tccHandle.y > -145 &&
|
||||
tccHandle._tccHandle.y < 145
|
||||
) {
|
||||
@ -144,4 +148,23 @@ export class TccHandleInteraction extends GraphicInteractionPlugin<TccHandle> {
|
||||
}
|
||||
}
|
||||
}
|
||||
onMouseUp(e: FederatedMouseEvent) {
|
||||
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;
|
||||
tccHandle.doRepaint();
|
||||
/* tccHandleOperation({
|
||||
simulationId,
|
||||
mapId,
|
||||
handleId: tccHandle.id,
|
||||
tccId,
|
||||
val: tccHandle._tccHandle.y,
|
||||
}).catch((err) => {
|
||||
errorNotify('操作失败', { message: err.origin.response.data.title });
|
||||
}); */
|
||||
}
|
||||
}
|
||||
|
@ -4,8 +4,17 @@ import { tccGraphicData } from 'src/protos/tccGraphics';
|
||||
import { GraphicDataBase, GraphicStateBase } from './GraphicDataBase';
|
||||
import { state } from 'src/protos/device_state';
|
||||
import { GraphicInteractionPlugin, IGraphicScene, JlGraphic } from 'jl-graphic';
|
||||
import { type FederatedMouseEvent, DisplayObject, Point } from 'pixi.js';
|
||||
import {
|
||||
type FederatedMouseEvent,
|
||||
DisplayObject,
|
||||
Point,
|
||||
Sprite,
|
||||
} from 'pixi.js';
|
||||
import { useTccStore } from 'src/stores/tcc-store';
|
||||
import { threadId } from 'worker_threads';
|
||||
import { useLineStore } from 'src/stores/line-store';
|
||||
import { tccKeyDirOperation, tccKeyOperation } from 'src/api/Simulation';
|
||||
import { errorNotify } from 'src/utils/CommonNotify';
|
||||
|
||||
export class TccKeyData extends GraphicDataBase implements ITccKeyData {
|
||||
constructor(data?: tccGraphicData.TccKey) {
|
||||
@ -80,13 +89,144 @@ export class TccKeyState extends GraphicStateBase implements ITccKeyState {
|
||||
}
|
||||
}
|
||||
|
||||
export class TccKeyInteraction extends GraphicInteractionPlugin<TccKey> {
|
||||
static Name = 'TccKeyInteraction';
|
||||
export enum KeyRotationMethod {
|
||||
jumpChange,
|
||||
gradientChange,
|
||||
}
|
||||
export interface IKeyInteractionConfig {
|
||||
gearPositionAmount?: number;
|
||||
keyRotationMethod: KeyRotationMethod;
|
||||
doAfterChangeRotation: (g: JlGraphic, rotation: number) => void;
|
||||
doFinish: () => void;
|
||||
}
|
||||
export abstract class KeyInteraction<
|
||||
G extends JlGraphic
|
||||
> extends GraphicInteractionPlugin<G> {
|
||||
isMouseDown = false;
|
||||
changeOnce = false;
|
||||
ratatingSprite: Sprite = new Sprite();
|
||||
mouseDownBeginPos = new Point();
|
||||
mouseDownBeginRotation = 0;
|
||||
keyInteractionConfig: IKeyInteractionConfig;
|
||||
constructor(
|
||||
name: string,
|
||||
app: IGraphicScene,
|
||||
keyInteractionConfig: IKeyInteractionConfig
|
||||
) {
|
||||
super(name, app);
|
||||
this.keyInteractionConfig = keyInteractionConfig;
|
||||
}
|
||||
totalBind(g: G): void {
|
||||
g.onmousemove = (e) => {
|
||||
this.onMousemove(e);
|
||||
};
|
||||
g.onmouseup = (e) => {
|
||||
e.stopPropagation();
|
||||
this.isMouseDown = false;
|
||||
this.keyInteractionConfig.doFinish();
|
||||
};
|
||||
}
|
||||
totalUnbind(g: G): void {
|
||||
g.onmousemove = null;
|
||||
g.onmouseup = null;
|
||||
}
|
||||
keyBind(g: Sprite): void {
|
||||
this.ratatingSprite = g;
|
||||
g.eventMode = 'static';
|
||||
g.cursor = 'pointer';
|
||||
g.onmousedown = (e) => {
|
||||
this.onMouseDown(e);
|
||||
};
|
||||
}
|
||||
keyUnbind(g: Sprite): void {
|
||||
g.eventMode = 'none';
|
||||
g.onmousedown = null;
|
||||
}
|
||||
onMouseDown(e: FederatedMouseEvent) {
|
||||
const target = e.target as DisplayObject;
|
||||
const g = target.getGraphic<G>();
|
||||
if (!g) return;
|
||||
this.isMouseDown = true;
|
||||
this.mouseDownBeginPos = this.app.toCanvasCoordinates(e.global);
|
||||
this.mouseDownBeginRotation = this.ratatingSprite.rotation;
|
||||
}
|
||||
onMousemove(e: FederatedMouseEvent) {
|
||||
const target = e.target as DisplayObject;
|
||||
const g = target.getGraphic<G>();
|
||||
if (!g) return;
|
||||
if (this.isMouseDown && useTccStore().canvasMouseDown) {
|
||||
const mouseEndPos = this.app.toCanvasCoordinates(e.global);
|
||||
const { angle, direction } = calculateAngleAndDirection(
|
||||
this.mouseDownBeginPos,
|
||||
g.position,
|
||||
mouseEndPos
|
||||
);
|
||||
if (
|
||||
this.keyInteractionConfig.keyRotationMethod ==
|
||||
KeyRotationMethod.jumpChange
|
||||
) {
|
||||
if (direction == 'ssz') {
|
||||
if (angle < 45) {
|
||||
this.ratatingSprite.rotation = this.mouseDownBeginRotation;
|
||||
}
|
||||
if (angle >= 45 && angle < 90) {
|
||||
this.ratatingSprite.rotation =
|
||||
this.mouseDownBeginRotation + Math.PI / 4;
|
||||
} else if (
|
||||
angle >= 90 &&
|
||||
this.mouseDownBeginRotation == -Math.PI / 4
|
||||
) {
|
||||
this.ratatingSprite.rotation =
|
||||
this.mouseDownBeginRotation + Math.PI / 2;
|
||||
}
|
||||
this.keyInteractionConfig.doAfterChangeRotation(
|
||||
g,
|
||||
this.ratatingSprite.rotation
|
||||
);
|
||||
}
|
||||
if (direction == 'nsz') {
|
||||
if (angle < 45) {
|
||||
this.ratatingSprite.rotation = this.mouseDownBeginRotation;
|
||||
} else if (angle >= 45 && angle < 90) {
|
||||
this.ratatingSprite.rotation =
|
||||
this.mouseDownBeginRotation - Math.PI / 4;
|
||||
} else if (
|
||||
angle >= 90 &&
|
||||
this.mouseDownBeginRotation == Math.PI / 4
|
||||
) {
|
||||
this.ratatingSprite.rotation =
|
||||
this.mouseDownBeginRotation - Math.PI / 2;
|
||||
}
|
||||
this.keyInteractionConfig.doAfterChangeRotation(
|
||||
g,
|
||||
this.ratatingSprite.rotation
|
||||
);
|
||||
}
|
||||
} else {
|
||||
if (direction == 'ssz') {
|
||||
this.ratatingSprite.rotation =
|
||||
this.mouseDownBeginRotation + (angle / 180) * Math.PI;
|
||||
} else {
|
||||
this.ratatingSprite.rotation =
|
||||
this.mouseDownBeginRotation - (angle / 180) * Math.PI;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export class TccKeyInteraction extends KeyInteraction<TccKey> {
|
||||
static Name = 'TccKeyInteraction';
|
||||
constructor(app: IGraphicScene) {
|
||||
super(TccKeyInteraction.Name, app);
|
||||
super(TccKeyInteraction.Name, app, {
|
||||
gearPositionAmount: 3,
|
||||
keyRotationMethod: KeyRotationMethod.jumpChange,
|
||||
doAfterChangeRotation: (g: JlGraphic, rotation: number) => {
|
||||
this.changeState(g, rotation);
|
||||
},
|
||||
doFinish: () => {
|
||||
this.onFinish();
|
||||
},
|
||||
});
|
||||
}
|
||||
static init(app: IGraphicScene) {
|
||||
return new TccKeyInteraction(app);
|
||||
@ -103,20 +243,8 @@ export class TccKeyInteraction extends GraphicInteractionPlugin<TccKey> {
|
||||
) {
|
||||
g._tccKey.on('_leftclick', this.onClick);
|
||||
} else {
|
||||
g._tccKey.onmousedown = (e) => {
|
||||
this.onMouseDown(e);
|
||||
};
|
||||
g._tccKey.onmouseup = () => {
|
||||
this.isMouseDown = false;
|
||||
this.changeOnce = false;
|
||||
};
|
||||
g.onmousemove = (e) => {
|
||||
this.onMousemove(e);
|
||||
};
|
||||
g.onmouseleave = () => {
|
||||
this.isMouseDown = false;
|
||||
this.changeOnce = false;
|
||||
};
|
||||
super.totalBind(g);
|
||||
super.keyBind(g._tccKey);
|
||||
}
|
||||
}
|
||||
unbind(g: TccKey): void {
|
||||
@ -127,61 +255,59 @@ export class TccKeyInteraction extends GraphicInteractionPlugin<TccKey> {
|
||||
) {
|
||||
g._tccKey.off('_leftclick', this.onClick);
|
||||
} else {
|
||||
g._tccKey.onmousedown = null;
|
||||
g._tccKey.onmouseup = null;
|
||||
g.onmousemove = null;
|
||||
g.onmouseleave = null;
|
||||
super.totalUnbind(g);
|
||||
super.keyUnbind(g._tccKey);
|
||||
}
|
||||
}
|
||||
onClick(e: FederatedMouseEvent): void {
|
||||
const simulationId = useLineStore().simulationId;
|
||||
const mapId = useLineStore().mapId;
|
||||
const tccId = useTccStore().tccId;
|
||||
const target = e.target as DisplayObject;
|
||||
const tccKey = target.getGraphic<TccKey>();
|
||||
if (!tccKey) return;
|
||||
if (!tccKey || !simulationId || !mapId) return;
|
||||
tccKey.state.position = tccKey?.state.position == 0 ? 1 : 0;
|
||||
tccKey.doRepaint();
|
||||
/* tccKeyOperation({
|
||||
simulationId,
|
||||
mapId,
|
||||
keyId: tccKey.id,
|
||||
tccId,
|
||||
val: !tccKey.state.position,
|
||||
}).catch((err) => {
|
||||
errorNotify('操作失败', { message: err.origin.response.data.title });
|
||||
}); */
|
||||
}
|
||||
onMouseDown(e: FederatedMouseEvent) {
|
||||
const target = e.target as DisplayObject;
|
||||
const tccKey = target.getGraphic<TccKey>();
|
||||
if (!tccKey) return;
|
||||
this.isMouseDown = true;
|
||||
this.mouseDownBeginPos = tccKey
|
||||
.getGraphicApp()
|
||||
.getScene('tcc')
|
||||
.toCanvasCoordinates(e.global);
|
||||
}
|
||||
onMousemove(e: FederatedMouseEvent) {
|
||||
const target = e.target as DisplayObject;
|
||||
const tccKey = target.getGraphic<TccKey>();
|
||||
if (!tccKey) return;
|
||||
if (this.isMouseDown) {
|
||||
const mouseEndPos = tccKey
|
||||
.getGraphicApp()
|
||||
.getScene('tcc')
|
||||
.toCanvasCoordinates(e.global);
|
||||
const { angle, direction } = calculateAngleAndDirection(
|
||||
this.mouseDownBeginPos,
|
||||
tccKey.position,
|
||||
mouseEndPos
|
||||
);
|
||||
if (
|
||||
direction == 'ssz' &&
|
||||
((angle > 45 && !this.changeOnce) || (angle > 90 && this.changeOnce)) &&
|
||||
(tccKey._tccKey.rotation == -Math.PI / 4 ||
|
||||
tccKey._tccKey.rotation == 0)
|
||||
) {
|
||||
this.changeOnce = true;
|
||||
tccKey._tccKey.rotation += Math.PI / 4;
|
||||
}
|
||||
if (
|
||||
direction == 'nsz' &&
|
||||
((angle > 45 && !this.changeOnce) || (angle > 90 && this.changeOnce)) &&
|
||||
(tccKey._tccKey.rotation == Math.PI / 4 || tccKey._tccKey.rotation == 0)
|
||||
) {
|
||||
this.changeOnce = true;
|
||||
tccKey._tccKey.rotation -= Math.PI / 4;
|
||||
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;
|
||||
g.doRepaint();
|
||||
}
|
||||
onFinish() {
|
||||
const simulationId = useLineStore().simulationId;
|
||||
const mapId = useLineStore().mapId;
|
||||
const tccId = useTccStore().tccId;
|
||||
if (!simulationId || !mapId) return;
|
||||
/* tccKeyDirOperation({
|
||||
simulationId,
|
||||
mapId,
|
||||
keyId: g.id,
|
||||
tccId,
|
||||
val: (g as TccKey).state.position,
|
||||
}).catch((err) => {
|
||||
errorNotify('操作失败', { message: err.origin.response.data.title });
|
||||
}); */
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -53,6 +53,17 @@ export function initTccScene(lineApp: IGraphicApp, sceneName: string) {
|
||||
tccScene.on('postdataloaded', () => {
|
||||
handleSubscribe(tccScene);
|
||||
});
|
||||
const tccStore = useTccStore();
|
||||
tccScene.canvas.onmousedown = () => {
|
||||
tccStore.canvasMouseDown = true;
|
||||
};
|
||||
tccScene.canvas.onmouseup = () => {
|
||||
tccStore.canvasMouseDown = false;
|
||||
};
|
||||
lineApp.on('destroy', () => {
|
||||
tccScene.canvas.onmousedown = null;
|
||||
tccScene.canvas.onmouseup = null;
|
||||
});
|
||||
return tccScene;
|
||||
}
|
||||
|
||||
|
@ -15,6 +15,8 @@ export interface ICarWashingData extends GraphicData {
|
||||
set linkSection(v: number);
|
||||
get centralizedStations(): number[];
|
||||
set centralizedStations(v: number[]);
|
||||
get duanNum(): number;
|
||||
set duanNum(v: number);
|
||||
clone(): ICarWashingData;
|
||||
copyFrom(data: ICarWashingData): void;
|
||||
eq(other: ICarWashingData): boolean;
|
||||
|
@ -49,6 +49,7 @@ export class CarWashingDraw extends GraphicDrawAssistant<
|
||||
prepareData(data: ICarWashingData): boolean {
|
||||
data.transform = this.container.saveTransform();
|
||||
data.code = 'CarWash';
|
||||
data.duanNum = 3;
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
@ -66,6 +66,17 @@ export class TccKey extends JlGraphic {
|
||||
this._tccKey.rotation =
|
||||
this.state.position == 0 ? Math.PI / 4 : -Math.PI / 4;
|
||||
} else {
|
||||
switch (this.state.position) {
|
||||
case 0:
|
||||
this._tccKey.rotation = Math.PI / 4;
|
||||
break;
|
||||
case 1:
|
||||
this._tccKey.rotation = -Math.PI / 4;
|
||||
break;
|
||||
default:
|
||||
this._tccKey.rotation = 0;
|
||||
break;
|
||||
}
|
||||
this._tccKey.texture = this.tccKeyTextures.tccKnob;
|
||||
this._tccKey.scale.set(0.6);
|
||||
}
|
||||
|
@ -7,6 +7,7 @@ export const useTccStore = defineStore('tcc', {
|
||||
trainControlMapId: 0,
|
||||
tccId: 0,
|
||||
isTccDialogOpen: false,
|
||||
canvasMouseDown: false,
|
||||
}),
|
||||
actions: {
|
||||
getTccScene() {
|
||||
|
Loading…
Reference in New Issue
Block a user