diff --git a/admin-web/src/components/Dictionary/DictionaryText.js b/admin-web/src/components/Dictionary/DictionaryText.js index 7faf7e329..d94e54847 100644 --- a/admin-web/src/components/Dictionary/DictionaryText.js +++ b/admin-web/src/components/Dictionary/DictionaryText.js @@ -5,7 +5,7 @@ export default class DictionaryText extends PureComponent { componentDidMount() {} render() { - debugger; + // debugger; const { dicKey, dicValue } = this.props; return ( diff --git a/admin-web/src/models/admin/adminList.js b/admin-web/src/models/admin/adminList.js index 78297ff00..dc302ec82 100644 --- a/admin-web/src/models/admin/adminList.js +++ b/admin-web/src/models/admin/adminList.js @@ -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, + }; + } }, }; diff --git a/admin-web/src/pages/Admin/AdminList.js b/admin-web/src/pages/Admin/AdminList.js index f27ab724f..99a0a93b4 100644 --- a/admin-web/src/pages/Admin/AdminList.js +++ b/admin-web/src/pages/Admin/AdminList.js @@ -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 ( - this.handleModalVisible(true, 'update', record)}>编辑 + handleModalVisible(true, 'update', record)}>编辑 this.handleRoleAssign(record)}>角色分配 @@ -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 => { {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, })()} {form.getFieldDecorator('nickname', { rules: [{ required: true, message: '请输入昵称！'}, - {max: 10, message: '姓名最大长度为10'}], - initialValue: initValues.nickname, + {max: 10, message: '姓名最大长度为 10'}], + initialValue: formVals.nickname, })()} {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, })()} @@ -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 { + // // modalVisible, + // // modalType, + // formVals, + // modalRoleVisible, + // } = this.state; + const modalRoleVisible = false; - const parentMethods = { - handleAdd: this.handleAdd, - handleModalVisible: this.handleModalVisible, - modalType, - initValues, - }; // 列表属性 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 ( @@ -502,7 +499,7 @@ class ResourceList extends PureComponent { - +