From c694078569f07fe529340fc9ce6b6bb11946be25 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=87=AA=E5=B8=A6=E5=A4=A7=E4=BD=AC=E6=B0=94=E5=9C=BA?= <188633308@qq.com> Date: Sun, 20 Jun 2021 17:46:05 +0800 Subject: [PATCH] =?UTF-8?q?add=20=E4=BA=BA=E5=91=98=E7=AE=A1=E7=90=86?= =?UTF-8?q?=E5=92=8C=E9=80=89=E6=88=BF(=E7=BC=BA=E7=BC=96=E8=BE=91)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web-react/src/components/query-list/index.jsx | 82 ++-- .../src/components/query-table/index.jsx | 115 +++--- .../src/pages/business/house/member/form.jsx | 11 + .../src/pages/business/house/member/index.jsx | 363 ++++++++++++++++++ .../business/house/member/selector/index.jsx | 66 ++++ .../house/member/selector/selected-list.jsx | 263 +++++++++++++ .../house/member/selector/selector-list.jsx | 263 +++++++++++++ 7 files changed, 1079 insertions(+), 84 deletions(-) create mode 100644 web-react/src/pages/business/house/member/form.jsx create mode 100644 web-react/src/pages/business/house/member/index.jsx create mode 100644 web-react/src/pages/business/house/member/selector/index.jsx create mode 100644 web-react/src/pages/business/house/member/selector/selected-list.jsx create mode 100644 web-react/src/pages/business/house/member/selector/selector-list.jsx diff --git a/web-react/src/components/query-list/index.jsx b/web-react/src/components/query-list/index.jsx index 1fd5200..e623731 100644 --- a/web-react/src/components/query-list/index.jsx +++ b/web-react/src/components/query-list/index.jsx @@ -2,12 +2,13 @@ import React, { Component } from 'react' import { Button, Form, List, Pagination, Spin, Tooltip } from 'antd' import { AntIcon } from 'components' -/** - * 渲染查询栏 - * @returns - */ -function renderQueryBar() { +const propsMap = ['autoLoad', 'loadData', 'pageIndex', 'pageSize'] +/** + * 渲染查询栏 + * @returns + */ +function renderQueryBar() { const { query, moreQuery } = this.props return ( @@ -15,20 +16,23 @@ function renderQueryBar() {
this.onQuery(value)} + onFinish={value => this.onQuery(value)} initialValues={this.props.queryInitialValues} > {query} - + - - } + {moreQuery && }
@@ -36,10 +40,9 @@ function renderQueryBar() { } export default class QueryList extends Component { - state = { loading: false, - dataSource: [] + dataSource: [], } // 查询表单实例 @@ -56,7 +59,7 @@ export default class QueryList extends Component { size: 'small', showSizeChanger: true, showQuickJumper: true, - showTotal: (total) => `总共${total}条数据` + showTotal: total => `总共${total}条数据`, } // 默认选中页码 @@ -68,7 +71,8 @@ export default class QueryList extends Component { super(props) this.autoLoad = typeof this.props.autoLoad === 'boolean' ? this.props.autoLoad : true - this.loadData = typeof this.props.loadData === 'function' ? this.props.loadData : async () => { } + this.loadData = + typeof this.props.loadData === 'function' ? this.props.loadData : async () => {} if (this.props.pageIndex) { this.pageIndex = this.props.pageIndex @@ -96,13 +100,16 @@ export default class QueryList extends Component { onLoadData = async () => { this.onLoading() - const res = await this.props.loadData({ - pageIndex: this.pagination.current, - pageSize: this.pagination.pageSize - }, this.query) + const res = await this.loadData( + { + pageIndex: this.pagination.current, + pageSize: this.pagination.pageSize, + }, + this.query + ) this.setState({ - dataSource: res.rows || res.data || res.items + dataSource: res.rows || res.data || res.items, }) this.pagination.total = res.totalCount @@ -127,9 +134,9 @@ export default class QueryList extends Component { /** * 进行查询 * 返回表单字段值,加载数据,并且返回到第一页 - * @param {*} values + * @param {*} values */ - onQuery = (values) => { + onQuery = values => { this.query = values this.onReloadData(true) } @@ -152,7 +159,7 @@ export default class QueryList extends Component { if (resetPage) { this.pagination = { ...this.pagination, - current: this.pageIndex + current: this.pageIndex, } } this.onLoadData() @@ -162,30 +169,38 @@ export default class QueryList extends Component { this.pagination = { ...this.pagination, current, - pageSize + pageSize, } this.onLoadData() } render() { + const attrs = {} + Object.keys(this.props).forEach(key => { + if (!propsMap.includes(key)) { + attrs[key] = this.props[key] + } + }) const props = { dataSource: this.state.dataSource, rowKey: record => record.id || Math.random().toString(16).slice(2), - ...this.props + ...attrs, } return (
{this.props.query && renderQueryBar.call(this)}
-
- {this.props.operator} -
+
{this.props.operator}
-
@@ -193,14 +208,15 @@ export default class QueryList extends Component {
}> - { - !!this.state.dataSource && !!this.state.dataSource.length && + {!!this.state.dataSource && !!this.state.dataSource.length && ( this.onListChange(current, pageSize)} + onChange={(current, pageSize) => + this.onListChange(current, pageSize) + } /> - } + )}
diff --git a/web-react/src/components/query-table/index.jsx b/web-react/src/components/query-table/index.jsx index 31e9b69..b842720 100644 --- a/web-react/src/components/query-table/index.jsx +++ b/web-react/src/components/query-table/index.jsx @@ -2,7 +2,9 @@ import React, { Component } from 'react' import { Form, Button, Table, Tooltip } from 'antd' import { AntIcon } from 'components' -const clearChildren = (data) => { +const propsMap = ['autoLoad', 'loadData', 'pageIndex', 'pageSize'] + +const clearChildren = data => { data.forEach(p => { if (p.children) { if (p.children.length) { @@ -16,11 +18,10 @@ const clearChildren = (data) => { } /** - * 渲染查询栏 - * @returns - */ + * 渲染查询栏 + * @returns + */ function renderQueryBar() { - const { query, moreQuery, onQueryChange } = this.props return ( @@ -28,21 +29,26 @@ function renderQueryBar() {
this.onQuery(value)} + onFinish={value => this.onQuery(value)} initialValues={this.props.queryInitialValues} - onValuesChange={(changedValues, allValues) => onQueryChange && onQueryChange(changedValues, allValues)} + onValuesChange={(changedValues, allValues) => + onQueryChange && onQueryChange(changedValues, allValues) + } > {query} - + - - } + {moreQuery && }
@@ -54,14 +60,13 @@ function renderTable(props, on) { } export default class QueryTable extends Component { - state = { // 加载状态 loading: false, // 表格类型 type: '', // 数据 - dataSource: [] + dataSource: [], } // 查询表单实例 @@ -78,8 +83,8 @@ export default class QueryTable extends Component { size: 'small', showSizeChanger: true, showQuickJumper: true, - showTotal: (total) => `总共${total}条数据`, - position: ['bottomLeft'] + showTotal: total => `总共${total}条数据`, + position: ['bottomLeft'], } // 默认选中页码 @@ -97,7 +102,8 @@ export default class QueryTable extends Component { super(props) this.autoLoad = typeof this.props.autoLoad === 'boolean' ? this.props.autoLoad : true - this.loadData = typeof this.props.loadData === 'function' ? this.props.loadData : async () => { } + this.loadData = + typeof this.props.loadData === 'function' ? this.props.loadData : async () => {} if (this.props.pageIndex) { this.pageIndex = this.props.pageIndex @@ -125,22 +131,25 @@ export default class QueryTable extends Component { onLoadData = async () => { this.onLoading() - const res = await this.loadData({ - pageIndex: this.pagination.current, - pageSize: this.pagination.pageSize, - ...this.sorter - }, this.query) + const res = await this.loadData( + { + pageIndex: this.pagination.current, + pageSize: this.pagination.pageSize, + ...this.sorter, + }, + this.query + ) if (res.rows || res.data || res.items) { this.setState({ type: 'table', - dataSource: res.rows || res.data || res.items + dataSource: res.rows || res.data || res.items, }) this.pagination.total = res.totalCount } else if (res) { this.setState({ type: 'tree', - dataSource: clearChildren(res) + dataSource: clearChildren(res), }) this.pagination = false @@ -155,8 +164,8 @@ export default class QueryTable extends Component { onLoading = () => { this.setState({ loading: { - indicator: - } + indicator: , + }, }) } @@ -170,9 +179,9 @@ export default class QueryTable extends Component { /** * 进行查询 * 返回表单字段值,加载数据,并且返回到第一页 - * @param {*} values + * @param {*} values */ - onQuery = (values) => { + onQuery = values => { this.query = values this.onReloadData(true) } @@ -182,12 +191,11 @@ export default class QueryTable extends Component { * 初始化表单字段值,加载数据,并返回到第一页 */ onResetQuery = () => { - const { queryInitialValues, onQueryChange } = this.props this.form.current.resetFields() this.query = { - ...queryInitialValues + ...queryInitialValues, } const values = this.form.current.getFieldsValue() onQueryChange && onQueryChange(values, values) @@ -202,7 +210,7 @@ export default class QueryTable extends Component { if (resetPage) { this.pagination = { ...this.pagination, - current: this.pageIndex + current: this.pageIndex, } } this.onLoadData() @@ -210,14 +218,14 @@ export default class QueryTable extends Component { /** * 表格分页/筛选/排序 - * @param {*} pagination - * @param {*} filters - * @param {*} sorter + * @param {*} pagination + * @param {*} filters + * @param {*} sorter */ onTableChange = (pagination, filters, sorter) => { this.pagination = { ...pagination, - showTotal: (total) => `总共${total}条数据` + showTotal: total => `总共${total}条数据`, } this.sorter = { sortField: sorter.field, @@ -231,7 +239,7 @@ export default class QueryTable extends Component { if (!dataSource.find(item => !item.id)) { dataSource = [...dataSource, record] this.setState({ - dataSource + dataSource, }) return dataSource.length - 1 } @@ -239,11 +247,17 @@ export default class QueryTable extends Component { } render() { - const { loading, dataSource } = this.state const { query, operator, columns } = this.props + const attrs = {} + Object.keys(this.props).forEach(key => { + if (!propsMap.includes(key)) { + attrs[key] = this.props[key] + } + }) + const props = { loading, pagination: this.pagination, @@ -253,36 +267,35 @@ export default class QueryTable extends Component { size: 'middle', rowKey: record => record.id || Math.random().toString(16).slice(2), sticky: true, - ...this.props + ...attrs, } const on = { - onChange: (...args) => this.onTableChange.apply(this, args) + onChange: (...args) => this.onTableChange.apply(this, args), } return (
{query && renderQueryBar.call(this)}
-
- {operator} -
+
{operator}
-
- { - this.props.editable ? -
- {renderTable.call(this, props, on)} -
- : - renderTable.call(this, props, on) - } + {this.props.editable ? ( +
{renderTable.call(this, props, on)}
+ ) : ( + renderTable.call(this, props, on) + )}
) } diff --git a/web-react/src/pages/business/house/member/form.jsx b/web-react/src/pages/business/house/member/form.jsx new file mode 100644 index 0000000..70ee907 --- /dev/null +++ b/web-react/src/pages/business/house/member/form.jsx @@ -0,0 +1,11 @@ +import React, { Component } from 'react' + +export default class form extends Component { + render() { + return ( +
+ 1 +
+ ) + } +} diff --git a/web-react/src/pages/business/house/member/index.jsx b/web-react/src/pages/business/house/member/index.jsx new file mode 100644 index 0000000..8efab5a --- /dev/null +++ b/web-react/src/pages/business/house/member/index.jsx @@ -0,0 +1,363 @@ +import React, { Component } from 'react' +import { + Button, + Card, + Descriptions, + Divider, + Form, + Input, + List, + message as Message, + Popconfirm, + Select, + Switch, + Tag, +} from 'antd' +import { AntIcon, Auth, Container, Image, ModalForm, QueryList, QueryTreeLayout } from 'components' +import { api } from 'common/api' +import { toCamelCase } from 'util/format' +import { isEqual } from 'lodash' +import getDictData from 'util/dic' +import FormBody from './form' +import Selector from './selector' + +// 配置页面所需接口函数 +const apiAction = { + tree: api.getOrgTree, + page: api.houseMemberPage, + add: api.houseMemberAdd, + edit: api.houseMemberEdit, + delete: api.houseMemberDelete, + + changeStatus: api.houseMemberChangeStatus, + resetPwd: api.sysUserResetPwd, +} + +// 用于弹窗标题 +const name = '用户' + +export default class index extends Component { + state = { + codes: { + sex: [], + commonStatus: [], + }, + } + + // 表格实例 + list = React.createRef() + + // 新增窗口实例 + addForm = React.createRef() + // 编辑窗口实例 + editForm = React.createRef() + + // 树选中节点 + selectId = undefined + + selectorModal = React.createRef() + + /** + * 阻止外部组件引发的渲染,提升性能 + * 可自行添加渲染条件 + * [必要] + * @param {*} props + * @param {*} state + * @returns + */ + shouldComponentUpdate(props, state) { + return !isEqual(this.state, state) + } + + /** + * 加载字典数据,之后开始加载表格数据 + * 如果必须要加载字典数据,可直接对表格设置autoLoad=true + */ + componentDidMount() { + this.list.current.onLoading() + getDictData('sex', 'common_status').then(codes => { + this.setState({ codes }, () => { + this.list.current.onLoadData() + }) + }) + } + + /** + * 调用加载数据接口,可在调用前对query进行处理 + * [异步,必要] + * @param {*} params + * @param {*} query + * @returns + */ + loadData = async (params, query) => { + query = { + ...query, + sysEmpParam: { + orgId: this.selectId, + }, + } + + const { data } = await apiAction.page({ + ...params, + ...query, + }) + return data + } + + /** + * 调用树结构数据接口 + * [异步,必要] + * @returns + */ + loadTreeData = async () => { + const { data } = await apiAction.tree() + return data + } + + /** + * 树节点选中事件 + * [必要] + * @param {*} id + */ + onSelectTree(id) { + this.selectId = id + this.list.current.onReloadData() + } + + /** + * 绑定字典数据 + * @param {*} code + * @param {*} name + * @returns + */ + bindCodeValue(code, name) { + name = toCamelCase(name) + const codes = this.state.codes[name] + if (codes) { + const c = codes.find(p => p.code == code) + if (c) { + return c.value + } + } + return null + } + + /** + * 打开新增/编辑弹窗 + * @param {*} modal + * @param {*} record + */ + onOpen(modal, record) { + modal.current.open({ + orgId: this.selectId, + record, + }) + } + + /** + * 对表格上的操作进行统一处理 + * [异步] + * @param {*} action + * @param {*} successMessage + */ + async onAction(action, successMessage) { + this.list.current.onLoading() + try { + await action + Message.success(successMessage) + this.list.current.onReloadData() + } catch { + this.list.current.onLoaded() + } + } + + /** + * 删除 + * @param {*} record + */ + onDelete(record) { + this.onAction(apiAction.delete(record), '删除成功') + } + + //#region 自定义方法 + renderItem(record) { + return ( + + this.onOpen(this.editForm, record)}>编辑 + , + + this.onDelete(record)} + > + 删除 + + , + + this.onResetPassword(record)}>重置密码 + , + ]} + > + + } + /> + {record.roleCode && record.roleCode.includes('house_security_manager') && ( + + )} + + } + title={ + <> + {record.nickName || record.name} + {record.roleName && + record.roleName.split(',').map((item, i) => ( + + + {item} + + ))} + + } + description={record.account} + /> + + {record.orgName} + + {this.bindCodeValue(record.sex, 'sex')} + + {record.phone || '未设置'} + {record.email || '未设置'} + +
+ +
+ this.onSetUserStatus(record, checked)} + /> +
+ +
+ + ) + } + + onSetUserStatus(record, checked) { + this.onAction( + apiAction.changeStatus({ + id: record.id, + status: +!checked, + }), + '设置成功' + ) + } + + onResetPassword(record) { + this.onAction(apiAction.resetPwd(record), '重置成功') + } + //#endregion + + render() { + return ( + this.onSelectTree(key)} + > + + + + + + + + + + + } + operator={ + + } + renderItem={record => this.renderItem(record)} + /> + + + + this.list.current.onReloadData()} + > + + + + this.list.current.onReloadData()} + > + + + + + + + + ) + } +} diff --git a/web-react/src/pages/business/house/member/selector/index.jsx b/web-react/src/pages/business/house/member/selector/index.jsx new file mode 100644 index 0000000..de667fc --- /dev/null +++ b/web-react/src/pages/business/house/member/selector/index.jsx @@ -0,0 +1,66 @@ +import React, { Component } from 'react' +import { Tabs } from 'antd' +import SelectorList from './selector-list' +import SelectedList from './selected-list' + +export default class index extends Component { + state = { + userId: '', + } + + selectorList = React.createRef() + selectedList = React.createRef() + + /** + * mount后回调 + */ + componentDidMount() { + this.props.created && this.props.created(this) + } + + /** + * 填充数据 + * 可以在设置this.record之后对其作出数据结构调整 + * [异步,必要] + * @param {*} params + */ + async fillData(params) { + this.setState({ + userId: params.record.id, + }) + } + + //#region 自定义方法 + onReloadAll() { + if (this.selectorList.current) { + this.selectorList.current.table.current.onReloadData() + } + if (this.selectedList.current) { + this.selectedList.current.table.current.onReloadData() + } + } + //#endregion + + render() { + const { userId } = this.state + + return ( + + + this.onReloadAll()} + /> + + + this.onReloadAll()} + /> + + + ) + } +} diff --git a/web-react/src/pages/business/house/member/selector/selected-list.jsx b/web-react/src/pages/business/house/member/selector/selected-list.jsx new file mode 100644 index 0000000..979587d --- /dev/null +++ b/web-react/src/pages/business/house/member/selector/selected-list.jsx @@ -0,0 +1,263 @@ +import React, { Component } from 'react' +import { Button, Card, Form, Input, InputNumber, message as Message, Radio, Select } from 'antd' +import { AntIcon, Auth, Container, QueryTable } from 'components' +import { api } from 'common/api' +import { isEqual } from 'lodash' +import getDictData from 'util/dic' +import { toCamelCase } from 'util/format' +import { getSearchInfo } from 'util/query' + +/** + * 注释段[\/**\/]为必须要改 + */ + +/** + * 配置页面所需接口函数 + */ +const apiAction = { + page: api.houseSelectedPage, +} + +/** + * 统一配置权限标识 + * [必要] + */ +const authName = 'houseSelector' + +export default class index extends Component { + state = { + codes: { + dicHouseType: [], + dicHouseIndustry: [], + }, + + saving: false, + + type: '', + + selectedRowKeys: [], + } + + // 表格实例 + table = React.createRef() + + columns = [ + { + title: '房屋编码', + dataIndex: 'houseCode', + sorter: true, + width: 300, + render: (text, record) => + `${record.areaName}-${record.roadName}-${record.commName}-${record.note}-${record.no + .toString() + .padStart(3, '0')}`, + }, + { + title: '房屋性质及行业', + dataIndex: 'type', + sorter: true, + width: 150, + render: text => this.bindCodeValue(text, 'dic_house_type'), + }, + { + title: '地址', + dataIndex: 'address', + sorter: true, + }, + { + title: '登记时间', + dataIndex: 'createdTime', + sorter: true, + width: 150, + }, + ] + + /** + * 阻止外部组件引发的渲染,提升性能 + * 可自行添加渲染条件 + * [必要] + * @param {*} props + * @param {*} state + * @returns + */ + shouldComponentUpdate(props, state) { + return !isEqual(this.state, state) + } + + /** + * 加载字典数据,之后开始加载表格数据 + * 如果必须要加载字典数据,可直接对表格设置autoLoad=true + */ + componentDidMount() { + const { onLoading, onLoadData } = this.table.current + onLoading() + getDictData('dic_house_type', 'dic_house_industry').then(codes => { + this.setState({ codes }, () => { + onLoadData() + }) + }) + } + + /** + * 调用加载数据接口,可在调用前对query进行处理 + * [异步,必要] + * @param {*} params + * @param {*} query + * @returns + */ + loadData = async (params, query) => { + const searchInfo = getSearchInfo({ + query, + queryType: { type: '=' }, + }) + + const { data } = await apiAction.page({ + ...params, + searchInfo, + userId: this.props.userId, + }) + return data + } + + /** + * 绑定字典数据 + * @param {*} code + * @param {*} name + * @returns + */ + bindCodeValue(code, name) { + name = toCamelCase(name) + const codes = this.state.codes[name] + if (codes) { + const c = codes.find(p => p.code === code) + if (c) { + return c.value + } + } + return null + } + + /** + * 对表格上的操作进行统一处理 + * [异步] + * @param {*} action + * @param {*} successMessage + */ + async onAction(action, successMessage) { + const { onLoading, onLoaded, onReloadData } = this.table.current + onLoading() + try { + if (action) { + await action + } + if (successMessage) { + Message.success(successMessage) + } + onReloadData() + } catch { + onLoaded() + } + } + + //#region 自定义方法 + async onHouseSelectRevoke() { + const { selectedRowKeys } = this.state + const { userId, onReloadAll } = this.props + this.setState({ saving: true }) + await this.onAction( + api.houseSelectRevoke({ + ids: selectedRowKeys, + userId, + }), + '撤销成功' + ) + this.setState({ + saving: false, + selectedRowKeys: [], + }) + if (onReloadAll) { + onReloadAll() + } + } + //#endregion + + render() { + const { codes, saving, type, selectedRowKeys } = this.state + + return ( + + this.setState({ selectedRowKeys }), + }} + queryInitialValues={{ + type: '', + }} + onQueryChange={values => { + if (values.hasOwnProperty('type')) { + this.setState({ type: values.type }) + } + }} + query={ + + + value && value.padStart(3, '0')} + max={999} + min={1} + precision={0} + step={1} + placeholder="请输入房屋序号" + /> + + + + 全部 + {codes.dicHouseType.map(item => ( + + {item.value} + + ))} + + + {type == 2 && ( + + + + )} + + + + + + + + } + operator={ + + + + } + /> + + ) + } +} diff --git a/web-react/src/pages/business/house/member/selector/selector-list.jsx b/web-react/src/pages/business/house/member/selector/selector-list.jsx new file mode 100644 index 0000000..6f5c222 --- /dev/null +++ b/web-react/src/pages/business/house/member/selector/selector-list.jsx @@ -0,0 +1,263 @@ +import React, { Component } from 'react' +import { Button, Card, Form, Input, InputNumber, message as Message, Radio, Select } from 'antd' +import { AntIcon, Auth, Container, QueryTable } from 'components' +import { api } from 'common/api' +import { isEqual } from 'lodash' +import getDictData from 'util/dic' +import { toCamelCase } from 'util/format' +import { getSearchInfo } from 'util/query' + +/** + * 注释段[\/**\/]为必须要改 + */ + +/** + * 配置页面所需接口函数 + */ +const apiAction = { + page: api.houseSelectorPage, +} + +/** + * 统一配置权限标识 + * [必要] + */ +const authName = 'houseSelector' + +export default class index extends Component { + state = { + codes: { + dicHouseType: [], + dicHouseIndustry: [], + }, + + saving: false, + + type: '', + + selectedRowKeys: [], + } + + // 表格实例 + table = React.createRef() + + columns = [ + { + title: '房屋编码', + dataIndex: 'houseCode', + sorter: true, + width: 300, + render: (text, record) => + `${record.areaName}-${record.roadName}-${record.commName}-${record.note}-${record.no + .toString() + .padStart(3, '0')}`, + }, + { + title: '房屋性质及行业', + dataIndex: 'type', + sorter: true, + width: 150, + render: text => this.bindCodeValue(text, 'dic_house_type'), + }, + { + title: '地址', + dataIndex: 'address', + sorter: true, + }, + { + title: '登记时间', + dataIndex: 'createdTime', + sorter: true, + width: 150, + }, + ] + + /** + * 阻止外部组件引发的渲染,提升性能 + * 可自行添加渲染条件 + * [必要] + * @param {*} props + * @param {*} state + * @returns + */ + shouldComponentUpdate(props, state) { + return !isEqual(this.state, state) + } + + /** + * 加载字典数据,之后开始加载表格数据 + * 如果必须要加载字典数据,可直接对表格设置autoLoad=true + */ + componentDidMount() { + const { onLoading, onLoadData } = this.table.current + onLoading() + getDictData('dic_house_type', 'dic_house_industry').then(codes => { + this.setState({ codes }, () => { + onLoadData() + }) + }) + } + + /** + * 调用加载数据接口,可在调用前对query进行处理 + * [异步,必要] + * @param {*} params + * @param {*} query + * @returns + */ + loadData = async (params, query) => { + const searchInfo = getSearchInfo({ + query, + queryType: { type: '=' }, + }) + + const { data } = await apiAction.page({ + ...params, + searchInfo, + userId: this.props.userId, + }) + return data + } + + /** + * 绑定字典数据 + * @param {*} code + * @param {*} name + * @returns + */ + bindCodeValue(code, name) { + name = toCamelCase(name) + const codes = this.state.codes[name] + if (codes) { + const c = codes.find(p => p.code === code) + if (c) { + return c.value + } + } + return null + } + + /** + * 对表格上的操作进行统一处理 + * [异步] + * @param {*} action + * @param {*} successMessage + */ + async onAction(action, successMessage) { + const { onLoading, onLoaded, onReloadData } = this.table.current + onLoading() + try { + if (action) { + await action + } + if (successMessage) { + Message.success(successMessage) + } + onReloadData() + } catch { + onLoaded() + } + } + + //#region 自定义方法 + async onHouseSelect() { + const { selectedRowKeys } = this.state + const { userId, onReloadAll } = this.props + this.setState({ saving: true }) + await this.onAction( + api.houseSelect({ + ids: selectedRowKeys, + userId, + }), + '选房成功' + ) + this.setState({ + saving: false, + selectedRowKeys: [], + }) + if (onReloadAll) { + onReloadAll() + } + } + //#endregion + + render() { + const { codes, saving, type, selectedRowKeys } = this.state + + return ( + + this.setState({ selectedRowKeys }), + }} + queryInitialValues={{ + type: '', + }} + onQueryChange={values => { + if (values.hasOwnProperty('type')) { + this.setState({ type: values.type }) + } + }} + query={ + + + value && value.padStart(3, '0')} + max={999} + min={1} + precision={0} + step={1} + placeholder="请输入房屋序号" + /> + + + + 全部 + {codes.dicHouseType.map(item => ( + + {item.value} + + ))} + + + {type == 2 && ( + + + + )} + + + + + + + + } + operator={ + + + + } + /> + + ) + } +}