feat: siteinfo, more configuration, userinfo...
This commit is contained in:
parent
9fd41ab33e
commit
cfd12a0fcf
110
packages/client/src/components/admin-layout/More.tsx
Normal file
110
packages/client/src/components/admin-layout/More.tsx
Normal file
@ -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 <SchemaRenderer schema={schema} />;
|
||||
};
|
16
packages/client/src/components/admin-layout/SiteTitle.tsx
Normal file
16
packages/client/src/components/admin-layout/SiteTitle.tsx
Normal file
@ -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 (
|
||||
<div className={'site-info'}>
|
||||
<img
|
||||
className={'site-logo'}
|
||||
src={'https://www.nocobase.com/dist/images/logo-white.png'}
|
||||
/>
|
||||
<div className={'site-title'}>NocoBase</div>
|
||||
</div>
|
||||
);
|
||||
};
|
29
packages/client/src/components/admin-layout/UserInfo.tsx
Normal file
29
packages/client/src/components/admin-layout/UserInfo.tsx
Normal file
@ -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 (
|
||||
<Dropdown
|
||||
overlay={
|
||||
<Menu>
|
||||
<Menu.Item>个人资料</Menu.Item>
|
||||
<Menu.Divider />
|
||||
<Menu.Item
|
||||
onClick={async () => {
|
||||
await request('/users:logout');
|
||||
localStorage.removeItem('NOCOBASE_TOKEN');
|
||||
history.push('/login');
|
||||
}}
|
||||
>
|
||||
退出登录
|
||||
</Menu.Item>
|
||||
</Menu>
|
||||
}
|
||||
>
|
||||
<Button type={'text'} className={'user-info'}>超级管理员</Button>
|
||||
</Dropdown>
|
||||
);
|
||||
};
|
@ -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 (
|
||||
<Layout>
|
||||
<Layout.Header style={{ display: 'flex' }}>
|
||||
<SiteTitle />
|
||||
<SchemaRenderer
|
||||
schema={schema}
|
||||
scope={{
|
||||
@ -96,9 +100,11 @@ function LayoutWithMenu(props: LayoutWithMenuProps) {
|
||||
selectedKeys: defaultSelectedKeys.filter(Boolean),
|
||||
}}
|
||||
/>
|
||||
<DesignableToggle />
|
||||
<Database />
|
||||
<Permissions />
|
||||
<DesignableToggle />
|
||||
<More/>
|
||||
<UserInfo />
|
||||
</Layout.Header>
|
||||
<Layout>
|
||||
<Layout.Sider
|
||||
|
@ -54,3 +54,17 @@
|
||||
background: #1890ff !important;
|
||||
}
|
||||
}
|
||||
|
||||
.user-info {
|
||||
height: 46px;
|
||||
color: #fff;
|
||||
&:hover, &:focus {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
.site-info {
|
||||
.site-logo {
|
||||
height: 20px;
|
||||
padding: 0 16px;
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue
Block a user