2023-09-19 19:31:19 +08:00

110 lines
1.9 KiB
Vue

<template>
<view class="bookOtherInfo_content">
<view class="bookOtherInfo_body">
<view class="bookOtherInfo_item">
<view class="bookOtherInfo_top">
<view class="book_item_num">
{{bookInfo.score}}
</view>
<view class="book_item_tex">
评分
</view>
</view>
<view class="bookOtherInfo_bottom">
分数
</view>
</view>
<view class="bookOtherInfo_item">
<view class="bookOtherInfo_top">
<view class="book_item_num">
{{bookInfo.userNum}}
</view>
<view class="book_item_tex">
万人
</view>
</view>
<view class="bookOtherInfo_bottom">
在读
</view>
</view>
<view class="bookOtherInfo_item">
<view class="bookOtherInfo_top">
<view class="book_item_num">
{{bookInfo.size}}
</view>
<view class="book_item_tex">
<!-- 万字 -->
</view>
</view>
<view class="bookOtherInfo_bottom">
已完结
</view>
</view>
</view>
</view>
</template>
<script>
export default {
props: {
bookInfo: {
type: Object,
default: {
// 字数
size: '',
// 评论
score: '',
// 在线人数
userNum: ''
}
}
},
data() {
return {
}
}
}
</script>
<style lang="scss" scoped>
.bookOtherInfo_content {
width: 100%;
.bookOtherInfo_body {
display: flex;
justify-content: space-between;
width: 100%;
.bookOtherInfo_item {
.bookOtherInfo_top {
display: flex;
align-items: flex-end;
flex-wrap: nowrap;
.book_item_num {
font-size: 50rpx;
color: #1A1A1A;
line-height: 1;
font-weight: 600;
}
.book_item_tex {
margin-left: 4rpx;
color: #1A1A1A;
line-height: 1;
font-size: 28rpx;
}
}
.bookOtherInfo_bottom {
line-height: 1;
color: #666666;
font-size: 26rpx;
margin-top: 32rpx;
}
}
}
}
</style>