前端-数据字典的增删改查
This commit is contained in:
parent
b1e10dc507
commit
f47e564772
@ -6,6 +6,7 @@ import adminMenuAll from './geographic/admin-menu-all.json';
|
|||||||
import adminUrls from './geographic/admin-urls';
|
import adminUrls from './geographic/admin-urls';
|
||||||
import resourceTree from './geographic/resource-tree.json';
|
import resourceTree from './geographic/resource-tree.json';
|
||||||
import roleQuery from './geographic/role-query.json';
|
import roleQuery from './geographic/role-query.json';
|
||||||
|
import dictionaryList from './geographic/dictionary-list.json';
|
||||||
|
|
||||||
function getAdminMenu(req, res) {
|
function getAdminMenu(req, res) {
|
||||||
return res.json(adminMenu);
|
return res.json(adminMenu);
|
||||||
@ -43,6 +44,10 @@ function getDictionaryText(req, res) {
|
|||||||
return res.json(resultBody(values));
|
return res.json(resultBody(values));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function getDictionaryList(req, res) {
|
||||||
|
return res.json(dictionaryList);
|
||||||
|
}
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
'GET /admin-api/admins/admin/menu_resource_tree': getAdminMenuAll,
|
'GET /admin-api/admins/admin/menu_resource_tree': getAdminMenuAll,
|
||||||
'GET /admin-api/admins/admin/url_resource_list': getAdminUrls,
|
'GET /admin-api/admins/admin/url_resource_list': getAdminUrls,
|
||||||
@ -51,4 +56,5 @@ export default {
|
|||||||
'GET /admin-api/admins/admin/page': getQueryRole,
|
'GET /admin-api/admins/admin/page': getQueryRole,
|
||||||
'GET /admin-api/admins/dictionary/getList': getDictionaryKeys,
|
'GET /admin-api/admins/dictionary/getList': getDictionaryKeys,
|
||||||
'GET /admin-api/admins/dictionary/queryText': getDictionaryText,
|
'GET /admin-api/admins/dictionary/queryText': getDictionaryText,
|
||||||
|
// 'GET /admin-api/admins/data_dict/list': getDictionaryList,
|
||||||
};
|
};
|
||||||
|
@ -8,7 +8,7 @@
|
|||||||
"value": "1",
|
"value": "1",
|
||||||
"displayName": "男",
|
"displayName": "男",
|
||||||
"sort": 1,
|
"sort": 1,
|
||||||
"memo": ""
|
"memo": "性别 - 男"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 2,
|
"id": 2,
|
||||||
@ -16,7 +16,7 @@
|
|||||||
"value": "2",
|
"value": "2",
|
||||||
"displayName": "女",
|
"displayName": "女",
|
||||||
"sort": 2,
|
"sort": 2,
|
||||||
"memo": ""
|
"memo": "性别 - 女"
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
@ -1,5 +1,5 @@
|
|||||||
import {message} from 'antd';
|
import {message} from 'antd';
|
||||||
import { addResource, updateResource, deleteResource, dictionaryList } from '../../services/admin';
|
import {dictionaryAdd, dictionaryDelete, dictionaryList, dictionaryUpdate} from '../../services/admin';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
namespace: 'dictionaryList',
|
namespace: 'dictionaryList',
|
||||||
@ -11,7 +11,7 @@ export default {
|
|||||||
effects: {
|
effects: {
|
||||||
*add({ payload }, { call, put }) {
|
*add({ payload }, { call, put }) {
|
||||||
const { callback, body } = payload;
|
const { callback, body } = payload;
|
||||||
const response = yield call(addResource, body);
|
const response = yield call(dictionaryAdd, body);
|
||||||
if (callback) {
|
if (callback) {
|
||||||
callback(response);
|
callback(response);
|
||||||
}
|
}
|
||||||
@ -22,7 +22,7 @@ export default {
|
|||||||
},
|
},
|
||||||
*update({ payload }, { call, put }) {
|
*update({ payload }, { call, put }) {
|
||||||
const { callback, body } = payload;
|
const { callback, body } = payload;
|
||||||
const response = yield call(updateResource, body);
|
const response = yield call(dictionaryUpdate, body);
|
||||||
if (callback) {
|
if (callback) {
|
||||||
callback(response);
|
callback(response);
|
||||||
}
|
}
|
||||||
@ -32,23 +32,53 @@ export default {
|
|||||||
});
|
});
|
||||||
},
|
},
|
||||||
*delete({ payload }, { call, put }) {
|
*delete({ payload }, { call, put }) {
|
||||||
const response = yield call(deleteResource, payload);
|
const response = yield call(dictionaryDelete, payload);
|
||||||
message.info('删除成功!');
|
message.info('删除成功!');
|
||||||
|
// yield put({
|
||||||
|
// type: 'treeSuccess',
|
||||||
|
// payload: {
|
||||||
|
// list: response.data,
|
||||||
|
// },
|
||||||
|
// });
|
||||||
yield put({
|
yield put({
|
||||||
type: 'treeSuccess',
|
type: 'tree',
|
||||||
payload: {
|
payload: {},
|
||||||
list: response.data,
|
|
||||||
},
|
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
*tree({ payload }, { call, put }) {
|
*tree({ payload }, { call, put }) {
|
||||||
const { queryParams } = payload;
|
const { queryParams } = payload;
|
||||||
const response = yield call(dictionaryList, queryParams);
|
const response = yield call(dictionaryList, queryParams);
|
||||||
message.info('查询成功!');
|
message.info('查询成功!');
|
||||||
|
|
||||||
|
// 将数据格式化成 tree 格式
|
||||||
|
// debugger;
|
||||||
|
let treeNodeMap = new Map(); // key: enumValue value: Node
|
||||||
|
for(let i = 0, len = response.data.length; i < len; i++){
|
||||||
|
let dataDict = response.data[i];
|
||||||
|
let treeNode = treeNodeMap.get(dataDict.enumValue);
|
||||||
|
if (!treeNode) {
|
||||||
|
treeNode = {
|
||||||
|
enumValue: dataDict.enumValue,
|
||||||
|
children: [dataDict]
|
||||||
|
};
|
||||||
|
treeNodeMap.set(dataDict.enumValue, treeNode);
|
||||||
|
treeNode.index = dataDict.enumValue; // 因为 Table 必须要有 rowKey ,所以这里需要处理下。主要是数据字典的结构特殊
|
||||||
|
} else {
|
||||||
|
treeNode.children.push(dataDict);
|
||||||
|
}
|
||||||
|
dataDict.index = dataDict.id; // 因为 Table 必须要有 rowKey ,所以这里需要处理下。主要是数据字典的结构特殊
|
||||||
|
}
|
||||||
|
// 因为不支持 Map.values() 返回的结果,所以这里进行转换。
|
||||||
|
let list = [];
|
||||||
|
treeNodeMap.forEach(function (value, key, map) {
|
||||||
|
list.push(value)
|
||||||
|
});
|
||||||
|
// console.log(list);
|
||||||
|
|
||||||
yield put({
|
yield put({
|
||||||
type: 'treeSuccess',
|
type: 'treeSuccess',
|
||||||
payload: {
|
payload: {
|
||||||
list: response.data,
|
list: list,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
@ -3,7 +3,7 @@
|
|||||||
import React, { PureComponent, Fragment } from 'react';
|
import React, { PureComponent, Fragment } from 'react';
|
||||||
import { connect } from 'dva';
|
import { connect } from 'dva';
|
||||||
import moment from 'moment';
|
import moment from 'moment';
|
||||||
import { Card, Form, Input, Select, Button, Modal, message, Table, Divider } from 'antd';
|
import { Card, Form, Input, InputNumber, Select, Button, Modal, message, Table, Divider } from 'antd';
|
||||||
import PageHeaderWrapper from '@/components/PageHeaderWrapper';
|
import PageHeaderWrapper from '@/components/PageHeaderWrapper';
|
||||||
|
|
||||||
import styles from './DictionaryList.less';
|
import styles from './DictionaryList.less';
|
||||||
@ -32,8 +32,8 @@ const CreateForm = Form.create()(props => {
|
|||||||
width: 200,
|
width: 200,
|
||||||
};
|
};
|
||||||
|
|
||||||
const title = modalType === 'add' ? '添加一个数据字典' : '更新一个数据字典';
|
const title = modalType === 'add' ? '新建数据字典' : '编辑数据字典';
|
||||||
const okText = modalType === 'add' ? '添加' : '更新';
|
const okText = '保存';
|
||||||
return (
|
return (
|
||||||
<Modal
|
<Modal
|
||||||
destroyOnClose
|
destroyOnClose
|
||||||
@ -43,46 +43,35 @@ const CreateForm = Form.create()(props => {
|
|||||||
okText={okText}
|
okText={okText}
|
||||||
onCancel={() => handleModalVisible()}
|
onCancel={() => handleModalVisible()}
|
||||||
>
|
>
|
||||||
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="菜单展示名">
|
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="大类枚举值">
|
||||||
|
{form.getFieldDecorator('enumValue', {
|
||||||
|
rules: [{ required: true, message: '请输入大类枚举值!', min: 2 }],
|
||||||
|
initialValue: initValues.enumValue,
|
||||||
|
})(<Input placeholder="请输入" />)}
|
||||||
|
</FormItem>
|
||||||
|
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="小类数值">
|
||||||
|
{form.getFieldDecorator('value', {
|
||||||
|
rules: [{ required: true, message: '请输入小类数值!' }],
|
||||||
|
initialValue: initValues.value,
|
||||||
|
})(<Input placeholder="请输入" />)}
|
||||||
|
</FormItem>
|
||||||
|
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="展示名">
|
||||||
{form.getFieldDecorator('displayName', {
|
{form.getFieldDecorator('displayName', {
|
||||||
rules: [{ required: true, message: '请输入菜单展示名字!', min: 2 }],
|
rules: [{ required: true, message: '请输入展示名!' }],
|
||||||
initialValue: initValues.displayName,
|
initialValue: initValues.displayName,
|
||||||
})(<Input placeholder="请输入" />)}
|
})(<Input placeholder="请输入" />)}
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="操作">
|
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="排序值">
|
||||||
{form.getFieldDecorator('handler', {
|
|
||||||
initialValue: initValues.handler,
|
|
||||||
})(<Input placeholder="请输入" />)}
|
|
||||||
</FormItem>
|
|
||||||
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="资源名字">
|
|
||||||
{form.getFieldDecorator('name', {
|
|
||||||
rules: [{ required: true, message: '请输入资源名字!' }],
|
|
||||||
initialValue: initValues.name,
|
|
||||||
})(<Input placeholder="请输入" />)}
|
|
||||||
</FormItem>
|
|
||||||
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="父级资源编号">
|
|
||||||
{form.getFieldDecorator('pid', {
|
|
||||||
rules: [{ required: true, message: '请输入父级编号!' }],
|
|
||||||
initialValue: initValues.pid,
|
|
||||||
})(<Input placeholder="请输入" />)}
|
|
||||||
<span>根节点为 0</span>
|
|
||||||
</FormItem>
|
|
||||||
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="排序">
|
|
||||||
{form.getFieldDecorator('sort', {
|
{form.getFieldDecorator('sort', {
|
||||||
rules: [{ required: true, message: '请输入菜单排序!' }],
|
rules: [{ required: true, message: '请输入排序值!' }],
|
||||||
initialValue: initValues.sort,
|
initialValue: initValues.sort,
|
||||||
})(<Input placeholder="请输入" />)}
|
})(<InputNumber placeholder="请输入" />)}
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="资源类型">
|
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="备注">
|
||||||
{form.getFieldDecorator('type', {
|
{form.getFieldDecorator('memo', {
|
||||||
rules: [{ required: true, message: '请选择资源类型!' }],
|
rules: [{ required: true, message: '请输入备注!' }],
|
||||||
initialValue: 1,
|
initialValue: initValues.memo,
|
||||||
})(
|
})(<Input.TextArea placeholder="请输入" />)}
|
||||||
<Select showSearch style={selectStyle} placeholder="请选择">
|
|
||||||
<Option value={1}>菜单</Option>
|
|
||||||
<Option value={2}>Url</Option>
|
|
||||||
</Select>
|
|
||||||
)}
|
|
||||||
</FormItem>
|
</FormItem>
|
||||||
</Modal>
|
</Modal>
|
||||||
);
|
);
|
||||||
@ -176,16 +165,17 @@ class DictionaryList extends PureComponent {
|
|||||||
modalType,
|
modalType,
|
||||||
initValues,
|
initValues,
|
||||||
};
|
};
|
||||||
|
let that = this;
|
||||||
|
|
||||||
const columns = [
|
const columns = [
|
||||||
{
|
{
|
||||||
title: '枚举值',
|
title: '大类枚举值',
|
||||||
dataIndex: 'enumValue'
|
dataIndex: 'enumValue'
|
||||||
},
|
},
|
||||||
{
|
// {
|
||||||
title: '编号',
|
// title: '编号',
|
||||||
dataIndex: 'id',
|
// dataIndex: 'id',
|
||||||
},
|
// },
|
||||||
{
|
{
|
||||||
title: '小类数值',
|
title: '小类数值',
|
||||||
dataIndex: 'value'
|
dataIndex: 'value'
|
||||||
@ -210,15 +200,18 @@ class DictionaryList extends PureComponent {
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '操作',
|
title: '操作',
|
||||||
render: (text, record) => (
|
render: function(text, record) {
|
||||||
<Fragment>
|
if (!record.id) {
|
||||||
<a onClick={() => this.handleModalVisible(true, 'update', record)}>更新</a>
|
return '';
|
||||||
|
}
|
||||||
|
return <Fragment>
|
||||||
|
<a onClick={() => that.handleModalVisible(true, 'update', record)}>编辑</a>
|
||||||
<Divider type="vertical" />
|
<Divider type="vertical" />
|
||||||
<a className={styles.tableDelete} onClick={() => this.handleDelete(record)}>
|
<a className={styles.tableDelete} onClick={() => that.handleDelete(record)}>
|
||||||
删除
|
删除
|
||||||
</a>
|
</a>
|
||||||
</Fragment>
|
</Fragment>
|
||||||
),
|
}
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
@ -232,11 +225,11 @@ class DictionaryList extends PureComponent {
|
|||||||
type="primary"
|
type="primary"
|
||||||
onClick={() => this.handleModalVisible(true, 'add', {})}
|
onClick={() => this.handleModalVisible(true, 'add', {})}
|
||||||
>
|
>
|
||||||
新建
|
新建数据字典
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<Table defaultExpandAllRows={true} columns={columns} dataSource={list} rowKey="enumValue" />
|
<Table defaultExpandAllRows={true} columns={columns} dataSource={list} rowKey="index" />
|
||||||
</Card>
|
</Card>
|
||||||
<CreateForm {...parentMethods} modalVisible={modalVisible} />
|
<CreateForm {...parentMethods} modalVisible={modalVisible} />
|
||||||
</PageHeaderWrapper>
|
</PageHeaderWrapper>
|
||||||
|
@ -130,3 +130,23 @@ export async function dictionaryList(params) {
|
|||||||
method: 'GET',
|
method: 'GET',
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export async function dictionaryAdd(params) {
|
||||||
|
return request(`/admin-api/admins/data_dict/add?${stringify(params)}`, {
|
||||||
|
method: 'POST',
|
||||||
|
body: {},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function dictionaryUpdate(params) {
|
||||||
|
return request(`/admin-api/admins/data_dict/update?${stringify(params)}`, {
|
||||||
|
method: 'POST',
|
||||||
|
body: {},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function dictionaryDelete(params) {
|
||||||
|
return request(`/admin-api/admins/data_dict/delete?${stringify(params)}`, {
|
||||||
|
method: 'POST',
|
||||||
|
});
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user