Files
nuttyreading-html/pages/eBook/bookMessage.vue
2023-09-19 17:58:35 +08:00

314 lines
6.7 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<view style="padding: 30rpx;">
<z-nav-bar title=""></z-nav-bar>
<view class="author_mess" v-if="shouTyp==1">
<h4>
{{authorMess.authorName}}
<span>作者</span>
</h4>
<p>{{authorMess.introduction}}</p>
<!-- <u-line color="#e7e7e7" style="margin: 35rpx 0"></u-line> -->
<!-- <p>免责声明123111111111111111111111566666666666666666666666666</p> -->
</view>
<view class="publish_mess" v-if="shouTyp==2">
<h4>
{{publishMess.publisherName}}
<span>出版社</span>
</h4>
<p>{{publishMess.introduction}}</p>
</view>
<view class="bupuberList">
<h4 v-if="shouTyp==1">Ta的作品 ({{this.bupuList.totalCount}})</h4>
<h4 v-if="shouTyp==2">全部图书 ({{this.bupuList.totalCount}})</h4>
<view class="book_list">
<view class="bl_tioa" v-for="(item,index) in this.bupuList.list" @click="onBookJump(item)">
<image :src="item.images"></image>
<b v-if="item.isVip==1" style="background: #c79119;">VIP</b>
<b v-if="item.isVip==2" style="background: #c74119;">付费</b>
<view class="bl_list">
<view>
<text class="bok_name">{{item.name}}</text>
</view>
<view v-if="shouTyp==2">
<text>作者<text style="color: #333;">{{item.authorName}}</text></text>
</view>
<view v-if="shouTyp==1">
<text>简介<text style="color: #333;" v-if="item.description == ''">暂无简介内容</text>
<text style="color: #333;" class="jianjie">{{item.description}}</text></text>
</view>
<view>
<text style="line-height: 20rpx;">{{item.title}}</text>
</view>
</view>
<br clear='both'>
</view>
<view style="height: 1px;"></view>
</view>
</view>
<view>
<view v-if="status==0" style="text-align: center;">
<u-loading-icon style="display: inline-block;"></u-loading-icon>
<font style='vertical-align: super;margin-left: 10px;font-size: 26rpx;color: #909399;'>努力加载中</font>
</view>
<view v-if="status==1">
<u-divider text="全部加载完成"></u-divider>
</view>
</view>
<view style="padding-bottom: 20rpx;">
<u-back-top :scroll-top="scrollTop" bottom="60" :customStyle='bgiStyle' :iconStyle="iconStyle"></u-back-top>
</view>
</view>
</template>
<script>
export default {
data() {
return {
AuPluid: '',
shouTyp: '',
authorMess: {},
publishMess: {},
bupuList: {},
bupuTotal: 1,
status: 3,
scrollTop: 0,
bgiStyle: {
background: '#2ab58833'
},
iconStyle: {
fontSize: '40rpx',
fontWeight: 'bold',
color: '#54a966',
},
};
},
onPageScroll(e) {
this.scrollTop = e.scrollTop;
},
//第一次加载
onLoad(e) {
this.AuPluid = e.Id
this.shouTyp = e.typ
},
//页面显示
onShow() {
this.getData();
},
// 下拉刷新
onReachBottom() {
this.status = 0
if (this.bupuTotal < this.bupuList.totalPage) {
this.bupuTotal = this.bupuTotal + 1
setTimeout(() => {
if (this.shouTyp == 1) {
this.$http
.post('book/author/appGetInfo/' + this.AuPluid + '/2/' + this.bupuTotal)
.then(res => {
this.totalPage = res.authorBooks.currPage
for (let i in res.authorBooks.list) {
this.bupuList.list.push(res.authorBooks.list[i])
}
});
} else {
this.$http
.post('book/publisher/appGetInfo/' + this.AuPluid + '/2/' + this.bupuTotal)
.then(res => {
this.totalPage = res.publisherBooks.currPage
for (let i in res.publisherBooks.list) {
this.bupuList.list.push(res.publisherBooks.list[i])
}
});
}
}, 1000)
} else {
this.status = 1
}
},
//方法
methods: {
// 获取作者或者出版社信息
getData() {
this.bupuList = []
if (this.shouTyp == 1) {
this.$http
.post('book/author/appGetInfo/' + this.AuPluid + '/5/' + this.bupuTotal)
.then(res => {
this.authorMess = res.authorInfo
this.bupuList = res.authorBooks
this.status = 3
});
} else {
this.$http
.post('book/publisher/appGetInfo/' + this.AuPluid + '/5/' + this.bupuTotal)
.then(res => {
this.publishMess = res.publisherInfo
this.bupuList = res.publisherBooks
this.status = 3
});
}
},
// 电子书内容跳转
onBookJump(e) {
uni.navigateTo({
url: './bookContent?Id=' + e.id
});
},
},
};
</script>
<style lang="scss" scoped>
@import '@/style/mixin.scss';
.jianjie{overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
text-align:justify;
}
.author_mess {
padding: 30rpx 30rpx;
box-shadow: 0 0px 10px 1px #d3d1d133;
background-color: #fff;
border-radius: 15rpx;
margin-bottom: 40rpx;
h4 {
margin: 0 0 40rpx 0;
color: #333;
font-size: 40rpx;
span {
color: #54a966;
border: 1px solid #54a966;
border-radius: 20rpx;
font-size: 10rpx;
font-weight: normal;
padding: 2rpx 10rpx;
margin-left: 20rpx;
display: inline-block;
vertical-align: super;
}
}
p {
margin: 20rpx 0;
color: #666;
font-size: 30rpx;
word-break: break-all;
line-height: 45rpx;
}
}
.publish_mess {
padding: 30rpx 30rpx;
box-shadow: 0 0px 10px 1px #d3d1d133;
background-color: #fff;
border-radius: 15rpx;
margin-bottom: 40rpx;
h4 {
margin: 0 0 40rpx 0;
color: #333;
font-size: 40rpx;
span {
color: #54a966;
border: 1px solid #54a966;
border-radius: 20rpx;
font-size: 10rpx;
font-weight: normal;
padding: 2rpx 10rpx;
margin-left: 20rpx;
display: inline-block;
vertical-align: super;
}
}
p {
margin: 20rpx 0;
color: #666;
font-size: 30rpx;
word-break: break-all;
line-height: 45rpx;
}
}
.bupuberList {
h4 {
padding: 0 8rpx;
margin: 0 0 40rpx 0;
color: #333;
font-size: 35rpx;
}
.book_list {
margin: 50rpx 0 0 0;
.bl_tioa {
// box-shadow: 0 0px 10px 1px #d3d1d133;
background-color: #fff;
position: relative;
padding: 30rpx;
margin: 0 0 30rpx 0;
border-radius: 15rpx;
min-height: 300rpx;
image {
float: left;
width: 160upx;
height: 240upx;
margin-right: 25rpx;
}
.bl_list {
float: left;
max-width: 420rpx;
text {
color: #9b9b9b;
font-size: 24rpx;
line-height: 36rpx;
}
.bok_name {
font-weight: bold;
color: #333;
font-size: 28rpx;
}
}
b {
display: block;
padding: 5rpx 10rpx;
border-radius: 10rpx;
text-align: center;
color: #fff;
font-weight: normal;
background: #27b386;
position: absolute;
left: 5upx;
top: 40upx;
font-size: 16rpx;
}
}
}
}
</style>