import React, { Component } from 'react'
import {
    Button,
    Row,
    Col,
    Form,
    Input,
    InputNumber,
    Radio,
    Checkbox,
    Switch,
    DatePicker,
    Spin,
} from 'antd'
import { cloneDeep, first, isEqual, last, sortBy } from 'lodash'
import { AntIcon } from 'components'
import getDictData from 'util/dic'
import moment from 'moment'
import { CITY } from 'util/global'
import store from 'store'

const initialValues = {
    houseInfo: {
        houseUsedStatus: 1,
        landAttribute: 1,
        curtainWall: 0,
        faceBrick: 0,
        coating: 0,
        painting: 0,
        elevator: '0',
    },
}

const { getState, dispatch } = store

const layout = {
    labelCol: { flex: '150px' },
    wrapperCol: { flex: '1' },
}

const checkboxKeys = ['insulationMaterial', 'wallMaterial']

export default class building extends Component {
    state = {
        loading: true,
        codes: {
            houseUsedStatus: [],
            landAttribute: [],
            houseStructureType: [],
            houseAseismicGrade: [],
            houseBaseInfo: [],
            houseInsulationMaterial: [],
            houseWallMaterial: [],
            houseFireproofGrade: [],
            houseBuildingCurtainWall: [],
            houseElevator: [],
        },

        showMap: false,
        showKeepWarmMaterialText: false,

        theme: getState('layout').theme,
    }

    form = React.createRef()

    shouldComponentUpdate(props, state) {
        return !isEqual(this.state, state)
    }

    componentDidMount() {
        this.fillData({
            record: this.props.record,
        })
    }

    componentWillUnmount() {
        dispatch({
            type: 'PATROL_REMOVE_INIT_GRADE_BY_COMPLETED_DATE',
            id: this.props.id,
        })
    }

    call() {
        if (this.props.onRef) {
            this.props.onRef(this)
        }
    }

    /**
     * 填充数据
     * 可以在设置this.record之后对其作出数据结构调整
     * [异步,必要]
     * @param {*} params
     */
    async fillData(params) {
        this.record = cloneDeep(params.record)
        const _state = { loading: false }
        //#region 从后端转换成前段所需格式
        if (this.record) {
            const { houseInfo } = this.record
            if (houseInfo.completedDate) {
                houseInfo.completedDate = moment(houseInfo.completedDate)
                dispatch({
                    type: 'PATROL_INIT_GRADE_BY_COMPLETED_DATE',
                    date: {
                        id: this.props.id,
                        value: +houseInfo.completedDate.format('YYYY'),
                    },
                })
            }

            // checkbox
            checkboxKeys.forEach(key => {
                if (houseInfo[key]) {
                    houseInfo[key] = houseInfo[key].split(',')
                }
            })

            if (houseInfo.insulationMaterial) {
                _state.showKeepWarmMaterialText = houseInfo.insulationMaterial.includes('100')
            }
        }
        _state.codes = await getDictData(
            'house_used_status',
            'land_attribute',
            'house_structure_type',
            'house_aseismic_grade',
            'house_base_info',
            'house_insulation_material',
            'house_wall_material',
            'house_fireproof_grade',
            'house_building_curtain_wall',
            'house_elevator'
        )

        //#endregion
        this.form.current && this.form.current.setFieldsValue(this.record)

        this.setState(_state)
        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
            if (houseInfo.completedDate) {
                houseInfo.completedDate = houseInfo.completedDate.format('YYYY-MM-DD')
            }

            // checkbox
            checkboxKeys.forEach(key => {
                if (houseInfo[key]) {
                    houseInfo[key] = sortBy(houseInfo[key], p => +p).join(',')
                }
            })
            //#endregion
            return postData
        }
    }

    onValuesChange(changedValues, allValues) {
        const form = this.form.current
        const { houseInfo } = changedValues
        if (houseInfo) {
            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'),
                })
            }

            if (houseInfo.hasOwnProperty('completedDate')) {
                dispatch({
                    type: 'PATROL_INIT_GRADE_BY_COMPLETED_DATE',
                    date: {
                        id: this.props.id,
                        value: +houseInfo.completedDate.format('YYYY'),
                    },
                })
            }
        }
    }

    //#region 自定义方法
    onShowMap() {
        this.setState({ showMap: true }, async () => {
            await this.initMap()
            const { lng, lat } = this.record.houseCode
            const position = [lng, lat]
            this.setMarker(position)
            this.map.setCenter(position)
        })
    }

    initMap() {
        // eslint-disable-next-line no-undef
        const amap = AMap

        return new Promise(resolve => {
            const city = CITY

            const district = new amap.DistrictSearch({
                subdistrict: 0,
                extensions: 'all',
                level: 'city',
            })

            district.search(city, (status, result) => {
                const bounds = result.districtList[0].boundaries,
                    mask = []
                for (let i = 0; i < bounds.length; i += 1) {
                    mask.push([bounds[i]])
                }

                const geocoder = new amap.Geocoder({ city })
                geocoder.getLocation(city, (status, result) => {
                    if (status !== 'complete' || !(result.geocodes && result.geocodes.length))
                        return

                    this.citycode = result.geocodes[0].addressComponent.citycode

                    this.map = new amap.Map(this.refs.map, {
                        mask,
                        zoom: 12,
                        center: result.geocodes[0].location,
                        mapStyle: `amap://styles/${this.state.theme}`,
                    })

                    this.map.on('click', e => {
                        this.setMarker(e.lnglat, geocoder)
                    })

                    this.map.on('complete', () => {
                        this.map.setFitView()
                        this.map.setZoom(12)

                        for (const path of bounds) {
                            new amap.Polyline({
                                path,
                                strokeColor: '#ccc',
                                strokeWeight: 4,
                                map: this.map,
                            })
                        }

                        resolve()
                    })

                    const auto = new amap.AutoComplete({
                        input: this.refs['map-search'].input,
                        city,
                        citylimit: true,
                    })

                    const placeSearch = new amap.PlaceSearch({
                        city,
                        citylimit: true,
                        pageSize: 1,
                    })

                    auto.on('select', ({ poi: { name: keywords, adcode } }) => {
                        placeSearch.search(keywords, async (status, result) => {
                            const {
                                poiList: { pois },
                            } = result
                            for (const poi of pois) {
                                await this.setMarker(poi.location, geocoder)
                                this.map.setCenter(poi.location)
                            }
                        })
                    })
                })
            })
        })
    }

    setMarker(position, geocoder) {
        const set = position => {
            if (this.marker) {
                this.marker.setPosition(position)
            } else {
                this.marker = new amap.Marker({
                    map: this.map,
                    icon: '//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png',
                    position,
                    offset: new amap.Pixel(-13, -30),
                })
            }
        }

        // eslint-disable-next-line no-undef
        const amap = AMap

        return new Promise((resolve, reject) => {
            if (geocoder) {
                geocoder.getAddress(position, (status, result) => {
                    if (status === 'complete' && result.regeocode) {
                        if (result.regeocode.addressComponent.citycode !== this.citycode) {
                            // 如果选到了别的城市,则中断
                            return
                        }
                        this.setPosition(result.regeocode.formattedAddress, position)

                        set(position)
                        resolve(position)
                    } else {
                        console.error('根据经纬度查询地址失败')

                        reject()
                    }
                })
            } else {
                set(position)
                resolve(position)
            }
        })
    }

    setPosition(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

    render() {
        const { loading, codes, showMap, showKeepWarmMaterialText } = this.state

        return (
            <Spin spinning={loading} indicator={<AntIcon type="loading" />}>
                <Form
                    initialValues={initialValues}
                    {...layout}
                    ref={this.form}
                    onValuesChange={(changedValues, allValues) =>
                        this.onValuesChange(changedValues, allValues)
                    }
                >
                    <Row gutter={16}>
                        <Col span={12}>
                            <Form.Item
                                name={['houseInfo', 'buildingName']}
                                label="幢名称"
                                rules={[{ required: true, message: '请输入幢名称' }]}
                            >
                                <Input autoComplete="off" placeholder="请输入幢名称" />
                            </Form.Item>
                        </Col>
                        <Col span={12}>
                            <Form.Item
                                label="坐落地址"
                                name={['houseCode', 'address']}
                                rules={[{ required: true, message: '请输入坐落地址' }]}
                            >
                                <Input autoComplete="off" placeholder="请输入坐落地址" />
                            </Form.Item>
                        </Col>
                        <Col span={12}>
                            <Form.Item
                                label="房屋使用状态"
                                name={['houseInfo', 'houseUsedStatus']}
                                rules={[{ required: true, message: '请选择房屋使用状态' }]}
                            >
                                <Radio.Group buttonStyle="solid">
                                    {codes.houseUsedStatus.map(item => (
                                        <Radio.Button key={item.code} value={+item.code}>
                                            {item.value}
                                        </Radio.Button>
                                    ))}
                                </Radio.Group>
                            </Form.Item>
                        </Col>
                        <Col span={12}>
                            <Form.Item
                                label="土地性质"
                                name={['houseInfo', 'landAttribute']}
                                rules={[{ required: true, message: '请选择土地性质' }]}
                            >
                                <Radio.Group buttonStyle="solid">
                                    {codes.landAttribute.map(item => {
                                        return (
                                            <Radio.Button key={item.code} value={+item.code}>
                                                {item.value}
                                            </Radio.Button>
                                        )
                                    })}
                                </Radio.Group>
                            </Form.Item>
                        </Col>
                    </Row>
                    <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()}
                            >
                                查看地图
                            </Button>
                        )}
                    </Form.Item>
                    <Form.Item
                        label="结构类型"
                        name={['houseInfo', 'structureType']}
                        rules={[{ required: true, message: '请选择结构类型' }]}
                    >
                        <Radio.Group buttonStyle="solid" placeholder="请选择结构类型">
                            {codes.houseStructureType.map(item => {
                                return (
                                    <Radio.Button key={item.code} value={+item.code}>
                                        {item.value}
                                    </Radio.Button>
                                )
                            })}
                        </Radio.Group>
                    </Form.Item>
                    <Row gutter={16}>
                        <Col span={12}>
                            <Form.Item
                                label="抗震等级"
                                name={['houseInfo', 'seismicGrade']}
                                rules={[{ required: true, message: '请选择抗震等级' }]}
                            >
                                <Radio.Group buttonStyle="solid">
                                    {codes.houseAseismicGrade.map(item => {
                                        return (
                                            <Radio.Button key={item.code} value={+item.code}>
                                                {item.value}
                                            </Radio.Button>
                                        )
                                    })}
                                </Radio.Group>
                            </Form.Item>
                        </Col>
                        <Col span={12}>
                            <Form.Item
                                label="基础情况"
                                name={['houseInfo', 'baseInfo']}
                                rules={[{ required: true, message: '请选择基础情况' }]}
                            >
                                <Radio.Group buttonStyle="solid">
                                    {codes.houseBaseInfo.map(item => {
                                        return (
                                            <Radio.Button key={item.code} value={+item.code}>
                                                {item.value}
                                            </Radio.Button>
                                        )
                                    })}
                                </Radio.Group>
                            </Form.Item>
                        </Col>
                    </Row>

                    <Form.Item label="外墙保温材料" name={['houseInfo', 'insulationMaterial']}>
                        <Checkbox.Group>
                            {codes.houseInsulationMaterial.map(item => {
                                return (
                                    <Checkbox key={item.code} value={item.code}>
                                        {item.value}
                                    </Checkbox>
                                )
                            })}
                        </Checkbox.Group>
                    </Form.Item>
                    {showKeepWarmMaterialText && (
                        <Form.Item
                            colon={false}
                            label=" "
                            name={['houseInfo', 'keepWarmMaterialText']}
                        >
                            <Input.TextArea autoSize placeholder="请输入其他外墙保温材料" />
                        </Form.Item>
                    )}
                    <Form.Item label="外墙墙体材料" name={['houseInfo', 'wallMaterial']}>
                        <Checkbox.Group>
                            {codes.houseWallMaterial.map(item => {
                                return (
                                    <Checkbox key={item.code} value={item.code}>
                                        {item.value}
                                    </Checkbox>
                                )
                            })}
                        </Checkbox.Group>
                    </Form.Item>
                    <Form.Item
                        label={
                            <span>
                                外墙外保温材料
                                <br />
                                防火等级
                            </span>
                        }
                        name={['houseInfo', 'fireproofGrade']}
                    >
                        <Radio.Group buttonStyle="solid">
                            {codes.houseFireproofGrade.map(item => {
                                return (
                                    <Radio.Button key={item.code} value={item.code}>
                                        {item.value}
                                    </Radio.Button>
                                )
                            })}
                        </Radio.Group>
                    </Form.Item>
                    <Form.Item
                        label="建筑幕墙"
                        name={['houseInfo', 'curtainWall']}
                        rules={[{ required: true, message: '请选择建筑幕墙' }]}
                    >
                        <Radio.Group buttonStyle="solid">
                            {codes.houseBuildingCurtainWall.map(item => {
                                return (
                                    <Radio.Button key={item.code} value={+item.code}>
                                        {item.value}
                                    </Radio.Button>
                                )
                            })}
                        </Radio.Group>
                    </Form.Item>
                    <Row gutter={16}>
                        <Col span={8}>
                            <Form.Item
                                label="有无外墙面砖"
                                name={['houseInfo', 'faceBrick']}
                                valuePropName="checked"
                            >
                                <Switch />
                            </Form.Item>
                        </Col>
                        <Col span={8}>
                            <Form.Item
                                label="有无外墙粉刷"
                                name={['houseInfo', 'whiteWash']}
                                valuePropName="checked"
                            >
                                <Switch />
                            </Form.Item>
                        </Col>
                        <Col span={8}>
                            <Form.Item
                                label="有无外墙涂料"
                                name={['houseInfo', 'coating']}
                                valuePropName="checked"
                            >
                                <Switch />
                            </Form.Item>
                        </Col>
                        <Col span={24}>
                            <Form.Item
                                label="电梯"
                                name={['houseInfo', 'elevator']}
                                rules={[{ required: true, message: '请选择电梯' }]}
                            >
                                <Radio.Group buttonStyle="solid">
                                    {codes.houseElevator.map(item => {
                                        return (
                                            <Radio.Button key={item.code} value={item.code}>
                                                {item.value}
                                            </Radio.Button>
                                        )
                                    })}
                                </Radio.Group>
                            </Form.Item>
                        </Col>
                        <Col span={8}>
                            <Form.Item
                                label="竣工日期"
                                name={['houseInfo', 'completedDate']}
                                rules={[{ required: true, message: '请选择竣工日期' }]}
                            >
                                <DatePicker
                                    onChange={date => {
                                        /*$root.transfer.completedYear = date.format('YYYY') */
                                    }}
                                    className="w-100-p"
                                    placeholder="请选择竣工日期"
                                />
                            </Form.Item>
                        </Col>
                        <Col span={8}>
                            <Form.Item label="设计使用年限" required>
                                <Row align="middle">
                                    <Col flex="1">
                                        <Form.Item
                                            name={['houseInfo', 'usefulYear']}
                                            rules={[
                                                { required: true, message: '请输入设计使用年限' },
                                            ]}
                                            noStyle
                                        >
                                            <InputNumber
                                                min={0}
                                                className="w-100-p"
                                                placeholder="请输入设计使用年限"
                                            />
                                        </Form.Item>
                                    </Col>
                                    <Col>
                                        <span className="yo-addon">年</span>
                                    </Col>
                                </Row>
                            </Form.Item>
                        </Col>
                        <Col span={8}>
                            <Form.Item label="总建筑面积" required>
                                <Row align="middle">
                                    <Col flex="1">
                                        <Form.Item
                                            name={['houseInfo', 'totalArea']}
                                            rules={[
                                                { required: true, message: '请输入总建筑面积' },
                                            ]}
                                            noStyle
                                        >
                                            <InputNumber
                                                min={0}
                                                className="w-100-p"
                                                placeholder="请输入总建筑面积"
                                            />
                                        </Form.Item>
                                    </Col>
                                    <Col>
                                        <span className="yo-addon">m²</span>
                                    </Col>
                                </Row>
                            </Form.Item>
                        </Col>
                        <Col span={24}>
                            <Form.Item label="建筑层数" className="mb-none">
                                <Row>
                                    <Col>
                                        <Form.Item colon={false} label="地上" required>
                                            <Form.Item
                                                name={['houseInfo', 'landFloorCount']}
                                                rules={[
                                                    { required: true, message: '请输入地上层' },
                                                ]}
                                                noStyle
                                            >
                                                <InputNumber
                                                    min={0}
                                                    precision={0}
                                                    step={1}
                                                    className="w-150"
                                                    placeholder="请输入地上层"
                                                />
                                            </Form.Item>
                                            <div className="ant-form-text">层；</div>
                                        </Form.Item>
                                    </Col>
                                    <Col>
                                        <Form.Item colon={false} label="地下" required>
                                            <Form.Item
                                                name={['houseInfo', 'underFloorCount']}
                                                rules={[
                                                    { required: true, message: '请输入地下层' },
                                                ]}
                                                noStyle
                                            >
                                                <InputNumber
                                                    min={0}
                                                    precision={0}
                                                    step={1}
                                                    className="w-150"
                                                    placeholder="请输入地下层"
                                                />
                                            </Form.Item>
                                            <div className="ant-form-text">层；</div>
                                        </Form.Item>
                                    </Col>
                                    <Col>
                                        <Form.Item colon={false} label="总共">
                                            <Form.Item name={['houseInfo', 'totalFloor']} noStyle>
                                                <InputNumber
                                                    disabled
                                                    min={0}
                                                    precision={0}
                                                    step={1}
                                                    className="w-150"
                                                    placeholder="请输入总层数"
                                                />
                                            </Form.Item>
                                            <div className="ant-form-text">层</div>
                                        </Form.Item>
                                    </Col>
                                </Row>
                            </Form.Item>
                            <Form.Item label="其中">
                                <Row align="middle">
                                    <Col>
                                        <span className="yo-addon">地上第</span>
                                    </Col>
                                    <Col>
                                        <Form.Item name={['houseInfo', 'landBsFloorStart']} noStyle>
                                            <InputNumber min={0} step={1} placeholder="几" />
                                        </Form.Item>
                                    </Col>
                                    <Col>
                                        <span className="yo-addon">层，至</span>
                                    </Col>
                                    <Col>
                                        <Form.Item name={['houseInfo', 'landBsFloorEnd']} noStyle>
                                            <InputNumber min={0} step={1} placeholder="几" />
                                        </Form.Item>
                                    </Col>
                                    <Col>
                                        <span className="yo-addon">层为商业用房；</span>
                                    </Col>
                                    <Col>
                                        <span className="yo-addon">地上</span>
                                    </Col>
                                    <Col>
                                        <Form.Item
                                            name={['houseInfo', 'landBikeFloorStart']}
                                            noStyle
                                        >
                                            <InputNumber min={0} step={1} placeholder="几" />
                                        </Form.Item>
                                    </Col>
                                    <Col>
                                        <span className="yo-addon">层为车棚层；</span>
                                    </Col>
                                    <Col>
                                        <span className="yo-addon">地上第</span>
                                    </Col>
                                    <Col>
                                        <Form.Item
                                            name={['houseInfo', 'landResidenceFloorStart']}
                                            noStyle
                                        >
                                            <InputNumber min={0} step={1} placeholder="几" />
                                        </Form.Item>
                                    </Col>
                                    <Col>
                                        <span className="yo-addon">层，至</span>
                                    </Col>
                                    <Col>
                                        <Form.Item
                                            name={['houseInfo', 'landResidenceFloorEnd']}
                                            noStyle
                                        >
                                            <InputNumber min={0} step={1} placeholder="几" />
                                        </Form.Item>
                                    </Col>
                                    <Col>
                                        <span className="yo-addon">层为住宅</span>
                                    </Col>
                                </Row>
                            </Form.Item>
                        </Col>
                        <Col span={8}>
                            <Form.Item label="总户数" required>
                                <Row align="middle">
                                    <Col flex="1">
                                        <Form.Item
                                            name={['houseInfo', 'houseHolds']}
                                            rules={[{ required: true, message: '请输入总户数' }]}
                                            noStyle
                                        >
                                            <InputNumber
                                                min={0}
                                                precision={0}
                                                step={1}
                                                className="w-100-p"
                                                placeholder="请输入总户数"
                                            />
                                        </Form.Item>
                                    </Col>
                                    <Col>
                                        <span className="yo-addon">户</span>
                                    </Col>
                                </Row>
                            </Form.Item>
                        </Col>
                        <Col span={8}>
                            <Form.Item label="房屋单元数" required>
                                <Row align="middle">
                                    <Col flex="1">
                                        <Form.Item
                                            name={['houseInfo', 'units']}
                                            rules={[
                                                { required: true, message: '请输入房屋单元数' },
                                            ]}
                                            noStyle
                                        >
                                            <InputNumber
                                                min={0}
                                                precision={0}
                                                step={1}
                                                className="w-100-p"
                                                placeholder="请输入房屋单元数"
                                            />
                                        </Form.Item>
                                    </Col>
                                    <Col>
                                        <span className="yo-addon">单元</span>
                                    </Col>
                                </Row>
                            </Form.Item>
                        </Col>
                        <Col span={8}>
                            <Form.Item label="每层每单元户数" required>
                                <Row align="middle">
                                    <Col flex="1">
                                        <Form.Item
                                            name={['houseInfo', 'unitFloorHolds']}
                                            rules={[
                                                { required: true, message: '请输入每层每单元户数' },
                                            ]}
                                            noStyle
                                        >
                                            <InputNumber
                                                min={0}
                                                precision={0}
                                                step={1}
                                                className="w-100-p"
                                                placeholder="请输入每层每单元户数"
                                            />
                                        </Form.Item>
                                    </Col>
                                    <Col>
                                        <span className="yo-addon">户</span>
                                    </Col>
                                </Row>
                            </Form.Item>
                        </Col>
                        <Col span={8}>
                            <Form.Item label="建设单位" name={['houseInfo', 'buildingUnit']}>
                                <Input autoComplete="off" placeholder="请输入建设单位" />
                            </Form.Item>
                        </Col>
                        <Col span={8}>
                            <Form.Item
                                label="建设单位联系人"
                                name={['houseInfo', 'buildingUnitUser']}
                            >
                                <Input autoComplete="off" placeholder="请输入建设单位联系人" />
                            </Form.Item>
                        </Col>
                        <Col span={8}>
                            <Form.Item
                                label="建设单位联系电话"
                                name={['houseInfo', 'buildingUnitTel']}
                            >
                                <Input autoComplete="off" placeholder="请输入建设单位联系电话" />
                            </Form.Item>
                        </Col>
                        <Col span={8}>
                            <Form.Item label="设计单位" name={['houseInfo', 'desingerUnit']}>
                                <Input autoComplete="off" placeholder="请输入设计单位" />
                            </Form.Item>
                        </Col>
                        <Col span={8}>
                            <Form.Item label="施工单位" name={['houseInfo', 'constructionUnit']}>
                                <Input autoComplete="off" placeholder="请输入施工单位" />
                            </Form.Item>
                        </Col>
                        <Col span={8}>
                            <Form.Item label="监理单位" name={['houseInfo', 'monitorUnit']}>
                                <Input autoComplete="off" placeholder="请输入监理单位" />
                            </Form.Item>
                        </Col>
                    </Row>
                </Form>
            </Spin>
        )
    }
}
