You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
157 lines
4.1 KiB
157 lines
4.1 KiB
<template>
|
|
<view class="themes-search">
|
|
<view class="search-head">
|
|
<view class="head-b flex al-item-center border-rius-r">
|
|
<text class="iconfont icon-search"></text>
|
|
<input v-model="keyword" placeholder="商品搜索" placeholder-style="font-size:28rpx;" @confirm="searchConfirm" />
|
|
<text class="iconfont icon-shanchu" @click="delKeywordtex"></text>
|
|
</view>
|
|
</view>
|
|
<view class="search-content">
|
|
<view class="nav-list flex j-between al-item-center">
|
|
<view
|
|
@tap.stop="sortClick"
|
|
class="search-navbar-item"
|
|
:style="!field || field == 'sort' ? 'color: #D11800' : ''"
|
|
data-field="sort"
|
|
data-order="desc"
|
|
>推荐</view
|
|
>
|
|
<view
|
|
@tap.stop="sortClick"
|
|
class="search-navbar-item"
|
|
:style="field == 'sales' ? 'color: #D11800' : ''"
|
|
data-field="sales"
|
|
data-order="desc"
|
|
>销量</view
|
|
>
|
|
<view
|
|
@tap.stop="sortClick"
|
|
class="search-navbar-item"
|
|
:style="field == 'createtime' ? 'color: #D11800' : ''"
|
|
data-field="createtime"
|
|
data-order="desc"
|
|
>新品</view
|
|
>
|
|
<view
|
|
@tap.stop="sortClick"
|
|
class="search-navbar-item"
|
|
data-field="sell_price"
|
|
:data-order="order == 'asc' ? 'desc' : 'asc'"
|
|
>
|
|
<text :style="field == 'sell_price' ? 'color: #D11800' : ''"
|
|
>价格</text
|
|
>
|
|
<text
|
|
style="font-size: 26rpx"
|
|
class="iconfont icon-danbianjiantou1"
|
|
:style="{
|
|
color:
|
|
field == 'sell_price' && order == 'asc' ? '#D11800' : '',
|
|
}"
|
|
></text>
|
|
<text
|
|
style="font-size: 26rpx; margin-left: -10rpx"
|
|
class="iconfont icon-danbianjiantou"
|
|
:style="{
|
|
color:
|
|
field == 'sell_price' && order == 'desc' ? '#D11800' : '',
|
|
}"
|
|
></text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<scroll-view class="scroll-list lise-h" :scroll-y="true" @scrolltolower="getmorecomment" >
|
|
<themes-shop :shopProduct="shopProduct" :mgtop="0" :mgright="30" :mgleft="30" :mgbottom="2"></themes-shop>
|
|
<loading v-if="loading"></loading>
|
|
<nomore v-if="nomore"></nomore>
|
|
<nodata text="没有查找到相关商品" v-if="nodata"></nodata>
|
|
</scroll-view>
|
|
<!-- 悬浮按钮 -->
|
|
<drag-button></drag-button>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { myMixin } from '../logic/search.js';
|
|
import themesShop from "../hongFuQiTian/components/classify-shop.vue";
|
|
|
|
export default {
|
|
mixins: [myMixin],
|
|
components: {
|
|
themesShop,
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.themes-search {
|
|
height: 100vh;
|
|
overflow-y: hidden;
|
|
display: flex;
|
|
flex-direction: column;
|
|
background: #F4F4F4;
|
|
::v-deep .classify-shops {
|
|
.shops-item {
|
|
padding: 24rpx 40rpx 12rpx 20rpx;
|
|
box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(0,0,0,0.0300);
|
|
border-radius: 10rpx;
|
|
border-bottom: 0;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
}
|
|
.search-head {
|
|
width: 100%;
|
|
height: 74rpx;
|
|
padding: 10rpx 28rpx 0;
|
|
flex-shrink: 0;
|
|
background: #FFF;
|
|
.head-b {
|
|
width: 100%;
|
|
height: 100%;
|
|
padding: 0 12rpx;
|
|
background-color: #F7F7F7;
|
|
|
|
.icon-search {
|
|
color: #ABABAB;
|
|
font-size: 50rpx;
|
|
flex-shrink: 0;
|
|
}
|
|
input {
|
|
flex: 1;
|
|
font-size: 28rpx;
|
|
line-height: 40rpx;
|
|
margin-left: 14rpx;
|
|
color: #333333;
|
|
}
|
|
.icon-shanchu {
|
|
font-size: 40rpx;
|
|
color: #cccccc;
|
|
}
|
|
}
|
|
}
|
|
|
|
.search-content {
|
|
flex-shrink: 0;
|
|
background: #FFFFFF;
|
|
.nav-list {
|
|
height: 100rpx;
|
|
padding: 34rpx 32rpx 34rpx 40rpx;
|
|
|
|
.selec {
|
|
// font-size: 32rpx;
|
|
transform: scale(1.2);
|
|
}
|
|
}
|
|
}
|
|
|
|
.scroll-list {
|
|
flex: 1;
|
|
overflow-y: scroll;
|
|
padding: 20rpx 28rpx;
|
|
& ::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
}
|
|
}
|
|
</style>
|