找桩 个人资料修改

pages/searchPile/searchPile.vue

@@ -108,7 +108,7 @@
 				<u-mask :show="show" @click="show = false"></u-mask>
 			<view v-show="!viewMode" >
 				 
-				<view v-for="(item,index) in stationslist" :key="item.id" class="charing-slow"   @click="stationDetail(item)">
+				<!-- <view v-for="(item,index) in stationslist" :key="item.id" class="charing-slow"   @click="stationDetail(item)">
 					<text :class="item.type == '快充' ? 'fast-charge':(item.type == '慢充' ? 'trickle-charge':'fast-trickle-charge')">{{item.type}}</text> <text class="station-items">{{item.name}}</text>
 					<view class="address">
 						{{item.position}}
@@ -131,6 +131,39 @@
 							<text class="iconfont distance-font">&#xe615;</text>{{item.distance.toFixed(1)}}公里 {{item.time.toFixed(0)}}分钟
 						</view>
 					</view>
+				</view> -->
+				  <view v-for="(item,index) in stationslist" :key="item.id" class="charing-slow"   @click="stationDetail(item)">
+					
+					<view class="flex">
+					<view class="left">
+						<view class="address">
+							{{item.position}}
+						</view>
+						<view class="price">
+							<view class="num">{{item.price}}</view>
+							<view class="unit">
+								 元/度 起
+							</view>
+						</view>
+						<view class="park">
+							<text class="park-p" style="color: #FFFFFF;">p</text>
+							<text class="park-text">2小时免费停车</text>
+						</view>	
+					</view>
+					<view class="img-box">
+						<img src="../../static/img/电桩管理.png" alt="">
+					</view>
+					</view>
+					
+					<view class="free">
+						<text :class="item.type == '快充' ? 'fast-charge':(item.type == '慢充' ? 'trickle-charge':'fast-trickle-charge')">{{item.type}}</text> <text class="station-items">{{item.name}}</text>
+						<view class="free-num">
+							<text style="color:#009143;">空闲{{item.idleNum}}</text>/总数{{item.total}}
+						</view>
+						<view class="distance">
+							<text class="iconfont distance-font">&#xe615;</text>{{item.distance.toFixed(1)}}公里 {{item.time.toFixed(0)}}分钟
+						</view>
+					</view>
 				</view>
 				 
 				<u-divider margin-top="20" bg-color="#F2F4F4">已经到底了</u-divider>
@@ -1399,56 +1432,53 @@ export default {
  	left: 0;
  	right: 0;
 }
- 	.fast-charge {
- 		display: inline-block;
- /*		width: 44px;
- 		height: 20px;
- 		line-height: 20px;*/
- 		border-radius: 100rpx;
- 		background-color: #9d9fff;
- 		color: rgba(255, 255, 255, 100);
+.fast-charge {
+		display: inline-block;
+		border-radius: 50px;
+		border-radius: 4px;
+		background-color: rgba(208, 209, 255, 100);
+		color: rgba(56, 60, 255, 100);
+
+		margin: auto 0;
 		@include themeify{
-			width: themed('font-size17');
-			font-size: themed('font-size1');
-			line-height: themed('font-size5');
-			height: themed('font-size5');
+			width: themed('font-size18');
+			font-size: themed('font-size2');
+ 			line-height: themed('font-size7');
+			height: themed('font-size8');
 		}
- 		text-align: center;
- 	}
+		text-align: center;
+	}
 	
 	.fast-trickle-charge {
 		display: inline-block;
-	/*	width: 66px;
-		height: 20px;
-		line-height: 20px;*/
-		border-radius: 100rpx;
-		background-color: #00BAC8;
-		color: rgba(255, 255, 255, 100); 
+	     margin: auto 0;
+		border-radius: 4px;
+		background-color: rgba(172, 236, 240, 100);
+		color: rgba(0, 124, 134, 100);
 		@include themeify{
-			width: themed('font-size17');
-			font-size: themed('font-size1');
-			line-height: themed('font-size5');
-			height: themed('font-size5');
+			width: themed('font-size18');
+			font-size: themed('font-size2');
+			line-height: themed('font-size7');
+			height: themed('font-size8');
 		}
 		text-align: center;
 	}
 	.trickle-charge {
 		display: inline-block;
-	/*	width: 44px;
-		height: 20px;
-		line-height: 20px;*/
-		border-radius: 100rpx;
-		background-color: rgba(0, 185, 98, 100);
-		color: rgba(255, 255, 255, 100);
+	border-radius: 4px;
+	margin: auto 0;
+		
+		background-color: rgba(186, 240, 215, 100);
+		color: rgba(0, 130, 69, 100);
 		@include themeify{
-			width: themed('font-size17');			
-			font-size: themed('font-size1');
-			line-height: themed('font-size5');
-			height: themed('font-size5');
+			width: themed('font-size18');			
+			font-size: themed('font-size2');
+			line-height: themed('font-size7');
+			height: themed('font-size8');
 		}
 		text-align: center;
 	}
- 
+  
  	.station-items {
  		display: inline-block;
 /* 		height: 16px;
@@ -1459,47 +1489,38 @@ export default {
 			line-height: themed('font-size3');
 			height: themed('font-size3');
 		}
-/* 		font-size: 16px;*/
+
  		margin-left: 8rpx;
  		color: #101010;
  
  
  	}
+	//
 	
-	.fast-charge {
-		display: inline-block;
-	/*	width: 44px;
-		height: 20px;
-		line-height: 20px;*/
-		border-radius: 50px;
-		background-color: #9d9fff;
-		color: rgba(255, 255, 255, 100);
-/*		font-size: 12px;*/
-		
-		@include themeify{
-			width: themed('font-size17');
-			font-size: themed('font-size1');
- 			line-height: themed('font-size5');
-			height: themed('font-size5');
-		}
-		text-align: center;
-	}
- 
+  .left{
+	  width: 65%;
+  }
  	.address {
- 		margin-top: 16rpx;
-/* 		line-height: 16px;*/
+		
+		line-height: 20px;
+ 		
+        white-space: nowrap;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		
 		@include themeify{
-			font-size: themed('font-size1');
-			line-height: themed('font-size3');
+			font-size: themed('font-size5');
+			line-height: themed('font-size7');
 		}
 /* 		font-size: 11px;*/
- 		color: rgba(119, 119, 119, 100);
+font-weight: 600;
+ 		color: #101010;
  	}
  
  	.price {
  		display: flex;
  		height: 40rpx;
- 
+        margin-top: 8px;
  	}
  
  
@@ -1522,7 +1543,7 @@ export default {
 	@include themeify{
 			font-size: themed('font-size2');
 			height: themed('font-size2');
-			line-height: themed('font-size2');
+			// line-height: themed('font-size2');
 	}
 /* 	font-size: 14px;*/
  	text-align: left;
@@ -1548,13 +1569,12 @@ export default {
 			height: themed('font-size4');
 		}
 		text-align: center;
-		background-color: rgba(125, 177, 255, 100);
+		// background-color: rgba(125, 177, 255, 100);
+		background-color: #00b962;
 		color: #fff;
 	}
 	.park-text {
 		display: inline-block;
-		width: 300px;
-/*		height: 17px;*/
 		color: rgba(102, 102, 102, 100);
 		@include themeify{
 			font-size: themed('font-size1');
@@ -1577,16 +1597,17 @@ export default {
 	  height: 100%;
 	}
  	.free {
- 		display: flex;
- 		justify-content: space-between;
+ 		
  		height: 52px;
- 		border-top: 1px solid rgba(238, 242, 240, 100);
  		margin-top: 10px;
+		
  
  		
  	} 
 	.free-num {
 		line-height: 52px;
+		margin-left: 4px;
+		display: inline-block;
 		@include themeify{
 			font-size: themed('font-size3');
 			font-weight: themed('fontWeight');
@@ -1594,7 +1615,13 @@ export default {
 /*		font-size: 16px*/
 	} 
 	.distance {
-		width: 130px;
+		
+		padding: 0 10px;
+		
+		
+	    float: right;
+		margin-top: 13px;
+		
 /*		height: 28px;
 		line-height: 28px;*/
 		color: rgba(255, 255, 255, 100);
@@ -1607,7 +1634,7 @@ export default {
 		font-size: 14px;*/
 		background-color: #00b962;
 		border-radius: 50px;
-		margin: 12px;
+		
 		text-align: center;
 
 		
@@ -1640,4 +1667,15 @@ export default {
 		border: 2px solid rgba(255, 255, 255, 100);
 		border-radius: 999px;
 	}
+	.img-box{
+		 
+		img{
+			width: 100px;
+			height: 75px;
+		}
+	}
+	.flex{
+		   display: flex;
+		   justify-content: space-between;
+	}
 </style>

pages/user/dataSet.vue

@@ -153,7 +153,7 @@
 
 						<u-switch v-model="checked" active-color="#00E266" @change="checkedChange"></u-switch>
 					</view>
-					<u-icon name="arrow-right-s-line" custom-prefix="custom-icon" color="#B3B3B3" size="48"></u-icon>
+					<!-- <u-icon name="arrow-right-s-line" custom-prefix="custom-icon" color="#B3B3B3" size="48"></u-icon> -->
 				</view>
 			</view>
 			<!-- 注销账号 -->
@@ -509,7 +509,7 @@
 <style lang="scss" scoped>
 	page {
 		background-color: #fff;
-		padding-bottom: 67px;
+		padding-bottom: 20px;
 	}
 
 	.userCell {
@@ -531,7 +531,7 @@
 			display: flex;
 			justify-content: space-between;
 			align-items: center;
-			padding: 16px;
+			padding: 11px 20px;
 
 			.userCell-title {
 				font-size: 16px;