fix: menu auto fold
This commit is contained in:
parent
1a40f1e365
commit
4620a42932
@ -13,7 +13,7 @@ import {
|
|||||||
RemoteSchemaTemplateManagerProvider,
|
RemoteSchemaTemplateManagerProvider,
|
||||||
useDocumentTitle,
|
useDocumentTitle,
|
||||||
useRoute,
|
useRoute,
|
||||||
useSystemSettings
|
useSystemSettings,
|
||||||
} from '../../../';
|
} from '../../../';
|
||||||
|
|
||||||
const InternalAdminLayout = (props: any) => {
|
const InternalAdminLayout = (props: any) => {
|
||||||
|
@ -192,59 +192,66 @@ export const Menu: ComposedMenu = observer((props) => {
|
|||||||
<DndContext>
|
<DndContext>
|
||||||
<MenuItemDesignerContext.Provider value={Designer}>
|
<MenuItemDesignerContext.Provider value={Designer}>
|
||||||
<MenuModeContext.Provider value={mode}>
|
<MenuModeContext.Provider value={mode}>
|
||||||
<AntdMenu
|
<div
|
||||||
{...others}
|
|
||||||
style={{
|
style={{
|
||||||
width: mode === 'mix' ? '100%' : undefined,
|
width: 'calc(100% - 200px - 390px)',
|
||||||
|
display: 'flex',
|
||||||
|
justifyContent: 'flex-start',
|
||||||
|
alignItems: 'center',
|
||||||
}}
|
}}
|
||||||
className={css`
|
|
||||||
.ant-menu-item:hover {
|
|
||||||
> .ant-menu-title-content > div {
|
|
||||||
.general-schema-designer {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
`}
|
|
||||||
onSelect={(info: any) => {
|
|
||||||
const s = schema.properties[info.key];
|
|
||||||
if (mode === 'mix') {
|
|
||||||
setSideMenuSchema(s);
|
|
||||||
if (s['x-component'] !== 'Menu.SubMenu') {
|
|
||||||
onSelect && onSelect(info);
|
|
||||||
} else {
|
|
||||||
const menuItemSchema = findMenuItem(s);
|
|
||||||
if (!menuItemSchema) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
// TODO
|
|
||||||
setLoading(true);
|
|
||||||
const keys = findKeysByUid(schema, menuItemSchema['x-uid']);
|
|
||||||
setDefaultSelectedKeys(keys);
|
|
||||||
setTimeout(() => {
|
|
||||||
setLoading(false);
|
|
||||||
}, 100);
|
|
||||||
onSelect &&
|
|
||||||
onSelect({
|
|
||||||
key: menuItemSchema.name,
|
|
||||||
item: {
|
|
||||||
props: {
|
|
||||||
schema: menuItemSchema,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
onSelect && onSelect(info);
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
mode={mode === 'mix' ? 'horizontal' : mode}
|
|
||||||
defaultOpenKeys={defaultOpenKeys}
|
|
||||||
defaultSelectedKeys={defaultSelectedKeys}
|
|
||||||
>
|
>
|
||||||
<RecursionField schema={schema} onlyRenderProperties />
|
<AntdMenu
|
||||||
{render({ style: { background: 'none', marginTop: 7, marginLeft: 8 } })}
|
{...others}
|
||||||
</AntdMenu>
|
style={{
|
||||||
|
width: mode === 'mix' ? '100%' : undefined,
|
||||||
|
}}
|
||||||
|
className={css`
|
||||||
|
.ant-menu-item:hover {
|
||||||
|
> .ant-menu-title-content > div {
|
||||||
|
.general-schema-designer {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`}
|
||||||
|
onSelect={(info: any) => {
|
||||||
|
const s = schema.properties[info.key];
|
||||||
|
if (mode === 'mix') {
|
||||||
|
setSideMenuSchema(s);
|
||||||
|
if (s['x-component'] !== 'Menu.SubMenu') {
|
||||||
|
onSelect && onSelect(info);
|
||||||
|
} else {
|
||||||
|
const menuItemSchema = findMenuItem(s);
|
||||||
|
if (!menuItemSchema) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
// TODO
|
||||||
|
setLoading(true);
|
||||||
|
const keys = findKeysByUid(schema, menuItemSchema['x-uid']);
|
||||||
|
setDefaultSelectedKeys(keys);
|
||||||
|
setTimeout(() => {
|
||||||
|
setLoading(false);
|
||||||
|
}, 100);
|
||||||
|
onSelect &&
|
||||||
|
onSelect({
|
||||||
|
key: menuItemSchema.name,
|
||||||
|
item: {
|
||||||
|
props: {
|
||||||
|
schema: menuItemSchema,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
onSelect && onSelect(info);
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
mode={mode === 'mix' ? 'horizontal' : mode}
|
||||||
|
defaultOpenKeys={defaultOpenKeys}
|
||||||
|
defaultSelectedKeys={defaultSelectedKeys}
|
||||||
|
></AntdMenu>
|
||||||
|
{render({ style: { background: 'none' } })}
|
||||||
|
</div>
|
||||||
{loading
|
{loading
|
||||||
? null
|
? null
|
||||||
: mode === 'mix' &&
|
: mode === 'mix' &&
|
||||||
|
@ -13,7 +13,7 @@ import {
|
|||||||
SchemaComponentOptions,
|
SchemaComponentOptions,
|
||||||
useActionContext,
|
useActionContext,
|
||||||
useAPIClient,
|
useAPIClient,
|
||||||
useCollection
|
useCollection,
|
||||||
} from '..';
|
} from '..';
|
||||||
import { useSchemaTemplateManager } from '../schema-templates';
|
import { useSchemaTemplateManager } from '../schema-templates';
|
||||||
import { useBlockTemplateContext } from '../schema-templates/BlockTemplate';
|
import { useBlockTemplateContext } from '../schema-templates/BlockTemplate';
|
||||||
@ -182,11 +182,11 @@ SchemaSettings.Template = (props) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
SchemaSettings.Item = (props) => {
|
SchemaSettings.Item = (props) => {
|
||||||
const { eventKey } = props;
|
let { eventKey } = props;
|
||||||
return (
|
return (
|
||||||
<Menu.Item
|
<Menu.Item
|
||||||
key={eventKey}
|
key={eventKey}
|
||||||
eventKey={eventKey}
|
eventKey={eventKey as any}
|
||||||
{...props}
|
{...props}
|
||||||
onClick={(info) => {
|
onClick={(info) => {
|
||||||
info.domEvent.preventDefault();
|
info.domEvent.preventDefault();
|
||||||
@ -200,10 +200,6 @@ SchemaSettings.Item = (props) => {
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
SchemaSettings.ItemGroup = (props) => {
|
|
||||||
return <Menu.ItemGroup {...props}>{props.children || props.title}</Menu.ItemGroup>;
|
|
||||||
};
|
|
||||||
|
|
||||||
SchemaSettings.SubMenu = (props) => {
|
SchemaSettings.SubMenu = (props) => {
|
||||||
return <Menu.SubMenu {...props} />;
|
return <Menu.SubMenu {...props} />;
|
||||||
};
|
};
|
||||||
|
Loading…
Reference in New Issue
Block a user