This commit is contained in:
2021-06-02 16:41:56 +08:00
5 changed files with 369 additions and 269 deletions

View File

@@ -392,7 +392,6 @@ export default {
// 挂载map到this,但不监听 // 挂载map到this,但不监听
this.map = new AMap.Map(this.$refs.map, { this.map = new AMap.Map(this.$refs.map, {
city, city,
viewMode: '3D',
mask, mask,
zoom: 12, zoom: 12,
}); });

View File

@@ -16,18 +16,18 @@
<a-icon slot="indicator" spin type="loading" /> <a-icon slot="indicator" spin type="loading" />
<a-row :gutter="16" type="flex"> <a-row :gutter="16" type="flex">
<a-col :span="12"> <a-col :span="12">
<a-form-model-item class="ant-row-flex" label="幢名称" prop="buildingName"> <a-form-model-item class="ant-row-flex" label="幢名称" prop="houseInfo.buildingName">
<a-input placeholder="请输入幢名称" v-model="form.buildingName" /> <a-input placeholder="请输入幢名称" v-model="form.houseInfo.buildingName" />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
<a-form-model-item class="ant-row-flex" label="坐落地址" prop="address"> <a-form-model-item class="ant-row-flex" label="坐落地址" prop="houseCode.address">
<a-input placeholder="请输入坐落地址" v-model="form.address" /> <a-input placeholder="请输入坐落地址" v-model="form.houseCode.address" />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="24"> <a-col :span="24">
<a-form-model-item class="ant-row-flex" label="土地性质" prop="landAttribute"> <a-form-model-item class="ant-row-flex" label="土地性质" prop="houseInfo.landAttribute">
<a-radio-group button-style="solid" v-model="form.landAttribute"> <a-radio-group button-style="solid" v-model="form.houseInfo.landAttribute">
<a-radio-button <a-radio-button
:key="item.code" :key="item.code"
:value="item.code" :value="item.code"
@@ -40,24 +40,24 @@
<a-form-model-item class="ant-row-flex mb-none" label="地理坐标"> <a-form-model-item class="ant-row-flex mb-none" label="地理坐标">
<a-row :gutter="16"> <a-row :gutter="16">
<a-col :span="12"> <a-col :span="12">
<a-form-model-item prop="axisX"> <a-form-model-item prop="houseCode.lng">
<a-input <a-input
class="yo-input-prefix-2" class="yo-input-prefix-2"
disabled disabled
placeholder="请在地图上选择坐标" placeholder="请在地图上选择坐标"
prefix="经度" prefix="经度"
v-model="form.axisX" v-model="form.houseCode.lng"
/> />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
<a-form-model-item prop="axisY"> <a-form-model-item prop="houseCode.lat">
<a-input <a-input
class="yo-input-prefix-2" class="yo-input-prefix-2"
disabled disabled
placeholder="请在地图上选择坐标" placeholder="请在地图上选择坐标"
prefix="纬度" prefix="纬度"
v-model="form.axisY" v-model="form.houseCode.lat"
/> />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
@@ -73,8 +73,12 @@
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="24"> <a-col :span="24">
<a-form-model-item class="ant-row-flex" label="结构类型" prop="structureType"> <a-form-model-item class="ant-row-flex" label="结构类型" prop="houseInfo.structureType">
<a-radio-group button-style="solid" placeholder="请选择结构类型" v-model="form.structureType"> <a-radio-group
button-style="solid"
placeholder="请选择结构类型"
v-model="form.houseInfo.structureType"
>
<a-radio-button <a-radio-button
:key="item.code" :key="item.code"
:value="item.code" :value="item.code"
@@ -84,8 +88,8 @@
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
<a-form-model-item class="ant-row-flex" label="抗震等级" prop="aseismicGrade"> <a-form-model-item class="ant-row-flex" label="抗震等级" prop="houseInfo.aseismicGrade">
<a-radio-group button-style="solid" v-model="form.aseismicGrade"> <a-radio-group button-style="solid" v-model="form.houseInfo.aseismicGrade">
<a-radio-button <a-radio-button
:key="item.code" :key="item.code"
:value="item.code" :value="item.code"
@@ -95,8 +99,8 @@
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
<a-form-model-item class="ant-row-flex" label="基础情况" prop="baseInfo"> <a-form-model-item class="ant-row-flex" label="基础情况" prop="houseInfo.baseInfo">
<a-radio-group button-style="solid" v-model="form.baseInfo"> <a-radio-group button-style="solid" v-model="form.houseInfo.baseInfo">
<a-radio-button <a-radio-button
:key="item.code" :key="item.code"
:value="item.code" :value="item.code"
@@ -106,8 +110,12 @@
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="24"> <a-col :span="24">
<a-form-model-item class="ant-row-flex" label="外墙保温材料" prop="insulationMaterial"> <a-form-model-item
<a-checkbox-group v-model="form.insulationMaterial"> class="ant-row-flex"
label="外墙保温材料"
prop="houseInfo.insulationMaterial"
>
<a-checkbox-group v-model="form.houseInfo.insulationMaterial">
<a-checkbox <a-checkbox
:key="item.code" :key="item.code"
:value="item.code" :value="item.code"
@@ -117,15 +125,15 @@
<a-input <a-input
class="w-300" class="w-300"
placeholder="请输入其他外墙保温材料" placeholder="请输入其他外墙保温材料"
v-if="form.insulationMaterial && form.insulationMaterial.indexOf(codes.houseInsulationMaterial[codes.houseInsulationMaterial.length - 1].code) >= 0" v-if="form.houseInfo.insulationMaterial && form.houseInfo.insulationMaterial.indexOf(codes.houseInsulationMaterial[codes.houseInsulationMaterial.length - 1].code) >= 0"
v-model="form.keepWarmMaterialRest" v-model="form.houseInfo.keepWarmMaterialRest"
/> />
</a-checkbox-group> </a-checkbox-group>
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="24"> <a-col :span="24">
<a-form-model-item class="ant-row-flex" label="外墙墙体材料" prop="wallMaterial"> <a-form-model-item class="ant-row-flex" label="外墙墙体材料" prop="houseInfo.wallMaterial">
<a-checkbox-group v-model="form.wallMaterial"> <a-checkbox-group v-model="form.houseInfo.wallMaterial">
<a-checkbox <a-checkbox
:key="item.code" :key="item.code"
:value="item.code" :value="item.code"
@@ -136,12 +144,12 @@
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="24"> <a-col :span="24">
<a-form-model-item class="ant-row-flex" prop="fireproofGrade"> <a-form-model-item class="ant-row-flex" prop="houseInfo.fireproofGrade">
<span slot="label"> <span slot="label">
外墙外保温材料 外墙外保温材料
<br />防火等级 <br />防火等级
</span> </span>
<a-radio-group button-style="solid" v-model="form.fireproofGrade"> <a-radio-group button-style="solid" v-model="form.houseInfo.fireproofGrade">
<a-radio-button <a-radio-button
:key="item.code" :key="item.code"
:value="item.code" :value="item.code"
@@ -151,8 +159,8 @@
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="24"> <a-col :span="24">
<a-form-model-item class="ant-row-flex" label="建筑幕墙" prop="curtainWall"> <a-form-model-item class="ant-row-flex" label="建筑幕墙" prop="houseInfo.curtainWall">
<a-radio-group button-style="solid" v-model="form.curtainWall"> <a-radio-group button-style="solid" v-model="form.houseInfo.curtainWall">
<a-radio-button <a-radio-button
:key="item.code" :key="item.code"
:value="item.code" :value="item.code"
@@ -162,23 +170,23 @@
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-form-model-item class="ant-row-flex" label="有无外墙面砖" prop="faceBrick"> <a-form-model-item class="ant-row-flex" label="有无外墙面砖" prop="houseInfo.faceBrick">
<a-switch v-model="form.faceBrick" /> <a-switch v-model="form.houseInfo.faceBrick" />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-form-model-item class="ant-row-flex" label="有无外墙粉刷" prop="whiteWash"> <a-form-model-item class="ant-row-flex" label="有无外墙粉刷" prop="houseInfo.whiteWash">
<a-switch v-model="form.whiteWash" /> <a-switch v-model="form.houseInfo.whiteWash" />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-form-model-item class="ant-row-flex" label="有无外墙涂料" prop="coating"> <a-form-model-item class="ant-row-flex" label="有无外墙涂料" prop="houseInfo.coating">
<a-switch v-model="form.coating" /> <a-switch v-model="form.houseInfo.coating" />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="24"> <a-col :span="24">
<a-form-model-item class="ant-row-flex" label="电梯" prop="elevator"> <a-form-model-item class="ant-row-flex" label="电梯" prop="houseInfo.elevator">
<a-radio-group button-style="solid" v-model="form.elevator"> <a-radio-group button-style="solid" v-model="form.houseInfo.elevator">
<a-radio-button <a-radio-button
:key="item.code" :key="item.code"
:value="item.code" :value="item.code"
@@ -188,19 +196,23 @@
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-form-model-item class="ant-row-flex" label="竣工日期" prop="completedDate"> <a-form-model-item class="ant-row-flex" label="竣工日期" prop="houseInfo.completedDate">
<a-date-picker class="w-100-p" placeholder="请选择竣工日期" v-model="form.completedDate" /> <a-date-picker
class="w-100-p"
placeholder="请选择竣工日期"
v-model="form.houseInfo.completedDate"
/>
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-form-model-item class="ant-row-flex" label="设计使用年限" prop="usefulYear"> <a-form-model-item class="ant-row-flex" label="设计使用年限" prop="houseInfo.usefulYear">
<a-row type="flex"> <a-row type="flex">
<a-col flex="1"> <a-col flex="1">
<a-input-number <a-input-number
:min="0" :min="0"
class="w-100-p" class="w-100-p"
placeholder="请输入设计使用年限" placeholder="请输入设计使用年限"
v-model="form.usefulYear" v-model="form.houseInfo.usefulYear"
/> />
</a-col> </a-col>
<a-col> <a-col>
@@ -210,14 +222,14 @@
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-form-model-item class="ant-row-flex" label="总建筑面积" prop="totalArea"> <a-form-model-item class="ant-row-flex" label="总建筑面积" prop="houseInfo.totalArea">
<a-row type="flex"> <a-row type="flex">
<a-col flex="1"> <a-col flex="1">
<a-input-number <a-input-number
:min="0" :min="0"
class="w-100-p" class="w-100-p"
placeholder="请输入总建筑面积" placeholder="请输入总建筑面积"
v-model="form.totalArea" v-model="form.houseInfo.totalArea"
/> />
</a-col> </a-col>
<a-col> <a-col>
@@ -227,7 +239,7 @@
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-form-model-item class="ant-row-flex" label="总户数" prop="households"> <a-form-model-item class="ant-row-flex" label="总户数" prop="houseInfo.households">
<a-row type="flex"> <a-row type="flex">
<a-col flex="1"> <a-col flex="1">
<a-input-number <a-input-number
@@ -235,7 +247,7 @@
:step="1" :step="1"
class="w-100-p" class="w-100-p"
placeholder="请输入总户数" placeholder="请输入总户数"
v-model="form.households" v-model="form.houseInfo.households"
/> />
</a-col> </a-col>
<a-col> <a-col>
@@ -245,7 +257,7 @@
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-form-model-item class="ant-row-flex" label="房屋单元数" prop="units"> <a-form-model-item class="ant-row-flex" label="房屋单元数" prop="houseInfo.units">
<a-row type="flex"> <a-row type="flex">
<a-col flex="1"> <a-col flex="1">
<a-input-number <a-input-number
@@ -253,7 +265,7 @@
:step="1" :step="1"
class="w-100-p" class="w-100-p"
placeholder="请输入房屋单元数" placeholder="请输入房屋单元数"
v-model="form.units" v-model="form.houseInfo.units"
/> />
</a-col> </a-col>
<a-col> <a-col>
@@ -263,7 +275,7 @@
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-form-model-item class="ant-row-flex" label="每层每单元户数" prop="unitFloorHolds"> <a-form-model-item class="ant-row-flex" label="每层每单元户数" prop="houseInfo.unitFloorHolds">
<a-row type="flex"> <a-row type="flex">
<a-col flex="1"> <a-col flex="1">
<a-input-number <a-input-number
@@ -271,7 +283,7 @@
:step="1" :step="1"
class="w-100-p" class="w-100-p"
placeholder="请输入每层每单元户数" placeholder="请输入每层每单元户数"
v-model="form.unitFloorHolds" v-model="form.houseInfo.unitFloorHolds"
/> />
</a-col> </a-col>
<a-col> <a-col>
@@ -281,38 +293,43 @@
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-form-model-item class="ant-row-flex" label="建设单位" prop="buildingUnit"> <a-form-model-item class="ant-row-flex" label="建设单位" prop="houseInfo.buildingUnit">
<a-input placeholder="请输入建设单位" v-model="form.buildingUnit" /> <a-input placeholder="请输入建设单位" v-model="form.houseInfo.buildingUnit" />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-form-model-item class="ant-row-flex" label="建设单位联系人" prop="buildingUnitUser"> <a-form-model-item class="ant-row-flex" label="建设单位联系人" prop="houseInfo.buildingUnitUser">
<a-input placeholder="请输入建设单位联系人" v-model="form.buildingUnitUser" /> <a-input placeholder="请输入建设单位联系人" v-model="form.houseInfo.buildingUnitUser" />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-form-model-item class="ant-row-flex" label="建设单位联系电话" prop="buildingUnitTel"> <a-form-model-item class="ant-row-flex" label="建设单位联系电话" prop="houseInfo.buildingUnitTel">
<a-input placeholder="请输入建设单位联系电话" v-model="form.buildingUnitTel" /> <a-input placeholder="请输入建设单位联系电话" v-model="form.houseInfo.buildingUnitTel" />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-form-model-item class="ant-row-flex" label="设计单位" prop="desingerUnit"> <a-form-model-item class="ant-row-flex" label="设计单位" prop="houseInfo.desingerUnit">
<a-input placeholder="请输入设计单位" v-model="form.desingerUnit" /> <a-input placeholder="请输入设计单位" v-model="form.houseInfo.desingerUnit" />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-form-model-item class="ant-row-flex" label="施工单位" prop="constructionUnit"> <a-form-model-item class="ant-row-flex" label="施工单位" prop="houseInfo.constructionUnit">
<a-input placeholder="请输入施工单位" v-model="form.constructionUnit" /> <a-input placeholder="请输入施工单位" v-model="form.houseInfo.constructionUnit" />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-form-model-item class="ant-row-flex" label="监理单位" prop="monitorUnit"> <a-form-model-item class="ant-row-flex" label="监理单位" prop="houseInfo.monitorUnit">
<a-input placeholder="请输入监理单位" v-model="form.monitorUnit" /> <a-input placeholder="请输入监理单位" v-model="form.houseInfo.monitorUnit" />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="24"> <a-col :span="24">
<a-form-model-item class="ant-row-flex ant-form-inline mb-none" label="建筑层数"> <a-form-model-item class="ant-row-flex ant-form-inline mb-none" label="建筑层数">
<a-form-model-item :colon="false" class="ant-row-flex" label="地上" prop="landFloorCount"> <a-form-model-item
:colon="false"
class="ant-row-flex"
label="地上"
prop="houseInfo.landFloorCount"
>
<a-row type="flex"> <a-row type="flex">
<a-col flex="1"> <a-col flex="1">
<a-input-number <a-input-number
@@ -320,7 +337,7 @@
:step="1" :step="1"
class="w-100-p" class="w-100-p"
placeholder="请输入地上层" placeholder="请输入地上层"
v-model="form.landFloorCount" v-model="form.houseInfo.landFloorCount"
/> />
</a-col> </a-col>
<a-col> <a-col>
@@ -332,7 +349,7 @@
:colon="false" :colon="false"
class="ant-row-flex" class="ant-row-flex"
label="地下" label="地下"
prop="underFloorCount" prop="houseInfo.underFloorCount"
> >
<a-row type="flex"> <a-row type="flex">
<a-col flex="1"> <a-col flex="1">
@@ -341,7 +358,7 @@
:step="1" :step="1"
class="w-100-p" class="w-100-p"
placeholder="请输入地下层" placeholder="请输入地下层"
v-model="form.underFloorCount" v-model="form.houseInfo.underFloorCount"
/> />
</a-col> </a-col>
<a-col> <a-col>
@@ -349,7 +366,12 @@
</a-col> </a-col>
</a-row> </a-row>
</a-form-model-item> </a-form-model-item>
<a-form-model-item :colon="false" class="ant-row-flex" label="总共" prop="totalFloor"> <a-form-model-item
:colon="false"
class="ant-row-flex"
label="总共"
prop="houseInfo.totalFloor"
>
<a-row type="flex"> <a-row type="flex">
<a-col flex="1"> <a-col flex="1">
<a-input-number <a-input-number
@@ -358,7 +380,7 @@
class="w-100-p" class="w-100-p"
disabled disabled
placeholder="请输入总层数" placeholder="请输入总层数"
v-model="form.totalFloor" v-model="form.houseInfo.totalFloor"
/> />
</a-col> </a-col>
<a-col> <a-col>
@@ -374,12 +396,12 @@
<span class="yo-addon">地上第</span> <span class="yo-addon">地上第</span>
</a-col> </a-col>
<a-col flex="1"> <a-col flex="1">
<a-form-model-item class="mr-none" prop="landBsFloorStart"> <a-form-model-item class="mr-none" prop="houseInfo.landBsFloorStart">
<a-input-number <a-input-number
:min="0" :min="0"
:step="1" :step="1"
placeholder="几" placeholder="几"
v-model="form.landBsFloorStart" v-model="form.houseInfo.landBsFloorStart"
/> />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
@@ -387,12 +409,12 @@
<span class="yo-addon"></span> <span class="yo-addon"></span>
</a-col> </a-col>
<a-col flex="1"> <a-col flex="1">
<a-form-model-item class="mr-none" prop="landBsFloorEnd"> <a-form-model-item class="mr-none" prop="houseInfo.landBsFloorEnd">
<a-input-number <a-input-number
:min="0" :min="0"
:step="1" :step="1"
placeholder="几" placeholder="几"
v-model="form.landBsFloorEnd" v-model="form.houseInfo.landBsFloorEnd"
/> />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
@@ -407,12 +429,12 @@
<span class="yo-addon">地上</span> <span class="yo-addon">地上</span>
</a-col> </a-col>
<a-col flex="1"> <a-col flex="1">
<a-form-model-item class="mr-none" prop="landBikeFloorStart"> <a-form-model-item class="mr-none" prop="houseInfo.landBikeFloorStart">
<a-input-number <a-input-number
:min="0" :min="0"
:step="1" :step="1"
placeholder="几" placeholder="几"
v-model="form.landBikeFloorStart" v-model="form.houseInfo.landBikeFloorStart"
/> />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
@@ -427,12 +449,12 @@
<span class="yo-addon">地上第</span> <span class="yo-addon">地上第</span>
</a-col> </a-col>
<a-col flex="1"> <a-col flex="1">
<a-form-model-item class="mr-none" prop="landResidenceFloorStart"> <a-form-model-item class="mr-none" prop="houseInfo.landResidenceFloorStart">
<a-input-number <a-input-number
:min="0" :min="0"
:step="1" :step="1"
placeholder="几" placeholder="几"
v-model="form.landResidenceFloorStart" v-model="form.houseInfo.landResidenceFloorStart"
/> />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
@@ -440,12 +462,12 @@
<span class="yo-addon"></span> <span class="yo-addon"></span>
</a-col> </a-col>
<a-col flex="1"> <a-col flex="1">
<a-form-model-item class="mr-none" prop="landResidenceFloorEnd"> <a-form-model-item class="mr-none" prop="houseInfo.landResidenceFloorEnd">
<a-input-number <a-input-number
:min="0" :min="0"
:step="1" :step="1"
placeholder="几" placeholder="几"
v-model="form.landResidenceFloorEnd" v-model="form.houseInfo.landResidenceFloorEnd"
/> />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
@@ -464,14 +486,48 @@
/* 表单内容默认值 */ /* 表单内容默认值 */
const defaultForm = { const defaultForm = {
/* ... */ /* ... */
address: '', houseCode: {
axisX: '', address: null,
axisY: '', lng: null,
lat: null,
},
curtainWall: '0', houseInfo: {
faceBrick: false, buildingName: null,
whiteWash: false, landAttribute: '1',
coating: false, structureType: null,
aseismicGrade: null,
baseInfo: null,
insulationMaterial: null,
keepWarmMaterialRest: null,
wallMaterial: null,
fireproofGrade: null,
curtainWall: null,
faceBrick: null,
whiteWash: null,
coating: null,
elevator: null,
completedDate: null,
usefulYear: null,
totalArea: null,
households: null,
units: null,
unitFloorHolds: null,
buildingUnit: null,
buildingUnitUser: null,
buildingUnitTel: null,
desingerUnit: null,
constructionUnit: null,
monitorUnit: null,
landFloorCount: null,
underFloorCount: null,
totalFloor: null,
landBsFloorStart: null,
landBsFloorEnd: null,
landBikeFloorStart: null,
landResidenceFloorStart: null,
landResidenceFloorEnd: null,
},
}; };
export default { export default {
@@ -487,30 +543,29 @@ export default {
/** 验证格式 */ /** 验证格式 */
rules: { rules: {
/* ... */ /* ... */
projectName: [{ required: true, message: '请输入项目名称', trigger: 'blur' }], 'houseInfo.buildingName': [{ required: true, message: '请输入名称', trigger: 'blur' }],
buildingName: [{ required: true, message: '请输入幢名称', trigger: 'blur' }], 'houseCode.address': [{ required: true, message: '请输入坐落地址', trigger: 'blur' }],
address: [{ required: true, message: '请输入坐落地址', trigger: 'blur' }], 'houseInfo.landAttribute': [{ required: true, message: '请选择土地性质' }],
landAttribute: [{ required: true, message: '请选择土地性质', trigger: 'blur' }], 'houseCode.lng': [{ required: true, message: '请在地图上选择坐标', trigger: 'blur' }],
axisX: [{ required: true, message: '请在地图上选择坐标', trigger: 'blur' }], 'houseCode.lat': [{ required: true, message: '请在地图上选择坐标', trigger: 'blur' }],
axisY: [{ required: true, message: '请在地图上选择坐标', trigger: 'blur' }], 'houseInfo.structureType': [{ required: true, message: '请选择结构类型' }],
structureType: [{ required: true, message: '请选择结构类型', trigger: 'blur' }], 'houseInfo.aseismicGrade': [{ required: true, message: '请选择抗震等级' }],
aseismicGrade: [{ required: true, message: '请选择抗震等级', trigger: 'blur' }], 'houseInfo.baseInfo': [{ required: true, message: '请选择基础情况' }],
baseInfo: [{ required: true, message: '请选择基础情况', trigger: 'blur' }], 'houseInfo.curtainWall': [{ required: true, message: '请选择建筑幕墙' }],
curtainWall: [{ required: true, message: '请选择建筑幕墙', trigger: 'blur' }], 'houseInfo.elevator': [{ required: true, message: '请选择电梯' }],
elevator: [{ required: true, message: '请选择电梯', trigger: 'blur' }], 'houseInfo.completedDate': [{ required: true, message: '请选择竣工日期' }],
completedDate: [{ required: true, message: '请选择竣工日期', trigger: 'blur' }], 'houseInfo.usefulYear': [{ required: true, message: '请输入设计使用年限', trigger: 'blur' }],
usefulYear: [{ required: true, message: '请输入设计使用年限', trigger: 'blur' }], 'houseInfo.totalArea': [{ required: true, message: '请输入总建筑面积', trigger: 'blur' }],
totalArea: [{ required: true, message: '请输入总建筑面积', trigger: 'blur' }], 'houseInfo.households': [{ required: true, message: '请输入总户数', trigger: 'blur' }],
households: [{ required: true, message: '请输入总户数', trigger: 'blur' }], 'houseInfo.units': [{ required: true, message: '请输入房屋单元数', trigger: 'blur' }],
units: [{ required: true, message: '请输入房屋单元数', trigger: 'blur' }], 'houseInfo.unitFloorHolds': [{ required: true, message: '请输入每层每单元数', trigger: 'blur' }],
unitFloorHolds: [{ required: true, message: '请输入每层每单元户数', trigger: 'blur' }], 'houseInfo.buildingUnit': [{ required: true, message: '请输入建设单位', trigger: 'blur' }],
buildingUnit: [{ required: true, message: '请输入建设单位', trigger: 'blur' }], 'houseInfo.buildingUnitUser': [{ required: true, message: '请输入建设单位联系人', trigger: 'blur' }],
buildingUnitUser: [{ required: true, message: '请输入建设单位联系', trigger: 'blur' }], 'houseInfo.buildingUnitTel': [{ required: true, message: '请输入建设单位联系电话', trigger: 'blur' }],
buildingUnitTel: [{ required: true, message: '请输入建设单位联系电话', trigger: 'blur' }], 'houseInfo.desingerUnit': [{ required: true, message: '请输入设计单位', trigger: 'blur' }],
desingerUnit: [{ required: true, message: '请输入设计单位', trigger: 'blur' }], 'houseInfo.constructionUnit': [{ required: true, message: '请输入施工单位', trigger: 'blur' }],
constructionUnit: [{ required: true, message: '请输入施工单位', trigger: 'blur' }], 'houseInfo.landFloorCount': [{ required: true, message: '请输入地上层', trigger: 'blur' }],
landFloorCount: [{ required: true, message: '请输入地层', trigger: 'blur' }], 'houseInfo.underFloorCount': [{ required: true, message: '请输入地层', trigger: 'blur' }],
underFloorCount: [{ required: true, message: '请输入地下层', trigger: 'blur' }],
}, },
/** 加载异步数据状态 */ /** 加载异步数据状态 */
@@ -533,38 +588,38 @@ export default {
}, },
watch: { watch: {
'form.insulationMaterial'(value, oldValue) { 'form.houseInfo.insulationMaterial'(value, oldValue) {
// 选中"无"时全不选,反之取消选择"无" // 选中"无"时全不选,反之取消选择"无"
if (value) {
if (value.indexOf('0') >= 0 && oldValue.indexOf('0') === -1) { if (value.indexOf('0') >= 0 && oldValue.indexOf('0') === -1) {
this.form.insulationMaterial = ['0']; this.form.houseInfo.insulationMaterial = ['0'];
} else if (value.indexOf('0') >= 0 && value.length > 1) { } else if (value.indexOf('0') >= 0 && value.length > 1) {
this.form.insulationMaterial.splice(value.indexOf('0'), 1); this.form.houseInfo.insulationMaterial.splice(value.indexOf('0'), 1);
}
} }
}, },
'form.curtainWall'(value) { 'form.houseInfo.curtainWall'(value) {
this.frame.onTogglePane(!!+value, 'curtainWall'); this.frame.onTogglePane(!!+value, 'curtainWall');
}, },
'form.faceBrick'(value) { 'form.houseInfo.faceBrick'(value) {
this.frame.onTogglePane(value, 'faceBrick'); this.frame.onTogglePane(value, 'faceBrick');
}, },
'form.whiteWash'(value) { 'form.houseInfo.whiteWash'(value) {
this.frame.onTogglePane(value, 'whiteWash'); this.frame.onTogglePane(value, 'whiteWash');
}, },
'form.coating'(value) { 'form.houseInfo.coating'(value) {
this.frame.onTogglePane(value, 'coating'); this.frame.onTogglePane(value, 'coating');
}, },
}, },
async created() { async created() {
this.form = this.$_.cloneDeep(defaultForm);
await this.onInit(); await this.onInit();
this.onFillData(); this.onFillData();
}, },
mounted() {
this.onMapInit();
},
beforeDestroy() { beforeDestroy() {
if (this.map) this.map.destroy(); if (this.map) this.map.destroy();
}, },
@@ -578,11 +633,31 @@ export default {
/** 将默认数据覆盖到form */ /** 将默认数据覆盖到form */
const record = this.param && this.param.record; const record = this.param && this.param.record;
this.form = this.$_.cloneDeep({ const form = this.$_.cloneDeep(defaultForm);
...defaultForm,
...record, if (record) {
/** 在此处添加其他默认数据转换 */ // 此处因业务复杂, 所有数据必定包裹在单独节点中, 所以需要两层循环
/* ... */ Object.keys(form).forEach((p) => {
if (record.hasOwnProperty(p) && record[p]) {
const _form = form[p],
_record = record[p];
Object.keys(form[p]).forEach((q) => {
if (_record.hasOwnProperty(q) && (_record[q] !== null) & (_record[q] !== undefined)) {
_form[q] = _record[q];
}
});
}
});
}
this.form = form;
this.$nextTick(async () => {
await this.onMapInit();
if (this.form.houseCode.lng && this.form.houseCode.lat) {
this.setMarker([this.form.houseCode.lng, this.form.houseCode.lat]);
this.map.setCenter([this.form.houseCode.lng, this.form.houseCode.lat]);
}
}); });
}, },
@@ -687,6 +762,7 @@ export default {
}, },
onMapInit() { onMapInit() {
return new Promise((resolve) => {
const city = '宁波市'; const city = '宁波市';
const district = new AMap.DistrictSearch({ const district = new AMap.DistrictSearch({
@@ -703,34 +779,20 @@ export default {
} }
// 挂载map到this,但不监听 // 挂载map到this,但不监听
this.map = new AMap.Map(this.$refs.map, { city, viewMode: '3D', mask }); this.map = new AMap.Map(this.$refs.map, {
city,
mask,
zoom: 12,
});
const geocoder = new AMap.Geocoder({ city }); const geocoder = new AMap.Geocoder({ city });
let marker;
const setMarker = (position) => {
if (marker) {
marker.setPosition(position);
} else {
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),
});
}
geocoder.getAddress(position, (status, result) => {
if (status === 'complete' && result.regeocode) {
this.onSetPosition(result.regeocode.formattedAddress, position);
} else {
console.error('根据经纬度查询地址失败');
}
});
};
this.map.on('click', (e) => { this.map.on('click', (e) => {
setMarker(e.lnglat); this.setMarker(e.lnglat, geocoder);
});
this.map.on('complete', () => {
resolve();
}); });
const auto = new AMap.AutoComplete({ const auto = new AMap.AutoComplete({
@@ -753,7 +815,7 @@ export default {
poiList: { pois }, poiList: { pois },
} = result; } = result;
pois.forEach((p) => { pois.forEach((p) => {
setMarker(p.location); this.setMarker(p.location, geocoder);
}); });
this.map.setFitView(); this.map.setFitView();
@@ -769,13 +831,37 @@ export default {
}); });
} }
}); });
});
},
setMarker(position, geocoder) {
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),
});
}
if (geocoder) {
geocoder.getAddress(position, (status, result) => {
if (status === 'complete' && result.regeocode) {
this.onSetPosition(result.regeocode.formattedAddress, position);
} else {
console.error('根据经纬度查询地址失败');
}
});
}
}, },
onSetPosition(address, { lng, lat }) { onSetPosition(address, { lng, lat }) {
Object.assign(this.form, { Object.assign(this.form.houseCode, {
address, address,
axisX: lng.toString(), lng: lng.toString(),
axisY: lat.toString(), lat: lat.toString(),
}); });
}, },
}, },

View File

@@ -51,42 +51,42 @@ export default {
title: '建筑物基本信息', title: '建筑物基本信息',
component: () => import('./building'), component: () => import('./building'),
}, },
{ // {
title: '权属情况', // title: '权属情况',
component: () => import('./ownership'), // component: () => import('./ownership'),
}, // },
{ // {
title: '管理情况', // title: '管理情况',
component: () => import('./manager'), // component: () => import('./manager'),
}, // },
{ // {
title: '调查情况', // title: '调查情况',
component: () => import('./investigation'), // component: () => import('./investigation'),
}, // },
{ // {
title: '鉴定治理', // title: '鉴定治理',
component: () => import('./identification'), // component: () => import('./identification'),
}, // },
{ // {
title: '图纸资料存档处', // title: '图纸资料存档处',
component: () => import('./drawing'), // component: () => import('./drawing'),
}, // },
{ // {
title: '相关附件资料', // title: '相关附件资料',
component: () => import('./attachments'), // component: () => import('./attachments'),
}, // },
{ // {
title: '物业维修资金', // title: '物业维修资金',
component: () => import('./fund'), // component: () => import('./fund'),
}, // },
{ // {
title: '建筑概貌', // title: '建筑概貌',
component: () => import('./aspect'), // component: () => import('./aspect'),
}, // },
{ // {
title: '调查单位', // title: '调查单位',
component: () => import('./unit'), // component: () => import('./unit'),
}, // },
], ],
}; };
}, },

View File

@@ -1,6 +1,10 @@
<template> <template>
<div class="yo-form-page"> <div class="yo-form-page">
<div class="yo-form-page-layout"> <a-spin :spinning="loading" class="w-100-p h-100-p" tip="表单加载中..." v-if="loading">
<a-icon slot="indicator" spin type="loading" />
<div title="用于撑高spin"></div>
</a-spin>
<div class="yo-form-page-layout" v-else>
<!-- 底部工具栏(需放在前面) --> <!-- 底部工具栏(需放在前面) -->
<div class="yo-form-page--bar yo-form-page--bar--with-tab"> <div class="yo-form-page--bar yo-form-page--bar--with-tab">
<container> <container>
@@ -20,12 +24,15 @@
<div :style="{ paddingBottom: 0 }" class="yo-form-page--header"> <div :style="{ paddingBottom: 0 }" class="yo-form-page--header">
<container> <container>
<a-descriptions :column="4" title> <a-descriptions :column="4" title>
<a-descriptions-item label="区县(市)">测试区</a-descriptions-item> <a-descriptions-item label="区县(市)">{{param.record.houseCode.areaName}}</a-descriptions-item>
<a-descriptions-item label="街道(乡镇)">测试街道</a-descriptions-item> <a-descriptions-item label="街道(乡镇)">{{param.record.houseCode.roadName}}</a-descriptions-item>
<a-descriptions-item label="社区">欧阳社区</a-descriptions-item> <a-descriptions-item label="社区">{{param.record.houseCode.commName}}</a-descriptions-item>
<a-descriptions-item label="片区">片区一22明湖片区</a-descriptions-item> <a-descriptions-item label="片区">{{param.record.houseCode.zoneName}}</a-descriptions-item>
<a-descriptions-item :span="2" label="编号">宁波市-测试区-测试街道-欧阳社区-项目十二(项目十二)-001</a-descriptions-item> <a-descriptions-item
<a-descriptions-item :span="2" label="编码">330266066001012001</a-descriptions-item> :span="2"
label="编号"
>{{`${param.record.houseCode.areaName}-${param.record.houseCode.roadName}-${param.record.houseCode.commName}-${param.record.houseCode.projectFullName}-${`000${param.record.houseCode.no}`.slice(-3)}`}}</a-descriptions-item>
<a-descriptions-item :span="2" label="编码">{{param.record.houseCode.houseCode}}</a-descriptions-item>
</a-descriptions> </a-descriptions>
</container> </container>
</div> </div>
@@ -115,7 +122,7 @@ export default {
}, },
], ],
loading: false, loading: true,
}; };
}, },
@@ -127,10 +134,10 @@ export default {
created() { created() {
this.loading = true; this.loading = true;
setTimeout(() => { this.$api.houseInfoGetByTaskId({ taskId: this.param.taskId }).then(({ data }) => {
this.$set(this.param, 'record', {}); this.$set(this.param, 'record', data);
this.loading = false; this.loading = false;
}, 3000); });
}, },
methods: { methods: {

View File

@@ -16,13 +16,17 @@
<a-icon slot="indicator" spin type="loading" /> <a-icon slot="indicator" spin type="loading" />
<a-row :gutter="16" type="flex"> <a-row :gutter="16" type="flex">
<a-col :span="12"> <a-col :span="12">
<a-form-model-item class="ant-row-flex" label="巡查日期" prop="patrolDate"> <a-form-model-item class="ant-row-flex" label="巡查日期" prop="patrolInfo.patrolDate">
<a-date-picker class="w-100-p" placeholder="请选择巡查日期" v-model="form.patrolDate" /> <a-date-picker
class="w-100-p"
placeholder="请选择巡查日期"
v-model="form.patrolInfo.patrolDate"
/>
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
<a-form-model-item class="ant-row-flex" label="巡查人/单位" prop="patrolUser"> <a-form-model-item class="ant-row-flex" label="巡查人/单位" prop="patrolInfo.patrolUser">
<a-input placeholder="请输入巡查人/单位" v-model="form.patrolUser" /> <a-input placeholder="请输入巡查人/单位" v-model="form.patrolInfo.patrolUser" />
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
</a-row> </a-row>
@@ -31,7 +35,12 @@
</template> </template>
<script> <script>
/* 表单内容默认值 */ /* 表单内容默认值 */
const defaultForm = {}; const defaultForm = {
patrolInfo: {
patrolDate: null,
patrolUser: null,
},
};
export default { export default {
props: ['param', 'frame'], props: ['param', 'frame'],
data() { data() {
@@ -44,8 +53,8 @@ export default {
/** 验证格式 */ /** 验证格式 */
rules: { rules: {
/* ... */ /* ... */
patrolDate: [{ required: true, message: '请选择巡查日期', trigger: 'blur' }], 'patrolInfo.patrolDate': [{ required: true, message: '请选择巡查日期', trigger: 'blur' }],
patrolUser: [{ required: true, message: '请输入巡查人/单位', trigger: 'blur' }], 'patrolInfo.patrolUser': [{ required: true, message: '请输入巡查人/单位', trigger: 'blur' }],
}, },
/** 加载异步数据状态 */ /** 加载异步数据状态 */
loading: false, loading: false,
@@ -54,25 +63,14 @@ export default {
codes: {}, codes: {},
}; };
}, },
async created() { async created() {
this.form = this.$_.cloneDeep(defaultForm);
await this.onInit(); await this.onInit();
this.onFillData(); this.onFillData();
}, },
mounted() {},
async created() {
await this.onInit();
this.onFillData();
},
mounted() {
this.onMapInit();
},
beforeDestroy() {
if (this.map) this.map.destroy();
},
methods: { methods: {
/** /**
* 必要的方法 * 必要的方法
@@ -83,11 +81,21 @@ export default {
const record = this.param && this.param.record; const record = this.param && this.param.record;
const form = this.$_.cloneDeep(defaultForm); const form = this.$_.cloneDeep(defaultForm);
if (record) {
// 此处因业务复杂, 所有数据必定包裹在单独节点中, 所以需要两层循环
Object.keys(form).forEach((p) => { Object.keys(form).forEach((p) => {
if (record.hasOwnProperty(p)) { if (record.hasOwnProperty(p) && record[p]) {
form[p] = record[p]; const _form = form[p],
_record = record[p];
Object.keys(form[p]).forEach((q) => {
if (_record.hasOwnProperty(q) && (_record[q] !== null) & (_record[q] !== undefined)) {
_form[q] = _record[q];
} }
}); });
}
});
}
this.form = form; this.form = form;
}, },