Commit 1ab1282c authored by jyx's avatar jyx

代码优化

parent 6401c10b
......@@ -4,50 +4,53 @@
<view class="section">
<view class="title">
99%读过这本书的人还在读
</view>
<view class="book-list-item" v-for='(item, index) in dataList' :key='index' :item='item' @click="tapItem(item)">
<view class="cover-box item">
<image v-if="item.avatar===''" class="cover" src="/static/images/logo.png" mode="aspectFill"></image>
<image v-else class="cover" :src="item.avatar" mode="aspectFill" ></image>
</view>
<view class="c-flex_column">
<view class="c-flex_row c-justify_between row">
<view class="c-flex_column c-justify_center item">
<view class="title2">
{{item.title}}
</view>
</view>
</view>
<view class="c-flex_row row">
<view class="c-flex_column c-justify_between content c-flex_1 item">
<view class="desc row">
{{item.summary}}
</view>
<view class="c-flex_row c-align_center label-box row">
<slot name="footer">
<view class="label label-color-1" v-if="item.categoryName!=null&&item.categoryName!=''">
{{item.categoryName}}
</view>
<view class="label label-color-2" v-for='(label, labelIndex) in item.tagList'
:key='labelIndex'>
{{label.name}}
</view>
</slot>
</view>
</view>
</view>
</view>
<view style="display: flex;margin: auto;width: 200rpx;">
<button class="btn2" >去阅读</button>
</view>
</view>
<view class="book-list-item" v-for='(item, index) in dataList' :key='index' :item='item'
@click="tapItem(item)">
<view class="cover-box item">
<image v-if="item.avatar===''" class="cover" src="/static/images/logo.png" mode="aspectFill">
</image>
<image v-else class="cover" :src="item.avatar" mode="aspectFill"></image>
</view>
<view class="c-flex_column">
<view class="c-flex_row c-justify_between row">
<view class="c-flex_column c-justify_center item">
<view class="title2">
{{item.title}}
</view>
</view>
</view>
<view class="c-flex_row row">
<view class="c-flex_column c-justify_between content c-flex_1 item">
<view class="desc row">
{{item.summary}}
</view>
<view class="c-flex_row c-align_center label-box row">
<slot name="footer">
<view class="label label-color-1"
v-if="item.categoryName!=null&&item.categoryName!=''">
{{item.categoryName}}
</view>
<view class="label label-color-2" v-for='(label, labelIndex) in item.tagList'
:key='labelIndex'>
{{label.name}}
</view>
</slot>
</view>
</view>
</view>
</view>
<view style="display: flex;margin: auto;width: 200rpx;">
<button class="btn2">去阅读</button>
</view>
</view>
</view>
</view>
</uni-popup>
</template>
<script>
<script>
import SystemInfoMixin from "../../../../common/mixins/system-info-mixin.js";
import {
gotoBookContentPage
......@@ -100,8 +103,7 @@
}
}
},
onUnload() {
},
onUnload() {},
mounted() {
this.requestPackData();
},
......@@ -117,18 +119,20 @@
this.showPop = false;
},
requestPackData() {
getBookRecommendData(this.bookId,(success, data) => {
if (success) {
this.dataList = data.records;
getBookRecommendData(this.bookId, (success, data) => {
if (success) {
this.dataList = data.records;
}
})
},
tapItem(item) {
// 在C页面内 navigateBack,将返回A页面
uni.navigateBack({
delta: 2
});
gotoBookContentPage(item.id);
})
},
tapItem(item) {
// 在C页面内 navigateBack,将返回A页面
uni.navigateBack({
delta: 2
});
setTimeout(() => {
gotoBookContentPage(item.id, item.shortis);
}, 1000)
}
}
}
......@@ -231,117 +235,119 @@
margin: 30rpx auto;
}
}
}
.book-list-item {
display: flex;
flex-direction: row;
padding-top: 14rpx;
padding-bottom: 14rpx;
.row {
margin-bottom: 20rpx;
}
.row:last-child {
margin-bottom: 0;
}
.item {
margin-right: 20rpx;
}
.item:last-child {
margin-right: 0;
}
.title {
font-size: 32rpx;
font-weight: 700;
color: #333;
}
.close-button {
border-radius: 10rpx;
border: 2rpx solid #999;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 40rpx;
height: 30rpx;
position: relative;
.cover {
position: absolute;
top: 50%;
left: 50%;
width: 70rpx;
height: 70rpx;
transform: translate(-50%, -50%);
z-index: 2;
background: transparent;
}
}
.desc {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
font-size: 26rpx;
color: #999
}
.label-box {
flex-wrap: wrap;
.label {
padding: 5rpx 10rpx;
font-size: 20rpx;
margin-right: 20rpx;
border-radius: 10rpx;
}
.label-color-1 {
background: #faefe6;
color: #cc6008;
}
.label-color-2 {
color: #3d99fd;
background: #d8ebff;
}
.label-color-3 {
background: #ff8787;
color: #ff3737;
}
}
}
.cover-box {
.cover {
width: 150rpx;
height: 200rpx;
border-radius: 15rpx;
}
}
.title2 {
font-size: 32rpx;
font-weight: 700;
color: #333;
}
.btn2 {
color: #d98c5c;
border: #DCBD3B solid 1rpx;
width: 140rpx;
font-size: 24rpx;
text-align: center;
border-radius: 80rpx;
height: 40rpx;
line-height: 40rpx;
}
.book-list-item {
display: flex;
flex-direction: row;
padding-top: 14rpx;
padding-bottom: 14rpx;
.row {
margin-bottom: 20rpx;
}
.row:last-child {
margin-bottom: 0;
}
.item {
margin-right: 20rpx;
}
.item:last-child {
margin-right: 0;
}
.title {
font-size: 32rpx;
font-weight: 700;
color: #333;
}
.close-button {
border-radius: 10rpx;
border: 2rpx solid #999;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 40rpx;
height: 30rpx;
position: relative;
.cover {
position: absolute;
top: 50%;
left: 50%;
width: 70rpx;
height: 70rpx;
transform: translate(-50%, -50%);
z-index: 2;
background: transparent;
}
}
.desc {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
font-size: 26rpx;
color: #999
}
.label-box {
flex-wrap: wrap;
.label {
padding: 5rpx 10rpx;
font-size: 20rpx;
margin-right: 20rpx;
border-radius: 10rpx;
}
.label-color-1 {
background: #faefe6;
color: #cc6008;
}
.label-color-2 {
color: #3d99fd;
background: #d8ebff;
}
.label-color-3 {
background: #ff8787;
color: #ff3737;
}
}
}
.cover-box {
.cover {
width: 150rpx;
height: 200rpx;
border-radius: 15rpx;
}
}
.title2 {
font-size: 32rpx;
font-weight: 700;
color: #333;
}
.btn2 {
color: #d98c5c;
border: #DCBD3B solid 1rpx;
width: 140rpx;
font-size: 24rpx;
text-align: center;
border-radius: 80rpx;
height: 40rpx;
line-height: 40rpx;
}
</style>
\ No newline at end of file
......@@ -190,9 +190,7 @@
this.$set(this.bookData, "isUnlock", 1);
this.$set(this.bookData, "freeNum", this.bookData.articleChapterList.length);
this.$nextTick(() => {
this.$refs.content.reloadChapterinfoData()
})
this.$refs.content.reloadChapterinfoData()
},
// 文章数据刷新
refreshBookData(bookId) {
......@@ -278,7 +276,7 @@
vipbackClose() {
this.showVip = false;
this.showVipbackPop = false;
if (this.bookData.isUnlock == 0) {
setTimeout(() => {
this.showRecommend = true;
......
......@@ -14,7 +14,7 @@
<view class="html-content" :style="{'background-color':background}">
<view class="loading" v-if="size<1" :style="{'font-size':fontSize+'px'}"> 正在加载中... </view>
<swiper class="center" :current="step" :disable-programmatic-animation='true' :circular='false'
<swiper class="center" :current="step" :disable-programmatic-animation='true' :circular='true'
:indicator-dots="false" :autoplay="false" :interval="3000" :duration="500" @change="handleChange">
<swiper-item v-for="(item,index) in size" :key='index'>
<view class="article" v-if="catalogue<=detail.freeNum"
......@@ -414,7 +414,7 @@
left: 0;
bottom: 0;
box-sizing: border-box;
padding: 0 40rpx;
// padding: 0 40rpx;
.loading {
position: absolute;
......@@ -423,7 +423,7 @@
transform: translate(-50%, -50%);
}
.center {
.center {
height: calc(100% - 66px);
display: flex;
flex-direction: row;
......@@ -431,7 +431,8 @@
position: relative;
overflow-y: hidden;
.article {
.article {
margin: 0 40rpx;
box-sizing: border-box;
font-weight: 400;
font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimSun, sans-serif;
......
......@@ -128,7 +128,9 @@
uni.navigateBack({
delta: 2
});
gotoBookContentPage(item.id, item.shortis);
setTimeout(() => {
gotoBookContentPage(item.id, item.shortis);
}, 1000)
}
}
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment