Optimize permission

This commit is contained in:
2024-01-24 16:10:16 +08:00
parent 983d8e0923
commit d6eaf81900
12 changed files with 95 additions and 64 deletions

View File

@@ -2,13 +2,13 @@ import { PropsWithChildren } from 'react'
import { hasPathPermission, hasPermission } from '@/util/auth' import { hasPathPermission, hasPermission } from '@/util/auth'
interface PermissionProps extends PropsWithChildren { interface PermissionProps extends PropsWithChildren {
operationCode?: string operationCode?: string[]
path?: string path?: string
} }
const Permission = (props: PermissionProps) => { const Permission = (props: PermissionProps) => {
if ( if (
(!props.operationCode || hasPermission(props.operationCode)) && (!props.operationCode || props.operationCode.some(hasPermission)) &&
(!props.path || hasPathPermission(props.path)) (!props.path || hasPathPermission(props.path))
) { ) {
return props.children return props.children

View File

@@ -106,7 +106,7 @@ const Group = () => {
render: (value, record) => ( render: (value, record) => (
<> <>
<AntdSpace size={'middle'}> <AntdSpace size={'middle'}>
<Permission operationCode={'system:group:modify:status'}> <Permission operationCode={['system:group:modify:status']}>
{value ? ( {value ? (
<a <a
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
@@ -123,7 +123,7 @@ const Group = () => {
</a> </a>
)} )}
</Permission> </Permission>
<Permission operationCode={'system:group:modify:one'}> <Permission operationCode={['system:group:modify:one']}>
<a <a
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
onClick={handleOnEditBtnClick(record)} onClick={handleOnEditBtnClick(record)}
@@ -131,7 +131,7 @@ const Group = () => {
</a> </a>
</Permission> </Permission>
<Permission operationCode={'system:group:delete:one'}> <Permission operationCode={['system:group:delete:one']}>
<a <a
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
onClick={handleOnDeleteBtnClick(record)} onClick={handleOnDeleteBtnClick(record)}
@@ -495,7 +495,7 @@ const Group = () => {
const toolbar = ( const toolbar = (
<FlexBox direction={'horizontal'} gap={10}> <FlexBox direction={'horizontal'} gap={10}>
<Permission operationCode={'system:group:add:one'}> <Permission operationCode={['system:group:add:one']}>
<Card style={{ overflow: 'inherit', flex: '0 0 auto' }}> <Card style={{ overflow: 'inherit', flex: '0 0 auto' }}>
<AntdButton <AntdButton
type={'primary'} type={'primary'}

View File

@@ -98,7 +98,7 @@ const Role = () => {
render: (value, record) => ( render: (value, record) => (
<> <>
<AntdSpace size={'middle'}> <AntdSpace size={'middle'}>
<Permission operationCode={'system:role:modify:status'}> <Permission operationCode={['system:role:modify:status']}>
{value ? ( {value ? (
<a <a
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
@@ -115,7 +115,7 @@ const Role = () => {
</a> </a>
)} )}
</Permission> </Permission>
<Permission operationCode={'system:role:modify:one'}> <Permission operationCode={['system:role:modify:one']}>
<a <a
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
onClick={handleOnEditBtnClick(record)} onClick={handleOnEditBtnClick(record)}
@@ -123,7 +123,7 @@ const Role = () => {
</a> </a>
</Permission> </Permission>
<Permission operationCode={'system:role:delete:one'}> <Permission operationCode={['system:role:delete:one']}>
<a <a
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
onClick={handleOnDeleteBtnClick(record)} onClick={handleOnDeleteBtnClick(record)}
@@ -504,7 +504,7 @@ const Role = () => {
const toolbar = ( const toolbar = (
<FlexBox direction={'horizontal'} gap={10}> <FlexBox direction={'horizontal'} gap={10}>
<Permission operationCode={'system:role:add:one'}> <Permission operationCode={['system:role:add:one']}>
<Card style={{ overflow: 'inherit', flex: '0 0 auto' }}> <Card style={{ overflow: 'inherit', flex: '0 0 auto' }}>
<AntdButton <AntdButton
type={'primary'} type={'primary'}

View File

@@ -51,7 +51,7 @@ const Base = () => {
loading={loading} loading={loading}
onReset={handleOnReset} onReset={handleOnReset}
onSave={handleOnSave} onSave={handleOnSave}
modifyOperationCode={'system:settings:modify:base'} modifyOperationCode={['system:settings:modify:base']}
> >
<AntdForm <AntdForm
form={baseForm} form={baseForm}

View File

@@ -106,7 +106,7 @@ const Mail = () => {
loading={loading} loading={loading}
onReset={handleOnReset} onReset={handleOnReset}
onSave={handleOnSave} onSave={handleOnSave}
modifyOperationCode={'system:settings:modify:mail'} modifyOperationCode={['system:settings:modify:mail']}
expand={ expand={
<AntdButton onClick={handleOnTest} title={'测试'}> <AntdButton onClick={handleOnTest} title={'测试'}>
<Icon component={IconOxygenTest} /> <Icon component={IconOxygenTest} />

View File

@@ -106,7 +106,7 @@ const SensitiveWord = () => {
loading={loading} loading={loading}
onReset={handleOnReset} onReset={handleOnReset}
onSave={handleOnSave} onSave={handleOnSave}
modifyOperationCode={'system:settings:modify:sensitive'} modifyOperationCode={['system:settings:modify:sensitive']}
> >
<AntdTransfer <AntdTransfer
listStyle={{ width: '100%', height: 400 }} listStyle={{ width: '100%', height: 400 }}

View File

@@ -15,7 +15,7 @@ interface SettingsCardProps extends PropsWithChildren {
icon: IconComponent icon: IconComponent
title: string title: string
loading?: boolean loading?: boolean
modifyOperationCode?: string modifyOperationCode?: string[]
expand?: ReactNode expand?: ReactNode
onReset?: () => void onReset?: () => void
onSave?: () => void onSave?: () => void
@@ -57,15 +57,15 @@ const Settings = () => {
<HideScrollbar isShowVerticalScrollbar autoHideWaitingTime={1000}> <HideScrollbar isShowVerticalScrollbar autoHideWaitingTime={1000}>
<FlexBox direction={'horizontal'} className={'root-content'}> <FlexBox direction={'horizontal'} className={'root-content'}>
<FlexBox className={'root-col'}> <FlexBox className={'root-col'}>
<Permission operationCode={'system:settings:query:base'}> <Permission operationCode={['system:settings:query:base']}>
<Base /> <Base />
</Permission> </Permission>
<Permission operationCode={'system:settings:query:sensitive'}> <Permission operationCode={['system:settings:query:sensitive']}>
<SensitiveWord /> <SensitiveWord />
</Permission> </Permission>
</FlexBox> </FlexBox>
<FlexBox className={'root-col'}> <FlexBox className={'root-col'}>
<Permission operationCode={'system:settings:query:mail'}> <Permission operationCode={['system:settings:query:mail']}>
<Mail /> <Mail />
</Permission> </Permission>
</FlexBox> </FlexBox>

View File

@@ -47,15 +47,15 @@ const Statistics = () => {
<FitFullscreen data-component={'system-statistics'}> <FitFullscreen data-component={'system-statistics'}>
<HideScrollbar isShowVerticalScrollbar autoHideWaitingTime={1000}> <HideScrollbar isShowVerticalScrollbar autoHideWaitingTime={1000}>
<FlexBox direction={'horizontal'} className={'root-content'}> <FlexBox direction={'horizontal'} className={'root-content'}>
<Permission operationCode={'system:statistics:query:usage'}> <Permission operationCode={['system:statistics:query:usage']}>
<OnlineInfo /> <OnlineInfo />
<ActiveInfo /> <ActiveInfo />
</Permission> </Permission>
<Permission operationCode={'system:statistics:query:base'}> <Permission operationCode={['system:statistics:query:base']}>
<HardwareInfo /> <HardwareInfo />
<SoftwareInfo /> <SoftwareInfo />
</Permission> </Permission>
<Permission operationCode={'system:statistics:query:real'}> <Permission operationCode={['system:statistics:query:real']}>
<CPUInfo /> <CPUInfo />
<StorageInfo /> <StorageInfo />
</Permission> </Permission>

View File

@@ -8,7 +8,8 @@ import {
DATABASE_SELECT_SUCCESS, DATABASE_SELECT_SUCCESS,
DATABASE_UPDATE_SUCCESS DATABASE_UPDATE_SUCCESS
} from '@/constants/common.constants' } from '@/constants/common.constants'
import { utcToLocalTime } from '@/util/datetime.tsx' import { utcToLocalTime } from '@/util/datetime'
import { hasPermission } from '@/util/auth'
import { import {
r_sys_tool_base_add, r_sys_tool_base_add,
r_sys_tool_base_delete, r_sys_tool_base_delete,
@@ -125,14 +126,14 @@ const Base = () => {
<> <>
{!Object.keys(hasEdited).length && ( {!Object.keys(hasEdited).length && (
<> <Permission operationCode={['system:tool:add:base']}>
{' '} {' '}
( (
<a style={{ color: COLOR_PRODUCTION }} onClick={handleOnAddBtnClick}> <a style={{ color: COLOR_PRODUCTION }} onClick={handleOnAddBtnClick}>
</a> </a>
) )
</> </Permission>
)} )}
</> </>
), ),
@@ -142,15 +143,17 @@ const Base = () => {
<> <>
<AntdSpace size={'middle'}> <AntdSpace size={'middle'}>
{!record.compiled && !Object.keys(hasEdited).length && ( {!record.compiled && !Object.keys(hasEdited).length && (
<Permission operationCode={['system:tool:modify:base']}>
<a <a
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
onClick={handleOnCompileBtnClick(record)} onClick={handleOnCompileBtnClick(record)}
> >
</a> </a>
</Permission>
)} )}
{hasEdited[record.id] && ( {hasEdited[record.id] && (
<Permission operationCode={'system:tool:modify:base'}> <Permission operationCode={['system:tool:modify:base']}>
<a <a
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
onClick={handleOnSaveBtnClick(record)} onClick={handleOnSaveBtnClick(record)}
@@ -160,7 +163,7 @@ const Base = () => {
</Permission> </Permission>
)} )}
{!Object.keys(hasEdited).length && ( {!Object.keys(hasEdited).length && (
<Permission operationCode={'system:tool:modify:base'}> <Permission operationCode={['system:tool:modify:base']}>
<a <a
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
onClick={handleOnEditBtnClick(record)} onClick={handleOnEditBtnClick(record)}
@@ -169,7 +172,7 @@ const Base = () => {
</a> </a>
</Permission> </Permission>
)} )}
<Permission operationCode={'system:tool:delete:base'}> <Permission operationCode={['system:tool:delete:base']}>
<a <a
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
onClick={handleOnDeleteBtnClick(record)} onClick={handleOnDeleteBtnClick(record)}
@@ -652,14 +655,14 @@ const Base = () => {
<> <>
{!Object.keys(hasEdited).length && ( {!Object.keys(hasEdited).length && (
<> <Permission operationCode={['system:tool:modify:base']}>
{' '} {' '}
( (
<a style={{ color: COLOR_PRODUCTION }} onClick={handleOnAddFile}> <a style={{ color: COLOR_PRODUCTION }} onClick={handleOnAddFile}>
</a> </a>
) )
</> </Permission>
)} )}
</> </>
), ),
@@ -669,16 +672,21 @@ const Base = () => {
render: (_, record) => ( render: (_, record) => (
<> <>
<AntdSpace size={'middle'}> <AntdSpace size={'middle'}>
<Permission operationCode={'system:tool:modify:category'}> <Permission
operationCode={[
'system:tool:query:base',
'system:tool:modify:base'
]}
>
<a <a
onClick={handleOnEditFile(record.name)} onClick={handleOnEditFile(record.name)}
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
> >
{hasPermission('system:tool:modify:base') ? '编辑' : '查看'}
</a> </a>
</Permission> </Permission>
{!Object.keys(hasEdited).length && ( {!Object.keys(hasEdited).length && (
<Permission operationCode={'system:tool:modify:category'}> <Permission operationCode={['system:tool:modify:base']}>
<a <a
onClick={handleOnRenameFile(record.name)} onClick={handleOnRenameFile(record.name)}
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
@@ -688,7 +696,7 @@ const Base = () => {
</Permission> </Permission>
)} )}
{!Object.keys(hasEdited).length && ( {!Object.keys(hasEdited).length && (
<Permission operationCode={'system:tool:delete:category'}> <Permission operationCode={['system:tool:delete:base']}>
<a <a
onClick={handleOnDeleteFile(record.name)} onClick={handleOnDeleteFile(record.name)}
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
@@ -880,6 +888,9 @@ const Base = () => {
} }
const handleOnChangeFileContent = (_content: string, _fileName: string, files: IFiles) => { const handleOnChangeFileContent = (_content: string, _fileName: string, files: IFiles) => {
if (!hasPermission('system:tool:modify:base')) {
return
}
setEditingFiles({ ...editingFiles, [editingBaseId]: files }) setEditingFiles({ ...editingFiles, [editingBaseId]: files })
if (!hasEdited[editingBaseId]) { if (!hasEdited[editingBaseId]) {
setHasEdited({ ...hasEdited, [editingBaseId]: true }) setHasEdited({ ...hasEdited, [editingBaseId]: true })
@@ -978,7 +989,11 @@ const Base = () => {
onChangeFileContent={handleOnChangeFileContent} onChangeFileContent={handleOnChangeFileContent}
showFileSelector={false} showFileSelector={false}
tsconfig={tsconfig} tsconfig={tsconfig}
readonly={isLoading || baseDetailLoading[editingBaseId]} readonly={
isLoading ||
baseDetailLoading[editingBaseId] ||
!hasPermission('system:tool:modify:base')
}
/> />
<div className={'close-editor-btn'} onClick={handleOnCloseBtnClick}> <div className={'close-editor-btn'} onClick={handleOnCloseBtnClick}>
<Icon component={IconOxygenClose} /> <Icon component={IconOxygenClose} />

View File

@@ -73,11 +73,15 @@ const Category = () => {
{ {
title: ( title: (
<> <>
(
<Permission operationCode={['system:tool:add:category']}>
{' '}
(
<a style={{ color: COLOR_PRODUCTION }} onClick={handleOnAddBtnClick}> <a style={{ color: COLOR_PRODUCTION }} onClick={handleOnAddBtnClick}>
</a> </a>
) )
</Permission>
</> </>
), ),
dataIndex: 'enable', dataIndex: 'enable',
@@ -86,7 +90,7 @@ const Category = () => {
render: (_, record) => ( render: (_, record) => (
<> <>
<AntdSpace size={'middle'}> <AntdSpace size={'middle'}>
<Permission operationCode={'system:tool:modify:category'}> <Permission operationCode={['system:tool:modify:category']}>
<a <a
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
onClick={handleOnEditBtnClick(record)} onClick={handleOnEditBtnClick(record)}
@@ -94,7 +98,7 @@ const Category = () => {
</a> </a>
</Permission> </Permission>
<Permission operationCode={'system:tool:delete:category'}> <Permission operationCode={['system:tool:delete:category']}>
<a <a
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
onClick={handleOnDeleteBtnClick(record)} onClick={handleOnDeleteBtnClick(record)}

View File

@@ -8,7 +8,8 @@ import {
DATABASE_SELECT_SUCCESS, DATABASE_SELECT_SUCCESS,
DATABASE_UPDATE_SUCCESS DATABASE_UPDATE_SUCCESS
} from '@/constants/common.constants' } from '@/constants/common.constants'
import { utcToLocalTime } from '@/util/datetime.tsx' import { utcToLocalTime } from '@/util/datetime'
import { hasPermission } from '@/util/auth'
import { import {
r_sys_tool_template_update, r_sys_tool_template_update,
r_sys_tool_template_delete, r_sys_tool_template_delete,
@@ -31,7 +32,6 @@ import HideScrollbar from '@/components/common/HideScrollbar'
import Card from '@/components/common/Card' import Card from '@/components/common/Card'
import CodeEditor from '@/components/Playground/CodeEditor' import CodeEditor from '@/components/Playground/CodeEditor'
import Permission from '@/components/common/Permission' import Permission from '@/components/common/Permission'
import { useState } from 'react'
const Template = () => { const Template = () => {
const blocker = useBlocker( const blocker = useBlocker(
@@ -125,14 +125,14 @@ const Template = () => {
<> <>
{!Object.keys(hasEdited).length && ( {!Object.keys(hasEdited).length && (
<> <Permission operationCode={['system:tool:add:template']}>
{' '} {' '}
( (
<a style={{ color: COLOR_PRODUCTION }} onClick={handleOnAddBtnClick}> <a style={{ color: COLOR_PRODUCTION }} onClick={handleOnAddBtnClick}>
</a> </a>
) )
</> </Permission>
)} )}
</> </>
), ),
@@ -142,7 +142,7 @@ const Template = () => {
<> <>
<AntdSpace size={'middle'}> <AntdSpace size={'middle'}>
{hasEdited[record.id] && ( {hasEdited[record.id] && (
<Permission operationCode={'system:tool:modify:base'}> <Permission operationCode={['system:tool:modify:template']}>
<a <a
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
onClick={handleOnSaveBtnClick(record)} onClick={handleOnSaveBtnClick(record)}
@@ -152,7 +152,7 @@ const Template = () => {
</Permission> </Permission>
)} )}
{!Object.keys(hasEdited).length && ( {!Object.keys(hasEdited).length && (
<Permission operationCode={'system:tool:modify:base'}> <Permission operationCode={['system:tool:modify:template']}>
<a <a
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
onClick={handleOnEditBtnClick(record)} onClick={handleOnEditBtnClick(record)}
@@ -161,7 +161,7 @@ const Template = () => {
</a> </a>
</Permission> </Permission>
)} )}
<Permission operationCode={'system:tool:delete:base'}> <Permission operationCode={['system:tool:delete:template']}>
<a <a
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
onClick={handleOnDeleteBtnClick(record)} onClick={handleOnDeleteBtnClick(record)}
@@ -498,14 +498,14 @@ const Template = () => {
<> <>
{!Object.keys(hasEdited).length && ( {!Object.keys(hasEdited).length && (
<> <Permission operationCode={['system:tool:modify:template']}>
{' '} {' '}
( (
<a style={{ color: COLOR_PRODUCTION }} onClick={handleOnAddFile}> <a style={{ color: COLOR_PRODUCTION }} onClick={handleOnAddFile}>
</a> </a>
) )
</> </Permission>
)} )}
</> </>
), ),
@@ -515,16 +515,21 @@ const Template = () => {
render: (_, record) => ( render: (_, record) => (
<> <>
<AntdSpace size={'middle'}> <AntdSpace size={'middle'}>
<Permission operationCode={'system:tool:modify:category'}> <Permission
operationCode={[
'system:tool:query:template',
'system:tool:modify:template'
]}
>
<a <a
onClick={handleOnEditFile(record.name)} onClick={handleOnEditFile(record.name)}
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
> >
{hasPermission('system:tool:modify:template') ? '编辑' : '查看'}
</a> </a>
</Permission> </Permission>
{!Object.keys(hasEdited).length && ( {!Object.keys(hasEdited).length && (
<Permission operationCode={'system:tool:modify:category'}> <Permission operationCode={['system:tool:modify:template']}>
<a <a
onClick={handleOnRenameFile(record.name)} onClick={handleOnRenameFile(record.name)}
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
@@ -534,7 +539,7 @@ const Template = () => {
</Permission> </Permission>
)} )}
{!Object.keys(hasEdited).length && ( {!Object.keys(hasEdited).length && (
<Permission operationCode={'system:tool:delete:category'}> <Permission operationCode={['system:tool:delete:template']}>
<a <a
onClick={handleOnDeleteFile(record.name)} onClick={handleOnDeleteFile(record.name)}
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
@@ -729,6 +734,9 @@ const Template = () => {
} }
const handleOnChangeFileContent = (_content: string, _fileName: string, files: IFiles) => { const handleOnChangeFileContent = (_content: string, _fileName: string, files: IFiles) => {
if (!hasPermission('system:tool:modify:template')) {
return
}
setEditingFiles({ ...editingFiles, [editingTemplateId]: files }) setEditingFiles({ ...editingFiles, [editingTemplateId]: files })
if (!hasEdited[editingTemplateId]) { if (!hasEdited[editingTemplateId]) {
setHasEdited({ ...hasEdited, [editingTemplateId]: true }) setHasEdited({ ...hasEdited, [editingTemplateId]: true })
@@ -865,7 +873,11 @@ const Template = () => {
onChangeFileContent={handleOnChangeFileContent} onChangeFileContent={handleOnChangeFileContent}
showFileSelector={false} showFileSelector={false}
tsconfig={tsconfig} tsconfig={tsconfig}
readonly={isLoading || templateDetailLoading[editingTemplateId]} readonly={
isLoading ||
templateDetailLoading[editingTemplateId] ||
!hasPermission('system:tool:modify:template')
}
/> />
<div className={'close-editor-btn'} onClick={handleOnCloseBtnClick}> <div className={'close-editor-btn'} onClick={handleOnCloseBtnClick}>
<Icon component={IconOxygenClose} /> <Icon component={IconOxygenClose} />

View File

@@ -195,7 +195,7 @@ const User = () => {
render: (_, record) => ( render: (_, record) => (
<> <>
<AntdSpace size={'middle'}> <AntdSpace size={'middle'}>
<Permission operationCode={'system:user:modify:password'}> <Permission operationCode={['system:user:modify:password']}>
<a <a
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
onClick={handleOnChangePasswordBtnClick(record)} onClick={handleOnChangePasswordBtnClick(record)}
@@ -203,7 +203,7 @@ const User = () => {
</a> </a>
</Permission> </Permission>
<Permission operationCode={'system:user:modify:one'}> <Permission operationCode={['system:user:modify:one']}>
<a <a
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
onClick={handleOnEditBtnClick(record)} onClick={handleOnEditBtnClick(record)}
@@ -211,7 +211,7 @@ const User = () => {
</a> </a>
</Permission> </Permission>
<Permission operationCode={'system:user:delete:one'}> <Permission operationCode={['system:user:delete:one']}>
{record.id !== '0' && ( {record.id !== '0' && (
<a <a
style={{ color: COLOR_PRODUCTION }} style={{ color: COLOR_PRODUCTION }}
@@ -888,7 +888,7 @@ const User = () => {
const toolbar = ( const toolbar = (
<FlexBox direction={'horizontal'} gap={10}> <FlexBox direction={'horizontal'} gap={10}>
<Permission operationCode={'system:user:add:one'}> <Permission operationCode={['system:user:add:one']}>
<Card style={{ overflow: 'inherit', flex: '0 0 auto' }}> <Card style={{ overflow: 'inherit', flex: '0 0 auto' }}>
<AntdButton <AntdButton
type={'primary'} type={'primary'}