moral_manage.git

			@@ -9,25 +9,76 @@
			class="modalStyle"
			>
			<div>
			<p>
			<span>地址：</span
			><a-input
			v-model="keyword"
			style="display: inline; width: 160px; height: 26px"
			/>
			<span style="margin-left: 25px">经度：</span
			><a-input
			v-model="clickPoint.lng"
			style="display: inline; width: 160px; height: 26px"
			/>
			<span style="margin-left: 25px">纬度：</span
			><a-input
			v-model="clickPoint.lat"
			style="display: inline; width: 160px; height: 26px"
			/>
			</p>
			<div style="display: flex">
			<div style="display: flex; width: 300px">
			<div>地址：</div>
			<!-- <a-input
			placeholder="关键字搜索"
			id="tipinput"
			style="width: 160px; height: 26px"
			></a-input> -->
			<!-- <a-input
			v-model="input"
			placeholder="关键字搜索"
			id="tipinput"
			style="width: 160px; height: 26px"
			@change="searchMap"
			></a-input> -->
			<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>
			<!-- <a-button
			size="small"
			type="primary"
			@click="searchMap"
			style="margin-left: 10px"
			>搜索</a-button
			> -->

			<!-- <el-amap-search-box
			:search-option="searchOption"
			:on-search-result="selectPoi"
			style="width: 200px; height: 26px; margin-left: 10px;border;"
			/> -->
			<!-- <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"
			/>
			</div>
			<div>
			<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>

			<!-- :scroll-wheel-zoom="true"-->
			<baidu-map
			<!-- <baidu-map
			:center="center"
			:zoom="zoom"
			@ready="handler"
			@@ -48,7 +99,7 @@
			>
			</bm-marker>
			</bm-control>
			</baidu-map>
			</baidu-map> -->
			</div>
			</a-modal>
			</template>
			@@ -62,15 +113,17 @@
			} from 'vue-property-decorator';
			import any = jasmine.any;
			import { get, post } from "@/util/request";
			import $ from 'jquery'
			import func from 'vue-temp/vue-editor-bridge';


			@Component({
			})
			export default class PickCoordinate extends Vue {
			private center: any = {
			lng: 120.726838,
			lat: 31.3421
			}
			private center: any = [
			120.726838,
			31.3421
			]
			@Prop({
			type: String,
			default: ''
			@@ -84,13 +137,17 @@
			private typeOperation!: string

			private keyword: string = ''
			private zoom = 3

			@Watch('clickPoint', {deep: true})
			private monitorMapFlag(newVal: any, oldVal: any) {
			this.center.lng = newVal.lng
			this.center.lat = newVal.lat
			private zoom = 19
			private searchOption:any={
			city: '全国',
			citylimit: false
			}
			@Watch('clickPoint', {deep: true, immediate: true},)
			private monitorMapFlag(newVal: any, oldVal: any) {
			console.log(newVal,'newVal');
			this.center= [newVal.lng,newVal.lat]
			}
			private num1:any=1

			@Watch('lnglat', {deep: true, immediate: true})
			private lnglatWatch(newVal: any, oldVal: any) {
			@@ -100,32 +157,97 @@
			// this.center.lat = newVal.lat
			}
			private created() {

			// 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 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 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);
			}
			// 初始定位到星虹国际
			private clickPoint: any = this.lnglat === '' ? {
			lng: ' 120.726838',
			lat: ' 31.3421'
			} : {
			lng: this.lnglat.split(',')[1],
			lat: 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) {
			const { lng, lat } = e.point
			this.clickPoint.lng = lng
			this.clickPoint.lat = lat
			// console.log(e);
			const { lng, lat } = e.lnglat
			this.clickPoint=[ lng, lat]
			console.log(this.clickPoint);
			}

			private handleMapCancel() {
			@@ -135,11 +257,12 @@

			private addLonAndLat() {
			if (this.typeOperation === 'add') {
			console.log('add');
			this.sendLonLat(this.clickPoint)
			} else {
			console.log('upa');
			this.editLonLat(this.clickPoint)
			}

			this.flagSend(false)
			}

			@@ -150,17 +273,19 @@

			@Emit('sendLonLat')
			private sendLonLat(lonLat: any) {
			console.log(lonLat,'jia');
			return lonLat;
			}

			@Emit('editLonLat')
			private editLonLat(lonLat: any) {
			console.log(lonLat,'gai');
			return lonLat;
			}
			}
			</script>

			<style lang="less">
			<style lang="less" scoped>
			.modalStyle {
			.ant-modal {
			margin-left: 25%;
			@@ -173,4 +298,29 @@
			.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;
			background-color: #fefefe;
			border: 1px solid #d1d1d1;
			bottom: auto;
			}
			#panel {
			z-index: 999;
			position: absolute;
			background-color: white;
			max-height: 100%;
			overflow-y: auto;
			left: 25px;
			width: 280px;
			top: 126px;
			}
			</style>