地图直线距离计算。

components/Chargermap.vue

@@ -176,6 +176,7 @@
 			},
 			calculateDistance(startLngLat,endLngLat){
 				
+				
 				var _this = this;
 				//var endLngLat = [item.longitude,item.latitude];
 				return new Promise((resolve, reject) => {
@@ -184,19 +185,10 @@
 						// 驾车路线规划策略，AMap.DrivingPolicy.LEAST_TIME是最快捷模式
 						policy: AMap.DrivingPolicy.LEAST_TIME
 					  })
-					  
-					 //var startLngLat = [116.379028, 39.865042]
-					 //var endLngLat = [116.427281, 39.903719]
+					   
 					 
 					  driving.search(startLngLat, endLngLat, function (status, result) {
-							//console.log(result)
-							//console.log(result.routes[0].time)//秒
-							//console.log(result.routes[0].distance)//米
-							//item.distance = result.routes[0].distance/1000;
-							//item.time = result.routes[0].time/60;
-							/*uni.showToast({
-								title:result.routes[0].time+"秒，"+result.routes[0].distance+"米"
-							})*/
+							 
 							resolve(result.routes[0])
 					  })
 					  /*
@@ -216,53 +208,53 @@
 				})
 			 
 			},
-			searchBtn(startLngLat,endLst){
+			calcDistances(startLngLat,endLst){
 				var _this = this;
 				
+				console.log('endLst'+JSON.stringify(endLst));
+				for(let i=0;i< endLst.length;i++)
+				 {
+					 let item = endLst[i];
+					 let endLngLat = [item.longitude,item.latitude]
+				 	 //if(endLst[i].distance == null){
+						 var lnglat = new AMap.LngLat(startLngLat[0],startLngLat[1]);
+						 var myDistance = lnglat.distance(endLngLat);
+						 //_self.stationDetail.station.distance = myDistance/1000;
+						 //_self.stationDetail.station.time = myDistance/500;  
+						 endLst[i].distance = myDistance/1000.0;
+						 endLst[i].time = myDistance/500.0; 	
+						 
+					 /*}else{
+						 endLst[i].time = endLst[i].distance/500.0; 	
+					 }*/
+					 
+				}
+				
+				/*
 				AMap.plugin('AMap.Driving', function() {
 				  var driving = new AMap.Driving({
 					// 驾车路线规划策略，AMap.DrivingPolicy.LEAST_TIME是最快捷模式
 					policy: AMap.DrivingPolicy.LEAST_TIME
 				  })
-				  
-				 //var startLngLat = [_this.longitude, _this.latitude]
-				 //var endLngLat = [116.427281, 39.903719]
+				   
 				 for(let i=0;i< endLst.length;i++)
 				 {
 					 let item = endLst[i];
 					 let endLngLat = [item.longitude,item.latitude]
-//					 console.log('search start['+JSON.stringify(startLngLat))					 
-//					 console.log('search end]'+JSON.stringify(endLngLat))
-					 
+ 			 
 					  driving.search(startLngLat, endLngLat, function (status, result) {
-//							console.log(result)
-//							console.log('秒'+result.routes[0].time)//秒
-//							console.log('距离'+result.routes[0].distance)//米
-							//uni.showToast({
-							//	title:result.routes[0].time+"秒，"+result.routes[0].distance+"米"
-							//})
+ 
 							 endLst[i].distance = result.routes[0].distance/1000.0;
 							 endLst[i].time = result.routes[0].time/60.0;
 					  })
 					  
-					  //var startLngLat2 = [_this.longitude, _this.latitude]
-					  //var endLngLat2 = [_this.longitude2, _this.latitude2]
-					
-					 /* 
-					  driving.search(startLngLat2, endLngLat2, function (status, result) {
-												console.log(result)
-												console.log(result.routes[0].time)//秒
-												console.log(result.routes[0].distance)//米
-												uni.showToast({
-													title:result.routes[0].time+"秒，"+result.routes[0].distance+"米"
-												})
-					  })*/
+					 
 				}
 				 
-				}) 
+				}) */
 			},
 			updateCharger(pos){ 
-				console.log('更新充电桩1'+JSON.stringify(pos) ) 
+//				console.log('更新充电桩1'+JSON.stringify(pos) ) 
 //				let index = this.chargerList.findIndex(item => item.info.latitude === pos.latitude && item.info.longitude === pos.longitude);
 				//let index = this.chargerList.findIndex(item => (Math.abs(item.info.longitude-pos.longitude)<0.000001 && Math.abs(item.info.longitude - pos.latitude)<0.000001));
 				let index = this.chargerList.findIndex(item => item.info.id === pos.id);
@@ -487,7 +479,7 @@
 			}, 
 			logMapInfo() {
 			  var posCenter = this.mapcharger.getCenter();
-			  console.log('center'+JSON.stringify(posCenter));
+//			  console.log('center'+JSON.stringify(posCenter));
 			  var limitBounds = this.mapcharger.getBounds();
  			  let pos = {center:posCenter,bounds:limitBounds};
 			  return pos;
@@ -613,7 +605,7 @@
 			listenMove(){
 				var _this = this;
 				
-				console.log('listenMove')
+//				console.log('listenMove')
 				_this.mapcharger.on('movestart', mapMovestart,_this);
 				_this.mapcharger.on('mapmove', mapMove,_this);
 				_this.mapcharger.on('moveend',mapMoveend,_this); 

main.js

@@ -33,7 +33,7 @@ const app = new Vue({
 Vue.mixin({
 	updated: function() {
 		this.$nextTick(function() {
-			if (false) {
+			if (true) {
 				//  仅在整个视图都被重新渲染之后才会运行的代码
 				var list = document.getElementsByClassName("oldTextjp")
 				var relist = {
@@ -50,23 +50,23 @@ Vue.mixin({
 					}
 				}
 	
-				for (var i = 0; i < list.length; i++) {
-					var str = ""
+				// for (var i = 0; i < list.length; i++) {
+				// 	var str = ""
 
-					for (var j in relist) {
+				// 	for (var j in relist) {
 
-						var num = list[i].getAttribute(j);
+				// 		var num = list[i].getAttribute(j);
 
-						if (num) {
-							var k = relist[j]
-							k = k.replaceAll("[num]", num)
-							str += k + ";";
-						}
-					}
+				// 		if (num) {
+				// 			var k = relist[j]
+				// 			k = k.replaceAll("[num]", num)
+				// 			str += k + ";";
+				// 		}
+				// 	}
 
-					list[i].style = str
+				// 	list[i].style = str
 
-				}
+				// }
 			}
 
 

package-lock.json

@@ -8,6 +8,7 @@
     "compression-webpack-plugin": "^8.0.1",
     "echarts": "^5.3.2",
     "qrcodejs2": "^0.0.2",
+    "sass-mixins-variables": "^1.1.0",
     "uni-crazy-router": "0.0.31",
     "uni-simple-router": "^2.0.1",
     "uview-ui": "^1.8.4",
@@ -13406,6 +13407,11 @@
     "node": ">= 10.13.0"
    }
   },
+  "node_modules/sass-mixins-variables": {
+   "version": "1.1.0",
+   "resolved": "https://registry.npmmirror.com/sass-mixins-variables/-/sass-mixins-variables-1.1.0.tgz",
+   "integrity": "sha512-NHiyqWuI69WlHuqjTnD8xp14OEy2X8ussP8L1TTXZPvKFpizpDZxx7u1FHjv9QkkMyu4zIy/1JN8u6nF3AtBGQ=="
+  },
   "node_modules/sax": {
    "version": "1.2.4",
    "resolved": "https://registry.npmmirror.com/sax/-/sax-1.2.4.tgz",
@@ -28739,6 +28745,11 @@
     "neo-async": "^2.6.2"
    }
   },
+  "sass-mixins-variables": {
+   "version": "1.1.0",
+   "resolved": "https://registry.npmmirror.com/sass-mixins-variables/-/sass-mixins-variables-1.1.0.tgz",
+   "integrity": "sha512-NHiyqWuI69WlHuqjTnD8xp14OEy2X8ussP8L1TTXZPvKFpizpDZxx7u1FHjv9QkkMyu4zIy/1JN8u6nF3AtBGQ=="
+  },
   "sax": {
    "version": "1.2.4",
    "resolved": "https://registry.npmmirror.com/sax/-/sax-1.2.4.tgz",

package.json

@@ -9,6 +9,7 @@
   "compression-webpack-plugin": "^8.0.1",
   "echarts": "^5.3.2",
   "qrcodejs2": "^0.0.2",
+  "sass-mixins-variables": "^1.1.0",
   "uni-crazy-router": "0.0.31",
   "uni-simple-router": "^2.0.1",
   "uview-ui": "^1.8.4",

pages.json

@@ -58,6 +58,13 @@
 				//"navigationStyle": "custom" // 隐藏系统导航栏
 			}
 		},
+		{
+			"name": "充电订单",
+			"path": "pages/searchPile/stationAndPile/demo",
+			"style": {
+				//"navigationStyle": "custom" // 隐藏系统导航栏
+			}
+		},
 		{
 			"name": "充电订单",
 			"path": "pages/record/index",
@@ -270,16 +277,7 @@
 				"enablePullDownRefresh": false
 			}
 		
-		},
-		// {
-		// 	"name":"导航",
-		// 	"path": "pages/searchPile/demo",
-		// 	"style": {
-		// 		
-		// 		"enablePullDownRefresh": false
-		// 	}
-		
-		// }, 
+		}, 
 		{   "name":"站点详情",
 			"path": "pages/searchPile/stationAndPile/stationDetails",
 			"style": {

pages/search/search.vue

@@ -2,7 +2,7 @@
 <template>
 	<view>
 		<u-navbar title="" ref='navbar' id='navbar' :height='nav_height'> 
-			<u-search id='search' ref='search' height="88"  placeholder="搜索站点名称" @change="search()" v-model="keyword" color="#c8c8c8" @search="search" @click="search" @clickicon='back' @custom='search'></u-search>		 
+			<u-search id='search' ref='search' height="88" :input-style='inputStyle'  placeholder="搜索站点名称" @change="search()" v-model="keyword" color="#c8c8c8" @search="search" @click="search" @clickicon='back' @custom='search'></u-search>		 
 		</u-navbar>
 		<view class="recommend">推荐充电站</view>
 		<view class="charing-slow" v-for="(item,index) in stations_filter" :key="item.id" @click="stationDetail(item)">
@@ -41,6 +41,11 @@
 		data() {
 			
 			return {
+				inputStyle:{
+					backgroundColor: 'transparent',
+					"font-size":'18px',
+					"font-weight":"normal"
+				},
 				nav_height:44,
 				userId:'',
 				keyword:'',
@@ -63,7 +68,9 @@
 			// 验证上面rpx的值
 			var px = uni.upx2px(88); 
 			this.nav_height = px;
-			// console.log('搜索框高度'+JSON.stringify(rpx))
+			
+			
+ 			// console.log('搜索框高度'+JSON.stringify(rpx))
 			// console.log('搜索框高度'+JSON.stringify(px))
 			/*
 			if(op!= null && op.stationlist != null){
@@ -73,6 +80,12 @@
 			console.log('op'+JSON.stringify(op))*/
 		},
 		onReady() {
+			this.elderMode = this.carhelp.get('getElderModeClass');
+			if(this.elderMode)
+				this.theme('elder')
+			else
+				this.theme('standard')
+				
 			 if (this.carhelp.getPersonInfo()) {
 			 	this.userId = this.carhelp.getPersonInfo().id;
 			 			
@@ -92,6 +105,28 @@
 		},
 		 // conponents:{charingSlows},
 		methods: { 
+			theme(type) {
+			  if(type == 'dark')	
+			  {
+				document.getElementsByTagName('body')[0].setAttribute('data-theme',type);
+				 let data = {
+				 	backgroundColor: 'transparent',
+				 	"font-size":'18px',
+				 	"font-weight":"bold!important"
+				 };
+				 this.inputStyle = data;
+			  }
+			  else
+			  {
+				document.getElementsByTagName('body')[0].setAttribute('data-theme',type);
+				  let data  ={
+				  	backgroundColor: 'transparent',
+				  	"font-size":'16px',
+				  	"font-weight":"normal"
+				  };
+				  this.inputStyle = data;
+			  } 
+			},
 			stationDetail(item){
 				 
 				console.log('stationDetail item'+JSON.stringify(item))
@@ -327,8 +362,8 @@
 	}
 </script>
 
-<style lang="scss" scoped>
-	
+<style lang="scss" scoped> 
+	@import "@/_theme.scss";
 	
 	/deep/.u-content[data-v-1a326067] {
 		flex: 0.95;

pages/searchPile/searchPile.vue

@@ -1,20 +1,20 @@
 <template>
-	<view>
+	<view class='font1'>
 		<u-navbar :is-back="false" height="88" style="background-color: bisque;">
 			<view style="display: flex;flex-direction: column; width: 100%;height: 100%;">
 				<view style="display: flex;flex-direction: row; height: 100%; align-items: center;margin-top:0rpx;padding-top: 0rpx;padding-bottom: 20rpx;">
 					<view style="margin-left:20rpx;width: 160rpx;">
-						<uni-combox ref="city" :border="false" v-model="area" :candidates="cities" @updateModel='updateCity' @updateSelector="updateCitySelector"></uni-combox> 
+						<uni-combox class='font2' ref="city" :border="false" v-model="area" :candidates="cities" @updateModel='updateCity' @updateSelector="updateCitySelector"></uni-combox> 
  					</view>
 					<view style="margin-left: 20rpx;margin-right: 20rpx; flex:1" >
-						<u-search placeholder="搜索站点名称" v-model="keyword" :showAction="false"  @focus="navigate"></u-search></view>
+						<u-search :input-style='inputStyle' placeholder="搜索站点名称" v-model="keyword" :showAction="false"  @focus="navigate"></u-search></view>
 					<view style="margin-right: 20rpx;" v-show="viewMode" @click="listMode">
-						<text class="iconfont">&#xe613;</text> <text class="list">列表</text>
+						<text class="iconfont">&#xe613;</text> <text class="list font2">列表</text>
 <!--						<u-icon name="list-dot" size="26" color="#c0c4cc"></u-icon>
 						<label>列表</label>-->
 					</view>
 					<view style="margin-right: 20rpx;" v-show="!viewMode" @click="mapMode">
-						<text class="iconfont">&#xe622;</text> <text class="list">地图</text>						
+						<text class="iconfont">&#xe622;</text> <text class="list font2">地图</text>						
 						<!--<u-icon name="map" size="26" color="#c0c4cc"></u-icon>
 						<label>地图</label>
 						-->
@@ -23,7 +23,7 @@
 
 				<view style="display: flex;flex-direction: row;width:100%; justify-content: space-between;align-items: center;">
 					<view style="margin-left:20rpx;width: 160rpx;">
-						<uni-combox ref="radius" style="width: 200rpx;" :border="false" v-model="radius" :candidates="radiuses"  @updateModel='updateRadius' @updateSelector="updateRadiusSelector"></uni-combox> 
+						<uni-combox class='font2' ref="radius" style="width: 200rpx;" :border="false" v-model="radius" :candidates="radiuses"  @updateModel='updateRadius' @updateSelector="updateRadiusSelector"></uni-combox> 
  					</view>
 <!--					
 					<view style="margin-left: 20rpx;">
@@ -32,7 +32,7 @@
 					</view>
 					-->
 					<view style="margin-left:20rpx;margin-right: 20rpx;flex:1">
-						<uni-combox ref="type" style="width: 200rpx;" :border="false" v-model="type" :candidates="types" @updateModel='updateType' @updateSelector="updateTypeSelector"></uni-combox> 
+						<uni-combox ref="type" class='font2' style="width: 200rpx;" :border="false" v-model="type" :candidates="types" @updateModel='updateType' @updateSelector="updateTypeSelector"></uni-combox> 
  					</view>
 					
 <!--					<view style="margin-left: 20rpx;margin-right: 20rpx;flex:1">
@@ -40,7 +40,7 @@
 						<u-icon name="arrow-down-fill" size="13" color="#c0c4cc"></u-icon>
 					</view>-->
 					<view style="margin-right: 20rpx;" @click="open">
-						<label class="arrow">{{ action }}</label>
+						<label class="arrow font2">{{ action }}</label>
 						<u-icon v-if="show" name="arrow-down-fill" size="13" color="#00B962"></u-icon>
 						<u-icon v-else name="arrow-down-fill" size="13" color="#c0c4cc"></u-icon>
 					</view>
@@ -68,7 +68,7 @@
 					<view class="preference_group_item"><label class="preference_label">充电站类型</label></view>
 					<view>
 						<u-tag
-							class="preference_item"
+							class="preference_item_medium"
 							v-for="(item, index) in info.obc_type"
 							:key="index"
 							:style="index == preference.obc_type_index ? 'background-color:#00B962;color:#FFFFFF' : 'background-color:#EFF4F2;color:#926666'"
@@ -137,8 +137,8 @@
 			
 				</view>
 				<view class="pre-btn" style="display: flex;flex-direction: row;">
-					<view class="btn-1" @click="reset" style="width: 30%;">重置</view>
-					<view class="btn-2" @click="close" style="width: 70%;background-color: #00B962;color: #fff;">确定</view>
+					<view class="btn-1 font3" @click="reset" style="width: 30%;">重置</view>
+					<view class="btn-2 font3" @click="close" style="width: 70%;background-color: #00B962;color: #fff;">确定</view>
 				</view>
 				
 			</view>
@@ -153,7 +153,7 @@
 					<view class="price">
 						<view class="num">{{item.price}}</view>
 						<view class="unit">
-							起 元/度
+							 元/度 起
 						</view>
 					</view>
 					<view class="park">
@@ -187,27 +187,27 @@
 					 	<swiper-item v-for="(item,index) in stationsmap" :key="item.id" style="height: 100%;">							 
 							
 							<view class="swiper-item" style="height: 100%; background-color: #ffffff;" @click="stationDetail(item)">
-								<view class="card_item" style="font-size: 35rpx;padding-top: 5rpx;">
+								<view class="card_item" style="padding-top: 5rpx;">
 									<view style="display: flex;flex-direction: row;">
 										<view :class="item.type == '快充' ? 'fast-charge':(item.type == '慢充' ? 'trickle-charge':'fast-trickle-charge')" >
 											{{item.type}}
 										</view>
-										<view>
+										<view class="font-weight3"  >
 											{{item.name}}											
 										</view>
 										
 									</view>
 								</view>		
-								<view class="card_item" style="color:#8898A9;font-size: 15rpx;">
+								<view class="card_item" style="color:#8898A9;">
 									{{item.position}}
 								</view>
 								
 								<view class="card_item2" >
- 									<view style="color:#FF6573;font-size:45rpx;margin-right: 10rpx;">
+ 									<view style="color:#FF6573;margin-right: 10rpx;">
 										{{item.price}}
 									</view>
 									<view style="display: flex; justify-content: center;align-items: center">
-									起 元/度										
+									 元/度 起									
 									</view>
 								</view>
 								<view class="card_item" style="border-bottom: #F1F4F3; border-bottom-width: 2rpx;border-style: solid;border-top-width: 0rpx;border-left-width: 0rpx;border-right-width:0rpx; padding-bottom:20rpx">
@@ -218,11 +218,11 @@
 										<label>{{item.park}}</label>
 									</view>
 									<view style="display: flex;flex-direction: row;">
-										<view style="color: #00B962;">
+										<view style="color: #00B962;" class="font-weight2">
 											空闲{{item.idleNum}}
 										</view>
 										
-										<view>
+										<view class="font-weight2">
 											/总数{{item.total}}
 										</view>
 									</view>
@@ -231,7 +231,8 @@
 								<view class="card_item" style="padding-bottom: 20rpx;">
 									<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>
+										<label>扫码充电</label>
+									</u-button>
 									
 									<view class="round" @click.stop="navigateTo(item)"> 
 											<text class="iconfont distance-font">&#xe615;</text>
@@ -283,6 +284,11 @@ export default {
 	},
 	data() {
 		return { 
+			inputStyle:{
+				backgroundColor: 'transparent',
+				"font-size":'18px',
+				"font-weight":"normal"
+			},
 			elderMode:false,
 			showCity:false,
 			showType:false,
@@ -358,11 +364,24 @@ export default {
 			if (op.latitude != null) this.latitude = op.latitude;
 			if (op.id != null) this.id = op.id;
 		}
-		 
+		if(this.elderMode)
+		{
+			window.document.getElementsByTagName('body')[0].style.setProperty('--theme', 1);			
+		}
+		 			
 		//navigation.getPoint();
 		
 	},
 	onReady() {
+		console.log('长者模式'+JSON.stringify(this.carhelp.get("getElderModeClass")));
+		this.elderMode = this.carhelp.get('getElderModeClass');
+		
+		//this.elderMode = true;
+		if(this.elderMode)
+			this.theme('elder')
+		else
+			this.theme('standard')
+			
 		 if (this.carhelp.getPersonInfo()) {
 		 	this.userId = this.carhelp.getPersonInfo().id;
 			
@@ -469,6 +488,7 @@ export default {
 //			console.log('setCenter')
 		},
 		getScanCode() {
+			
 			if(!this.isEnabled())
 				return;
 			if (this.userId) {
@@ -602,6 +622,14 @@ export default {
 		    },
 
 		navigateTo(item){
+			/*
+			this.elderMode = !this.elderMode;
+			if(this.elderMode)
+				this.theme('elder')
+			else
+				this.theme('standard')
+			return;
+			*/
 			//this.guide('gd',item);
 			//console.log('导航'+JSON.stringify(item))
 			window.location.href="https://uri.amap.com/marker?position="+ item.longitude+","+item.latitude+"&name="+item.name;
@@ -822,7 +850,7 @@ export default {
 									};*/
 						_self.stationsmap.push(obj);						
 					}
-					_self.$refs.amap.searchBtn([_self.longitude, _self.latitude],_self.stationsmap)
+					_self.$refs.amap.calcDistances([_self.longitude, _self.latitude],_self.stationsmap)
  					_self.$refs.amap.setChargerList(_self.stationsmap);
 					if(_self.stationsmap.length>0)
 					{
@@ -881,7 +909,7 @@ export default {
 									//arr.push(obj);
 							_self.stationslist.push(obj);
 					}
-					_self.$refs.amap.searchBtn([_self.longitude, _self.latitude],_self.stationslist)
+					_self.$refs.amap.calcDistances([_self.longitude, _self.latitude],_self.stationslist)
 					
 	//				console.log(' getChargingStationData stations'+JSON.stringify(_self.stationslist))
 					 
@@ -1127,12 +1155,38 @@ export default {
 			this.getChargingStationData(data2);
 
 			 
+		},
+		theme(type) {
+			
+		  if(type == 'elder')	
+		  {
+			document.getElementsByTagName('body')[0].setAttribute('data-theme',type);
+			let data = {
+				backgroundColor: 'transparent',
+				"font-size":'18px',
+				"font-weight":"bold!important"
+			};
+			this.inputStyle = data;
+ 		  }
+		  else
+		  {
+			document.getElementsByTagName('body')[0].setAttribute('data-theme',type);
+			let data  ={
+				backgroundColor: 'transparent',
+				"font-size":'16px',
+				"font-weight":"normal"
+			};
+			this.inputStyle = data;
+ 			  
+		  } 
 		}
 	}
 };
 </script>
 
-<style>
+ <style lang="scss" scoped>
+	@import "@/_theme.scss";
+	
 	.uni-combox__no-border{
 		white-space: nowrap;
 	}
@@ -1174,7 +1228,25 @@ export default {
 	border-style: none;
 	width: 20%;
 	height: 28px;
-	line-height: 14px;
+	@include themeify{
+		font-size: themed('font-size1');
+		line-height: themed('font-size2');
+	}
+/*	line-height: 14px;*/
+}
+
+.preference_item_medium {
+	margin-bottom: 10rpx;
+	margin-left: 20rpx;
+	text-align: center;
+	border-style: none;
+	width: 22%;
+	height: 28px;
+	@include themeify{
+		font-size: themed('font-size1');
+		line-height: themed('font-size2');
+	}
+/*	line-height: 14px;*/
 }
 .preference_item_plus {
 	margin-bottom: 10rpx;
@@ -1182,13 +1254,21 @@ export default {
 	align-items: center;
 	justify-content: center;
 	text-align: center;
-	width: 25%;
+	width: 28%;
 	border-style: none;
 	height: 28px;
-	line-height: 14px;
+	@include themeify{
+		font-size: themed('font-size1');
+		line-height: themed('font-size2');
+	}
+/*	line-height: 14px;*/
 }
 .preference_label {
-	color: #9f9c99;
+	@include themeify{
+		color:themed('font_colorLabel');
+		font-size: themed('font-size1');
+		font-weight: themed('fontWeight');
+	}
 	margin-left: 20rpx;
 	margin-bottom: 100rpx;
 }
@@ -1228,8 +1308,10 @@ export default {
 	bottom: 68px;
 	left: 0;
 	right: 0;	
-	position: fixed;
-	height:360rpx;
+	position: fixed; 
+	@include themeify{
+		height:themed('cardHeight'); 
+	} 
 	/*
 	z-index: 1021; 
 	width: 80%;
@@ -1244,6 +1326,9 @@ export default {
 .card_item{
 	display: flex;
 	flex-direction: row;
+	@include themeify{
+ 		font-size: themed('font-size2');
+ 	}
 	justify-content: space-between;
 	margin-left: 20rpx;
 	margin-right: 20rpx;
@@ -1252,6 +1337,9 @@ export default {
 .card_item2{
 	display: flex;
 	flex-direction: row;
+	@include themeify{
+ 		font-size: themed('font-size2');
+ 	}
 	margin-left: 20rpx;
 	margin-right: 20rpx;
 	margin-bottom: 10rpx;
@@ -1263,7 +1351,12 @@ export default {
 	text-align: center;
 	justify-content: center;
 	align-items: center;
-	width: 250rpx;
+	@include themeify{
+		font-size: themed('font-size2');
+		width:themed('buttonWidth')
+	}
+	
+/*	width: 250rpx;*/
 	display: flex;
 	flex-direction: row;
 }
@@ -1297,43 +1390,61 @@ export default {
  	.fast-charge {
  		display: inline-block;
  		width: 44px;
- 		height: 20px;
- 		line-height: 20px;
+/* 		height: 20px;
+ 		line-height: 20px;*/
  		border-radius: 50px;
  		background-color: #9d9fff;
  		color: rgba(255, 255, 255, 100);
- 		font-size: 12px;
+		@include themeify{
+			font-size: themed('font-size1');
+			line-height: themed('font-size5');
+			height: themed('font-size5');
+		}
  		text-align: center;
  	}
 	
 	.fast-trickle-charge {
 		display: inline-block;
 		width: 66px;
-		height: 20px;
-		line-height: 20px;
+/*		height: 20px;
+		line-height: 20px;*/
 		border-radius: 50px;
 		background-color: #00BAC8;
-		color: rgba(255, 255, 255, 100);
-		font-size: 12px;
+		color: rgba(255, 255, 255, 100); 
+		@include themeify{
+			font-size: themed('font-size1');
+			line-height: themed('font-size5');
+			height: themed('font-size5');
+		}
 		text-align: center;
 	}
 	.trickle-charge {
 		display: inline-block;
 		width: 44px;
-		height: 20px;
-		line-height: 20px;
+/*		height: 20px;
+		line-height: 20px;*/
 		border-radius: 50px;
 		background-color: rgba(0, 185, 98, 100);
 		color: rgba(255, 255, 255, 100);
-		font-size: 12px;
+		@include themeify{
+			font-size: themed('font-size1');
+			line-height: themed('font-size5');
+			height: themed('font-size5');
+		}
 		text-align: center;
 	}
  
  	.station-items {
  		display: inline-block;
- 		height: 16px;
- 		line-height: 16px;
- 		font-size: 16px;
+/* 		height: 16px;
+ 		line-height: 16px;*/
+		@include themeify{
+			font-size: themed('font-size3');
+			font-weight: themed('fontWeight');
+			line-height: themed('font-size3');
+			height: themed('font-size3');
+		}
+/* 		font-size: 16px;*/
  		margin-left: 4px;
  		color: #101010;
  
@@ -1343,19 +1454,29 @@ export default {
 	.fast-charge {
 		display: inline-block;
 		width: 44px;
-		height: 20px;
-		line-height: 20px;
+/*		height: 20px;
+		line-height: 20px;*/
 		border-radius: 50px;
 		background-color: #9d9fff;
 		color: rgba(255, 255, 255, 100);
-		font-size: 12px;
+/*		font-size: 12px;*/
+		
+		@include themeify{
+			font-size: themed('font-size1');
+ 			line-height: themed('font-size5');
+			height: themed('font-size5');
+		}
 		text-align: center;
 	}
  
  	.address {
  		margin-top: 8px;
- 		line-height: 16px;
- 		font-size: 11px;
+/* 		line-height: 16px;*/
+		@include themeify{
+			font-size: themed('font-size1');
+			line-height: themed('font-size3');
+		}
+/* 		font-size: 11px;*/
  		color: rgba(119, 119, 119, 100);
  	}
  
@@ -1367,18 +1488,27 @@ export default {
  
  
  .num {
- 	height: 20px;
+/* 	height: 20px;*/
  	color: rgba(255, 98, 0, 100);
- 	font-size: 20px;
+ /*	font-size: 20px;*/
+	 @include themeify{
+		font-size: themed('font-size5');
+		height: themed('font-size5');
+	 }
  	text-align: left;
  	font-family: Roboto-medium;
  }
   
  .unit {
- 	height: 14px;
- 	line-height: 14px;
+ /*	height: 14px;
+ 	line-height: 14px;*/
  	color: rgba(102, 102, 102, 100);
- 	font-size: 14px;
+	@include themeify{
+			font-size: themed('font-size2');
+			height: themed('font-size2');
+			line-height: themed('font-size2');
+	}
+/* 	font-size: 14px;*/
  	text-align: left;
  	font-family: AlibabaPuHui-regular;
  	margin-top: 6px;
@@ -1395,8 +1525,12 @@ export default {
 	.park-p {
 		display: inline-block;
 		width: 20px;
-		height: 18px;
-		line-height: 12px;
+/*		height: 18px;
+		line-height: 12px;*/
+		@include themeify{
+			line-height: themed('font-size1');
+			height: themed('font-size4');
+		}
 		text-align: center;
 		background-color: rgba(125, 177, 255, 100);
 		color: #fff;
@@ -1404,9 +1538,13 @@ export default {
 	.park-text {
 		display: inline-block;
 		width: 300px;
-		height: 17px;
+/*		height: 17px;*/
 		color: rgba(102, 102, 102, 100);
-		font-size: 12px;
+		@include themeify{
+			font-size: themed('font-size1');
+			height:themed('font-size4');
+		}
+/*		font-size: 12px;*/
 		text-align: left;
 		margin-left: 4px;
 		margin-top: 2px;
@@ -1433,14 +1571,24 @@ export default {
  	} 
 	.free-num {
 		line-height: 52px;
-		font-size: 16px
+		@include themeify{
+			font-size: themed('font-size3');
+			font-weight: themed('fontWeight');
+		}
+/*		font-size: 16px*/
 	} 
 	.distance {
 		width: 130px;
-		height: 28px;
-		line-height: 28px;
+/*		height: 28px;
+		line-height: 28px;*/
 		color: rgba(255, 255, 255, 100);
-		font-size: 14px;
+		@include themeify{
+			font-size: themed('font-size2');
+			line-height: themed('font-size9');
+			height: themed('font-size9');
+		}
+		/*
+		font-size: 14px;*/
 		background-color: #00b962;
 		border-radius: 50px;
 		margin: 12px;
@@ -1450,12 +1598,18 @@ export default {
 
 	}
 	.distance-font {
-		font-size: 16px
+		@include themeify{
+				font-size: themed('font-size3');
+		}
+/*		font-size: 16px*/
 	}
 	
 	.position{
 		color: #1677ff;
-		font-size: 14px
+		@include themeify{
+				font-size: themed('font-size2');
+		}
+/*		font-size: 14px*/
 	}
 	.position-box{
 		position:absolute;

pages/searchPile/stationAndPile/chargePriceDetails.vue

@@ -60,6 +60,8 @@
 		},
 		onLoad(op){
 			_self = this; 
+
+
 			if(op!=null && op.stationId!=null){
 				console.log('stationId'+JSON.stringify(op.stationId))
 				let data = {stationId:op.stationId};
@@ -104,16 +106,34 @@
 				}
 			);*/
 		},
+		onReady(){
+			if(this.elderMode)
+				this.theme('elder')
+			else
+				this.theme('standard')
+		},
 		methods: {
 			change(index) {
 				this.current = index;
 				this.items = this.list[index].items;
+			},
+			theme(type) {
+			  if(type == 'dark')	
+			  {
+				document.getElementsByTagName('body')[0].setAttribute('data-theme',type);
+				  
+			  }
+			  else
+			  {
+				document.getElementsByTagName('body')[0].setAttribute('data-theme',type);
+				  
+			  } 
 			}
 		}
 	}
 </script>
-
-<style lang="scss" scoped>
+<style lang="scss" scoped> 
+	@import "@/_theme.scss";
 	.main {
 		background-color: #fff;
        

pages/searchPile/stationAndPile/stationDetails.vue

@@ -9,15 +9,15 @@
 			</view>
 			
 			<view class="details-item" style="margin-top: 22px;">
-				<text class="iconfont" style="color: #00b962;font-size: 20px;">&#xe60a;</text> <text
+				<text class="iconfont font5" style="color: #00b962;">&#xe60a;</text> <text
 					class="item-text">{{(stationDetail.station.type.indexOf('1')>=0?'直流快充':'')}}{{(stationDetail.station.type.indexOf(',')>=0?'/':'')}}{{(stationDetail.station.type.indexOf('2')>=0?'交流慢充':'')}}</text>
 			</view>
 			<view class="details-item">
-				<text class="iconfont" style="color: #4e94ff;font-size: 20px;">&#xe60e;</text> 
-				<text class="item-text">{{stationDetail.station.distance}}公里</text>
+				<text class="iconfont font5" style="color: #4e94ff;">&#xe60e;</text> 
+				<text class="item-text">{{stationDetail.station.distance!=null ? stationDetail.station.distance.toFixed(3):''}}公里</text>
 			</view>
 			<view class="details-item">
-				<text class="iconfont" style="color: #ffad79;font-size: 20px;">&#xe621;</text>
+				<text class="iconfont font5" style="color: #ffad79;">&#xe621;</text>
 				 <text class="item-text"> {{info.station.time}}</text>
 
 			</view>
@@ -34,7 +34,7 @@
 		
 		<view class="price-details">
 			<view class="detail-title">
-				<view class="title-left">价格详情</view>
+				<view class="title-left font-weight5">价格详情</view>
 				<view class="title-right" @click="priceDetail">
 					<view class="right-text">价格详情 </view>
 					<view class="iconfont right-font">&#xe600;</view>
@@ -73,7 +73,7 @@
 		
 		<view class="equipment-details">
 			<view class="title">
-				<view class="title-left">
+				<view class="title-left ">
 					设备详情
 				</view>
 				<view class="title-right">
@@ -194,10 +194,7 @@
 		},
 		onLoad(op){
 			_self = this;
-			
-		  document.getElementsByTagName('body')[0].style.setProperty('--test', 'yellow');
- 	      window.document.getElementsByTagName('body')[0].style.setProperty('--test', 'yellow');
- 
+
 //			document.getElementsByTagName('body')[0].style.setProperty('--mode',1)
 			_self.processStationsInfo();
 				 
@@ -209,7 +206,7 @@
 						//console.log('station'+JSON.stringify(station))
 						//_self.station = station; 
 						api.getChargingStationDetail(data).then(function(res){
-//							console.log('站点详情'+JSON.stringify(res))
+							console.log('站点详情'+JSON.stringify(res))
 							//this.info.st
 							if(res && res.result)
 							{
@@ -282,6 +279,13 @@
 			}
 		},
 		onReady(){
+			this.elderMode = this.carhelp.get('getElderModeClass');
+			
+			if(this.elderMode)
+				this.theme('elder')
+			else
+				this.theme('standard')
+				
 			if (this.carhelp.getPersonInfo()) {
 				this.userId = this.carhelp.getPersonInfo().id;
 						
@@ -301,8 +305,8 @@
 					
 					var latitude = parseFloat(res.latitude);
 					var longitude = parseFloat(res.longitude);
-					var startLngLat = [longitude,latitude];
-					var endLngLat = [_self.stationDetail.station.longitude,_self.stationDetail.station.latitude];
+					var startLngLat = {longitude: longitude,latitude: latitude};
+					var endLngLat = {longitude: _self.stationDetail.station.longitude,latitude: _self.stationDetail.station.latitude};
 					_self.calculateDistance(startLngLat,endLngLat);
 					
 					/*uni.showToast({
@@ -323,6 +327,12 @@
 				})
 			},
 			calculateDistance(startLngLat,endLngLat){
+				
+				var lnglat = new AMap.LngLat(startLngLat.longitude,startLngLat.latitude);
+				var myDistance = lnglat.distance([endLngLat.longitude, endLngLat.latitude]);
+				_self.stationDetail.station.distance = myDistance/1000;
+				_self.stationDetail.station.time = myDistance/500;
+				/*
 				var _this = this;
 				MapLoader().then(AMap1 => {
 					
@@ -332,12 +342,15 @@
 						center: [116.397559, 39.89621],
 						zoom: 14
 					});  
-					AMap.plugin('AMap.Driving', function() {
+					var lnglat = new AMap.LngLat(117.186602, 34.261579);
+					 
+					//AMap.Walking
+					 AMap.plugin('AMap.Driving', function() {
 					  var driving = new AMap.Driving({
 					    // 驾车路线规划策略，AMap.DrivingPolicy.LEAST_TIME是最快捷模式
 					    policy: AMap.DrivingPolicy.LEAST_TIME
 					  })
-					  
+ 			  
 					 //var startLngLat = [116.379028, 39.865042]
 					 //var endLngLat = [116.427281, 39.903719]
 					 
@@ -347,30 +360,16 @@
 							console.log(result.routes[0].distance)//米
 							_self.stationDetail.station.distance = result.routes[0].distance/1000;
 							_self.stationDetail.station.time = result.routes[0].time/60;
-							/*uni.showToast({
-								title:result.routes[0].time+"秒，"+result.routes[0].distance+"米"
-							})*/
+							 
 					  })
-					  /*
-					  var startLngLat2 = [_this.longitude, _this.latitude]
-					  var endLngLat2 = [_this.longitude2, _this.latitude2]
-					
 					  
-					  driving.search(startLngLat2, endLngLat2, function (status, result) {
-					  							console.log(result)
-					  							console.log(result.routes[0].time)//秒
-					  							console.log(result.routes[0].distance)//米
-					  							uni.showToast({
-					  								title:result.routes[0].time+"秒，"+result.routes[0].distance+"米"
-					  							})
-					  })*/
 					})
 					
 				
 				}, e => {
 					//_this.mui.toast('地图加载失败');
 					console.log('地图加载失败', e)
-				})
+				})*/
 			},
 			getScanCode() {
 				if (this.userId) {
@@ -396,6 +395,11 @@
 			},
 			processStationsInfo(){
 				for(let i = 0;i <_self.stationDetail.devices.length;i++){
+					if(!_self.stationDetail.devices[i].online)
+					{
+						_self.stationDetail.devices[i].workStatusText ='不在线';
+						continue;
+					}
 					//console.log('device['+i.toString()+']'+JSON.stringify(_self.stationDetail.devices[i]))
 					_self.stationDetail.devices[i].workStatus = 2;
 					_self.stationDetail.devices[i].workStatusText ='充电中';
@@ -411,13 +415,16 @@
 			},
 			
 			navigate(){
-				 wx.openLocation({
+				 /*wx.openLocation({
 				     latitude: _self.station.latitude,//目的地latitude
 				     longitude: _self.station.longitude,//目的地longitude
 				     name: _self.station.name,
 				     address: _self.station.address,
 				     scale: 15//地图缩放大小，可根据情况具体调整
-				 });
+				 });*/
+				 console.log('station'+JSON.stringify(_self.stationDetail.station))
+				 window.location.href="https://uri.amap.com/marker?position="+ _self.stationDetail.station.longitude+","+_self.stationDetail.station.latitude+"&name="+_self.stationDetail.station.name;
+				 
 			},
 			charge(){
 				 console.log('扫码充电')
@@ -453,12 +460,24 @@
 					//url:'stationDetailsMap?station='+encodeURIComponent(JSON.stringify(_self.station))
 					 
 				})
+			},theme(type) { 
+			  if(type == 'dark')	
+			  {
+ 				document.getElementsByTagName('body')[0].setAttribute('data-theme',type);
+ 				  
+			  }
+			  else
+			  {
+ 				document.getElementsByTagName('body')[0].setAttribute('data-theme',type);
+ 				  
+			  } 
 			}
 		}
 	}
 </script>
 
 <style lang="scss" scoped> 
+	@import "@/_theme.scss";
 	// 站点信息
 	.station-details {
 		width: 100%;
@@ -473,7 +492,13 @@
 		.station-name {
 			//line-height: 18px;
 			color: #101010;		
-			line-height: 18px;
+			@include themeify{
+				line-height: themed('font-size4');
+				font-weight: themed('fontWeight');
+				font-size: themed('font-size4');
+				letter-spacing: themed('letterSpacing');
+			}
+/*			line-height: 18px;*/
  			margin-bottom: 11px;
 		}
 
@@ -481,7 +506,10 @@
 			margin-top: 11px;
 			height: 17px;
 
-			font-size: 12px;
+			@include themeify{
+				font-size: themed('font-size1');
+			}
+			/*font-size: 12px;*/
 			position: relative;
 		}
 
@@ -513,11 +541,17 @@
 				position: absolute;
 				top: 12px;
 				left: 0;
-				font-size: 12px
+				@include themeify{
+					font-size: themed('font-size1');
+				}
+/*				font-size: 12px*/
 			}
 
 			.address-font {
-				font-size: 28px;
+				@include themeify{
+					font-size: themed('font-size9');
+				}
+/*				font-size: 28px;*/
 				color: #4e94ff;
 				position: absolute;
 				top: 0;
@@ -539,20 +573,30 @@
 			justify-content: space-between;
 
 			.title-left {
-				font-size: 16px;
+				@include themeify{
+					font-size: themed('font-size3');
+				}
+/*				font-size: 16px;*/
 				color: #101010;
 			}
 
 			.title-right {
-				font-size: 14px;
-				line-height: 14px;
+				@include themeify{
+					font-size: themed('font-size2');
+					line-height: themed('font-size2');
+				}
+/*				font-size: 14px;
+				line-height: 14px;*/
 				color: #00b962;
 
 
 			}
 
 			.right-text {
-				font-size: 14px;
+				@include themeify{
+					font-size: themed('font-size2');
+				}
+/*				font-size: 14px;*/
 				position: absolute;
 				top: 23px;
 				right: 36px;
@@ -560,10 +604,16 @@
 			}
 
 			.right-font {
-                width: 24px;
+/*                width: 24px;
 				height: 24px;
 				line-height: 24px;
-				font-size: 24px;
+				font-size: 24px;*/
+				@include themeify{
+					font-size: themed('font-size7');
+					width: themed('font-size7');
+					height: themed('font-size7');
+					line-height: themed('font-size7');
+				}
                 position: absolute;
 				top: 20px;
 				right: 12px;
@@ -577,41 +627,64 @@
 		
 		.text1{
 			width: 44px;
-			height: 20px;
-			line-height: 20px;
+/*			height: 20px;
+			line-height: 20px;*/
 			border-radius: 50px;
 			background-color: rgba(0, 185, 98, 100);
 			color: rgba(255, 255, 255, 100);
-			font-size: 12px;
+/*			font-size: 12px;*/
+			
+			@include themeify{
+				font-size: themed('font-size1');
+				height: themed('font-size5'); 
+				line-height: themed('font-size5');
+			}
 			text-align: center;
 		}
 		.text5{
 			width: 44px;
-			height: 20px;
-			line-height: 20px;
+/*			height: 20px;
+			line-height: 20px;*/
 			border-radius: 50px;
 			background-color: #9d9fff;
 			color: rgba(255, 255, 255, 100);
-			font-size: 12px;
+			@include themeify{
+				font-size: themed('font-size1');
+				height: themed('font-size5'); 
+				line-height: themed('font-size5');
+			}
+			/*font-size: 12px;*/
 			text-align: center;
 		}
 		.text2{
 			width: 40px;
-			line-height: 19px;
+/*			line-height: 19px;*/
 			margin-left: 8px;
 			color: rgba(255, 98, 0, 100);
-			font-size: 20px;
+/*			font-size: 20px;*/
+			@include themeify{
+				font-size: themed('font-size5');
+				line-height: themed('font-size5');
+			}
 			text-align: left;
 		}
 		.text3{
 			margin-left: 4px;
 			color: rgba(51, 51, 51, 100);
-			font-size: 16px;
+/*			font-size: 16px;*/
+			@include themeify{
+				font-size: themed('font-size3');
+ 			}
+			
 		}
 		.text4{
 			margin-left: 72px;
-			font-size: 12px;
-			line-height: 20px;
+/*			font-size: 12px;
+			line-height: 20px;*/
+			@include themeify{
+				font-size: themed('font-size1');
+				line-height: themed('font-size5');
+			}
 			color: rgba(102, 102, 102, 100);
 		}
 	}
@@ -625,22 +698,35 @@
 		}
 		.text1{
 			width: 44px;
-			height: 20px;
-			line-height: 20px;
+			@include themeify{
+				font-size: themed('font-size1');
+				line-height: themed('font-size5');
+				height: themed('font-size5');
+			}
+/*			height: 20px;
+			line-height: 20px;*/
 			border-radius: 50px;
 			background-color: rgba(78, 148, 255, 100);
 			color: rgba(255, 255, 255, 100);
-			font-size: 12px;
+/*			font-size: 12px;*/
 			text-align: center;	
 		}
 		.text2{
 			margin-left: 8px;
 			color: rgba(51, 51, 51, 100);
-			font-size: 16px;
+			@include themeify{
+				font-size: themed('font-size3');
+ 			}
+/*			font-size: 16px;*/
 		}
 		.text3{
-		   font-size: 12px;color: #666666;
-		   line-height: 20px;
+			@include themeify{
+				font-size: themed('font-size1');
+				line-height: themed('font-size5');
+ 			}
+		   color: #666666;
+/*		   font-size: 12px;
+		   line-height: 20px;*/
 		}
 		
 	}
@@ -654,13 +740,22 @@
 			display: flex;
 			justify-content: space-between;
 			.title-left{
-				height: 16px;
+				@include themeify{
+					font-size: themed('font-size3');
+					height: themed('font-size3');
+				}
+	
+/*				height: 16px;*/
 				color: rgba(16, 16, 16, 100);
-				font-size: 16px;
+/*				font-size: 16px;*/
 			}
 			.title-right{
-				height: 16px;
-				font-size: 14px;
+				@include themeify{
+					font-size: themed('font-size2');
+					height: themed('font-size3');
+				}
+/*				height: 16px;
+				font-size: 14px;*/
 				.free{
 					color: #00b962;
 				}
@@ -674,7 +769,10 @@
 		position: relative;
 		.left-font{
 			color:#00b962 ;
-			font-size: 36px;
+			@include themeify{
+				font-size: themed('font-size13'); 
+			}
+/*			font-size: 36px;*/
 			position: absolute;
 			left: -52px;
 			top: -4px
@@ -683,14 +781,22 @@
 			display: flex;
 			.name-text{
 				color: #101010;
-				font-size: 16px;
-				line-height: 16px;
+				@include themeify{
+					font-size: themed('font-size3'); 
+					line-height: themed('font-size3'); 
+				}
+/*				font-size: 16px;
+				line-height: 16px;*/
 			}
 		}
 		.type{
-			height: 17px;
+/*			height: 17px;*/
 			color: rgba(102, 102, 102, 100);
-			font-size: 12px;
+			@include themeify{
+				font-size: themed('font-size1'); 
+				height: themed('font-size4'); 
+			}
+/*			font-size: 12px;*/
 			margin-top: 4px;
 		}
 		.charging-gun{
@@ -698,36 +804,57 @@
 			margin-top: 12px;
 			.iconfont{
 				color: #a5aaa8;
-				font-size: 20px
+				@include themeify{
+					font-size: themed('font-size5'); 
+ 				}
+/*				font-size: 20px*/
 			}
 			.gun-num{
 				margin-left: 8px;
-				font-size: 12px;color: rgba(102, 102, 102, 100);
-				line-height: 20px;	
+				@include themeify{
+					font-size: themed('font-size1'); 
+					line-height: themed('font-size5'); 
+				}
+/*				font-size: 12px;
+				line-height: 20px;	*/
+				color: rgba(102, 102, 102, 100);
 			}
 			.free-state{
 				color: rgba(0, 185, 98, 100);
-				font-size: 12px;
+				@include themeify{
+					font-size: themed('font-size1'); 
+					line-height: themed('font-size5'); 
+				}
+/*				font-size: 12px;
+				line-height: 20px;*/
 				margin-left: 12px;
-				line-height: 20px;
 			}
 			
 			.recharge-state{
 				height: 17px;
 				color: rgba(255, 98, 0, 100);
-				font-size: 12px;
-				line-height: 20px;
+				@include themeify{
+					font-size: themed('font-size1'); 
+					line-height: themed('font-size5'); 
+				}
+/*				font-size: 12px;
+				line-height: 20px;*/
 				margin-left: 12px;
 			}
 		}
 	}
 	.tag-recharge{
 		width: 38px;
-		height: 16px;
-		line-height: 15px;
+/*		height: 16px;		
+		line-height: 15px;*/
+		@include themeify{
+			font-size: themed('font-size0'); 
+			line-height: themed('font-size2'); 
+			height: themed('font-size3'); 
+		}
 		border-radius: 2px;
 		color: rgba(255, 98, 0, 100);
-		font-size: 10px;
+/*		font-size: 10px;*/
 		text-align: center;
 		font-family: Arial;
 		border: 1px solid rgba(255, 98, 0, 100);
@@ -736,11 +863,16 @@
 	}
 	.tag-free{
 		width: 28px;
-		height: 16px;
-		line-height: 15px;
+		@include themeify{
+			font-size: themed('font-size0'); 
+			line-height: themed('font-size2'); 
+			height: themed('font-size3'); 
+		}		
+/*		height: 16px;
+		line-height: 15px;*/
 		border-radius: 2px;
 		color: rgba(0, 185, 98, 100);
-		font-size: 10px;
+/*		font-size: 10px;*/
 		text-align: center;
 		font-family: Arial;
 		border: 1px solid rgba(0, 185, 98, 100);
@@ -763,7 +895,10 @@
 			height: 32px;
 			border: 1px solid rgba(0, 185, 98, 100);
 			color: rgba(0, 185, 98, 100);
-			font-size: 14px;
+/*			font-size: 14px;*/
+			@include themeify{
+				font-size: themed('font-size2'); 
+			}	
 		}
 		.button2{
 			width: 44%;
@@ -771,7 +906,10 @@
 			border-radius: 50px;
 			background-color: rgba(0, 185, 98, 100);
 			color: rgba(255, 255, 255, 100);
-			font-size: 14px;
+			@include themeify{
+				font-size: themed('font-size2'); 
+ 			}	
+/*			font-size: 14px;*/
 			margin-left: 13px;
 		}
 		

pages/searchPile/stationAndPile/stationDetailsMap.vue

@@ -9,7 +9,7 @@
 			</view>
 			 
 			 <view class="chargerCard" @click="stationDetail(item)">
-				<view class="card_item" style="font-size: 35rpx;padding-top: 5rpx;" >
+				<view class="card_item font4" style="padding-top: 5rpx;" >
 					<view style="display: flex;flex-direction: row;">
 						<view :class="item.type == '快充' ? 'fast-charge':(item.type == '慢充' ? 'trickle-charge':'fast-trickle-charge')"style="margin-right: 5rpx;">
 							{{item.type}}
@@ -20,16 +20,16 @@
 						
 					</view>
 				</view>		
-				<view class="card_item" style="color:#8898A9;font-size: 15rpx;">
+				<view class="card_item font3" style="color:#8898A9;">
 					{{item.address}}
 				</view>
 				
-				<view class="card_item2" >
-					<view style="color:#FF6573;font-size:45rpx;margin-right: 10rpx;">
+				<view class="card_item2 " >
+					<view class="font6" style="color:#FF6573;margin-right: 10rpx;">
 						{{item.costPrice}}
 					</view>
 					<view style="display: flex; justify-content: center;align-items: center">
-					起 元/度										
+					 元/度 起										
 					</view>
 				</view>
 				<view class="card_item" style="border-bottom: #F1F4F3; border-bottom-width: 2rpx;border-style: solid;border-top-width: 0rpx;border-left-width: 0rpx;border-right-width:0rpx; padding-bottom:20rpx">
@@ -105,22 +105,47 @@
 			}
 		},
 		methods:{
+			theme(type) {
+				
+			  if(type == 'elder')	
+			  {
+				document.getElementsByTagName('body')[0].setAttribute('data-theme',type);
+				 
+			  }
+			  else
+			  {
+				document.getElementsByTagName('body')[0].setAttribute('data-theme',type);
+				 
+				  
+			  } 
+			},
 			getPoint() {
 				 
 				console.log('getPoint')
 				WxJsApi.getLocation().then((res) => {
-					
+					if(res==null)
+						return;
+					console.log('站点地图当前位置'+JSON.stringify(res))
 					_self.latitude = parseFloat(res.latitude);
 					_self.longitude  = parseFloat(res.longitude);
-					var startLngLat = [_self.longitude ,_self.latitude ];
-					var endLngLat = [_self.item.longitude,_self.item.latitude];
+					var startLngLat = {longitude: _self.longitude ,latitude: _self.latitude };
+					var endLngLat = {longitude: _self.item.longitude, latitude: _self.item.latitude};
+					console.log('start'+JSON.stringify(startLngLat));
+					console.log('end'+JSON.stringify(endLngLat));
 					//_self.calculateDistance(startLngLat,endLngLat);
 					//let posCenter= {longitude: _self.longitude,latitude: _self.latitude};
 					var obj = {
-									longitude: longitude,
-									latitude: latitude
+									longitude: _self.longitude,
+									latitude: _self.latitude
 								};
 					_self.$refs.amap.setPerson(obj);	
+					
+					var lnglat = new AMap.LngLat(startLngLat.longitude,startLngLat.latitude);
+					var myDistance = lnglat.distance([endLngLat.longitude, endLngLat.latitude]);
+					_self.item.distance = myDistance/1000;
+					_self.item.time = myDistance/500;
+					
+					/*
 					_self.$refs.amap.calculateDistance(startLngLat,endLngLat).then(function(res){
 						
 						_self.item.distance = res.distance/1000;
@@ -130,7 +155,7 @@
 						//console.log(result.routes[0].distance)//米
 						
 						console.log('距离'+JSON.stringify(res))
-					})
+					})*/
 					
 					console.log('当前位置' +JSON.stringify(data))
 					
@@ -246,8 +271,8 @@
 	//					   console.log('stations1'+JSON.stringify(this.stations[0]))
 	//					   console.log('stations2'+JSON.stringify(this.item))
 							_self.$refs.amap.setChargerList(_self.stations);
-							console.log('item'+JSON.stringify(_self.item))
-							_self.$refs.amap.updateCharger(_self.stations[0]) 
+							console.log('站点项目'+JSON.stringify(_self.item))
+							_self.$refs.amap.updateCharger(_self.item) 
 							//_self.stationDetail = data;
 							//_self.processStationsInfo();							
 								console.log('data'+JSON.stringify(_self.item )); 
@@ -260,7 +285,8 @@
 		},
 		onLoad(op) {
 				_self = this;
-				
+
+	
 //				console.log('longitude0  ' + _self.longitude);
 				if (op != null) {
 					if(op.stationId != null){
@@ -286,6 +312,12 @@
 				this.item.latitude = this.latitude;
 			},
 			onReady() {
+				this.elderMode = this.carhelp.get('getElderModeClass');
+				if(this.elderMode)
+					this.theme('elder')
+				else
+					this.theme('standard')
+					
 				//		console.log('longitude2  '+this.longitude)
 				//		console.log('latitude2  '+this.latitude) 
 				if (this.carhelp.getPersonInfo()) {
@@ -338,7 +370,8 @@
 	}
 </script>
 
-<style>
+<style lang="scss" scoped> 
+	@import "@/_theme.scss";
 	.preference_group_item {
 		padding: 15rpx;
 	}
@@ -415,6 +448,9 @@
 		margin-left: 20rpx;
 		margin-right: 20rpx;
 		margin-bottom: 10rpx;
+		@include themeify{
+			font-size: themed('font-size2');
+		}
 	}
 	.card_item2{
 		display: flex;
@@ -422,6 +458,9 @@
 		margin-left: 20rpx;
 		margin-right: 20rpx;
 		margin-bottom: 10rpx;
+		@include themeify{
+			font-size: themed('font-size2');
+		}
 	}
 	.round{
 		border-radius:50rpx; 
@@ -469,7 +508,12 @@
 	 		border-radius: 50px;
 	 		background-color: #9d9fff;
 	 		color: rgba(255, 255, 255, 100);
-	 		font-size: 12px;
+			@include themeify{
+				font-size: themed('font-size1');
+				line-height: themed('font-size5');
+				height: themed('font-size5');
+			}
+/*	 		font-size: 12px;*/
 	 		text-align: center;
 	 	}
 		
@@ -477,32 +521,47 @@
 		.fast-trickle-charge {
 			display: inline-block;
 			width: 66px;
-			height: 20px;
-			line-height: 20px;
+/*			height: 20px;
+			line-height: 20px;*/
 			border-radius: 50px;
 			background-color: #00BAC8;
 			color: rgba(255, 255, 255, 100);
-			font-size: 12px;
+			@include themeify{
+				font-size: themed('font-size1');
+				line-height: themed('font-size5');
+				height: themed('font-size5');
+			}
+/*			font-size: 12px;*/
 			text-align: center;
 		}
 		
 		.trickle-charge {
 			display: inline-block;
 			width: 44px;
-			height: 20px;
-			line-height: 20px;
+/*			height: 20px;
+			line-height: 20px;*/
 			border-radius: 50px;
 			background-color: rgba(0, 185, 98, 100);
 			color: rgba(255, 255, 255, 100);
-			font-size: 12px;
+/*			font-size: 12px;*/
+			@include themeify{
+				font-size: themed('font-size1');
+				line-height: themed('font-size5');
+				height: themed('font-size5');
+			}
 			text-align: center;
 		}
 	 
 	 	.station-items {
 	 		display: inline-block;
-	 		height: 16px;
+/*	 		height: 16px;
 	 		line-height: 16px;
-	 		font-size: 16px;
+	 		font-size: 16px;*/
+			@include themeify{
+				font-size: themed('font-size3');
+				line-height: themed('font-size3');
+				height: themed('font-size3');
+			}
 	 		margin-left: 4px;
 	 		color: #101010;
 	 
@@ -512,19 +571,28 @@
 		.fast-charge {
 			display: inline-block;
 			width: 44px;
-			height: 20px;
-			line-height: 20px;
+/*			height: 20px;
+			line-height: 20px;*/
 			border-radius: 50px;
 			background-color: #9d9fff;
 			color: rgba(255, 255, 255, 100);
-			font-size: 12px;
+/*			font-size: 12px;*/
+			@include themeify{
+				font-size: themed('font-size1');
+				line-height: themed('font-size5');
+				height: themed('font-size5');
+			}
 			text-align: center;
 		}
 	 
 	 	.address {
 	 		margin-top: 8px;
-	 		line-height: 16px;
-	 		font-size: 11px;
+			@include themeify{
+				font-size: themed('font-size1');
+				line-height: themed('font-size3');
+ 			}
+/*	 		line-height: 16px;
+	 		font-size: 11px;*/
 	 		color: rgba(119, 119, 119, 100);
 	 	}
 	 
@@ -538,16 +606,24 @@
 	 .num {
 	 	height: 20px;
 	 	color: rgba(255, 98, 0, 100);
-	 	font-size: 20px;
+		@include themeify{
+			font-size: themed('font-size5'); 
+		}
+/*	 	font-size: 20px;*/
 	 	text-align: left;
 	 	font-family: Roboto-medium;
 	 }
 	  
 	 .unit {
-	 	height: 14px;
-	 	line-height: 14px;
+/*	 	height: 14px;
+	 	line-height: 14px;*/
 	 	color: rgba(102, 102, 102, 100);
-	 	font-size: 14px;
+		@include themeify{
+						font-size: themed('font-size2'); 
+						line-height: themed('font-size2'); 
+						height: themed('font-size2'); 
+					}
+/*	 	font-size: 14px;*/
 	 	text-align: left;
 	 	font-family: AlibabaPuHui-regular;
 	 	margin-top: 6px;
@@ -564,8 +640,13 @@
 		.park-p {
 			display: inline-block;
 			width: 20px;
-			height: 18px;
-			line-height: 12px;
+			@include themeify{
+/*				font-size: themed('font-size1'); */
+				line-height: themed('font-size1'); 
+				height: themed('font-size4'); 
+			}
+/*			height: 18px;
+			line-height: 12px;*/
 			text-align: center;
 			background-color: rgba(125, 177, 255, 100);
 			color: #fff;
@@ -573,9 +654,13 @@
 		.park-text {
 			display: inline-block;
 			width: 300px;
-			height: 17px;
+/*			height: 17px;*/
 			color: rgba(102, 102, 102, 100);
-			font-size: 12px;
+/*			font-size: 12px;*/
+			@include themeify{
+				font-size: themed('font-size1'); 
+				height: themed('font-size4'); 
+ 			}
 			text-align: left;
 			margin-left: 4px;
 			margin-top: 2px;
@@ -602,14 +687,23 @@
 	 	} 
 		.free-num {
 			line-height: 52px;
-			font-size: 16px
+/*			font-size: 16px*/
+			@include themeify{
+				font-size: themed('font-size3');  
+			}
 		} 
 		.distance {
 			width: 130px;
-			height: 28px;
-			line-height: 28px;
+/*			height: 28px;
+			line-height: 28px;*/
 			color: rgba(255, 255, 255, 100);
-			font-size: 14px;
+/*			font-size: 14px;*/
+			
+			@include themeify{
+				font-size: themed('font-size2'); 
+				height: themed('font-size9'); 
+				line-height: themed('font-size9'); 
+			}
 			background-color: #00b962;
 			border-radius: 50px;
 			margin: 12px;

pages/user/finance/refundApp.vue

@@ -24,12 +24,30 @@
             }
 		},
 		onReady(){
+			this.elderMode = this.carhelp.get('getElderModeClass');
+			if(this.elderMode)
+				this.theme('elder')
+			else
+				this.theme('standard')
+
 			if (this.carhelp.getPersonInfo()) {
 				this.userId = this.carhelp.getPersonInfo().id;
 						
 			}
 		},
 		methods: {
+			theme(type) {
+			  if(type == 'dark')	
+			  {
+				document.getElementsByTagName('body')[0].setAttribute('data-theme',type);
+				  
+			  }
+			  else
+			  {
+				document.getElementsByTagName('body')[0].setAttribute('data-theme',type);
+				  
+			  } 
+			},
 			finish(){
 				uni.navigateTo({
 					url:'refundList'
@@ -46,7 +64,8 @@
 		background-color: #fff;
 	}
 </style>
-<style lang="scss" scoped>
+<style lang="scss" scoped> 
+	@import "@/_theme.scss";
 	.paySuccess{
 		text-align: center;
 		padding: 50px 0;

pages/user/finance/refundDet.vue

@@ -79,13 +79,32 @@
 				
 			}
 		},
+		onReady(){
+			this.elderMode = this.carhelp.get('getElderModeClass');
+			if(this.elderMode)
+				this.theme('elder')
+			else
+				this.theme('standard')
+		},
 		methods: {
-
+			theme(type) { 
+			  if(type == 'dark')	
+			  {
+ 				document.getElementsByTagName('body')[0].setAttribute('data-theme',type);
+ 				  
+			  }
+			  else
+			  {
+ 				document.getElementsByTagName('body')[0].setAttribute('data-theme',type);
+ 				  
+			  } 
+			}
 		}
 	}
 </script>
 
-<style lang="scss" scoped>
+<style lang="scss" scoped> 
+	@import "@/_theme.scss";
 	.rechargeDet-head{
 		background-color: #fff;
 		padding: 24px 0;

pages/user/finance/refundList.vue

@@ -84,6 +84,12 @@
 			_self = this;
 		},
 		onReady(){
+			this.elderMode = this.carhelp.get('getElderModeClass');
+			if(this.elderMode)
+				this.theme('elder')
+			else
+				this.theme('standard')
+
 			if (this.carhelp.getPersonInfo()) {
 				this.userId = this.carhelp.getPersonInfo().id;
 				console.log('userId'+this.userId)
@@ -135,6 +141,18 @@
 			});
 		},
 		methods: {
+			theme(type) {
+			  if(type == 'dark')	
+			  {
+				document.getElementsByTagName('body')[0].setAttribute('data-theme',type);
+				  
+			  }
+			  else
+			  {
+				document.getElementsByTagName('body')[0].setAttribute('data-theme',type);
+				  
+			  } 
+			},
 			refundItem(item){
 				uni.navigateTo({
 					url:'refundDet?id='+item.id
@@ -166,7 +184,8 @@
 	}
 </script>
 
-<style lang="scss" scoped>
+<style lang="scss" scoped> 
+	@import "@/_theme.scss";
 	.slot-content {
 		font-size: 28rpx;
 		color: $u-content-color;

pages/user/setting.vue

@@ -5,7 +5,7 @@
 			<u-cell-item title="修改手机号" v-model="userPhone" @click="gotoUrl('pages/user/phone')"></u-cell-item>
 			<u-cell-item title="注销账号" value="注销后无法恢复，请谨慎操作" :value-style="valueStyle" @click="gotoUrl('pages/user/logout')"></u-cell-item>
 		</u-cell-group>
-		<view class="logout-btn" @click="signOut">
+		<view class="logout-btn oldTextjp" oldstyle="font-size: 18px;" @click="signOut">
 			退出帐号
 		</view>
 		<view>

uni.scss

@@ -74,4 +74,7 @@ $uni-font-size-title:40rpx;
 $uni-color-subtitle: #555555; // 二级标题颜色
 $uni-font-size-subtitle:36rpx;
 $uni-color-paragraph: #3F536E; // 文章段落颜色
-$uni-font-size-paragraph:30rpx;
+$uni-font-size-paragraph:30rpx;
+
+@import 'node_modules/sass-mixins-variables/variables';
+@import 'node_modules/sass-mixins-variables/mixins';