guo 2 years ago
parent
commit
0ebd258331
1 changed files with 56 additions and 18 deletions
  1. 56 18
      pages/mobile/OemSearch.vue

+ 56 - 18
pages/mobile/OemSearch.vue

@@ -7,13 +7,17 @@
 			<view class="tabLine" :class="{tabActive:tabIndex==1}" @click="tabClick(1)">车型下搜索</view>
 			<view class="tabLine" :class="{tabActive:tabIndex==1}" @click="tabClick(1)">车型下搜索</view>
 
 
 		</view> -->
 		</view> -->
-		<!-- 搜索 -->
-		<view class="searchBoxBg">
-			<searchBox placeholder="配件名称/原厂OEM" @search='search($event)'></searchBox>
+		<!-- 搜索 -->
+		<view class="searchBox">
+			<image src="../../static/img/icon_search.png" class="searchImg"></image>
+			<input type="text" class="searchInput" placeholder='配件名称/原厂OEM' v-model="inputValue"
+				@confirm="search" />
+			<image src="../../static/img/icon_close.png" class="searchClose" v-if="inputValue!=''"
+				@click="clear"></image>
 		</view>
 		</view>
 
 
 
 
-		<view class="history" v-if="searchValue.length==0">
+		<view class="history" v-if="inputValue.length==0">
 			<view class="historyTop">
 			<view class="historyTop">
 				<view class="historyTopTxt">历史搜索</view>
 				<view class="historyTopTxt">历史搜索</view>
 				<!-- <image src="../../static/img/icon_delete.png" mode="" class="historyDelImg"></image> -->
 				<!-- <image src="../../static/img/icon_delete.png" mode="" class="historyDelImg"></image> -->
@@ -37,16 +41,16 @@
 </template>
 </template>
 
 
 <script>
 <script>
-	import searchBox from '@/components/searchBox/searchBox.vue'
 	export default {
 	export default {
 		components: {
 		components: {
-			searchBox
+			
 		},
 		},
 
 
 		data() {
 		data() {
-			return {
+			return {
+				inputValue: '',
 				tabIndex: 0,
 				tabIndex: 0,
-				searchValue: '',
+				
 				historyList: [],
 				historyList: [],
 				itemData: {},
 				itemData: {},
 				itemList: [],
 				itemList: [],
@@ -71,7 +75,17 @@
 			this.access_time = opt.access_time;
 			this.access_time = opt.access_time;
 			
 			
 		},
 		},
-		methods: {
+		methods: {
+			search(){
+				if (!this.inputValue) return;
+				 //console.log(this.inputValue);
+				this.$emit('search',this.inputValue);
+				
+			},
+			clear(){
+				this.inputValue = ''
+				this.$emit('search','');
+			},
 			goCarModelList(partnum) {
 			goCarModelList(partnum) {
 				uni.navigateTo({
 				uni.navigateTo({
 					url: 'CarModelList?epc_id=' + this.epc_id + '&partnum=' + partnum
 					url: 'CarModelList?epc_id=' + this.epc_id + '&partnum=' + partnum
@@ -82,12 +96,12 @@
 			},
 			},
 			search(val) {
 			search(val) {
 				// console.log(val);
 				// console.log(val);
-				this.searchValue = val
+				this.inputValue = val
 				this.page = 1;
 				this.page = 1;
 				this.getItemData();
 				this.getItemData();
 			},
 			},
 			goSearch(str){
 			goSearch(str){
-				this.searchValue = str
+				this.inputValue = str
 				this.page = 1;
 				this.page = 1;
 				this.getItemData();
 				this.getItemData();
 			},
 			},
@@ -98,7 +112,7 @@
 				});
 				});
 				this.$http('advancedEpc/findParts', {
 				this.$http('advancedEpc/findParts', {
 					epc_id: this.epc_id,
 					epc_id: this.epc_id,
-					keyword: this.searchValue,
+					keyword: this.inputValue,
 					vin:this.vin,
 					vin:this.vin,
 					token: this.token,
 					token: this.token,
 					param: this.param,
 					param: this.param,
@@ -200,12 +214,36 @@
 		border-bottom: 1rpx solid #EEEEEE;
 		border-bottom: 1rpx solid #EEEEEE;
 	}
 	}
 
 
-	.searchBox {
-		display: flex;
-		height: 72rpx;
-		margin: 24rpx;
-		background-color: #F4F5F7;
-		border-radius: 36rpx;
+	.searchBox {
+		height: 72rpx;
+		margin: 24rpx;
+		background-color: #F4F5F7;
+		border-radius: 36rpx;
+		display: flex;
+		position: relative;
+	}
+	
+	.searchImg {
+		margin-top: 20rpx;
+		margin-left: 20rpx;
+		width: 32rpx;
+		height: 32rpx;
+	}
+	
+	.searchInput {
+		height: 72rpx;
+		font-size: 28rpx;
+		padding-left: 16rpx;
+		width: 78%;
+	}
+	
+	.searchClose {
+		position: absolute;
+		width: 36rpx;
+		height: 36rpx;
+		right: 36rpx;
+		top: 20rpx;
+	
 	}
 	}
 
 
 	.history {
 	.history {