Browse Source

样式优化

twt 1 year ago
parent
commit
d3afbd9e2b
4 changed files with 116 additions and 53 deletions
  1. 77 18
      pages/user/addCar/cailist.vue
  2. 35 31
      pages/user/historyDetail.vue
  3. 3 3
      pages/user/historySpend.vue
  4. 1 1
      utils/request.js

+ 77 - 18
pages/user/addCar/cailist.vue

@@ -1,7 +1,7 @@
 <template>
 	<view class="box">
 		<homenav :iStatusBarHeight="iStatusBarHeight" :title="'我的车库'" :cj="3"></homenav>
-		<view class="carlistBox">
+		<view class="carlistBox" style="display: none;">
 			<view class="line" v-for="(item,index) in carList" @click="itemClick(item)">
 				<view class="lineCont">
 					<view>
@@ -10,7 +10,6 @@
 					</view>
 					<view style="padding-left: 29rpx;">
 						<view class="carName">
-						<!-- 	<span>{{item.brand?item.brand:''}} {{item.series?item.series:''}}</span> -->
 						    <span>{{item.plateNumber}}</span>
 							<view class="plateNumber" v-if="item.milage">{{item.milage}}km</view>
 							<view class="nextCare" v-if="item.nextReturnDate||item.nextCareMilage">
@@ -18,7 +17,7 @@
 							   <span class="nextCareTitle">下次保养</span>
 							   <span class="nextCaretxt" v-if="item.nextReturnDate">{{item.nextReturnDate}}天后</span>
 							   <span class="nextCaretxt" v-if="item.nextReturnDate&&item.nextCareMilage">或</span>
-							   <span class="nextCaretxt" v-if="item.nextCareMilage">{{item.nextCareMilage}}km</span>
+							   <span class="nextCaretxt" v-if="item.nextCareMilage&&item.nextCareMilage>-1">{{item.nextCareMilage}}km</span>
 							</view>
 						</view>
 						<!-- <view class="carMS">{{item.carModel?item.carModel:''}}</view> -->
@@ -26,14 +25,40 @@
 					</view>
 				</view>
 				<view class="lineBottom">
-					<view class="lineDel" @click.stop="editCar(item.id)">编辑</view>
+					<!-- <view class="lineDel" @click.stop="editCar(item.id)">编辑</view> -->
 					<view class="lineDel" v-if="openMCar.showType==1" @click.stop="maintain(item)">保养信息</view>
 					<!-- <view class="Default" v-show="item.isDefault!=1" @click.stop="defaultCar(item)">设为默认</view>
-					<view class="DefaultYES" v-show="item.isDefault==1">已设为默认</view> -->
+					<view class="DefaultYES" v-show="item.isDefault==1">已设为默认</view> --> 
 				</view>
 				<view class="DefaultIcon" v-show="item.isDefault==1">默认</view>
 			</view>
 		</view>
+		<view class="carlistBox">
+			<view class="line" v-for="(item,index) in carList" @click="itemClick(item)">
+				<view class="lineTop">
+					<view class="lineplateNumber">{{item.plateNumber}}</view>
+					<view class="lineSx1"></view>
+					<view class="linekk">
+						<view class="linekkrow" v-if="item.nextCareMilage" style="color: #333333;">{{item.nextCareMilage}}km</view>
+						<view class="linekkrow" v-else>-</view>
+						<view class="linekkrow">建议下次</view>
+						<view class="linekkrow" >保养里程</view>
+					</view>
+					<view class="lineSx"></view>
+					<view class="linekk">
+						<view class="linekkrow" v-if="item.nextCareDate" style="color: #333333;">{{item.nextCareDate.slice(0,10)}}</view>
+						<view class="linekkrow" v-else>-</view>
+						<view class="linekkrow">建议下次</view>
+						<view class="linekkrow" >保养日期</view>
+					</view>
+				</view>
+				<view class="lineBottom">
+					 <view class="lineDel" @click.stop="editCar(item.id)">编辑</view>
+					<view class="lineDel"  @click.stop="maintain(item)">保养信息</view>
+				</view>
+				<view class="DefaultIcon2"  v-show="item.isDefault==1">默认</view>
+			</view>
+		</view>
 		<view v-if="carList==''&&loding" class="nodataBox">
 
 			<image src="http://dmsphoto.66km.com.cn/thFiles/3C95A4C5-73F8-4B34-902B-703B8A0825C9.png" mode="widthFix" class="nodataImg"></image>
@@ -45,11 +70,9 @@
 
 		<view class="bottomView">
 			<view class="saveCar" :style="{background:'#'+themeColor}" @click="addBtn">
-				<!-- <image src="../../../static/img/icon_tianjiacheliang.png" mode=""
-					style="width: 44rpx; height: 36rpx; margin-right: 10rpx;"></image> -->
 				<view>添加爱车</view>
 			</view>
-		</view>
+		</view> 
 
 	</view>
 </template>
@@ -146,21 +169,44 @@
 </script>
 
 <style scoped>
+	.lineTop{
+		display: flex;justify-content: space-between;
+		color: #3C3C3C;
+		font-size: 30rpx;
+	}
+	.linekk{
+		text-align: center;
+		color: #999999;
+		font-size: 22rpx;
+		line-height: 36rpx;
+		width: 32%;
+	}
+	.lineSx1{
+		width: 2rpx;height: 60rpx;
+		background: #DDDDDD;margin-top: 24rpx;
+	}
+	.lineSx{
+		width: 2rpx;height: 80rpx;
+		background: #DDDDDD;margin-top: 14rpx;
+	}
+	.lineplateNumber{
+		font-weight: 600;
+		display: flex;
+	    align-items: center;
+		width: 32%;
+		justify-content: center;
+	}
 	.carByIcon{
 		width: 34rpx;height: 34rpx;
 	}
 	.nextCaretxt{
 		color: #FF0000;
 	}
-	.nextCareTitle{
-		padding-left: 8rpx;
-	}
 	.nextCare{
-		color: #333333;
-		font-size: 26rpx;
-		line-height: 37rpx;
-		padding-left: 10rpx;
+		font-size: 20rpx;
+		line-height: 36rpx;
 		display: flex;
+		padding-left: 6rpx;
 	}
 	.box {
 		min-height: 100vh;
@@ -225,7 +271,7 @@
 
 	.line {
 		background: #FFFFFF;
-		padding: 27rpx 20rpx;
+		padding: 20rpx 20rpx;
 		border-radius: 10rpx;
 		margin-bottom: 20rpx;
 		position: relative;
@@ -263,7 +309,7 @@
 	.lineBottom {
 		display: flex;
 		justify-content: flex-end;
-		padding-top: 20rpx;
+		padding-top: 30rpx;
 	}
 
 	.lineDel {
@@ -275,7 +321,7 @@
 		line-height: 50rpx;
 		font-size: 26rpx;
 		color: #3C3C3C;
-		margin-right: 29rpx;
+		margin-left: 29rpx;
 		padding: 0 20rpx;
 	}
 
@@ -314,4 +360,17 @@
 		color: #FFFFFF;
 		font-size: 22rpx;
 	}
+	.DefaultIcon2{
+		position: absolute;
+		top: 0;
+		left: 0;
+		width: 109rpx;
+		height: 40rpx;
+		background: linear-gradient(131deg, #FFA72C 0%, #FF450F 100%);
+		border-radius: 10px 0rpx 10px 0rpx;
+		text-align: center;
+		line-height: 40rpx;
+		color: #FFFFFF;
+		font-size: 22rpx;
+	}
 </style>

+ 35 - 31
pages/user/historyDetail.vue

@@ -54,19 +54,19 @@
 				
 				<view class="CarModel" v-if="orderData.billsheet.CarModel">{{orderData.billsheet.CarModel}}</view>
 				<view class="goodscostLine" >
-					<view class="informationTxt">进店里程</view>
-					<view class="goodsCostNum3 " v-if="orderData.billsheet.CurrentMileage>0">
-						{{orderData.billsheet.CurrentMileage}}km
+					<view class="informationTxt">进店里程</view>
+					<view class="goodsCostNum3 " style="font-size: 28rpx;" v-if="orderData.billsheet.CurrentMileage>0">
+						{{orderData.billsheet.CurrentMileage}}公里
 					</view>
 				</view>
 				<view class="goodscostLine" >
-					<view class="informationTxt">建议下次保养里程</view>
-					<view class="goodsCostNum3 " v-if="orderData.billsheet.NextCareMilage">
-						{{orderData.billsheet.NextCareMilage}}km
+					<view class="informationTxt">建议下次保养里程</view>
+					<view class="goodsCostNum3 " style="font-size: 28rpx;color: #FDC752;" v-if="orderData.billsheet.NextCareMilage">
+						{{orderData.billsheet.NextCareMilage}}公里
 					</view>
 				</view>
-				<view class="goodscostLine" v-if="orderData.billsheet.SheetType==1">
-					<view class="informationTxt">建议下次保养时间</view>
+				<view class="goodscostLine" style="font-size: 28rpx;color: #FDC752;" v-if="orderData.billsheet.SheetType==1">
+					<view class="informationTxt">建议下次保养时间</view>
 					<view class="goodsCostNum3 " v-if="orderData.billsheet.NextCareDate">
 						{{orderData.billsheet.NextCareDate.slice(0,10)}}
 					</view>
@@ -76,7 +76,7 @@
             </view>
 			<!-- 店铺信息 -->
 			<view class="shopBox">
-				<image src="../../static/img/icon_store.png" mode="" class="shopBoximg"></image>
+				<!-- <image src="../../static/img/icon_store.png" mode="" class="shopBoximg"></image> -->
 				<view class="shopCont">
 					<view class="shopName">{{orderData.billsheet.ShopName}}</view>
 					<view class="Address" v-if="orderData.billsheet.shopMobilePhone">服务电话:{{orderData.billsheet.shopMobilePhone}}</view>
@@ -106,15 +106,15 @@
 					
 				</view>
 				<view class="informationLine">
-					<view class="informationTxt">单号</view>
+					<view class="informationTxt">单号</view>
 					<view class="informationNum">{{orderData.billsheet.Code}}</view>
 				</view>
 				<view class="informationLine">
-					<view class="informationTxt">服务顾问</view>
+					<view class="informationTxt">服务顾问</view>
 					<view class="informationNum">{{orderData.billsheet.PickName}}</view>
 				</view>
 				<view class="informationLine">
-					<view class="informationTxt">技师</view>
+					<view class="informationTxt">技师</view>
 					<view class="informationNum">{{orderData.billsheet.workNames}}</view>
 				</view>
 				<!-- <view class="informationLine">
@@ -126,13 +126,13 @@
 					<view class="informationNum">{{orderData.billsheet.time}}</view>
 				</view> -->
 				<view class="informationLine" v-if="FaultDescription">
-					<view class="informationTxt">故障描述</view>
+					<view class="informationTxt">故障描述</view>
 					<view class="informationNum" v-if="orderData.billsheet.FaultDescription">
 						{{orderData.billsheet.FaultDescription}}
 					</view>
 				</view>
 				<view class="informationLine" v-if="RepairDescription">
-					<view class="informationTxt">维修建议</view>
+					<view class="informationTxt">维修建议</view>
 					<view class="informationNum" v-if="orderData.billsheet.RepairDescription">
 						{{orderData.billsheet.RepairDescription}}
 					</view>
@@ -146,7 +146,7 @@
 					</view>
 				</view> -->
 				<view class="informationLine" v-if="Comment">
-					<view class="informationTxt">备注</view>
+					<view class="informationTxt">备注</view>
 					<view class="informationNum" v-if="orderData.billsheet.Comment">{{orderData.billsheet.Comment}}
 					</view>
 				</view>
@@ -210,7 +210,7 @@
 						</view>
 						<view class="itemWorkHoursBox" v-if="itemWorkHours&&itemWorkHours" :class="{nopb:GoodsComment&&item.Comment}">
 							<view class="itemWorkHours" v-if="goodsNumber">
-								数量:<span class="SalePrice">{{item.SaleQty}}</span> 
+								数量:<span class="SalePrice">{{item.SaleQty}}<span v-if="item.Unit">({{item.Unit}})</span> </span> 
 							</view>
 							<view class="itemPrice" v-if="goodsPrice">
 								单价:<span class="SalePrice">{{item.SalePrice}}</span>
@@ -232,7 +232,7 @@
 				<view class="detailedTitle">费用明细</view>
 				<view class="goodscostLine" v-if="AmountMoney">
 					<view class="goodscostTxt">应收总计</view>
-					<view class="goodsCostNum">¥{{orderData.billsheet.AmountMoney?orderData.billsheet.AmountMoney:0}}</view>
+					<view class="goodsCostNum3">¥{{orderData.billsheet.AmountMoney?orderData.billsheet.AmountMoney:0}}</view>
 				</view>
 				<view class="goodscostLine" v-if="TotalDiscountMoney">
 					<view class="goodscostTxt">优惠总计</view>
@@ -248,7 +248,7 @@
 				</view>
 				<view class="goodscostLine" v-if="ReceiptsMoney">
 					<view class="goodscostTxt">支付金额</view>
-					<view class="goodsCostNum">¥{{orderData.billsheet.money?orderData.billsheet.money:0}}</view>
+					<view class="goodsCostNum"><span style="font-size: 28rpx;"></span>{{orderData.billsheet.money?orderData.billsheet.money:0}}</view>
 				</view>
 				<view class="goodscostLine" >
 					<view class="goodscostTxt">结算方式</view>
@@ -625,7 +625,7 @@
 			font-weight: 600;
 	}
 	.GoodsName{
-		font-size: 28rpx !important;
+		font-size: 30rpx !important;
 	}
 	.itemWorkHoursBox{
 		display: flex;
@@ -731,7 +731,7 @@
 		margin-left: 28rpx;
 	}
     .shopBox2{
-		padding: 30rpx 20rpx;
+		padding: 30rpx 0rpx;
 		margin: 0rpx 24rpx;
 		margin-top: -60rpx;
 		background-color: #FFFFFF;
@@ -753,8 +753,8 @@
 	}
 
 	.shopCont {
-		width: 405rpx;
-		padding-left: 20rpx;
+		width: 470rpx;
+	/* 	padding-left: 20rpx; */
 
 	}
 
@@ -898,9 +898,9 @@
 
 
 	.detailedName {
-		font-size: 28rpx;
+		font-size: 30rpx;
 		color: #3C3C3C;
-		font-weight: 600;
+		font-weight: 500;
 	}
 
 	.kaColor {
@@ -959,7 +959,7 @@
 
 	.price {
 
-		font-size: 32rpx;
+		font-size: 26rpx;
 		font-weight: 500;
 		/* color: #FF0000; */
 		display: flex;
@@ -990,19 +990,20 @@
 		display: flex;
 		justify-content: space-between;
 		font-size: 26rpx;
-		padding: 20rpx 20rpx;
+		padding: 15rpx 20rpx;
 		color: #333333;
 	}
 
 	.goodsCostNum {
 		color: #FF0000;
-		font-weight: bold;
+		font-weight: 500;
+		font-size: 36rpx;
 	}
     .goodsCostNumJsfs{
 		color: #333333;
 	}
 	.goodsCostNum3{
-		font-weight: bold;
+		font-weight: 500;
 	}
 	.information {
 		width: 702rpx;
@@ -1017,6 +1018,7 @@
 		display: flex;
 		font-size: 26rpx;
 		padding: 15rpx 20rpx;
+		justify-content: space-between;
 	}
 
 	.informationTxt {
@@ -1027,6 +1029,7 @@
 	.informationNum {
 		color: #333333;
 		width: calc(100vw - 200rpx);
+		text-align: right;
 	}
 
 	.copyBtn {
@@ -1357,17 +1360,18 @@
 
 	.ping {
 		text-align: center;
-		color: #FF4F00;
+		/* color: #FF4F00; */
+		color: #666666;
 		width: 150rpx;
 		height: 56rpx;
 		line-height: 56rpx;
 		border-radius: 36rpx;
-		border: 2rpx solid #FF4F00;
+		border: 2rpx solid #DDDDDD;
 	}
 
 	.kan {
 		text-align: center;
-		color: #3C3C3C;
+		color: #666666;
 		width: 150rpx;
 		height: 56rpx;
 		line-height: 56rpx;

+ 3 - 3
pages/user/historySpend.vue

@@ -556,17 +556,17 @@
 	
 	.ping{
 		text-align: center;
-		color: #FF4F00;
+		color: #666666;
 		width: 150rpx;
 		height: 56rpx;
 		line-height: 56rpx;
 		border-radius: 36rpx;
-		border: 2rpx solid #FF4F00;
+		border: 2rpx solid #DDDDDD;
 		margin-right: 24rpx;
 	}
 	.kan{
 		text-align: center;
-		color: #3C3C3C;
+		color: #666666;
 		width: 150rpx;
 		height: 56rpx;
 		line-height: 56rpx;

+ 1 - 1
utils/request.js

@@ -10,7 +10,7 @@ const extConfig = uni.getExtConfigSync();
 console.log(extConfig)
 const baseUrl=extConfig.url+'/'
 
-//const baseUrl='http://192.168.0.171:20187/'
+//const baseUrl='http://192.168.0.178:20187/'
 //const baseUrl='https://store-api.qdbtl.cn/'
 //const baseUrl='https://apidms.66km.com/'