样式优化

pages/index/goodsDetail.vue

@@ -13,8 +13,12 @@
 			</swiper>
 	  	</view>
 		<view class="name" v-if="loading">{{info.name}} | {{info.specificationModel}} | {{info.partsCode}}</view>
-		<view style="height: 30rpx;background: #F4F5F7;"></view>
-		<view class="detail">
+		<view class="goodsMs">附属型号:{{info.factoryNumber}}</view>
+		<view class="goodsMs">电池型号:{{info.specificationModel}}</view>
+		<view class="goodsMs">系列:{{info.GeneralpurposeName}}  <span class="englishname" v-if="info.englishname">{{info.englishname}}</span> </view>
+		<view class="goodsMs">适用车型:{{info.carmodelremark}}</view>
+		<view style="height: 30rpx;background: #F4F5F7;" v-if="html"></view>
+		<view class="detail" v-if="html">
 			<view class="datailTitle">商品详情</view>
 			
 		   <!-- <video style="width:750rpx;" class="edui-faked-video twtcs" src="https://66km.oss-cn-beijing.aliyuncs.com/yanghuziliao/shachepan/%E6%AC%A7%E6%B4%B2%E7%BB%B4%E4%BF%AE%E5%88%B9%E8%BD%A6%E7%9B%98%E7%89%87%E6%A0%87%E5%87%86%E6%9B%B4%E6%8D%A2SOP%E6%B5%81%E7%A8%8B.mp4" width="420" height="280" enable-danmu danmu-btn controls></video> -->
@@ -123,4 +127,16 @@
 /deep/ video{
 	 width: 750rpx;
 }
+.goodsMs{
+	padding: 15rpx 24rpx;
+	font-size: 26rpx;
+	color: #222222;
+}
+.englishname{
+	padding: 0 6rpx;
+	border-radius: 8rpx;
+	border:1px solid #254A90;
+	margin-left: 10rpx;
+	display: inline-block;
+}
 </style>

pages/index/goodsList.vue

@@ -9,12 +9,12 @@
 				<view>
 					<view class="historylinecar">{{optdata.value}}</view>
 					<view class="historyLineVin" v-if="optdata.isVin==1"><!--  -->
-					     <view style="display: flex;">
+					     <view style="display: flex; padding-top: 16rpx;">
 							 <view class="vinms">VIN</view>
 							 <view class="vinNum">{{optdata.vin}}</view>
 						 </view>
 						
-						<view class="copyVin">复制</view>
+						<view class="copyVin" @click="copyFn(optdata.vin)">复制</view>
 					</view>
 				</view>
 				
@@ -36,12 +36,14 @@
 					<view class="topName">车辆配置</view>
 				</view>
 			</view> -->
-			<view class="goosLeft">
+			<!-- <view class="goosLeft">
 				<view class="goodsLefeLine" :class="{glActive:leftIndex==index}"
 				 @click="leftFn(index,item)" v-for="(item,index) in leftData">
+				    <view class="leftKK" v-if="leftIndex==index"></view>
+					<view v-else  class="leftKK2"></view>
 					<view class="glName">{{item.name}}</view>
 				</view>
-			</view>
+			</view> -->
 			<view class="jiyouBox">
 				
 				<view class="brandBox">
@@ -51,9 +53,9 @@
 					<view class="brandBtn" :class="{brandActive:type==4}" @click="ckBrand(4)">威斯康</view> -->
 					<view class="brandBtn" v-for="(item,index) in brandList" :class="{brandActive:item.ck}" @click="ckBrand(item)">{{item.name}}</view>
 				</view>
-				<view class="ckName">
+				<!-- <view class="ckName">
 					{{componentName}}
-				</view>
+				</view> -->
 				<view class="jylineBox"  v-if="loading">
 					<view class="jyline" v-for="(item,index) in MaintainPartList" @click="godetail(item)"><!-- MaintainPartList -->
 						<view class="jyimgBox">
@@ -62,7 +64,10 @@
 						</view>
 						<view class="lineRgiht">
 							<view class="goodsName">{{item.name}}| {{item.partsCode}}</view>
-							<view class="goodsMs">{{item.specificationModel}} </view>
+							<view class="goodsMs">附属型号:{{item.factoryNumber}} </view>
+							<view class="goodsMs">电池型号:{{item.specificationModel}} </view>
+							<view class="goodsMs">系列: <span>{{item.GeneralpurposeName}}</span> <span class="englishname" v-if="item.englishname">{{item.englishname}}</span>  </view>
+							<view class="goodsMs">适用车型:{{item.carmodelremark}} </view>
 						</view>
 						
 					</view>
@@ -117,12 +122,14 @@
 				   {name:'变速箱滤清器',componentCode:'007004'},
 				   {name:'雨刷',componentCode:'006004'},
 			   ],
-			   componentCode:'015001',
+			  // componentCode:'015001',
+			   componentCode:'',
 			   componentName:'机油',
 			   brandList:[
-				   {name:'欧洲维修',id:'69c6828c-8994-4d2e-8c25-a89c05e13b18',ck:false},
-				   {name:'美孚',id:'05897c44-8852-449a-8165-ba7a8675a16c',ck:false},
-				   {name:'嘉实多',id:'2f0b65aa-4945-4962-b794-7e2cd35685a8',ck:false},
+				   {name:'三冠',id:'fc89e243-3358-4037-80ed-67c5d8c35085',ck:false},
+				   {name:'威斯康',id:'ee21a0d0-f181-42be-990b-73eb692c196d',ck:false},
+				   {name:'阿诺德',id:'a136f3b8-0586-4fe5-ac49-389aa4cc990b',ck:false},
+				   {name:'鸿雁',id:'8fa5f395-86c7-4488-b4ea-ac058c7ae330',ck:false},
 			   ],
 			   brandId:'',
 			}
@@ -131,6 +138,17 @@
 			  console.log(opt)
 			   this.iStatusBarHeight = uni.getSystemInfoSync().statusBarHeight;
               this.optdata=opt;
+			  if(opt.scarid){
+					   this.scarid=opt.scarid;
+					   this.queryCarModelGroupInfo()
+			  }else{
+					   if(opt.isVin==1){
+						   this.isVin=1;
+						   this.vin=opt.vin
+					   }
+							 
+					   this.saveQueryHistory()
+			  }
 			  if(this.optdata.type){
 				  this.type=this.optdata.type
 			  }
@@ -138,6 +156,36 @@
 			  this.queryOilInfoByGroupID()
 		},
 		methods: {
+			queryCarModelGroupInfo(){
+			   uni.showLoading({ title: '加载中'});
+			   this.$http('matchingByOpen/queryCarModelGroupInfo', {
+				 id:this.scarid,
+				
+				},'POST').then(res => {
+					uni.hideLoading();
+					var data={
+						value:res.data.value,
+						id:res.data.id,
+						nLevelID:res.data.carModelInfo.nLevelID,
+						logo:res.data.carModelInfo.logo,
+					}
+					 this.optdata=data;
+					this.saveQueryHistory()
+			   })
+			},
+			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 => {
+							
+					
+			   })
+			},
 			leftFn(index,item){
 			  this.leftIndex=index
 			  this.componentCode=item.componentCode
@@ -255,6 +303,22 @@
 				 uni.navigateTo({
 				 	url:'/pages/index/carConfiguration?nLevelID='+this.optdata.nLevelID
 				 })
+			 },
+			 copyFn(e){
+				uni.setClipboardData({
+				   data: e,
+				   success: function () {
+					 uni.showToast({
+					   title: '复制成功',
+					   icon: 'success',
+					   duration: 2000
+					 });
+				   },
+				   fail: function () {
+					 console.log('复制失败');
+					
+				   }
+				 });
 			 }
 		}
 	}
@@ -263,6 +327,7 @@
 <style scoped>
 .goodscont{
 	display: flex;margin-top: 20rpx;
+	min-height: calc(100vh - 450rpx);
 }
 .salesLine{
 	display: flex;
@@ -276,11 +341,13 @@
 }
 .brandBox {
 	padding: 30rpx 20rpx;
+	padding-bottom: 24rpx;
 }
 .goosLeft{
-	width: 160rpx;
+	width: 190rpx;
 	font-size: 26rpx;
 	color: #3C3C3C;
+	background: #F6F6F6;
 }
 .salesLeft{
 	width: 200rpx;
@@ -357,7 +424,7 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 		/* margin-top: 30rpx; */
 		background: #ffffff;
 		/* padding: 30rpx; */
-		width: 590rpx;
+		/* width: 560rpx; */
 	}
 	.jiyoutopTitle{
 		font-weight: 500;font-size: 28rpx;
@@ -378,6 +445,9 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 		display: flex;
 		border-bottom: 1px solid #EEEEEE;
 	}
+	.jyline:last-child{
+		border: none;
+	}
 	.jyName{
 		font-weight: 400;font-size: 22rpx;
 		color: #1A1A1A;
@@ -403,7 +473,7 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 		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{
@@ -446,23 +516,24 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 	.topBtn{
 		font-weight: 400;
 		font-size: 26rpx;
-		color: #F19D01;
+		color: #254A90;
 		width: 180rpx;
 		height: 56rpx;
 		border-radius: 28rpx;
-		border: 1px solid #F19D01;
+		border: 1px solid #254A90;
 		line-height: 56rpx;
 		text-align: center;
 		margin-right: 30rpx;
 	}
 	.copyVin{
 		font-weight: 400;
-		font-size: 22rpx;
+		font-size: 26rpx;
 		color:#3F90F7;
 		width: 62rpx;
 		height: 34rpx;
 		line-height: 34rpx;
 		text-align: right;
+		padding-top: 16rpx;
 	}
 	.brandBox{
 		display: flex;
@@ -476,23 +547,23 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 		margin-right: 20rpx;
 	}
 	.lineRgiht{
-		padding-left: 24rpx;
+		padding-left: 16rpx;
 	}
 	.goodsName{
 		font-size: 28rpx;
-		color: #3C3C3C;
+		color: #254A90;
 		line-height: 40rpx;
 	}
 	.goodsMs{
 		font-size: 24rpx;
-		color: #999999;
+		color: #222222;
 		line-height: 33rpx;
 		padding-top: 10rpx;
 	}
 	.brandActive{
 		background: rgba(255,79,0,0.08);
 		border-radius: 6rpx;
-		color: #FF4F00;
+		color: #E60006;
 	}
 .glActive{
 	background: #ffffff;
@@ -501,20 +572,43 @@ color: #FFFFFF;font-size: 28rpx;padding-left: 16rpx;
 font-weight: 500;
 font-size: 26rpx;
 color: #E60006;
-border-left:4rpx solid #E60006;
+/* border-left:4rpx solid #E60006; */
+}
+.leftKK{
+	background: #E60006;
+	width: 6rpx ;
+	height: 24rpx;
+	border-radius: 4rpx;
+	margin-top: 6rpx;
+	overflow: hidden;
+}
+.leftKK2{
+	width: 4rpx ;
 }
 .glName{
-	padding: 0 16rpx;
+	width: 170rpx;text-align: center;
+	font-size: 26rpx;
 }
 .ckName{
 	width: 532rpx;
 	height: 60rpx;
 	background: #F6F6F6;
 	border-radius: 4rpx;
-	font-size: 24rpx;
+	font-size: 26rpx;
 	color: #3C3C3C;
 	line-height: 60rpx;
 	margin-left: 20rpx;
 	padding-left: 20rpx;
+	font-weight: 600;
+}
+.jiyouBox{
+  width: 100%;
+}
+.englishname{
+	padding: 0 6rpx;
+	border-radius: 8rpx;
+	border:1px solid #254A90;
+	margin-left: 10rpx;
+	display: inline-block;
 }
 </style>

pages/index/index.vue

@@ -197,8 +197,11 @@
 			 },
 			 gobyItem(e){
 				 var nLevelID=e.nLevelIDs.split(',')[0]
-				 uni.navigateTo({
+				/* uni.navigateTo({
 				 	url:'/pages/index/byItem?nLevelID='+nLevelID+'&logo='+e.carModelInfo.logo+'&value='+e.title+'&id='+e.ids+'&isVin=1&vin='+this.vinNum
+				 }) */
+				 uni.navigateTo({
+				 	url:'/pages/index/goodsList?nLevelID='+nLevelID+'&logo='+e.carModelInfo.logo+'&value='+e.title+'&id='+e.ids+'&isVin=1&vin='+this.vinNum
 				 })
 			 },
              gohistory(){
@@ -397,7 +400,7 @@
 }
 .ssBox{
 	width: 676rpx;
-	background: rgba(0, 0, 0, 0.7);
+	background: rgba(0, 0, 0, 0.4);
 	position: absolute;
 	left: 37rpx;
 	top: 200rpx;
@@ -406,7 +409,7 @@
 .ssView{
 	width: 595rpx;
 	height: 78rpx;
-	background: #646464;
+	background: #636466;
 	display: flex;
 	margin-left: 40rpx;
 }
@@ -416,11 +419,13 @@
 }
 .sInput{
  height: 78rpx;line-height: 78rpx;padding-left: 20rpx;font-size: 28rpx;
- width: 450rpx;
+ width: 400rpx;
 }
 .newSbImg{
 	width: 45rpx;height: 42rpx;
-	margin-top: 20rpx;
+	padding-top: 20rpx;
+	padding-right: 20rpx;
+	padding-left: 50rpx;
 }
 /*  */	
 .contBox{

pages/index/installation.vue

@@ -91,7 +91,7 @@
 
 <style scoped>
 .box{
-	
+	padding: 16rpx;
 }
 .historylinecarImg{
 	width: 54rpx;

pages/index/search.vue

@@ -5,7 +5,8 @@
 		  <view class="searchInputBox" >
 		  	<image src="../../static/img/icon_search.png" mode="" class="simg"></image>
 		  	<input v-model="value" type="text"  placeholder="请输入车辆品牌、车系或VIN码" 
-			placeholder-class="ip" class="ssinput" @confirm="searchFn" focus>
+			placeholder-class="ip" ref="myInput" 
+			  class="ssinput" @confirm="searchFn" :focus="focuszt">
 			<image src="../../static/img/icon_search_del.png" mode="" class="search_del" @click="searchDel"></image>
 		  </view>
 		  <view class="searchBtn" @click="searchFn">
@@ -103,15 +104,27 @@
 				loading:false,
 				bizType:'',
 				carModel:'',
+				focuszt:false,
 			}
 		},
 		onLoad(opt) {
          this.iStatusBarHeight = uni.getSystemInfoSync().statusBarHeight;
+		 var that=this;
 		  setTimeout(() => {  
-		            this.focusKuwei=true;
+		       this.focusKuwei=true;
+				 
 		  }, 500)
+		 /* this.$nextTick(() => {
+		     this.$refs.myInput.focus();
+		  }); */
 		
 		},
+		 onReady() {
+		    // 确保在渲染完成后触发
+		    this.$nextTick(() => {
+		      this.focuszt = true;
+		    });
+		  },
 		methods: {
 		   searchDel(){
 			   console.log("清除")
@@ -196,6 +209,7 @@
 			   this.popuponeShow=false;
 		   },
            searchFn(){
+			  
 			   console.log(this.value.length)
 			   if(!this.value){
 				   uni.showToast({