update 房屋基本信息
This commit is contained in:
@@ -12,7 +12,7 @@ import {
|
|||||||
DatePicker,
|
DatePicker,
|
||||||
Spin,
|
Spin,
|
||||||
} from 'antd'
|
} from 'antd'
|
||||||
import { cloneDeep, isEqual } from 'lodash'
|
import { cloneDeep, first, isEqual, last, sortBy } from 'lodash'
|
||||||
import { AntIcon } from 'components'
|
import { AntIcon } from 'components'
|
||||||
import getDictData from 'util/dic'
|
import getDictData from 'util/dic'
|
||||||
import moment from 'moment'
|
import moment from 'moment'
|
||||||
@@ -23,6 +23,8 @@ const layout = {
|
|||||||
wrapperCol: { flex: '1' },
|
wrapperCol: { flex: '1' },
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const checkboxKeys = ['insulationMaterial', 'wallMaterial']
|
||||||
|
|
||||||
export default class building extends Component {
|
export default class building extends Component {
|
||||||
state = {
|
state = {
|
||||||
loading: true,
|
loading: true,
|
||||||
@@ -39,6 +41,7 @@ export default class building extends Component {
|
|||||||
},
|
},
|
||||||
|
|
||||||
showMap: false,
|
showMap: false,
|
||||||
|
showKeepWarmMaterialText: false,
|
||||||
}
|
}
|
||||||
|
|
||||||
form = React.createRef()
|
form = React.createRef()
|
||||||
@@ -67,14 +70,26 @@ export default class building extends Component {
|
|||||||
*/
|
*/
|
||||||
async fillData(params) {
|
async fillData(params) {
|
||||||
this.record = cloneDeep(params.record)
|
this.record = cloneDeep(params.record)
|
||||||
|
const _state = { loading: false }
|
||||||
//#region 从后端转换成前段所需格式
|
//#region 从后端转换成前段所需格式
|
||||||
if (this.record) {
|
if (this.record) {
|
||||||
const { completedDate } = this.record.houseInfo
|
const { houseInfo } = this.record
|
||||||
this.record.houseInfo.completedDate = completedDate
|
if (houseInfo.completedDate) {
|
||||||
? moment(completedDate)
|
houseInfo.completedDate = moment(houseInfo.completedDate)
|
||||||
: completedDate
|
}
|
||||||
|
|
||||||
|
// checkbox
|
||||||
|
checkboxKeys.forEach(key => {
|
||||||
|
if (houseInfo[key]) {
|
||||||
|
houseInfo[key] = houseInfo[key].split(',')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
if (houseInfo.insulationMaterial) {
|
||||||
|
_state.showKeepWarmMaterialText = houseInfo.insulationMaterial.includes('100')
|
||||||
|
}
|
||||||
}
|
}
|
||||||
const codes = await getDictData(
|
_state.codes = await getDictData(
|
||||||
'dic_land_attribute',
|
'dic_land_attribute',
|
||||||
'dic_house_structure_type',
|
'dic_house_structure_type',
|
||||||
'dic_house_aseismic_grade',
|
'dic_house_aseismic_grade',
|
||||||
@@ -85,13 +100,11 @@ export default class building extends Component {
|
|||||||
'dic_house_building_curtain_wall',
|
'dic_house_building_curtain_wall',
|
||||||
'dic_house_elevator'
|
'dic_house_elevator'
|
||||||
)
|
)
|
||||||
this.setState({
|
|
||||||
codes,
|
|
||||||
})
|
|
||||||
//#endregion
|
//#endregion
|
||||||
this.form.current.setFieldsValue(this.record)
|
this.form.current.setFieldsValue(this.record)
|
||||||
|
|
||||||
this.setState({ loading: false })
|
this.setState(_state)
|
||||||
this.call()
|
this.call()
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -108,15 +121,47 @@ export default class building extends Component {
|
|||||||
if (valid) {
|
if (valid) {
|
||||||
const postData = form.getFieldsValue()
|
const postData = form.getFieldsValue()
|
||||||
//#region 从前段转换后端所需格式
|
//#region 从前段转换后端所需格式
|
||||||
if (postData.houseInfo.completedDate) {
|
const { houseInfo } = postData
|
||||||
postData.houseInfo.completedDate =
|
if (houseInfo.completedDate) {
|
||||||
postData.houseInfo.completedDate.format('YYYY-MM-DD')
|
houseInfo.completedDate = houseInfo.completedDate.format('YYYY-MM-DD')
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// checkbox
|
||||||
|
checkboxKeys.forEach(key => {
|
||||||
|
if (houseInfo[key]) {
|
||||||
|
houseInfo[key] = sortBy(houseInfo[key], p => +p).join(',')
|
||||||
|
}
|
||||||
|
})
|
||||||
//#endregion
|
//#endregion
|
||||||
return postData
|
return postData
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
onValuesChange(changedValues, allValues) {
|
||||||
|
const form = this.form.current
|
||||||
|
const { houseInfo } = changedValues
|
||||||
|
if (
|
||||||
|
houseInfo.hasOwnProperty('landFloorCount') ||
|
||||||
|
houseInfo.hasOwnProperty('underFloorCount')
|
||||||
|
) {
|
||||||
|
const {
|
||||||
|
houseInfo: { landFloorCount, underFloorCount },
|
||||||
|
} = allValues
|
||||||
|
form.setFieldsValue({
|
||||||
|
houseInfo: {
|
||||||
|
totalFloor: +landFloorCount + +underFloorCount,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
if (houseInfo.hasOwnProperty('insulationMaterial')) {
|
||||||
|
const value = this.checkedNone(houseInfo.insulationMaterial, 'insulationMaterial')
|
||||||
|
this.setState({
|
||||||
|
showKeepWarmMaterialText: value.includes('100'),
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
//#region 自定义方法
|
//#region 自定义方法
|
||||||
onShowMap() {
|
onShowMap() {
|
||||||
this.setState({ showMap: true }, async () => {
|
this.setState({ showMap: true }, async () => {
|
||||||
@@ -254,14 +299,38 @@ export default class building extends Component {
|
|||||||
setPosition(address, { lng, lat }) {
|
setPosition(address, { lng, lat }) {
|
||||||
this.form.current.setFieldsValue({ houseCode: { address, lng, lat } })
|
this.form.current.setFieldsValue({ houseCode: { address, lng, lat } })
|
||||||
}
|
}
|
||||||
|
|
||||||
|
checkedNone(value, key) {
|
||||||
|
const form = this.form.current
|
||||||
|
if (first(value) == 0 && value.length > 1) {
|
||||||
|
// 在'无'之后选中其他值
|
||||||
|
value.shift()
|
||||||
|
form.setFieldsValue({
|
||||||
|
houseInfo: { [key]: value },
|
||||||
|
})
|
||||||
|
} else if (last(value) == 0 && value.length > 1) {
|
||||||
|
// 在其他值之后选中'无'
|
||||||
|
value = ['0']
|
||||||
|
form.setFieldsValue({
|
||||||
|
houseInfo: { [key]: value },
|
||||||
|
})
|
||||||
|
}
|
||||||
|
return value
|
||||||
|
}
|
||||||
//#endregion
|
//#endregion
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { loading, codes, showMap } = this.state
|
const { loading, codes, showMap, showKeepWarmMaterialText } = this.state
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Spin spinning={loading} indicator={<AntIcon type="loading" />}>
|
<Spin spinning={loading} indicator={<AntIcon type="loading" />}>
|
||||||
<Form {...layout} ref={this.form}>
|
<Form
|
||||||
|
{...layout}
|
||||||
|
ref={this.form}
|
||||||
|
onValuesChange={(changedValues, allValues) =>
|
||||||
|
this.onValuesChange(changedValues, allValues)
|
||||||
|
}
|
||||||
|
>
|
||||||
<Row gutter={16}>
|
<Row gutter={16}>
|
||||||
<Col span={12}>
|
<Col span={12}>
|
||||||
<Form.Item
|
<Form.Item
|
||||||
@@ -281,102 +350,95 @@ export default class building extends Component {
|
|||||||
<Input autoComplete="off" placeholder="请输入坐落地址" />
|
<Input autoComplete="off" placeholder="请输入坐落地址" />
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
</Col>
|
</Col>
|
||||||
<Col span={24}>
|
</Row>
|
||||||
<Form.Item
|
|
||||||
label="土地性质"
|
<Form.Item
|
||||||
name={['houseInfo', 'landAttribute']}
|
label="土地性质"
|
||||||
rules={[{ required: true, message: '请选择土地性质' }]}
|
name={['houseInfo', 'landAttribute']}
|
||||||
|
rules={[{ required: true, message: '请选择土地性质' }]}
|
||||||
|
>
|
||||||
|
<Radio.Group buttonStyle="solid">
|
||||||
|
{codes.dicLandAttribute.map(item => {
|
||||||
|
return (
|
||||||
|
<Radio.Button key={item.code} value={+item.code}>
|
||||||
|
{item.value}
|
||||||
|
</Radio.Button>
|
||||||
|
)
|
||||||
|
})}
|
||||||
|
</Radio.Group>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item className="mb-none" label="地理坐标" required>
|
||||||
|
<Row gutter={16}>
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item
|
||||||
|
name={['houseCode', 'lng']}
|
||||||
|
rules={[{ required: true, message: '请在地图上选择坐标' }]}
|
||||||
|
>
|
||||||
|
<Input
|
||||||
|
autoComplete="off"
|
||||||
|
className="yo-input-prefix-2"
|
||||||
|
disabled
|
||||||
|
placeholder="请在地图上选择坐标"
|
||||||
|
prefix="经度"
|
||||||
|
/>
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item
|
||||||
|
name={['houseCode', 'lat']}
|
||||||
|
rules={[{ required: true, message: '请在地图上选择坐标' }]}
|
||||||
|
>
|
||||||
|
<Input
|
||||||
|
autoComplete="off"
|
||||||
|
className="yo-input-prefix-2"
|
||||||
|
disabled
|
||||||
|
placeholder="请在地图上选择坐标"
|
||||||
|
prefix="纬度"
|
||||||
|
/>
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item colon={false} label={true}>
|
||||||
|
{showMap ? (
|
||||||
|
<div className="yo-map-container">
|
||||||
|
<div className="yo-map--search">
|
||||||
|
<Input.Search
|
||||||
|
autoComplete="off"
|
||||||
|
allowClear
|
||||||
|
placeholder="请输入关键字"
|
||||||
|
ref="map-search"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="h-500" ref="map"></div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<Button
|
||||||
|
shape="round"
|
||||||
|
size="large"
|
||||||
|
icon={<AntIcon type="picture" />}
|
||||||
|
onClick={() => this.onShowMap()}
|
||||||
>
|
>
|
||||||
<Radio.Group buttonStyle="solid">
|
查看地图
|
||||||
{codes.dicLandAttribute.map(item => {
|
</Button>
|
||||||
return (
|
)}
|
||||||
<Radio.Button key={item.code} value={+item.code}>
|
</Form.Item>
|
||||||
{item.value}
|
<Form.Item
|
||||||
</Radio.Button>
|
label="结构类型"
|
||||||
)
|
name={['houseInfo', 'structureType']}
|
||||||
})}
|
rules={[{ required: true, message: '请选择结构类型' }]}
|
||||||
</Radio.Group>
|
>
|
||||||
</Form.Item>
|
<Radio.Group buttonStyle="solid" placeholder="请选择结构类型">
|
||||||
</Col>
|
{codes.dicHouseStructureType.map(item => {
|
||||||
<Col span={24}>
|
return (
|
||||||
<Form.Item className="mb-none" label="地理坐标" required>
|
<Radio.Button key={item.code} value={+item.code}>
|
||||||
<Row gutter={16}>
|
{item.value}
|
||||||
<Col span={12}>
|
</Radio.Button>
|
||||||
<Form.Item
|
)
|
||||||
name={['houseCode', 'lng']}
|
})}
|
||||||
rules={[
|
</Radio.Group>
|
||||||
{ required: true, message: '请在地图上选择坐标' },
|
</Form.Item>
|
||||||
]}
|
<Row gutter={16}>
|
||||||
>
|
|
||||||
<Input
|
|
||||||
autoComplete="off"
|
|
||||||
className="yo-input-prefix-2"
|
|
||||||
disabled
|
|
||||||
placeholder="请在地图上选择坐标"
|
|
||||||
prefix="经度"
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
</Col>
|
|
||||||
<Col span={12}>
|
|
||||||
<Form.Item
|
|
||||||
name={['houseCode', 'lat']}
|
|
||||||
rules={[
|
|
||||||
{ required: true, message: '请在地图上选择坐标' },
|
|
||||||
]}
|
|
||||||
>
|
|
||||||
<Input
|
|
||||||
autoComplete="off"
|
|
||||||
className="yo-input-prefix-2"
|
|
||||||
disabled
|
|
||||||
placeholder="请在地图上选择坐标"
|
|
||||||
prefix="纬度"
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
</Col>
|
|
||||||
</Row>
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item colon={false} label={true}>
|
|
||||||
{showMap ? (
|
|
||||||
<div className="yo-map-container">
|
|
||||||
<div className="yo-map--search">
|
|
||||||
<Input.Search
|
|
||||||
autoComplete="off"
|
|
||||||
allowClear
|
|
||||||
placeholder="请输入关键字"
|
|
||||||
ref="map-search"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="h-500" ref="map"></div>
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
<Button
|
|
||||||
shape="round"
|
|
||||||
size="large"
|
|
||||||
icon={<AntIcon type="picture" />}
|
|
||||||
onClick={() => this.onShowMap()}
|
|
||||||
>
|
|
||||||
查看地图
|
|
||||||
</Button>
|
|
||||||
)}
|
|
||||||
</Form.Item>
|
|
||||||
</Col>
|
|
||||||
<Col span={24}>
|
|
||||||
<Form.Item
|
|
||||||
label="结构类型"
|
|
||||||
name={['houseInfo', 'structureType']}
|
|
||||||
rules={[{ required: true, message: '请选择结构类型' }]}
|
|
||||||
>
|
|
||||||
<Radio.Group buttonStyle="solid" placeholder="请选择结构类型">
|
|
||||||
{codes.dicHouseStructureType.map(item => {
|
|
||||||
return (
|
|
||||||
<Radio.Button key={item.code} value={+item.code}>
|
|
||||||
{item.value}
|
|
||||||
</Radio.Button>
|
|
||||||
)
|
|
||||||
})}
|
|
||||||
</Radio.Group>
|
|
||||||
</Form.Item>
|
|
||||||
</Col>
|
|
||||||
<Col span={12}>
|
<Col span={12}>
|
||||||
<Form.Item
|
<Form.Item
|
||||||
label="抗震等级"
|
label="抗震等级"
|
||||||
@@ -411,87 +473,75 @@ export default class building extends Component {
|
|||||||
</Radio.Group>
|
</Radio.Group>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
</Col>
|
</Col>
|
||||||
<Col span={24}>
|
</Row>
|
||||||
<Form.Item
|
|
||||||
label="外墙保温材料"
|
<Form.Item label="外墙保温材料" name={['houseInfo', 'insulationMaterial']}>
|
||||||
name={['houseInfo', 'insulationMaterial']}
|
<Checkbox.Group>
|
||||||
>
|
{codes.dicHouseInsulationMaterial.map(item => {
|
||||||
<Checkbox.Group>
|
return (
|
||||||
{codes.dicHouseInsulationMaterial.map(item => {
|
<Checkbox key={item.code} value={item.code}>
|
||||||
return (
|
{item.value}
|
||||||
<Checkbox
|
</Checkbox>
|
||||||
key={item.code}
|
)
|
||||||
value={item.code}
|
})}
|
||||||
className="mb-xs"
|
</Checkbox.Group>
|
||||||
>
|
</Form.Item>
|
||||||
{item.value}
|
{showKeepWarmMaterialText && (
|
||||||
</Checkbox>
|
<Form.Item
|
||||||
)
|
colon={false}
|
||||||
})}
|
label=" "
|
||||||
<Input
|
name={['houseInfo', 'keepWarmMaterialText']}
|
||||||
autoComplete="off"
|
>
|
||||||
className="w-300"
|
<Input.TextArea autoSize placeholder="请输入其他外墙保温材料" />
|
||||||
placeholder="请输入其他外墙保温材料"
|
</Form.Item>
|
||||||
/>
|
)}
|
||||||
</Checkbox.Group>
|
<Form.Item label="外墙墙体材料" name={['houseInfo', 'wallMaterial']}>
|
||||||
</Form.Item>
|
<Checkbox.Group>
|
||||||
</Col>
|
{codes.dicHouseWallMaterial.map(item => {
|
||||||
<Col span={24}>
|
return (
|
||||||
<Form.Item label="外墙墙体材料" name={['houseInfo', 'wallMaterial']}>
|
<Checkbox key={item.code} value={item.code}>
|
||||||
<Checkbox.Group>
|
{item.value}
|
||||||
{codes.dicHouseWallMaterial.map(item => {
|
</Checkbox>
|
||||||
return (
|
)
|
||||||
<Checkbox
|
})}
|
||||||
key={item.code}
|
</Checkbox.Group>
|
||||||
value={item.code}
|
</Form.Item>
|
||||||
className="mb-xs"
|
<Form.Item
|
||||||
>
|
label={
|
||||||
{item.value}
|
<span>
|
||||||
</Checkbox>
|
外墙外保温材料
|
||||||
)
|
<br />
|
||||||
})}
|
防火等级
|
||||||
</Checkbox.Group>
|
</span>
|
||||||
</Form.Item>
|
}
|
||||||
</Col>
|
name={['houseInfo', 'fireproofGrade']}
|
||||||
<Col span={24}>
|
>
|
||||||
<Form.Item
|
<Radio.Group buttonStyle="solid">
|
||||||
label={
|
{codes.dicHouseFireproofGrade.map(item => {
|
||||||
<span>
|
return (
|
||||||
外墙外保温材料
|
<Radio.Button key={item.code} value={item.code}>
|
||||||
<br />
|
{item.value}
|
||||||
防火等级
|
</Radio.Button>
|
||||||
</span>
|
)
|
||||||
}
|
})}
|
||||||
name={['houseInfo', 'fireproofGrade']}
|
</Radio.Group>
|
||||||
>
|
</Form.Item>
|
||||||
<Radio.Group buttonStyle="solid">
|
<Form.Item
|
||||||
{codes.dicHouseFireproofGrade.map(item => {
|
label="建筑幕墙"
|
||||||
return (
|
name={['houseInfo', 'curtainWall']}
|
||||||
<Radio.Button key={item.code} value={item.code}>
|
rules={[{ required: true, message: '请选择建筑幕墙' }]}
|
||||||
{item.value}
|
>
|
||||||
</Radio.Button>
|
<Radio.Group buttonStyle="solid">
|
||||||
)
|
{codes.dicHouseBuildingCurtainWall.map(item => {
|
||||||
})}
|
return (
|
||||||
</Radio.Group>
|
<Radio.Button key={item.code} value={+item.code}>
|
||||||
</Form.Item>
|
{item.value}
|
||||||
</Col>
|
</Radio.Button>
|
||||||
<Col span={24}>
|
)
|
||||||
<Form.Item
|
})}
|
||||||
label="建筑幕墙"
|
</Radio.Group>
|
||||||
name={['houseInfo', 'curtainWall']}
|
</Form.Item>
|
||||||
rules={[{ required: true, message: '请选择建筑幕墙' }]}
|
<Row gutter={16}>
|
||||||
>
|
|
||||||
<Radio.Group buttonStyle="solid">
|
|
||||||
{codes.dicHouseBuildingCurtainWall.map(item => {
|
|
||||||
return (
|
|
||||||
<Radio.Button key={item.code} value={+item.code}>
|
|
||||||
{item.value}
|
|
||||||
</Radio.Button>
|
|
||||||
)
|
|
||||||
})}
|
|
||||||
</Radio.Group>
|
|
||||||
</Form.Item>
|
|
||||||
</Col>
|
|
||||||
<Col span={8}>
|
<Col span={8}>
|
||||||
<Form.Item
|
<Form.Item
|
||||||
label="有无外墙面砖"
|
label="有无外墙面砖"
|
||||||
@@ -552,112 +602,128 @@ export default class building extends Component {
|
|||||||
</Form.Item>
|
</Form.Item>
|
||||||
</Col>
|
</Col>
|
||||||
<Col span={8}>
|
<Col span={8}>
|
||||||
<Row>
|
<Form.Item label="设计使用年限" required>
|
||||||
<Col flex="1">
|
<Row align="middle">
|
||||||
<Form.Item
|
<Col flex="1">
|
||||||
label="设计使用年限"
|
<Form.Item
|
||||||
name={['houseInfo', 'usefulYear']}
|
name={['houseInfo', 'usefulYear']}
|
||||||
rules={[{ required: true, message: '请输入设计使用年限' }]}
|
rules={[
|
||||||
>
|
{ required: true, message: '请输入设计使用年限' },
|
||||||
<InputNumber
|
]}
|
||||||
min={0}
|
noStyle
|
||||||
className="w-100-p"
|
>
|
||||||
placeholder="请输入设计使用年限"
|
<InputNumber
|
||||||
/>
|
min={0}
|
||||||
</Form.Item>
|
className="w-100-p"
|
||||||
</Col>
|
placeholder="请输入设计使用年限"
|
||||||
<Col>
|
/>
|
||||||
<span className="yo-addon">年</span>
|
</Form.Item>
|
||||||
</Col>
|
</Col>
|
||||||
</Row>
|
<Col>
|
||||||
|
<span className="yo-addon">年</span>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</Form.Item>
|
||||||
</Col>
|
</Col>
|
||||||
<Col span={8}>
|
<Col span={8}>
|
||||||
<Row>
|
<Form.Item label="总建筑面积" required>
|
||||||
<Col flex="1">
|
<Row align="middle">
|
||||||
<Form.Item
|
<Col flex="1">
|
||||||
label="总建筑面积"
|
<Form.Item
|
||||||
name={['houseInfo', 'totalArea']}
|
name={['houseInfo', 'totalArea']}
|
||||||
rules={[{ required: true, message: '请输入总建筑面积' }]}
|
rules={[
|
||||||
>
|
{ required: true, message: '请输入总建筑面积' },
|
||||||
<InputNumber
|
]}
|
||||||
min={0}
|
noStyle
|
||||||
className="w-100-p"
|
>
|
||||||
placeholder="请输入总建筑面积"
|
<InputNumber
|
||||||
/>
|
min={0}
|
||||||
</Form.Item>
|
className="w-100-p"
|
||||||
</Col>
|
placeholder="请输入总建筑面积"
|
||||||
<Col>
|
/>
|
||||||
<span className="yo-addon">m²</span>
|
</Form.Item>
|
||||||
</Col>
|
</Col>
|
||||||
</Row>
|
<Col>
|
||||||
|
<span className="yo-addon">m²</span>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</Form.Item>
|
||||||
</Col>
|
</Col>
|
||||||
<Col span={8}>
|
<Col span={8}>
|
||||||
<Row>
|
<Form.Item label="总户数" required>
|
||||||
<Col flex="1">
|
<Row align="middle">
|
||||||
<Form.Item
|
<Col flex="1">
|
||||||
label="总户数"
|
<Form.Item
|
||||||
name={['houseInfo', 'houseHolds']}
|
name={['houseInfo', 'houseHolds']}
|
||||||
rules={[{ required: true, message: '请输入总户数' }]}
|
rules={[{ required: true, message: '请输入总户数' }]}
|
||||||
>
|
noStyle
|
||||||
<InputNumber
|
>
|
||||||
min={0}
|
<InputNumber
|
||||||
precision={0}
|
min={0}
|
||||||
step={1}
|
precision={0}
|
||||||
className="w-100-p"
|
step={1}
|
||||||
placeholder="请输入总户数"
|
className="w-100-p"
|
||||||
/>
|
placeholder="请输入总户数"
|
||||||
</Form.Item>
|
/>
|
||||||
</Col>
|
</Form.Item>
|
||||||
<Col>
|
</Col>
|
||||||
<span className="yo-addon">户</span>
|
<Col>
|
||||||
</Col>
|
<span className="yo-addon">户</span>
|
||||||
</Row>
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</Form.Item>
|
||||||
</Col>
|
</Col>
|
||||||
<Col span={8}>
|
<Col span={8}>
|
||||||
<Row>
|
<Form.Item label="房屋单元数" required>
|
||||||
<Col flex="1">
|
<Row align="middle">
|
||||||
<Form.Item
|
<Col flex="1">
|
||||||
label="房屋单元数"
|
<Form.Item
|
||||||
name={['houseInfo', 'units']}
|
name={['houseInfo', 'units']}
|
||||||
rules={[{ required: true, message: '请输入房屋单元数' }]}
|
rules={[
|
||||||
>
|
{ required: true, message: '请输入房屋单元数' },
|
||||||
<InputNumber
|
]}
|
||||||
min={0}
|
noStyle
|
||||||
precision={0}
|
>
|
||||||
step={1}
|
<InputNumber
|
||||||
className="w-100-p"
|
min={0}
|
||||||
placeholder="请输入房屋单元数"
|
precision={0}
|
||||||
/>
|
step={1}
|
||||||
</Form.Item>
|
className="w-100-p"
|
||||||
</Col>
|
placeholder="请输入房屋单元数"
|
||||||
<Col>
|
/>
|
||||||
<span className="yo-addon">单元</span>
|
</Form.Item>
|
||||||
</Col>
|
</Col>
|
||||||
</Row>
|
<Col>
|
||||||
|
<span className="yo-addon">单元</span>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</Form.Item>
|
||||||
</Col>
|
</Col>
|
||||||
<Col span={8}>
|
<Col span={8}>
|
||||||
<Row>
|
<Form.Item label="每层每单元户数" required>
|
||||||
<Col flex="1">
|
<Row align="middle">
|
||||||
<Form.Item
|
<Col flex="1">
|
||||||
label="每层每单元户数"
|
<Form.Item
|
||||||
name={['houseInfo', 'unitFloorHolds']}
|
name={['houseInfo', 'unitFloorHolds']}
|
||||||
rules={[
|
rules={[
|
||||||
{ required: true, message: '请输入每层每单元户数' },
|
{ required: true, message: '请输入每层每单元户数' },
|
||||||
]}
|
]}
|
||||||
>
|
noStyle
|
||||||
<InputNumber
|
>
|
||||||
min={0}
|
<InputNumber
|
||||||
precision={0}
|
min={0}
|
||||||
step={1}
|
precision={0}
|
||||||
className="w-100-p"
|
step={1}
|
||||||
placeholder="请输入每层每单元户数"
|
className="w-100-p"
|
||||||
/>
|
placeholder="请输入每层每单元户数"
|
||||||
</Form.Item>
|
/>
|
||||||
</Col>
|
</Form.Item>
|
||||||
<Col>
|
</Col>
|
||||||
<span className="yo-addon">户</span>
|
<Col>
|
||||||
</Col>
|
<span className="yo-addon">户</span>
|
||||||
</Row>
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</Form.Item>
|
||||||
</Col>
|
</Col>
|
||||||
<Col span={8}>
|
<Col span={8}>
|
||||||
<Form.Item label="建设单位" name={['houseInfo', 'buildingUnit']}>
|
<Form.Item label="建设单位" name={['houseInfo', 'buildingUnit']}>
|
||||||
@@ -696,181 +762,126 @@ export default class building extends Component {
|
|||||||
</Form.Item>
|
</Form.Item>
|
||||||
</Col>
|
</Col>
|
||||||
<Col span={24}>
|
<Col span={24}>
|
||||||
<Form.Item label="建筑层数">
|
<Form.Item label="建筑层数" className="mb-none">
|
||||||
<div className="ant-form-inline">
|
<Row>
|
||||||
<Row align="middle">
|
<Col>
|
||||||
<Col flex="1">
|
<Form.Item colon={false} label="地上" required>
|
||||||
<Form.Item
|
<Form.Item
|
||||||
colon={false}
|
|
||||||
label="地上"
|
|
||||||
name={['houseInfo', 'landFloorCount']}
|
name={['houseInfo', 'landFloorCount']}
|
||||||
className="mr-none"
|
|
||||||
rules={[
|
rules={[
|
||||||
{ required: true, message: '请输入地上层' },
|
{ required: true, message: '请输入地上层' },
|
||||||
]}
|
]}
|
||||||
|
noStyle
|
||||||
>
|
>
|
||||||
<InputNumber
|
<InputNumber
|
||||||
min={0}
|
min={0}
|
||||||
precision={0}
|
precision={0}
|
||||||
step={1}
|
step={1}
|
||||||
className="w-100-p"
|
className="w-150"
|
||||||
placeholder="请输入地上层"
|
placeholder="请输入地上层"
|
||||||
/>
|
/>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
</Col>
|
<div className="ant-form-text">层；</div>
|
||||||
<Col>
|
</Form.Item>
|
||||||
<span className="yo-addon">层</span>
|
</Col>
|
||||||
</Col>
|
<Col>
|
||||||
</Row>
|
<Form.Item colon={false} label="地下" required>
|
||||||
|
|
||||||
<Row align="middle">
|
|
||||||
<Col flex="1">
|
|
||||||
<Form.Item
|
<Form.Item
|
||||||
colon={false}
|
|
||||||
label="地下"
|
|
||||||
name={['houseInfo', 'underFloorCount']}
|
name={['houseInfo', 'underFloorCount']}
|
||||||
className="mr-none"
|
|
||||||
rules={[
|
rules={[
|
||||||
{ required: true, message: '请输入地下层' },
|
{ required: true, message: '请输入地下层' },
|
||||||
]}
|
]}
|
||||||
|
noStyle
|
||||||
>
|
>
|
||||||
<InputNumber
|
<InputNumber
|
||||||
min={0}
|
min={0}
|
||||||
precision={0}
|
precision={0}
|
||||||
step={1}
|
step={1}
|
||||||
className="w-100-p"
|
className="w-150"
|
||||||
placeholder="请输入地下层"
|
placeholder="请输入地下层"
|
||||||
/>
|
/>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
</Col>
|
<div className="ant-form-text">层；</div>
|
||||||
<Col>
|
</Form.Item>
|
||||||
<span className="yo-addon">层</span>
|
</Col>
|
||||||
</Col>
|
<Col>
|
||||||
</Row>
|
<Form.Item colon={false} label="总共">
|
||||||
|
<Form.Item name={['houseInfo', 'totalFloor']} noStyle>
|
||||||
<Row align="middle">
|
|
||||||
<Col flex="1">
|
|
||||||
<Form.Item
|
|
||||||
colon={false}
|
|
||||||
label="总共"
|
|
||||||
name={['houseInfo', 'totalFloor']}
|
|
||||||
className="mr-none"
|
|
||||||
>
|
|
||||||
<InputNumber
|
<InputNumber
|
||||||
|
disabled
|
||||||
min={0}
|
min={0}
|
||||||
precision={0}
|
precision={0}
|
||||||
step={1}
|
step={1}
|
||||||
className="w-100-p"
|
className="w-150"
|
||||||
disabled
|
|
||||||
placeholder="请输入总层数"
|
placeholder="请输入总层数"
|
||||||
/>
|
/>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
</Col>
|
<div className="ant-form-text">层</div>
|
||||||
<Col>
|
</Form.Item>
|
||||||
<span className="yo-addon">层</span>
|
</Col>
|
||||||
</Col>
|
</Row>
|
||||||
</Row>
|
|
||||||
</div>
|
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
<Form.Item label="其中">
|
<Form.Item label="其中">
|
||||||
<div className="ant-form-inline">
|
<Row align="middle">
|
||||||
<Form.Item>
|
<Col>
|
||||||
<Row align="middle">
|
<span className="yo-addon">地上第</span>
|
||||||
<Col>
|
</Col>
|
||||||
<span className="yo-addon">地上第</span>
|
<Col>
|
||||||
</Col>
|
<Form.Item name={['houseInfo', 'landBsFloorStart']} noStyle>
|
||||||
<Col flex="1">
|
<InputNumber min={0} step={1} placeholder="几" />
|
||||||
<Form.Item
|
</Form.Item>
|
||||||
className="mr-none"
|
</Col>
|
||||||
name={['houseInfo', 'landBsFloorStart']}
|
<Col>
|
||||||
>
|
<span className="yo-addon">层，至</span>
|
||||||
<InputNumber
|
</Col>
|
||||||
min={0}
|
<Col>
|
||||||
step={1}
|
<Form.Item name={['houseInfo', 'landBsFloorEnd']} noStyle>
|
||||||
placeholder="几"
|
<InputNumber min={0} step={1} placeholder="几" />
|
||||||
/>
|
</Form.Item>
|
||||||
</Form.Item>
|
</Col>
|
||||||
</Col>
|
<Col>
|
||||||
<Col>
|
<span className="yo-addon">层为商业用房；</span>
|
||||||
<span className="yo-addon">层，至</span>
|
</Col>
|
||||||
</Col>
|
<Col>
|
||||||
<Col flex="1">
|
<span className="yo-addon">地上</span>
|
||||||
<Form.Item
|
</Col>
|
||||||
className="mr-none"
|
<Col>
|
||||||
name={['houseInfo', 'landBsFloorEnd']}
|
<Form.Item
|
||||||
>
|
name={['houseInfo', 'landBikeFloorStart']}
|
||||||
<InputNumber
|
noStyle
|
||||||
min={0}
|
>
|
||||||
step={1}
|
<InputNumber min={0} step={1} placeholder="几" />
|
||||||
placeholder="几"
|
</Form.Item>
|
||||||
/>
|
</Col>
|
||||||
</Form.Item>
|
<Col>
|
||||||
</Col>
|
<span className="yo-addon">层为车棚层；</span>
|
||||||
<Col>
|
</Col>
|
||||||
<span className="yo-addon">层为商业用房</span>
|
<Col>
|
||||||
</Col>
|
<span className="yo-addon">地上第</span>
|
||||||
</Row>
|
</Col>
|
||||||
</Form.Item>
|
<Col>
|
||||||
<Form.Item>
|
<Form.Item
|
||||||
<Row align="middle">
|
name={['houseInfo', 'landResidenceFloorStart']}
|
||||||
<Col>
|
noStyle
|
||||||
<span className="yo-addon">地上</span>
|
>
|
||||||
</Col>
|
<InputNumber min={0} step={1} placeholder="几" />
|
||||||
<Col flex="1">
|
</Form.Item>
|
||||||
<Form.Item
|
</Col>
|
||||||
className="mr-none"
|
<Col>
|
||||||
name={['houseInfo', 'landBikeFloorStart']}
|
<span className="yo-addon">层，至</span>
|
||||||
>
|
</Col>
|
||||||
<InputNumber
|
<Col>
|
||||||
min={0}
|
<Form.Item
|
||||||
step={1}
|
name={['houseInfo', 'landResidenceFloorEnd']}
|
||||||
placeholder="几"
|
noStyle
|
||||||
/>
|
>
|
||||||
</Form.Item>
|
<InputNumber min={0} step={1} placeholder="几" />
|
||||||
</Col>
|
</Form.Item>
|
||||||
<Col>
|
</Col>
|
||||||
<span className="yo-addon">层为车棚层</span>
|
<Col>
|
||||||
</Col>
|
<span className="yo-addon">层为住宅</span>
|
||||||
</Row>
|
</Col>
|
||||||
</Form.Item>
|
</Row>
|
||||||
<Form.Item>
|
|
||||||
<Row align="middle">
|
|
||||||
<Col>
|
|
||||||
<span className="yo-addon">地上第</span>
|
|
||||||
</Col>
|
|
||||||
<Col flex="1">
|
|
||||||
<Form.Item
|
|
||||||
className="mr-none"
|
|
||||||
name={['houseInfo', 'landResidenceFloorStart']}
|
|
||||||
>
|
|
||||||
<InputNumber
|
|
||||||
min={0}
|
|
||||||
step={1}
|
|
||||||
placeholder="几"
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
</Col>
|
|
||||||
<Col>
|
|
||||||
<span className="yo-addon">层，至</span>
|
|
||||||
</Col>
|
|
||||||
<Col flex="1">
|
|
||||||
<Form.Item
|
|
||||||
className="mr-none"
|
|
||||||
name={['houseInfo', 'landResidenceFloorEnd']}
|
|
||||||
>
|
|
||||||
<InputNumber
|
|
||||||
min={0}
|
|
||||||
step={1}
|
|
||||||
placeholder="几"
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
</Col>
|
|
||||||
<Col>
|
|
||||||
<span className="yo-addon">层为住宅</span>
|
|
||||||
</Col>
|
|
||||||
</Row>
|
|
||||||
</Form.Item>
|
|
||||||
</div>
|
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
</Col>
|
</Col>
|
||||||
</Row>
|
</Row>
|
||||||
|
|||||||
163
web-react/src/pages/business/house/info/form/base/drawing.jsx
Normal file
163
web-react/src/pages/business/house/info/form/base/drawing.jsx
Normal file
@@ -0,0 +1,163 @@
|
|||||||
|
import React, { Component } from 'react'
|
||||||
|
import { Checkbox, Col, Form, Input, Row, Spin } from 'antd'
|
||||||
|
import { AntIcon } from 'components'
|
||||||
|
import { cloneDeep, isEqual, sortBy } from 'lodash'
|
||||||
|
import getDictData from 'util/dic'
|
||||||
|
|
||||||
|
const initialValues = {}
|
||||||
|
|
||||||
|
const layout = {
|
||||||
|
labelCol: { flex: '150px' },
|
||||||
|
wrapperCol: { flex: '1' },
|
||||||
|
}
|
||||||
|
|
||||||
|
export default class drawing extends Component {
|
||||||
|
state = {
|
||||||
|
loading: true,
|
||||||
|
codes: {
|
||||||
|
dicHouseStorageOfDrawings: [],
|
||||||
|
},
|
||||||
|
options: {},
|
||||||
|
|
||||||
|
showDrawingMaterialText: false,
|
||||||
|
}
|
||||||
|
|
||||||
|
// 表单实例
|
||||||
|
form = React.createRef()
|
||||||
|
|
||||||
|
// 初始化数据
|
||||||
|
record = {}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 阻止外部组件引发的渲染,提升性能
|
||||||
|
* 可自行添加渲染条件
|
||||||
|
* [必要]
|
||||||
|
* @param {*} props
|
||||||
|
* @param {*} state
|
||||||
|
* @returns
|
||||||
|
*/
|
||||||
|
shouldComponentUpdate(props, state) {
|
||||||
|
return !isEqual(this.state, state)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* DOM加载完成钩子,绑定数据
|
||||||
|
*/
|
||||||
|
componentDidMount() {
|
||||||
|
this.fillData({
|
||||||
|
record: this.props.record,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 加载完成,通知父级组件并传递自身
|
||||||
|
*/
|
||||||
|
call() {
|
||||||
|
const { onRef } = this.props
|
||||||
|
if (onRef) onRef(this)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 填充数据
|
||||||
|
* 可以在设置this.record之后对其作出数据结构调整
|
||||||
|
* [异步,必要]
|
||||||
|
* @param {*} params
|
||||||
|
*/
|
||||||
|
async fillData(params) {
|
||||||
|
this.record = cloneDeep(params.record)
|
||||||
|
//#region 从后端转换成前段所需格式
|
||||||
|
if (this.record) {
|
||||||
|
const { houseInfo } = this.record
|
||||||
|
// checkbox
|
||||||
|
if (houseInfo.drawingMaterial) {
|
||||||
|
houseInfo.drawingMaterial = houseInfo.drawingMaterial.split(',')
|
||||||
|
}
|
||||||
|
this.setState({ showDrawingMaterialText: houseInfo.drawingMaterial.includes('100') })
|
||||||
|
}
|
||||||
|
const codes = await getDictData('dic_house_storage_of_drawings')
|
||||||
|
this.setState({ codes })
|
||||||
|
//#endregion
|
||||||
|
this.form.current.setFieldsValue(this.record)
|
||||||
|
|
||||||
|
this.setState({ loading: false })
|
||||||
|
this.call()
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取数据
|
||||||
|
* 可以对postData进行数据结构调整
|
||||||
|
* [异步,必要]
|
||||||
|
* @returns
|
||||||
|
*/
|
||||||
|
async getData() {
|
||||||
|
const form = this.form.current
|
||||||
|
|
||||||
|
const valid = await form.validateFields()
|
||||||
|
if (valid) {
|
||||||
|
const postData = form.getFieldsValue()
|
||||||
|
//#region 从前段转换后端所需格式
|
||||||
|
const { houseInfo } = postData
|
||||||
|
// checkbox
|
||||||
|
if (houseInfo.drawingMaterial) {
|
||||||
|
houseInfo.drawingMaterial = sortBy(houseInfo.drawingMaterial, p => +p).join(',')
|
||||||
|
}
|
||||||
|
//#endregion
|
||||||
|
return postData
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//#region 自定义方法
|
||||||
|
/**
|
||||||
|
* 表单change事件处理,包括了所有字段的change
|
||||||
|
* [异步,非必要]
|
||||||
|
* @param {*} changedValues
|
||||||
|
* @param {*} allValues
|
||||||
|
*/
|
||||||
|
async onValuesChange(changedValues, allValues) {
|
||||||
|
const { houseInfo } = changedValues
|
||||||
|
if (houseInfo.hasOwnProperty('drawingMaterial')) {
|
||||||
|
this.setState({ showDrawingMaterialText: houseInfo.drawingMaterial.includes('100') })
|
||||||
|
}
|
||||||
|
}
|
||||||
|
//#endregion
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const { loading, codes, showDrawingMaterialText } = this.state
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Spin spinning={loading} indicator={<AntIcon type="loading" />}>
|
||||||
|
<Form
|
||||||
|
initialValues={initialValues}
|
||||||
|
ref={this.form}
|
||||||
|
{...layout}
|
||||||
|
onValuesChange={(changedValues, allValues) =>
|
||||||
|
this.onValuesChange(changedValues, allValues)
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<Form.Item
|
||||||
|
label="图纸资料存档处"
|
||||||
|
name={['houseInfo', 'drawingMaterial']}
|
||||||
|
rules={[{ required: true, message: '请选择图纸资料存档处' }]}
|
||||||
|
>
|
||||||
|
<Checkbox.Group>
|
||||||
|
{codes.dicHouseStorageOfDrawings.map(item => (
|
||||||
|
<Checkbox key={item.code} value={item.code}>
|
||||||
|
{item.value}
|
||||||
|
</Checkbox>
|
||||||
|
))}
|
||||||
|
</Checkbox.Group>
|
||||||
|
</Form.Item>
|
||||||
|
{showDrawingMaterialText && (
|
||||||
|
<Form.Item
|
||||||
|
colon={false}
|
||||||
|
label=" "
|
||||||
|
name={['houseInfo', 'drawingMaterialText']}
|
||||||
|
>
|
||||||
|
<Input.TextArea autoSize placeholder="请输入其他图纸资料存档处" />
|
||||||
|
</Form.Item>
|
||||||
|
)}
|
||||||
|
</Form>
|
||||||
|
</Spin>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,155 @@
|
|||||||
|
import React, { Component } from 'react'
|
||||||
|
import { Form, Radio, Spin } from 'antd'
|
||||||
|
import { AntIcon } from 'components'
|
||||||
|
import { cloneDeep, isEqual } from 'lodash'
|
||||||
|
import getDictData from 'util/dic'
|
||||||
|
|
||||||
|
const initialValues = {}
|
||||||
|
|
||||||
|
const layout = {
|
||||||
|
labelCol: { flex: '150px' },
|
||||||
|
wrapperCol: { flex: '1' },
|
||||||
|
}
|
||||||
|
|
||||||
|
export default class identification extends Component {
|
||||||
|
state = {
|
||||||
|
loading: true,
|
||||||
|
codes: {
|
||||||
|
dicHouseIdentification: [],
|
||||||
|
dicHouseGovernment: [],
|
||||||
|
dicHouseUsedStatus: [],
|
||||||
|
dicHouseGrade: [],
|
||||||
|
},
|
||||||
|
options: {},
|
||||||
|
}
|
||||||
|
|
||||||
|
// 表单实例
|
||||||
|
form = React.createRef()
|
||||||
|
|
||||||
|
// 初始化数据
|
||||||
|
record = {}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 阻止外部组件引发的渲染,提升性能
|
||||||
|
* 可自行添加渲染条件
|
||||||
|
* [必要]
|
||||||
|
* @param {*} props
|
||||||
|
* @param {*} state
|
||||||
|
* @returns
|
||||||
|
*/
|
||||||
|
shouldComponentUpdate(props, state) {
|
||||||
|
return !isEqual(this.state, state)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* DOM加载完成钩子,绑定数据
|
||||||
|
*/
|
||||||
|
componentDidMount() {
|
||||||
|
this.fillData({
|
||||||
|
record: this.props.record,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 加载完成,通知父级组件并传递自身
|
||||||
|
*/
|
||||||
|
call() {
|
||||||
|
const { onRef } = this.props
|
||||||
|
if (onRef) onRef(this)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 填充数据
|
||||||
|
* 可以在设置this.record之后对其作出数据结构调整
|
||||||
|
* [异步,必要]
|
||||||
|
* @param {*} params
|
||||||
|
*/
|
||||||
|
async fillData(params) {
|
||||||
|
this.record = cloneDeep(params.record)
|
||||||
|
//#region 从后端转换成前段所需格式
|
||||||
|
const codes = await getDictData(
|
||||||
|
'dic_house_identification',
|
||||||
|
'dic_house_government',
|
||||||
|
'dic_house_used_status',
|
||||||
|
'dic_house_grade'
|
||||||
|
)
|
||||||
|
this.setState({ codes })
|
||||||
|
//#endregion
|
||||||
|
this.form.current.setFieldsValue(this.record)
|
||||||
|
|
||||||
|
this.setState({ loading: false })
|
||||||
|
this.call()
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取数据
|
||||||
|
* 可以对postData进行数据结构调整
|
||||||
|
* [异步,必要]
|
||||||
|
* @returns
|
||||||
|
*/
|
||||||
|
async getData() {
|
||||||
|
const form = this.form.current
|
||||||
|
|
||||||
|
const valid = await form.validateFields()
|
||||||
|
if (valid) {
|
||||||
|
const postData = form.getFieldsValue()
|
||||||
|
//#region 从前段转换后端所需格式
|
||||||
|
//#endregion
|
||||||
|
return postData
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//#region 自定义方法
|
||||||
|
/**
|
||||||
|
* 表单change事件处理,包括了所有字段的change
|
||||||
|
* [异步,非必要]
|
||||||
|
* @param {*} changedValues
|
||||||
|
* @param {*} allValues
|
||||||
|
*/
|
||||||
|
async onValuesChange(changedValues, allValues) {}
|
||||||
|
//#endregion
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const { loading, codes } = this.state
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Spin spinning={loading} indicator={<AntIcon type="loading" />}>
|
||||||
|
<Form
|
||||||
|
initialValues={initialValues}
|
||||||
|
ref={this.form}
|
||||||
|
{...layout}
|
||||||
|
onValuesChange={(changedValues, allValues) =>
|
||||||
|
this.onValuesChange(changedValues, allValues)
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<Form.Item
|
||||||
|
label="房屋使用状态"
|
||||||
|
name={['houseInfo', 'houseUsedStatus']}
|
||||||
|
rules={[{ required: true, message: '请选择房屋使用状态' }]}
|
||||||
|
>
|
||||||
|
<Radio.Group buttonStyle="solid">
|
||||||
|
{codes.dicHouseUsedStatus.map(item => (
|
||||||
|
<Radio.Button key={item.code} value={+item.code}>
|
||||||
|
{item.value}
|
||||||
|
</Radio.Button>
|
||||||
|
))}
|
||||||
|
</Radio.Group>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label="综合等级"
|
||||||
|
name={['houseInfo', 'houseGrade']}
|
||||||
|
rules={[{ required: true, message: '请选择综合等级' }]}
|
||||||
|
>
|
||||||
|
<Radio.Group buttonStyle="solid">
|
||||||
|
{codes.dicHouseGrade.map(item => (
|
||||||
|
<Radio.Button key={item.code} value={+item.code}>
|
||||||
|
{item.value}
|
||||||
|
</Radio.Button>
|
||||||
|
))}
|
||||||
|
</Radio.Group>
|
||||||
|
</Form.Item>
|
||||||
|
</Form>
|
||||||
|
</Spin>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -1,7 +1,7 @@
|
|||||||
import React, { Component } from 'react'
|
import React, { Component } from 'react'
|
||||||
import ReactDOM from 'react-dom'
|
import ReactDOM from 'react-dom'
|
||||||
import { Row, Col, Card, Anchor, Spin } from 'antd'
|
import { Row, Col, Card, Anchor, Spin, Divider } from 'antd'
|
||||||
import { defaultsDeep, merge } from 'lodash'
|
import { merge } from 'lodash'
|
||||||
import { AntIcon, ComponentDynamic, Container } from 'components'
|
import { AntIcon, ComponentDynamic, Container } from 'components'
|
||||||
|
|
||||||
const parts = [
|
const parts = [
|
||||||
@@ -9,6 +9,22 @@ const parts = [
|
|||||||
title: '建筑物基本信息',
|
title: '建筑物基本信息',
|
||||||
component: () => import('./building'),
|
component: () => import('./building'),
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: '权属情况',
|
||||||
|
component: () => import('./ownership'),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '调查情况',
|
||||||
|
component: () => import('./investigation'),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '鉴定治理',
|
||||||
|
component: () => import('./identification'),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '图纸资料存档处',
|
||||||
|
component: () => import('./drawing'),
|
||||||
|
},
|
||||||
{
|
{
|
||||||
title: '相关附件资料',
|
title: '相关附件资料',
|
||||||
component: () => import('./attachments'),
|
component: () => import('./attachments'),
|
||||||
@@ -17,6 +33,10 @@ const parts = [
|
|||||||
title: '建筑概貌',
|
title: '建筑概貌',
|
||||||
component: () => import('./aspect'),
|
component: () => import('./aspect'),
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: '调查单位',
|
||||||
|
component: () => import('./unit'),
|
||||||
|
},
|
||||||
]
|
]
|
||||||
|
|
||||||
export default class index extends Component {
|
export default class index extends Component {
|
||||||
@@ -68,22 +88,25 @@ export default class index extends Component {
|
|||||||
<div className="yo-adorn--house-top" />
|
<div className="yo-adorn--house-top" />
|
||||||
<Card className="yo-form-page--body">
|
<Card className="yo-form-page--body">
|
||||||
{parts.map((part, i) => (
|
{parts.map((part, i) => (
|
||||||
<section key={i} id={`form-${i}-${id}`}>
|
<React.Fragment key={i}>
|
||||||
{part.title && <h5>{part.title}</h5>}
|
<section id={`form-${i}-${id}`}>
|
||||||
<Spin
|
{part.title && <h5>{part.title}</h5>}
|
||||||
spinning={loading}
|
<Spin
|
||||||
indicator={<AntIcon type="loading" />}
|
spinning={loading}
|
||||||
wrapperClassName={loading && 'h-400-min'}
|
indicator={<AntIcon type="loading" />}
|
||||||
>
|
wrapperClassName={loading && 'h-400-min'}
|
||||||
{!loading && (
|
>
|
||||||
<ComponentDynamic
|
{!loading && (
|
||||||
is={part.component}
|
<ComponentDynamic
|
||||||
{...this.props}
|
is={part.component}
|
||||||
onRef={child => this.call(child, i)}
|
{...this.props}
|
||||||
/>
|
onRef={child => this.call(child, i)}
|
||||||
)}
|
/>
|
||||||
</Spin>
|
)}
|
||||||
</section>
|
</Spin>
|
||||||
|
</section>
|
||||||
|
{i < parts.length - 1 && <Divider />}
|
||||||
|
</React.Fragment>
|
||||||
))}
|
))}
|
||||||
</Card>
|
</Card>
|
||||||
</Col>
|
</Col>
|
||||||
|
|||||||
@@ -0,0 +1,301 @@
|
|||||||
|
import React, { Component } from 'react'
|
||||||
|
import { Checkbox, Form, Input, Radio, Spin } from 'antd'
|
||||||
|
import { AntIcon } from 'components'
|
||||||
|
import { cloneDeep, first, isEqual, last, sortBy } from 'lodash'
|
||||||
|
import getDictData from 'util/dic'
|
||||||
|
|
||||||
|
const initialValues = {}
|
||||||
|
|
||||||
|
const layout = {
|
||||||
|
labelCol: { flex: '150px' },
|
||||||
|
wrapperCol: { flex: '1' },
|
||||||
|
}
|
||||||
|
|
||||||
|
const checkboxKeys = [
|
||||||
|
'houseSite',
|
||||||
|
'adjacentConstruction',
|
||||||
|
'chemicalErosion',
|
||||||
|
'repairAndReinforce',
|
||||||
|
'historicalCalamity',
|
||||||
|
'functionalChange',
|
||||||
|
]
|
||||||
|
|
||||||
|
export default class investigation extends Component {
|
||||||
|
state = {
|
||||||
|
loading: true,
|
||||||
|
codes: {
|
||||||
|
dicHouseHouseSite: [],
|
||||||
|
dicHouseAdjacentConstruction: [],
|
||||||
|
dicHouseChemicalErosion: [],
|
||||||
|
dicHouseStructuralDismantling: [],
|
||||||
|
dicHouseAddingLayer: [],
|
||||||
|
dicHouseRepairAndReinforce: [],
|
||||||
|
dicHouseHistoricalCalamity: [],
|
||||||
|
dicHouseFunctionalChange: [],
|
||||||
|
},
|
||||||
|
options: {},
|
||||||
|
}
|
||||||
|
|
||||||
|
// 表单实例
|
||||||
|
form = React.createRef()
|
||||||
|
|
||||||
|
// 初始化数据
|
||||||
|
record = {}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 阻止外部组件引发的渲染,提升性能
|
||||||
|
* 可自行添加渲染条件
|
||||||
|
* [必要]
|
||||||
|
* @param {*} props
|
||||||
|
* @param {*} state
|
||||||
|
* @returns
|
||||||
|
*/
|
||||||
|
shouldComponentUpdate(props, state) {
|
||||||
|
return !isEqual(this.state, state)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* DOM加载完成钩子,绑定数据
|
||||||
|
*/
|
||||||
|
componentDidMount() {
|
||||||
|
this.fillData({
|
||||||
|
record: this.props.record,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 加载完成,通知父级组件并传递自身
|
||||||
|
*/
|
||||||
|
call() {
|
||||||
|
const { onRef } = this.props
|
||||||
|
if (onRef) onRef(this)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 填充数据
|
||||||
|
* 可以在设置this.record之后对其作出数据结构调整
|
||||||
|
* [异步,必要]
|
||||||
|
* @param {*} params
|
||||||
|
*/
|
||||||
|
async fillData(params) {
|
||||||
|
this.record = cloneDeep(params.record)
|
||||||
|
//#region 从后端转换成前段所需格式
|
||||||
|
if (this.record) {
|
||||||
|
const { houseInfo } = this.record
|
||||||
|
// checkbox
|
||||||
|
checkboxKeys.forEach(key => {
|
||||||
|
if (houseInfo[key]) {
|
||||||
|
houseInfo[key] = houseInfo[key].split(',')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
const codes = await getDictData(
|
||||||
|
'dic_house_house_site',
|
||||||
|
'dic_house_adjacent_construction',
|
||||||
|
'dic_house_chemical_erosion',
|
||||||
|
'dic_house_structural_dismantling',
|
||||||
|
'dic_house_adding_layer',
|
||||||
|
'dic_house_repair_and_reinforce',
|
||||||
|
'dic_house_historical_calamity',
|
||||||
|
'dic_house_functional_change'
|
||||||
|
)
|
||||||
|
this.setState({ codes })
|
||||||
|
//#endregion
|
||||||
|
this.form.current.setFieldsValue(this.record)
|
||||||
|
|
||||||
|
this.setState({ loading: false })
|
||||||
|
this.call()
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取数据
|
||||||
|
* 可以对postData进行数据结构调整
|
||||||
|
* [异步,必要]
|
||||||
|
* @returns
|
||||||
|
*/
|
||||||
|
async getData() {
|
||||||
|
const form = this.form.current
|
||||||
|
|
||||||
|
const valid = await form.validateFields()
|
||||||
|
if (valid) {
|
||||||
|
const postData = form.getFieldsValue()
|
||||||
|
//#region 从前段转换后端所需格式
|
||||||
|
const { houseInfo } = postData
|
||||||
|
// checkbox
|
||||||
|
checkboxKeys.forEach(key => {
|
||||||
|
if (houseInfo[key]) {
|
||||||
|
houseInfo[key] = sortBy(houseInfo[key], p => +p).join(',')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
//#endregion
|
||||||
|
return postData
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//#region 自定义方法
|
||||||
|
/**
|
||||||
|
* 表单change事件处理,包括了所有字段的change
|
||||||
|
* [异步,非必要]
|
||||||
|
* @param {*} changedValues
|
||||||
|
* @param {*} allValues
|
||||||
|
*/
|
||||||
|
async onValuesChange(changedValues, allValues) {
|
||||||
|
const { houseInfo } = changedValues
|
||||||
|
const key = Object.keys(houseInfo).shift()
|
||||||
|
if (
|
||||||
|
[
|
||||||
|
'adjacentConstruction',
|
||||||
|
'chemicalErosion',
|
||||||
|
'repairAndReinforce',
|
||||||
|
'historicalCalamity',
|
||||||
|
'functionalChange',
|
||||||
|
].includes(key)
|
||||||
|
) {
|
||||||
|
this.checkedNone(houseInfo[key], key)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
checkedNone(value, key) {
|
||||||
|
const form = this.form.current
|
||||||
|
if (first(value) == 0 && value.length > 1) {
|
||||||
|
// 在'无'之后选中其他值
|
||||||
|
value.shift()
|
||||||
|
form.setFieldsValue({
|
||||||
|
houseInfo: { [key]: value },
|
||||||
|
})
|
||||||
|
} else if (last(value) == 0 && value.length > 1) {
|
||||||
|
// 在其他值之后选中'无'
|
||||||
|
value = ['0']
|
||||||
|
form.setFieldsValue({
|
||||||
|
houseInfo: { [key]: value },
|
||||||
|
})
|
||||||
|
}
|
||||||
|
return value
|
||||||
|
}
|
||||||
|
//#endregion
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const { loading, codes } = this.state
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Spin spinning={loading} indicator={<AntIcon type="loading" />}>
|
||||||
|
<Form
|
||||||
|
initialValues={initialValues}
|
||||||
|
ref={this.form}
|
||||||
|
{...layout}
|
||||||
|
onValuesChange={(changedValues, allValues) =>
|
||||||
|
this.onValuesChange(changedValues, allValues)
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<Form.Item
|
||||||
|
label="房屋场地"
|
||||||
|
name={['houseInfo', 'houseSite']}
|
||||||
|
rules={[{ required: true, message: '请选择房屋场地' }]}
|
||||||
|
>
|
||||||
|
<Checkbox.Group>
|
||||||
|
{codes.dicHouseHouseSite.map(item => (
|
||||||
|
<Checkbox key={item.code} value={item.code}>
|
||||||
|
{item.value}
|
||||||
|
</Checkbox>
|
||||||
|
))}
|
||||||
|
</Checkbox.Group>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label="相邻施工"
|
||||||
|
name={['houseInfo', 'adjacentConstruction']}
|
||||||
|
rules={[{ required: true, message: '请选择相邻施工' }]}
|
||||||
|
>
|
||||||
|
<Checkbox.Group>
|
||||||
|
{codes.dicHouseAdjacentConstruction.map(item => (
|
||||||
|
<Checkbox key={item.code} value={item.code}>
|
||||||
|
{item.value}
|
||||||
|
</Checkbox>
|
||||||
|
))}
|
||||||
|
</Checkbox.Group>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label="化学侵蚀"
|
||||||
|
name={['houseInfo', 'chemicalErosion']}
|
||||||
|
rules={[{ required: true, message: '请选择化学侵蚀' }]}
|
||||||
|
>
|
||||||
|
<Checkbox.Group>
|
||||||
|
{codes.dicHouseChemicalErosion.map(item => (
|
||||||
|
<Checkbox key={item.code} value={item.code}>
|
||||||
|
{item.value}
|
||||||
|
</Checkbox>
|
||||||
|
))}
|
||||||
|
</Checkbox.Group>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label="结构拆改"
|
||||||
|
name={['houseInfo', 'structuralDismantling']}
|
||||||
|
rules={[{ required: true, message: '请选择结构拆改' }]}
|
||||||
|
>
|
||||||
|
<Radio.Group buttonStyle="solid">
|
||||||
|
{codes.dicHouseStructuralDismantling.map(item => (
|
||||||
|
<Radio.Button key={item.code} value={+item.code}>
|
||||||
|
{item.value}
|
||||||
|
</Radio.Button>
|
||||||
|
))}
|
||||||
|
</Radio.Group>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label="加层改造"
|
||||||
|
name={['houseInfo', 'addingLayer']}
|
||||||
|
rules={[{ required: true, message: '请选择加层改造' }]}
|
||||||
|
>
|
||||||
|
<Radio.Group buttonStyle="solid">
|
||||||
|
{codes.dicHouseAddingLayer.map(item => (
|
||||||
|
<Radio.Button key={item.code} value={+item.code}>
|
||||||
|
{item.value}
|
||||||
|
</Radio.Button>
|
||||||
|
))}
|
||||||
|
</Radio.Group>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label="修缮加固"
|
||||||
|
name={['houseInfo', 'repairAndReinforce']}
|
||||||
|
rules={[{ required: true, message: '请选择修缮加固' }]}
|
||||||
|
>
|
||||||
|
<Checkbox.Group>
|
||||||
|
{codes.dicHouseRepairAndReinforce.map(item => (
|
||||||
|
<Checkbox key={item.code} value={item.code}>
|
||||||
|
{item.value}
|
||||||
|
</Checkbox>
|
||||||
|
))}
|
||||||
|
</Checkbox.Group>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label="历史灾害"
|
||||||
|
name={['houseInfo', 'historicalCalamity']}
|
||||||
|
rules={[{ required: true, message: '请选择历史灾害' }]}
|
||||||
|
>
|
||||||
|
<Checkbox.Group>
|
||||||
|
{codes.dicHouseHistoricalCalamity.map(item => (
|
||||||
|
<Checkbox key={item.code} value={item.code}>
|
||||||
|
{item.value}
|
||||||
|
</Checkbox>
|
||||||
|
))}
|
||||||
|
</Checkbox.Group>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label="使用功能变更"
|
||||||
|
name={['houseInfo', 'functionalChange']}
|
||||||
|
rules={[{ required: true, message: '请选择使用功能变更' }]}
|
||||||
|
>
|
||||||
|
<Checkbox.Group>
|
||||||
|
{codes.dicHouseFunctionalChange.map(item => (
|
||||||
|
<Checkbox key={item.code} value={item.code}>
|
||||||
|
{item.value}
|
||||||
|
</Checkbox>
|
||||||
|
))}
|
||||||
|
</Checkbox.Group>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item label="其他调查内容" name={['houseInfo', 'otherContents']}>
|
||||||
|
<Input.TextArea autoSize placeholder="请输入其他调查内容" />
|
||||||
|
</Form.Item>
|
||||||
|
</Form>
|
||||||
|
</Spin>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
253
web-react/src/pages/business/house/info/form/base/ownership.jsx
Normal file
253
web-react/src/pages/business/house/info/form/base/ownership.jsx
Normal file
@@ -0,0 +1,253 @@
|
|||||||
|
import React, { Component } from 'react'
|
||||||
|
import { Col, Form, Input, InputNumber, Radio, Row, Spin } from 'antd'
|
||||||
|
import { AntIcon } from 'components'
|
||||||
|
import { cloneDeep, isEqual } from 'lodash'
|
||||||
|
import getDictData from 'util/dic'
|
||||||
|
|
||||||
|
const initialValues = {}
|
||||||
|
|
||||||
|
const layout = {
|
||||||
|
labelCol: { flex: '150px' },
|
||||||
|
wrapperCol: { flex: '1' },
|
||||||
|
}
|
||||||
|
|
||||||
|
export default class ownership extends Component {
|
||||||
|
state = {
|
||||||
|
loading: true,
|
||||||
|
codes: {
|
||||||
|
dicHousePropertyRights: [],
|
||||||
|
},
|
||||||
|
options: {},
|
||||||
|
}
|
||||||
|
|
||||||
|
// 表单实例
|
||||||
|
form = React.createRef()
|
||||||
|
|
||||||
|
// 初始化数据
|
||||||
|
record = {}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 阻止外部组件引发的渲染,提升性能
|
||||||
|
* 可自行添加渲染条件
|
||||||
|
* [必要]
|
||||||
|
* @param {*} props
|
||||||
|
* @param {*} state
|
||||||
|
* @returns
|
||||||
|
*/
|
||||||
|
shouldComponentUpdate(props, state) {
|
||||||
|
return !isEqual(this.state, state)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* DOM加载完成钩子,绑定数据
|
||||||
|
*/
|
||||||
|
componentDidMount() {
|
||||||
|
this.fillData({
|
||||||
|
record: this.props.record,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 加载完成,通知父级组件并传递自身
|
||||||
|
*/
|
||||||
|
call() {
|
||||||
|
const { onRef } = this.props
|
||||||
|
if (onRef) onRef(this)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 填充数据
|
||||||
|
* 可以在设置this.record之后对其作出数据结构调整
|
||||||
|
* [异步,必要]
|
||||||
|
* @param {*} params
|
||||||
|
*/
|
||||||
|
async fillData(params) {
|
||||||
|
this.record = cloneDeep(params.record)
|
||||||
|
//#region 从后端转换成前段所需格式
|
||||||
|
const codes = await getDictData('dic_house_property_rights')
|
||||||
|
this.setState({ codes })
|
||||||
|
//#endregion
|
||||||
|
this.form.current.setFieldsValue(this.record)
|
||||||
|
|
||||||
|
this.setState({ loading: false })
|
||||||
|
this.call()
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取数据
|
||||||
|
* 可以对postData进行数据结构调整
|
||||||
|
* [异步,必要]
|
||||||
|
* @returns
|
||||||
|
*/
|
||||||
|
async getData() {
|
||||||
|
const form = this.form.current
|
||||||
|
|
||||||
|
const valid = await form.validateFields()
|
||||||
|
if (valid) {
|
||||||
|
const postData = form.getFieldsValue()
|
||||||
|
//#region 从前段转换后端所需格式
|
||||||
|
//#endregion
|
||||||
|
return postData
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//#region 自定义方法
|
||||||
|
/**
|
||||||
|
* 表单change事件处理,包括了所有字段的change
|
||||||
|
* [异步,非必要]
|
||||||
|
* @param {*} changedValues
|
||||||
|
* @param {*} allValues
|
||||||
|
*/
|
||||||
|
async onValuesChange(changedValues, allValues) {}
|
||||||
|
//#endregion
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const { loading, codes } = this.state
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Spin spinning={loading} indicator={<AntIcon type="loading" />}>
|
||||||
|
<Form
|
||||||
|
initialValues={initialValues}
|
||||||
|
ref={this.form}
|
||||||
|
{...layout}
|
||||||
|
onValuesChange={(changedValues, allValues) =>
|
||||||
|
this.onValuesChange(changedValues, allValues)
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<Form.Item label="产权性质" name={['houseInfo', 'propertyRights']}>
|
||||||
|
<Radio.Group buttonStyle="solid">
|
||||||
|
{codes.dicHousePropertyRights.map(item => (
|
||||||
|
<Radio.Button key={item.code} value={item.code}>
|
||||||
|
{item.value}
|
||||||
|
</Radio.Button>
|
||||||
|
))}
|
||||||
|
</Radio.Group>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item label="房屋包含的住宅总套数" className="mb-none">
|
||||||
|
<Row>
|
||||||
|
<Col>
|
||||||
|
<Form.Item colon={false} label="直管公房" required>
|
||||||
|
<Form.Item
|
||||||
|
name={['houseInfo', 'straightHouseCount']}
|
||||||
|
rules={[{ required: true, message: '请输入直管公房' }]}
|
||||||
|
noStyle
|
||||||
|
>
|
||||||
|
<InputNumber min={0} step={1} placeholder="几" />
|
||||||
|
</Form.Item>
|
||||||
|
<div className="ant-form-text">套；</div>
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col>
|
||||||
|
<Form.Item colon={false} label="单位自管公房" required>
|
||||||
|
<Form.Item
|
||||||
|
name={['houseInfo', 'selfHouseCount']}
|
||||||
|
rules={[{ required: true, message: '请输入单位自管公房' }]}
|
||||||
|
noStyle
|
||||||
|
>
|
||||||
|
<InputNumber min={0} step={1} placeholder="几" />
|
||||||
|
</Form.Item>
|
||||||
|
<div className="ant-form-text">套；</div>
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col>
|
||||||
|
<Form.Item colon={false} label="其他">
|
||||||
|
<Form.Item name={['houseInfo', 'otherCount']} noStyle>
|
||||||
|
<InputNumber min={0} step={1} placeholder="几" />
|
||||||
|
</Form.Item>
|
||||||
|
<div className="ant-form-text">套；</div>
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
<Row>
|
||||||
|
<Col>
|
||||||
|
<Form.Item colon={false} label="商品房" required>
|
||||||
|
<Form.Item
|
||||||
|
name={['houseInfo', 'businessCount']}
|
||||||
|
rules={[{ required: true, message: '请输入商品房' }]}
|
||||||
|
noStyle
|
||||||
|
>
|
||||||
|
<InputNumber min={0} step={1} placeholder="几" />
|
||||||
|
</Form.Item>
|
||||||
|
<div className="ant-form-text">套；</div>
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col>
|
||||||
|
<Form.Item colon={false} label="房改房" required>
|
||||||
|
<Form.Item
|
||||||
|
name={['houseInfo', 'changeHouseCount']}
|
||||||
|
rules={[{ required: true, message: '请输入房改房' }]}
|
||||||
|
noStyle
|
||||||
|
>
|
||||||
|
<InputNumber min={0} step={1} placeholder="几" />
|
||||||
|
</Form.Item>
|
||||||
|
<div className="ant-form-text">套；</div>
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col>
|
||||||
|
<Form.Item colon={false} label="拆迁安置房" required>
|
||||||
|
<Form.Item
|
||||||
|
name={['houseInfo', 'resettlementHouseCount']}
|
||||||
|
rules={[{ required: true, message: '请输入拆迁安置房' }]}
|
||||||
|
noStyle
|
||||||
|
>
|
||||||
|
<InputNumber min={0} step={1} placeholder="几" />
|
||||||
|
</Form.Item>
|
||||||
|
<div className="ant-form-text">套；</div>
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
<Row>
|
||||||
|
<Col>
|
||||||
|
<Form.Item colon={false} label="私房">
|
||||||
|
<Form.Item name={['houseInfo', 'privateHouseCount']} noStyle>
|
||||||
|
<InputNumber min={0} step={1} placeholder="几" />
|
||||||
|
</Form.Item>
|
||||||
|
<div className="ant-form-text">套；</div>
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col>
|
||||||
|
<Form.Item colon={false} label="总共">
|
||||||
|
<Form.Item name={['houseInfo', 'houseCount']} noStyle>
|
||||||
|
<InputNumber disabled min={0} step={1} placeholder="几" />
|
||||||
|
</Form.Item>
|
||||||
|
<div className="ant-form-text">套</div>
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item label="产权单位" name={['houseInfo', 'propertyUnit']}>
|
||||||
|
<Input autoComplete="off" placeholder="请输入产权单位" />
|
||||||
|
</Form.Item>
|
||||||
|
<Row gutter={16}>
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item label="负责人" name={['houseInfo', 'propertyUnitUser']}>
|
||||||
|
<Input autoComplete="off" placeholder="请输入负责人" />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item
|
||||||
|
label="负责人电话"
|
||||||
|
name={['houseInfo', 'propertyUnitUserTel']}
|
||||||
|
>
|
||||||
|
<Input autoComplete="off" placeholder="请输入负责人电话" />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item label="联系人" name={['houseInfo', 'propertyUnitConent']}>
|
||||||
|
<Input autoComplete="off" placeholder="请输入联系人" />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item
|
||||||
|
label="联系人电话"
|
||||||
|
name={['houseInfo', 'propertyUnitConentTel']}
|
||||||
|
>
|
||||||
|
<Input autoComplete="off" placeholder="请输入联系人电话" />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</Form>
|
||||||
|
</Spin>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
154
web-react/src/pages/business/house/info/form/base/unit.jsx
Normal file
154
web-react/src/pages/business/house/info/form/base/unit.jsx
Normal file
@@ -0,0 +1,154 @@
|
|||||||
|
import React, { Component } from 'react'
|
||||||
|
import { Col, Form, Input, Row, Spin } from 'antd'
|
||||||
|
import { AntIcon } from 'components'
|
||||||
|
import { cloneDeep, isEqual } from 'lodash'
|
||||||
|
|
||||||
|
const initialValues = {}
|
||||||
|
|
||||||
|
const layout = {
|
||||||
|
labelCol: { flex: '150px' },
|
||||||
|
wrapperCol: { flex: '1' },
|
||||||
|
}
|
||||||
|
|
||||||
|
export default class unit extends Component {
|
||||||
|
state = {
|
||||||
|
loading: true,
|
||||||
|
codes: {},
|
||||||
|
options: {},
|
||||||
|
}
|
||||||
|
|
||||||
|
// 表单实例
|
||||||
|
form = React.createRef()
|
||||||
|
|
||||||
|
// 初始化数据
|
||||||
|
record = {}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 阻止外部组件引发的渲染,提升性能
|
||||||
|
* 可自行添加渲染条件
|
||||||
|
* [必要]
|
||||||
|
* @param {*} props
|
||||||
|
* @param {*} state
|
||||||
|
* @returns
|
||||||
|
*/
|
||||||
|
shouldComponentUpdate(props, state) {
|
||||||
|
return !isEqual(this.state, state)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* DOM加载完成钩子,绑定数据
|
||||||
|
*/
|
||||||
|
componentDidMount() {
|
||||||
|
this.fillData({
|
||||||
|
record: this.props.record,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 加载完成,通知父级组件并传递自身
|
||||||
|
*/
|
||||||
|
call() {
|
||||||
|
const { onRef } = this.props
|
||||||
|
if (onRef) onRef(this)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 填充数据
|
||||||
|
* 可以在设置this.record之后对其作出数据结构调整
|
||||||
|
* [异步,必要]
|
||||||
|
* @param {*} params
|
||||||
|
*/
|
||||||
|
async fillData(params) {
|
||||||
|
this.record = cloneDeep(params.record)
|
||||||
|
//#region 从后端转换成前段所需格式
|
||||||
|
//#endregion
|
||||||
|
this.form.current.setFieldsValue(this.record)
|
||||||
|
|
||||||
|
this.setState({ loading: false })
|
||||||
|
this.call()
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取数据
|
||||||
|
* 可以对postData进行数据结构调整
|
||||||
|
* [异步,必要]
|
||||||
|
* @returns
|
||||||
|
*/
|
||||||
|
async getData() {
|
||||||
|
const form = this.form.current
|
||||||
|
|
||||||
|
const valid = await form.validateFields()
|
||||||
|
if (valid) {
|
||||||
|
const postData = form.getFieldsValue()
|
||||||
|
//#region 从前段转换后端所需格式
|
||||||
|
//#endregion
|
||||||
|
return postData
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//#region 自定义方法
|
||||||
|
/**
|
||||||
|
* 表单change事件处理,包括了所有字段的change
|
||||||
|
* [异步,非必要]
|
||||||
|
* @param {*} changedValues
|
||||||
|
* @param {*} allValues
|
||||||
|
*/
|
||||||
|
async onValuesChange(changedValues, allValues) {}
|
||||||
|
//#endregion
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const { loading } = this.state
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Spin spinning={loading} indicator={<AntIcon type="loading" />}>
|
||||||
|
<Form
|
||||||
|
initialValues={initialValues}
|
||||||
|
ref={this.form}
|
||||||
|
{...layout}
|
||||||
|
onValuesChange={(changedValues, allValues) =>
|
||||||
|
this.onValuesChange(changedValues, allValues)
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<Row gutter={16}>
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item
|
||||||
|
label="调查登记机构"
|
||||||
|
name={['houseInfo', 'investigateAgency']}
|
||||||
|
rules={[{ required: true, message: '请输入调查登记机构' }]}
|
||||||
|
>
|
||||||
|
<Input autoComplete="off" placeholder="请输入调查登记机构" />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item
|
||||||
|
label="调查人员"
|
||||||
|
name={['houseInfo', 'investigateUser']}
|
||||||
|
rules={[{ required: true, message: '请输入调查人员' }]}
|
||||||
|
>
|
||||||
|
<Input autoComplete="off" placeholder="请输入调查人员" />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item
|
||||||
|
label="审核人员"
|
||||||
|
name={['houseInfo', 'offlineAuditor']}
|
||||||
|
rules={[{ required: true, message: '请输入审核人员' }]}
|
||||||
|
>
|
||||||
|
<Input autoComplete="off" placeholder="请输入审核人员" />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item
|
||||||
|
label="主管部门"
|
||||||
|
name={['houseInfo', 'competentDepartment']}
|
||||||
|
rules={[{ required: true, message: '请输入主管部门' }]}
|
||||||
|
>
|
||||||
|
<Input autoComplete="off" placeholder="请输入主管部门" />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</Form>
|
||||||
|
</Spin>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user