mirror of
https://github.com/nocobase/nocobase
synced 2024-11-15 14:56:00 +00:00
fix: improve plugin settings code (#3028)
This commit is contained in:
parent
34d1406ede
commit
647c8ccdaa
@ -34,7 +34,9 @@ export interface PluginSettingsPageType {
|
|||||||
path: string;
|
path: string;
|
||||||
sort?: number;
|
sort?: number;
|
||||||
name?: string;
|
name?: string;
|
||||||
pluginName?: string;
|
isAllow?: boolean;
|
||||||
|
topLevelName?: string;
|
||||||
|
aclSnippet: string;
|
||||||
children?: PluginSettingsPageType[];
|
children?: PluginSettingsPageType[];
|
||||||
[index: string]: any;
|
[index: string]: any;
|
||||||
}
|
}
|
||||||
@ -66,8 +68,8 @@ export class PluginSettingsManager {
|
|||||||
|
|
||||||
add(name: string, options: PluginSettingsManagerSettingOptionsType) {
|
add(name: string, options: PluginSettingsManagerSettingOptionsType) {
|
||||||
const nameArr = name.split('.');
|
const nameArr = name.split('.');
|
||||||
const pluginName = nameArr[0];
|
const topLevelName = nameArr[0];
|
||||||
this.settings[name] = { Component: Outlet, ...options, name, pluginName };
|
this.settings[name] = { Component: Outlet, ...options, name, topLevelName };
|
||||||
|
|
||||||
// add children
|
// add children
|
||||||
if (nameArr.length > 1) {
|
if (nameArr.length > 1) {
|
||||||
@ -129,8 +131,7 @@ export class PluginSettingsManager {
|
|||||||
}
|
}
|
||||||
|
|
||||||
getList(filterAuth = true): PluginSettingsPageType[] {
|
getList(filterAuth = true): PluginSettingsPageType[] {
|
||||||
return Object.keys(this.settings)
|
return Array.from(new Set(Object.values(this.settings).map((item) => item.topLevelName)))
|
||||||
.filter((item) => !item.includes('.')) // top level
|
|
||||||
.sort((a, b) => a.localeCompare(b)) // sort by name
|
.sort((a, b) => a.localeCompare(b)) // sort by name
|
||||||
.map((name) => this.get(name, filterAuth))
|
.map((name) => this.get(name, filterAuth))
|
||||||
.filter(Boolean)
|
.filter(Boolean)
|
||||||
|
@ -35,7 +35,6 @@ export const SettingsCenterDropdown = () => {
|
|||||||
const app = useApp();
|
const app = useApp();
|
||||||
const settings = app.pluginSettingsManager.getList();
|
const settings = app.pluginSettingsManager.getList();
|
||||||
const [open, setOpen] = useState(false);
|
const [open, setOpen] = useState(false);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ActionContextProvider value={{ visible, setVisible }}>
|
<ActionContextProvider value={{ visible, setVisible }}>
|
||||||
<Popover
|
<Popover
|
||||||
@ -64,7 +63,7 @@ export const SettingsCenterDropdown = () => {
|
|||||||
background: rgba(0, 0, 0, 0.045);
|
background: rgba(0, 0, 0, 0.045);
|
||||||
}
|
}
|
||||||
`}
|
`}
|
||||||
key={setting.pluginName}
|
key={setting.name}
|
||||||
>
|
>
|
||||||
<a
|
<a
|
||||||
role="button"
|
role="button"
|
||||||
|
@ -69,22 +69,20 @@ export const SettingsCenterComponent = () => {
|
|||||||
}, [settings]);
|
}, [settings]);
|
||||||
|
|
||||||
const currentSetting = useMemo(() => settingsMapByPath[location.pathname], [location.pathname, settingsMapByPath]);
|
const currentSetting = useMemo(() => settingsMapByPath[location.pathname], [location.pathname, settingsMapByPath]);
|
||||||
const currentPlugin = useMemo(() => {
|
const currentTopLevelSetting = useMemo(() => {
|
||||||
if (!currentSetting) {
|
if (!currentSetting) {
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
return settings.find((item) => item.name === currentSetting.pluginName);
|
return settings.find((item) => item.name === currentSetting.topLevelName);
|
||||||
}, [currentSetting, settings]);
|
}, [currentSetting, settings]);
|
||||||
|
|
||||||
const sidebarMenus = useMemo(() => {
|
const sidebarMenus = useMemo(() => {
|
||||||
return getMenuItems(settings.map((item) => ({ ...item, children: null })));
|
return getMenuItems(settings.map((item) => ({ ...item, children: null })));
|
||||||
}, [settings]);
|
}, [settings]);
|
||||||
|
|
||||||
if (!currentSetting || location.pathname === ADMIN_SETTINGS_PATH || location.pathname === ADMIN_SETTINGS_PATH + '/') {
|
if (!currentSetting || location.pathname === ADMIN_SETTINGS_PATH || location.pathname === ADMIN_SETTINGS_PATH + '/') {
|
||||||
return <Navigate replace to={getFirstDeepChildPath(settings)} />;
|
return <Navigate replace to={getFirstDeepChildPath(settings)} />;
|
||||||
}
|
}
|
||||||
if (location.pathname === currentPlugin.path && currentPlugin.children?.length > 0) {
|
if (location.pathname === currentTopLevelSetting.path && currentTopLevelSetting.children?.length > 0) {
|
||||||
return <Navigate replace to={getFirstDeepChildPath(currentPlugin.children)} />;
|
return <Navigate replace to={getFirstDeepChildPath(currentTopLevelSetting.children)} />;
|
||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
@ -106,7 +104,7 @@ export const SettingsCenterComponent = () => {
|
|||||||
theme={'light'}
|
theme={'light'}
|
||||||
>
|
>
|
||||||
<Menu
|
<Menu
|
||||||
selectedKeys={[currentSetting?.pluginName]}
|
selectedKeys={[currentSetting?.topLevelName]}
|
||||||
style={{ height: 'calc(100vh - 46px)', overflowY: 'auto', overflowX: 'hidden' }}
|
style={{ height: 'calc(100vh - 46px)', overflowY: 'auto', overflowX: 'hidden' }}
|
||||||
onClick={({ key }) => {
|
onClick={({ key }) => {
|
||||||
const plugin = settings.find((item) => item.name === key);
|
const plugin = settings.find((item) => item.name === key);
|
||||||
@ -124,12 +122,12 @@ export const SettingsCenterComponent = () => {
|
|||||||
<PageHeader
|
<PageHeader
|
||||||
className={styles.pageHeader}
|
className={styles.pageHeader}
|
||||||
style={{
|
style={{
|
||||||
paddingBottom: currentPlugin.children?.length > 0 ? 0 : theme.paddingSM,
|
paddingBottom: currentTopLevelSetting.children?.length > 0 ? 0 : theme.paddingSM,
|
||||||
}}
|
}}
|
||||||
ghost={false}
|
ghost={false}
|
||||||
title={currentPlugin.title}
|
title={currentTopLevelSetting.title}
|
||||||
footer={
|
footer={
|
||||||
currentPlugin.children?.length > 0 && (
|
currentTopLevelSetting.children?.length > 0 && (
|
||||||
<Menu
|
<Menu
|
||||||
style={{ marginLeft: -theme.margin }}
|
style={{ marginLeft: -theme.margin }}
|
||||||
onClick={({ key }) => {
|
onClick={({ key }) => {
|
||||||
@ -137,7 +135,7 @@ export const SettingsCenterComponent = () => {
|
|||||||
}}
|
}}
|
||||||
selectedKeys={[currentSetting?.name]}
|
selectedKeys={[currentSetting?.name]}
|
||||||
mode="horizontal"
|
mode="horizontal"
|
||||||
items={getMenuItems(currentPlugin.children)}
|
items={getMenuItems(currentTopLevelSetting.children)}
|
||||||
></Menu>
|
></Menu>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user