|
|
@@ -2,19 +2,20 @@
|
|
|
import { StaticUrl, VITE_OSS_BASE_URL } from '@/config'
|
|
|
import router from '@/router'
|
|
|
|
|
|
-const props = defineProps<{ categoryList: Api.xsbCategories[], swiper: Api.xsbAdvertInfo[], hotText: Api.xsbSearchTerm[], recommendText: Api.xsbSearchTerm[], loading: boolean }>()
|
|
|
+const props = defineProps<{ error: any, lastPage: boolean, categoryList: Api.xsbCategories[], swiper: Api.xsbAdvertInfo[], hotText: Api.xsbSearchTerm[], recommendText: Api.xsbSearchTerm[], loading: boolean, goodsList: Api.xsbCategoryProductList[] }>()
|
|
|
|
|
|
-const emit = defineEmits(['changeNav'])
|
|
|
+const emit = defineEmits(['changeNav', 'scrollBottom'])
|
|
|
|
|
|
const { ScrollDown } = storeToRefs(useSysXsbStore())
|
|
|
|
|
|
const { statusBarHeight, MenuButtonHeight } = storeToRefs(useSysStore())
|
|
|
const { name } = storeToRefs(useAddressStore())
|
|
|
-const { topNavActive, leftActive } = storeToRefs(useSysXsbStore())
|
|
|
+const { topNavActive, leftActive, backTop } = storeToRefs(useSysXsbStore())
|
|
|
const swiperList = computed(() => props.swiper)
|
|
|
const navActive = ref(0)
|
|
|
const classfiylist = computed(() => props.categoryList.slice(0, 10))
|
|
|
const swiperClassList = computed(() => props.categoryList.slice(10, props.categoryList.length))
|
|
|
+const scrollTop = ref()
|
|
|
|
|
|
const navList = ref([
|
|
|
{ title: '为你推荐' },
|
|
|
@@ -55,6 +56,20 @@ function handleSwiperClick(e: { index: number, item: Api.xsbCategories }) {
|
|
|
function handleGo(e: { index: number, item: Api.xsbAdvertInfo }) {
|
|
|
console.log(e, '跳转消息')
|
|
|
}
|
|
|
+
|
|
|
+const state = computed(() => {
|
|
|
+ return props.error ? 'error' : !props.lastPage ? 'loading' : 'finished'
|
|
|
+})
|
|
|
+
|
|
|
+watch(() => backTop.value, () => {
|
|
|
+ if (backTop.value) {
|
|
|
+ scrollTop.value = null
|
|
|
+ nextTick(() => {
|
|
|
+ scrollTop.value = 0
|
|
|
+ })
|
|
|
+ backTop.value = false
|
|
|
+ }
|
|
|
+})
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
|
@@ -76,7 +91,11 @@ function handleGo(e: { index: number, item: Api.xsbAdvertInfo }) {
|
|
|
</view>
|
|
|
</template>
|
|
|
</wd-navbar>
|
|
|
- <scroll-view scroll-y class="content" @scroll="handleScroll">
|
|
|
+ <scroll-view
|
|
|
+
|
|
|
+ :lower-threshold="80"
|
|
|
+ scroll-y enable-passive scroll-anchoring :scroll-top="scrollTop" class="content ios" @scroll="handleScroll" @scrolltolower="emit('scrollBottom')"
|
|
|
+ >
|
|
|
<view
|
|
|
class="header-linear h320rpx px24rpx"
|
|
|
:style="{ paddingTop: `${(Number(statusBarHeight) || 44) + MenuButtonHeight + 12}px` }"
|
|
|
@@ -212,25 +231,26 @@ function handleGo(e: { index: number, item: Api.xsbAdvertInfo }) {
|
|
|
]" :height="231"
|
|
|
/>
|
|
|
<view
|
|
|
- v-for="it in 20" :key="it" class="overflow-hidden rounded-16rpx bg-white pb16rpx"
|
|
|
+ v-for="it in goodsList" :key="it.id" class="overflow-hidden rounded-16rpx bg-white pb16rpx"
|
|
|
+ @click="router.push({ name: 'xsb-goods', params: { id: it.id } })"
|
|
|
>
|
|
|
<view class="relative h344rpx">
|
|
|
<image
|
|
|
- :src="`${VITE_OSS_BASE_URL}2025/11/9d42892888304abf85487deea0271f62.png`"
|
|
|
+ :src="it.pic"
|
|
|
class="h344rpx w344rpx"
|
|
|
/>
|
|
|
</view>
|
|
|
<view class="mt20rpx px20rpx">
|
|
|
- <view class="text-left text-28rpx font-semibold">
|
|
|
- <view v-for="i in 2" :key="i" class="mr5px inline-block">
|
|
|
+ <view class="line-clamp-2 text-left text-28rpx font-semibold">
|
|
|
+ <!-- <view v-for="i in 2" :key="i" class="mr5px inline-block">
|
|
|
<wd-tag type="primary">
|
|
|
新品{{ i }}
|
|
|
</wd-tag>
|
|
|
- </view>
|
|
|
- 海湾高盐特大白虾200g
|
|
|
+ </view> -->
|
|
|
+ {{ it.prodName }}
|
|
|
</view>
|
|
|
<view class="mt12rpx text-22rpx text-#AAAAAA">
|
|
|
- 已售5999
|
|
|
+ 已售{{ it.soldNum }}
|
|
|
</view>
|
|
|
|
|
|
<view class="mt10rpx flex items-center justify-between">
|
|
|
@@ -240,7 +260,7 @@ function handleGo(e: { index: number, item: Api.xsbAdvertInfo }) {
|
|
|
¥
|
|
|
</view>
|
|
|
<view class="text-36rpx line-height-[36rpx]">
|
|
|
- 1.395
|
|
|
+ {{ it.channelProdPrice }}
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
@@ -249,18 +269,19 @@ function handleGo(e: { index: number, item: Api.xsbAdvertInfo }) {
|
|
|
</view>
|
|
|
</view>
|
|
|
</grid-view>
|
|
|
+ <wd-loadmore :state="state" :loading-props="{ color: '#9ED605', size: 20 }" @reload="emit('scrollBottom')" />
|
|
|
</scroll-view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="h100rpx" />
|
|
|
+ <view class="h60rpx" />
|
|
|
</scroll-view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
.content {
|
|
|
- height: calc(100vh - var(--window-top) - 80rpx);
|
|
|
+ height: calc(100vh - var(--window-top) - 100rpx);
|
|
|
}
|
|
|
.nav-line{
|
|
|
background: linear-gradient( 90deg, #9ED605 0%, rgba(158,214,5,0.7) 43%, rgba(158,214,5,0.2) 79%, rgba(158,214,5,0) 100%);
|