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

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

View File

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

View File

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

View File

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