|
@ -1,29 +1,33 @@ |
|
|
import { ActionType, PageContainer, ProColumns, ProTable } from '@ant-design/pro-components' |
|
|
|
|
|
|
|
|
import { ActionType, PageContainer, ProColumns, ProTable,BetaSchemaForm } from '@ant-design/pro-components' |
|
|
import { createLazyFileRoute } from '@tanstack/react-router' |
|
|
import { createLazyFileRoute } from '@tanstack/react-router' |
|
|
import { useStyle } from './style.ts' |
|
|
import { useStyle } from './style.ts' |
|
|
import { useMemo, useRef } from 'react' |
|
|
|
|
|
import { useAtomValue } from 'jotai' |
|
|
|
|
|
import { rolesAtom } from './store.ts' |
|
|
|
|
|
|
|
|
import { useMemo, useRef, useState } from 'react' |
|
|
|
|
|
import { useAtom, useAtomValue } from 'jotai' |
|
|
|
|
|
import { roleAtom, rolesAtom } from './store.ts' |
|
|
import { useTranslation } from '@/i18n.ts' |
|
|
import { useTranslation } from '@/i18n.ts' |
|
|
import { Button, Space, Table } from 'antd' |
|
|
|
|
|
|
|
|
import { Button, Form, Space, Table } from 'antd' |
|
|
import { PlusOutlined } from '@ant-design/icons' |
|
|
import { PlusOutlined } from '@ant-design/icons' |
|
|
|
|
|
|
|
|
const Roles = () => { |
|
|
const Roles = () => { |
|
|
|
|
|
|
|
|
const { t } = useTranslation() |
|
|
const { t } = useTranslation() |
|
|
const { styles } = useStyle() |
|
|
const { styles } = useStyle() |
|
|
|
|
|
const [form] = Form.useForm() |
|
|
const actionRef = useRef<ActionType>() |
|
|
const actionRef = useRef<ActionType>() |
|
|
const { data, isLoading } = useAtomValue(rolesAtom) |
|
|
const { data, isLoading } = useAtomValue(rolesAtom) |
|
|
|
|
|
const [ role, setRole ] = useAtom(roleAtom) |
|
|
|
|
|
const [ open, setOpen] = useState(false) |
|
|
|
|
|
|
|
|
const columns = useMemo(() => { |
|
|
const columns = useMemo(() => { |
|
|
|
|
|
|
|
|
return [ |
|
|
return [ |
|
|
{ title: 'id', dataIndex: 'id', hideInTable: true, hideInSearch: true, }, |
|
|
|
|
|
{ title: '名称', dataIndex: 'name' }, |
|
|
|
|
|
{ title: '别名', dataIndex: 'code' }, |
|
|
|
|
|
{ title: '状态', dataIndex: 'status' }, |
|
|
|
|
|
|
|
|
{ title: 'id', dataIndex: 'id', hideInTable: true, hideInSearch: true, hideInForm: true,}, |
|
|
|
|
|
{ title: '名称', dataIndex: 'name', valueType: 'text',}, |
|
|
|
|
|
{ title: '别名', dataIndex: 'code', valueType: 'text', }, |
|
|
|
|
|
{ title: '状态', dataIndex: 'status', valueType: 'switch', }, |
|
|
{ title: '排序', dataIndex: 'sort', valueType: 'indexBorder', }, |
|
|
{ title: '排序', dataIndex: 'sort', valueType: 'indexBorder', }, |
|
|
{ title: '备注', dataIndex: 'remark' }, |
|
|
|
|
|
|
|
|
{ title: '备注', dataIndex: 'remark' ,valueType: 'textarea' }, |
|
|
|
|
|
{ title: '权限', dataIndex: 'permissions', valueType: 'treeSelect', }, |
|
|
{ |
|
|
{ |
|
|
title: '操作', valueType: 'option', |
|
|
title: '操作', valueType: 'option', |
|
|
key: 'option', |
|
|
key: 'option', |
|
@ -31,14 +35,14 @@ const Roles = () => { |
|
|
<a |
|
|
<a |
|
|
key="editable" |
|
|
key="editable" |
|
|
onClick={() => { |
|
|
onClick={() => { |
|
|
action?.startEditable?.(record.id) |
|
|
|
|
|
|
|
|
// action?.startEditable?.(record.id)
|
|
|
|
|
|
setRole(record) |
|
|
|
|
|
setOpen(true) |
|
|
|
|
|
form.setFieldsValue(record) |
|
|
}} |
|
|
}} |
|
|
> |
|
|
> |
|
|
编辑 |
|
|
编辑 |
|
|
</a>, |
|
|
</a>, |
|
|
<a href={record.url} target="_blank" rel="noopener noreferrer" key="view"> |
|
|
|
|
|
查看 |
|
|
|
|
|
</a>, |
|
|
|
|
|
<a href={record.url} target="_blank" rel="noopener noreferrer" key="del"> |
|
|
<a href={record.url} target="_blank" rel="noopener noreferrer" key="del"> |
|
|
删除 |
|
|
删除 |
|
|
</a>, |
|
|
</a>, |
|
@ -99,6 +103,24 @@ const Roles = () => { |
|
|
} |
|
|
} |
|
|
}} |
|
|
}} |
|
|
/> |
|
|
/> |
|
|
|
|
|
<BetaSchemaForm |
|
|
|
|
|
width={600} |
|
|
|
|
|
form={form} |
|
|
|
|
|
layout={'horizontal'} |
|
|
|
|
|
title={t('system.roles.edit.title', '角色编辑')} |
|
|
|
|
|
colProps={{ span: 24 }} |
|
|
|
|
|
labelCol={{ span: 6 }} |
|
|
|
|
|
wrapperCol={{ span: 16 }} |
|
|
|
|
|
layoutType={'ModalForm'} |
|
|
|
|
|
open={open} |
|
|
|
|
|
modalProps={{ |
|
|
|
|
|
maskClosable: false, |
|
|
|
|
|
}} |
|
|
|
|
|
onOpenChange={(open) => { |
|
|
|
|
|
console.log('open', open) |
|
|
|
|
|
setOpen(open) |
|
|
|
|
|
}} |
|
|
|
|
|
columns={columns} /> |
|
|
</PageContainer> |
|
|
</PageContainer> |
|
|
) |
|
|
) |
|
|
} |
|
|
} |
|
|