liveh5-nuxt/app/pages/home/components/ItemList/index.vue
xingyy 1b996eafca feat(api): 新增 artworkDetail接口并更新相关页面
- 在 goods API 中添加 artworkDetail函数,用于获取艺术品详情
- 在首页的 ItemList 组件中调用 artworkDetail 获取详情信息- 移除首页中未使用的 useRect 和 itemDetail 组件
2025-01-20 16:57:22 +08:00

73 lines
2.3 KiB
Vue

<script setup lang="ts">
import Column from "~/pages/home/components/Column/index.vue";
import {goodStore} from "~/stores/goods";
import {artworkDetail, artworkList} from "~/api/goods";
import {useRect} from "@vant/use";
const {itemList, pageRef,auctionDetail,liveRef} = goodStore();
const loading = ref(false);
const showHeight = ref('');
const show = ref(false);
const loading1 = ref(false);
const finished = ref(false);
const getArtworkList=async ()=>{
const res= await artworkList({auctionUuid: auctionDetail.value.uuid,...pageRef.value})
if (res.status===0){
itemList.value.push(...res.data.data)
pageRef.value.itemCount=res.data.count
}
}
const loadData = async () => {
pageRef.value.page++
await getArtworkList()
loading.value = false;
if (pageRef.value.itemCount <= itemList.value.length) {
finished.value = true
}
};
const columns = computed(() => {
const result = [[], []];
itemList.value.forEach((item, index) => {
result[index % 2].push({...item, index});
});
return result;
});
const refreshData = async () => {
pageRef.value.page = 1
finished.value=false
const res= await artworkList({auctionUuid: auctionDetail.value.uuid,...pageRef.value})
if (res.status===0){
itemList.value=res.data.data
pageRef.value.itemCount=res.data.count
}
loading1.value = false
}
const getDetail=async ()=>{
const res=await artworkDetail()
}
const openShow = () => {
const rect = useRect(liveRef.value.$el);
showHeight.value = rect.height;
nextTick(() => {
show.value = true;
});
};
</script>
<template>
<div class="px-[16px] pt-[16px]">
<van-pull-refresh v-model="loading1" success-text="刷新成功" @refresh="refreshData">
<van-list :immediate-check="false" v-model:loading="loading" :finished="finished" finished-text="没有更多了"
@load="loadData">
<div class="w-full flex gap-[16px]">
<Column v-for="(column, colIndex) in columns" :key="colIndex" :colIndex="colIndex" :items="column" @click="openShow" />
</div>
</van-list>
</van-pull-refresh>
<van-action-sheet teleport="#__nuxt" :round="false" v-model:show="show" title="拍品详情">
<div class="content bg-[#F0F0F0]" :style="`height: calc(100vh - ${showHeight + 85}px)`">
<itemDetail/>
</div>
</van-action-sheet>
</div>
</template>