积分的搜索功能完成

yvan.ni
1 parent 8f83d623
Showing 3 changed files with 146 additions and 9 deletions
packageA/pages/jfbuy/jfbuy.js
packageA/pages/jfbuy/jfbuy.wxml
packageA/pages/jfbuy/jfbuy.wxss
@@ -35,6 +35,7 @@ Page({
 		key_str:'',
 		pattern:0,      //分成的方式
 		pageSize:10,
+	    curr:10,
 		currentPage:1,  //当前的页码
  
 		// canvasHidden: 1, //-- 隐藏画布 --
@@ -57,8 +58,12 @@ Page({
  
 		triggered: false,
 		isPullDownRefresh: false,
-		
-		
+
+	    //-- 和搜索框相关的 --
+	    search_ing:0,
+	    hiddenClear:1,
+	    focus:false,
+	    keyword:''
   },
  
   /**
@@ -353,9 +358,44 @@ Page({
  
 		this.request_list(data);
 	},
-	
  
-	
+	sear_list(){
+		var th=this;
+		var psize=th.data.curr;
+
+		this.setData({
+			is_no_data2:0,
+			is_no_more2:0,
+			list2:[],
+			is_load2: 0,
+			currentPage2:1,
+			pageSize:psize
+		});
+
+		var data = {
+			store_id:oo.stoid,
+			stype: this.data.requestData.stype,
+			stypeup:1,
+			page:1,
+			pageSize:psize
+		};
+
+		if(this.data.isUp) {
+			data.stypeup = 0;
+		} else {
+			data.stypeup = 1;
+		};
+
+		data.keyword=this.data.keyword
+
+		// this.data.requestData = data;
+		this.setData({
+			requestData: data
+		})
+
+		this.request_list(data);
+	},
+
  
 	request_list: function(data, callback){	
 		// console.log('触发上拉刷新');
@@ -421,9 +461,6 @@ Page({
 		this.request_list(data);
  
 	},
-
-  
-	
  
 	//---图片失败，默认图片---
 	bind_bnerr2: function (e) {
@@ -491,6 +528,51 @@ Page({
 		var viewHeight = this.data.clientWidth / ratio;
 		var con_heihgt=this.data.clientHeight-viewHeight;
 		this.setData({con_heihgt:con_heihgt,isshow:1})
-	
+	},
+
+
+	/*-- 和搜索相关 --*/
+	show_search(){
+		this.setData({
+			search_ing:1,
+			hiddenClear:1,
+			keyword:'',
+			focus:true
+		})
+	},
+
+	getInput(e) {
+		let val = e.detail.value;
+		if (val) {
+			this.setData({
+				keyword: e.detail.value,
+				hiddenClear: false,
+			});
+		} else {
+			this.setData({
+				hiddenClear: true,
+			});
+		}
+	},
+
+	clearInput() {
+		this.setData({
+			keyword: '',
+			hiddenClear: true,
+		});
+	},
+
+	close_layer:function (){
+		this.setData({
+			search_ing:0,
+			hiddenClear:1,
+		})
+	},
+
+	//开始搜索
+	submitSearch(){
+		this.sear_list();
+		this.close_layer();
 	}
+
 })
 \ No newline at end of file
@@ -23,6 +23,11 @@
 			<block wx:for="{{tab}}">
 				<view class="title-item {{currentIndex == (index+1) ? 'active' + (isUp?' active1':''):''}}" data-index="{{index+1}}" bindtap="clickTab">{{item}}</view>
 			</block>
+
+			<view catchtap="show_search" class="flex ai-center"  style="height:80rpx; width:80rpx">
+				<text class="iconfont icon-search_fd" style="font-size:30rpx; " ></text>
+			</view>
+
 		</view>
  
 		<!-- <view> -->
@@ -69,3 +74,19 @@
  
 	</view>
 </view>
+
+<!-- 和搜索相关 -->
+<view wx:if="{{search_ing}}">
+	<view class="cover-layer"></view>
+	<view class="s_box">
+		<view class="s_p_box">
+			<view class="input-box">
+				<text class="before iconfont icon-search_fd" catchtap="submitSearch"></text>
+				<input class="input-search" name="word" placeholder="请输入商品关键字" focus="focus"
+					   bindconfirm="submitSearch" bindinput="getInput" bindfocus="inputFocus" value="{{keyword}}" />
+				<text class="iconfont icon-guan" hidden="{{hiddenClear}}" catchtap="clearInput"></text>
+			</view>
+			<button catchtap="close_layer" style="margin-left:26rpx">取消</button>
+		</view>
+	</view>
+</view>
 \ No newline at end of file
@@ -63,6 +63,7 @@ page {
 	width: 100%;
 	top: 0;
 	z-index: 3;
+	align-items: center;
 }
 .title .iconfont {
 	color: #ccc;
@@ -429,4 +430,37 @@ radio .wx-radio-input.wx-radio-input-checked::before{
 	margin-left:25rpx;
 	margin-right:25rpx;
 	margin-top: 30rpx;
-}
 \ No newline at end of file
+}
+
+
+/*-- 搜索相关 --*/
+.s_box{ position: fixed;top:0;left: 0;background-color: #fff; width: 100%; z-index: 111111}
+.s_p_box{
+	padding:30rpx 40rpx;display: flex; align-items: center;
+}
+.input-box {
+	position: relative;
+	flex: 1;
+	padding-left: 30rpx;
+	padding-right: 70rpx;
+    background-color: #f0f0f0;
+    display: flex;
+    align-items: center;
+}
+
+.input-search {
+	position: relative;
+	padding: 10rpx;
+    ont-size: 28rpx;
+    width: 100%;
+}
+
+.icon-guan {
+	font-size: 20rpx;
+	padding: 10rpx;
+	position: absolute;
+	right: 20rpx;
+	top: 50%;
+	transform: translateY(-50%);
+}
+