From f621cbefd212aa1d9577894f67ff55be941a9aa3 Mon Sep 17 00:00:00 2001 From: fan Date: Tue, 13 Jun 2023 15:30:49 +0800 Subject: [PATCH] =?UTF-8?q?=E8=BD=A8=E8=BF=B9=E7=BA=BF=E7=94=9F=E6=88=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../draw-app/properties/RunLineProperty.vue | 20 +++++ src/drawApp/graphics/PathLineInteraction.ts | 47 +++++++++++ src/drawApp/graphics/RunLineInteraction.ts | 12 +++ src/drawApp/index.ts | 13 +++ .../pathLine/PathLineDrawAssistant.ts | 22 ++++-- src/graphics/runLine/RunLine.ts | 40 +++++++++- src/layouts/DrawLayout.vue | 1 + src/protos/stationLayoutGraphics.ts | 79 +++++++++++++++++-- xian-ncc-da-message | 2 +- 9 files changed, 220 insertions(+), 16 deletions(-) create mode 100644 src/drawApp/graphics/PathLineInteraction.ts diff --git a/src/components/draw-app/properties/RunLineProperty.vue b/src/components/draw-app/properties/RunLineProperty.vue index 8858b6d..2b723c1 100644 --- a/src/components/draw-app/properties/RunLineProperty.vue +++ b/src/components/draw-app/properties/RunLineProperty.vue @@ -55,6 +55,12 @@ + @@ -63,6 +69,7 @@ import { RunLineData } from 'src/drawApp/graphics/RunLineInteraction'; import { RunLine } from 'src/graphics/runLine/RunLine'; import { useDrawStore } from 'src/stores/draw-store'; import { onMounted, reactive, watch } from 'vue'; +import { Point } from 'pixi.js'; const drawStore = useDrawStore(); const runLineModel = reactive(new RunLineData()); @@ -90,4 +97,17 @@ function onUpdate() { drawStore.getDrawApp().updateGraphicAndRecord(runLine, runLineModel); } } +function generatePathLine() { + const runLine = drawStore.selectedGraphic as RunLine; + if (runLine) { + const points = runLineModel.points; + const pointsUp: Point[] = []; + const pointsDown: Point[] = []; + points.forEach((item) => { + pointsUp.push(new Point(item.x, item.y - 10)); + pointsDown.push(new Point(item.x, item.y + 10)); + }); + runLine.generatePathLine(pointsUp, pointsDown); + } +} diff --git a/src/drawApp/graphics/PathLineInteraction.ts b/src/drawApp/graphics/PathLineInteraction.ts new file mode 100644 index 0000000..951711a --- /dev/null +++ b/src/drawApp/graphics/PathLineInteraction.ts @@ -0,0 +1,47 @@ +import * as pb_1 from 'google-protobuf'; +import { IPointData } from 'pixi.js'; +import { IPathLineData } from 'src/graphics/pathLine/PathLine'; +import { graphicData } from 'src/protos/stationLayoutGraphics'; +import { GraphicDataBase } from './GraphicDataBase'; + +export class PathLineData extends GraphicDataBase implements IPathLineData { + constructor(data?: graphicData.PathLine) { + let pathLine; + if (!data) { + pathLine = new graphicData.PathLine({ + common: GraphicDataBase.defaultCommonInfo(), + }); + } else { + pathLine = data; + } + super(pathLine); + } + + public get data(): graphicData.PathLine { + return this.getData(); + } + + get code(): string { + return this.data.code; + } + set code(v: string) { + this.data.code = v; + } + get points(): IPointData[] { + return this.data.points; + } + set points(points: IPointData[]) { + this.data.points = points.map( + (p) => new graphicData.Point({ x: p.x, y: p.y }) + ); + } + clone(): PathLineData { + return new PathLineData(this.data.cloneMessage()); + } + copyFrom(data: PathLineData): void { + pb_1.Message.copyInto(data.data, this.data); + } + eq(other: PathLineData): boolean { + return pb_1.Message.equals(this.data, other.data); + } +} diff --git a/src/drawApp/graphics/RunLineInteraction.ts b/src/drawApp/graphics/RunLineInteraction.ts index 8f0d9e9..73776e9 100644 --- a/src/drawApp/graphics/RunLineInteraction.ts +++ b/src/drawApp/graphics/RunLineInteraction.ts @@ -46,6 +46,18 @@ export class RunLineData extends GraphicDataBase implements IRunLineData { set nameBgColor(v: string) { this.data.nameBgColor = v; } + get upPathLineId(): string { + return this.data.upPathLineId; + } + set upPathLineId(v: string) { + this.data.upPathLineId = v; + } + get downPathLineId(): string { + return this.data.downPathLineId; + } + set downPathLineId(v: string) { + this.data.downPathLineId = v; + } clone(): RunLineData { return new RunLineData(this.data.cloneMessage()); } diff --git a/src/drawApp/index.ts b/src/drawApp/index.ts index 1e59366..0036fad 100644 --- a/src/drawApp/index.ts +++ b/src/drawApp/index.ts @@ -52,6 +52,9 @@ import { successNotify, errorNotify } from '../utils/CommonNotify'; import { Section } from 'src/graphics/section/Section'; import { SectionDraw } from 'src/graphics/section/SectionDrawAssistant'; import { SectionData } from './graphics/SectionInteraction'; +import { PathLine } from 'src/graphics/pathLine/PathLine'; +import { PathLineDraw } from 'src/graphics/pathLine/PathLineDrawAssistant'; +import { PathLineData } from './graphics/PathLineInteraction'; export function fromStoragePoint(p: graphicData.Point): Point { return new Point(p.x, p.y); @@ -134,6 +137,7 @@ export function initDrawApp(dom: HTMLElement): JlDrawApp { | RectDraw | TrainLineDraw | PolygonDraw + | PathLineDraw )[] = []; if (draftType === 'Line') { drawAssistants = [ @@ -171,6 +175,9 @@ export function initDrawApp(dom: HTMLElement): JlDrawApp { new TrainLineDraw(app, () => { return new TrainLineData(); }), + new PathLineDraw(app, () => { + return new PathLineData(); + }), ]; app.addKeyboardListener( new KeyListener({ @@ -282,6 +289,9 @@ export function saveDrawDatas(app: JlDrawApp) { } else if (TrainLine.Type === g.type) { const trainLineData = (g as TrainLine).saveData(); storage.trainLines.push((trainLineData as TrainLineData).data); + } else if (PathLine.Type === g.type) { + const pathLineData = (g as PathLine).saveData(); + storage.pathLines.push((pathLineData as PathLineData).data); } }); const base64 = fromUint8Array(storage.serialize()); @@ -343,6 +353,9 @@ export async function loadDrawDatas(app: GraphicApp) { storage.trainLines.forEach((trainLine) => { datas.push(new TrainLineData(trainLine)); }); + storage.pathLines.forEach((pathLine) => { + datas.push(new PathLineData(pathLine)); + }); app.loadGraphic(datas); } else { app.loadGraphic([]); diff --git a/src/graphics/pathLine/PathLineDrawAssistant.ts b/src/graphics/pathLine/PathLineDrawAssistant.ts index 493c2a4..eba1be1 100644 --- a/src/graphics/pathLine/PathLineDrawAssistant.ts +++ b/src/graphics/pathLine/PathLineDrawAssistant.ts @@ -47,7 +47,7 @@ export class PathLineDraw extends GraphicDrawAssistant< new PathLineTemplate(), createData, 'sym_o_horizontal_rule', - '轨迹线PathLine' + '不展示' ); this.container.addChild(this.graphic); PathLinePointsEditPlugin.init(app); @@ -63,14 +63,20 @@ export class PathLineDraw extends GraphicDrawAssistant< this.points = []; this.graphic.clear(); } - onRightClick(): void { - this.createAndStore(true); - } - onLeftDown(e: FederatedPointerEvent): void { - const { x, y } = this.toCanvasCoordinates(e.global); - const p = new Point(x, y); - this.points.push(p); + // onRightClick(): void { + // this.createAndStore(true); + // } + + // onLeftDown(e: FederatedPointerEvent): void { + // const { x, y } = this.toCanvasCoordinates(e.global); + // const p = new Point(x, y); + // this.points.push(p); + // } + quickCreate(points: Point[]) { + this.points = [...points]; + return this.createAndStore(true); } + redraw(p: Point): void { if (this.points.length < 1) return; this.graphic.clear(); diff --git a/src/graphics/runLine/RunLine.ts b/src/graphics/runLine/RunLine.ts index 19d76a7..74a18ed 100644 --- a/src/graphics/runLine/RunLine.ts +++ b/src/graphics/runLine/RunLine.ts @@ -1,6 +1,13 @@ -import { Graphics, IPointData, LINE_JOIN } from 'pixi.js'; -import { GraphicData, JlGraphic, JlGraphicTemplate } from 'src/jl-graphic'; +import { Graphics, IPointData, LINE_JOIN, Point } from 'pixi.js'; +import { + GraphicData, + JlDrawApp, + JlGraphic, + JlGraphicTemplate, +} from 'src/jl-graphic'; import { RunLineName } from './RunLineName'; +import { PathLine } from '../pathLine/PathLine'; +import { PathLineDraw } from '../pathLine/PathLineDrawAssistant'; export interface IRunLineData extends GraphicData { get code(): string; @@ -11,6 +18,11 @@ export interface IRunLineData extends GraphicData { set nameColor(v: string); get nameBgColor(): string; set nameBgColor(v: string); + get upPathLineId(): string; + set upPathLineId(v: string); + get downPathLineId(): string; + set downPathLineId(v: string); + clone(): IRunLineData; copyFrom(data: IRunLineData): void; eq(other: IRunLineData): boolean; @@ -81,6 +93,30 @@ export class RunLine extends JlGraphic { old.points = points; this.updateData(old); } + + generatePathLine(pointsUp: Point[], pointsDown: Point[]) { + const app = this.getGraphicApp() as JlDrawApp; + const pathLineDrawAssistant = app.getDrawAssistant( + PathLine.Type + ) as PathLineDraw; + if (this.datas.upPathLineId) { + const oldUp = app.queryStore.queryById(this.datas.upPathLineId); + if (oldUp) { + app.deleteGraphics(oldUp); + } + } + if (this.datas.downPathLineId) { + const oldDown = app.queryStore.queryById(this.datas.downPathLineId); + if (oldDown) { + app.deleteGraphics(oldDown); + } + } + const pathLineUp = pathLineDrawAssistant.quickCreate(pointsUp); + const pathLineDown = pathLineDrawAssistant.quickCreate(pointsDown); + this.datas.upPathLineId = pathLineUp?.id || ''; + this.datas.downPathLineId = pathLineDown?.id || ''; + } + getStartPoint(): IPointData { return this.datas.points[0]; } diff --git a/src/layouts/DrawLayout.vue b/src/layouts/DrawLayout.vue index 6b93952..c461c7e 100644 --- a/src/layouts/DrawLayout.vue +++ b/src/layouts/DrawLayout.vue @@ -238,6 +238,7 @@ onMounted(() => { .drawAssistants; drawAssistants.forEach( (da: { name: string; icon: string; description: string }) => { + if (da.description === '不展示') return; utilsOption.push( new ControlItem( da.name, diff --git a/src/protos/stationLayoutGraphics.ts b/src/protos/stationLayoutGraphics.ts index 343dc1e..a88a5ec 100644 --- a/src/protos/stationLayoutGraphics.ts +++ b/src/protos/stationLayoutGraphics.ts @@ -21,10 +21,11 @@ export namespace graphicData { stationLines?: StationLine[]; runLines?: RunLine[]; trainLines?: TrainLine[]; + pathLines?: PathLine[]; polygons?: Polygon[]; }) { super(); - pb_1.Message.initialize(this, Array.isArray(data) ? data : [], 0, -1, [2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14], this.#one_of_decls); + pb_1.Message.initialize(this, Array.isArray(data) ? data : [], 0, -1, [2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15], this.#one_of_decls); if (!Array.isArray(data) && typeof data == "object") { if ("canvas" in data && data.canvas != undefined) { this.canvas = data.canvas; @@ -65,6 +66,9 @@ export namespace graphicData { if ("trainLines" in data && data.trainLines != undefined) { this.trainLines = data.trainLines; } + if ("pathLines" in data && data.pathLines != undefined) { + this.pathLines = data.pathLines; + } if ("polygons" in data && data.polygons != undefined) { this.polygons = data.polygons; } @@ -151,11 +155,17 @@ export namespace graphicData { set trainLines(value: TrainLine[]) { pb_1.Message.setRepeatedWrapperField(this, 13, value); } + get pathLines() { + return pb_1.Message.getRepeatedWrapperField(this, PathLine, 14) as PathLine[]; + } + set pathLines(value: PathLine[]) { + pb_1.Message.setRepeatedWrapperField(this, 14, value); + } get polygons() { - return pb_1.Message.getRepeatedWrapperField(this, Polygon, 14) as Polygon[]; + return pb_1.Message.getRepeatedWrapperField(this, Polygon, 15) as Polygon[]; } set polygons(value: Polygon[]) { - pb_1.Message.setRepeatedWrapperField(this, 14, value); + pb_1.Message.setRepeatedWrapperField(this, 15, value); } static fromObject(data: { canvas?: ReturnType; @@ -171,6 +181,7 @@ export namespace graphicData { stationLines?: ReturnType[]; runLines?: ReturnType[]; trainLines?: ReturnType[]; + pathLines?: ReturnType[]; polygons?: ReturnType[]; }): RtssGraphicStorage { const message = new RtssGraphicStorage({}); @@ -213,6 +224,9 @@ export namespace graphicData { if (data.trainLines != null) { message.trainLines = data.trainLines.map(item => TrainLine.fromObject(item)); } + if (data.pathLines != null) { + message.pathLines = data.pathLines.map(item => PathLine.fromObject(item)); + } if (data.polygons != null) { message.polygons = data.polygons.map(item => Polygon.fromObject(item)); } @@ -233,6 +247,7 @@ export namespace graphicData { stationLines?: ReturnType[]; runLines?: ReturnType[]; trainLines?: ReturnType[]; + pathLines?: ReturnType[]; polygons?: ReturnType[]; } = {}; if (this.canvas != null) { @@ -274,6 +289,9 @@ export namespace graphicData { if (this.trainLines != null) { data.trainLines = this.trainLines.map((item: TrainLine) => item.toObject()); } + if (this.pathLines != null) { + data.pathLines = this.pathLines.map((item: PathLine) => item.toObject()); + } if (this.polygons != null) { data.polygons = this.polygons.map((item: Polygon) => item.toObject()); } @@ -309,8 +327,10 @@ export namespace graphicData { writer.writeRepeatedMessage(12, this.runLines, (item: RunLine) => item.serialize(writer)); if (this.trainLines.length) writer.writeRepeatedMessage(13, this.trainLines, (item: TrainLine) => item.serialize(writer)); + if (this.pathLines.length) + writer.writeRepeatedMessage(14, this.pathLines, (item: PathLine) => item.serialize(writer)); if (this.polygons.length) - writer.writeRepeatedMessage(14, this.polygons, (item: Polygon) => item.serialize(writer)); + writer.writeRepeatedMessage(15, this.polygons, (item: Polygon) => item.serialize(writer)); if (!w) return writer.getResultBuffer(); } @@ -360,7 +380,10 @@ export namespace graphicData { reader.readMessage(message.trainLines, () => pb_1.Message.addToRepeatedWrapperField(message, 13, TrainLine.deserialize(reader), TrainLine)); break; case 14: - reader.readMessage(message.polygons, () => pb_1.Message.addToRepeatedWrapperField(message, 14, Polygon.deserialize(reader), Polygon)); + reader.readMessage(message.pathLines, () => pb_1.Message.addToRepeatedWrapperField(message, 14, PathLine.deserialize(reader), PathLine)); + break; + case 15: + reader.readMessage(message.polygons, () => pb_1.Message.addToRepeatedWrapperField(message, 15, Polygon.deserialize(reader), Polygon)); break; default: reader.skipField(); } @@ -2555,6 +2578,8 @@ export namespace graphicData { points?: Point[]; nameColor?: string; nameBgColor?: string; + upPathLineId?: string; + downPathLineId?: string; }) { super(); pb_1.Message.initialize(this, Array.isArray(data) ? data : [], 0, -1, [3], this.#one_of_decls); @@ -2574,6 +2599,12 @@ export namespace graphicData { if ("nameBgColor" in data && data.nameBgColor != undefined) { this.nameBgColor = data.nameBgColor; } + if ("upPathLineId" in data && data.upPathLineId != undefined) { + this.upPathLineId = data.upPathLineId; + } + if ("downPathLineId" in data && data.downPathLineId != undefined) { + this.downPathLineId = data.downPathLineId; + } } } get common() { @@ -2609,12 +2640,26 @@ export namespace graphicData { set nameBgColor(value: string) { pb_1.Message.setField(this, 5, value); } + get upPathLineId() { + return pb_1.Message.getFieldWithDefault(this, 6, "") as string; + } + set upPathLineId(value: string) { + pb_1.Message.setField(this, 6, value); + } + get downPathLineId() { + return pb_1.Message.getFieldWithDefault(this, 7, "") as string; + } + set downPathLineId(value: string) { + pb_1.Message.setField(this, 7, value); + } static fromObject(data: { common?: ReturnType; code?: string; points?: ReturnType[]; nameColor?: string; nameBgColor?: string; + upPathLineId?: string; + downPathLineId?: string; }): RunLine { const message = new RunLine({}); if (data.common != null) { @@ -2632,6 +2677,12 @@ export namespace graphicData { if (data.nameBgColor != null) { message.nameBgColor = data.nameBgColor; } + if (data.upPathLineId != null) { + message.upPathLineId = data.upPathLineId; + } + if (data.downPathLineId != null) { + message.downPathLineId = data.downPathLineId; + } return message; } toObject() { @@ -2641,6 +2692,8 @@ export namespace graphicData { points?: ReturnType[]; nameColor?: string; nameBgColor?: string; + upPathLineId?: string; + downPathLineId?: string; } = {}; if (this.common != null) { data.common = this.common.toObject(); @@ -2657,6 +2710,12 @@ export namespace graphicData { if (this.nameBgColor != null) { data.nameBgColor = this.nameBgColor; } + if (this.upPathLineId != null) { + data.upPathLineId = this.upPathLineId; + } + if (this.downPathLineId != null) { + data.downPathLineId = this.downPathLineId; + } return data; } serialize(): Uint8Array; @@ -2673,6 +2732,10 @@ export namespace graphicData { writer.writeString(4, this.nameColor); if (this.nameBgColor.length) writer.writeString(5, this.nameBgColor); + if (this.upPathLineId.length) + writer.writeString(6, this.upPathLineId); + if (this.downPathLineId.length) + writer.writeString(7, this.downPathLineId); if (!w) return writer.getResultBuffer(); } @@ -2697,6 +2760,12 @@ export namespace graphicData { case 5: message.nameBgColor = reader.readString(); break; + case 6: + message.upPathLineId = reader.readString(); + break; + case 7: + message.downPathLineId = reader.readString(); + break; default: reader.skipField(); } } diff --git a/xian-ncc-da-message b/xian-ncc-da-message index e55bc50..7ee338d 160000 --- a/xian-ncc-da-message +++ b/xian-ncc-da-message @@ -1 +1 @@ -Subproject commit e55bc50a0c82afb9a8b4556550e7618a170ec5e7 +Subproject commit 7ee338d95b87bf92ea59fccf983cb4d4abcf9683