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>
|