fix: 1.修复 rax 路由问题 2.切换 designMode 重新 setupSelection 3.settingpane add state shouldIgnoreRoot

This commit is contained in:
wanying.jwy 2020-09-17 14:32:20 +08:00
parent 933cef1c8a
commit 890ec7617f
4 changed files with 66 additions and 27 deletions

View File

@ -171,27 +171,6 @@ export class Designer {
node.document.simulator?.scrollToNode(node, detail); node.document.simulator?.scrollToNode(node, detail);
}); });
let selectionDispose: undefined | (() => void);
const setupSelection = () => {
if (selectionDispose) {
selectionDispose();
selectionDispose = undefined;
}
const currentSelection = this.currentSelection;
// TODO: 避免选中 Page 组件,默认选中第一个子节点;新增规则 或 判断 Live 模式
if (currentSelection && currentSelection.selected.length === 0 && this.simulatorProps?.designMode === 'live') {
const rootNodeChildrens = this.currentDocument.getRoot().getChildren().children;
if (rootNodeChildrens.length > 0) {
currentSelection.select(rootNodeChildrens[0].id);
}
}
this.postEvent('selection.change', currentSelection);
if (currentSelection) {
selectionDispose = currentSelection.onSelectionChange(() => {
this.postEvent('selection.change', currentSelection);
});
}
};
let historyDispose: undefined | (() => void); let historyDispose: undefined | (() => void);
const setupHistory = () => { const setupHistory = () => {
if (historyDispose) { if (historyDispose) {
@ -210,17 +189,39 @@ export class Designer {
this.postEvent('current-document.change', this.currentDocument); this.postEvent('current-document.change', this.currentDocument);
this.postEvent('selection.change', this.currentSelection); this.postEvent('selection.change', this.currentSelection);
this.postEvent('history.change', this.currentHistory); this.postEvent('history.change', this.currentHistory);
setupSelection(); this.setupSelection();
setupHistory(); setupHistory();
}); });
this.postEvent('designer.init', this); this.postEvent('designer.init', this);
setupSelection(); this.setupSelection();
setupHistory(); setupHistory();
// TODO: 先简单实现,后期通过焦点赋值 // TODO: 先简单实现,后期通过焦点赋值
focusing.focusDesigner = this; focusing.focusDesigner = this;
} }
setupSelection = () => {
let selectionDispose: undefined | (() => void);
if (selectionDispose) {
selectionDispose();
selectionDispose = undefined;
}
const currentSelection = this.currentSelection;
// TODO: 避免选中 Page 组件,默认选中第一个子节点;新增规则 或 判断 Live 模式
if (currentSelection && currentSelection.selected.length === 0 && this.simulatorProps?.designMode === 'live') {
const rootNodeChildrens = this.currentDocument.getRoot().getChildren().children;
if (rootNodeChildrens.length > 0) {
currentSelection.select(rootNodeChildrens[0].id);
}
}
this.postEvent('selection.change', currentSelection);
if (currentSelection) {
selectionDispose = currentSelection.onSelectionChange(() => {
this.postEvent('selection.change', currentSelection);
});
}
};
postEvent(event: string, ...args: any[]) { postEvent(event: string, ...args: any[]) {
this.editor.emit(`designer.${event}`, ...args); this.editor.emit(`designer.${event}`, ...args);
} }
@ -329,6 +330,10 @@ export class Designer {
} }
if (props.simulatorProps !== this.props.simulatorProps) { if (props.simulatorProps !== this.props.simulatorProps) {
this._simulatorProps = props.simulatorProps; this._simulatorProps = props.simulatorProps;
// 重新 setupSelection
if (props.simulatorProps?.designMode !== this.props.simulatorProps?.designMode) {
this.setupSelection();
}
} }
if (props.suspensed !== this.props.suspensed && props.suspensed != null) { if (props.suspensed !== this.props.suspensed && props.suspensed != null) {
this.suspensed = props.suspensed; this.suspensed = props.suspensed;

View File

@ -9,7 +9,10 @@ import { SkeletonContext } from '../../context';
import { createIcon } from '@ali/lowcode-utils'; import { createIcon } from '@ali/lowcode-utils';
@observer @observer
export class SettingsPrimaryPane extends Component<{ editor: Editor; config: any }> { export class SettingsPrimaryPane extends Component<{ editor: Editor; config: any }, { shouldIgnoreRoot: boolean }> {
state = {
shouldIgnoreRoot: false,
};
private main = new SettingsMain(this.props.editor); private main = new SettingsMain(this.props.editor);
@obx.ref private _activeKey?: any; @obx.ref private _activeKey?: any;
@ -18,6 +21,17 @@ export class SettingsPrimaryPane extends Component<{ editor: Editor; config: any
return false; return false;
} }
componentDidMount() {
this.setShouldIgnoreRoot();
}
async setShouldIgnoreRoot() {
let designMode = await this.props.editor.get('designMode');
this.setState({
shouldIgnoreRoot: designMode === 'live',
})
}
componentWillUnmount() { componentWillUnmount() {
this.main.purge(); this.main.purge();
} }
@ -25,7 +39,8 @@ export class SettingsPrimaryPane extends Component<{ editor: Editor; config: any
renderBreadcrumb() { renderBreadcrumb() {
const { settings } = this.main; const { settings } = this.main;
const { config } = this.props; const { config } = this.props;
const shouldIgnoreRoot = config.props?.ignoreRoot; // const shouldIgnoreRoot = config.props?.ignoreRoot;
const { shouldIgnoreRoot } = this.state;
if (!settings) { if (!settings) {
return null; return null;
} }

View File

@ -209,13 +209,26 @@ function getInitialComponent(routerConfig) {
let unlisten = null; let unlisten = null;
let handleId = null; let handleId = null;
let pathes = '';
export function useRouter(routerConfig) { export function useRouter(routerConfig) {
const [component, setComponent] = useState(getInitialComponent(routerConfig)); const [component, setComponent] = useState(getInitialComponent(routerConfig));
let newPathes = '';
if (routerConfig) { if (routerConfig) {
_routerConfig = routerConfig; _routerConfig = routerConfig;
const routes = _routerConfig.routes; const routes = _routerConfig.routes;
router.root = Array.isArray(routes) ? { routes } : routes; router.root = Array.isArray(routes) ? { routes } : routes;
if (Array.isArray(routes)) {
newPathes = routes.map(it => it.path).join(',');
} else {
newPathes = routes.path;
}
}
if (_initialized && _routerConfig.history) {
if (newPathes !== pathes) {
matchLocation(_routerConfig.history.location);
pathes = newPathes;
}
} }
useLayoutEffect(() => { useLayoutEffect(() => {
@ -241,15 +254,18 @@ export function useRouter(routerConfig) {
// Init path match // Init path match
if (_initialized || !_routerConfig.InitialComponent) { if (_initialized || !_routerConfig.InitialComponent) {
matchLocation(history.location); matchLocation(history.location);
pathes = newPathes;
} }
unlisten = history.listen(({ location }) => { unlisten = history.listen(({ location }) => {
matchLocation(location); matchLocation(location);
pathes = newPathes;
}); });
_initialized = true; _initialized = true;
return () => { return () => {
pathes = '';
router.removeHandle(handleId); router.removeHandle(handleId);
handleId = null; handleId = null;
unlisten(); unlisten();

View File

@ -273,7 +273,6 @@ export class SimulatorRendererContainer implements BuiltinSimulatorRenderer {
return inst; return inst;
}); });
this.emitter.emit('layoutChange');
const path = host.project.currentDocument ? documentInstanceMap.get(host.project.currentDocument.id)!.path : '/'; const path = host.project.currentDocument ? documentInstanceMap.get(host.project.currentDocument.id)!.path : '/';
if (firstRun) { if (firstRun) {
initialEntry = path; initialEntry = path;
@ -281,6 +280,7 @@ export class SimulatorRendererContainer implements BuiltinSimulatorRenderer {
if (this.history.location.pathname !== path) { if (this.history.location.pathname !== path) {
this.history.replace(path); this.history.replace(path);
} }
this.emitter.emit('layoutChange');
} }
}); });
const history = createMemoryHistory({ const history = createMemoryHistory({
@ -305,6 +305,9 @@ export class SimulatorRendererContainer implements BuiltinSimulatorRenderer {
replace(path: string, params?: object) { replace(path: string, params?: object) {
history.replace(withQueryParams(path, params)); history.replace(withQueryParams(path, params));
}, },
back() {
history.back();
}
}, },
legaoBuiltins: { legaoBuiltins: {
getUrlParams() { getUrlParams() {