From b487b91abd2a0d769b82ddf90924f93afe9b05b3 Mon Sep 17 00:00:00 2001
From: quanyawei <401863037@qq.com>
Date: Mon, 22 Apr 2024 13:17:21 +0800
Subject: [PATCH] Merge branch 'feature_1.0'
---
src/components/map/pickCoordinate1.vue | 197 ++++++++++++++++++-------------------------------
1 files changed, 72 insertions(+), 125 deletions(-)
diff --git a/src/components/map/pickCoordinate1.vue b/src/components/map/pickCoordinate1.vue
index c20c495..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,7 +17,12 @@
style="width: 160px; height: 26px"
@change="searchMap"
></a-input> -->
- <input v-model="input" id="tipinput" /><button @click="searchAddress">
+ <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>
@@ -44,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"-->
@@ -118,8 +99,8 @@
})
export default class PickCoordinate extends Vue {
private center: any = [
- 120.726838,
- 31.3421
+ 120.726838,
+ 31.3421
]
@Prop({
type: String,
@@ -135,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);
@@ -157,93 +138,53 @@
// console.log(this.clickPoint,'clickPoint');
}
- // ���������������
- // private handler({BMap, map}) {
- // this.center.lng = this.typeOperation === 'add' ? '120.726838' : this.lnglat.split(',')[1]
- // this.center.lat = this.typeOperation === 'add' ? '31.3421' : this.lnglat.split(',')[0]
- // this.zoom = 19
+ private input: any = ''
+ private mark: any = ''
- // }
- // private selectPoi(e){
- // console.log(e);
- // let poi = e
- // if (poi.length > 0) {
- // this.clickPoint = [poi[0].lng, poi[0].lat]
- // }
- // }
- private input:any=''
- private mark:any=''
- // private searchMap(){
- // var autoOptions = {
- // input: "tipinput"
- // };
- // var self=this
- // var auto = new AMap.Autocomplete(autoOptions);
- // const placeSearch = new AMap.PlaceSearch(self.input);
- // // console.log(window);
- // auto.on("select", select);//������������������������������������������������
- // function select(e) {
- // placeSearch.setCity(e.poi.adcode);
- // placeSearch.search(e.poi.name); //���������������������
- // self.clickPoint = [e.poi.location.lng, e.poi.location.lat]
- // }
- // }
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
- }
- // function click(e){
- // console.log(e);
- // salf.clickPoint=[e.lnglat.lng,e.lnglat.lat]
- // }
- // placeSearch.search(this.input,function(status, result){
- // console.log(result);
- // auto.on('click',click);
- // function click(e){
- // console.log(e);
- // }
- // });
- // console.log(this.input);
+ 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);
}
@@ -270,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;
}
}
@@ -287,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;
@@ -310,6 +256,7 @@
border: 1px solid #d1d1d1;
bottom: auto;
}
+
#panel {
z-index: 999;
position: absolute;
--
Gitblit v1.8.0