From f2125e49cf74fe7fbe95c96304263941c7f6f8c0 Mon Sep 17 00:00:00 2001 From: YunaiV <> Date: Wed, 20 Mar 2019 23:23:43 +0800 Subject: [PATCH] =?UTF-8?q?=E5=89=8D=E7=AB=AF=EF=BC=9A=E9=87=8D=E6=9E=84?= =?UTF-8?q?=E7=AE=A1=E7=90=86=E5=91=98=E6=A8=A1=E5=9D=97~?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- admin-web/helpers/PaginationHelper.js | 57 ++++ admin-web/src/models/admin/adminList.js | 49 ++-- admin-web/src/pages/Admin/AdminList.js | 277 +++++++++++------- .../admin/application/vo/AdminPageVO.java | 20 +- .../mall/admin/api/bo/AdminPageBO.java | 20 +- .../mall/admin/service/AdminServiceImpl.java | 6 +- 6 files changed, 276 insertions(+), 153 deletions(-) create mode 100644 admin-web/helpers/PaginationHelper.js diff --git a/admin-web/helpers/PaginationHelper.js b/admin-web/helpers/PaginationHelper.js new file mode 100644 index 000000000..3df0a69b1 --- /dev/null +++ b/admin-web/helpers/PaginationHelper.js @@ -0,0 +1,57 @@ +const DEFAULT_PAGE_NO = 1; +const DEFAULT_PAGE_SIZE = 10; + +class PaginationHelper { + + static defaultPaginationConfig = { + defaultCurrent: DEFAULT_PAGE_NO, + defaultPageSize: DEFAULT_PAGE_SIZE, + current: DEFAULT_PAGE_NO, + total: 0, + pageSize: DEFAULT_PAGE_SIZE, + showSizeChanger: true, + showQuickJumper: true, + showTotal: total => `共 ${total} 条` + }; + + static formatPagination(data) { + return { + defaultCurrent: DEFAULT_PAGE_NO, + defaultPageSize: DEFAULT_PAGE_SIZE, + current: data.current, + total: data.total, + pageSize: data.size, + showSizeChanger: true, + showQuickJumper: true, + showTotal: total => `共 ${total} 条`, + }; + }; + + /** + * data.total 数据总数 + * payload.pageNo 页码 + * payload.pageSize 每页总数 + */ + static formatPagination(data, payload) { + return { + defaultCurrent: DEFAULT_PAGE_NO, + defaultPageSize: DEFAULT_PAGE_SIZE, + current: payload.pageNo, + pageSize: payload.pageSize, + total: data.total, + showSizeChanger: true, + showQuickJumper: true, + showTotal: total => `共 ${total} 条`, + }; + }; + + //获取初始页码 + static defaultPayload = { + pageNo: DEFAULT_PAGE_NO, + pageSize: DEFAULT_PAGE_SIZE + } + +} + +export default PaginationHelper; +export {PaginationHelper}; diff --git a/admin-web/src/models/admin/adminList.js b/admin-web/src/models/admin/adminList.js index bd1455f36..78297ff00 100644 --- a/admin-web/src/models/admin/adminList.js +++ b/admin-web/src/models/admin/adminList.js @@ -1,24 +1,28 @@ -import { message } from 'antd'; -import { buildTreeNode, findCheckedKeys } from '../../utils/tree.utils'; +import {message} from 'antd'; +import {buildTreeNode, findCheckedKeys} from '../../utils/tree.utils'; import { addAdmin, - updateAdmin, - updateAdminStatus, + adminRoleAssign, deleteAdmin, queryAdmin, queryAdminRoleList, - adminRoleAssign, + updateAdmin, + updateAdminStatus, } from '../../services/admin'; -import { arrayToStringParams } from '../../utils/request.qs'; +import {arrayToStringParams} from '../../utils/request.qs'; +import PaginationHelper from '../../../helpers/PaginationHelper'; + +const SEARCH_PARAMS_DEFAULT = { + nickname: '', +}; export default { namespace: 'adminList', state: { list: [], - count: 0, - pageNo: 0, - pageSize: 10, + searchParams: SEARCH_PARAMS_DEFAULT, + pagination: PaginationHelper.defaultPaginationConfig, roleList: [], roleCheckedKeys: [], @@ -26,6 +30,20 @@ export default { }, effects: { + // 查询列表 + * query({ payload }, { call, put }) { + const response = yield call(queryAdmin, payload); + yield put({ + type: 'querySuccess', + payload: { + list: response.data.list, + pagination: PaginationHelper.formatPagination(response.data, payload), + searchParams: { + nickname: payload.nickname || '' + } + }, + }); + }, *add({ payload }, { call, put }) { const { callback, body, queryParams } = payload; const response = yield call(addAdmin, body); @@ -74,18 +92,7 @@ export default { }, }); }, - *query({ payload }, { call, put }) { - const response = yield call(queryAdmin, payload); - const { count, admins } = response.data; - yield put({ - type: 'querySuccess', - payload: { - list: admins, - count, - pageNo: payload.pageNo + 1 - }, - }); - }, + *queryRoleList({ payload }, { call, put }) { yield put({ type: 'changeRoleAssignLoading', diff --git a/admin-web/src/pages/Admin/AdminList.js b/admin-web/src/pages/Admin/AdminList.js index 26eb689c6..f27ab724f 100644 --- a/admin-web/src/pages/Admin/AdminList.js +++ b/admin-web/src/pages/Admin/AdminList.js @@ -8,14 +8,147 @@ import PageHeaderWrapper from '@/components/PageHeaderWrapper'; import styles from './AdminList.less'; import moment from "moment"; -import Pagination from "antd/es/pagination"; +import PaginationHelper from "../../../helpers/PaginationHelper"; const FormItem = Form.Item; const { TreeNode } = Tree; const status = ['未知', '正常', '禁用']; +// 列表 +function List ({ dataSource, pagination, searchParams, dispatch }) { + const columns = [ + { + title: '用户名', + dataIndex: 'username' + }, + { + title: '昵称', + dataIndex: 'nickname', + }, + { + title: '状态', + dataIndex: 'status', + render(val) { + return {status[val]}; // TODO 芋艿，此处要改 + }, + }, + { + title: '创建时间', + dataIndex: 'createTime', + render: val => {moment(val).format('YYYY-MM-DD HH:mm')}, + }, + { + title: '操作', + width: 360, + render: (text, record) => { + const statusText = record.status === 1 ? '禁用' : '禁用'; + return ( + + this.handleModalVisible(true, 'update', record)}>编辑 + + this.handleRoleAssign(record)}>角色分配 + + this.handleStatus(record)}> + {statusText} + + + this.handleDelete(record)}> + 删除 + + + ); + }, + }, + ]; + + function onPageChange(page) { + dispatch({ + type: 'adminList/query', + payload: { + pageNo: page.current, + pageSize: page.pageSize, + ...searchParams + } + }) + }; + + return ( + + ) +} + +// 搜索表单 +// TODO 芋艿，有没办法换成上面那种写法 +const SearchForm = Form.create()(props => { + const { + form, + form: { getFieldDecorator }, + dispatch + } = props; + + function search() { + dispatch({ + type: 'adminList/query', + payload: { + ...PaginationHelper.defaultPayload, + ...form.getFieldsValue() + } + }) + } + + // 提交搜索 + function handleSubmit(e) { + // 阻止默认事件 + e.preventDefault(); + // 提交搜索 + search(); + } + + // 重置搜索 + function handleReset() { + // 重置表单 + form.resetFields(); + // 执行搜索 + search(); + } + + return ( + + + + + {getFieldDecorator('nickname')()} + + + + + + + + + + + ); +}); + // 添加 form 表单 -const CreateForm = Form.create()(props => { +const AddOrUpdateForm = Form.create()(props => { const { modalVisible, form, handleAdd, handleModalVisible, modalType, initValues } = props; const okHandle = () => { @@ -30,10 +163,6 @@ const CreateForm = Form.create()(props => { }); }; - const selectStyle = { - width: 200, - }; - const title = modalType === 'add' ? '新建管理员' : '更新管理员'; return ( { }); @connect(({ adminList, loading }) => ({ - list: adminList.list, + // list: adminList.list, + // pagination: adminList.pagination, + ...adminList, data: adminList, loading: loading.models.resourceList, })) + @Form.create() class ResourceList extends PureComponent { state = { + // 添加 or 修改弹窗 modalVisible: false, - modalType: 'add', //add update + modalType: undefined, // 'add' or 'update' + initValues: {}, + // 分配角色弹窗 modalRoleVisible: false, modalRoleRow: {}, }; @@ -163,7 +298,9 @@ class ResourceList extends PureComponent { const { dispatch } = this.props; dispatch({ type: 'adminList/query', - payload: {}, + payload: { + ...PaginationHelper.defaultPayload + }, }); } @@ -312,54 +449,14 @@ class ResourceList extends PureComponent { }); }; - onPageChange = (page = {}) => { - const { dispatch } = this.props; - // debugger; - dispatch({ - type: 'adminList/query', - payload: { - pageNo: page - 1, - pageSize: 10, - } - }); - } - - renderSimpleForm() { // TODO 芋艿，搜索功能未完成 - const { - form: { getFieldDecorator }, - } = this.props; - return ( -
- - - - {getFieldDecorator('name')()} - - - - - - - - - - - ); - } - render() { let that = this; - const { list, data } = this.props; - const { count, pageNo, pageSize, roleList, roleCheckedKeys, roleAssignLoading } = data; + const { dispatch, list, searchParams, pagination, data } = this.props; + const { roleList, roleCheckedKeys, roleAssignLoading } = data; const { modalVisible, modalType, initValues, - defaultExpandAllRows, modalRoleVisible, } = this.state; @@ -370,56 +467,28 @@ class ResourceList extends PureComponent { initValues, }; - const columns = [ - { - title: '用户名', - dataIndex: 'username' - }, - { - title: '昵称', - dataIndex: 'nickname', - }, - { - title: '状态', - dataIndex: 'status', - render(val) { - return {status[val]}; // TODO 芋艿，此处要改 - }, - }, - { - title: '创建时间', - dataIndex: 'createTime', - render: val => {moment(val).format('YYYY-MM-DD HH:mm')}, - }, - { - title: '操作', - width: 360, - render: (text, record) => { - const statusText = record.status === 1 ? '禁用' : '禁用'; - return ( - - this.handleModalVisible(true, 'update', record)}>编辑 - - this.handleRoleAssign(record)}>角色分配 - - this.handleStatus(record)}> - {statusText} - - - this.handleDelete(record)}> - 删除 - - - ); - }, - }, - ]; + // 列表属性 + const listProps = { + dataSource: list, + pagination, + searchParams, + dispatch + }; + + // 搜索表单属性 + const searchFormProps = { + dispatch, + }; + + // 添加 return (
-
{that.renderSimpleForm()}
+
+ +
-
+ + - + admins; + private List list; @ApiModelProperty(value = "管理员总数") - private Integer count; + private Integer total; - public List getAdmins() { - return admins; + public List getList() { + return list; } - public AdminPageVO setAdmins(List admins) { - this.admins = admins; + public AdminPageVO setList(List list) { + this.list = list; return this; } - public Integer getCount() { - return count; + public Integer getTotal() { + return total; } - public AdminPageVO setCount(Integer count) { - this.count = count; + public AdminPageVO setTotal(Integer total) { + this.total = total; return this; } diff --git a/admin/admin-service-api/src/main/java/cn/iocoder/mall/admin/api/bo/AdminPageBO.java b/admin/admin-service-api/src/main/java/cn/iocoder/mall/admin/api/bo/AdminPageBO.java index cf88ed1c9..02c855460 100644 --- a/admin/admin-service-api/src/main/java/cn/iocoder/mall/admin/api/bo/AdminPageBO.java +++ b/admin/admin-service-api/src/main/java/cn/iocoder/mall/admin/api/bo/AdminPageBO.java @@ -7,27 +7,27 @@ public class AdminPageBO { /** * 管理员数组 */ - private List admins; + private List list; /** * 总量 */ - private Integer count; + private Integer total; - public List getAdmins() { - return admins; + public List getList() { + return list; } - public AdminPageBO setAdmins(List admins) { - this.admins = admins; + public AdminPageBO setList(List list) { + this.list = list; return this; } - public Integer getCount() { - return count; + public Integer getTotal() { + return total; } - public AdminPageBO setCount(Integer count) { - this.count = count; + public AdminPageBO setTotal(Integer total) { + this.total = total; return this; } diff --git a/admin/admin-service-impl/src/main/java/cn/iocoder/mall/admin/service/AdminServiceImpl.java b/admin/admin-service-impl/src/main/java/cn/iocoder/mall/admin/service/AdminServiceImpl.java index 298646b52..d39066614 100644 --- a/admin/admin-service-impl/src/main/java/cn/iocoder/mall/admin/service/AdminServiceImpl.java +++ b/admin/admin-service-impl/src/main/java/cn/iocoder/mall/admin/service/AdminServiceImpl.java @@ -70,11 +70,11 @@ public class AdminServiceImpl implements AdminService { public CommonResult getAdminPage(AdminPageDTO adminPageDTO) { AdminPageBO adminPage = new AdminPageBO(); // 查询分页数据 - int offset = adminPageDTO.getPageNo() * adminPageDTO.getPageSize(); - adminPage.setAdmins(AdminConvert.INSTANCE.convert(adminMapper.selectListByNicknameLike(adminPageDTO.getNickname(), + int offset = (adminPageDTO.getPageNo() - 1) * adminPageDTO.getPageSize(); + adminPage.setList(AdminConvert.INSTANCE.convert(adminMapper.selectListByNicknameLike(adminPageDTO.getNickname(), offset, adminPageDTO.getPageSize()))); // 查询分页总数 - adminPage.setCount(adminMapper.selectCountByNicknameLike(adminPageDTO.getNickname())); + adminPage.setTotal(adminMapper.selectCountByNicknameLike(adminPageDTO.getNickname())); return CommonResult.success(adminPage); }