JLNTV_IPD/tmagic-editor
4
0
Fork 0
mirror of https://github.com/Tencent/tmagic-editor.git synced 2025-06-03 14:39:19 +08:00
Code Issues Projects Releases Wiki Activity

feat(editor): uiService支持插件扩展

Browse Source
This commit is contained in:
roymondchen 2022-09-13 20:12:22 +08:00 committed by jia000
parent 3a5bd4e216
commit b915accb71
3 changed files with 9 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/editor/src/layouts/NavMenu.vue
View File

@ -123,7 +123,7 @@ const getConfig = (item: MenuItem): (MenuButton | MenuComponent)[] => {
className: 'scale-to-fit', className: 'scale-to-fit',
icon: markRaw(FullScreen), icon: markRaw(FullScreen),
tooltip: `缩放以适应(${ctrl}+0)`, tooltip: `缩放以适应(${ctrl}+0)`,
handler: () => uiService?.set('zoom', uiService.calcZoom()), handler: async () => uiService?.set('zoom', await uiService.calcZoom()),
}); });
break; break;
case 'rule': case 'rule':

4
packages/editor/src/layouts/workspace/Workspace.vue
View File

@ -139,9 +139,9 @@ onMounted(() => {
e.inputEvent.preventDefault(); e.inputEvent.preventDefault();
services?.uiService.zoom(-0.1); services?.uiService.zoom(-0.1);
}) })
.keydown([ctrl, '0'], (e) => { .keydown([ctrl, '0'], async (e) => {
e.inputEvent.preventDefault(); e.inputEvent.preventDefault();
services?.uiService.set('zoom', services.uiService.calcZoom()); services?.uiService.set('zoom', await services.uiService.calcZoom());
}) })
.keydown([ctrl, '1'], (e) => { .keydown([ctrl, '1'], (e) => {
e.inputEvent.preventDefault(); e.inputEvent.preventDefault();

12
packages/editor/src/services/ui.ts
View File

@ -59,7 +59,7 @@ const state = reactive<UiState>({
class Ui extends BaseService { class Ui extends BaseService {
constructor() { constructor() {
super([]); super(['initColumnWidth', 'zoom', 'calcZoom']);
globalThis.addEventListener('resize', () => { globalThis.addEventListener('resize', () => {
this.setColumnWidth({ this.setColumnWidth({
center: 'auto', center: 'auto',
@ -95,7 +95,7 @@ class Ui extends BaseService {
return (state as any)[name]; return (state as any)[name];
} }
public initColumnWidth() { public async initColumnWidth() {
const columnWidthCacheData = globalThis.localStorage.getItem(COLUMN_WIDTH_STORAGE_KEY); const columnWidthCacheData = globalThis.localStorage.getItem(COLUMN_WIDTH_STORAGE_KEY);
if (columnWidthCacheData) { if (columnWidthCacheData) {
try { try {
@ -107,12 +107,12 @@ class Ui extends BaseService {
} }
} }
public zoom(zoom: number) { public async zoom(zoom: number) {
this.set('zoom', (this.get<number>('zoom') * 100 + zoom * 100) / 100); this.set('zoom', (this.get<number>('zoom') * 100 + zoom * 100) / 100);
if (this.get<number>('zoom') < 0.1) this.set('zoom', 0.1); if (this.get<number>('zoom') < 0.1) this.set('zoom', 0.1);
} }
public calcZoom() { public async calcZoom() {
const { stageRect, stageContainerRect } = state; const { stageRect, stageContainerRect } = state;
const { height, width } = stageContainerRect; const { height, width } = stageContainerRect;
if (!width || !height) return 1; if (!width || !height) return 1;
@ -162,12 +162,12 @@ class Ui extends BaseService {
state.columnWidth = columnWidth; state.columnWidth = columnWidth;
} }
private setStageRect(value: StageRect) { private async setStageRect(value: StageRect) {
state.stageRect = { state.stageRect = {
...state.stageRect, ...state.stageRect,
...value, ...value,
}; };
state.zoom = this.calcZoom(); state.zoom = await this.calcZoom();
} }
} }