2025-01-15 08:10:28 +00:00
|
|
|
<script setup>
|
2025-02-10 09:02:58 +00:00
|
|
|
import {ref} from "vue";
|
2025-01-22 07:44:50 +00:00
|
|
|
import lockClosed from "@/static/images/lockdfd@2x.png";
|
|
|
|
import lockOpen from "@/static/images/lock4@2x.png";
|
2025-02-10 09:02:58 +00:00
|
|
|
import {liveStore} from "@/stores/live/index.js";
|
2025-01-22 07:44:50 +00:00
|
|
|
import xButton from '@/components/x-button/index.vue'
|
|
|
|
import tangPopup from './tangPopup.vue'
|
2025-01-23 11:43:45 +00:00
|
|
|
import {goodStore} from "@/stores/goods/index.js";
|
2025-02-10 08:26:54 +00:00
|
|
|
import {authStore} from "~/stores/auth/index.js";
|
2025-02-10 09:02:58 +00:00
|
|
|
|
|
|
|
const {quoteStatus, changeStatus, show, auctionData, getSocketData} = liveStore();
|
2025-01-22 07:44:50 +00:00
|
|
|
const {pageRef} = goodStore();
|
2025-02-10 09:02:58 +00:00
|
|
|
const {userInfo} = authStore()
|
|
|
|
const showTang = ref(false)
|
|
|
|
const openOne = () => {
|
|
|
|
showTang.value = true
|
2025-01-22 07:44:50 +00:00
|
|
|
}
|
2025-02-10 09:02:58 +00:00
|
|
|
|
|
|
|
const paySide = computed(() => {
|
2025-02-10 08:26:54 +00:00
|
|
|
//当前是否已成交,以及成交人是当前登录用户
|
2025-02-11 07:27:31 +00:00
|
|
|
if (auctionData.value.artwork?.isSoled && auctionData.value.artwork?.buyInfo.userID === userInfo.value.ID) {
|
2025-02-10 09:02:58 +00:00
|
|
|
return true
|
|
|
|
} else {
|
|
|
|
return false
|
|
|
|
}
|
2025-02-10 08:26:54 +00:00
|
|
|
})
|
2025-02-10 09:02:58 +00:00
|
|
|
const goPay = () => {
|
|
|
|
show.value = true
|
|
|
|
}
|
2025-01-15 08:10:28 +00:00
|
|
|
</script>
|
|
|
|
|
|
|
|
<template>
|
|
|
|
<div class="bg-white w-60px rounded-l-4px overflow-hidden">
|
|
|
|
<!-- 拍品信息 -->
|
2025-02-10 08:26:54 +00:00
|
|
|
<van-button class="w-60px !h-60px" @click="openOne" style="border: none;border-radius: 0">
|
2025-02-10 09:02:58 +00:00
|
|
|
<div class="text-center flex flex-col justify-center items-center text-#7D7D7F text-12px">
|
2025-02-12 06:34:05 +00:00
|
|
|
<div>{{ $t('live_room.lots') }}</div>
|
2025-02-10 09:02:58 +00:00
|
|
|
<div>({{ auctionData?.artwork?.index }}/{{ pageRef.itemCount ?? 0 }})</div>
|
2025-01-15 08:10:28 +00:00
|
|
|
</div>
|
2025-02-10 08:26:54 +00:00
|
|
|
</van-button>
|
2025-01-22 07:44:50 +00:00
|
|
|
<tangPopup v-model:show="showTang"></tangPopup>
|
2025-01-15 08:10:28 +00:00
|
|
|
<!-- 出价开关 -->
|
2025-02-10 09:02:58 +00:00
|
|
|
<van-button class="w-60px !h-60px" @click="changeStatus"
|
|
|
|
style="border-right: none;border-left: none;border-radius: 0;padding: 0">
|
2025-02-10 08:26:54 +00:00
|
|
|
<div class="text-center flex flex-col justify-center items-center">
|
|
|
|
<div class="mb-4px">
|
2025-01-15 08:10:28 +00:00
|
|
|
<img
|
|
|
|
:src="quoteStatus ? lockClosed : lockOpen"
|
|
|
|
class="w-16px h-21px"
|
|
|
|
alt="锁图标"
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
<div :class="quoteStatus ? 'text-gray-500' : 'text-blue-600'" class="text-10px transition-colors duration-200">
|
2025-02-12 06:34:05 +00:00
|
|
|
{{ quoteStatus ? $t('live_room.colse_bid') : $t('live_room.start_bid') }}
|
2025-01-15 08:10:28 +00:00
|
|
|
</div>
|
|
|
|
</div>
|
2025-02-10 08:26:54 +00:00
|
|
|
</van-button>
|
2025-01-15 08:10:28 +00:00
|
|
|
<!-- 支付 -->
|
2025-02-10 09:02:58 +00:00
|
|
|
<van-button v-if="paySide" class="w-60px !h-60px" style="border: none;border-radius: 0" @click="goPay">
|
2025-02-10 08:26:54 +00:00
|
|
|
<div class="text-center flex flex-col justify-center items-center text-yellow-600">
|
2025-01-15 08:10:28 +00:00
|
|
|
<div class="text-10px">RMB</div>
|
|
|
|
<div class="text-12px">5,000</div>
|
2025-02-12 06:34:05 +00:00
|
|
|
<div class="text-10px">{{ $t('art_detail_page.button') }}</div>
|
2025-01-15 08:10:28 +00:00
|
|
|
</div>
|
2025-02-10 08:26:54 +00:00
|
|
|
</van-button>
|
2025-01-22 05:28:21 +00:00
|
|
|
|
2025-01-15 08:10:28 +00:00
|
|
|
</div>
|
|
|
|
</template>
|