搜索位置修改

components/Yl_HeadNav/index.js

@@ -4,6 +4,10 @@ Component({
         addGlobalClass: true
     },
     properties: {
+        styleType: {
+            type: String,
+            value: "default", //默认样式
+        },
         sort: Array, //排序规则列表
         search: Boolean, //是否开启搜索
         list: { //功能列表
@@ -125,7 +129,7 @@ Component({
                 let page = getCurrentPages()[getCurrentPages().length - 1].selectComponent("#Filtrate");
                 if (page) {
                     page.setData({
-                        show:true
+                        show: true
                     })
                 } else {
                     this.triggerEvent("onClick", item)
@@ -135,6 +139,22 @@ Component({
                 this.triggerEvent("onClick", item)
             }
         },
+        onChick1(e) {
+            const {
+                id
+            } = e.currentTarget.dataset;
+            if (id == "sort") {
+                //排序
+                this.setData({
+                    sortShow: true
+                })
+            } else if (id == "filtrate") {
+                let page = getCurrentPages()[getCurrentPages().length - 1].selectComponent("#Filtrate");
+                if (page) page.setData({
+                    show: true
+                })
+            }
+        },
         /* 开启关闭搜索 */
         clickSearch() {
             this.setData({
@@ -142,6 +162,14 @@ Component({
             });
             setTimeout(this.setListHeight, 400)
         },
+        /* 搜索 */
+        confirmSearch(e) {
+            if (this.data.condition == e.detail.value) return;
+            this.setData({
+                condition: e.detail.value
+            })
+            this.triggerEvent("onSearch", e.detail.value)
+        },
         /* 开始搜索 */
         startSearch({
             detail

components/Yl_HeadNav/index.scss

@@ -45,7 +45,7 @@
         flex-wrap: wrap;
         width: 100%;
 
-       
+
 
         .but {
             width: 188rpx;
@@ -69,7 +69,7 @@
         }
     }
 
-    .time{
+    .time {
         .partition {
             margin-right: 20rpx;
             display: flex;
@@ -132,6 +132,55 @@
     }
 }
 
+
+.Yl_head_1 {
+    display: flex;
+    height: 100rpx;
+    width: 100vw;
+    background-color: #fff;
+    box-sizing: border-box;
+    padding: 20rpx 0 20rpx 30rpx;
+
+    .search {
+        display: flex;
+        align-items: center;
+        font-size: 28rpx;
+        width: 438rpx;
+        height: 58rpx;
+        border-radius: 29rpx;
+        background: #F4F5F7;
+        color: #BBBBBB;
+        overflow: hidden;
+        margin-right: 10rpx;
+
+        .input {
+            color: #333;
+        }
+
+        navigator {
+            display: flex;
+            height: 100%;
+            align-items: center;
+            padding-left: 10rpx;
+            padding-right: 15rpx;
+        }
+    }
+
+    >navigator {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 130rpx;
+        height: 100%;
+        font-size: 28rpx;
+        color: #666666;
+
+        >text {
+            margin-right: 6rpx;
+        }
+    }
+}
+
 .Yl_search {
     height: 80rpx !important;
     align-items: flex-start;
@@ -175,6 +224,7 @@
     box-sizing: border-box;
     padding-left: 30rpx;
     padding-right: 30rpx;
+
     .v-but {
         width: 250rpx !important;
     }

components/Yl_HeadNav/index.wxml

@@ -1,4 +1,4 @@
-<view class="Yl_nav_box">
+<view class="Yl_nav_box" wx:if="{{style=='default'}}">
     <view class="mian">
         <navigator class="item" url="#" wx:for="{{list}}" wx:key="index" style="width: {{item.width}};" bindtap="onClick" data-item="{{item}}">
             <text class="iconfont {{item.icon}}" style="color: {{item.color}};" />
@@ -9,6 +9,15 @@
         <text class="iconfont icon-a-sousuolansousuo" style="color: {{startUsing?'var(--assist)':''}};" />
     </navigator>
 </view>
+<view class="Yl_head_1" wx:else>
+    <view class="search">
+        <view class="iconfont icon-a-sousuolansousuo" style="padding-left:20rpx;margin-right: 10rpx;" />
+        <input class="input" value="{{condition}}" bindconfirm="confirmSearch" type="text" placeholder="搜索商品" style="flex: 1;" />
+        <navigator wx:if="{{condition}}" bindtap="endSearch" url="#" class="iconfont icon-quxiao" />
+    </view>
+    <navigator url="#" class="but" bindtap="onChick1" data-id="sort"><text class="iconfont icon-shengxu"></text>排序</navigator>
+    <navigator url="#" class="but" bindtap="onChick1" data-id="filtrate"><text class="iconfont icon-shaixuan" bindtap="startFiltration"></text>筛选</navigator>
+</view>
 
 <van-transition show="{{ startUsing }}" custom-class="block">
     <van-search custom-class='Yl_search' value="{{ condition }}" bindfocus='onFocus' bind:blur='onBlur' shape="round" placeholder="请输入搜索关键词" bind:search='startSearch' bind:clear='endSearch' />

packageA/market/index.js

@@ -109,21 +109,15 @@ Page({
 			console.log("获取领域", res)
 		}) */
 	},
-	onReady() {
-		this.setListHeight()
-	},
 	/* 搜索 */
-	startSearch(e) {
+	onSearch({detail}){
 		this.setData({
-			"content.where.condition": e.detail.value
+			"content.where.condition":detail
 		});
 		this.getList(true)
 	},
-	onClear() {
-		this.setData({
-			"content.where.condition": ""
-		})
-		this.getList(true)
+	onReady() {
+		this.setListHeight()
 	},
 	/* 设置页面高度 */
 	setListHeight() {

packageA/market/index.scss

@@ -1,52 +1,5 @@
 @import "./index.skeleton.wxss";
 
-.head {
-	display: flex;
-	height: 100rpx;
-	width: 100vw;
-	background-color: #fff;
-	box-sizing: border-box;
-	padding: 20rpx 0 20rpx 30rpx;
-
-	.search {
-		display: flex;
-		align-items: center;
-		font-size: 28rpx;
-		width: 438rpx;
-		height: 58rpx;
-		border-radius: 29rpx;
-		background: #F4F5F7;
-		color: #BBBBBB;
-		overflow: hidden;
-		margin-right: 10rpx;
-
-		.input {
-			color: #333;
-		}
-
-		navigator {
-			display: flex;
-			height: 100%;
-			align-items: center;
-			padding-left: 10rpx;
-			padding-right: 15rpx;
-		}
-	}
-
-	>navigator {
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		width: 130rpx;
-		height: 100%;
-		font-size: 28rpx;
-		color: #666666;
-
-		>text {
-			margin-right: 6rpx;
-		}
-	}
-}
 .brand-box {
 	margin-left: 30rpx;
 	padding-bottom: 20rpx;

packageA/market/index.wxml

@@ -2,15 +2,7 @@
 <import src="./index.skeleton.wxml" />
 <template is="skeleton" wx:if="{{loading}}" />
 
-<view class="head">
-	<view class="search">
-		<view class="iconfont icon-a-sousuolansousuo" style="padding-left:20rpx;margin-right: 10rpx;" />
-		<input class="input" value="{{content.where.condition}}" bindconfirm="startSearch" type="text" placeholder="搜索商品" style="flex: 1;" />
-		<navigator wx:if="{{content.where.condition}}" bindtap="onClear" url="#" class="iconfont icon-quxiao" />
-	</view>
-	<navigator url="#" class="but"><text class="iconfont icon-shengxu"></text>排序</navigator>
-	<navigator url="#" class="but"><text class="iconfont icon-shaixuan" bindtap="startFiltration"></text>筛选</navigator>
-</view>
+<Yl_HeadNav styleType="1" sort='{{content.sort}}' bindonSearch="onSearch" />
 
 <!-- 品牌列表 -->
 <Tabs list="{{brandList}}" box-class='brand-box' tab-class='brand-tab-class' active-class='brand-active-class' />