From ba2ea93312b1f8bd583bc158c8bd97586dc96e31 Mon Sep 17 00:00:00 2001 From: joylink_zhaoerwei Date: Fri, 13 Sep 2024 18:16:06 +0800 Subject: [PATCH] =?UTF-8?q?=E6=8B=86app=EF=BC=8C=E5=A2=9E=E5=8A=A0commonAp?= =?UTF-8?q?p?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/drawApp/commonApp.ts | 109 +++++++++++++++++++++++++++++++++++ src/drawApp/drawApp.ts | 120 ++++++--------------------------------- 2 files changed, 127 insertions(+), 102 deletions(-) create mode 100644 src/drawApp/commonApp.ts diff --git a/src/drawApp/commonApp.ts b/src/drawApp/commonApp.ts new file mode 100644 index 0000000..e742cfb --- /dev/null +++ b/src/drawApp/commonApp.ts @@ -0,0 +1,109 @@ +import { + ContextMenu, + GraphicData, + IDrawApp, + MenuItemOptions, +} from 'jl-graphic'; +import { useDrawStore } from 'src/stores/draw-store'; +import { iscsGraphicData } from 'src/protos/iscs_graphic_data'; +import { toStorageTransform } from './graphics/GraphicDataBase'; +import { Arrow, ArrowTemplate } from 'src/graphics/arrow/Arrow'; +import { ArrowData } from './graphics/ArrowInteraction'; +import { ArrowDraw } from 'src/graphics/arrow/ArrowDrawAssistant'; + +const UndoOptions: MenuItemOptions = { + name: '撤销', +}; +const RedoOptions: MenuItemOptions = { + name: '重做', +}; +const SelectAllOptions: MenuItemOptions = { + name: '全选', +}; + +export const DefaultCanvasMenu = new ContextMenu({ + name: '绘制-画布菜单', + groups: [ + { + items: [UndoOptions, RedoOptions], + }, + { + items: [SelectAllOptions], + }, + ], +}); + +export function initCommonDrawApp(app: IDrawApp) { + new ArrowDraw(app, new ArrowTemplate(new ArrowData())); + // 画布右键菜单 + app.registerMenu(DefaultCanvasMenu); + + app.canvas.on('_rightclick', (e) => { + if (app.drawing) return; + UndoOptions.disabled = !app.opRecord.hasUndo; + RedoOptions.disabled = !app.opRecord.hasRedo; + + UndoOptions.handler = () => { + app.opRecord.undo(); + }; + RedoOptions.handler = () => { + app.opRecord.redo(); + }; + SelectAllOptions.handler = () => { + app.selectAllGraphics(); + }; + DefaultCanvasMenu.open(e.global); + }); + app.on('destroy', async () => {}); +} + +export function loadCommonDrawDatas( + storage: iscsGraphicData.IscsGraphicStorage +): GraphicData[] { + const datas: GraphicData[] = []; + console.log(storage, 'storage'); + storage.arrows.forEach((arrow) => { + datas.push(new ArrowData(arrow)); + }); + return datas; +} + +export function saveCommonDrawDatas(app: IDrawApp) { + const storage = new iscsGraphicData.IscsGraphicStorage(); + const canvasData = app.canvas.saveData(); + storage.canvas = new iscsGraphicData.Canvas({ + width: canvasData.width, + height: canvasData.height, + backgroundColor: canvasData.backgroundColor, + viewportTransform: toStorageTransform(canvasData.viewportTransform), + }); + const graphics = app.queryStore.getAllGraphics(); + graphics.forEach((g) => { + if (Arrow.Type === g.type) { + const arrowData = (g as Arrow).saveData(); + storage.arrows.push((arrowData as ArrowData).data); + } + }); + + return storage; +} + +export function saveDrawToServer(base64: string) { + const drawStore = useDrawStore(); + const id = drawStore.draftId; + if (!id) { + return; + } + console.log('save' + base64); +} + +let UniqueIdPrefix = new iscsGraphicData.UniqueIdOfStationLayout(); +export function loadUniqueIdPrefix() { + return UniqueIdPrefix; +} + +export function setUniqueIdPrefix( + newUniqueIdPrefix: iscsGraphicData.UniqueIdOfStationLayout +) { + UniqueIdPrefix = newUniqueIdPrefix; +} diff --git a/src/drawApp/drawApp.ts b/src/drawApp/drawApp.ts index 065f0ce..f952af4 100644 --- a/src/drawApp/drawApp.ts +++ b/src/drawApp/drawApp.ts @@ -1,48 +1,24 @@ // import { fromUint8Array } from 'js-base64'; import { CombinationKey, - ContextMenu, IDrawApp, IGraphicStorage, JlGraphic, KeyListener, - MenuItemOptions, newDrawApp, } from 'jl-graphic'; import { useDrawStore } from 'src/stores/draw-store'; import { iscsGraphicData } from 'src/protos/iscs_graphic_data'; import { toStorageTransform } from './graphics/GraphicDataBase'; import { fromUint8Array } from 'js-base64'; -import { Arrow, ArrowTemplate } from 'src/graphics/arrow/Arrow'; -import { ArrowData } from './graphics/ArrowInteraction'; -import { ArrowDraw } from 'src/graphics/arrow/ArrowDrawAssistant'; - -// import { Notify } from 'quasar'; +import { + initCommonDrawApp, + saveCommonDrawDatas, + saveDrawToServer, +} from './commonApp'; let drawApp: IDrawApp | null = null; -const UndoOptions: MenuItemOptions = { - name: '撤销', -}; -const RedoOptions: MenuItemOptions = { - name: '重做', -}; -const SelectAllOptions: MenuItemOptions = { - name: '全选', -}; - -export const DefaultCanvasMenu = new ContextMenu({ - name: '绘制-画布菜单', - groups: [ - { - items: [UndoOptions, RedoOptions], - }, - { - items: [SelectAllOptions], - }, - ], -}); - export function getDrawApp(): IDrawApp | null { return drawApp; } @@ -54,27 +30,6 @@ export function destroyDrawApp(): void { } } -export const drawLayerList = [ - // 图层列表 默认显示的图层defaultShow: true -]; - -// function initShowLayer(app: IDrawApp) { -// const showTypeList: string[] = []; -// drawLayerList.forEach((item) => { -// if (item.defaultShow) { -// showTypeList.push(item.value); -// } -// }); -// const alllGraphic = app.queryStore.getAllGraphics(); -// alllGraphic.forEach((g) => { -// if (showTypeList.includes(g.type)) { -// g.visible = true; -// } else { -// g.visible = false; -// } -// }); -// } - export function initDrawApp(): IDrawApp { const isSupportDeletion = (g: JlGraphic) => { console.log(g); @@ -85,24 +40,8 @@ export function initDrawApp(): IDrawApp { isSupportDeletion: isSupportDeletion, }); const app = drawApp; - new ArrowDraw(drawApp, new ArrowTemplate(new ArrowData())); - app.canvas.on('_rightclick', (e) => { - if (app.drawing) return; - UndoOptions.disabled = !app.opRecord.hasUndo; - RedoOptions.disabled = !app.opRecord.hasRedo; + initCommonDrawApp(app); - UndoOptions.handler = () => { - app.opRecord.undo(); - }; - RedoOptions.handler = () => { - app.opRecord.redo(); - }; - SelectAllOptions.handler = () => { - app.selectAllGraphics(); - }; - DefaultCanvasMenu.open(e.global); - }); - app.on('destroy', async () => {}); app.addKeyboardListener( new KeyListener({ value: 'KeyS', @@ -113,9 +52,6 @@ export function initDrawApp(): IDrawApp { }, }) ); - // app.on('postdataloaded', () => { - // initShowLayer(app); - // }); return drawApp; } @@ -125,13 +61,19 @@ export async function loadDrawDatas(): Promise { if (!id) { throw new Error('获取数据异常：为获取到草稿地图ID'); } + /* const { proto: base64 } = await getDraft(id); + if (base64) { + const storage = iscsGraphicData.IscsGraphicStorage.deserialize( + toUint8Array(base64) + ); + const datas = loadCommonDrawDatas(storage);} */ return Promise.resolve({ datas: [], }); } export function saveDrawDatas(app: IDrawApp) { - const storage = new iscsGraphicData.IscsGraphicStorage(); + const storage = saveCommonDrawDatas(app); const canvasData = app.canvas.saveData(); storage.canvas = new iscsGraphicData.Canvas({ width: canvasData.width, @@ -140,38 +82,12 @@ export function saveDrawDatas(app: IDrawApp) { viewportTransform: toStorageTransform(canvasData.viewportTransform), }); const graphics = app.queryStore.getAllGraphics(); - if (Arrow.Type === g.type) { - const arrowData = (g as Arrow).saveData(); - storage.arrows.push((arrowData as ArrowData).data); - } + /* graphics.forEach((g) => { + if (TrackSection.Type === g.type) { + const trackSectionData = (g as TrackSection).saveData(); + storage.trackSections.push((trackSectionData as TrackSectionData).data); + } }) */ console.log(storage, '保存数据', graphics); const base64 = fromUint8Array(storage.serialize()); return base64; } - -export function loadCommonDrawDatas(storage: any): any[] { - const datas: any[] = []; - console.log(storage, 'storage'); - - return datas; -} - -export function saveDrawToServer(base64: string) { - const drawStore = useDrawStore(); - const id = drawStore.draftId; - if (!id) { - return; - } - console.log('save' + base64); -} - -let UniqueIdPrefix = new iscsGraphicData.UniqueIdOfStationLayout(); -export function loadUniqueIdPrefix() { - return UniqueIdPrefix; -} - -export function setUniqueIdPrefix( - newUniqueIdPrefix: iscsGraphicData.UniqueIdOfStationLayout -) { - UniqueIdPrefix = newUniqueIdPrefix; -}