|
|
@@ -2,14 +2,13 @@
|
|
|
<view class="bookList_content" :style="{width:window_width}">
|
|
|
<view class="top">
|
|
|
<view class='top__info' v-if="!is_edit">
|
|
|
- <view class="" style="margin-left: 20rpx;" @click="clickButtonStatus(config.book_action_status.QUAN_BU)">
|
|
|
- 全部
|
|
|
- </view>
|
|
|
- <view class="" style="margin-left: 20rpx;" @click="clickButtonStatus(config.book_action_status.LIAN_ZAI)">
|
|
|
- 连载
|
|
|
- </view>
|
|
|
- <view class="" style="margin-left: 20rpx;" @click="clickButtonStatus(config.book_action_status.WAN_JIE)">
|
|
|
- 完结
|
|
|
+ <view class="top__info__item" v-for="(item,index) in top_button_list" :key="index"
|
|
|
+ @click="clickButtonStatus(item.status)">
|
|
|
+ <image class="top__info__item__image" v-if="cur_button_status==item.status" src="../../static/imgs/public/img_selected.png"></image>
|
|
|
+ <image class="top__info__item__image" v-else src="../../static/imgs/public/img_unselected.png"></image>
|
|
|
+ <view class="top__info__item__name">
|
|
|
+ {{item.name}}
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view :class="cur_button_status==config.book_action_status.QUAN_BU?'top__edit':'top__edit-none'" @click="clickEdit">
|
|
|
@@ -66,6 +65,11 @@
|
|
|
let is_selected_all = ref(false)
|
|
|
let bottom_tools_real_height = ref(98)
|
|
|
let bottom_tools_all_height = ref(0)
|
|
|
+ let top_button_list = ref(
|
|
|
+ [{'name':'全部','status':config.book_action_status.QUAN_BU},
|
|
|
+ {'name':'连载','status':config.book_action_status.LIAN_ZAI},
|
|
|
+ {'name':'完结','status':config.book_action_status.WAN_JIE}]
|
|
|
+ )
|
|
|
let cur_button_status = ref(config.book_action_status.QUAN_BU)
|
|
|
|
|
|
bottom_tools_all_height.value = bottom_tools_real_height.value + uni.getSystemInfoSync().safeAreaInsets.bottom
|
|
|
@@ -164,11 +168,30 @@
|
|
|
flex-direction: row;
|
|
|
align-items: center;
|
|
|
height: 80rpx;
|
|
|
- background-color: red;
|
|
|
+ // background-color: red;
|
|
|
&__info{
|
|
|
display: flex;
|
|
|
- margin-left: 20rpx;
|
|
|
- // background-color: green;
|
|
|
+ margin-left: 10rpx;
|
|
|
+ &__item {
|
|
|
+ position: relative;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ margin-left: 15rpx;
|
|
|
+ flex-shrink: 0;
|
|
|
+ width: 160rpx;
|
|
|
+ height: 70rpx;
|
|
|
+ // background-color: red;
|
|
|
+ &__image{
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ &__name{
|
|
|
+ position: absolute;
|
|
|
+ font-size: 18px;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
&__edit{
|
|
|
position: absolute;
|
future