123 lines
3.0 KiB
Vue
123 lines
3.0 KiB
Vue
<template>
|
|
<JyCommonHead ref="jy_head" background="jb">
|
|
<template #center>
|
|
<JySearch ref="jy_search" :disabled="false" @search="setHistory"></JySearch>
|
|
</template>
|
|
<template #bottom>
|
|
<JyScreen v-if="!showHistory" @status="statusScreening" :filteredList="filteredList"></JyScreen>
|
|
<!-- -->
|
|
<jyHistory v-if="showHistory" class="history-list" @search="clickHistory"></jyHistory>
|
|
</template>
|
|
</JyCommonHead>
|
|
<!-- 内容 -->
|
|
<!-- 商品卡片组 加载更多 -->
|
|
<!-- <JyContent ref="jy_content" v-if="!showHistory"></JyContent> -->
|
|
<!-- 筛选详情弹窗 -->
|
|
<!-- <JyScreening ref="jy_screening"></JyScreening> -->
|
|
</template>
|
|
<script setup>
|
|
import { ref, nextTick } from 'vue'
|
|
// 内容
|
|
// import JyContent from '@/components/public/jy-shop-content'
|
|
// 筛选
|
|
import JyScreen from './components/jy-screen'
|
|
// 头部
|
|
import JyCommonHead from '@/components/public/jy-common-head'
|
|
// 搜索
|
|
import JySearch from '../components/jy-search'
|
|
// 筛选
|
|
// import JyScreening from './components/jy-screening'
|
|
//历史记录
|
|
import jyHistory from './components/jy-history'
|
|
import {
|
|
onReachBottom,
|
|
onPullDownRefresh
|
|
} from '@dcloudio/uni-app';
|
|
// 头部组件的ref
|
|
const jy_head = ref(null)
|
|
// 内容ref
|
|
const jy_content = ref(null)
|
|
// 显示 搜索后的列表
|
|
const showHistory = ref(true)
|
|
// 搜索组件的ref
|
|
const jy_search = ref(null)
|
|
//
|
|
const conditions = ref({})
|
|
const jy_screening = ref(null)
|
|
const filteredList = ref([{
|
|
label: '综合',
|
|
value: 1,
|
|
isDown: true,
|
|
list: [{
|
|
value: 1,
|
|
text: '综合排序'
|
|
}, {
|
|
value: 2,
|
|
text: '价格排序'
|
|
}],
|
|
slot: null
|
|
}, {
|
|
label: '销量',
|
|
value: 2,
|
|
slot: null
|
|
}, {
|
|
label: '价格',
|
|
value: 3,
|
|
isUp: true,
|
|
isDown: true,
|
|
slot: null
|
|
}, {
|
|
label: '筛选',
|
|
value: 4,
|
|
slot: 'screening',
|
|
fun: "openPopup"
|
|
}])
|
|
const fun = {
|
|
openPopup: () => {
|
|
jy_screening.value.open()
|
|
}
|
|
}
|
|
//筛选状态变更
|
|
const statusScreening = (val) => {
|
|
conditions.value = val
|
|
conditions.value.currentId = val.label
|
|
val.fun && fun[val.fun]()
|
|
}
|
|
//点击历史记录
|
|
const clickHistory = (val) => {
|
|
jy_search.value.updateSearch(val)
|
|
}
|
|
// 搜索
|
|
const setHistory = (val) => {
|
|
if (!val) {
|
|
showHistory.value = true
|
|
return
|
|
}
|
|
showHistory.value = false
|
|
jy_head.value.updateAltitude()
|
|
let arr = uni.getStorageSync('history') || []
|
|
//添加到本地存储
|
|
arr.push(val)
|
|
//长度大于10个就删除第一个
|
|
if (arr.length > 10) {
|
|
arr.shift()
|
|
}
|
|
uni.setStorageSync('history', arr)
|
|
}
|
|
onReachBottom(() => {
|
|
!showHistory.value ? jy_content.value.getData(false, 'onReachBottom') : uni.stopPullDownRefresh()
|
|
|
|
})
|
|
onPullDownRefresh(() => {
|
|
!showHistory.value ? jy_content.value.getData(false, 'onPullDownRefresh') : uni.stopPullDownRefresh()
|
|
})
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.header-search {
|
|
padding-right: 20rpx;
|
|
|
|
.icon {
|
|
margin-right: 20rpx;
|
|
}
|
|
}
|
|
</style> |