132 lines
2.5 KiB
Vue
132 lines
2.5 KiB
Vue
|
<template>
|
||
|
|
<layout>
|
||
|
|
<uv-navbar
|
||
|
|
:fixed="false"
|
||
|
|
title="搜索"
|
||
|
|
left-arrow
|
||
|
|
@leftClick="$onClickLeft"
|
||
|
|
/>
|
||
|
|
<view class="search-bar">
|
||
|
|
<uv-search
|
||
|
|
v-model="keyword"
|
||
|
|
shape="round"
|
||
|
|
placeholder="搜索商品"
|
||
|
|
show-action
|
||
|
|
@search="onSearch"
|
||
|
|
@cancel="onCancel"
|
||
|
|
>
|
||
|
|
<template #action>
|
||
|
|
<view>
|
||
|
|
<text @tap="onSearch">搜索</text>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
</uv-search>
|
||
|
|
</view>
|
||
|
|
<!--
|
||
|
|
<view class="search-box">
|
||
|
|
<view class="search-box-header">
|
||
|
|
<view class="search-box-title">热门搜索</view>
|
||
|
|
</view>
|
||
|
|
<view>
|
||
|
|
<space warp>
|
||
|
|
<uv-tag type="primary">标签</uv-tag>
|
||
|
|
<uv-tag type="primary">标签</uv-tag>
|
||
|
|
<uv-tag type="primary">标签</uv-tag>
|
||
|
|
<uv-tag type="primary">标签</uv-tag>
|
||
|
|
</space>
|
||
|
|
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<blank size="10"></blank>
|
||
|
|
<view class="search-box">
|
||
|
|
<view class="search-box-header">
|
||
|
|
<view class="search-box-title">历史搜索</view>
|
||
|
|
<view class="search-box-action">
|
||
|
|
<image src="@/static/images/delete.png" />
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view>
|
||
|
|
<space warp>
|
||
|
|
<uv-tag type="primary">标签</uv-tag>
|
||
|
|
<uv-tag type="primary">标签</uv-tag>
|
||
|
|
<uv-tag type="primary">标签</uv-tag>
|
||
|
|
<uv-tag type="primary">标签</uv-tag>
|
||
|
|
</space>
|
||
|
|
|
||
|
|
</view>
|
||
|
|
</view> -->
|
||
|
|
|
||
|
|
</layout>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup>
|
||
|
|
import { ref } from 'vue';
|
||
|
|
import { onReady, onReachBottom } from '@dcloudio/uni-app'
|
||
|
|
import * as router from '@/utils/router'
|
||
|
|
import { useGlobalProperties } from '@/hooks';
|
||
|
|
|
||
|
|
const searchRef = ref();
|
||
|
|
const keyword = ref('');
|
||
|
|
|
||
|
|
|
||
|
|
const { $yrouter } = useGlobalProperties()
|
||
|
|
|
||
|
|
|
||
|
|
const onSearch = () => {
|
||
|
|
console.log("--> % keyword:\n", keyword.value)
|
||
|
|
// refresh()
|
||
|
|
$yrouter.navigateTo({
|
||
|
|
url: '/pages/goodsList/goodsList',
|
||
|
|
query: {
|
||
|
|
keyword: keyword.value
|
||
|
|
}
|
||
|
|
})
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
const onCancel = () => {
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
// onReady(() => {
|
||
|
|
// searchRef.value?.focus();
|
||
|
|
// })
|
||
|
|
|
||
|
|
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="less">
|
||
|
|
.search-box {
|
||
|
|
&-header {
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
&-title {
|
||
|
|
line-height: 40rpx;
|
||
|
|
font-size: 28rpx;
|
||
|
|
font-weight: 500;
|
||
|
|
color: #333333;
|
||
|
|
margin-bottom: 20rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
&-action {
|
||
|
|
width: 28rpx;
|
||
|
|
height: 28rpx;
|
||
|
|
|
||
|
|
.image {
|
||
|
|
display: block;
|
||
|
|
width: 28rpx;
|
||
|
|
height: 28rpx;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
background: #fff;
|
||
|
|
padding: 40rpx 35rpx 30rpx;
|
||
|
|
}
|
||
|
|
</style>
|