feat(home): 获取拍卖详情并优化首页组件
- 在 home 页面中调用 getAuctionDetail 方法获取拍卖详情 - 更新 Cescribe组件以显示拍卖详情信息和图片 - 在 ItemList 组件中添加 v-memo 指令以优化性能 - 调整 liveRoom 组件中的视频播放器样式
This commit is contained in:
parent
2d909b276b
commit
9f9e96dc0c
@ -1,12 +1,16 @@
|
||||
<script setup>
|
||||
|
||||
import {goodStore} from "~/stores/goods/index.js";
|
||||
import xImage from '@/components/x-image/index.vue'
|
||||
const {
|
||||
auctionDetail
|
||||
} = goodStore()
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="px-16px pt-14px">
|
||||
<div class="text-#575757 text-14px">
|
||||
这里是后台富文本配置的说明,啊即可打开三等奖撒度老师的湿答答是快乐的阿四大皆空
|
||||
<div class="text-#575757 text-14px" v-html="auctionDetail.info">
|
||||
</div>
|
||||
<xImage :src="auctionDetail.image" class="w-343px"></xImage>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@ -65,7 +65,7 @@ const openShow = async (item) => {
|
||||
finished-text="没有更多了"
|
||||
@load="loadMore"
|
||||
>
|
||||
<div class="w-full flex gap-[16px]">
|
||||
<div class="w-full flex gap-[16px]" v-memo="[itemList]">
|
||||
<masonry-wall :items="itemList" :ssr-columns="2" :maxColumns="2" :minColumns="2" :gap="5">
|
||||
<template #default="{ item, index }">
|
||||
<div
|
||||
|
@ -3,10 +3,11 @@ import liveRoom from '@/pages/liveRoom/index.client.vue';
|
||||
import {goodStore} from "@/stores/goods/index.js";
|
||||
import ItemList from './components/ItemList/index.vue'
|
||||
import Cescribe from './components/Cescribe/index.vue'
|
||||
const {fullLive, liveRef} = goodStore();
|
||||
const {fullLive, liveRef,getAuctionDetail} = goodStore();
|
||||
const changeLive = () => {
|
||||
fullLive.value = true;
|
||||
};
|
||||
getAuctionDetail()
|
||||
</script>
|
||||
<template>
|
||||
<div class="flex-grow-1">
|
||||
|
@ -86,7 +86,7 @@ watch(()=>{
|
||||
|
||||
<template>
|
||||
<div class="relative h-full">
|
||||
<!-- <div class="w-full h-full">
|
||||
<div class="w-full h-full">
|
||||
<video
|
||||
class="h-full w-full"
|
||||
autoplay
|
||||
@ -98,7 +98,7 @@ watch(()=>{
|
||||
<source src="@/static/video/example.mp4" type="video/mp4" />
|
||||
您的浏览器不支持 HTML5 视频。
|
||||
</video>
|
||||
</div>-->
|
||||
</div>
|
||||
<!-- <div :id="playerId" class="w-screen"
|
||||
:style="fullLive?'height: calc(100vh - var(--van-nav-bar-height))':'height:100%'"></div>-->
|
||||
|
||||
|
@ -34,6 +34,7 @@ export const goodStore = createGlobalState(() => {
|
||||
const res = await defaultDetail({})
|
||||
if (res.status === 0) {
|
||||
auctionDetail.value = res.data
|
||||
console.log('auctionDetail.value',auctionDetail.value)
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取拍卖详情错误:', err)
|
||||
|
Loading…
Reference in New Issue
Block a user