update 更多查询条件

This commit is contained in:
2021-06-29 21:57:16 +08:00
parent 383f20a654
commit 6e1971f302
12 changed files with 501 additions and 52 deletions

View File

@@ -1,11 +1,24 @@
import React, { Component } from 'react'
import { Button, Card, Form, Input, message as Message, Popconfirm, Radio, Select, Tag } from 'antd'
import { AntIcon, Auth, Container, QueryTable } from 'components'
import {
Button,
Card,
Checkbox,
Col,
DatePicker,
Form,
Input,
InputNumber,
message as Message,
Row,
Tag,
} from 'antd'
import { AntIcon, Auth, Container, InputNumberRange, QueryTable } from 'components'
import { api } from 'common/api'
import auth from 'components/authorized/handler'
import { isEqual } from 'lodash'
import { first, isEqual, last } from 'lodash'
import getDictData from 'util/dic'
import { toCamelCase } from 'util/format'
import { getSearchDateRange, getSearchInfo, QueryType } from 'util/query'
/**
* 注释段[\/**\/]为必须要改
@@ -15,7 +28,7 @@ import { toCamelCase } from 'util/format'
* 配置页面所需接口函数
*/
const apiAction = {
page: api.houseTaskPage,
page: api.houseQueryPage,
}
/**
@@ -28,16 +41,21 @@ const name = '/**/'
* 统一配置权限标识
* [必要]
*/
const authName = 'houseTask'
const authName = 'houseQuery'
export default class index extends Component {
state = {
codes: {
houseType: [],
houseIndustry: [],
houseUsedStatus: [],
housePropertyRights: [],
landAttribute: [],
houseBaseInfo: [],
houseStructureType: [],
houseStorageOfDrawings: [],
houseGrade: [],
},
type: '',
showDrawingMaterialText: false,
}
// 表格实例
@@ -113,7 +131,15 @@ export default class index extends Component {
componentDidMount() {
const { onLoading, onLoadData } = this.table.current
onLoading()
getDictData('house_type', 'house_industry').then(codes => {
getDictData(
'house_used_status',
'house_property_rights',
'land_attribute',
'house_base_info',
'house_structure_type',
'house_storage_of_drawings',
'house_grade'
).then(codes => {
this.setState({ codes }, () => {
onLoadData()
})
@@ -128,9 +154,23 @@ export default class index extends Component {
* @returns
*/
loadData = async (params, query) => {
query.completedDate = getSearchDateRange(query.completedDate)
query.createdTime = getSearchDateRange(query.createdTime)
const searchInfo = getSearchInfo({
query,
queryType: {
areaCode: QueryType.Like,
completedDate: [QueryType.GreaterThanOrEqual, QueryType.LessThan],
createdTime: [QueryType.GreaterThanOrEqual, QueryType.LessThan],
totalArea: [QueryType.GreaterThanOrEqual, QueryType.LessThanOrEqual],
totalFloor: [QueryType.GreaterThanOrEqual, QueryType.LessThanOrEqual],
},
})
const { data } = await apiAction.page({
...params,
...query,
searchInfo,
})
return data
}
@@ -193,6 +233,251 @@ export default class index extends Component {
}
//#region 自定义方法
rednerMoreQuery() {
const { codes, showDrawingMaterialText } = this.state
return (
<Row gutter={16}>
<Col span={24}>
<Form.Item label="使用状态" name="houseUsedStatus">
<Checkbox.Group>
{codes.houseUsedStatus.map(item => (
<Checkbox key={item.code} value={+item.code}>
{item.value}
</Checkbox>
))}
</Checkbox.Group>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="有无幕墙" name="curtainWall">
<Checkbox.Group>
<Checkbox value="">全部</Checkbox>
<Checkbox value={0}></Checkbox>
<Checkbox value={1}></Checkbox>
</Checkbox.Group>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="有无面砖" name="faceBrick">
<Checkbox.Group>
<Checkbox value="">全部</Checkbox>
<Checkbox value={0}></Checkbox>
<Checkbox value={1}></Checkbox>
</Checkbox.Group>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="有无涂料" name="coating">
<Checkbox.Group>
<Checkbox value="">全部</Checkbox>
<Checkbox value={0}></Checkbox>
<Checkbox value={1}></Checkbox>
</Checkbox.Group>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="有无粉刷" name="painting">
<Checkbox.Group>
<Checkbox value="">全部</Checkbox>
<Checkbox value={0}></Checkbox>
<Checkbox value={1}></Checkbox>
</Checkbox.Group>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="安全管理员">
<Input autoComplete="off" placeholder="请输入安全管理员" />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="片区监管员">
<Input autoComplete="off" placeholder="请输入片区监管员" />
</Form.Item>
</Col>
<Col span={24}>
<Form.Item label="产权性质" name="propertyRights">
<Checkbox.Group>
<Checkbox value="">全部</Checkbox>
{codes.housePropertyRights.map(item => (
<Checkbox key={item.code} value={+item.code}>
{item.value}
</Checkbox>
))}
</Checkbox.Group>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="土地性质" name="landAttribute">
<Checkbox.Group>
<Checkbox value="">全部</Checkbox>
{codes.landAttribute.map(item => (
<Checkbox key={item.code} value={+item.code}>
{item.value}
</Checkbox>
))}
</Checkbox.Group>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="基础情况" name="baseInfo">
<Checkbox.Group>
<Checkbox value="">全部</Checkbox>
{codes.houseBaseInfo.map(item => (
<Checkbox key={item.code} value={+item.code}>
{item.value}
</Checkbox>
))}
</Checkbox.Group>
</Form.Item>
</Col>
<Col span={24}>
<Form.Item label="结构类型" name="structureType">
<Checkbox.Group>
<Checkbox value="">全部</Checkbox>
{codes.houseStructureType.map(item => (
<Checkbox key={item.code} value={+item.code}>
{item.value}
</Checkbox>
))}
</Checkbox.Group>
</Form.Item>
</Col>
<Col span={24}>
<Form.Item label="图纸资料存档处" name="drawingMaterial">
<Form.Item name="drawingMaterial" className="mb-none">
<Checkbox.Group>
{codes.houseStorageOfDrawings.map(item => (
<Checkbox key={item.code} value={item.code}>
{item.value}
</Checkbox>
))}
</Checkbox.Group>
</Form.Item>
{showDrawingMaterialText && (
<Form.Item name="drawingMaterialText" className="mb-none mt-xs">
<Input.TextArea autoSize placeholder="请输入其他图纸资料存档处" />
</Form.Item>
)}
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="竣工日期" name="completedDate">
<DatePicker.RangePicker
className="w-100-p"
placeholder={['请选择竣工开始日期', '请选择竣工结束日期']}
/>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="填表日期" name="createdTime">
<DatePicker.RangePicker
className="w-100-p"
placeholder={['请选择填表开始日期', '请选择填表结束日期']}
/>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="总建筑面积" name="totalArea">
<InputNumberRange
min={0}
unit="m²"
placeholder={['请输入最小总建筑面积', '请输入最大总建筑面积']}
/>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="总层数" name="totalFloor">
<InputNumberRange
min={0}
precision={0}
step={1}
unit="层"
placeholder={['请输入最小总层数', '请输入最大总层数']}
/>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="建设单位" name="buildingUnit">
<Input autoComplete="off" placeholder="请输入建设单位" />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="设计单位" name="desingerUnit">
<Input autoComplete="off" placeholder="请输入设计单位" />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="施工单位" name="constructionUnit">
<Input autoComplete="off" placeholder="请输入施工单位" />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="监理单位" name="monitorUnit">
<Input autoComplete="off" placeholder="请输入监理单位" />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="产权单位" name="propertyUnit">
<Input autoComplete="off" placeholder="请输入产权单位" />
</Form.Item>
</Col>
<Col span={24}>
<Form.Item label="综合等级" name="houseGrade">
<Checkbox.Group>
<Checkbox value="">全部</Checkbox>
{codes.houseGrade.map(item => (
<Checkbox key={item.code} value={+item.code}>
{item.value}
</Checkbox>
))}
</Checkbox.Group>
</Form.Item>
</Col>
</Row>
)
}
onQueryChange(changedValues, allValues) {
console.log(changedValues)
if (changedValues.hasOwnProperty('drawingMaterial') && changedValues.drawingMaterial) {
this.setState({
showDrawingMaterialText: changedValues.drawingMaterial.includes('100'),
})
return
}
// 全部
const { codes } = this.state
const key = first(Object.keys(changedValues))
const mapCount = {
curtainWall: 2,
faceBrick: 2,
coating: 2,
painting: 2,
propertyRights: codes.housePropertyRights.length,
landAttribute: codes.landAttribute.length,
baseInfo: codes.houseBaseInfo.length,
structureType: codes.houseStructureType.length,
houseGrade: codes.houseGrade.length,
}
if (Object.keys(mapCount).includes(key)) {
return {
[key]: this.checkedNone(changedValues[key], mapCount[key]),
}
}
}
checkedNone(value, count) {
if (first(value) == '' && value.length > 1) {
// 在'无'之后选中其他值
value.shift()
} else if ((last(value) == '' && value.length > 1) || value.length === count) {
// 在其他值之后选中'无'
value = ['']
}
return value
}
//#endregion
render() {
@@ -207,33 +492,20 @@ export default class index extends Component {
autoLoad={false}
loadData={this.loadData}
columns={this.columns}
queryInitialValues={{
houseUsedStatus: [1, 2],
curtainWall: [''],
faceBrick: [''],
coating: [''],
painting: [''],
propertyRights: [''],
landAttribute: [''],
baseInfo: [''],
structureType: [''],
houseGrade: [''],
}}
query={
<Auth auth={{ [authName]: 'page' }}>
<Form.Item label="房屋性质" name="type">
<Radio.Group buttonStyle="solid">
<Radio.Button value="">全部</Radio.Button>
{codes.houseType.map(item => (
<Radio.Button key={item.code} value={item.code}>
{item.value}
</Radio.Button>
))}
</Radio.Group>
</Form.Item>
{type == 2 && (
<Form.Item label="行业" name="industry">
<Select
allowClear
className="w-150"
placeholder="请选择行业"
>
{codes.houseIndustry.map(item => (
<Select.Option key={item.code} value={item.code}>
{item.value}
</Select.Option>
))}
</Select>
</Form.Item>
)}
<Form.Item label="地址" name="address">
<Input autoComplete="off" placeholder="请输入地址" />
</Form.Item>
@@ -243,11 +515,10 @@ export default class index extends Component {
</Auth>
}
moreQuery={
<Auth auth={{ [authName]: 'page' }}>
<Form.Item label="地址" name="addresstest">
<Input autoComplete="off" placeholder="请输入地址" />
</Form.Item>
</Auth>
<Auth auth={{ [authName]: 'page' }}>{this.rednerMoreQuery()}</Auth>
}
onQueryChange={(changedValues, allValues) =>
this.onQueryChange(changedValues, allValues)
}
operator={
<Auth auth={{ [authName]: 'add' }}>