diff --git a/admin-web/src/models/admin/resourceList.js b/admin-web/src/models/admin/resourceList.js index ae83e92c0..f83c62100 100644 --- a/admin-web/src/models/admin/resourceList.js +++ b/admin-web/src/models/admin/resourceList.js @@ -1,11 +1,27 @@ import { message } from 'antd'; import { addResource, updateResource, deleteResource, resourceTree } from '../../services/admin'; +const buildSelectTree = list => { + return list.map(item => { + let children = []; + if (item.children) { + children = buildSelectTree(item.children); + } + return { + title: item.displayName, + value: item.displayName, + key: item.id, + children, + }; + }); +}; + export default { namespace: 'resourceList', state: { list: [], + selectTree: [], }, effects: { @@ -47,18 +63,19 @@ export default { message.info('查询成功!'); yield put({ type: 'treeSuccess', - payload: { - list: response.data, - }, + payload: response.data, }); }, }, reducers: { treeSuccess(state, { payload }) { + const resultData = payload; + const selectTree = buildSelectTree(resultData); return { ...state, - ...payload, + list: resultData, + selectTree, }; }, }, diff --git a/admin-web/src/pages/Admin/ResourceList.js b/admin-web/src/pages/Admin/ResourceList.js index 2f51d5f7a..d7e3159d2 100644 --- a/admin-web/src/pages/Admin/ResourceList.js +++ b/admin-web/src/pages/Admin/ResourceList.js @@ -3,18 +3,39 @@ import React, { PureComponent, Fragment } from 'react'; import { connect } from 'dva'; import moment from 'moment'; -import { Card, Form, Input, Select, Button, Modal, message, Table, Divider } from 'antd'; +import { + Card, + Form, + Input, + Select, + Button, + Modal, + message, + Table, + TreeSelect, + Radio, + Divider, +} from 'antd'; import PageHeaderWrapper from '@/components/PageHeaderWrapper'; import styles from './ResourceList.less'; +const RadioGroup = Radio.Group; const FormItem = Form.Item; const { Option } = Select; const types = ['未知', '菜单', '链接']; // 添加 form 表单 const CreateForm = Form.create()(props => { - const { modalVisible, form, handleAdd, handleModalVisible, modalType, initValues } = props; + const { + modalVisible, + form, + handleAdd, + handleModalVisible, + modalType, + initValues, + selectTree, + } = props; const okHandle = () => { form.validateFields((err, fieldsValue) => { @@ -43,47 +64,54 @@ const CreateForm = Form.create()(props => { okText={okText} onCancel={() => handleModalVisible()} > - + {form.getFieldDecorator('displayName', { + rules: [{ required: true, message: '选择类型!', min: 2 }], + initialValue: initValues.type || 1, + })( + + 菜单 + 按钮 + + )} + + + {form.getFieldDecorator('type', { rules: [{ required: true, message: '请输入菜单展示名字!', min: 2 }], initialValue: initValues.displayName, - })()} + })()} - - {form.getFieldDecorator('handler', { - initialValue: initValues.handler, - })()} - - + {form.getFieldDecorator('name', { rules: [{ required: true, message: '请输入资源名字!' }], initialValue: initValues.name, - })()} + })()} - + + {form.getFieldDecorator('handler', { + initialValue: initValues.handler, + })()} + + {form.getFieldDecorator('pid', { rules: [{ required: true, message: '请输入父级编号!' }], initialValue: initValues.pid, - })()} - 根节点为 0 + })( + + )} - + {form.getFieldDecorator('sort', { rules: [{ required: true, message: '请输入菜单排序!' }], initialValue: initValues.sort, })()} - - {form.getFieldDecorator('type', { - rules: [{ required: true, message: '请选择资源类型!' }], - initialValue: 1, - })( - - )} - ); }); @@ -167,7 +195,8 @@ class ResourceList extends PureComponent { } render() { - const { list } = this.props; + const { list, resourceList } = this.props; + const { selectTree } = resourceList; const { modalVisible, modalType, initValues } = this.state; const parentMethods = { handleAdd: this.handleAdd, @@ -247,7 +276,7 @@ class ResourceList extends PureComponent { - + ); }