refactor(app): 优化首页拍品详情样式

- 调整拍品详情背景颜色
- 优化轮播图样式
- 增加拍品信息、起拍价和竞价表等内容- 优化样式和布局
This commit is contained in:
xingyy 2025-01-10 15:50:57 +08:00
parent ea89149d42
commit c734e4ffd5
3 changed files with 34 additions and 4 deletions

View File

@ -16,7 +16,6 @@ const showMessage = ({ type = 'warning', message, duration = 2000 }) => {
visible.value = false
}, duration)
}
defineExpose({ showMessage })
</script>

View File

@ -192,8 +192,8 @@ const clickSwipe=(index)=>{
</van-tabs>
<van-back-top right="15vw" bottom="10vh"/>
<van-action-sheet :round="false" v-model:show="show" title="拍品详情">
<div class="content" :style="`height: calc(100vh - ${showHeight+39}px)`">
<van-swipe indicator-color="#B4B4B4" lazy-render >
<div class="content bg-[#F0F0F0]" :style="`height: calc(100vh - ${showHeight+39}px)`">
<van-swipe style="height: 188px" indicator-color="#B4B4B4" lazy-render >
<van-swipe-item v-for="(image,index) in images" :key="image" @click="clickSwipe(index)">
<van-image
fit="contain"
@ -203,11 +203,42 @@ const clickSwipe=(index)=>{
/>
</van-swipe-item>
</van-swipe>
<div class="px-[16px] bg-[#fff] pt-[11px] mb-6px">
<div class="text-[#000] text-[16px] mb-[12px]">日出而作日落而息</div>
<div class="text-#575757 text-[14px] pb-8px">
<div class="flex mb-[4px]">
<div class="w-[70px]">作者</div>
<div>张天赐</div>
</div>
<div class="flex mb-[4px]">
<div class="w-[70px] flex-shrink-0">总平尺数</div>
<div></div>
</div>
<div class="flex mb-[4px]">
<div class="w-[70px] flex-shrink-0">*</div>
<div>100*200cm</div>
</div>
<div class="flex mb-[4px]">
<div class="w-[70px] flex-shrink-0">画作简介</div>
<div>是打卡时间到卡上即可点击卡拉斯科健康就阿斯科利打卡时间到卡萨带手机的啊科技是打卡时</div>
</div>
</div>
</div>
<div class="flex px-[16px] bg-#fff h-[36px] items-center mb-6px">
<div class="text-[#575757] text-[14px]">起拍价</div>
<div class="text-#575757 text-14px font-bold">RMB 1,000</div>
</div>
<div class="px-[16px] bg-#fff pt-12px pb-18px">
<div class="text-[#575757] text-[14px] mb-4px">竞价表</div>
<div>
<img src="@/static/images/1981736313.png" alt="">
</div>
</div>
</div>
</van-action-sheet>
</template>
<style>
:root:root {
:root:root {
--van-action-sheet-header-height: 39px;
}
</style>

Binary file not shown.

After

Width:  |  Height:  |  Size: 283 KiB