wangrunpu
/
yudao-cloud
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

前端：管理员模块添加功能重构

Browse Source 
前端：管理员模块修改功能重构
master
YunaiV 7 years ago
parent e3a14c2abb
commit b29844f0d0
5 changed files with 140 additions and 106 deletions
Show Stats Download Patch File Download Diff File

2
admin-web/src/components/Dictionary/DictionaryText.js
Unescape View File

@ -5,7 +5,7 @@ export default class DictionaryText extends PureComponent {
componentDidMount() {}
render() {
debugger;
// debugger;
const { dicKey, dicValue } = this.props;
return (
<DictionaryContext.Consumer>

64
admin-web/src/models/admin/adminList.js
Unescape View File

@ -20,10 +20,17 @@ export default {
namespace: 'adminList',
state: {
// 分页列表相关
list: [],
searchParams: SEARCH_PARAMS_DEFAULT,
pagination: PaginationHelper.defaultPaginationConfig,
// 添加 or 修改表单相关
modalVisible: false,
modalType: undefined, // 'add' or 'update' 表单
formVals: {}, // 当前表单值
// 分配角色表单相关
roleList: [],
roleCheckedKeys: [],
roleAssignLoading: false,
@ -44,31 +51,37 @@ export default {
},
});
},
*add({ payload }, { call, put }) {
const { callback, body, queryParams } = payload;
* add({ payload }, { call, put }) {
const { callback, body } = payload;
const response = yield call(addAdmin, body);
if (callback) {
callback(response);
if (response.code === 0) {
if (callback) {
callback(response);
}
// 刷新列表
yield put({
type: 'query',
payload: {
...PaginationHelper.defaultPayload
},
});
}
yield put({
type: 'query',
payload: {
...queryParams,
},
});
},
*update({ payload }, { call, put }) {
const { callback, body, queryParams } = payload;
* update({ payload }, { call, put }) {
const { callback, body } = payload;
const response = yield call(updateAdmin, body);
if (callback) {
callback(response);
if (response.code === 0) {
if (callback) {
callback(response);
}
// 刷新列表
yield put({
type: 'query',
payload: {
...PaginationHelper.defaultPayload
},
});
}
yield put({
type: 'query',
payload: {
...queryParams,
},
});
},
*updateStatus({ payload }, { call, put }) {
const { body, queryParams } = payload;
@ -148,5 +161,16 @@ export default {
roleAssignLoading: payload,
};
},
setAll(state, { payload }) {
console.log('setAll');
console.log({
...state,
...payload,
});
return {
...state,
...payload,
};
}
},
};

165
admin-web/src/pages/Admin/AdminList.js
Unescape View File

@ -15,7 +15,7 @@ const { TreeNode } = Tree;
const status = ['未知', '正常', '禁用'];
// 列表
function List ({ dataSource, pagination, searchParams, dispatch }) {
function List ({ dataSource, pagination, searchParams, dispatch, handleModalVisible }) {
const columns = [
{
title: '用户名',
@ -44,7 +44,7 @@ function List ({ dataSource, pagination, searchParams, dispatch }) {
const statusText = record.status === 1 ? '禁用' : '禁用';
return (
<Fragment>
<a onClick={() => this.handleModalVisible(true, 'update', record)}>编辑</a>
<a onClick={() => handleModalVisible(true, 'update', record)}>编辑</a>
<Divider type="vertical" />
<a onClick={() => this.handleRoleAssign(record)}>角色分配</a>
<Divider type="vertical" />
@ -147,19 +147,51 @@ const SearchForm = Form.create()(props => {
);
});
// 添加 form 表单
// 添加 or 修改 Form 表单
const AddOrUpdateForm = Form.create()(props => {
const { modalVisible, form, handleAdd, handleModalVisible, modalType, initValues } = props;
const { dispatch, modalVisible, form, handleModalVisible, modalType, formVals } = props;
const okHandle = () => {
form.validateFields((err, fieldsValue) => {
form.validateFields((err, fields) => {
if (err) return;
form.resetFields();
handleAdd({
fields: fieldsValue,
modalType,
initValues,
});
// 添加表单
if (modalType === 'add') {
dispatch({
type: 'adminList/add',
payload: {
body: {
...fields,
},
callback: () => {
// 清空表单
form.resetFields();
// 提示
message.success('添加成功');
// 关闭弹窗
handleModalVisible();
},
},
});
// 修改表单
} else {
dispatch({
type: 'adminList/update',
payload: {
body: {
...formVals,
...fields,
},
callback: () => {
// 清空表单
form.resetFields();
// 提示
message.success('更新成功');
// 关闭弹窗
handleModalVisible();
},
},
});
}
});
};
@ -176,24 +208,24 @@ const AddOrUpdateForm = Form.create()(props => {
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="用户名">
{form.getFieldDecorator('username', {
rules: [{ required: true, message: '请输入用户名！'},
{max: 16, min:6, message: '长度为6-16位'},
{max: 16, min:6, message: '长度为 6-16 位'},
{ validator: (rule, value, callback) => checkTypeWithEnglishAndNumbers(rule, value, callback, '数字以及字母')}
],
initialValue: initValues.username,
initialValue: formVals.username,
})(<Input placeholder="请输入" />)}
</FormItem>
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="昵称">
{form.getFieldDecorator('nickname', {
rules: [{ required: true, message: '请输入昵称！'},
{max: 10, message: '姓名最大长度为10'}],
initialValue: initValues.nickname,
{max: 10, message: '姓名最大长度为 10'}],
initialValue: formVals.nickname,
})(<Input placeholder="请输入" />)}
</FormItem>
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="密码">
{form.getFieldDecorator('password', {
rules: [{ required: modalType === 'add', message: '请填写密码'}, // 添加时，必须输入密码
{max: 16, min: 6, message: '长度为6-18位'}],
initialValue: initValues.password,
{max: 16, min: 6, message: '长度为 6-18 位'}],
initialValue: formVals.password,
})(<Input placeholder="请输入" type="password" />)}
</FormItem>
</Modal>
@ -281,13 +313,8 @@ const RoleAssignModal = Form.create()(props => {
}))
@Form.create()
class ResourceList extends PureComponent {
class AdminList extends PureComponent {
state = {
// 添加 or 修改弹窗
modalVisible: false,
modalType: undefined, // 'add' or 'update'
initValues: {},
// 分配角色弹窗
modalRoleVisible: false,
@ -304,52 +331,19 @@ class ResourceList extends PureComponent {
});
}
handleModalVisible = (flag, modalType, initValues) => {
this.setState({
modalVisible: !!flag,
initValues: initValues || {},
modalType: modalType || 'add',
handleModalVisible = (modalVisible, modalType, formVals) => {
// debugger;
const { dispatch } = this.props;
dispatch({
type: 'adminList/setAll',
payload: {
modalVisible,
modalType,
formVals: formVals || {}
},
});
};
handleAdd = ({ fields, modalType, initValues }) => {
const { dispatch, data } = this.props;
const queryParams = {
pageNo: data.pageNo,
pageSize: data.pageSize,
};
if (modalType === 'add') {
dispatch({
type: 'adminList/add',
payload: {
body: {
...fields,
},
queryParams,
callback: () => {
message.success('添加成功');
this.handleModalVisible();
},
},
});
} else {
dispatch({
type: 'adminList/update',
payload: {
body: {
...initValues,
...fields,
},
queryParams,
callback: () => {
message.success('更新成功');
this.handleModalVisible();
},
},
});
}
};
handleStatus(row) {
const { dispatch, data } = this.props;
const queryParams = {
@ -450,29 +444,25 @@ class ResourceList extends PureComponent {
};
render() {
let that = this;
const { dispatch, list, searchParams, pagination, data } = this.props;
// let that = this;
const { dispatch, list, searchParams, pagination, modalVisible, data, modalType, formVals } = this.props;
const { roleList, roleCheckedKeys, roleAssignLoading } = data;
const {
modalVisible,
modalType,
initValues,
modalRoleVisible,
} = this.state;
const parentMethods = {
handleAdd: this.handleAdd,
handleModalVisible: this.handleModalVisible,
modalType,
initValues,
};
// const {
// // modalVisible,
// // modalType,
// formVals,
// modalRoleVisible,
// } = this.state;
const modalRoleVisible = false;
// 列表属性
const listProps = {
dataSource: list,
pagination,
searchParams,
dispatch
dispatch,
handleModalVisible: this.handleModalVisible, // Function
};
// 搜索表单属性
@ -481,6 +471,13 @@ class ResourceList extends PureComponent {
};
// 添加
const addFormProps = {
modalVisible,
modalType: modalType,
formVals: formVals,
dispatch,
handleModalVisible: this.handleModalVisible, // Function
};
return (
<PageHeaderWrapper>
@ -502,7 +499,7 @@ class ResourceList extends PureComponent {
<List {...listProps} />
</Card>
<AddOrUpdateForm {...parentMethods} modalVisible={modalVisible} />
<AddOrUpdateForm {...addFormProps} />
<RoleAssignModal
loading={roleAssignLoading}
@ -518,4 +515,4 @@ class ResourceList extends PureComponent {
}
}
export default ResourceList;
export default AdminList;

7
admin/admin-service-api/src/main/java/cn/iocoder/mall/admin/api/dto/AdminAddDTO.java
Unescape View File

@ -1,6 +1,9 @@
package cn.iocoder.mall.admin.api.dto;
import org.hibernate.validator.constraints.Length;
import javax.validation.constraints.NotEmpty;
import javax.validation.constraints.Pattern;
/**
* 管理员添加 DTO
@ -11,16 +14,20 @@ public class AdminAddDTO {
* 登陆账号
*/
@NotEmpty(message = "登陆账号不能为空")
@Length(min = 6, max = 16, message = "账号长度为 6-16 位")
@Pattern(regexp = "^[A-Za-z0-9]+$", message = "账号格式为数字以及字母")
private String username;
/**
* 昵称
*/
@NotEmpty(message = "昵称不能为空")
@Length(max = 10, message = "昵称长度最大为 10 位")
private String nickname;
/**
* 密码
*/
@NotEmpty(message = "密码不能为空")
@Length(min = 6, max = 16, message = "密码长度为 6-16 位")
private String password;
public String getUsername() {

8
admin/admin-service-api/src/main/java/cn/iocoder/mall/admin/api/dto/AdminUpdateDTO.java
Unescape View File

@ -1,7 +1,10 @@
package cn.iocoder.mall.admin.api.dto;
import org.hibernate.validator.constraints.Length;
import javax.validation.constraints.NotEmpty;
import javax.validation.constraints.NotNull;
import javax.validation.constraints.Pattern;
/**
* 管理员更新 DTO
@ -17,16 +20,19 @@ public class AdminUpdateDTO {
* 登陆账号
*/
@NotEmpty(message = "登陆账号不能为空")
@Length(min = 6, max = 16, message = "账号长度为 6-16 位")
@Pattern(regexp = "^[A-Za-z0-9]+$", message = "账号格式为数字以及字母")
private String username;
/**
* 昵称
*/
@NotEmpty(message = "昵称不能为空")
@Length(max = 10, message = "昵称长度最大为 10 位")
private String nickname;
/**
* 密码
*/
@NotEmpty(message = "密码不能为空")
@Length(min = 6, max = 16, message = "密码长度为 6-16 位")
private String password;
public String getUsername() {

Write Preview
Loading…
Cancel
Save