forked from WinmezzZ/react-antd-admin
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Winme
committed
Feb 2, 2020
1 parent
2af833b
commit f2a5ac9
Showing
24 changed files
with
490 additions
and
106 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,85 +1,28 @@ | ||
import React, { FC } from 'react' | ||
import { Button } from 'antd' | ||
import { PlusOutlined } from '@ant-design/icons' | ||
import ProTable, { IntlProvider, createIntl } from '@ant-design/pro-table' | ||
import { useLocale } from '~/locales' | ||
import { apiGetRoleList } from '~/api/permission/role.api' | ||
import { Role } from '~/interface/permission/role.interface' | ||
import { useSelector } from 'react-redux' | ||
import { AppState } from '~/stores' | ||
import useProTableLocale from '~/hooks/useProTableLocale' | ||
|
||
const ComplexPage: FC = () => { | ||
const { formatMessage } = useLocale() | ||
const { locale } = useSelector((state: AppState) => state.globalReducer) | ||
const lang = useProTableLocale(locale) | ||
import React, { FC, useState } from 'react' | ||
import RoleCreateDialog from './roleCreateDialog' | ||
import RoleTable from './roleTable' | ||
import RoleSearch from './roleSearch' | ||
import RoleModifyDialog from './roleModifyDialog' | ||
|
||
const RolePage: FC = () => { | ||
const [createvisible, setCreateVisible] = useState(false) | ||
const [modifyvisible, setModifyVisible] = useState(false) | ||
return ( | ||
<IntlProvider value={createIntl(locale, lang)}> | ||
<ProTable<Role> | ||
rowKey="id" | ||
columns={[ | ||
{ | ||
title: formatMessage({ id: 'app.permission.role.name' }), | ||
dataIndex: 'name', | ||
width: 100, | ||
render: (_, { name }) => name[locale] | ||
}, | ||
{ | ||
title: formatMessage({ id: 'app.permission.role.code' }), | ||
dataIndex: 'code', | ||
width: 100 | ||
}, | ||
{ | ||
title: formatMessage({ id: 'app.permission.role.status' }), | ||
dataIndex: 'status', | ||
width: 100, | ||
valueEnum: { | ||
all: { text: formatMessage({ id: 'app.permission.role.status.all' }), status: 'Default' }, | ||
enabled: { text: formatMessage({ id: 'app.permission.role.status.enabled' }), status: 'Success' }, | ||
disabled: { text: formatMessage({ id: 'app.permission.role.status.disabled' }), status: 'Error' } | ||
} | ||
}, | ||
{ | ||
title: formatMessage({ id: 'gloabal.tips.operation' }), | ||
key: 'option', | ||
valueType: 'option', | ||
align: 'center', | ||
width: 140, | ||
render: () => [ | ||
<Button type="link" key="1"> | ||
{formatMessage({ id: 'gloabal.tips.authorize' })} | ||
</Button>, | ||
<Button type="link" key="2"> | ||
{formatMessage({ id: 'gloabal.tips.delete' })} | ||
</Button> | ||
] | ||
} | ||
]} | ||
request={async () => { | ||
const { result: data, status: success } = await apiGetRoleList() | ||
return { | ||
data, | ||
success | ||
} | ||
}} | ||
pagination={{ | ||
showSizeChanger: true | ||
}} | ||
scroll={{ | ||
x: 440 | ||
}} | ||
dateFormatter="string" | ||
params={{ state: 'all' }} | ||
toolBarRender={() => [ | ||
<Button key="3" type="primary"> | ||
<PlusOutlined /> | ||
{formatMessage({ id: 'gloabal.tips.create' })} | ||
</Button> | ||
]} | ||
<div> | ||
<RoleSearch /> | ||
<RoleCreateDialog | ||
visible={createvisible} | ||
onCancel={() => setCreateVisible(false)} | ||
onCreate={() => setCreateVisible(false)} | ||
/> | ||
<RoleModifyDialog | ||
visible={modifyvisible} | ||
onCancel={() => setModifyVisible(false)} | ||
onModify={() => setModifyVisible(false)} | ||
/> | ||
</IntlProvider> | ||
<RoleTable onCreate={() => setCreateVisible(true)} onModify={() => setModifyVisible(true)} /> | ||
</div> | ||
) | ||
} | ||
|
||
export default ComplexPage | ||
export default RolePage |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,35 @@ | ||
import React, { FC } from 'react' | ||
import { Modal } from 'antd' | ||
import { Role } from '~/interface/permission/role.interface' | ||
import useGetRoleFormItem from './useGetRoleForm' | ||
import { useLocale } from '~/locales' | ||
|
||
interface Values extends Role {} | ||
|
||
interface RoleCreateDialogProps { | ||
visible: boolean | ||
onCreate: (values: Values) => void | ||
onCancel: () => void | ||
} | ||
|
||
const RoleCreateDialog: FC<RoleCreateDialogProps> = ({ onCreate, onCancel, visible }) => { | ||
const { Form, form, Name, Code, Status } = useGetRoleFormItem({ name: 'createForm', required: true }) | ||
const { formatMessage } = useLocale() | ||
|
||
return ( | ||
<Modal | ||
title={formatMessage({ id: 'gloabal.tips.create' })} | ||
visible={visible} | ||
onOk={async () => onCreate((await form.validateFields()) as any)} | ||
onCancel={onCancel} | ||
> | ||
<Form> | ||
<Name /> | ||
<Code /> | ||
<Status /> | ||
</Form> | ||
</Modal> | ||
) | ||
} | ||
|
||
export default RoleCreateDialog |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,35 @@ | ||
import React, { FC } from 'react' | ||
import { Modal } from 'antd' | ||
import { Role } from '~/interface/permission/role.interface' | ||
import useGetRoleFormItem from './useGetRoleForm' | ||
import { useLocale } from '~/locales' | ||
|
||
interface Values extends Role {} | ||
|
||
interface RoleModifyDialogProps { | ||
visible: boolean | ||
onModify: (values: Values) => void | ||
onCancel: () => void | ||
} | ||
|
||
const RoleModifyDialog: FC<RoleModifyDialogProps> = ({ onModify, onCancel, visible }) => { | ||
const { Form, form, Name, Code, Status } = useGetRoleFormItem({ name: 'modifyForm', required: true }) | ||
const { formatMessage } = useLocale() | ||
|
||
return ( | ||
<Modal | ||
title={formatMessage({ id: 'gloabal.tips.modify' })} | ||
visible={visible} | ||
onOk={async () => onModify((await form.validateFields()) as any)} | ||
onCancel={onCancel} | ||
> | ||
<Form> | ||
<Name /> | ||
<Code /> | ||
<Status /> | ||
</Form> | ||
</Modal> | ||
) | ||
} | ||
|
||
export default RoleModifyDialog |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,32 @@ | ||
import React, { FC } from 'react' | ||
import { Role } from '~/interface/permission/role.interface' | ||
import useGetRoleFormItem from './useGetRoleForm' | ||
import { Button } from 'antd' | ||
import { useLocale } from '~/locales' | ||
|
||
interface Values extends Role {} | ||
|
||
const RoleSearch: FC = () => { | ||
const { Form, form, Name, Code, Status } = useGetRoleFormItem({ name: 'searchForm', responsive: true }) | ||
const { formatMessage } = useLocale() | ||
|
||
const onSearch = () => { | ||
// | ||
} | ||
|
||
return ( | ||
<Form> | ||
<Name /> | ||
<Code /> | ||
<Status /> | ||
<Form.Item> | ||
<Button type="primary" onClick={onSearch}> | ||
{formatMessage({ id: 'gloabal.tips.search' })} | ||
</Button> | ||
<Button onClick={() => form.resetFields()}>{formatMessage({ id: 'gloabal.tips.reset' })}</Button> | ||
</Form.Item> | ||
</Form> | ||
) | ||
} | ||
|
||
export default RoleSearch |
Oops, something went wrong.