From 039184942f375b09cb6396f9c75de64962cbea75 Mon Sep 17 00:00:00 2001 From: WenShiJun Date: Sat, 6 Jul 2024 16:06:01 +0800 Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E9=A1=B5=E9=9D=A2=E6=B7=BB?= =?UTF-8?q?=E5=8A=A0=E5=9C=B0=E5=9B=BE=E9=80=89=E7=82=B9=E8=8E=B7=E5=8F=96?= =?UTF-8?q?=E7=BB=8F=E7=BA=AC=E5=BA=A6=20=E8=BF=90=E8=BE=93=E8=AF=A6?= =?UTF-8?q?=E6=83=85=E9=A1=B5=E9=80=BB=E8=BE=91=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../assurance_management/components/list.vue | 193 +++++++++++++++- .../components/detail.vue | 210 ++++++++++-------- .../components/list.vue | 201 ++++++++++++++++- 3 files changed, 500 insertions(+), 104 deletions(-) diff --git a/src/views/emergen_cyrescue/emergency_information/security_agency/assurance_management/components/list.vue b/src/views/emergen_cyrescue/emergency_information/security_agency/assurance_management/components/list.vue index c44d1f2..c30c370 100644 --- a/src/views/emergen_cyrescue/emergency_information/security_agency/assurance_management/components/list.vue +++ b/src/views/emergen_cyrescue/emergency_information/security_agency/assurance_management/components/list.vue @@ -77,12 +77,25 @@ no-children-text="暂无数据" /> - - - - - - + + + + + + + + +
+ + + + + + +
+ + + @@ -152,7 +165,38 @@ 确定 + + + + + +
+
关键词：
+
+ +
+ + +
+ + + +
+ 经度： + + 纬度： + + 取 消 + 确 定 +
+ @@ -165,6 +209,21 @@ export default { components: { Treeselect, Pagination }, data() { return { + // 地图相关 + CORPINFO_ID: this.$parent.CORPINFO_ID, + clientHeight: 600, + loadingMap: true, + listLoading: false, + buttonloading: false, + BMap: '', + map: '', + showMap: false, + addressKeyword: '', + pointLngLat: '', + zoom: 10, + dialogFormMap: false, + LATITUDE: '', + LONGITUDE: '', listQuery: { page: 1, limit: 10 @@ -376,8 +435,126 @@ export default { console.error('获取树形数据失败', e) }) }, - //* *******************列表查询****************************** + //* **************地图相关***************** + // 地图相关 + mapOpen() { + this.top = this.getScrollTop() + if (this.top) { + this.setScrollTop(0) + } + }, + // 关闭地图后调用 + mapClose() { + this.setScrollTop(this.top) + this.top = 0 + this.showMap = false + }, + getScrollTop() { + let scrollTop = 0 + if (document.documentElement && document.documentElement.scrollTop) { + scrollTop = document.documentElement.scrollTop + } else if (document.body) { + scrollTop = document.body.scrollTop + } + return scrollTop + }, + setScrollTop(top) { + if (!isNaN(top)) { + if (document.documentElement && document.documentElement.scrollTop !== undefined) { + document.documentElement.scrollTop = top + } else if (document.body) { + document.body.scrollTop = top + } + } + }, + // 地图初始化 + handler({ BMap, map }) { + this.mapOpen() + this.BMap = BMap + this.map = map + this.loadingMap = true + var geolocation = new BMap.Geolocation() + const myGeo = new BMap.Geocoder() + var $this = this + // 调用百度地图api 中的获取当前位置接口 + geolocation.getCurrentPosition(function(r) { + myGeo.getLocation(new BMap.Point(r.point.lng, r.point.lat), function(result) { + if (result) { + $this.loadingMap = false + $this.$set($this, 'pointLngLat', { lng: result.point.lng, lat: result.point.lat }) + map.enableScrollWheelZoom(true) // 开启鼠标滚轮缩放,默认关闭 + $this.setCenter({ BMap, map }) + } + }) + }) + }, + // 搜索地图 + querySearch(queryString, cb) { + var options = { + onSearchComplete: function(results) { + if (local.getStatus() === 0) { + // 判断状态是否正确 + var s = [] + for (var i = 0; i < results.getCurrentNumPois(); i++) { + var x = results.getPoi(i) + var item = { value: x.address + x.title, point: x.point } + s.push(item) + cb(s) + } + } else { + cb() + } + } + } + var local = new this.BMap.LocalSearch(this.map, options) + local.search(queryString) + }, + handleSelect(item) { + var { point } = item + this.map.clearOverlays() // 清除地图上所有覆盖物 + this.map.centerAndZoom(point, this.zoom) + const marker = new this.BMap.Marker(point) // 创建标注 + this.map.addOverlay(marker) // 将标注添加到地图中 + marker.enableDragging() // 可拖拽 + this.LONGITUDE = point.lng + this.LATITUDE = point.lat + }, + // 设置打开中心位置 + setCenter({ BMap, map }) { + var lng = '' + var lat = '' + if (this.form.LONGITUDE == '' || this.form.LATITUDE == '') { + lng = '119.525971' + lat = '39.894727' + } else { + lng = this.form.LONGITUDE + lat = this.form.LATITUDE + } + var point = new BMap.Point(lng, lat) + // var point = new BMap.Point(this.form.LONGITUDE, this.form.LATITUDE) + const zoom = map.getZoom() + setTimeout(() => { + map.centerAndZoom(point, zoom) + }, 0) + // var marker = new BMap.Marker(point) // 创建标注 + // map.addOverlay(marker) // 将标注添加到地图中 + }, + handleMap() { + this.dialogFormMap = true + this.LATITUDE = this.form.LATITUDE + this.LONGITUDE = this.form.LONGITUDE + }, + getClickInfo(e) { + this.LONGITUDE = e.point.lng + this.LATITUDE = e.point.lat + }, + setPosition() { + this.dialogFormMap = false + this.form.LATITUDE = this.LATITUDE + this.form.LONGITUDE = this.LONGITUDE + }, + //* *******************列表查询****************************** getList() { this.listLoading = true requestFN( @@ -454,6 +631,8 @@ export default { handleAdd() { this.dialogFormEdit = true this.form = {} + this.form.LONGITUDE = '' + this.form.LATITUDE = '' this.dialogType = 'saveUser' this.$refs.upload.clearFiles() }, diff --git a/src/views/emergen_cyrescue/emergency_information/security_agency/transportation_management/components/detail.vue b/src/views/emergen_cyrescue/emergency_information/security_agency/transportation_management/components/detail.vue index 48f12e5..70b0371 100644 --- a/src/views/emergen_cyrescue/emergency_information/security_agency/transportation_management/components/detail.vue +++ b/src/views/emergen_cyrescue/emergency_information/security_agency/transportation_management/components/detail.vue @@ -1,66 +1,116 @@ - + diff --git a/src/views/emergen_cyrescue/emergency_information/security_agency/transportation_management/components/list.vue b/src/views/emergen_cyrescue/emergency_information/security_agency/transportation_management/components/list.vue index d420212..1e99448 100644 --- a/src/views/emergen_cyrescue/emergency_information/security_agency/transportation_management/components/list.vue +++ b/src/views/emergen_cyrescue/emergency_information/security_agency/transportation_management/components/list.vue @@ -74,12 +74,25 @@ no-children-text="暂无数据" /> - - - - - - + + + + + + + + +
+ + + + + + +
+ + + @@ -117,6 +130,7 @@ placeholder="请选择主管单位" no-options-text="暂无数据" no-children-text="暂无数据" + @input="handleDepartmentChange" /> @@ -143,6 +157,38 @@ 确 定 + + + + + +
+ +
关键词：
+
+ +
+ + +
+ + + +
+ 经度： + + 纬度： + + 取 消 + 确 定 +
+ @@ -155,6 +201,21 @@ export default { components: { Treeselect, Pagination }, data() { return { + // 地图相关 + CORPINFO_ID: this.$parent.CORPINFO_ID, + clientHeight: 600, + loadingMap: true, + listLoading: false, + buttonloading: false, + BMap: '', + map: '', + showMap: false, + addressKeyword: '', + pointLngLat: '', + zoom: 10, + dialogFormMap: false, + LATITUDE: '', + LONGITUDE: '', listQuery: { page: 1, limit: 10 @@ -189,6 +250,7 @@ export default { CONTACT_HOME_PHONE: '', CONTACT_EMAIL: '', SUPERVISING_UNIT: '', + SUPERVISING_UNIT_NAME: '', SUPERVISING_UNIT_ADDRESS: '', COMPANY_OVERVIEW: '', PASSENGER_TRANSPORT_CAPACITY: '', @@ -325,6 +387,12 @@ export default { this.getDepartmentList() }, methods: { + handleDepartmentChange(value) { + const selectedDepartment = this.DepartmentData.find(department => department.id === value) + if (selectedDepartment) { + this.form.SUPERVISING_UNIT_NAME = selectedDepartment.label + } + }, resetQuery() { this.KEYWORDS_ORG_NAME = '' this.KEYWORDS_ORG_TYPE = '' @@ -355,6 +423,124 @@ export default { console.error('获取树形数据失败', e) }) }, + //* **************地图相关***************** + // 地图相关 + mapOpen() { + this.top = this.getScrollTop() + if (this.top) { + this.setScrollTop(0) + } + }, + // 关闭地图后调用 + mapClose() { + this.setScrollTop(this.top) + this.top = 0 + this.showMap = false + }, + getScrollTop() { + let scrollTop = 0 + if (document.documentElement && document.documentElement.scrollTop) { + scrollTop = document.documentElement.scrollTop + } else if (document.body) { + scrollTop = document.body.scrollTop + } + return scrollTop + }, + setScrollTop(top) { + if (!isNaN(top)) { + if (document.documentElement && document.documentElement.scrollTop !== undefined) { + document.documentElement.scrollTop = top + } else if (document.body) { + document.body.scrollTop = top + } + } + }, + // 地图初始化 + handler({ BMap, map }) { + this.mapOpen() + this.BMap = BMap + this.map = map + this.loadingMap = true + var geolocation = new BMap.Geolocation() + const myGeo = new BMap.Geocoder() + var $this = this + // 调用百度地图api 中的获取当前位置接口 + geolocation.getCurrentPosition(function(r) { + myGeo.getLocation(new BMap.Point(r.point.lng, r.point.lat), function(result) { + if (result) { + $this.loadingMap = false + $this.$set($this, 'pointLngLat', { lng: result.point.lng, lat: result.point.lat }) + map.enableScrollWheelZoom(true) // 开启鼠标滚轮缩放,默认关闭 + $this.setCenter({ BMap, map }) + } + }) + }) + }, + // 搜索地图 + querySearch(queryString, cb) { + var options = { + onSearchComplete: function(results) { + if (local.getStatus() === 0) { + // 判断状态是否正确 + var s = [] + for (var i = 0; i < results.getCurrentNumPois(); i++) { + var x = results.getPoi(i) + var item = { value: x.address + x.title, point: x.point } + s.push(item) + cb(s) + } + } else { + cb() + } + } + } + var local = new this.BMap.LocalSearch(this.map, options) + local.search(queryString) + }, + handleSelect(item) { + var { point } = item + this.map.clearOverlays() // 清除地图上所有覆盖物 + this.map.centerAndZoom(point, this.zoom) + const marker = new this.BMap.Marker(point) // 创建标注 + this.map.addOverlay(marker) // 将标注添加到地图中 + marker.enableDragging() // 可拖拽 + this.LONGITUDE = point.lng + this.LATITUDE = point.lat + }, + // 设置打开中心位置 + setCenter({ BMap, map }) { + var lng = '' + var lat = '' + if (this.form.LONGITUDE == '' || this.form.LATITUDE == '') { + lng = '119.525971' + lat = '39.894727' + } else { + lng = this.form.LONGITUDE + lat = this.form.LATITUDE + } + var point = new BMap.Point(lng, lat) + // var point = new BMap.Point(this.form.LONGITUDE, this.form.LATITUDE) + const zoom = map.getZoom() + setTimeout(() => { + map.centerAndZoom(point, zoom) + }, 0) + // var marker = new BMap.Marker(point) // 创建标注 + // map.addOverlay(marker) // 将标注添加到地图中 + }, + handleMap() { + this.dialogFormMap = true + this.LATITUDE = this.form.LATITUDE + this.LONGITUDE = this.form.LONGITUDE + }, + getClickInfo(e) { + this.LONGITUDE = e.point.lng + this.LATITUDE = e.point.lat + }, + setPosition() { + this.dialogFormMap = false + this.form.LATITUDE = this.LATITUDE + this.form.LONGITUDE = this.LONGITUDE + }, //* *******************列表查询****************************** getList() { @@ -410,6 +596,7 @@ export default { CONTACT_HOME_PHONE: data.CONTACT_HOME_PHONE, CONTACT_EMAIL: data.CONTACT_EMAIL, SUPERVISING_UNIT: data.SUPERVISING_UNIT, + SUPERVISING_UNIT_NAME: data.SUPERVISING_UNIT_NAME, SUPERVISING_UNIT_ADDRESS: data.SUPERVISING_UNIT_ADDRESS, COMPANY_OVERVIEW: data.COMPANY_OVERVIEW, PASSENGER_TRANSPORT_CAPACITY: data.PASSENGER_TRANSPORT_CAPACITY, @@ -425,6 +612,8 @@ export default { handleAdd() { this.dialogFormEdit = true this.form = {} + this.form.LONGITUDE = '' + this.form.LATITUDE = '' this.dialogType = 'saveUser' this.$refs.upload.clearFiles() },