Commit 1ab1282c authored by jyx's avatar jyx

代码优化

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