feat(client): improve acl module
This commit is contained in:
parent
2c38b63f18
commit
77d9228ea2
@ -1,13 +1,47 @@
|
|||||||
import { Table } from 'antd';
|
import { Checkbox, Spin, Table } from 'antd';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
import { useRecord } from '../..';
|
||||||
|
import { useAPIClient, useRequest } from '../../api-client';
|
||||||
import { useRoute } from '../../route-switch';
|
import { useRoute } from '../../route-switch';
|
||||||
|
|
||||||
|
const toItems = (properties = {}) => {
|
||||||
|
const items = [];
|
||||||
|
for (const key in properties) {
|
||||||
|
if (Object.prototype.hasOwnProperty.call(properties, key)) {
|
||||||
|
const element = properties[key];
|
||||||
|
const item = {
|
||||||
|
title: element.title,
|
||||||
|
uid: element['x-uid'],
|
||||||
|
};
|
||||||
|
if (element.properties) {
|
||||||
|
item['children'] = toItems(element.properties);
|
||||||
|
}
|
||||||
|
items.push(item);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return items;
|
||||||
|
};
|
||||||
|
|
||||||
export const MenuConfigure = () => {
|
export const MenuConfigure = () => {
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
console.log(route);
|
const record = useRecord();
|
||||||
|
console.log(route.uiSchemaUid);
|
||||||
|
const api = useAPIClient();
|
||||||
|
const { loading, data } = useRequest({
|
||||||
|
url: `uiSchemas:getProperties/${route.uiSchemaUid}`,
|
||||||
|
});
|
||||||
|
if (loading) {
|
||||||
|
return <Spin />;
|
||||||
|
}
|
||||||
|
const items = toItems(data?.data?.properties);
|
||||||
|
console.log(items);
|
||||||
return (
|
return (
|
||||||
<div>
|
|
||||||
<Table
|
<Table
|
||||||
|
rowKey={'uid'}
|
||||||
|
pagination={false}
|
||||||
|
expandable={{
|
||||||
|
defaultExpandAllRows: true,
|
||||||
|
}}
|
||||||
columns={[
|
columns={[
|
||||||
{
|
{
|
||||||
dataIndex: 'title',
|
dataIndex: 'title',
|
||||||
@ -15,11 +49,23 @@ export const MenuConfigure = () => {
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
dataIndex: 'accessible',
|
dataIndex: 'accessible',
|
||||||
title: '允许访问',
|
title: (
|
||||||
|
<>
|
||||||
|
<Checkbox /> 允许访问
|
||||||
|
</>
|
||||||
|
),
|
||||||
|
render: (_, schema) => (
|
||||||
|
<Checkbox
|
||||||
|
onChange={async (e) => {
|
||||||
|
await api.request({
|
||||||
|
url: `roles/${record.name}/menuUiSchemas:toggle/${schema.uid}`,
|
||||||
|
});
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
),
|
||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
dataSource={[]}
|
dataSource={items}
|
||||||
/>
|
/>
|
||||||
</div>
|
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
@ -1,14 +1,45 @@
|
|||||||
import { FormLayout } from '@formily/antd';
|
import { onFieldChange } from '@formily/core';
|
||||||
|
import { message } from 'antd';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
import { useAPIClient, useRequest } from '../../api-client';
|
||||||
|
import { useRecord } from '../../record-provider';
|
||||||
import { SchemaComponent } from '../../schema-component';
|
import { SchemaComponent } from '../../schema-component';
|
||||||
|
|
||||||
export const RoleConfigure = () => {
|
export const RoleConfigure = () => {
|
||||||
|
const api = useAPIClient();
|
||||||
|
const record = useRecord();
|
||||||
return (
|
return (
|
||||||
<div>
|
|
||||||
<FormLayout layout={'vertical'}>
|
|
||||||
<SchemaComponent
|
<SchemaComponent
|
||||||
schema={{
|
schema={{
|
||||||
type: 'object',
|
type: 'void',
|
||||||
|
name: 'form',
|
||||||
|
'x-component': 'Form',
|
||||||
|
'x-component-props': {
|
||||||
|
useValues: (options) => {
|
||||||
|
return useRequest(
|
||||||
|
{
|
||||||
|
resource: 'roles',
|
||||||
|
action: 'get',
|
||||||
|
params: {
|
||||||
|
filterByTk: record.name,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
options,
|
||||||
|
);
|
||||||
|
},
|
||||||
|
effects() {
|
||||||
|
onFieldChange('*', async (field, form) => {
|
||||||
|
if (!form.modified) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
await api.resource('roles').update({
|
||||||
|
filterByTk: record.name,
|
||||||
|
values: form.values,
|
||||||
|
});
|
||||||
|
message.success('保存成功!');
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
properties: {
|
properties: {
|
||||||
allowConfigure: {
|
allowConfigure: {
|
||||||
title: '配置权限',
|
title: '配置权限',
|
||||||
@ -31,7 +62,5 @@ export const RoleConfigure = () => {
|
|||||||
},
|
},
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</FormLayout>
|
|
||||||
</div>
|
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
@ -1,8 +1,13 @@
|
|||||||
import { FormItem, FormLayout } from '@formily/antd';
|
import { FormItem, FormLayout } from '@formily/antd';
|
||||||
import { Checkbox, Select, Table } from 'antd';
|
import { Checkbox, Select, Table } from 'antd';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
import { useCollectionManager, useRecord } from '../..';
|
||||||
|
|
||||||
export const RolesResourcesActions = () => {
|
export const RolesResourcesActions = () => {
|
||||||
|
const record = useRecord();
|
||||||
|
console.log('record', record);
|
||||||
|
const { get } = useCollectionManager();
|
||||||
|
const collection = get(record.name);
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<FormLayout layout={'vertical'}>
|
<FormLayout layout={'vertical'}>
|
||||||
@ -47,7 +52,30 @@ export const RolesResourcesActions = () => {
|
|||||||
/>
|
/>
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem label={'字段权限'}>
|
<FormItem label={'字段权限'}>
|
||||||
<Table />
|
<Table
|
||||||
|
dataSource={collection?.fields}
|
||||||
|
columns={[
|
||||||
|
{
|
||||||
|
dataIndex: ['uiSchema', 'title'],
|
||||||
|
title: '字段名称',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'view',
|
||||||
|
title: '查看',
|
||||||
|
render: () => <Checkbox />
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'update',
|
||||||
|
title: '编辑',
|
||||||
|
render: () => <Checkbox />
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'create',
|
||||||
|
title: '添加',
|
||||||
|
render: () => <Checkbox />
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
</FormItem>
|
</FormItem>
|
||||||
</FormLayout>
|
</FormLayout>
|
||||||
</div>
|
</div>
|
||||||
|
@ -1,4 +1,6 @@
|
|||||||
import { ISchema } from '@formily/react';
|
import { ISchema, useForm } from '@formily/react';
|
||||||
|
import { useEffect } from 'react';
|
||||||
|
import { useActionContext, useAPIClient, useRecord, useRequest } from '../../../';
|
||||||
|
|
||||||
const collection = {
|
const collection = {
|
||||||
name: 'collections',
|
name: 'collections',
|
||||||
@ -67,9 +69,9 @@ export const roleCollectionsSchema: ISchema = {
|
|||||||
'x-component': 'VoidTable',
|
'x-component': 'VoidTable',
|
||||||
'x-component-props': {
|
'x-component-props': {
|
||||||
rowKey: 'name',
|
rowKey: 'name',
|
||||||
rowSelection: {
|
// rowSelection: {
|
||||||
type: 'checkbox',
|
// type: 'checkbox',
|
||||||
},
|
// },
|
||||||
useDataSource: '{{ useDataSourceFromRAC }}',
|
useDataSource: '{{ useDataSourceFromRAC }}',
|
||||||
},
|
},
|
||||||
properties: {
|
properties: {
|
||||||
@ -122,13 +124,37 @@ export const roleCollectionsSchema: ISchema = {
|
|||||||
'x-component': 'Action.Drawer',
|
'x-component': 'Action.Drawer',
|
||||||
'x-decorator': 'Form',
|
'x-decorator': 'Form',
|
||||||
'x-decorator-props': {
|
'x-decorator-props': {
|
||||||
useValues: '{{ useValues }}',
|
useValues(options) {
|
||||||
|
const record = useRecord();
|
||||||
|
const { visible } = useActionContext();
|
||||||
|
const result = useRequest(
|
||||||
|
{
|
||||||
|
resource: 'roles.resources',
|
||||||
|
resourceOf: record.roleName,
|
||||||
|
action: 'get',
|
||||||
|
params: {
|
||||||
|
filterByTk: record.name,
|
||||||
},
|
},
|
||||||
title: 'Drawer Title',
|
},
|
||||||
|
{ ...options, manual: true },
|
||||||
|
);
|
||||||
|
useEffect(() => {
|
||||||
|
if (record.usingConfig === 'strategy') {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (visible) {
|
||||||
|
result.run();
|
||||||
|
}
|
||||||
|
}, [visible, record.usingConfig]);
|
||||||
|
return;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
title: '配置权限',
|
||||||
properties: {
|
properties: {
|
||||||
usingActionsConfig: {
|
usingActionsConfig: {
|
||||||
'x-component': 'Radio.Group',
|
'x-component': 'Radio.Group',
|
||||||
'x-decorator': 'FormItem',
|
'x-decorator': 'FormItem',
|
||||||
|
default: false,
|
||||||
enum: [
|
enum: [
|
||||||
{ value: false, label: '使用通用权限:只能查看、添加、修改数据' },
|
{ value: false, label: '使用通用权限:只能查看、添加、修改数据' },
|
||||||
{ value: true, label: '单独配置权限' },
|
{ value: true, label: '单独配置权限' },
|
||||||
@ -154,7 +180,21 @@ export const roleCollectionsSchema: ISchema = {
|
|||||||
'x-component': 'Action',
|
'x-component': 'Action',
|
||||||
'x-component-props': {
|
'x-component-props': {
|
||||||
type: 'primary',
|
type: 'primary',
|
||||||
useAction: '{{ useUpdateAction }}',
|
useAction: () => {
|
||||||
|
const form = useForm();
|
||||||
|
const api = useAPIClient();
|
||||||
|
const record = useRecord();
|
||||||
|
return {
|
||||||
|
async run() {
|
||||||
|
await api.resource('roles.resources', record.roleName).create({
|
||||||
|
values: {
|
||||||
|
...form.values,
|
||||||
|
name: record.name,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
@ -114,7 +114,7 @@ export const roleSchema: ISchema = {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
table1: {
|
table: {
|
||||||
type: 'void',
|
type: 'void',
|
||||||
'x-uid': 'input',
|
'x-uid': 'input',
|
||||||
'x-component': 'VoidTable',
|
'x-component': 'VoidTable',
|
||||||
@ -228,7 +228,7 @@ export const roleSchema: ISchema = {
|
|||||||
'x-component': 'Action.Drawer',
|
'x-component': 'Action.Drawer',
|
||||||
'x-decorator': 'Form',
|
'x-decorator': 'Form',
|
||||||
'x-decorator-props': {
|
'x-decorator-props': {
|
||||||
useValues: '{{ useValues }}',
|
useValues: '{{ useValuesFromRecord }}',
|
||||||
},
|
},
|
||||||
title: 'Drawer Title',
|
title: 'Drawer Title',
|
||||||
properties: {
|
properties: {
|
||||||
|
Loading…
Reference in New Issue
Block a user