1

components/nodata/nodata.vue

@@ -36,9 +36,9 @@ export default {
 	  padding-top: 100rpx;
 	}
 	.noTxt{
-		font-size: 32rpx;
+		font-size: 28rpx;
 		color: #999999;
-		padding-top: 50rpx;
+		padding-top: 24rpx;
 	}
 	.nodataBox{
 		text-align: center;

pages/index/goodsDetail.vue

@@ -12,9 +12,14 @@
 				
 			</swiper>
 	  	</view>
-		<view class="name" v-if="loading">{{info.name}} | {{info.specificationModel}} </view>
-		<view class="goodsMs">{{info.factoryNumber}}</view>
-		<view class="goodsMs">{{info.carmodelremark}}</view>
+		<view class="msBox">
+			<view class="name" v-if="loading">{{info.name}} </view>
+			<view class="goodsMs"><span class="dian"></span>型号：{{info.specificationModel}}<span class="factoryNumber" v-if="info.factoryNumber">{{info.factoryNumber}}</span></view>
+			<view class="goodsMs"><span class="dian"></span>
+			  <view class="carmodelremark">适用车型：{{info.carmodelremark}}</view> 
+			</view>
+		</view>
+		
 		<view style="height: 30rpx;background: #F4F5F7;" v-if="html"></view>
 		<view class="detail" v-if="html">
 			<view class="datailTitle" v-if="html">商品详情</view>
@@ -109,9 +114,9 @@
 }
 .name{
 	font-weight: 500;
-	color: #1A1A1A;
+	color: #222;
 	line-height: 40rpx;
-	font-size: 28rpx;
+	font-size: 32rpx;
 	padding: 30rpx 24rpx;
 	padding-bottom: 10rpx;
 }
@@ -127,9 +132,38 @@
 	 width: 750rpx;
 }
 .goodsMs{
-		font-size: 24rpx;
-		color: #999999;
+		font-size: 26rpx;
+		color: #3C3C3C;
 		line-height: 33rpx;
 		padding: 10rpx 24rpx;
+		display: flex;
+		line-height: 44rpx;
+	}
+	.msBox{
+		background: #F8F8F8;
+		    padding-bottom: 10rpx;
+	
+	}
+	.dian{
+		display: inline-block;
+		width: 10rpx;
+		height: 10rpx;
+		background: #A3A3A3;
+		border-radius: 6rpx;
+		margin-top: 14rpx;
+		margin-right: 6rpx;
+	}
+	.factoryNumber{
+		 padding: 0 10rpx;
+		 border-radius: 8rpx;
+		  border:1px solid #E60006; 
+		 margin-left: 10rpx;
+		 display: inline-block;
+		 /* background: #E60006; */
+		 font-size: 26rpx;
+		 color: #E60006;
+	}
+	.carmodelremark{
+		width: 680rpx;
 	}
 </style>

pages/index/goodsList.vue

@@ -9,9 +9,12 @@
 				<view>
 					<view class="historylinecar">{{optdata.value}}</view>
 					<view class="historyLineVin" v-if="optdata.isVin==1"><!--  -->
-						<view class="vinms">VIN</view>
-						<view class="vinNum">{{optdata.vin}}</view>
-						<view class="copyVin">复制</view>
+						<view style="display: flex;">
+							<view class="vinms">VIN:</view>
+							<view class="vinNum">{{optdata.vin}}</view>
+						</view>
+						
+						<view class="copyVin" @click="copy(optdata.vin)">复制</view>
 					</view>
 				</view>
 				
@@ -54,20 +57,26 @@
 				</view> -->
 				
 				<view class="jylineBox" v-if="loading">
+					<!-- <view class="ckName">
+					{{componentName}}
+					</view> -->
 					<view class="jyline" v-for="(item,index) in MaintainPartList" @click="godetail(item)"><!-- MaintainPartList -->
 						<view class="jyimgBox">
-							<!-- <image v-if="item.imgs.split(',')[0]" :src="item.imgs.split(',')[0]" mode="aspectFit" class="jyimg"></image> -->
-							<image  src="../../static/img/noimg.png" mode="aspectFit" class="jyimg"></image>
+							<image v-if="item.imgs.split(',')[0]" :src="item.imgs.split(',')[0]" mode="aspectFit" class="jyimg"></image> 
+							<image v-else src="../../static/img/noimg.png" mode="aspectFit" class="jyimg"></image>
 						</view>
 						<view class="lineRgiht">
-							<view class="goodsName">{{item.name}} {{item.specificationModel}}</view>
-							<view class="goodsMs">{{item.factoryNumber}}</view>
-							<view class="goodsMs modelRemark" @click.stop="modelRemarkFn(item.modelRemark)">{{item.carmodelremark}}</view>
+							<view class="goodsName">{{item.name}} </view>
+							<view class="goodsMs">型号：{{item.specificationModel}}<span class="factoryNumber" v-if="item.factoryNumber">{{item.factoryNumber}}</span></view>
+							<view class="goodsMs modelRemark" @click.stop="modelRemarkFn(item.carmodelremark)">适用车型：{{item.carmodelremark}}</view>
 						</view>
 						
 					</view>
 				</view>
-				<nodata v-if="MaintainPartList.length==0"></nodata>
+				<view v-if="MaintainPartList.length==0" style="padding-top: 200rpx;">
+						<nodata ></nodata>
+				</view>
+			
 			</view>
 			
 			<!-- <view class="jiyouBox"  v-if="loading">
@@ -114,14 +123,15 @@
 			   modelRemarkNum:1,
 			   oldMaintainPartList:'',
 			   type:'',
-			   componentCode:'',
+			   componentCode:'003001,003003',
 			   leftData:[
-				   {name:'全部',componentCode:''},
+				   {name:'全部',componentCode:'003001,003003'},
 				   {name:'点火线圈',componentCode:'003001'},
 				   {name:'火花塞',componentCode:'003003'},
 			   ],
 			   leftIndex:0,
 			   messageText:'',
+			   componentName:'全部',
 			}
 		},
 		onLoad(opt) {
@@ -150,6 +160,22 @@
 			  //this.queryOilInfoByGroupID()
 		},
 		methods: {
+			copy(e){
+				uni.setClipboardData({
+								   data: e,
+								   success: function () {
+									 uni.showToast({
+									   title: '复制成功',
+									   icon: 'success',
+									   duration: 2000
+									 });
+								   },
+								   fail: function () {
+									 console.log('复制失败');
+									
+								   }
+								 });
+			},
 			modelRemarkFn(txt){
 				this.messageText=txt
 				this.$refs.popup.open('center')
@@ -238,6 +264,19 @@
 					 // this.modelRemarkTab(1)
 				 })
 			 },
+			 saveQueryHistory(){
+			   this.$http2('saveQueryHistory', {
+				 nLevelID:this.optdata.nLevelID,
+				 logo:this.optdata.logo,
+				 title:this.optdata.value,
+				 groupId:this.optdata.id,
+				 isVin:this.isVin,
+				 vin:this.vin
+				},'POST').then(res => {
+							
+					
+			   })
+			 },
 			 queryOilInfoByGroupID(){
 				 var that=this;
 				 this.$http('matchingByOpen/queryOilInfoByGroupID', {
@@ -300,8 +339,8 @@
 	}
 
 	.historylinecarImg{
-		width: 54rpx;
-		height: 54rpx;
+		width: 80rpx;
+		height: 80rpx;
 	}
 	.historyLogoBox{
 			display: flex;align-items: center;
@@ -310,10 +349,10 @@
 
 	.historylinecar {
 		font-weight: 500;
-		font-size: 26rpx;
+		font-size: 32rpx;
 		color: #1A1A1A;
 		line-height: 46rpx;
-		width: 636rpx;
+		width: 616rpx;
 	}
 
 	.historyLine {
@@ -355,8 +394,9 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 	.jiyouBox{
 		/* margin-top: 30rpx; */
 		background: #ffffff;
-		padding: 30rpx;
+	/* 	padding: 30rpx; */
 		width: 590rpx;
+		/* padding-top: 0rpx; */
 	}
 	.jiyoutopTitle{
 		font-weight: 500;font-size: 28rpx;
@@ -373,8 +413,11 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 		border-radius: 10rpx;
 	}
 	.jyline{
-		padding-top: 30rpx;
+		padding-top: 22rpx;
 		display: flex;
+		border-bottom: 1px solid #EEEEEE;
+		    padding-bottom: 20rpx;
+			padding-left: 24rpx;
 	}
 	.jyName{
 		font-weight: 400;font-size: 22rpx;
@@ -395,17 +438,18 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 		/* display: flex;justify-content: space-between;flex-wrap: wrap; */
 	}
 	.historyLineVin{
-		display: flex;background: #ffffff;
+		display: flex;background: #ffffff;justify-content: space-between;
+		padding-top: 10rpx;
 	}
 	.historyLineCar{
 		display: flex;justify-content: space-between;
 	}
 	.vinNum{
-		font-weight: 400;font-size: 22rpx;padding-left: 10rpx;
+		font-weight: 400;font-size: 26rpx;padding-left: 10rpx;
 		color: #999999;line-height: 30rpx;
 	}
 	.vinms{
-		width: 38rpx;
+		/* width: 38rpx;
 		height: 26rpx;
 		background: linear-gradient(224deg, #FFDA28 0%, #FFBF35 100%);
 		border-radius: 4rpx;
@@ -414,7 +458,11 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 		font-weight: 600;
 		color: #FFFFFF;
 		font-size: 18rpx;
-		margin-top: 2rpx;
+		margin-top: 2rpx; */
+		font-weight: 400;
+		font-size: 26rpx;
+		color: #999999;
+		line-height: 30rpx;
 	}
 	.ruleListSpan{
 		font-weight: 400;
@@ -439,7 +487,7 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 	}
 	.topBtnBox{
 		display: flex;padding-bottom: 30rpx;
-		padding-left: 70rpx;
+		padding-left: 90rpx;
 	}
 	.topBtn{
 		font-weight: 400;
@@ -455,13 +503,13 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 	}
 	.copyVin{
 		font-weight: 400;
-		font-size: 22rpx;
-		color: #3C3C3C;
+		font-size: 26rpx;
+		color: #3F90F7;
 		width: 62rpx;
 		height: 34rpx;
-		background: #F4F5F7;
-		border-radius: 4rpx;
-		line-height: 34rpx;
+	/* 	background: #F4F5F7;
+		border-radius: 4rpx; */
+		line-height: 30rpx;
 		text-align: center;
 		margin-left: 16rpx;
 	}
@@ -477,18 +525,18 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 		margin-right: 20rpx;
 	}
 	.lineRgiht{
-		padding-left: 24rpx;
+		padding-left: 16rpx;
 	}
 	.goodsName{
-		font-size: 28rpx;
-		color: #3C3C3C;
+		font-size: 30rpx;
+		color: #222;
 		line-height: 40rpx;
 	}
 	.goodsMs{
-		font-size: 24rpx;
-		color: #999999;
+		font-size: 26rpx;
+		color: #3C3C3C;
 		line-height: 33rpx;
-		padding-top: 10rpx;
+		padding-top: 6rpx;
 	}
 	.brandActive{
 		background: rgba(255,79,0,0.08);
@@ -507,14 +555,14 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 	}
 .goodsLefeLine{
 	display: flex;justify-content: center;
-	padding: 22rpx 10rpx;
+	padding: 30rpx 10rpx;
 }
 .glActive{
 	background: #ffffff;
 }
 .glActive .glName{
 font-weight: 500;
-font-size: 26rpx;
+font-size: 30rpx;
 color: #E60006;
 /* border-left:4rpx solid #E60006; */
 }
@@ -531,7 +579,7 @@ color: #E60006;
 }
 .glName{
 	width: 170rpx;text-align: center;
-	font-size: 26rpx;
+	font-size: 30rpx;
 }
 .modelRemark{
 	overflow: hidden;
@@ -544,7 +592,31 @@ color: #E60006;
 		align-items: center;
 		justify-content: center;
 		padding: 15px;
-		height: 50px;
+		
 		background-color: #fff;
+		max-height: 50vh;
+		overflow: scroll;
 	}
+.ckName{
+	width: 532rpx;
+	height: 60rpx;
+	background: #F6F6F6;
+	border-radius: 4rpx;
+	font-size: 26rpx;
+	color: #3C3C3C;
+	line-height: 60rpx;
+	margin-left: 20rpx;
+	padding-left: 20rpx;
+	font-weight: 600;
+}
+.factoryNumber{
+	    padding: 0 10rpx;
+		border-radius: 8rpx;
+		 border:1px solid #E60006; 
+		margin-left: 10rpx;
+		display: inline-block;
+		/* background: #E60006; */
+		font-size: 26rpx;
+		color: #E60006;
+}
 </style>

pages/index/index.vue

@@ -80,9 +80,13 @@
 			 <view class="contBox">
 			 			 <view class="vincar">
 			 				 <view class="vincarTab">
-			 					  <view class="vincarTabLine anVin " :class="{vincarActive:vincarActiveNum==1}" @click="vincarActiveFn(1)">按VIN</view>
-			 					  <view class="vincarTabLine" style="margin-right: 50rpx;" @click="goCarModel">按车型</view>
-								  <view class="vincarTabLine" :class="{vincarActive:vincarActiveNum==3}" @click="vincarActiveFn(3)">按商品</view>
+			 					  <view class="vincarTabLine anVin " :class="{vincarActive:vincarActiveNum==1}" @click="vincarActiveFn(1)">按VIN
+								    <view v-if="vincarActiveNum==1" class="vincarActiveHx"></view>
+								  </view>
+			 					  <view class="vincarTabLine" style="margin-right: 50rpx;" @click="goCarModel">按车型
+								  </view>
+								  <view class="vincarTabLine" :class="{vincarActive:vincarActiveNum==3}" @click="vincarActiveFn(3)">按商品
+								  </view>
 			 				 </view>
 			 				 <view class="inputsBox" v-if="vincarActiveNum==1">
 			 					 <view class="searchInputBox" @click="goSearch">
@@ -497,7 +501,7 @@ margin-top: 20rpx;
 	text-align: center;
 	font-size: 26rpx;
 	color: #1A1A1A;
-	padding-top: 22rpx;
+	padding-top: 2rpx;
 }
 .vincar{
 	background: #FFFFFF;
@@ -520,7 +524,12 @@ margin-top: 20rpx;
 	
 }
 .vincarActive{
-	color: #FF4F00;border-bottom: 4rpx solid  #FF4F00;
+	color: #FF4F00;/* border-bottom: 4rpx solid  #FF4F00; */
+}
+.vincarActiveHx{
+	background: #FF4F00;
+	height: 4rpx;
+	border-radius: 4rpx;
 }
 .inputsBox{
 	border-radius: 10rpx;
@@ -574,6 +583,7 @@ margin-top: 20rpx;
 }
 .tkHdImg{
 	width: 702rpx;height: 360rpx;
+	border-radius: 16rpx;
 }
 .aaaaa{
 	width: 500rpx;

pages/index/sgoodsList.vue

@@ -31,14 +31,17 @@
 							<image v-else src="../../static/img/noimg.png" mode="aspectFit" class="jyimg"></image>
 						</view>
 						<view class="lineRgiht">
-							<view class="goodsName">{{item.name}} {{item.factoryNumber}}</view>
-							<view class="goodsMs">{{item.specificationModel}}</view>
+							<view class="goodsName">{{item.name}} </view>
+							<view class="goodsMs">型号：{{item.specificationModel}} <span class="factoryNumber" v-if="item.factoryNumber">{{item.factoryNumber}}</span></view>
 							<view class="goodsMs modelRemark" @click.stop="modelRemarkFn(item.modelRemark)">适用车型：{{item.modelRemark}}</view>
 						</view>
 						
 					</view>
 				</view>
-				<nodata v-if="MaintainPartList.length==0"></nodata>
+				<view style="width: 500rpx;padding-top: 200rpx;" v-if="MaintainPartList.length==0">
+					<nodata ></nodata>
+				</view>
+				
 			</view>
 			
 			
@@ -294,8 +297,9 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 	.jiyouBox{
 		
 		background: #ffffff;
-		padding: 30rpx;
+		
 		padding-top: 0;
+		
 	}
 	.jiyoutopTitle{
 		font-weight: 500;font-size: 28rpx;
@@ -312,10 +316,11 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 		border-radius: 10rpx;
 	}
 	.jyline{
-		padding-bottom: 24rpx;
+		padding-bottom: 22rpx;
 		display: flex;
 		border-bottom: 1px solid #eaeaea;
-		padding-top: 24rpx;
+		padding-top: 22rpx;
+		padding-left: 20rpx;
 	}
 	.jyName{
 		font-weight: 400;font-size: 22rpx;
@@ -421,15 +426,15 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 		padding-left: 16rpx;
 	}
 	.goodsName{
-		font-size: 28rpx;
-		color: #3C3C3C;
+		font-size: 30rpx;
+		color: #222;
 		line-height: 40rpx;
 	}
 	.goodsMs{
-		font-size: 24rpx;
-		color: #999999;
+		font-size: 26rpx;
+		color: #3C3C3C;
 		line-height: 33rpx;
-		padding-top: 10rpx;
+		padding-top: 6rpx;
 	}
 	.sTopBox{
 		display: flex;padding: 30rpx 24rpx;
@@ -437,7 +442,7 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 	}
 	.searchBtn{
 		font-weight: 400;font-size: 28rpx;padding-left: 24rpx;
-		color: #1A1A1A;line-height: 80rpx;
+		color: #3E86F0;line-height: 80rpx;
 	}
 	.searchInputBox{
 		width: 622rpx;display: flex;
@@ -450,18 +455,19 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 		width: 480rpx;
 	}
 	.search_del{
-		width: 36rpx;height: 36rpx;padding-top: 23rpx;padding-bottom: 10px;padding-right: 10rpx;
+		width: 36rpx;height: 36rpx;padding-top: 23rpx;padding-bottom: 10px;padding-right: 24rpx;
 		position: absolute;
 		    right: 0;
 	}
 	.simg{
-		width: 36rpx;height: 34rpx;margin-top: 23rpx;margin-left:30rpx;
+		width: 36rpx;height: 34rpx;margin-top: 25rpx;margin-left:30rpx;
 	}
 .goosLeft{
 		width: 170rpx;
 		font-size: 26rpx;
 		color: #3C3C3C;
 		background: #F6F6F6;
+		height: calc(100vh - 350rpx);
 	}
 	.goodscont{
 		display: flex;margin-top: 20rpx;
@@ -476,7 +482,7 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 }
 .glActive .glName{
 font-weight: 500;
-font-size: 26rpx;
+font-size: 30rpx;
 color: #E60006;
 /* border-left:4rpx solid #E60006; */
 }
@@ -493,7 +499,7 @@ color: #E60006;
 }
 .glName{
 	width: 170rpx;text-align: center;
-	font-size: 26rpx;
+	font-size: 30rpx;
 }
 .modelRemark{
 	overflow: hidden;
@@ -506,7 +512,19 @@ color: #E60006;
 		align-items: center;
 		justify-content: center;
 		padding: 15px;
-		height: 50px;
+	
 		background-color: #fff;
-	}
+		max-height: 60vh;
+		overflow: scroll;
+	}
+.factoryNumber{
+	   padding: 0 10rpx;
+	   border-radius: 8rpx;
+	    border:1px solid #E60006; 
+	   margin-left: 10rpx;
+	   display: inline-block;
+	   /* background: #E60006; */
+	   font-size: 26rpx;
+	   color: #E60006;
+}
 </style>