hz/learning-system-mobile
1
0
Fork 0
mirror of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-mobile.git synced 2025-12-09 02:46:46 +08:00
Code Issues Packages Projects Releases Wiki Activity

搜索检索页面

Browse Source
This commit is contained in:
lmj
2022-11-08 15:20:33 +08:00
parent 0e74f23983
commit 25591c5b2e
2 changed files with 46 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
pages/resource/search.vue
View File

@@ -1,6 +1,6 @@
<template> <template>
<!--搜索页--> <!--搜索页-->
<view> <view style="background-color: #fff;height: 100vh;">
<u-toast ref="messager"></u-toast> <u-toast ref="messager"></u-toast>
<view style="margin:30upx 30upx; display: flex;"> <view style="margin:30upx 30upx; display: flex;">
<u-icon @click="back()" name="arrow-left" color="#383838" size="22" style="margin-right: 10upx;"></u-icon> <u-icon @click="back()" name="arrow-left" color="#383838" size="22" style="margin-right: 10upx;"></u-icon>
@@ -19,7 +19,19 @@
search-icon="search" search-icon="search"
> >
</u-search> --> </u-search> -->
<u-search bgColor="#ffffff" maxlength="20" placeholder="请输入关键字" v-model="keyword" :focus="true" shape="round" @clear="clearSearch" @search="searchList" :showAction="false" search-icon="search" ></u-search> <u-search
bgColor="#F2F5F7"
maxlength="20"
placeholder="请输入关键字"
v-model="keyword"
:focus="true"
shape="round"
@clear="clearSearch"
@search="searchList"
search-icon="search"
:showAction="true"
actionText="搜索"
></u-search>
</view> </view>
<view style="margin:30upx 30upx 10upx 30upx;position: relative;border-bottom:1px solid #f0f0f0; display: flex;justify-content: space-between;"> <view style="margin:30upx 30upx 10upx 30upx;position: relative;border-bottom:1px solid #f0f0f0; display: flex;justify-content: space-between;">
<view class="con-top"> <view class="con-top">
@@ -40,7 +52,9 @@
<u-icon v-if="!isOpen" name="arrow-down" color="#b3b3b3" size="16"></u-icon> <u-icon v-if="!isOpen" name="arrow-down" color="#b3b3b3" size="16"></u-icon>
<u-icon v-if="isOpen" name="arrow-up" color="#b3b3b3" size="16"></u-icon> <u-icon v-if="isOpen" name="arrow-up" color="#b3b3b3" size="16"></u-icon>
</view> </view>
<view class="words-clear"><u-icon name="trash" @click="cleanHistory()" style="margin-right: 20px;"></u-icon></view> <view class="words-clear" @click="cleanHistory()">
<image src="../../static/images/icon/del.png" mode="" style="margin-right: 15px;"></image>
</view>
</view> </view>
<view class="words-items"> <view class="words-items">
<view v-for="(word,widx) in historyWords" :key="widx" v-if="widx<10" @tap="wordSearch(word)" class="words-item">{{word}}</view> <view v-for="(word,widx) in historyWords" :key="widx" v-if="widx<10" @tap="wordSearch(word)" class="words-item">{{word}}</view>
@@ -50,7 +64,11 @@
<view class="words"> <view class="words">
<view class="words-top"> <view class="words-top">
<view class="words-title">热门搜索</view> <view class="words-title">热门搜索</view>
<view class="words-clear" @click="cleanHistory()">
<image src="../../static/images/icon/eye.png" mode="" style="margin-right: 15px;width: 32upx;height: 24upx;"></image>
</view> </view>
</view>
<view class="words-items"> <view class="words-items">
<view v-for="(hw,hwidx) in hotWords" :key="hwidx" @tap="wordSearch(hw)" class="words-item">{{hw}}</view> <view v-for="(hw,hwidx) in hotWords" :key="hwidx" @tap="wordSearch(hw)" class="words-item">{{hw}}</view>
</view> </view>
@@ -719,6 +737,20 @@
}) })
} }
} }
}
</script>
<style lang="scss" scoped>
::v-deep .u-search .u-search__content{
height: 72upx !important;
}
.words-clear{
image{
width: 30upx;
height: 30upx;
}
}
::v-deep .u-search__action{
font-size: 32upx; font-size: 32upx;
color: #387DF7; color: #387DF7;
font-weight: 500; font-weight: 500;
@@ -773,7 +805,10 @@
padding: 30upx; padding: 30upx;
line-height: 40upx; line-height: 40upx;
.words-top{ .words-top{
display: flex; display: flex;
justify-content: space-between;
.words-title{
display: flex;
color: #333333; color: #333333;
font-weight: 500; font-weight: 500;
font-size: 32upx !important; font-size: 32upx !important;
@@ -783,8 +818,9 @@
.words-items{ .words-items{
margin-top: 20upx; margin-top: 20upx;
.words-item{ .words-item{
display: inline-block; display: inline-block;
padding: 10upx 35upx; padding: 10upx 35upx;
margin: 10upx;
background-color: #FFFFFF; background-color: #FFFFFF;
border: 1px solid rgba(153,153,153,0.2); border: 1px solid rgba(153,153,153,0.2);
font-size: 28upx; font-size: 28upx;

BIN
static/images/icon/eye.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB