49 lines
1.2 KiB
Vue
49 lines
1.2 KiB
Vue
<template>
|
|
<view class="book-price-container">
|
|
<view v-if="data.isBuy" class="book-flag">已购买</view>
|
|
<view v-else-if="data.isVip == '0'" class="book-flag">免费</view>
|
|
<view v-else-if="userHasVip && data.isVip == '1'" class="book-price">VIP免费</view>
|
|
<view v-else class="book-price">{{ item.minPrice }} {{ $t('global.coin') }}</view>
|
|
<view>
|
|
<text v-if="data.readCount" class="book-flag">{{ `${data.readCount}${$t('bookHome.readingCount')}` }}</text>
|
|
<text v-else-if="data.buyCount" class="book-flag">{{ `${data.buyCount}${$t('bookHome.purchased')}` }}</text>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { computed } from 'vue'
|
|
import type { IBook } from '@/types/book'
|
|
import { useUserStore } from '@/stores/user'
|
|
|
|
const userStore = useUserStore()
|
|
|
|
// 检查用户是否为VIP
|
|
const userHasVip = computed(() => userStore.userInfo?.userEbookVip?.length > 0)
|
|
|
|
const props = defineProps({
|
|
data: {
|
|
type: Object as () => IBook,
|
|
default: () => ({})
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.book-price-container {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.book-price {
|
|
font-size: 28rpx;
|
|
color: #ff4703;
|
|
}
|
|
|
|
.book-flag {
|
|
font-size: 26rpx;
|
|
color: #999;
|
|
}
|
|
|
|
</style> |