From 8b679c8269611f389929af0a8d87cafc30159183 Mon Sep 17 00:00:00 2001 From: quanyawei <401863037@qq.com> Date: Thu, 21 Sep 2023 10:24:07 +0800 Subject: [PATCH] fix:政府站点修改 --- src/components/map/pickCoordinate1.vue | 159 +++++++++++++++++++++++------------------------------ 1 files changed, 69 insertions(+), 90 deletions(-) diff --git a/src/components/map/pickCoordinate1.vue b/src/components/map/pickCoordinate1.vue index 26078de..255a951 100644 --- a/src/components/map/pickCoordinate1.vue +++ b/src/components/map/pickCoordinate1.vue @@ -1,13 +1,6 @@ <template> - <a-modal - title="������������" - destroyOnClose - :visible="true" - @ok="addLonAndLat" - @cancel="handleMapCancel" - okText="������" - class="modalStyle" - > + <a-modal title="������������" destroyOnClose :visible="true" @ok="addLonAndLat" @cancel="handleMapCancel" okText="������" + class="modalStyle"> <div> <div style="display: flex"> <div style="display: flex; width: 300px"> @@ -24,15 +17,12 @@ style="width: 160px; height: 26px" @change="searchMap" ></a-input> --> - <input v-model="input" id="tipinput" /><button - @click="searchAddress" - style=" + <input v-model="input" id="tipinput" /><button @click="searchAddress" style=" background-color: #1890ff; color: white; border: none; margin-left: 5px; - " - > + "> ������ </button> <div id="panel"></div> @@ -52,34 +42,17 @@ <!-- <a-input style="width: 160px; height: 26px" @focus="selectPoi" /> --> </div> <div> - <span style="margin-left: 25px">���������</span - ><a-input - v-model="clickPoint[0]" - style="display: inline; width: 160px; height: 26px" - /> + <span style="margin-left: 25px">���������</span><a-input v-model="clickPoint[0]" + style="display: inline; width: 160px; height: 26px" /> </div> <div> - <span style="margin-left: 25px">���������</span - ><a-input - v-model="clickPoint[1]" - style="display: inline; width: 160px; height: 26px" - /> + <span style="margin-left: 25px">���������</span><a-input v-model="clickPoint[1]" + style="display: inline; width: 160px; height: 26px" /> </div> </div> - <el-amap - ref="map" - :center="clickPoint" - :events="{ click: mapClick }" - :zoom="zoom" - :scroll-wheel-zoom="true" - style="height: 400px; width: 100%; margin-top: 20px" - id="amap" - > - <el-amap-marker - :position="clickPoint" - animation="AMAP_ANIMATION_BOUNCE" - :dragging="true" - ></el-amap-marker> + <el-amap ref="map" :center="clickPoint" :events="{ click: mapClick }" :zoom="zoom" :scroll-wheel-zoom="true" + style="height: 400px; width: 100%; margin-top: 20px" id="amap"> + <el-amap-marker :position="clickPoint" animation="AMAP_ANIMATION_BOUNCE" :dragging="true"></el-amap-marker> </el-amap> <!-- :scroll-wheel-zoom="true"--> @@ -126,8 +99,8 @@ }) export default class PickCoordinate extends Vue { private center: any = [ - 120.726838, - 31.3421 + 120.726838, + 31.3421 ] @Prop({ type: String, @@ -143,18 +116,18 @@ private keyword: string = '' private zoom = 19 - private searchOption:any={ - city: '������', - citylimit: false + private searchOption: any = { + city: '������', + citylimit: false } - @Watch('clickPoint', {deep: true, immediate: true},) + @Watch('clickPoint', { deep: true, immediate: true },) private monitorMapFlag(newVal: any, oldVal: any) { - console.log(newVal,'newVal'); - this.center= [newVal.lng,newVal.lat] + console.log(newVal, 'newVal'); + this.center = [newVal.lng, newVal.lat] } - private num1:any=1 + private num1: any = 1 - @Watch('lnglat', {deep: true, immediate: true}) + @Watch('lnglat', { deep: true, immediate: true }) private lnglatWatch(newVal: any, oldVal: any) { console.log('------------'); console.log(newVal); @@ -165,53 +138,53 @@ // console.log(this.clickPoint,'clickPoint'); } - private input:any='' - private mark:any='' - + private input: any = '' + private mark: any = '' + private searchAddress() { - var map = new AMap.Map("amap", { - resizeEnable: true - }); - var placeSearch = new AMap.PlaceSearch({ - pageSize: 5, // ������������������������ - pageIndex: 1, // ������ - city: "������", // ��������������� - citylimit: false, //��������������������������������������������� - panel: "panel", // ��������������������������������������������� - map: map, // ��������������������������� - autoFitView: true // ������������������������������������������ Marker��������������������������������� - }); - //��������������� - placeSearch.search(this.input) - var salf=this - var markerone=0 - map.on('click',click); - function click(e){ - if(markerone===1){ - map.remove(map.Marker) - } - salf.mapClick(e) - map.Marker=new AMap.Marker({ - map: map, - position: salf.clickPoint, - animation:"AMAP_ANIMATION_BOUNCE" - }) - markerone=1 - } + var map = new AMap.Map("amap", { + resizeEnable: true + }); + var placeSearch = new AMap.PlaceSearch({ + pageSize: 5, // ������������������������ + pageIndex: 1, // ������ + city: "������", // ��������������� + citylimit: false, //��������������������������������������������� + panel: "panel", // ��������������������������������������������� + map: map, // ��������������������������� + autoFitView: true // ������������������������������������������ Marker��������������������������������� + }); + //��������������� + placeSearch.search(this.input) + var salf = this + var markerone = 0 + map.on('click', click); + function click(e) { + if (markerone === 1) { + map.remove(map.Marker) + } + salf.mapClick(e) + map.Marker = new AMap.Marker({ + map: map, + position: salf.clickPoint, + animation: "AMAP_ANIMATION_BOUNCE" + }) + markerone = 1 } + } // ��������������������������� - private clickPoint: any = this.lnglat === '' ? [ - 120.720262, - 31.335757 - ] : [ - this.lnglat.split(',')[1], - this.lnglat.split(',')[0] + private clickPoint: any = this.lnglat === '' ? [ + 120.720262, + 31.335757 + ] : [ + this.lnglat.split(',')[1], + this.lnglat.split(',')[0] ] private mapClick(e: any) { // console.log(e); - const { lng, lat } = e.lnglat - this.clickPoint=[ lng, lat] + const { lng, lat } = e.lnglat + this.clickPoint = [lng, lat] console.log(this.clickPoint); } @@ -238,13 +211,13 @@ @Emit('sendLonLat') private sendLonLat(lonLat: any) { - console.log(lonLat,'jia'); + console.log(lonLat, 'jia'); return lonLat; } @Emit('editLonLat') private editLonLat(lonLat: any) { - console.log(lonLat,'gai'); + console.log(lonLat, 'gai'); return lonLat; } } @@ -255,22 +228,27 @@ .ant-modal { margin-left: 25%; } + .ant-modal-content { width: 800px; } } + .BMap_cpyCtrl, .anchorBL { display: none; } + /* ���������������������logo */ /deep/.amap-logo { display: none; opacity: 0 !important; } + /deep/.amap-copyright { opacity: 0; } + .amap-sug-result { position: absolute; z-index: 9999 !important; @@ -278,6 +256,7 @@ border: 1px solid #d1d1d1; bottom: auto; } + #panel { z-index: 999; position: absolute; -- Gitblit v1.8.0