From 4748f2da80a9fe47791e150acbb2bec54a052758 Mon Sep 17 00:00:00 2001 From: liuye Date: Mon, 20 Dec 2021 15:45:56 +0800 Subject: [PATCH 1/4] =?UTF-8?q?=E4=BB=A5=E6=88=BF=E6=89=BE=E4=BA=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apps/AppBuilding/components/detail.vue | 2 +- src/apps/AppBuilding/components/map.vue | 59 --- src/apps/AppBuilding/components/searchMap.vue | 485 ++++++++++++++---- 3 files changed, 394 insertions(+), 152 deletions(-) diff --git a/src/apps/AppBuilding/components/detail.vue b/src/apps/AppBuilding/components/detail.vue index a634df55..21323949 100644 --- a/src/apps/AppBuilding/components/detail.vue +++ b/src/apps/AppBuilding/components/detail.vue @@ -154,7 +154,7 @@ export default { }, computed: { ...mapState(['user']) }, mounted() { - this.communityId = "22314444d2ff415388569600f3cecc0a" + this.communityId = this.params.id this.$dict.load('householdRelation', 'houselivingStatus', 'houseLeaseSituation', 'houseUseStatus', 'isFilingCertificateStatus', 'communityBuildingType', 'yesOrNo', 'BulidResidentType').then(() => { this.getSelectList() diff --git a/src/apps/AppBuilding/components/map.vue b/src/apps/AppBuilding/components/map.vue index 2de290c8..e6051d54 100644 --- a/src/apps/AppBuilding/components/map.vue +++ b/src/apps/AppBuilding/components/map.vue @@ -160,65 +160,6 @@ uni-page-body{ width: 100%; height: 100%; } - .popup{ - padding: 0 32px 16px; - .bg{ - width: 64px; - height: 10px; - background: #CCC; - border-radius: 6px; - margin: 32px 0 32px 344px; - } - .title{ - font-size: 36px; - font-family: PingFang-SC-Heavy, PingFang-SC; - font-weight: 800; - color: #333; - line-height: 50px; - margin-bottom: 24px; - } - .address{ - font-size: 24px; - font-family: PingFangSC-Regular, PingFang SC; - color: #333; - line-height: 34px; - word-break: break-all; - } - .info-flex{ - padding: 26px 0 30px 0; - width: 100%; - border-bottom: 1px solid #D8DDE6; - line-height: 40px; - font-size: 28px; - .label{ - display: inline-block; - width: 160px; - font-weight: 800; - color: #333; - } - .value{ - color: #666; - font-size: 26px; - .phone-icon{ - width: 40px; - height: 40px; - vertical-align: sub; - margin-left: 16px; - } - } - } - } - .popup-btn{ - width: 100%; - font-size: 32px; - font-family: PingFangSC-Medium, PingFang SC; - font-weight: 500; - height: 112px; - line-height: 112px; - text-align: center; - background: #1365DD; - color: #FFF; - } .footer{ width: 100%; position: fixed; diff --git a/src/apps/AppBuilding/components/searchMap.vue b/src/apps/AppBuilding/components/searchMap.vue index e1155c37..987bb198 100644 --- a/src/apps/AppBuilding/components/searchMap.vue +++ b/src/apps/AppBuilding/components/searchMap.vue @@ -3,21 +3,25 @@
- - - 搜索 -
-
-
- 李宁 + +
+
-
+ + 搜索 +
+
+
+ {{name}} +
+
-

李宁宁

-

武昌徐家棚街街道武汉绿地金融城西斯莱公馆A座22楼…

+

{{item.residentName}}

+

{{item.areaName || ''}}{{item.createAddress}}

+
楼栋
列表 @@ -25,6 +29,40 @@
+ + + +
@@ -34,72 +72,280 @@ export default { data() { return { + latLngCenter: {}, areaId: '', ops: {}, lib: '', map: null, markerArr: [], show: false, - value: '' + value: '', + ClusterBubble: null, + name: '', + buildList: [], + detailInfo: { + house: {}, + build: {} + }, + showPop: false } }, computed: { ...mapState(['user']) }, mounted() { this.areaId = this.user.areaId - this.initMap() + this.getCenterLatLng() }, methods: { - initMap() { this.$nextTick(() =>{ - let {lib: TMap, map} = this - var markerCluster = new TMap.MarkerCluster({ - id: 'cluster', - map: map, - enableDefaultStyle: true, // 启用默认样式 - minimumClusterSize: 1, // 形成聚合簇的最小个数 - geometries: [{ // 点数组 - position: new TMap.LatLng(39.953416, 116.480945) - }, - { - position: new TMap.LatLng(39.984104, 116.407503) - }, - { - position: new TMap.LatLng(39.908802, 116.497502) - }, - { - position: new TMap.LatLng(40.040417, 116.373514) - }, - { - position: new TMap.LatLng(39.953416, 116.380945) - }, - { - position: new TMap.LatLng(39.984104, 116.307503) - }, - { - position: new TMap.LatLng(39.908802, 116.397502) - }, - { - position: new TMap.LatLng(40.040417, 116.273514) - }, - ], - zoomOnClick: true, // 点击簇时放大至簇内点分离 - gridSize: 60, // 聚合算法的可聚合距离 - averageCenter: false, // 每个聚和簇的中心是否应该是聚类中所有标记的平均值 - maxZoom: 10 // 采用聚合策略的最大缩放级别 - }); - }) - }, - initMap2() { - //初始化地图 - + initMap() { this.$nextTick(() =>{ let {lib: TMap, map} = this - var center = new TMap.LatLng(40.040422, 116.273521) + + + + var ClusterBubbleClick; + + this.ClusterBubble = function (options) { + TMap.DOMOverlay.call(this, options) + } + + // this.ClusterBubble.prototype = new TMap.DOMOverlay(); + + // this.ClusterBubble.prototype.onInit = function (options) { + // this.content = options.content; + // this.position = options.position; + // } + + // 创建点聚合 + var markerCluster = new TMap.MarkerCluster({ + id: 'cluster', + map: map, + enableDefaultStyle: false, // 关闭默认样式 + minimumClusterSize: 3, + geometries: [{ // 点数组 + position: new TMap.LatLng(39.953416, 116.480945) + }, + { + position: new TMap.LatLng(39.984104, 116.407503) + }, + { + position: new TMap.LatLng(39.908802, 116.497502) + }, + { + position: new TMap.LatLng(40.040417, 116.373514) + }, + { + position: new TMap.LatLng(39.953416, 116.380945) + }, + { + position: new TMap.LatLng(39.984104, 116.307503) + }, + { + position: new TMap.LatLng(39.908802, 116.397502) + }, + { + position: new TMap.LatLng(40.040417, 116.273514) + }, + ], + zoomOnClick: true, + gridSize: 60, + averageCenter: false + }); + + var clusterBubbleList = []; + var markerGeometries = []; var marker = null; - var points = [] + + // 监听聚合簇变化 + markerCluster.on('cluster_changed', function (e) { + // 销毁旧聚合簇生成的覆盖物 + if (clusterBubbleList.length) { + clusterBubbleList.forEach(function (item) { + item.destroy(); + }) + clusterBubbleList = []; + } + markerGeometries = []; + + // 根据新的聚合簇数组生成新的覆盖物和点标记图层 + var clusters = markerCluster.getClusters(); + clusters.forEach(function (item) { + if (item.geometries.length > 1) { + let clusterBubble = new this.ClusterBubble({ + map, + position: item.center, + content: item.geometries.length, + }); + clusterBubble.on('click', () => { + map.fitBounds(item.bounds); + }); + clusterBubbleList.push(clusterBubble); + } else { + markerGeometries.push({ + position: item.center + }); + } + }); + + if (marker) { + // 已创建过点标记图层,直接更新数据 + marker.setGeometries(markerGeometries); + } else { + // 创建点标记图层 + console.log(markerGeometries) + marker = new TMap.MultiMarker({ + id: 'marker-layer', // 图层id + map: map, + styles: { + // 点标注的相关样式 + marker: new TMap.MarkerStyle({ + width: 25, + height: 35, + anchor: { x: 16, y: 32 }, + src:'', + }), + }, + geometries: [ + { + // 点标注数据数组 + id: 'demo', + styleId: 'marker', + position: new TMap.LatLng(40.040422, 116.273521), + }, + ], + }); + + markerGeometries.map((item, index) => { + var html = `
` + +`腾讯大厦${index}
` + + new TMap.InfoWindow( + { + map: map, + enableCustom: true, + position: new TMap.LatLng(item.position.lat, item.position.lng), + offset: { y: -70, x: -5 }, + content: html + }, + ); + }) + + + } + }); + + }) + }, + + + // // 以下代码为基于DOMOverlay实现聚合点气泡 + // function ClusterBubble(options) { + // TMap.DOMOverlay.call(this, options); + // } + + // ClusterBubble.prototype = new TMap.DOMOverlay(); + + // ClusterBubble.prototype.onInit = function (options) { + // this.content = options.content; + // this.position = options.position; + // }; + + // // 销毁时需要删除监听器 + // ClusterBubble.prototype.onDestroy = function() { + // this.dom.removeEventListener('click', this.onClick); + // this.removeAllListeners(); + // }; + + // ClusterBubble.prototype.onClick = function() { + // this.emit('click'); + // }; + + // // 创建气泡DOM元素 + // ClusterBubble.prototype.createDOM = function () { + // var dom = document.createElement('div'); + // dom.classList.add('clusterBubble'); + // dom.innerText = this.content; + // dom.style.cssText = [ + // 'width: ' + (40 + parseInt(this.content) * 2) + 'px;', + // 'height: ' + (40 + parseInt(this.content) * 2) + 'px;', + // 'line-height: ' + (40 + parseInt(this.content) * 2) + 'px;', + // ].join(' '); + + // // 监听点击事件,实现zoomOnClick + // this.onClick = this.onClick.bind(this); + // // pc端注册click事件,移动端注册touchend事件 + // dom.addEventListener('click', this.onClick); + // return dom; + // }; + + // ClusterBubble.prototype.updateDOM = function () { + // if (!this.map) { + // return; + // } + // // 经纬度坐标转容器像素坐标 + // let pixel = this.map.projectToContainer(this.position); + + // // 使文本框中心点对齐经纬度坐标点 + // let left = pixel.getX() - this.dom.clientWidth / 2 + 'px'; + // let top = pixel.getY() - this.dom.clientHeight / 2 + 'px'; + // this.dom.style.transform = `translate(${left}, ${top})`; + + // this.emit('dom_updated'); + // }; + + // window.ClusterBubble = ClusterBubble; + + getCenterLatLng() { + this.$http.post(`/app/appdvcpconfig/getCorpLocation`, ).then(res => { + if (res.code == 0) { + this.latLngCenter = res.data + this.getCommunityList() + } + }) + }, + getCommunityList() { + this.$http.post('/app/appcommunitybuildinginfo/listByBuilding', null, { + params: { + current: 1, + size: 1000000, + areaId: this.user.areaId + } + }).then(res => { + if (res.code === 0) { + this.buildList = res.data + const points = res.data.map(item => { + return { + lnglat: [item.lng, item.lat], + id: item.id, + corpId: item.corpId, + areaName:item.areaName, + buildingNumber: item.name || item.buildingNumber, + communityName:item.name || item.communityName, + } + }) + + this.addMakert(points) + } + }) + }, + addMakert(points) { + this.$nextTick(() =>{ + let {lib: TMap, map} = this + var center = new TMap.LatLng(this.latLngCenter.lat, this.latLngCenter.lng) map.setCenter(center) + var marker = null; map.setZoom(18) + var geometriesList = [] + points.map((item) => { + item.position = new TMap.LatLng(item.lnglat[1], item.lnglat[0]) + var info = { + id: item.id, + styleId: 'marker', + position: new TMap.LatLng(item.lnglat[1], item.lnglat[0]) + } + geometriesList.push(info) + }) marker = new TMap.MultiMarker({ id: 'marker-layer', // 图层id map: map, @@ -112,49 +358,86 @@ export default { src:'', }), }, - geometries: [ - { - // 点标注数据数组 - id: 'demo', - styleId: 'marker', - position: new TMap.LatLng(40.040422, 116.273521), - }, - ], + geometries: geometriesList, }); - var infoWindow = null; - var infoWindow2 = null - var html = `
` - +`腾讯大厦
` - - infoWindow = new TMap.InfoWindow( - { - map: map, - enableCustom: true, - position: new TMap.LatLng(40.040422, 116.273521), - offset: { y: -70, x: -5 }, - content: html - }, - ); + points.map((item) => { - infoWindow2 = new TMap.InfoWindow( - { - map: map, - enableCustom: true, - position: new TMap.LatLng(40.03592, 116.27058), - offset: { y: -70, x: -5 }, - content: html - }, - ); + var html = `
` + +`${item.communityName}${item.buildingNumber}栋
` + + new TMap.InfoWindow( + { + map: map, + enableCustom: true, + position: item.position, + offset: { y: -70, x: -5 }, + content: html + }, + ); + + }) + + }) + }, + clear() { + this.name = '' + }, + search() { + this.buildList = [] + this.$http.post('/app/appcommunityhouseinfo/queryHouseByName', null, { + params: { + current: 1, + size: 20, + areaId: this.user.areaId, + name: this.name + } + }).then(res => { + if (res.code == 0 && res.data.length) { + this.show = true + this.buildList = res.data + const points = res.data.map(item => { + return { + lnglat: [item.lng, item.lat], + id: item.id, + corpId: item.corpId, + areaName:item.areaName, + buildingNumber: item.name || item.buildingNumber, + communityName:item.name || item.communityName, + } + }) + + this.addMakert(points) + }else { + this.show = false + this.$u.toast('未搜索到结果,请换个关键字重试!') + } + }) + }, + getBuidInfo(item) { + this.$http.post(`/app/appcommunityhouseinfo/queryDetailByIdWithBuilding?buildId=${item.buildingId}&houseId=${item.id}`).then(res => { + if (res.code == 0) { + this.show = false + this.showPop = true + this.detailInfo = res.data + } }) - }, toList() { console.log(122) this.$emit('change', { type: 'List', }) - } + }, + callPhone(phone) { + uni.makePhoneCall({ phoneNumber: phone }) + }, + toDetail(id) { + this.$emit('change', { + type: 'Detail', + params: {id} + }) + }, } } @@ -174,7 +457,7 @@ uni-page-body{ position: fixed; top: 24px; left: 16px; - z-index: 99; + z-index: 99999; padding: 16px 20px; box-sizing: border-box; .search-icon{ @@ -198,11 +481,16 @@ uni-page-body{ margin-right: 24px; vertical-align: super; } + .clear-btn{ + display: inline-block; + width: 32px; + height: 32px; + margin-right: 30px; + } .del-icon{ width: 32px; height: 32px; vertical-align: super; - margin-right: 30px; } .search-btn{ display: inline-block; @@ -221,12 +509,14 @@ uni-page-body{ .search-list{ position: fixed; width: 100%; + height: 700px; + overflow-y: scroll; top: 128px; left: 0; padding: 0 44px; box-sizing: border-box; background-color: #fff; - z-index: 99; + z-index: 99999; .search-icon{ width: 36px; height: 36px; @@ -338,5 +628,16 @@ uni-page-body{ } } } + .popup-btn{ + width: 100%; + font-size: 32px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + height: 112px; + line-height: 112px; + text-align: center; + background: #1365DD; + color: #FFF; + } } \ No newline at end of file From f560481eb9fd9c824d0f3ffc4e74909e60280df4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=8A=B1=E6=9C=89=E6=B8=85=E9=A6=99=E6=9C=88=E6=9C=89?= =?UTF-8?q?=E9=98=B4?= <185154740@qq.com> Date: Mon, 20 Dec 2021 16:12:47 +0800 Subject: [PATCH 2/4] =?UTF-8?q?=E5=A9=9A=E4=B8=A7=E5=AB=81=E5=A8=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apps/AppMarryAndDie/Add.vue | 230 ++++++++++++++++++ src/apps/AppMarryAndDie/AllActiveList.vue | 219 +++++++++++++++++ src/apps/AppMarryAndDie/AppMarryAndDie.vue | 266 ++++++++++++++++----- src/apps/AppMarryAndDie/CadreList.vue | 220 +++++++++++++++++ src/apps/AppMarryAndDie/FuneralList.vue | 220 +++++++++++++++++ src/apps/AppMarryAndDie/MarryList.vue | 220 +++++++++++++++++ src/apps/AppResidentActivitie/Add.vue | 2 +- 7 files changed, 1319 insertions(+), 58 deletions(-) create mode 100644 src/apps/AppMarryAndDie/Add.vue create mode 100644 src/apps/AppMarryAndDie/AllActiveList.vue create mode 100644 src/apps/AppMarryAndDie/CadreList.vue create mode 100644 src/apps/AppMarryAndDie/FuneralList.vue create mode 100644 src/apps/AppMarryAndDie/MarryList.vue diff --git a/src/apps/AppMarryAndDie/Add.vue b/src/apps/AppMarryAndDie/Add.vue new file mode 100644 index 00000000..798386f7 --- /dev/null +++ b/src/apps/AppMarryAndDie/Add.vue @@ -0,0 +1,230 @@ + + + + + diff --git a/src/apps/AppMarryAndDie/AllActiveList.vue b/src/apps/AppMarryAndDie/AllActiveList.vue new file mode 100644 index 00000000..95c7eded --- /dev/null +++ b/src/apps/AppMarryAndDie/AllActiveList.vue @@ -0,0 +1,219 @@ + + + + + diff --git a/src/apps/AppMarryAndDie/AppMarryAndDie.vue b/src/apps/AppMarryAndDie/AppMarryAndDie.vue index 021896f3..1373f9f8 100644 --- a/src/apps/AppMarryAndDie/AppMarryAndDie.vue +++ b/src/apps/AppMarryAndDie/AppMarryAndDie.vue @@ -4,7 +4,7 @@
-
+
活动登记情况 查看全部活动和本月新增 @@ -13,7 +13,7 @@
-
+
干部参与情况 查看全部参与操办信息和本月新增 @@ -22,7 +22,7 @@
-
+
婚礼登记情况 查看全部婚礼和本月新增 @@ -31,7 +31,7 @@
-
+
丧礼登记情况 查看全部丧礼和本月新增 @@ -46,16 +46,59 @@

本年统计

-
+
-
1
+
+ + + + +
我要上报
+ + +
@@ -193,8 +265,10 @@ uni-page-body { } .AppMarryAndDie { height: 100%; - background: #fff; + .msg { + height: 100%; + background: #fff; .box { display: flex; justify-content: space-between; @@ -208,6 +282,7 @@ uni-page-body { margin-top: 8px; padding: 18px 24px 34px; box-sizing: border-box; + background: #f6f7f8; .imgleft { display: flex; flex-direction: column; @@ -238,12 +313,89 @@ uni-page-body { } .chart { + p { + padding: 26px 0 26px 32px; + font-size: 32px; + font-weight: 500; + } .yearStatistics { width: 100%; - // height: 500px; - // background: pink; + height: 600px; } } } + .myReport { + background: #f3f6f9; + padding-bottom: 112px; + + ::v-deep .AiCard { + background: #f3f6f9; + .start { + display: flex; + align-items: center; + background: #fff; + padding: 32px 32px 36px 32px; + border-radius: 16px; + .names, + .phones, + .times, + .areaNames { + display: flex; + .right { + width: 76%; + margin-left: 32px; + font-size: 26px; + color: #333333; + word-break: break-all; + overflow: hidden; + text-overflow: ellipsis; + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; + } + } + .types { + display: inline-block; + margin-top: 32px; + border-radius: 8px; + padding: 4px 8px; + color: #fff; + } + } + .mask { + .moreMenu { + transform: translate(-175px, 20px); + .menu { + text-align: center; + line-height: 80px; + width: 192px; + height: 80px; + font-size: 28px; + font-weight: 400; + color: #333333; + } + } + } + } + + .u-load-more-wrap { + background: #f3f6f9 !important; + margin: 0 !important; + padding: 30px 0; + } + + .fixedBtn { + position: fixed; + width: 100%; + z-index: 999; + bottom: 0; + background: #3975c6; + padding: 32px 0; + text-align: center; + font-size: 32px; + font-weight: 500; + color: #ffffff; + } + } } diff --git a/src/apps/AppMarryAndDie/CadreList.vue b/src/apps/AppMarryAndDie/CadreList.vue new file mode 100644 index 00000000..a0da4700 --- /dev/null +++ b/src/apps/AppMarryAndDie/CadreList.vue @@ -0,0 +1,220 @@ + + + + + diff --git a/src/apps/AppMarryAndDie/FuneralList.vue b/src/apps/AppMarryAndDie/FuneralList.vue new file mode 100644 index 00000000..7fb87ad2 --- /dev/null +++ b/src/apps/AppMarryAndDie/FuneralList.vue @@ -0,0 +1,220 @@ + + + + + diff --git a/src/apps/AppMarryAndDie/MarryList.vue b/src/apps/AppMarryAndDie/MarryList.vue new file mode 100644 index 00000000..eb83cad8 --- /dev/null +++ b/src/apps/AppMarryAndDie/MarryList.vue @@ -0,0 +1,220 @@ + + + + + diff --git a/src/apps/AppResidentActivitie/Add.vue b/src/apps/AppResidentActivitie/Add.vue index 9f688dc1..996f5226 100644 --- a/src/apps/AppResidentActivitie/Add.vue +++ b/src/apps/AppResidentActivitie/Add.vue @@ -155,7 +155,7 @@ export default { return this.$u.toast('请输入活动详情') } if (this.forms.fileIds.length == 0) { - return this.$u.toast('请输入活动详情') + return this.$u.toast('请选择活动封面图') } if (!this.forms.status) { return this.$u.toast('请选择活动类型') From 81be07210be9340dfe8147ff15da9262652dabb1 Mon Sep 17 00:00:00 2001 From: liuye Date: Mon, 20 Dec 2021 16:32:08 +0800 Subject: [PATCH 3/4] =?UTF-8?q?=E7=89=B9=E6=AE=8A=E4=BA=BA=E7=BE=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../AppSpecialPeople/components/detail.vue | 151 +++++++++++------- 1 file changed, 96 insertions(+), 55 deletions(-) diff --git a/src/apps/AppSpecialPeople/components/detail.vue b/src/apps/AppSpecialPeople/components/detail.vue index 289fd8df..9465ec9f 100644 --- a/src/apps/AppSpecialPeople/components/detail.vue +++ b/src/apps/AppSpecialPeople/components/detail.vue @@ -15,7 +15,7 @@
- +
@@ -23,73 +23,44 @@
特殊人群
-
-

18

-

残疾人

-
-
-

18

-

精神疾病患者

-
-
-

18

-

社区矫正人群

-
-
-

18

-

吸毒人员

-
-
-

18

-

刑满释放人员

+
+

{{item.value}}

+

{{item.label}}

+
本月新增
-
-

18

-

残疾人

-
-
-

18

-

精神疾病患者

-
-
-

18

-

社区矫正人群

-
-
-

18

-

吸毒人员

-
-
-

18

-

刑满释放人员

-
+
+

{{item.value}}

+

{{item.label}}

+
+
-
-
-

精神病患者

- +
+
+

{{item.label}}

+
-
-
+
+
+

{{'暂无' + item.label + '信息'}}