From fe96e51c5aeba4325cac04db41bb6cb1221a5133 Mon Sep 17 00:00:00 2001 From: dong <58670809@qq.com> Date: Thu, 8 Jun 2023 16:18:02 +0800 Subject: [PATCH 1/7] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=88=97=E8=BD=A6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/draw-app/DrawProperties.vue | 3 +- .../draw-app/properties/TrainProperty.vue | 114 -------- .../draw-app/templates/TrainTemplate.vue | 52 ++-- src/drawApp/graphics/TrainInteraction.ts | 43 --- src/drawApp/index.ts | 11 + src/graphics/train/Train.ts | 255 ++++++++++-------- src/graphics/train/TrainDrawAssistant.ts | 114 +++----- src/protos/stationLayoutGraphics.ts | 178 +----------- 8 files changed, 217 insertions(+), 553 deletions(-) diff --git a/src/components/draw-app/DrawProperties.vue b/src/components/draw-app/DrawProperties.vue index 5bf2e26..942db5d 100644 --- a/src/components/draw-app/DrawProperties.vue +++ b/src/components/draw-app/DrawProperties.vue @@ -20,7 +20,7 @@ @@ -74,6 +74,7 @@ import LinkTemplate from './templates/LinkTemplate.vue'; import RectTemplate from './templates/RectTemplate.vue'; import PlatformTemplate from './templates/PlatformTemplate.vue'; import StationTemplate from './templates/StationTemplate.vue'; +import TrainTemplate from './templates/TrainTemplate.vue'; import CanvasProperty from './properties/CanvasProperty.vue'; import LinkProperty from './properties/LinkProperty.vue'; import RectProperty from './properties/RectProperty.vue'; diff --git a/src/components/draw-app/properties/TrainProperty.vue b/src/components/draw-app/properties/TrainProperty.vue index 44586de..e47f4ee 100644 --- a/src/components/draw-app/properties/TrainProperty.vue +++ b/src/components/draw-app/properties/TrainProperty.vue @@ -8,63 +8,6 @@ hint="" @blur="onUpdate" /> - - - - - - - - - - - - - - - - - - + v-model="template.trainDirection" + :options="optionsDirection" + label="行驶方向" + /> @@ -43,18 +24,19 @@ import { onMounted, reactive } from 'vue'; const drawStore = useDrawStore(); const template = reactive({ - codeFontSize: 22, - headColor: '#00FF00', + trainDirection: 'left', + hasBorder: true, }); - +const optionsDoor = ['是', '否']; +const optionsDirection = ['向左', '向右']; onMounted(() => { const type = drawStore.drawGraphicType; if (type) { const gt = drawStore.drawGraphicTemplate; if (gt) { const lt = gt as TrainTemplate; - template.codeFontSize = lt.codeFontSize; - template.headColor = lt.headColor; + template.trainDirection = lt.trainDirection; + template.hasBorder = lt.hasBorder; } } }); @@ -62,8 +44,8 @@ onMounted(() => { function onUpdate() { const gt = drawStore.drawGraphicTemplate as TrainTemplate; if (gt) { - gt.codeFontSize = template.codeFontSize; - gt.headColor = template.headColor; + gt.trainDirection = template.trainDirection; + gt.hasBorder = template.hasBorder; } } diff --git a/src/drawApp/graphics/TrainInteraction.ts b/src/drawApp/graphics/TrainInteraction.ts index 2c7d974..a6009a9 100644 --- a/src/drawApp/graphics/TrainInteraction.ts +++ b/src/drawApp/graphics/TrainInteraction.ts @@ -1,5 +1,4 @@ import * as pb_1 from 'google-protobuf'; -import { IPointData } from 'pixi.js'; import { ITrainData } from 'src/graphics/train/Train'; import { graphicData } from 'src/protos/stationLayoutGraphics'; import { GraphicDataBase } from './GraphicDataBase'; @@ -26,18 +25,6 @@ export class TrainData extends GraphicDataBase implements ITrainData { set code(v: string) { this.data.code = v; } - get codeColor(): string { - return this.data.codeColor; - } - set codeColor(v: string) { - this.data.codeColor = v; - } - get codeFontSize(): number { - return this.data.codeFontSize; - } - set codeFontSize(v: number) { - this.data.codeFontSize = v; - } get trainDirection(): string { return this.data.trainDirection; } @@ -50,36 +37,6 @@ export class TrainData extends GraphicDataBase implements ITrainData { set hasBorder(v: boolean) { this.data.hasBorder = v; } - get borderWidth(): number { - return this.data.borderWidth; - } - set borderWidth(v: number) { - this.data.borderWidth = v; - } - get borderColor(): string { - return this.data.borderColor; - } - set borderColor(v: string) { - this.data.borderColor = v; - } - get headColor(): string { - return this.data.headColor; - } - set headColor(v: string) { - this.data.headColor = v; - } - get bodyColor(): string { - return this.data.bodyColor; - } - set bodyColor(v: string) { - this.data.bodyColor = v; - } - get point(): IPointData { - return this.data.point; - } - set point(point: IPointData) { - this.data.point = new graphicData.Point({ x: point.x, y: point.y }); - } clone(): TrainData { return new TrainData(this.data.cloneMessage()); } diff --git a/src/drawApp/index.ts b/src/drawApp/index.ts index 266fce2..df00920 100644 --- a/src/drawApp/index.ts +++ b/src/drawApp/index.ts @@ -121,6 +121,9 @@ export function initDrawApp(dom: HTMLElement): JlDrawApp { new TurnoutDraw(app, () => { return new TurnoutData(); }), + // new TrainDraw(app, () => { + // return new TrainData(); + // }), ], }); @@ -175,6 +178,14 @@ export function initDrawApp(dom: HTMLElement): JlDrawApp { }, }) ); + // app.addKeyboardListener( + // new KeyListener({ + // value: 'KeyR', + // onPress: () => { + // app.interactionPlugin(Train.Type).resume(); + // }, + // }) + // ); app.addKeyboardListener( new KeyListener({ value: 'KeyS', diff --git a/src/graphics/train/Train.ts b/src/graphics/train/Train.ts index dd1e553..9ba2d58 100644 --- a/src/graphics/train/Train.ts +++ b/src/graphics/train/Train.ts @@ -1,4 +1,4 @@ -import { Color, Graphics, IPointData } from 'pixi.js'; +import { Color, Graphics, Container } from 'pixi.js'; import { GraphicData, JlGraphic, @@ -9,29 +9,20 @@ import { export interface ITrainData extends GraphicData { get code(): string; // 车号 set code(v: string); - get codeColor(): string; // 车号颜色 - set codeColor(v: string); - get codeFontSize(): number; // 车号字体大小 - set codeFontSize(v: number); get trainDirection(): string; // 行驶方向 set trainDirection(v: string); get hasBorder(): boolean; // 是否有边框 set hasBorder(v: boolean); - get borderWidth(): number; // 边框线宽 - set borderWidth(v: number); - get borderColor(): string; // 边框颜色 - set borderColor(v: string); - get headColor(): string; // 箭头颜色 - set headColor(v: string); - get bodyColor(): string; // 背景色 - set bodyColor(v: string); - get point(): IPointData; // 位置坐标 - set point(point: IPointData); clone(): ITrainData; copyFrom(data: ITrainData): void; eq(other: ITrainData): boolean; } +interface bodyWH { + width: number; // 宽 + height: number; // 高 +} + // 列车颜色 export enum TrainColorEnum { headColor = '0x00FF00', // 箭头颜色 @@ -41,143 +32,177 @@ export enum TrainColorEnum { } export const trainConsts = { + codeWidth: 120, + codeHeight: 40, + codePadding: 5, borderWidth: 1, codeFontSize: 22, marginX: 2, // 图形x轴边距 pauseW: 2, // 停止框宽度 }; -export class Train extends JlGraphic { - static Type = 'Train'; - - arrowLeft: Graphics; - pauseLeft: Graphics; - arrowRight: Graphics; - pauseRight: Graphics; - codeRact: Graphics; - codeGraph: VectorText = new VectorText(''); //车号 - constructor() { - super(Train.Type); - this.arrowLeft = new Graphics(); - this.pauseLeft = new Graphics(); - this.arrowRight = new Graphics(); - this.pauseRight = new Graphics(); - this.codeRact = new Graphics(); - this.addChild(this.arrowLeft); - this.addChild(this.pauseLeft); - this.addChild(this.arrowRight); - this.addChild(this.pauseRight); - this.addChild(this.codeRact); - this.addChild(this.codeGraph); - this.codeGraph.setVectorFontSize(trainConsts.codeFontSize); +export class TrainHead extends Container { + arrow: Graphics; // 箭头 + pause: Graphics; // 停止 + isLeftDirection: boolean; // 是否向左 + constructor(direction: string) { + super(); + this.arrow = new Graphics(); + this.pause = new Graphics(); + this.isLeftDirection = direction == 'left'; + this.addChild(this.arrow); + this.addChild(this.pause); } - - get datas(): ITrainData { - return this.getDatas(); + clear() { + this.arrow.clear(); + this.pause.clear(); } - doRepaint(): void { - this.position.set(this.datas.point.x, this.datas.point.y); - const codeGraph = this.codeGraph; - const codeRact = this.codeRact; - if (this.datas.code == '') { - codeGraph.text = '01110111'; - } else { - codeGraph.text = this.datas.code; - } - codeGraph.setVectorFontSize(this.datas.codeFontSize); - codeGraph.anchor.set(0.5); - const style = { - fill: this.datas.codeColor, - padding: 5, - }; - codeGraph.style = style; - const { - x: codeX, - y: codeY, - width: codeWidth, - height: codeHeight, - } = codeGraph.getLocalBounds(); + doRepaint(bodyWH?: bodyWH) { + this.clear(); const marginX = trainConsts.marginX; const pauseW = trainConsts.pauseW; - const arrowLeft = this.arrowLeft; - arrowLeft.beginFill(this.datas.headColor, 1); - arrowLeft.drawPolygon([ + const codeWidth = bodyWH ? bodyWH.width : trainConsts.codeWidth; + const codeHeight = bodyWH ? bodyWH.height : trainConsts.codeHeight; + let arrowPoint = [ -codeHeight * 0.4 - marginX - pauseW - marginX - codeWidth / 2, 0, -marginX - pauseW - marginX - codeWidth / 2, codeHeight / 2, -marginX - pauseW - marginX - codeWidth / 2, -codeHeight / 2, - ]); - arrowLeft.endFill(); - this.pauseLeft.beginFill(this.datas.headColor, 1); - this.pauseLeft.drawRect(0, 0, pauseW, codeHeight); - this.pauseLeft.endFill(); - this.pauseLeft.position.set( - -marginX - pauseW - codeWidth / 2, - -codeHeight / 2 - ); - this.pauseRight.beginFill(this.datas.headColor, 1); - this.pauseRight.drawRect(0, 0, pauseW, codeHeight); - this.pauseRight.endFill(); - this.pauseRight.position.set(marginX + codeWidth / 2, -codeHeight / 2); - const arrowRight = this.arrowRight; - arrowRight.beginFill(this.datas.headColor, 1); - arrowRight.drawPolygon([ - codeWidth / 2 + marginX + pauseW + marginX + codeHeight * 0.4, - 0, - codeWidth / 2 + marginX + pauseW + marginX, - codeHeight / 2, - codeWidth / 2 + marginX + pauseW + marginX, - -codeHeight / 2, - ]); - arrowRight.endFill(); - if (this.datas.hasBorder) { + ]; + let pausePoint = [-marginX - pauseW - codeWidth / 2, -codeHeight / 2]; + if (!this.isLeftDirection) { + arrowPoint = [ + codeWidth / 2 + marginX + pauseW + marginX + codeHeight * 0.4, + 0, + codeWidth / 2 + marginX + pauseW + marginX, + codeHeight / 2, + codeWidth / 2 + marginX + pauseW + marginX, + -codeHeight / 2, + ]; + pausePoint = [marginX + codeWidth / 2, -codeHeight / 2]; + } + const arrow = this.arrow; + arrow.beginFill(TrainColorEnum.headColor, 1); + arrow.drawPolygon(arrowPoint); + arrow.endFill(); + this.pause.beginFill(TrainColorEnum.headColor, 1); + this.pause.drawRect(0, 0, pauseW, codeHeight); + this.pause.endFill(); + this.pause.position.set(...pausePoint); + } + stop() { + this.arrow.visible = false; + } + run() { + this.arrow.visible = true; + } +} + +export class TrainBody extends Container { + codeRact: Graphics; + codeGraph: VectorText = new VectorText(''); //车号 + constructor() { + super(); + this.codeRact = new Graphics(); + this.addChild(this.codeRact); + this.addChild(this.codeGraph); + this.codeGraph.setVectorFontSize(trainConsts.codeFontSize); + } + clear() { + this.codeRact.clear(); + } + getBodyWH(): bodyWH { + const bodyWH = this.codeGraph.getLocalBounds(); + return { + width: bodyWH.width + trainConsts.codePadding * 2, + height: bodyWH.height + trainConsts.codePadding * 2, + }; + } + + doRepaint(datas?: ITrainData): void { + this.clear(); + const codeGraph = this.codeGraph; + const codeRact = this.codeRact; + const code = datas?.code; + codeGraph.text = code || '01110111'; + codeGraph.setVectorFontSize(trainConsts.codeFontSize); + codeGraph.anchor.set(0.5); + const style = { + fill: TrainColorEnum.codeColor, + padding: 5, + }; + codeGraph.style = style; + const { width: codeWidth, height: codeHeight } = this.getBodyWH(); + const hasBorder = datas ? datas.hasBorder : true; + if (hasBorder) { codeRact.visible = true; codeRact.lineStyle( - this.datas.borderWidth, - new Color(this.datas.borderColor) + trainConsts.borderWidth, + new Color(TrainColorEnum.borderColor) ); - codeRact.beginFill(new Color(this.datas.bodyColor)); - codeRact.drawRect(codeX, codeY, codeWidth, codeHeight); + codeRact.beginFill(new Color(TrainColorEnum.bodyColor)); + codeRact.drawRect(-codeWidth / 2, -codeHeight / 2, codeWidth, codeHeight); codeRact.endFill(); } else { codeRact.visible = false; } + } +} + +export class Train extends JlGraphic { + static Type = 'Train'; + + headLeft: TrainHead; + headRight: TrainHead; + trainbody: TrainBody; + constructor() { + super(Train.Type); + this.trainbody = new TrainBody(); + this.headLeft = new TrainHead('left'); + this.headRight = new TrainHead('right'); + this.addChild(this.headLeft); + this.addChild(this.headRight); + this.addChild(this.trainbody); + } + + get datas(): ITrainData { + return this.getDatas(); + } + + doRepaint(): void { + this.trainbody.doRepaint(this.datas); + const bodyWH = this.trainbody.getBodyWH(); + this.headLeft.doRepaint(bodyWH); + this.headRight.doRepaint(bodyWH); // 运行方向控制箭头停止显隐 if (this.datas.trainDirection == 'right') { - this.arrowLeft.visible = false; - this.arrowRight.visible = true; - this.pauseLeft.visible = false; - this.pauseRight.visible = true; + this.headLeft.visible = false; + this.headRight.visible = true; } else { - this.arrowLeft.visible = true; - this.arrowRight.visible = false; - this.pauseLeft.visible = true; - this.pauseRight.visible = false; + this.headLeft.visible = true; + this.headRight.visible = false; } } + + stop() { + this.headLeft.stop(); + this.headRight.stop(); + } + run() { + this.headLeft.run(); + this.headRight.run(); + } } export class TrainTemplate extends JlGraphicTemplate { trainDirection: string; - codeFontSize: number; hasBorder: boolean; - borderWidth: number; - borderColor: string; - headColor: string; - codeColor: string; - bodyColor: string; constructor() { super(Train.Type); this.trainDirection = 'left'; - this.codeFontSize = trainConsts.codeFontSize; this.hasBorder = true; - this.borderWidth = trainConsts.borderWidth; - this.borderColor = TrainColorEnum.borderColor; - this.headColor = TrainColorEnum.headColor; - this.codeColor = TrainColorEnum.codeColor; - this.bodyColor = TrainColorEnum.bodyColor; } new(): Train { return new Train(); diff --git a/src/graphics/train/TrainDrawAssistant.ts b/src/graphics/train/TrainDrawAssistant.ts index e86ba78..d749cf3 100644 --- a/src/graphics/train/TrainDrawAssistant.ts +++ b/src/graphics/train/TrainDrawAssistant.ts @@ -1,23 +1,27 @@ -import { Color, FederatedPointerEvent, Graphics, Point } from 'pixi.js'; +import { Point, FederatedPointerEvent } from 'pixi.js'; import { GraphicDrawAssistant, GraphicInteractionPlugin, JlDrawApp, JlGraphic, - VectorText, } from 'src/jl-graphic'; -import { ITrainData, Train, TrainTemplate, trainConsts } from './Train'; +import { + ITrainData, + Train, + TrainTemplate, + TrainHead, + TrainBody, +} from './Train'; export interface ITrainDrawOptions { newData: () => ITrainData; } export class TrainDraw extends GraphicDrawAssistant { - point: Point = new Point(0, 0); - arrowLeft: Graphics = new Graphics(); - pauseLeft: Graphics = new Graphics(); - codeRact: Graphics = new Graphics(); + _Train: Train | null = null; + headLeft: TrainHead; + trainbody: TrainBody; constructor(app: JlDrawApp, createData: () => ITrainData) { super( @@ -27,94 +31,56 @@ export class TrainDraw extends GraphicDrawAssistant { 'directions_bus_filled', '列车Train' ); - this.container.addChild(this.arrowLeft); - this.container.addChild(this.pauseLeft); - this.container.addChild(this.codeRact); - this.graphicTemplate.hasBorder = true; + this.headLeft = new TrainHead('left'); + this.trainbody = new TrainBody(); + this.container.addChild(this.headLeft); + this.container.addChild(this.trainbody); trainInteraction.init(app); } bind(): void { super.bind(); + if (!this._Train) { + this._Train = this.graphicTemplate.new(); + this.container.addChild(this._Train); + } + this.trainbody.doRepaint(); + const bodyWH = this.trainbody.getBodyWH(); + this.headLeft.doRepaint(bodyWH); } + unbind(): void { super.unbind(); } clearCache(): void { - this.arrowLeft.clear(); - this.pauseLeft.clear(); - this.codeRact.clear(); + this.headLeft.clear(); + this.trainbody.clear(); } - onLeftDown(e: FederatedPointerEvent): void { - const { x, y } = this.toCanvasCoordinates(e.global); - const p = new Point(x, y); - this.point = p; - this.createAndStore(true); + + public get Train(): Train { + if (!this._Train) { + throw new Error('列车绘制逻辑异常'); + } + return this._Train; } redraw(p: Point): void { - const template = this.graphicTemplate; - const codeGraph = new VectorText(''); // 车号 - codeGraph.setVectorFontSize(22); - codeGraph.anchor.set(0.5); - codeGraph.text = '01110111'; - const style = { padding: 5 }; - codeGraph.style = style; - const { width, height } = codeGraph.getLocalBounds(); - codeGraph.destroy(); - const marginX = trainConsts.marginX; - const pauseW = trainConsts.pauseW; - // 边框 - if (template.hasBorder) { - const codeRact = this.codeRact; - codeRact.clear(); - codeRact.lineStyle(template.borderWidth, new Color(template.borderColor)); - codeRact.beginFill(new Color(template.bodyColor)); - codeRact.drawRect(-width / 2, -height / 2, width, height); - codeRact.endFill(); - codeRact.position.set(p.x, p.y); - } - - // 箭头 - const arrowLeft = this.arrowLeft; - arrowLeft.clear(); - this.point.set(p.x, p.y); - arrowLeft.beginFill(template.headColor, 1); - arrowLeft.drawPolygon([ - -height * 0.4 - marginX - pauseW - marginX - width / 2, - 0, - -marginX - pauseW - marginX - width / 2, - height / 2, - -marginX - pauseW - marginX - width / 2, - -height / 2, - ]); - arrowLeft.endFill(); - arrowLeft.position.set(this.point.x, this.point.y); - - // 停止框 - const pauseLeft = this.pauseLeft; - pauseLeft.clear(); - pauseLeft.beginFill(template.headColor, 1); - pauseLeft.drawRect(0, 0, pauseW, height); - pauseLeft.endFill(); - pauseLeft.position.set( - this.point.x - marginX - pauseW - width / 2, - this.point.y - height / 2 - ); + this.container.position.set(p.x, p.y); + } + onRightClick(): void { + this.createAndStore(true); + } + onLeftDown(e: FederatedPointerEvent): void { + this.container.position.copyFrom(this.toCanvasCoordinates(e.global)); + this.createAndStore(true); } prepareData(data: ITrainData): boolean { const template = this.graphicTemplate; data.code = '01110111'; - data.codeColor = template.codeColor; - data.codeFontSize = template.codeFontSize; data.hasBorder = template.hasBorder; data.trainDirection = template.trainDirection; - data.point = this.point; - data.borderWidth = template.borderWidth; - data.borderColor = template.borderColor; - data.headColor = template.headColor; - data.bodyColor = template.bodyColor; + data.transform = this.container.saveTransform(); return true; } } diff --git a/src/protos/stationLayoutGraphics.ts b/src/protos/stationLayoutGraphics.ts index 8ce9e67..f984b9d 100644 --- a/src/protos/stationLayoutGraphics.ts +++ b/src/protos/stationLayoutGraphics.ts @@ -1593,15 +1593,8 @@ export namespace graphicData { constructor(data?: any[] | { common?: CommonInfo; code?: string; - codeColor?: string; - codeFontSize?: number; - point?: Point; trainDirection?: string; hasBorder?: boolean; - borderWidth?: number; - borderColor?: string; - headColor?: string; - bodyColor?: string; }) { super(); pb_1.Message.initialize(this, Array.isArray(data) ? data : [], 0, -1, [], this.#one_of_decls); @@ -1612,33 +1605,12 @@ export namespace graphicData { if ("code" in data && data.code != undefined) { this.code = data.code; } - if ("codeColor" in data && data.codeColor != undefined) { - this.codeColor = data.codeColor; - } - if ("codeFontSize" in data && data.codeFontSize != undefined) { - this.codeFontSize = data.codeFontSize; - } - if ("point" in data && data.point != undefined) { - this.point = data.point; - } if ("trainDirection" in data && data.trainDirection != undefined) { this.trainDirection = data.trainDirection; } if ("hasBorder" in data && data.hasBorder != undefined) { this.hasBorder = data.hasBorder; } - if ("borderWidth" in data && data.borderWidth != undefined) { - this.borderWidth = data.borderWidth; - } - if ("borderColor" in data && data.borderColor != undefined) { - this.borderColor = data.borderColor; - } - if ("headColor" in data && data.headColor != undefined) { - this.headColor = data.headColor; - } - if ("bodyColor" in data && data.bodyColor != undefined) { - this.bodyColor = data.bodyColor; - } } } get common() { @@ -1656,75 +1628,23 @@ export namespace graphicData { set code(value: string) { pb_1.Message.setField(this, 2, value); } - get codeColor() { + get trainDirection() { return pb_1.Message.getFieldWithDefault(this, 3, "") as string; } - set codeColor(value: string) { + set trainDirection(value: string) { pb_1.Message.setField(this, 3, value); } - get codeFontSize() { - return pb_1.Message.getFieldWithDefault(this, 4, 0) as number; - } - set codeFontSize(value: number) { - pb_1.Message.setField(this, 4, value); - } - get point() { - return pb_1.Message.getWrapperField(this, Point, 5) as Point; - } - set point(value: Point) { - pb_1.Message.setWrapperField(this, 5, value); - } - get has_point() { - return pb_1.Message.getField(this, 5) != null; - } - get trainDirection() { - return pb_1.Message.getFieldWithDefault(this, 6, "") as string; - } - set trainDirection(value: string) { - pb_1.Message.setField(this, 6, value); - } get hasBorder() { - return pb_1.Message.getFieldWithDefault(this, 7, false) as boolean; + return pb_1.Message.getFieldWithDefault(this, 4, false) as boolean; } set hasBorder(value: boolean) { - pb_1.Message.setField(this, 7, value); - } - get borderWidth() { - return pb_1.Message.getFieldWithDefault(this, 8, 0) as number; - } - set borderWidth(value: number) { - pb_1.Message.setField(this, 8, value); - } - get borderColor() { - return pb_1.Message.getFieldWithDefault(this, 9, "") as string; - } - set borderColor(value: string) { - pb_1.Message.setField(this, 9, value); - } - get headColor() { - return pb_1.Message.getFieldWithDefault(this, 10, "") as string; - } - set headColor(value: string) { - pb_1.Message.setField(this, 10, value); - } - get bodyColor() { - return pb_1.Message.getFieldWithDefault(this, 11, "") as string; - } - set bodyColor(value: string) { - pb_1.Message.setField(this, 11, value); + pb_1.Message.setField(this, 4, value); } static fromObject(data: { common?: ReturnType; code?: string; - codeColor?: string; - codeFontSize?: number; - point?: ReturnType; trainDirection?: string; hasBorder?: boolean; - borderWidth?: number; - borderColor?: string; - headColor?: string; - bodyColor?: string; }): Train { const message = new Train({}); if (data.common != null) { @@ -1733,48 +1653,20 @@ export namespace graphicData { if (data.code != null) { message.code = data.code; } - if (data.codeColor != null) { - message.codeColor = data.codeColor; - } - if (data.codeFontSize != null) { - message.codeFontSize = data.codeFontSize; - } - if (data.point != null) { - message.point = Point.fromObject(data.point); - } if (data.trainDirection != null) { message.trainDirection = data.trainDirection; } if (data.hasBorder != null) { message.hasBorder = data.hasBorder; } - if (data.borderWidth != null) { - message.borderWidth = data.borderWidth; - } - if (data.borderColor != null) { - message.borderColor = data.borderColor; - } - if (data.headColor != null) { - message.headColor = data.headColor; - } - if (data.bodyColor != null) { - message.bodyColor = data.bodyColor; - } return message; } toObject() { const data: { common?: ReturnType; code?: string; - codeColor?: string; - codeFontSize?: number; - point?: ReturnType; trainDirection?: string; hasBorder?: boolean; - borderWidth?: number; - borderColor?: string; - headColor?: string; - bodyColor?: string; } = {}; if (this.common != null) { data.common = this.common.toObject(); @@ -1782,33 +1674,12 @@ export namespace graphicData { if (this.code != null) { data.code = this.code; } - if (this.codeColor != null) { - data.codeColor = this.codeColor; - } - if (this.codeFontSize != null) { - data.codeFontSize = this.codeFontSize; - } - if (this.point != null) { - data.point = this.point.toObject(); - } if (this.trainDirection != null) { data.trainDirection = this.trainDirection; } if (this.hasBorder != null) { data.hasBorder = this.hasBorder; } - if (this.borderWidth != null) { - data.borderWidth = this.borderWidth; - } - if (this.borderColor != null) { - data.borderColor = this.borderColor; - } - if (this.headColor != null) { - data.headColor = this.headColor; - } - if (this.bodyColor != null) { - data.bodyColor = this.bodyColor; - } return data; } serialize(): Uint8Array; @@ -1819,24 +1690,10 @@ export namespace graphicData { writer.writeMessage(1, this.common, () => this.common.serialize(writer)); if (this.code.length) writer.writeString(2, this.code); - if (this.codeColor.length) - writer.writeString(3, this.codeColor); - if (this.codeFontSize != 0) - writer.writeInt32(4, this.codeFontSize); - if (this.has_point) - writer.writeMessage(5, this.point, () => this.point.serialize(writer)); if (this.trainDirection.length) - writer.writeString(6, this.trainDirection); + writer.writeString(3, this.trainDirection); if (this.hasBorder != false) - writer.writeBool(7, this.hasBorder); - if (this.borderWidth != 0) - writer.writeInt32(8, this.borderWidth); - if (this.borderColor.length) - writer.writeString(9, this.borderColor); - if (this.headColor.length) - writer.writeString(10, this.headColor); - if (this.bodyColor.length) - writer.writeString(11, this.bodyColor); + writer.writeBool(4, this.hasBorder); if (!w) return writer.getResultBuffer(); } @@ -1853,32 +1710,11 @@ export namespace graphicData { message.code = reader.readString(); break; case 3: - message.codeColor = reader.readString(); - break; - case 4: - message.codeFontSize = reader.readInt32(); - break; - case 5: - reader.readMessage(message.point, () => message.point = Point.deserialize(reader)); - break; - case 6: message.trainDirection = reader.readString(); break; - case 7: + case 4: message.hasBorder = reader.readBool(); break; - case 8: - message.borderWidth = reader.readInt32(); - break; - case 9: - message.borderColor = reader.readString(); - break; - case 10: - message.headColor = reader.readString(); - break; - case 11: - message.bodyColor = reader.readString(); - break; default: reader.skipField(); } } From 648414d80c776829235a707f8c8d593bdcbc27ba Mon Sep 17 00:00:00 2001 From: fan Date: Thu, 8 Jun 2023 16:30:11 +0800 Subject: [PATCH 2/7] =?UTF-8?q?=E4=BF=A1=E5=8F=B7=E6=9C=BA=E5=AD=98?= =?UTF-8?q?=E5=82=A8childtransform?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/graphics/signal/Signal.ts | 27 ++++++++++------------ src/graphics/signal/SignalDrawAssistant.ts | 4 +++- 2 files changed, 15 insertions(+), 16 deletions(-) diff --git a/src/graphics/signal/Signal.ts b/src/graphics/signal/Signal.ts index adb023b..383bb0e 100644 --- a/src/graphics/signal/Signal.ts +++ b/src/graphics/signal/Signal.ts @@ -38,6 +38,7 @@ export class Signal extends JlGraphic { constructor() { super(Signal.Type); + this.codeGraph.name = 'signalCode'; this.addChild(this.codeGraph); this.addChild(this.humanControl); this.addChild(this.fleetMode); @@ -74,24 +75,20 @@ export class Signal extends JlGraphic { signal.codeGraph.setVectorFontSize(signalConsts.codeFontSize); signal.codeGraph.anchor.set(0.5); signal.codeGraph.style.fill = SignalColorEnum.codeColor; - signal.codeGraph.position.set(0, signalConsts.nameOffsetY); + const codeTransform = data?.childTransforms?.find( + (item) => item.name === 'signalCode' + ); + if (codeTransform) { + const position = codeTransform?.transform.position; + const rotation = codeTransform?.transform?.rotation; + signal.codeGraph.position.set(position?.x, position?.y); + signal.codeGraph.rotation = rotation || 0; + } else { + signal.codeGraph.position.set(0, signalConsts.nameOffsetY); + } } doRepaint(): void { - // this.lampBody.paint(signalConsts.lampNum); - // this.humanControl.beginFill(SignalColorEnum.humanControlColor, 1); - // this.humanControl.drawPolygon(signalConsts.humanControlPath); - // this.humanControl.endFill(); - // this.fleetMode.beginFill(SignalColorEnum.fleetModeColor, 1); - // const fleetModePath = Signal.computedFleetModePath(this.lampBody.width); - // this.fleetMode.drawPolygon(fleetModePath); - // this.fleetMode.endFill(); - // this.codeGraph.text = this.datas.code || '信号机Signal'; - // this.codeGraph.style.fill = SignalColorEnum.codeColor; - // this.codeGraph.setVectorFontSize(signalConsts.codeFontSize); - // this.codeGraph.anchor.set(0.5); - // this.codeGraph.style.fill = SignalColorEnum.codeColor; - // this.codeGraph.position.set(0, signalConsts.nameOffsetY); Signal.paint(this, this.datas); } } diff --git a/src/graphics/signal/SignalDrawAssistant.ts b/src/graphics/signal/SignalDrawAssistant.ts index ca6d1cf..4cc7fcc 100644 --- a/src/graphics/signal/SignalDrawAssistant.ts +++ b/src/graphics/signal/SignalDrawAssistant.ts @@ -1,9 +1,10 @@ -import { FederatedPointerEvent, Point, Graphics, Color } from 'pixi.js'; +import { FederatedPointerEvent, Point, Graphics } from 'pixi.js'; import { GraphicDrawAssistant, GraphicInteractionPlugin, JlDrawApp, JlGraphic, + GraphicTransformEvent, VectorText, } from 'src/jl-graphic'; import { ISignalData, Signal, SignalTemplate } from './Signal'; @@ -88,6 +89,7 @@ export class signalInteraction extends GraphicInteractionPlugin { g.codeGraph.selectable = true; g.codeGraph.rotatable = true; g.codeGraph.scalable = true; + g.codeGraph.transformSave = true; g.codeGraph.eventMode = 'static'; } unbind(g: Signal): void { From 586895daf620ec4f816aff0d7f01c74312ed9026 Mon Sep 17 00:00:00 2001 From: fan Date: Thu, 8 Jun 2023 16:31:05 +0800 Subject: [PATCH 3/7] =?UTF-8?q?message=E5=90=8C=E6=AD=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- xian-ncc-da-message | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/xian-ncc-da-message b/xian-ncc-da-message index e7511d2..89c9f02 160000 --- a/xian-ncc-da-message +++ b/xian-ncc-da-message @@ -1 +1 @@ -Subproject commit e7511d23961cd796ca732663c50ad6e058a06d0e +Subproject commit 89c9f023cff957ecb414d09252b306ef20b9e908 From 141504c31c51d5a9fc97596028ea4c7db8852d99 Mon Sep 17 00:00:00 2001 From: fan Date: Thu, 8 Jun 2023 16:51:57 +0800 Subject: [PATCH 4/7] =?UTF-8?q?=E4=BF=A1=E5=8F=B7=E6=9C=BA=E7=BB=98?= =?UTF-8?q?=E5=88=B6=E8=B0=83=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/graphics/signal/SignalDrawAssistant.ts | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/src/graphics/signal/SignalDrawAssistant.ts b/src/graphics/signal/SignalDrawAssistant.ts index 4cc7fcc..532d9e2 100644 --- a/src/graphics/signal/SignalDrawAssistant.ts +++ b/src/graphics/signal/SignalDrawAssistant.ts @@ -88,10 +88,14 @@ export class signalInteraction extends GraphicInteractionPlugin { g.codeGraph.draggable = true; g.codeGraph.selectable = true; g.codeGraph.rotatable = true; - g.codeGraph.scalable = true; + // g.codeGraph.scalable = true; g.codeGraph.transformSave = true; g.codeGraph.eventMode = 'static'; + // g.codeGraph.on('transformend', this.onScaleDragEnd, this); } + // onScaleDragEnd() { + // console.log('-----------------'); + // } unbind(g: Signal): void { g.eventMode = 'none'; g.scalable = false; @@ -99,7 +103,8 @@ export class signalInteraction extends GraphicInteractionPlugin { g.codeGraph.draggable = false; g.codeGraph.selectable = false; g.codeGraph.rotatable = false; - g.codeGraph.scalable = false; + // g.codeGraph.scalable = false; + g.codeGraph.transformSave = false; g.codeGraph.eventMode = 'none'; } } From ecb3b39be12496c59444ed1decb50517749e0de1 Mon Sep 17 00:00:00 2001 From: joylink_zhaoerwei Date: Thu, 8 Jun 2023 17:08:10 +0800 Subject: [PATCH 5/7] =?UTF-8?q?=E8=BD=A6=E7=AB=99=E5=9C=86=E5=9C=88--?= =?UTF-8?q?=E7=BA=BF=E7=BD=91=E5=A4=87=E7=94=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../draw-app/properties/StationProperty.vue | 8 +- src/drawApp/graphics/StationInteraction.ts | 7 - src/graphics/station/Station.ts | 19 +- src/graphics/station/StationDrawAssistant.ts | 14 +- src/protos/stationLayoutGraphics.ts | 204 +++++++++++++++--- 5 files changed, 202 insertions(+), 50 deletions(-) diff --git a/src/components/draw-app/properties/StationProperty.vue b/src/components/draw-app/properties/StationProperty.vue index 3163c9d..103b1d4 100644 --- a/src/components/draw-app/properties/StationProperty.vue +++ b/src/components/draw-app/properties/StationProperty.vue @@ -24,7 +24,7 @@ outlined @blur="onUpdate" label="x" - v-model.number="stationModel.circlePoint.x" + v-model.number="circlePosition.x" type="number" step="any" class="col" @@ -33,7 +33,7 @@ outlined @blur="onUpdate" label="y" - v-model.number="stationModel.circlePoint.y" + v-model.number="circlePosition.y" type="number" step="any" class="col" @@ -54,6 +54,7 @@ import { onMounted, reactive, ref, watch } from 'vue'; const drawStore = useDrawStore(); const stationModel = reactive(new StationData()); const hasCircle = ref('是'); +let circlePosition = ref({ x: 0, y: -20 }); const optionsCircle = ['是', '否']; enum showSelect { 是 = 'true', @@ -79,6 +80,9 @@ onMounted(() => { const station = drawStore.selectedGraphic as Station; if (station) { stationModel.copyFrom(station.saveData()); + if (stationModel.childTransforms) { + circlePosition.value = stationModel.childTransforms[0].transform.position; + } hasCircle.value = (showSelectData as never)[stationModel.hasCircle + '']; } }); diff --git a/src/drawApp/graphics/StationInteraction.ts b/src/drawApp/graphics/StationInteraction.ts index 686d99d..224433c 100644 --- a/src/drawApp/graphics/StationInteraction.ts +++ b/src/drawApp/graphics/StationInteraction.ts @@ -1,5 +1,4 @@ import * as pb_1 from 'google-protobuf'; -import { IPointData } from 'pixi.js'; import { IStationData } from 'src/graphics/station/Station'; import { graphicData } from 'src/protos/stationLayoutGraphics'; import { GraphicDataBase } from './GraphicDataBase'; @@ -32,12 +31,6 @@ export class StationData extends GraphicDataBase implements IStationData { set hasCircle(v: boolean) { this.data.hasCircle = v; } - get circlePoint(): IPointData { - return this.data.circlePoint; - } - set circlePoint(point: IPointData) { - this.data.circlePoint = new graphicData.Point({ x: point.x, y: point.y }); - } clone(): StationData { return new StationData(this.data.cloneMessage()); } diff --git a/src/graphics/station/Station.ts b/src/graphics/station/Station.ts index 00f4903..72ed827 100644 --- a/src/graphics/station/Station.ts +++ b/src/graphics/station/Station.ts @@ -1,4 +1,4 @@ -import { Color, Graphics, IPointData, Point } from 'pixi.js'; +import { Color, Graphics } from 'pixi.js'; import { GraphicData, JlGraphic, @@ -12,14 +12,13 @@ export interface IStationData extends GraphicData { set code(v: string); get hasCircle(): boolean; // 是否有圆圈--线网图 set hasCircle(v: boolean); - get circlePoint(): IPointData; // 位置坐标 - set circlePoint(point: IPointData); clone(): IStationData; copyFrom(data: IStationData): void; eq(other: IStationData): boolean; } const stationConsts = { + circleOffsetY: -20, radius: 5, borderWidth: 1, borderColor: '0xff0000', @@ -37,6 +36,7 @@ export class Station extends JlGraphic { super(Station.Type); this.addChild(this.codeGraph); this.addChild(this.circleGraphic); + this.circleGraphic.name = 'circle'; } get datas(): IStationData { @@ -58,7 +58,14 @@ export class Station extends JlGraphic { circleGraphic.beginFill(stationConsts.fillColor, 1); circleGraphic.drawCircle(0, 0, stationConsts.radius); circleGraphic.endFill; - circleGraphic.position.set(datas.circlePoint.x, datas.circlePoint.y); + if (datas.childTransforms?.length) { + circleGraphic.position.set( + datas.childTransforms[0].transform.position.x, + datas.childTransforms[0].transform.position.y + ); + } else { + circleGraphic.position.set(0, stationConsts.circleOffsetY); + } } } doRepaint(): void { @@ -69,12 +76,10 @@ export class Station extends JlGraphic { export class StationTemplate extends JlGraphicTemplate { hasCircle: boolean; radius: number; - circlePoint: IPointData; constructor() { super(Station.Type); - this.hasCircle = false; + this.hasCircle = true; this.radius = stationConsts.radius; - this.circlePoint = new Point(0, -15); } new(): Station { return new Station(); diff --git a/src/graphics/station/StationDrawAssistant.ts b/src/graphics/station/StationDrawAssistant.ts index b02b02e..bfe8e5e 100644 --- a/src/graphics/station/StationDrawAssistant.ts +++ b/src/graphics/station/StationDrawAssistant.ts @@ -55,7 +55,6 @@ export class StationDraw extends GraphicDrawAssistant< const template = this.graphicTemplate; data.transform = this.container.saveTransform(); data.hasCircle = template.hasCircle; - data.circlePoint = template.circlePoint; return true; } } @@ -78,10 +77,23 @@ export class stationInteraction extends GraphicInteractionPlugin { g.cursor = 'pointer'; g.scalable = true; g.rotatable = true; + g.circleGraphic.eventMode = 'static'; + g.circleGraphic.cursor = 'pointer'; + g.circleGraphic.draggable = true; + g.circleGraphic.selectable = true; + g.circleGraphic.rotatable = true; + g.circleGraphic.scalable = true; + g.circleGraphic.transformSave = true; } unbind(g: Station): void { g.eventMode = 'none'; g.scalable = false; g.rotatable = false; + g.circleGraphic.eventMode = 'none'; + g.circleGraphic.draggable = false; + g.circleGraphic.selectable = false; + g.circleGraphic.rotatable = false; + g.circleGraphic.scalable = false; + g.circleGraphic.transformSave = false; } } diff --git a/src/protos/stationLayoutGraphics.ts b/src/protos/stationLayoutGraphics.ts index f984b9d..e63f3df 100644 --- a/src/protos/stationLayoutGraphics.ts +++ b/src/protos/stationLayoutGraphics.ts @@ -1452,7 +1452,6 @@ export namespace graphicData { common?: CommonInfo; code?: string; hasCircle?: boolean; - circlePoint?: Point; }) { super(); pb_1.Message.initialize(this, Array.isArray(data) ? data : [], 0, -1, [], this.#one_of_decls); @@ -1466,9 +1465,6 @@ export namespace graphicData { if ("hasCircle" in data && data.hasCircle != undefined) { this.hasCircle = data.hasCircle; } - if ("circlePoint" in data && data.circlePoint != undefined) { - this.circlePoint = data.circlePoint; - } } } get common() { @@ -1492,20 +1488,10 @@ export namespace graphicData { set hasCircle(value: boolean) { pb_1.Message.setField(this, 3, value); } - get circlePoint() { - return pb_1.Message.getWrapperField(this, Point, 4) as Point; - } - set circlePoint(value: Point) { - pb_1.Message.setWrapperField(this, 4, value); - } - get has_circlePoint() { - return pb_1.Message.getField(this, 4) != null; - } static fromObject(data: { common?: ReturnType; code?: string; hasCircle?: boolean; - circlePoint?: ReturnType; }): Station { const message = new Station({}); if (data.common != null) { @@ -1517,9 +1503,6 @@ export namespace graphicData { if (data.hasCircle != null) { message.hasCircle = data.hasCircle; } - if (data.circlePoint != null) { - message.circlePoint = Point.fromObject(data.circlePoint); - } return message; } toObject() { @@ -1527,7 +1510,6 @@ export namespace graphicData { common?: ReturnType; code?: string; hasCircle?: boolean; - circlePoint?: ReturnType; } = {}; if (this.common != null) { data.common = this.common.toObject(); @@ -1538,9 +1520,6 @@ export namespace graphicData { if (this.hasCircle != null) { data.hasCircle = this.hasCircle; } - if (this.circlePoint != null) { - data.circlePoint = this.circlePoint.toObject(); - } return data; } serialize(): Uint8Array; @@ -1553,8 +1532,6 @@ export namespace graphicData { writer.writeString(2, this.code); if (this.hasCircle != false) writer.writeBool(3, this.hasCircle); - if (this.has_circlePoint) - writer.writeMessage(4, this.circlePoint, () => this.circlePoint.serialize(writer)); if (!w) return writer.getResultBuffer(); } @@ -1573,9 +1550,6 @@ export namespace graphicData { case 3: message.hasCircle = reader.readBool(); break; - case 4: - reader.readMessage(message.circlePoint, () => message.circlePoint = Point.deserialize(reader)); - break; default: reader.skipField(); } } @@ -1593,8 +1567,15 @@ export namespace graphicData { constructor(data?: any[] | { common?: CommonInfo; code?: string; + codeColor?: string; + codeFontSize?: number; + point?: Point; trainDirection?: string; hasBorder?: boolean; + borderWidth?: number; + borderColor?: string; + headColor?: string; + bodyColor?: string; }) { super(); pb_1.Message.initialize(this, Array.isArray(data) ? data : [], 0, -1, [], this.#one_of_decls); @@ -1605,12 +1586,33 @@ export namespace graphicData { if ("code" in data && data.code != undefined) { this.code = data.code; } + if ("codeColor" in data && data.codeColor != undefined) { + this.codeColor = data.codeColor; + } + if ("codeFontSize" in data && data.codeFontSize != undefined) { + this.codeFontSize = data.codeFontSize; + } + if ("point" in data && data.point != undefined) { + this.point = data.point; + } if ("trainDirection" in data && data.trainDirection != undefined) { this.trainDirection = data.trainDirection; } if ("hasBorder" in data && data.hasBorder != undefined) { this.hasBorder = data.hasBorder; } + if ("borderWidth" in data && data.borderWidth != undefined) { + this.borderWidth = data.borderWidth; + } + if ("borderColor" in data && data.borderColor != undefined) { + this.borderColor = data.borderColor; + } + if ("headColor" in data && data.headColor != undefined) { + this.headColor = data.headColor; + } + if ("bodyColor" in data && data.bodyColor != undefined) { + this.bodyColor = data.bodyColor; + } } } get common() { @@ -1628,23 +1630,75 @@ export namespace graphicData { set code(value: string) { pb_1.Message.setField(this, 2, value); } - get trainDirection() { + get codeColor() { return pb_1.Message.getFieldWithDefault(this, 3, "") as string; } - set trainDirection(value: string) { + set codeColor(value: string) { pb_1.Message.setField(this, 3, value); } + get codeFontSize() { + return pb_1.Message.getFieldWithDefault(this, 4, 0) as number; + } + set codeFontSize(value: number) { + pb_1.Message.setField(this, 4, value); + } + get point() { + return pb_1.Message.getWrapperField(this, Point, 5) as Point; + } + set point(value: Point) { + pb_1.Message.setWrapperField(this, 5, value); + } + get has_point() { + return pb_1.Message.getField(this, 5) != null; + } + get trainDirection() { + return pb_1.Message.getFieldWithDefault(this, 6, "") as string; + } + set trainDirection(value: string) { + pb_1.Message.setField(this, 6, value); + } get hasBorder() { - return pb_1.Message.getFieldWithDefault(this, 4, false) as boolean; + return pb_1.Message.getFieldWithDefault(this, 7, false) as boolean; } set hasBorder(value: boolean) { - pb_1.Message.setField(this, 4, value); + pb_1.Message.setField(this, 7, value); + } + get borderWidth() { + return pb_1.Message.getFieldWithDefault(this, 8, 0) as number; + } + set borderWidth(value: number) { + pb_1.Message.setField(this, 8, value); + } + get borderColor() { + return pb_1.Message.getFieldWithDefault(this, 9, "") as string; + } + set borderColor(value: string) { + pb_1.Message.setField(this, 9, value); + } + get headColor() { + return pb_1.Message.getFieldWithDefault(this, 10, "") as string; + } + set headColor(value: string) { + pb_1.Message.setField(this, 10, value); + } + get bodyColor() { + return pb_1.Message.getFieldWithDefault(this, 11, "") as string; + } + set bodyColor(value: string) { + pb_1.Message.setField(this, 11, value); } static fromObject(data: { common?: ReturnType; code?: string; + codeColor?: string; + codeFontSize?: number; + point?: ReturnType; trainDirection?: string; hasBorder?: boolean; + borderWidth?: number; + borderColor?: string; + headColor?: string; + bodyColor?: string; }): Train { const message = new Train({}); if (data.common != null) { @@ -1653,20 +1707,48 @@ export namespace graphicData { if (data.code != null) { message.code = data.code; } + if (data.codeColor != null) { + message.codeColor = data.codeColor; + } + if (data.codeFontSize != null) { + message.codeFontSize = data.codeFontSize; + } + if (data.point != null) { + message.point = Point.fromObject(data.point); + } if (data.trainDirection != null) { message.trainDirection = data.trainDirection; } if (data.hasBorder != null) { message.hasBorder = data.hasBorder; } + if (data.borderWidth != null) { + message.borderWidth = data.borderWidth; + } + if (data.borderColor != null) { + message.borderColor = data.borderColor; + } + if (data.headColor != null) { + message.headColor = data.headColor; + } + if (data.bodyColor != null) { + message.bodyColor = data.bodyColor; + } return message; } toObject() { const data: { common?: ReturnType; code?: string; + codeColor?: string; + codeFontSize?: number; + point?: ReturnType; trainDirection?: string; hasBorder?: boolean; + borderWidth?: number; + borderColor?: string; + headColor?: string; + bodyColor?: string; } = {}; if (this.common != null) { data.common = this.common.toObject(); @@ -1674,12 +1756,33 @@ export namespace graphicData { if (this.code != null) { data.code = this.code; } + if (this.codeColor != null) { + data.codeColor = this.codeColor; + } + if (this.codeFontSize != null) { + data.codeFontSize = this.codeFontSize; + } + if (this.point != null) { + data.point = this.point.toObject(); + } if (this.trainDirection != null) { data.trainDirection = this.trainDirection; } if (this.hasBorder != null) { data.hasBorder = this.hasBorder; } + if (this.borderWidth != null) { + data.borderWidth = this.borderWidth; + } + if (this.borderColor != null) { + data.borderColor = this.borderColor; + } + if (this.headColor != null) { + data.headColor = this.headColor; + } + if (this.bodyColor != null) { + data.bodyColor = this.bodyColor; + } return data; } serialize(): Uint8Array; @@ -1690,10 +1793,24 @@ export namespace graphicData { writer.writeMessage(1, this.common, () => this.common.serialize(writer)); if (this.code.length) writer.writeString(2, this.code); + if (this.codeColor.length) + writer.writeString(3, this.codeColor); + if (this.codeFontSize != 0) + writer.writeInt32(4, this.codeFontSize); + if (this.has_point) + writer.writeMessage(5, this.point, () => this.point.serialize(writer)); if (this.trainDirection.length) - writer.writeString(3, this.trainDirection); + writer.writeString(6, this.trainDirection); if (this.hasBorder != false) - writer.writeBool(4, this.hasBorder); + writer.writeBool(7, this.hasBorder); + if (this.borderWidth != 0) + writer.writeInt32(8, this.borderWidth); + if (this.borderColor.length) + writer.writeString(9, this.borderColor); + if (this.headColor.length) + writer.writeString(10, this.headColor); + if (this.bodyColor.length) + writer.writeString(11, this.bodyColor); if (!w) return writer.getResultBuffer(); } @@ -1710,11 +1827,32 @@ export namespace graphicData { message.code = reader.readString(); break; case 3: - message.trainDirection = reader.readString(); + message.codeColor = reader.readString(); break; case 4: + message.codeFontSize = reader.readInt32(); + break; + case 5: + reader.readMessage(message.point, () => message.point = Point.deserialize(reader)); + break; + case 6: + message.trainDirection = reader.readString(); + break; + case 7: message.hasBorder = reader.readBool(); break; + case 8: + message.borderWidth = reader.readInt32(); + break; + case 9: + message.borderColor = reader.readString(); + break; + case 10: + message.headColor = reader.readString(); + break; + case 11: + message.bodyColor = reader.readString(); + break; default: reader.skipField(); } } From ae1efa309e915910ef243544b72088a099b1ae79 Mon Sep 17 00:00:00 2001 From: joylink_zhaoerwei Date: Thu, 8 Jun 2023 17:47:30 +0800 Subject: [PATCH 6/7] =?UTF-8?q?=E8=BD=A6=E7=AB=99=E5=9C=86=E5=9C=88?= =?UTF-8?q?=E5=BE=AE=E8=B0=83?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/graphics/station/StationDrawAssistant.ts | 16 +++++++--------- 1 file changed, 7 insertions(+), 9 deletions(-) diff --git a/src/graphics/station/StationDrawAssistant.ts b/src/graphics/station/StationDrawAssistant.ts index bfe8e5e..6002cf9 100644 --- a/src/graphics/station/StationDrawAssistant.ts +++ b/src/graphics/station/StationDrawAssistant.ts @@ -77,13 +77,13 @@ export class stationInteraction extends GraphicInteractionPlugin { g.cursor = 'pointer'; g.scalable = true; g.rotatable = true; - g.circleGraphic.eventMode = 'static'; - g.circleGraphic.cursor = 'pointer'; - g.circleGraphic.draggable = true; - g.circleGraphic.selectable = true; - g.circleGraphic.rotatable = true; - g.circleGraphic.scalable = true; - g.circleGraphic.transformSave = true; + if (g.datas.hasCircle) { + g.circleGraphic.eventMode = 'static'; + g.circleGraphic.cursor = 'pointer'; + g.circleGraphic.draggable = true; + g.circleGraphic.selectable = true; + g.circleGraphic.transformSave = true; + } } unbind(g: Station): void { g.eventMode = 'none'; @@ -92,8 +92,6 @@ export class stationInteraction extends GraphicInteractionPlugin { g.circleGraphic.eventMode = 'none'; g.circleGraphic.draggable = false; g.circleGraphic.selectable = false; - g.circleGraphic.rotatable = false; - g.circleGraphic.scalable = false; g.circleGraphic.transformSave = false; } } From 391e086f9f14cf2d772f35552070fc39f71bd68f Mon Sep 17 00:00:00 2001 From: dong <58670809@qq.com> Date: Thu, 8 Jun 2023 18:20:18 +0800 Subject: [PATCH 7/7] =?UTF-8?q?=E5=88=9B=E5=BB=BA=E8=8D=89=E7=A8=BF?= =?UTF-8?q?=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/DraftManage.vue | 46 ++++++++++++++++++++++----------------- 1 file changed, 26 insertions(+), 20 deletions(-) diff --git a/src/pages/DraftManage.vue b/src/pages/DraftManage.vue index a7fdff7..29e3175 100644 --- a/src/pages/DraftManage.vue +++ b/src/pages/DraftManage.vue @@ -60,7 +60,7 @@
新建草稿图
- + - + @@ -116,7 +117,7 @@