diff --git a/packages/client/src/components/admin-layout/More.tsx b/packages/client/src/components/admin-layout/More.tsx new file mode 100644 index 000000000..92540375a --- /dev/null +++ b/packages/client/src/components/admin-layout/More.tsx @@ -0,0 +1,110 @@ +import React, { useContext, useEffect } from 'react'; +import { Button } from 'antd'; +import { SchemaRenderer } from '../schema-renderer'; +import { ISchema, useForm } from '@formily/react'; +import { Resource } from '../../resource'; +import { useRequest } from 'ahooks'; +import { VisibleContext } from '../../context'; + +const useResource = ({ onSuccess }) => { + const resource = Resource.make({ + resourceName: 'system_settings', + resourceKey: 1, + }); + const service = useRequest( + (params?: any) => { + return resource.get({ ...params, appends: ['logo'] }); + }, + { + formatResult: (result) => result?.data, + onSuccess, + manual: true, + }, + ); + const [visible] = useContext(VisibleContext); + + useEffect(() => { + if (visible) { + service.run({}); + } + }, [visible]); + + return { resource, service, initialValues: service.data, ...service }; +}; + +const useOkAction = () => { + const form = useForm(); + return { + async run() { + const resource = Resource.make({ + resourceName: 'system_settings', + resourceKey: 1, + }); + console.log('system_settings.values', form.values) + await resource.save(form.values); + } + } +} + +const schema: ISchema = { + type: 'void', + name: 'action1', + // title: '下拉菜单', + 'x-component': 'Action', + 'x-component-props': { + className: 'nb-database-config', + icon: 'MoreOutlined', + type: 'primary', + }, + properties: { + dropdown1: { + type: 'void', + 'x-component': 'Action.Dropdown', + 'x-component-props': { + trigger: ['hover'], + }, + properties: { + item1: { + type: 'void', + title: `系统配置`, + 'x-component': 'Menu.Action', + properties: { + drawer1: { + type: 'void', + title: '系统配置', + 'x-decorator': 'Form', + 'x-decorator-props': { + useResource, + }, + 'x-component': 'Action.Drawer', + 'x-component-props': { + useOkAction, + }, + properties: { + title: { + type: 'string', + title: '系统名称', + 'x-decorator': 'FormItem', + 'x-component': 'Input', + }, + logo: { + type: 'string', + title: 'LOGO', + 'x-decorator': 'FormItem', + 'x-component': 'Upload.File', + 'x-component-props': { + // accept: 'jpg,png' + }, + }, + }, + }, + }, + }, + }, + } + }, +}; + +export const More = () => { + return ; +}; diff --git a/packages/client/src/components/admin-layout/SiteTitle.tsx b/packages/client/src/components/admin-layout/SiteTitle.tsx new file mode 100644 index 000000000..0b1d9cb45 --- /dev/null +++ b/packages/client/src/components/admin-layout/SiteTitle.tsx @@ -0,0 +1,16 @@ +import React, { useContext, useEffect } from 'react'; +import { Button, Dropdown, Menu } from 'antd'; +import { useHistory } from 'react-router-dom'; +import { request } from '../../schemas'; + +export const SiteTitle = () => { + return ( +
+ +
NocoBase
+
+ ); +}; diff --git a/packages/client/src/components/admin-layout/UserInfo.tsx b/packages/client/src/components/admin-layout/UserInfo.tsx new file mode 100644 index 000000000..a94302bef --- /dev/null +++ b/packages/client/src/components/admin-layout/UserInfo.tsx @@ -0,0 +1,29 @@ +import React, { useContext, useEffect } from 'react'; +import { Button, Dropdown, Menu } from 'antd'; +import { useHistory } from 'react-router-dom'; +import { request } from '../../schemas'; + +export const UserInfo = () => { + const history = useHistory(); + return ( + + 个人资料 + + { + await request('/users:logout'); + localStorage.removeItem('NOCOBASE_TOKEN'); + history.push('/login'); + }} + > + 退出登录 + + + } + > + + + ); +}; diff --git a/packages/client/src/components/admin-layout/index.tsx b/packages/client/src/components/admin-layout/index.tsx index 373062171..222b97e32 100644 --- a/packages/client/src/components/admin-layout/index.tsx +++ b/packages/client/src/components/admin-layout/index.tsx @@ -35,6 +35,9 @@ import { } from '../../constate'; import { uid } from '@formily/shared'; import { Permissions } from './Permissions'; +import { More } from './More'; +import { UserInfo } from './UserInfo'; +import { SiteTitle } from './SiteTitle'; function DesignableToggle() { const { designable, setDesignable } = useDesignableSwitchContext(); @@ -87,6 +90,7 @@ function LayoutWithMenu(props: LayoutWithMenuProps) { return ( + + - + +