搜索结果

pages.json

@@ -82,6 +82,15 @@
             }
             
         }
+        ,{
+            "path" : "pages/search/searchResult",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "",
+                "enablePullDownRefresh": false
+            }
+            
+        }
     ],
 	"globalStyle": {
 		"navigationStyle": "custom", // 隐藏系统导航栏

pages/search/search.vue

@@ -119,4 +119,5 @@
 		  }
 	  }
 	}
+	 
 </style>

pages/search/searchResult.vue

@@ -0,0 +1,240 @@
+<template>
+	<view>
+		<u-navbar back-text="搜索结果" back-icon-size="28" back-icon-color="#ffffff"
+			:background="{backgroundColor: '#2795FD',}" :back-text-style="{color: '#ffffff'}"></u-navbar>
+
+		<!-- 搜索框 -->
+		<view class="search">
+			<view class="search-box">
+				<view class="option">
+					<nxsearch :selectList="selectList" button="inside" @search="doSearch" @confirm="doSearc"
+						v-model="searchQuery.keyword" placeholder="输入关键字找工作" />
+
+
+				</view>
+			</view>
+		</view>
+		<!-- 搜索结果 -->
+		<view class="result">
+			<view class="tabs">
+				<view class="left">
+					<u-tabs bg-color="#F0F0F2" :list="tabList" :is-scroll="false" :current="current"
+						@change="change"></u-tabs>
+				</view>
+				<view class="screen">
+					<view class="icon">
+						<img src="../../assets/img/riLine-filter-line@1x.png" alt="">
+					</view>
+					<view>筛选</view>
+				</view>
+			</view>
+          <view class="result-content">
+          	<view class="item" v-for="item in 3">
+          		<view class="top">
+          			<view class="name">
+          				地推日结
+          			</view>
+					<view class="saraly">
+						200元/天
+					</view>
+          		</view>
+				<view class="middle">
+					<view class="tag">
+						<view class="tag-item">
+							个人
+						</view>
+						<view class="tag-item">
+							日结
+						</view>
+					</view>
+					<view class="date">
+						2023-06-01
+					</view>
+				</view>
+				<view class="bottom">
+					<view class="issuer">
+						李先生
+					</view>
+					<view class="address">
+						江津东路151号锦佳宴
+					</view>
+				</view>
+          	</view>
+          </view>
+		</view>
+
+
+
+	</view>
+</template>
+
+<script>
+	import nxsearch from "../../components/nx-search.vue"
+
+	export default {
+		components: {
+			nxsearch
+		},
+
+		data() {
+			return {
+				keyword: '',
+				searchQuery: {
+					keyword: '',
+					selectIndex: 0
+				},
+				selectList: [{
+						id: 1,
+						name: '找工作'
+					},
+					{
+						id: 2,
+						name: '找公司'
+					},
+				],
+				tabList: [{
+					name: '最新'
+				}, {
+					name: '日结'
+				}, {
+					name: '周结',
+
+				}, {
+					name: '月结'
+				}],
+
+				current: 0
+
+
+			}
+		},
+		methods: {
+			// 执行搜索
+			doSearch(searchQuery) {
+				console.log('searchQuery', searchQuery);
+			},
+			change(index) {
+							this.current = index;
+						}
+			
+
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	page {
+		background: #F0F0F2;
+		padding-bottom: 50px;
+	}
+	.search {
+		background-color: #fff;
+		padding: 16rpx 32rpx;
+
+		.search-box {
+			border-radius: 50px;
+
+			height: 72rpx;
+			line-height: 72rpx;
+		}
+	}
+	// 搜索结果
+	.result{
+		background-color: #fff;
+		.tabs{
+			padding-right:32rpx;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			border-bottom:1px solid #f1f1f1;
+			.left{
+				width: 70%;
+				/deep/.u-tabs{
+					background-color: #fff !important;
+					
+				}
+			}
+			
+				.screen{
+					display: flex;
+					align-items: center;
+					color: rgba(39, 149, 253, 1);
+					font-size: 16px;
+					img{
+						width: 16px;
+						height: 16px;
+						vertical-align: middle;
+						margin-right: 4rpx;
+					}
+				}
+			
+		}
+	
+	.result-content{
+		
+		.item{
+			padding:24rpx 0 28rpx;
+			margin: 0 32rpx;
+			border-bottom:1px solid #f1f1f1;
+		}
+		
+		.top{
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			font-family: 'PingFangSC-medium';
+			.name{
+				color: rgba(16, 16, 16, 1);
+				font-size: 36rpx;
+				
+			}
+			.saraly{
+				color: rgba(255, 61, 0, 1);
+				font-size: 32rpx;
+			}
+			
+		}
+		.middle{
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			margin-top: 12rpx;
+			.tag{
+				display: flex;
+				.tag-item{
+						width: 72rpx;
+						height: 36rpx;
+						line-height: 36rpx;
+						border-radius: 4px;
+						background-color: rgba(241, 241, 247, 1);
+						color: rgba(129, 127, 153, 1);
+						font-size: 24rpx;
+						text-align: center;
+						margin-right: 8rpx;
+				}
+			}
+			.date{
+				color: rgba(153, 153, 153, 1);
+				font-size: 24rpx;
+			}
+		}
+		.bottom{
+			display: flex;
+						justify-content: space-between;
+						align-items: center;
+						margin-top: 20rpx;
+			.issuer{
+				color: rgba(51, 51, 51, 1);
+				font-size: 24rpx;
+			}
+			.address{
+				color: rgba(119, 119, 119, 1);
+				font-size: 24rpx;
+				
+			}
+		}
+	}
+	
+	
+	}
+</style>