From 8a0d1286e72670a0a8ef08da6bbd84d1ec7c04d7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=87=AA=E5=B8=A6=E5=A4=A7=E4=BD=AC=E6=B0=94=E5=9C=BA?= <188633308@qq.com> Date: Wed, 2 Jun 2021 15:33:24 +0800 Subject: [PATCH] =?UTF-8?q?update=20=E8=A1=A8=E5=8D=95=E6=95=B0=E6=8D=AE?= =?UTF-8?q?=E7=BB=93=E6=9E=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../pages/business/house/code/form/part.vue | 1 - .../house/info/form/base/building.vue | 476 +++++++++++------- .../business/house/info/form/base/index.vue | 72 +-- .../pages/business/house/info/form/index.vue | 29 +- .../business/house/info/form/patrol/base.vue | 60 ++- 5 files changed, 369 insertions(+), 269 deletions(-) diff --git a/Web/src/pages/business/house/code/form/part.vue b/Web/src/pages/business/house/code/form/part.vue index e74f75c..c3d541d 100644 --- a/Web/src/pages/business/house/code/form/part.vue +++ b/Web/src/pages/business/house/code/form/part.vue @@ -392,7 +392,6 @@ export default { // 挂载map到this,但不监听 this.map = new AMap.Map(this.$refs.map, { city, - viewMode: '3D', mask, zoom: 12, }); diff --git a/Web/src/pages/business/house/info/form/base/building.vue b/Web/src/pages/business/house/info/form/base/building.vue index 2f4f4ec..493a009 100644 --- a/Web/src/pages/business/house/info/form/base/building.vue +++ b/Web/src/pages/business/house/info/form/base/building.vue @@ -16,18 +16,18 @@ - - + + - - + + - - + + - + - + @@ -73,8 +73,12 @@ - - + + - - + + - - + + - - + + - - + + - + 外墙外保温材料
防火等级 - + - - + + - - + + - - + + - - + + - - + + - - + + - + @@ -210,14 +222,14 @@ - + @@ -227,7 +239,7 @@ - + @@ -245,7 +257,7 @@ - + @@ -263,7 +275,7 @@ - + @@ -281,38 +293,43 @@ - - + + - - + + - - + + - - + + - - + + - - + + - + @@ -332,7 +349,7 @@ :colon="false" class="ant-row-flex" label="地下" - prop="underFloorCount" + prop="houseInfo.underFloorCount" > @@ -341,7 +358,7 @@ :step="1" class="w-100-p" placeholder="请输入地下层" - v-model="form.underFloorCount" + v-model="form.houseInfo.underFloorCount" /> @@ -349,7 +366,12 @@ - + @@ -374,12 +396,12 @@ 地上第 - + @@ -387,12 +409,12 @@ 层，至 - + @@ -407,12 +429,12 @@ 地上 - + @@ -427,12 +449,12 @@ 地上第 - + @@ -440,12 +462,12 @@ 层，至 - + @@ -464,14 +486,48 @@ /* 表单内容默认值 */ const defaultForm = { /* ... */ - address: '', - axisX: '', - axisY: '', + houseCode: { + address: null, + lng: null, + lat: null, + }, - curtainWall: '0', - faceBrick: false, - whiteWash: false, - coating: false, + houseInfo: { + buildingName: null, + landAttribute: '1', + 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 { @@ -487,30 +543,29 @@ export default { /** 验证格式 */ rules: { /* ... */ - projectName: [{ required: true, message: '请输入项目名称', trigger: 'blur' }], - buildingName: [{ required: true, message: '请输入幢名称', trigger: 'blur' }], - address: [{ required: true, message: '请输入坐落地址', trigger: 'blur' }], - landAttribute: [{ required: true, message: '请选择土地性质', trigger: 'blur' }], - axisX: [{ required: true, message: '请在地图上选择坐标', trigger: 'blur' }], - axisY: [{ required: true, message: '请在地图上选择坐标', trigger: 'blur' }], - structureType: [{ required: true, message: '请选择结构类型', trigger: 'blur' }], - aseismicGrade: [{ required: true, message: '请选择抗震等级', trigger: 'blur' }], - baseInfo: [{ required: true, message: '请选择基础情况', trigger: 'blur' }], - curtainWall: [{ required: true, message: '请选择建筑幕墙', trigger: 'blur' }], - elevator: [{ required: true, message: '请选择电梯', trigger: 'blur' }], - completedDate: [{ required: true, message: '请选择竣工日期', trigger: 'blur' }], - usefulYear: [{ required: true, message: '请输入设计使用年限', trigger: 'blur' }], - totalArea: [{ required: true, message: '请输入总建筑面积', trigger: 'blur' }], - households: [{ required: true, message: '请输入总户数', trigger: 'blur' }], - units: [{ required: true, message: '请输入房屋单元数', trigger: 'blur' }], - unitFloorHolds: [{ required: true, message: '请输入每层每单元户数', trigger: 'blur' }], - buildingUnit: [{ required: true, message: '请输入建设单位', trigger: 'blur' }], - buildingUnitUser: [{ required: true, message: '请输入建设单位联系人', trigger: 'blur' }], - buildingUnitTel: [{ required: true, message: '请输入建设单位联系电话', trigger: 'blur' }], - desingerUnit: [{ required: true, message: '请输入设计单位', trigger: 'blur' }], - constructionUnit: [{ required: true, message: '请输入施工单位', trigger: 'blur' }], - landFloorCount: [{ required: true, message: '请输入地上层', trigger: 'blur' }], - underFloorCount: [{ required: true, message: '请输入地下层', trigger: 'blur' }], + 'houseInfo.buildingName': [{ required: true, message: '请输入幢名称', trigger: 'blur' }], + 'houseCode.address': [{ required: true, message: '请输入坐落地址', trigger: 'blur' }], + 'houseInfo.landAttribute': [{ required: true, message: '请选择土地性质' }], + 'houseCode.lng': [{ required: true, message: '请在地图上选择坐标', trigger: 'blur' }], + 'houseCode.lat': [{ required: true, message: '请在地图上选择坐标', trigger: 'blur' }], + 'houseInfo.structureType': [{ required: true, message: '请选择结构类型' }], + 'houseInfo.aseismicGrade': [{ required: true, message: '请选择抗震等级' }], + 'houseInfo.baseInfo': [{ required: true, message: '请选择基础情况' }], + 'houseInfo.curtainWall': [{ required: true, message: '请选择建筑幕墙' }], + 'houseInfo.elevator': [{ required: true, message: '请选择电梯' }], + 'houseInfo.completedDate': [{ required: true, message: '请选择竣工日期' }], + 'houseInfo.usefulYear': [{ required: true, message: '请输入设计使用年限', trigger: 'blur' }], + 'houseInfo.totalArea': [{ required: true, message: '请输入总建筑面积', trigger: 'blur' }], + 'houseInfo.households': [{ required: true, message: '请输入总户数', trigger: 'blur' }], + 'houseInfo.units': [{ required: true, message: '请输入房屋单元数', trigger: 'blur' }], + 'houseInfo.unitFloorHolds': [{ required: true, message: '请输入每层每单元户数', trigger: 'blur' }], + 'houseInfo.buildingUnit': [{ required: true, message: '请输入建设单位', trigger: 'blur' }], + 'houseInfo.buildingUnitUser': [{ required: true, message: '请输入建设单位联系人', trigger: 'blur' }], + 'houseInfo.buildingUnitTel': [{ required: true, message: '请输入建设单位联系电话', trigger: 'blur' }], + 'houseInfo.desingerUnit': [{ required: true, message: '请输入设计单位', trigger: 'blur' }], + 'houseInfo.constructionUnit': [{ required: true, message: '请输入施工单位', trigger: 'blur' }], + 'houseInfo.landFloorCount': [{ required: true, message: '请输入地上层', trigger: 'blur' }], + 'houseInfo.underFloorCount': [{ required: true, message: '请输入地下层', trigger: 'blur' }], }, /** 加载异步数据状态 */ @@ -533,38 +588,38 @@ export default { }, watch: { - 'form.insulationMaterial'(value, oldValue) { + 'form.houseInfo.insulationMaterial'(value, oldValue) { // 选中"无"时全不选,反之取消选择"无" - if (value.indexOf('0') >= 0 && oldValue.indexOf('0') === -1) { - this.form.insulationMaterial = ['0']; - } else if (value.indexOf('0') >= 0 && value.length > 1) { - this.form.insulationMaterial.splice(value.indexOf('0'), 1); + if (value) { + if (value.indexOf('0') >= 0 && oldValue.indexOf('0') === -1) { + this.form.houseInfo.insulationMaterial = ['0']; + } else if (value.indexOf('0') >= 0 && value.length > 1) { + this.form.houseInfo.insulationMaterial.splice(value.indexOf('0'), 1); + } } }, - 'form.curtainWall'(value) { + 'form.houseInfo.curtainWall'(value) { this.frame.onTogglePane(!!+value, 'curtainWall'); }, - 'form.faceBrick'(value) { + 'form.houseInfo.faceBrick'(value) { this.frame.onTogglePane(value, 'faceBrick'); }, - 'form.whiteWash'(value) { + 'form.houseInfo.whiteWash'(value) { this.frame.onTogglePane(value, 'whiteWash'); }, - 'form.coating'(value) { + 'form.houseInfo.coating'(value) { this.frame.onTogglePane(value, 'coating'); }, }, async created() { + this.form = this.$_.cloneDeep(defaultForm); + await this.onInit(); this.onFillData(); }, - mounted() { - this.onMapInit(); - }, - beforeDestroy() { if (this.map) this.map.destroy(); }, @@ -578,11 +633,31 @@ export default { /** 将默认数据覆盖到form */ const record = this.param && this.param.record; - this.form = this.$_.cloneDeep({ - ...defaultForm, - ...record, - /** 在此处添加其他默认数据转换 */ - /* ... */ + const form = this.$_.cloneDeep(defaultForm); + + 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,95 +762,106 @@ export default { }, onMapInit() { - const city = '宁波市'; + return new Promise((resolve) => { + const city = '宁波市'; - const district = new AMap.DistrictSearch({ - subdistrict: 0, - extensions: 'all', - level: 'city', - }); + const district = new AMap.DistrictSearch({ + subdistrict: 0, + extensions: 'all', + level: 'city', + }); - district.search(city, (status, result) => { - const bounds = result.districtList[0].boundaries; - const mask = []; - for (let i = 0; i < bounds.length; i += 1) { - mask.push([bounds[i]]); - } - - // 挂载map到this,但不监听 - this.map = new AMap.Map(this.$refs.map, { city, viewMode: '3D', mask }); - - 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), - }); + district.search(city, (status, result) => { + const bounds = result.districtList[0].boundaries; + const mask = []; + for (let i = 0; i < bounds.length; i += 1) { + mask.push([bounds[i]]); } - geocoder.getAddress(position, (status, result) => { - if (status === 'complete' && result.regeocode) { - this.onSetPosition(result.regeocode.formattedAddress, position); - } else { - console.error('根据经纬度查询地址失败'); - } + // 挂载map到this,但不监听 + this.map = new AMap.Map(this.$refs.map, { + city, + mask, + zoom: 12, }); - }; - this.map.on('click', (e) => { - setMarker(e.lnglat); - }); + const geocoder = new AMap.Geocoder({ city }); - const auto = new AMap.AutoComplete({ - input: this.$refs['map-search'].$el.querySelector('input'), - city, - citylimit: true, - }); + this.map.on('click', (e) => { + this.setMarker(e.lnglat, geocoder); + }); - const placeSearch = new AMap.PlaceSearch({ - city, - citylimit: true, - pageSize: 1, - }); + this.map.on('complete', () => { + resolve(); + }); - auto.on('select', ({ poi: { name: keywords, adcode } }) => { - this.map.clearMap(); - marker = null; - placeSearch.search(keywords, (status, result) => { - const { - poiList: { pois }, - } = result; - pois.forEach((p) => { - setMarker(p.location); + const auto = new AMap.AutoComplete({ + input: this.$refs['map-search'].$el.querySelector('input'), + city, + citylimit: true, + }); + + const placeSearch = new AMap.PlaceSearch({ + city, + citylimit: true, + pageSize: 1, + }); + + auto.on('select', ({ poi: { name: keywords, adcode } }) => { + this.map.clearMap(); + marker = null; + placeSearch.search(keywords, (status, result) => { + const { + poiList: { pois }, + } = result; + pois.forEach((p) => { + this.setMarker(p.location, geocoder); + }); + + this.map.setFitView(); }); - - this.map.setFitView(); }); + + for (let i = 0; i < bounds.length; i += 1) { + new AMap.Polyline({ + path: bounds[i], + strokeColor: '#ccc', + strokeWeight: 4, + map: this.map, + }); + } }); - - for (let i = 0; i < bounds.length; i += 1) { - new AMap.Polyline({ - path: bounds[i], - strokeColor: '#ccc', - strokeWeight: 4, - map: this.map, - }); - } }); }, + 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 }) { - Object.assign(this.form, { + Object.assign(this.form.houseCode, { address, - axisX: lng.toString(), - axisY: lat.toString(), + lng: lng.toString(), + lat: lat.toString(), }); }, }, diff --git a/Web/src/pages/business/house/info/form/base/index.vue b/Web/src/pages/business/house/info/form/base/index.vue index 86db592..52914ba 100644 --- a/Web/src/pages/business/house/info/form/base/index.vue +++ b/Web/src/pages/business/house/info/form/base/index.vue @@ -51,42 +51,42 @@ export default { title: '建筑物基本信息', component: () => import('./building'), }, - { - title: '权属情况', - component: () => import('./ownership'), - }, - { - title: '管理情况', - component: () => import('./manager'), - }, - { - title: '调查情况', - component: () => import('./investigation'), - }, - { - title: '鉴定治理', - component: () => import('./identification'), - }, - { - title: '图纸资料存档处', - component: () => import('./drawing'), - }, - { - title: '相关附件资料', - component: () => import('./attachments'), - }, - { - title: '物业维修资金', - component: () => import('./fund'), - }, - { - title: '建筑概貌', - component: () => import('./aspect'), - }, - { - title: '调查单位', - component: () => import('./unit'), - }, + // { + // title: '权属情况', + // component: () => import('./ownership'), + // }, + // { + // title: '管理情况', + // component: () => import('./manager'), + // }, + // { + // title: '调查情况', + // component: () => import('./investigation'), + // }, + // { + // title: '鉴定治理', + // component: () => import('./identification'), + // }, + // { + // title: '图纸资料存档处', + // component: () => import('./drawing'), + // }, + // { + // title: '相关附件资料', + // component: () => import('./attachments'), + // }, + // { + // title: '物业维修资金', + // component: () => import('./fund'), + // }, + // { + // title: '建筑概貌', + // component: () => import('./aspect'), + // }, + // { + // title: '调查单位', + // component: () => import('./unit'), + // }, ], }; }, diff --git a/Web/src/pages/business/house/info/form/index.vue b/Web/src/pages/business/house/info/form/index.vue index 296a6ba..6aea801 100644 --- a/Web/src/pages/business/house/info/form/index.vue +++ b/Web/src/pages/business/house/info/form/index.vue @@ -1,6 +1,10 @@