|
|
|
|
<template>
|
|
|
|
|
<view>
|
|
|
|
|
<view class="searchGood">
|
|
|
|
|
<view class="search acea-row row-between-wrapper">
|
|
|
|
|
<view class="input acea-row row-between-wrapper" @click="submit">
|
|
|
|
|
<!-- <text class="iconfont icon-sousuo2"></text> -->
|
|
|
|
|
<!-- <form @submit.prevent="submit"></form> -->
|
|
|
|
|
<input type="text" placeholder="大家都在搜APP开发" v-model="search" />
|
|
|
|
|
<view class="bnt">搜索</view>
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
<view v-if="keywords.length">
|
|
|
|
|
<view class="title">热门搜索</view>
|
|
|
|
|
<view class="list acea-row">
|
|
|
|
|
<view
|
|
|
|
|
class="item"
|
|
|
|
|
v-for="keywordsKey of keywords"
|
|
|
|
|
:key="keywordsKey"
|
|
|
|
|
@click="toSearch(keywordsKey)"
|
|
|
|
|
>{{ keywordsKey }}</view>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="line"></view>
|
|
|
|
|
<!-- <GoodList></GoodList>-->
|
|
|
|
|
</view>
|
|
|
|
|
<!--<view class="noCommodity">-->
|
|
|
|
|
<!--<view class="noPictrue">-->
|
|
|
|
|
<!--<image :src="`${$VUE_APP_RESOURCES_URL}/images/noSearch.png`" class="image" />-->
|
|
|
|
|
<!--</view>-->
|
|
|
|
|
<!--<recommend></recommend>-->
|
|
|
|
|
<!--</view>-->
|
|
|
|
|
</view>
|
|
|
|
|
</template>
|
|
|
|
|
<script>
|
|
|
|
|
// import GoodList from "@/components/GoodList";
|
|
|
|
|
import { getSearchKeyword } from "@/api/store";
|
|
|
|
|
import { trim } from "@/utils";
|
|
|
|
|
// import Recommend from "@/components/Recommend";
|
|
|
|
|
export default {
|
|
|
|
|
name: "GoodSearch",
|
|
|
|
|
components: {
|
|
|
|
|
// Recommend,
|
|
|
|
|
// GoodList
|
|
|
|
|
},
|
|
|
|
|
props: {},
|
|
|
|
|
data: function() {
|
|
|
|
|
return {
|
|
|
|
|
keywords: [],
|
|
|
|
|
search: ""
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
mounted: function() {
|
|
|
|
|
this.getData();
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
submit() {
|
|
|
|
|
console.log('ddaas')
|
|
|
|
|
const search = trim(this.search) || "";
|
|
|
|
|
console.log(search)
|
|
|
|
|
if (!search) return;
|
|
|
|
|
this.toSearch(search);
|
|
|
|
|
},
|
|
|
|
|
toSearch(s) {
|
|
|
|
|
this.$yrouter.push({ path: "/pagesB/pages/shop/GoodsList/index", query: { s } });
|
|
|
|
|
// uni.navigateTo({
|
|
|
|
|
// url: '/pagesB/pages/shop/GoodsList/index?s'
|
|
|
|
|
// })
|
|
|
|
|
},
|
|
|
|
|
getData() {
|
|
|
|
|
getSearchKeyword().then(res => {
|
|
|
|
|
this.keywords = res.data;
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
</script>
|
|
|
|
|
<style lang="less">
|
|
|
|
|
.searchGood{
|
|
|
|
|
.search{
|
|
|
|
|
padding: 0 40rpx;
|
|
|
|
|
.input{
|
|
|
|
|
width: 670rpx;
|
|
|
|
|
height: 68rpx;
|
|
|
|
|
border: 2rpx solid #FF5100;
|
|
|
|
|
border-radius: 8rpx;
|
|
|
|
|
background: rgba(255, 255, 255, 0.39);
|
|
|
|
|
padding: 0 0 0 20rpx;
|
|
|
|
|
input{
|
|
|
|
|
width: calc(100% - 150rpx);
|
|
|
|
|
}
|
|
|
|
|
.bnt{
|
|
|
|
|
width: 132rpx;
|
|
|
|
|
height: 68rpx;
|
|
|
|
|
background: linear-gradient(39deg, #FF5100 0%, #FFA074 100%);
|
|
|
|
|
border-radius:0 8rpx 8rpx 0;
|
|
|
|
|
position: absolute;
|
|
|
|
|
right: 40rpx;
|
|
|
|
|
color: #fff;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.noCommodity {
|
|
|
|
|
border-top: 0.05*100rpx solid #f5f5f5;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
