137 lines
2.8 KiB
Vue
137 lines
2.8 KiB
Vue
<template>
|
||
<view class="bookCoinDetail_content">
|
||
<view class="_list_body">
|
||
<view class="_list_body_item">
|
||
<view class="_item_book_img">
|
||
<image class="is_image" src="/static/images/book_111.png"></image>
|
||
</view>
|
||
<view class="_item_book_title_other">
|
||
<view class="_item_book_title">
|
||
女主拿了反派剧本女主拿了反派剧本
|
||
</view>
|
||
<view class="_item_book_other_tips">
|
||
整本
|
||
</view>
|
||
<view class="_item_book_purchase_time">
|
||
购买时间：2022.03.14
|
||
</view>
|
||
</view>
|
||
<view class="_item_book_coin_num">
|
||
<view class="_coin_num">
|
||
-6000书币
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="_list_body_item">
|
||
<view class="_item_book_img">
|
||
<image class="is_image" src="/static/images/book_111.png"></image>
|
||
</view>
|
||
<view class="_item_book_title_other">
|
||
<view class="_item_book_title">
|
||
女主拿了反派剧本女主拿了反派剧本
|
||
</view>
|
||
<view class="_item_book_other_tips">
|
||
整本
|
||
</view>
|
||
<view class="_item_book_purchase_time">
|
||
购买时间：2022.03.14
|
||
</view>
|
||
</view>
|
||
<view class="_item_book_coin_num">
|
||
<view class="_coin_num">
|
||
-6000书币
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.is_image {
|
||
display: block;
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
.bookCoinDetail_content {
|
||
width: 100%;
|
||
|
||
._list_body {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 32rpx;
|
||
|
||
._list_body_item {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
width: 100%;
|
||
height: 212rpx;
|
||
overflow: hidden;
|
||
margin-bottom: 32rpx;
|
||
|
||
._item_book_img {
|
||
width: 160rpx;
|
||
height: 100%;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
._item_book_title_other {
|
||
flex: 1;
|
||
padding: 0 20rpx;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-around;
|
||
overflow: hidden;
|
||
|
||
._item_book_title {
|
||
width: 100%;
|
||
font-size: 32rpx;
|
||
color: #1A1A1A;
|
||
line-height: 1;
|
||
white-space: nowrap; //不支持换行
|
||
overflow: hidden; //隐藏多出部分文字
|
||
text-overflow: ellipsis; //用省略号代替多出部分文字
|
||
}
|
||
|
||
._item_book_other_tips {
|
||
font-size: 28rpx;
|
||
color: #999999;
|
||
line-height: 1;
|
||
}
|
||
|
||
._item_book_purchase_time {
|
||
font-size: 28rpx;
|
||
color: #999999;
|
||
line-height: 1;
|
||
white-space: nowrap; //不支持换行
|
||
overflow: hidden; //隐藏多出部分文字
|
||
text-overflow: ellipsis; //用省略号代替多出部分文字
|
||
}
|
||
}
|
||
|
||
._item_book_coin_num {
|
||
display: flex;
|
||
align-items: center;
|
||
flex-shrink: 0;
|
||
|
||
._coin_num {
|
||
font-size: 32rpx;
|
||
color: #FF728F;
|
||
line-height: 1;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style> |