diff --git a/src/index.html b/src/index.html index 374a3f3..3615ec3 100644 --- a/src/index.html +++ b/src/index.html @@ -14,6 +14,18 @@
+ diff --git a/src/mock/user.js b/src/mock/user.js index 89cb20e..8f31411 100644 --- a/src/mock/user.js +++ b/src/mock/user.js @@ -163,6 +163,13 @@ module.exports = { }) }, + [`DELETE ${apiPrefix}/users`] (req, res) { + const { ids } = req.body + database = database.filter((item) => !ids.some(_ => _ === item.id)) + res.status(204).end() + }, + + [`POST ${apiPrefix}/user`] (req, res) { const newData = req.body newData.createTime = Mock.mock('@now') diff --git a/src/models/user.js b/src/models/user.js index 9c9cdda..7221dde 100644 --- a/src/models/user.js +++ b/src/models/user.js @@ -1,7 +1,9 @@ import { create, remove, update } from '../services/user' -import { query } from '../services/users' +import * as usersService from '../services/users' import { parse } from 'qs' +const { query } = usersService + export default { namespace: 'user', @@ -11,6 +13,7 @@ export default { currentItem: {}, modalVisible: false, modalType: 'create', + selectedRowKeys: [], isMotion: localStorage.getItem('antdAdminUserIsMotion') === 'true', pagination: { showSizeChanger: true, @@ -54,9 +57,21 @@ export default { } }, - *'delete' ({ payload }, { call, put }) { + *'delete' ({ payload }, { call, put, select }) { const data = yield call(remove, { id: payload }) + const { selectedRowKeys } = yield select(_ => _.user) if (data.success) { + yield put({ type: 'updateState', payload: { selectedRowKeys: selectedRowKeys.filter(_ => _ !== payload) } }) + yield put({ type: 'query' }) + } else { + throw data + } + }, + + *'multiDelete' ({ payload }, { call, put }) { + const data = yield call(usersService.remove, payload) + if (data.success) { + yield put({ type: 'updateState', payload: { selectedRowKeys: [] } }) yield put({ type: 'query' }) } else { throw data @@ -99,6 +114,13 @@ export default { } } }, + updateState (state, { payload }) { + return { + ...state, + ...payload, + } + }, + showModal (state, action) { return { ...state, ...action.payload, modalVisible: true } }, diff --git a/src/routes/user/List.js b/src/routes/user/List.js index 6e58322..71d4da7 100644 --- a/src/routes/user/List.js +++ b/src/routes/user/List.js @@ -90,7 +90,7 @@ const List = ({ onDeleteItem, onEditItem, isMotion, location, ...tableProps }) = {...tableProps} className={classnames({ [styles.table]: true, [styles.motion]: isMotion })} bordered - scroll={{ x: 1200 }} + scroll={{ x: 1250 }} columns={columns} simple rowKey={record => record.id} diff --git a/src/routes/user/List.less b/src/routes/user/List.less index 5c4d4d4..bdc1190 100644 --- a/src/routes/user/List.less +++ b/src/routes/user/List.less @@ -17,11 +17,11 @@ .ant-table-tbody > tr > td, .ant-table-thead > tr > th { &:nth-child(1) { - width: 6%; + width: 5%; } &:nth-child(2) { - width: 8%; + width: 6%; } &:nth-child(3) { @@ -29,7 +29,7 @@ } &:nth-child(4) { - width: 6%; + width: 8%; } &:nth-child(5) { @@ -37,22 +37,26 @@ } &:nth-child(6) { - width: 8%; + width: 6%; } &:nth-child(7) { - width: 16%; + width: 8%; } &:nth-child(8) { - width: 20%; + width: 15%; } &:nth-child(9) { - width: 14%; + width: 17%; } &:nth-child(10) { + width: 13%; + } + + &:nth-child(11) { width: 8%; } } diff --git a/src/routes/user/index.js b/src/routes/user/index.js index ceced18..b2daa83 100644 --- a/src/routes/user/index.js +++ b/src/routes/user/index.js @@ -2,12 +2,13 @@ import React from 'react' import PropTypes from 'prop-types' import { routerRedux } from 'dva/router' import { connect } from 'dva' +import { Row, Col, Button, Popconfirm } from 'antd' import List from './List' import Filter from './Filter' import Modal from './Modal' const User = ({ location, dispatch, user, loading }) => { - const { list, pagination, currentItem, modalVisible, modalType, isMotion } = user + const { list, pagination, currentItem, modalVisible, modalType, isMotion, selectedRowKeys } = user const { pageSize } = pagination const modalProps = { @@ -62,6 +63,17 @@ const User = ({ location, dispatch, user, loading }) => { }, }) }, + rowSelection: { + selectedRowKeys, + onChange: (keys) => { + dispatch({ + type: 'user/updateState', + payload: { + selectedRowKeys: keys, + }, + }) + }, + }, } const filterProps = { @@ -103,9 +115,29 @@ const User = ({ location, dispatch, user, loading }) => { }, } + const handleDeleteItems = () => { + dispatch({ + type: 'user/multiDelete', + payload: { + ids: selectedRowKeys, + }, + }) + } + return (