zm/nuttyreading-html
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

音频样式bug修复

Browse Source
This commit is contained in:
@fawn-nine
2023-10-09 16:51:26 +08:00
parent c6bff04039
commit 04c821ff48
1 changed files with 55 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
pages/talkBook/talkBookDetail.vue
View File

@@ -4,8 +4,9 @@
<view class="mainContent"> <view class="mainContent">
<view class="title">{{talkBookDetail.title}}</view> <view class="title">{{talkBookDetail.title}}</view>
<view class="voices" v-if="talkBookDetail.voices != '' && audioShow"> <view class="voices" v-if="talkBookDetail.voices != '' && audioShow">
<audio style="text-align: left" :src="talkBookDetail.voices" poster="../../static/icon/fengziIcon.jpg" <audio style="text-align: left; overflow: hidden;" :src="talkBookDetail.voices"
:name="talkBookDetail.title" :author="bookInfo.author.authorName" :action="audioAction" controls></audio> poster="../../static/icon/home_icon_0.png" :name="talkBookDetail.title"
:author="bookInfo.author.authorName" :action="audioAction" controls></audio>
</view> </view>
<view class="content" v-if="talkBookDetail.content != ''" v-html="talkBookDetail.content"></view> <view class="content" v-if="talkBookDetail.content != ''" v-html="talkBookDetail.content"></view>
<view class="content" v-else></view> <view class="content" v-else></view>
@@ -14,7 +15,8 @@
</view> </view>
<view class="tuijin" v-if="!isBuy && bookInfo.productId != null"> <view class="tuijin" v-if="!isBuy && bookInfo.productId != null">
<p>觉得这本书还不错？</p> <p>觉得这本书还不错？</p>
<view class="flexbox" style="justify-content: space-between; border: 1px solid #55aa7f; padding: 10rpx; border-radius: 10rpx;"> <view class="flexbox"
style="justify-content: space-between; border: 1px solid #55aa7f; padding: 10rpx; border-radius: 10rpx;">
<view class="flexbox"> <view class="flexbox">
<view class="img"> <view class="img">
<image v-if="bookInfo.images != ''" :src="bookInfo.images" mode="aspectFit"></image> <image v-if="bookInfo.images != ''" :src="bookInfo.images" mode="aspectFit"></image>
@@ -63,9 +65,11 @@
} }
}, // 书籍信息 }, // 书籍信息
talkBookDetail: {}, talkBookDetail: {},
windowWidth: 0,
} }
}, },
onLoad(e) { onLoad(e) {
this.windowWidth = uni.getSystemInfoSync().windowWidth;
console.log(e, 'onLoad') console.log(e, 'onLoad')
this.bookId = e.bookId this.bookId = e.bookId
this.teachId = e.teachId this.teachId = e.teachId
@@ -163,20 +167,31 @@
.voices { .voices {
margin: 10rpx auto; margin: 10rpx auto;
text-align: center; text-align: center;
} }
/deep/ .uni-audio-name {
// white-space: wrap !important;
width: 340rpx;
}
.title { .title {
font-size: 30rpx; font-size: 30rpx;
color: #55aa7f; color: #55aa7f;
font-weight: bold; font-weight: bold;
margin-bottom: 10px; margin: 40rpx 0;
} }
.time { .time {
text-align: right; font-size: 24rpx; margin-top: 20rpx; color: #999; text-align: right;
font-size: 24rpx;
margin-top: 20rpx;
color: #999;
} }
.content { .content {
font-size: 28rpx; text-align:justify; font-size: 28rpx;
text-align: justify;
color: #666; color: #666;
line-height: 48rpx; line-height: 48rpx;
} }
@@ -198,15 +213,25 @@
} }
p { p {
font-size: 28rpx; margin-bottom: 20rpx; font-size: 28rpx;
margin-bottom: 20rpx;
color: #55aa7f; color: #55aa7f;
} }
} }
.btn{ margin-right: 20rpx;
text{ display: inline-block; margin-top:52rpx; font-size: 30rpx; .btn {
margin-right: 20rpx;
text {
display: inline-block;
margin-top: 52rpx;
font-size: 30rpx;
padding: 5px 8px; padding: 5px 8px;
background: #55aa7f; color: #fff; background: #55aa7f;
color: #fff;
border-radius: 5px; border-radius: 5px;
}} }
}
// .opbtn{font-size: 14rpx;} // .opbtn{font-size: 14rpx;}
</style> </style>