112 lines
2.7 KiB
Vue
112 lines
2.7 KiB
Vue
<template>
|
|
<layout>
|
|
<uv-sticky customNavHeight="0">
|
|
<uv-navbar
|
|
:fixed="false"
|
|
title="商品列表"
|
|
left-arrow
|
|
@leftClick="goBack"
|
|
/>
|
|
<view class="search-bar">
|
|
<uv-search
|
|
v-model="keyword"
|
|
shape="round"
|
|
placeholder="搜索商品"
|
|
show-action
|
|
@custom="onSearch"
|
|
@clear="onSearch"
|
|
@search="onSearch"
|
|
>
|
|
</uv-search>
|
|
</view>
|
|
</uv-sticky>
|
|
|
|
<blank size="15"></blank>
|
|
|
|
<container>
|
|
<template v-if="!listEmpty">
|
|
<uv-grid
|
|
:border="false"
|
|
:col="1"
|
|
:gutter="10"
|
|
>
|
|
<uv-grid-item
|
|
v-for="(item, index) in dataList"
|
|
:key="index"
|
|
>
|
|
<card class="pro-card">
|
|
<goods
|
|
link
|
|
list
|
|
:data="item"
|
|
:storeName="item.storeName"
|
|
:price="item.price"
|
|
:stock="!item.campaignType"
|
|
:groupBuy="item.campaignType === 1"
|
|
:original="item.campaignType === 1"
|
|
:buyProgress="[2,3].includes(item.campaignType)"
|
|
:total="[2,3].includes(item.campaignType)"
|
|
>
|
|
</goods>
|
|
</card>
|
|
</uv-grid-item>
|
|
</uv-grid>
|
|
</template>
|
|
<Empty
|
|
v-else
|
|
:iconSrc="emptyCollectIcon"
|
|
>
|
|
这里空空如也~
|
|
</Empty>
|
|
<!-- 加载中 -->
|
|
<ListLoadLoading v-if="loading" />
|
|
<!-- 加载完毕-->
|
|
<ListLoadOver v-if="loadend" />
|
|
</container>
|
|
|
|
</layout>
|
|
<ReturnTop :scrollTop="scrollTop" />
|
|
|
|
</template>
|
|
|
|
<script setup>
|
|
|
|
import { getProductList } from '@/api/product'
|
|
import { onLoad } from '@dcloudio/uni-app'
|
|
import { usePage } from '@/hooks'
|
|
import { useRouter } from "@/hooks/useRouter";
|
|
import Empty from "@/components/Empty/index.vue"
|
|
import ListLoadOver from "@/components/ListLoadOver/index.vue"
|
|
import ListLoadLoading from "@/components/ListLoadLoading/index.vue"
|
|
import { emptyCollectIcon } from "@/utils/images";
|
|
import ReturnTop from "@/components/ReturnTop/index.vue"
|
|
import { useScroll } from "@/hooks/useScroll";
|
|
|
|
const {scrollTop} = useScroll()
|
|
const {getParams, goBack} = useRouter()
|
|
const {keyword, refresh, sid, couponId, dataList, loadend, loading, listEmpty} = usePage(getProductList)
|
|
|
|
|
|
onLoad((options) => {
|
|
const params = getParams(options)
|
|
keyword.value = params.keyword || ''
|
|
sid.value = params.sid || ''
|
|
couponId.value = params.couponId || ''
|
|
refresh()
|
|
})
|
|
|
|
const onSearch = () => {
|
|
refresh()
|
|
}
|
|
|
|
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.pro-card {
|
|
margin-bottom: 20rpx;
|
|
border-radius: 15rpx;
|
|
width: 100%;
|
|
}
|
|
</style>
|