Explorar o código

定位中心点

zhupeng %!s(int64=3) %!d(string=hai) anos
pai
achega
c2a9950729

+ 74 - 0
components/Chargermap.vue

@@ -17,6 +17,7 @@
 				myStyle:"width: 100%; height: 1200rpx;",
 				chargerIcon:'',
 				chargerSelectedIcon:'',
+				positionIcon:'',
 				personIcon:'',
 				longitude: 112.276527,
 				latitude: 30.306427,
@@ -284,6 +285,21 @@
 				this.myEmit("person",marker,pos)
 				//this.chargerList.push(marker)
 			},
+			/*
+			addPosition() {
+				console.log('addPosition'+JSON.stringify(pos))
+				let marker = new AMap.Marker({
+					content: "<img src='"+this.positionIcon+"' style='height: 40px;width: 40px' />",
+					//icon: "//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png",
+					//position: [pos.longitude,pos.latitude],
+					offset: new AMap.Pixel(20, 220),
+					zIndex:900,
+					autoRotation: true,
+				});
+				marker.setMap(this.mapcharger);
+				//this.myEmit("person",marker,pos)
+				//this.chargerList.push(marker)
+			},*/
 			setChargerList(sz){
 					
 					if(this.AMap==null){
@@ -387,6 +403,7 @@
 			init(){
 //				console.log('init')
 				var _this = this;
+//				this.positionIcon = require('@/static/img/location.png')
 //				this.personIcon = require("@/static/img/charger_selected.png")
 				// this.chargerIcon = require("@/static/img/charger.png");
 				// this.chargerSelectedIcon =  require("@/static/img/charger_selected_circle.png");
@@ -402,11 +419,68 @@
 						center: [this.longitude, this.latitude],
 						zoom: 14
 					});
+					/*
+					new SimpleMarker({
+					            iconLabel: '2',
+					            //自定义图标节点(img)的属性
+					            iconStyle: {
+					
+					                src: '@/static/img/location.png',
+					                style: {
+					                    width: '20px',
+					                    height: '30px'
+					                }
+					            },
+					  //设置基点偏移
+								offset: new AMap.Pixel(-10, -30),
+					
+								map: map,
+								showPositionPoint: true,
+								position: lngLats[1],
+								zIndex: 200
+							});
+*/
+					 /*
+					_this.mapcharger.plugin('AMap.Geolocation', function () {
+					        var geolocation = new AMap.Geolocation({
+					            enableHighAccuracy: true,
+					            timeout: 10000,
+					            buttonOffset: new AMap.Pixel(10, 220),
+					            zoomToAccuracy: true,
+					            buttonPosition: 'RB'
+					        });
+					        _this.mapcharger.center = geolocation;
+					        _this.mapcharger.addControl(geolocation);//地图控件右下角显示当前位置
+					    });
+					
+					_this.mapcharger.plugin(["AMap.ToolBar"],function(){
+					    //加载工具条
+					    var tool = new AMap.ToolBar({
+							locate:true,
+							direction:false,
+							ruler:false,
+							liteStyle:true,
+							useNative:true,
+//							autoPosition:true,
+//							locationMarker:
+						});
+					    _this.mapcharger.addControl(tool);    
+					});*/
+					/*
+					_this.mapcharger.plugin(["AMap.ControlBar"],function(){
+					    var controlBar = new AMap.ControlBar({
+							showZoomBar:true,
+							showControlButton:true,
+							position:{top:'10px',right:'10px'}
+						})
+					    _this.mapcharger.addControl(controlBar)
+					});*/
 					//var clickHandler = function(e) {
 					//	console.log('您在[ '+e.lnglat.getLng()+','+e.lnglat.getLat()+' ]的位置点击了地图!');
 					//};
 					//_this.mapcharger.on('click', clickHandler); 
 					_this.$emit('onload')
+					//_this.addPosition();
 					_this.listenMove();
 					
 				}, e => {

+ 21 - 1
pages/searchPile/searchPile.vue

@@ -166,8 +166,9 @@
 				<view>
 					<Chargermap   @onMoveEnd="moveEnd" ref="amap" @onload="mapdown" @clickMap="clickMap"></Chargermap>
 					<!--@location="location"-->
+					<u-image style='position:absolute;z-index:1024;right:20px;bottom:260px;' src="@/static/img/location.png" width="30px" height="30px" @click="setCenter"></u-image>
+					 
 				</view>
-				 
 				<view v-if="stationsmap.length>0" class="chargerCard" style="border-radius: 20rpx;" > 
 					<swiper :current="currentIndex" @change="swiperChange" @transition="swiperTransition" style="height: 100%;">
 					 	<swiper-item v-for="(item,index) in stationsmap" :key="item.id" style="height: 100%;">							 
@@ -258,6 +259,7 @@ export default {
 	},
 	data() {
 		return {
+			centerImg:'@/static/img/location.png',
 			currentIndex:-1,
 			navBarHeight:88,
 			viewMode: true, //地图
@@ -358,6 +360,24 @@ export default {
 		this.end();
 	},
 	methods: {
+		setCenter(){
+			console.log('getPoint')
+			WxJsApi.getLocation().then((res) => {
+				
+				_self.latitude = parseFloat(res.latitude);
+				_self.longitude = parseFloat(res.longitude);
+				//let data = {position:{latitude:latitude,longitude:longitude}};
+			 
+				 let posCenter= {longitude: _self.longitude,latitude: _self.latitude};
+				 this.$refs.amap.setCenter(posCenter);
+			}).catch(error => {
+				uni.showToast({
+					title:JSON.stringify(error)
+				})					
+			})
+			
+//			console.log('setCenter')
+		},
 		getScanCode() {
 			if (this.userId) {
 				WxJsApi.scanQRCode(1).then(res => {

+ 52 - 18
pages/searchPile/stationAndPile/stationDetailsMap.vue

@@ -5,6 +5,7 @@
 			 
 			<view>
 				<Chargermap   ref="amap" @onload="mapdown" @clickMap="clickMap"></Chargermap>
+				<u-image style='position:absolute;z-index:1024;right:20px;bottom:220px;' src="@/static/img/location.png" width="30px" height="30px" @click="setCenter"></u-image>
 			</view>
 			 
 			 <view class="chargerCard" @click="stationDetail(item)">
@@ -49,7 +50,7 @@
 				 		</view>
 				 	</view>
 				 	<view class="card_item" style="padding-bottom: 20rpx;">
-				 		<u-button shape='circle' style="color: #00B962;" @click="charge">
+				 		<u-button shape='circle' style="color: #00B962;" @click="getScanCode">
 				 			<u-icon name="scan" size="26" color="#00B962" style="margin-right: 20rpx;"></u-icon>
 				 			<label>扫码充电</label></u-button>
 				 		<view class="round">
@@ -71,13 +72,17 @@
 
 <script>
 	let _self;
+	import * as indexAPI from '@/apis/index.js'
 	import Chargermap from '@/components/Chargermap.vue';
+	import * as WxJsApi from '@/utils/wxJsApi.js'
+	import MapLoader from '@/utils/AMap'
 	export default {
 		components: {
 			Chargermap 
 		},
 		data() {
 			return {
+				userId:'',
 				id: '',
 				longitude: 112.28468,
 				latitude: 30.307094,
@@ -104,25 +109,45 @@
 					url:'stationDetails?station='+encodeURIComponent(JSON.stringify(this.item))
 				})
 			},
-			charge(){
-				 console.log('扫码充电')
-				//#ifdef MP-WEIXIN
-				uni.scanCode({
-					success:function(res){
-						uni.navigateTo({
-							url:'chargingPileDetails?pile='+encodeURIComponent(JSON.stringify(data))
-						})
-						
-					}
-				}) 
-				return;
-				//#endif
+			setCenter(){
+				console.log('getPoint')
+				WxJsApi.getLocation().then((res) => {
+					
+					_self.latitude = parseFloat(res.latitude);
+					_self.longitude = parseFloat(res.longitude);
+					//let data = {position:{latitude:latitude,longitude:longitude}};
 				 
-				 console.log('扫码充电1')
-				 uni.navigateTo({
-				 	url:'chargingPileDetails'
-				 })
+					 let posCenter= {longitude: _self.longitude,latitude: _self.latitude};
+					 this.$refs.amap.setCenter(posCenter);
+				}).catch(error => {
+					uni.showToast({
+						title:JSON.stringify(error)
+					})					
+				})
 				
+	//			console.log('setCenter')
+			},
+			getScanCode() {
+				if (this.userId) {
+					WxJsApi.scanQRCode(1).then(res => {
+						if(res) {
+							indexAPI.scanCode(res).then((response) => {
+						
+							}).catch(error => {
+								uni.showToast({
+									title: error,
+									icon: "none"
+								})
+							})
+						}
+					}).catch(error => {
+			
+					})
+				} else {
+					uni.navigateTo({
+						url: '/pages/login/login'
+					})
+				}
 			},
 			mapdown() { 
 						var obj = {
@@ -162,6 +187,15 @@
 			onReady() {
 				//		console.log('longitude2  '+this.longitude)
 				//		console.log('latitude2  '+this.latitude) 
+				if (this.carhelp.getPersonInfo()) {
+					this.userId = this.carhelp.getPersonInfo().id;
+							
+				}
+				WxJsApi.getWxConfig(['getLocation', 'addEventListener', 'scanQRCode']).then((res) => {
+					// console.log(res)
+				}).catch(error => {
+					console.log(res)
+				})
 				this.isReady = true;
 				this.$refs.amap.init();
 				 

BIN=BIN
static/img/location.png