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';
|
} from '../../constate';
|
||||||
import { uid } from '@formily/shared';
|
import { uid } from '@formily/shared';
|
||||||
import { Permissions } from './Permissions';
|
import { Permissions } from './Permissions';
|
||||||
|
import { More } from './More';
|
||||||
|
import { UserInfo } from './UserInfo';
|
||||||
|
import { SiteTitle } from './SiteTitle';
|
||||||
|
|
||||||
function DesignableToggle() {
|
function DesignableToggle() {
|
||||||
const { designable, setDesignable } = useDesignableSwitchContext();
|
const { designable, setDesignable } = useDesignableSwitchContext();
|
||||||
@ -87,6 +90,7 @@ function LayoutWithMenu(props: LayoutWithMenuProps) {
|
|||||||
return (
|
return (
|
||||||
<Layout>
|
<Layout>
|
||||||
<Layout.Header style={{ display: 'flex' }}>
|
<Layout.Header style={{ display: 'flex' }}>
|
||||||
|
<SiteTitle />
|
||||||
<SchemaRenderer
|
<SchemaRenderer
|
||||||
schema={schema}
|
schema={schema}
|
||||||
scope={{
|
scope={{
|
||||||
@ -96,9 +100,11 @@ function LayoutWithMenu(props: LayoutWithMenuProps) {
|
|||||||
selectedKeys: defaultSelectedKeys.filter(Boolean),
|
selectedKeys: defaultSelectedKeys.filter(Boolean),
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
|
<DesignableToggle />
|
||||||
<Database />
|
<Database />
|
||||||
<Permissions />
|
<Permissions />
|
||||||
<DesignableToggle />
|
<More/>
|
||||||
|
<UserInfo />
|
||||||
</Layout.Header>
|
</Layout.Header>
|
||||||
<Layout>
|
<Layout>
|
||||||
<Layout.Sider
|
<Layout.Sider
|
||||||
|
@ -54,3 +54,17 @@
|
|||||||
background: #1890ff !important;
|
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