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.
 
 
 
 

168 lines
3.5 KiB

<template>
<view>
<view class="status_bar"></view>
<view class="search_title">
<navigator data="1" open-type="navigateBack">
<image src="../../static/img/left.png" mode=""></image>
</navigator>
<uni-search-bar @confirm="search" v-model="searchValue" class="search_title_input" cancelText="Cancel" placeholder="search"></uni-search-bar>
</view>
<view class="history">
<view class="history_title">
<text>Recently Searched</text>
<image src="../../static/img/delete.png" mode=""></image>
</view>
<view class="history_lable">
<view class="lable_item">Gold Necklaces</view>
<view class="lable_item">Push Up Swimsuit</view>
</view>
</view>
<view class="history">
<view class="history_title">
<text>Figured you’d want it</text>
</view>
<view class="history_lable">
<view class="lable_item">Gold Necklaces</view>
<view class="lable_item">Push Up Swimsuit</view>
</view>
<scroll-view class="spike1 page_padding_left" scroll-x="true" :show-scrollbar="false">
<view class="spike1_item" v-for="(item,index) in 8" :key="index">
<view class="spike1_item_img"></view>
<view class="spike1_item_bottom">
<text>US$314.00</text>
<view class="spike1_item_text">US$12.5</view>
</view>
</view>
</scroll-view>
</view>
</view>
</template>
<script>
import {defaultRequest} from '../../api/index.js'
export default {
data() {
return {
searchValue:''
}
},
methods:{
search(){
if(this.searchValue=='')return
uni.navigateTo({
url:'../category/productList?keyword='+this.searchValue+'&type=1'
})
}
}
}
</script>
<style lang="scss" scoped>
.search_title{
width: 100%;
// height: 135.33rpx;
padding: 0 26.67rpx;
display: flex;
align-items: center;
image{
width: 36rpx;
height: 36rpx;
}
.search_title_input{
width: 85%;
}
}
.history{
margin-top: 62.67rpx;
padding: 0 26.67rpx;
margin-bottom: 85.33rpx;
.history_title{
display: flex;
align-items: center;
justify-content: space-between;
font-size: 28rpx;
font-weight: 500;
margin-bottom: 26.67rpx;
image{
width: 29.33rpx;
height: 29.33rpx;
}
}
.history_lable{
display: flex;
flex-wrap: wrap;
.lable_item{
padding: 13.33rpx 16rpx;
background-color: #F5F6FA;
color: #565656;
font-size: 24rpx;
margin-right: 24.67rpx;
border-radius: 5px;
}
.lable_item:last-child{
margin-right:0
}
}
.spike1{
white-space: nowrap;
width: 100%;
margin-bottom: 70.67rpx;
margin-top: 32rpx;
::-webkit-scrollbar {
width: 0;
height: 0;
background-color: transparent;
}
.spike1_item{
color: #191919;
font-size: 26.67rpx;
margin-right: 16.67rpx;
width: 200rpx;
display: inline-block;
font-weight: 500;
.spike1_item_img{
width: 200rpx;
height: 200rpx;
background-color: #999999;
}
.spike1_item_bottom{
padding-left: 9.33rpx;
margin-top: 22.67rpx;
.spike1_item_text{
color: #9D9D9D;
font-size: 21.33rpx;
text-decoration: line-through;
}
}
.spike1_item_bottom1{
padding-left: 9.33rpx;
margin-top: 19.33rpx;
font-weight: bold;
.spike1_item_text{
color: #000000;
font-size: 16rpx;
font-weight: 400;
margin-bottom: 20.67rpx;
white-space: break-spaces;
}
}
}
.spike1_item:last-child{
margin-right: 0;
}
}
}
</style>