样式修改

pages/index/carModel.vue

@@ -47,7 +47,7 @@
 			
 		</view>
 		
-		<uni-popup ref="popup" type="right" :mask-click="true">
+		<uni-popup ref="popup" type="right" :mask-click="true" @change="popupc">
 			<view class="popup-content" >
 				<view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
 				<view style="height: 44px;"></view>
@@ -72,6 +72,8 @@
 		</uni-popup>
 		
 		<!-- 排量 -->
+		
+		
 		<view class="displacementListBox" v-show="displacementListShow">
 			<view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
 		<!-- 	<view style="height: 44px;"></view> -->
@@ -114,37 +116,62 @@
 		<!-- 离合器 -->
 		
 		<!-- 搜索的 -->
-		<view class="carssListBox" v-show="carssListShow">
-			<view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
-			
-			<scroll-view scroll-y="true" class="brandList">
-			  <view @click="ssitem(item)" v-for="item in carsslist" class="carsslineTxt" >
-			    {{item.title}}
-			  </view>
-			  <view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
-			  <view class="status_bar" style="height: 50px;"></view>
-			</scroll-view>
+		<view class="carssListBox" v-show="carssListShow" @click="carssListShow=false">
+			<view class="carssListBoxCont" >
+				<view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
+				<h3 class="carModel-nav-title">
+					<view class="carModel-nav-title—left">
+						<span class="carModel-nav-title-msg" style="padding-left: 24rpx;">{{carName}}</span>
+					</view>
+					<!-- <view class="carBack" @click="secondShow=false">上一步</view> -->
+				</h3>
+				<scroll-view scroll-y="true" class="brandList">
+				  <view @click.stop="ssitem(item)" v-for="item in carsslist" class="carsslineTxt" >
+				    {{item.title}}
+				  </view>
+				  <view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
+				  <view class="status_bar" style="height: 50px;"></view>
+				</scroll-view>
+			</view>
 		</view>
-		<view class="carssListBox2" v-show="secondShow">
-			<view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
+		
+		<view class="carssListBox2" v-show="secondShow" @click.stop="secondShow=false">
+			<view class="carssListBoxCont">
+				<view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
+				<h3 class="carModel-nav-title">
+					<view class="carModel-nav-title—left">
+						<span class="carModel-nav-title-msg" style="padding-left: 24rpx;">{{ssname1}}</span>
+					</view>
+					<view class="carBack" @click="secondShow=false">上一步</view>
+				</h3>
+				<scroll-view scroll-y="true" class="brandList">
+				  <view @click.stop="seconditem(item)" v-for="item in secondlist" class="carsslineTxt" >
+				    {{item.title}}
+				  </view>
+				  <view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
+				  <view class="status_bar" style="height: 50px;"></view>
+				</scroll-view>
+			</view>
 			
-			<scroll-view scroll-y="true" class="brandList">
-			  <view @click="seconditem(item)" v-for="item in secondlist" class="carsslineTxt" >
-			    {{item.title}}
-			  </view>
-			  <view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
-			  <view class="status_bar" style="height: 50px;"></view>
-			</scroll-view>
 		</view>
-		<view class="carssListBox2" v-show="ssdisplacementListShow">
-			<view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
-			<scroll-view scroll-y="true" class="brandList">
-			  <view @click="golistnew(item)" v-for="item in ssdisplacementList" class="carsslineTxt" >
-			    {{item.displacement}}
-			  </view>
-			  <view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
-			  <view class="status_bar" style="height: 50px;"></view>
-			</scroll-view>
+		<view class="carssListBox2" v-show="ssdisplacementListShow" @click.stop="ssdisplacementListShow=false">
+			<view class="carssListBoxCont">
+				<view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
+				<h3 class="carModel-nav-title">
+					<view class="carModel-nav-title—left">
+						<span class="carModel-nav-title-msg" style="padding-left: 24rpx;">{{ssname2}}</span>
+					</view>
+					<view class="carBack" @click="ssdisplacementListShow=false">上一步</view>
+				</h3>
+				<scroll-view scroll-y="true" class="brandList">
+				  <view @click="golistnew(item)" v-for="item in ssdisplacementList" class="carsslineTxt" >
+				    {{item.displacement}}
+				  </view>
+				  <view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
+				  <view class="status_bar" style="height: 50px;"></view>
+				</scroll-view>
+			</view>
+			
 		</view>
 		<!-- 搜索的 -->
 	</view>
@@ -177,6 +204,8 @@
 				carItem:'',
 				ssdisplacementListShow:false,
 				ssdisplacementList:'',
+				ssname1:'',
+				ssname2:'',
 			}
 		},
 		onLoad() {
@@ -185,6 +214,13 @@
 		   
 		},
 		methods: {
+		  popupc(e){
+			  console.log(e)
+			  if(!e.show){
+				  this.displacementListShow=false;
+				  this.carGroupListShow=false;
+			  }
+		  },
 		  carBack(num){
 				if(num==2){
 					this.carGroupListShow=false;
@@ -223,6 +259,7 @@
 					  carSeries:item.carSeries
 				  }
 			  }
+			   this.ssname1=item.title
 			 
 			  this.$http('matchingByOpen/queryCarModelGroupIiPackageSecond', params, 'POST').then(res => {
 			  	this.secondlist=res.data;
@@ -233,6 +270,9 @@
 		  seconditem(item){
 			  this.ssdisplacementList=item.displacementList;
 			  this.ssdisplacementListShow=true;
+			  this.ssname2=item.title
+			 // this.$refs.popup.open("right2")
+			  //this.popupShow=true;
 		  },
 		  carNameInput(){
 			//console.log(this.carName)  
@@ -374,7 +414,7 @@
 		margin-left: 20rpx;
 	}
 	.carssInput{
-		line-height:72px;
+		line-height:72rpx;
 		font-size: 28rpx;
 		height:72rpx;
 		padding-left: 16rpx;
@@ -558,57 +598,61 @@
 		background-color: rgb(255, 255, 255);
 	}
 	.carsslineTxt{
-		height: 98rpx;
+		// height: 98rpx;
 		background: #FFFFFF;
-		line-height: 98rpx;
+		line-height:50rpx;
 		color: #333333;
 		font-size: 28rpx;
 		padding: 0 24rpx;
 		border-bottom: 1px solid #EEEEEE;
+		padding: 20rpx 20rpx 20rpx 30rpx;
 	}
 	.displacementListBox{
 		position: fixed;
 		top: 97rpx;
-		left: 0;
-		width: 100vw;
+		left: 20vw;
+		width: 80vw;
 		height: 100vh;
 		background:#F4F5F7 ;
 		z-index: 11111;
 		/*  #ifdef H5 */
-		top:calc(44px + 210rpx);
+		top:calc(44px + 220rpx);
 		/*  #endif  */
 	}
 	.carGroupListBox{
 		position: fixed;
 		top: 0;
-		left: 0;
-		width: 100vw;
+		left: 20vw;
+		width: 80vw;
 		height: 100vh;
 		background:#F4F5F7 ;
 		z-index: 11111;
 		/*  #ifdef H5 */
-		top:calc(44px + 210rpx);
+		top:calc(44px + 220rpx);
 		/*  #endif  */
 	}
 	.carssListBox{
 		position: fixed;
 		top: 0;
 		left: 0;
-		width: 100vw;
+		width: 200vw;
 		height: 100vh;
-		background: #fff ;
+		background: rgba(0,0,0,0.5) ;
 		z-index: 11111;
 		/*  #ifdef H5 */
 		top:calc(44px + 210rpx);
 		/*  #endif  */
 	}
+	.carssListBoxCont{
+		background: #FFFFFF;width: 80vw;margin-left: 20vw;height: 100vh;
+	}
 	.carssListBox2{
 		position: fixed;
 		top: 0;
 		left: 0;
 		width: 100vw;
 		height: 100vh;
-		background: #fff ;
+		background: rgba(0,0,0,0.5) ;
 		z-index: 11112;
 		top:calc(44px + 210rpx);
 		

pages/index/index.vue

@@ -181,7 +181,7 @@
 		margin-left: 20rpx;
 	}
 	.carssInput{
-		line-height:72px;
+		line-height:72rpx;
 		font-size: 28rpx;
 		height:72rpx;
 		padding-left: 16rpx;

pages/vin/vinquery.vue

@@ -202,7 +202,7 @@
 		margin-left: 20rpx;
 	}
 	.carssInput{
-		line-height:72px;
+		line-height:72rpx;
 		font-size: 28rpx;
 		height:72rpx;
 		padding-left: 16rpx;

utils/request.js

@@ -1,5 +1,5 @@
  //测试地址
- //const baseURL = 'http://192.168.0.149:7782/' 
+// const baseURL = 'http://192.168.0.149:7782/' 
  /*const burl2='http://api.dms.66km.com.cn/' */
 //66正式
 /* const baseURL = 'https://apidms.66km.com/'