- 将 LiveRoom 相关组件和文件重命名,统一使用小写开头 - 新增 x-button、x-image 和 x-popup 组件,替代原有 PressableButton 和 ImagePreview -优化 SideButton 组件,使用新的 x-button 和 tangPopup 组件- 更新 LiveRoom 组件中的引用和使用方式 - 调整 tangPopup 组件,使用 goodStore 替代静态数据
64 lines
1.7 KiB
Vue
64 lines
1.7 KiB
Vue
<script setup>
|
||
import xPopup from '@/components/x-popup/index.vue'
|
||
import {goodStore} from "~/stores/goods/index.js";
|
||
import { showImagePreview } from 'vant';
|
||
const {pageRef,itemList} = goodStore();
|
||
const props = defineProps({
|
||
show: Boolean,
|
||
title: {
|
||
type: String,
|
||
default: ''
|
||
}
|
||
})
|
||
const emit = defineEmits(['update:show'])
|
||
|
||
const close = () => emit('update:show', false);
|
||
const openImage = (url) => {
|
||
showImagePreview([url]);
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<x-popup :show="show" @update:show="close">
|
||
<template #title>
|
||
<div class="text-#000 text-16px">拍品列表</div>
|
||
<div class="text-#939393 text-16px ml-14px">共{{ pageRef.itemCount }}个拍品</div>
|
||
</template>
|
||
<div>
|
||
<div
|
||
v-for="(item,index) of itemList"
|
||
:key="item.uuid"
|
||
class="flex mb-21px"
|
||
>
|
||
<div
|
||
class="mr-10px flex-shrink-0 rounded-4px overflow-hidden cursor-pointer"
|
||
@click="openImage(item.artwork.hdPic)"
|
||
>
|
||
<img
|
||
class="w-80px h-80px"
|
||
:src="item.artwork.hdPic"
|
||
:alt="item.artworkTitle"
|
||
loading="lazy"
|
||
>
|
||
</div>
|
||
<div>
|
||
<div class="ellipsis line-height-20px text-16px font-600 min-h-40px">
|
||
{{ item.artworkTitle }}
|
||
</div>
|
||
<div class="text-14px text-#575757">起拍价:RMB 1,000</div>
|
||
<div class="text-14px text-#B58047">成交价:等待更新</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</x-popup>
|
||
</template>
|
||
|
||
<style scoped>
|
||
.ellipsis {
|
||
display: -webkit-box;
|
||
-webkit-box-orient: vertical;
|
||
-webkit-line-clamp: 2;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
}
|
||
</style> |