633 lines
19 KiB
Vue
633 lines
19 KiB
Vue
<template>
|
|
<u-navbar :title="navbarTitle" @rightClick="rightClick" :autoBack="true" :fixed="true" :bgColor="mainBodyBg"
|
|
:titleStyle="{'color':navigationBarTitleTextColor,}" :leftIconColor="navigationBarTitleTextBackColor"
|
|
:shadow="true" :safeAreaInsetTop="true" :placeholder="true">
|
|
</u-navbar>
|
|
<view class="novelReading_content">
|
|
<!-- :refresher-complete-scrollable="true" -->
|
|
<!-- <z-paging ref="paging" @onRefresh="onRefresh"
|
|
:style="`background:${bodyReadingBg};height:${bodyReadingHeight}px;`"
|
|
v-model="novelReadingContentText" @scrolltolower="scrolltolower" > -->
|
|
|
|
<!-- 页面内容 -->
|
|
<!-- :style="`height:${bodyReadingHeight}px;`" -->
|
|
<!-- <view class="novelReading_body" @tap="handelShowStepUp">
|
|
<view class="novelReading_main">
|
|
<view class="novelReading_characters_main"
|
|
:style="`color:${novelContentColor};font-size:${newCharactersSize}rpx;line-height:${defaultCharactersLineHeight}`"
|
|
v-for="m in novelReadingContentText" :key="m.id" :id="`richText_${m.id}`">
|
|
<rich-text :nodes="m.content" :ref="`richText_${m.id}`"></rich-text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</z-paging> -->
|
|
<u-popup :show="tabBarPopupShow" mode="bottom" :overlay="false" zIndex="6">
|
|
<view class="my_tabBar_Reading" :style="`background:${bodyReadingBg}`">
|
|
<view class="tabBar_Reading_item">
|
|
<view class="reading_item_icon" @tap="handelDirectoryPopup">
|
|
<image class="is_images" :src="barPopupIcon[novelMainTypeColor].directory_icon"></image>
|
|
</view>
|
|
<view class="reading_item_name" :style="`color:${tabBarTextColor}`">目录</view>
|
|
</view>
|
|
<view class="tabBar_Reading_item">
|
|
<view class="reading_item_icon">
|
|
<image class="is_images" :src="barPopupIcon[novelMainTypeColor].bookshelf_icon"></image>
|
|
</view>
|
|
<view class="reading_item_name" :style="`color:${tabBarTextColor}`">书城</view>
|
|
</view>
|
|
<view class="tabBar_Reading_item" @tap="handelSteUpPopup">
|
|
<view class="reading_item_icon">
|
|
<image class="is_images" :src="barPopupIcon[novelMainTypeColor].step_up_icon"></image>
|
|
</view>
|
|
<view class="reading_item_name" :style="`color:${tabBarTextColor}`">设置</view>
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
<u-popup :show="readingPopupshow" mode="bottom" :overlay="false" zIndex="4" bgColor="transparent">
|
|
<view class="reading_schedule_box" :style="`background:${bodyReadingBg}`">
|
|
<view style="height:140rpx" />
|
|
</view>
|
|
</u-popup>
|
|
<u-popup :show="stepUpPopupShow" mode="bottom" :overlay="false" bgColor="transparent" zIndex="5">
|
|
<view class="step_up_box" :style="`background:${bodyReadingBg}`">
|
|
<view class="step_up_box_body">
|
|
<view class="step_up_item">
|
|
<view class="step_up_item_name" :style="`color:${dialogTextColor}`">
|
|
背景
|
|
</view>
|
|
<view :class="[`step_up_item_bg`,novelMainTypeColor == 'F3EFE9' ? 'activeBlack' :'']"
|
|
style="background:#F3EFE9 ;" @tap="changNovelMainType('F3EFE9')"></view>
|
|
<view :class="[`step_up_item_bg`,novelMainTypeColor == 'CCD9E2' ? 'activeBlack' :'']"
|
|
style="background:#CCD9E2 ;" @tap="changNovelMainType('CCD9E2')"></view>
|
|
<view :class="[`step_up_item_bg`,novelMainTypeColor == '333333' ? 'activeWhite' :'']"
|
|
@tap="changNovelMainType('333333')">
|
|
<image class="is_images" :src="setUpModeBlack" />
|
|
</view>
|
|
</view>
|
|
<view class="step_up_item mt40rpx">
|
|
<view class="step_up_item_name" :style="`color:${dialogTextColor}`">
|
|
字号
|
|
</view>
|
|
<view class="step_up_item_text_bg"
|
|
:style="`color:${dialogTextColor};background:${dialogATextBg}`" @tap="reduceCharactersSize">
|
|
A-</view>
|
|
<view class="step_up_item_text_bg"
|
|
:style="`color:${dialogTextColor};background:${dialogATextBg}`" @tap="addCharactersSize">A+
|
|
</view>
|
|
<view class="step_up_item_text_bg"
|
|
:style="`color:${dialogTextColor};background:${dialogATextBg}`" @tap="handelCharactersSize">
|
|
默认</view>
|
|
</view>
|
|
</view>
|
|
<view style="height:140rpx" />
|
|
</view>
|
|
</u-popup>
|
|
<u-popup :show="directoryPopupShow" @close="directoryPopupClose" mode="right" :safeAreaInsetTop="true">
|
|
<view class="directory_popup_box">
|
|
<scroll-view scroll-y="true" @scrolltoupper="directoryPopupUpper" @scrolltolower="directoryPopupLower"
|
|
:style="`height:${directoryPopupHeight}px`" :show-scrollbar="false">
|
|
<view class="_popup_box_item" v-for="m in myData" :key="m.id">
|
|
<view :class="['_item_name', readDirectoryActive == m.id? 'active':''] ">
|
|
{{m.sub}}
|
|
</view>
|
|
<view v-if="m.isvip" class="_item_chapter_lock">
|
|
<image class="is_images" src="/static/images/chapter_lock.png"></image>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
</u-popup>
|
|
</view>
|
|
<!--
|
|
<rich-text id="compute_rich_text" :nodes="computeRichText"
|
|
:style="`color:${novelContentColor};font-size:${newCharactersSize}rpx;line-height:${defaultCharactersLineHeight}`"></rich-text>
|
|
|
|
</view> -->
|
|
</template>
|
|
|
|
<script>
|
|
import setUpReadingColorAll from './setUpReadingColorAll.js';
|
|
import bookshelf_333 from '/static/images/novelReading/bookshelf_333.png';
|
|
import directory_333 from '/static/images/novelReading/directory_333.png';
|
|
import step_up_333 from '/static/images/novelReading/step_up_333.png';
|
|
import bookshelf_ccd9e2 from '/static/images/novelReading/bookshelf_ccd9e2.png';
|
|
import step_up_ccd9e2 from '/static/images/novelReading/step_up_ccd9e2.png';
|
|
import directory_ccd9e2 from '/static/images/novelReading/directory_ccd9e2.png';
|
|
import bookshelf_f3efe from '/static/images/novelReading/bookshelf_f3efe.png';
|
|
import directory_f3efe9 from '/static/images/novelReading/directory_f3efe9.png';
|
|
import step_up_f3efe from '/static/images/novelReading/step_up_f3efe.png';
|
|
import set_up_mode_black from '/static/images/novelReading/set_up_mode_black.png';
|
|
import {
|
|
isGetSystemInfo
|
|
} from '@/utils/systemInfo.js';
|
|
import {
|
|
myGetStorage,
|
|
mySetStorage
|
|
} from '@/utils/storage/index.js';
|
|
import myData from './data.js'
|
|
export default {
|
|
data() {
|
|
return {
|
|
novelMainTypeColor: '',
|
|
navbarTitle: '小说阅读页面',
|
|
setUpColorAll: {},
|
|
navigationBarTitleTextColor: '',
|
|
mainBodyBg: '',
|
|
navigationBarTitleTextBackColor: '',
|
|
bodyReadingHeight: 0,
|
|
scrollReadingHeight: 0,
|
|
// 内容背景
|
|
bodyReadingBg: '',
|
|
// 底部安全区
|
|
bottomSecureHeight: 0,
|
|
tabBarPopupShow: false,
|
|
readingPopupshow: false,
|
|
stepUpPopupShow: false,
|
|
directoryPopupShow: false,
|
|
// bar 的icon
|
|
barPopupIcon: {},
|
|
dialogTextColor: '',
|
|
progressBg: '',
|
|
progressActiveBg: '',
|
|
setUpModeBlack: '',
|
|
dialogATextBg: '',
|
|
novelContentColor: '',
|
|
// 目录信息
|
|
booksDirectorySid: '2387',
|
|
booksDirectoryPage: 1,
|
|
newBooksDirectoryPage: [],
|
|
directoryList: [],
|
|
directoryPopupHeight: 0,
|
|
// 小说信息
|
|
novelReadingContentText: [],
|
|
defaultCharactersSize: 46,
|
|
newCharactersSize: 46,
|
|
defaultCharactersLineHeight: 2,
|
|
readDirectoryActive: '',
|
|
myData: [],
|
|
novelSwiperCurrent: 0,
|
|
computeRichText: '',
|
|
isScrollTop: 0
|
|
}
|
|
},
|
|
onLoad() {
|
|
|
|
},
|
|
onShow() {
|
|
const booksDirectorySid = this.booksDirectorySid;
|
|
const booksDirectoryPage = this.booksDirectoryPage;
|
|
const newBooksDirectoryPage = [...this.newBooksDirectoryPage, booksDirectoryPage];
|
|
this.newBooksDirectoryPage = newBooksDirectoryPage;
|
|
this.isGetDirectory(booksDirectorySid, booksDirectoryPage);
|
|
this.isGetUserRead()
|
|
},
|
|
methods: {
|
|
isGetUserRead() {
|
|
this.readDirectoryActive = '1';
|
|
this.isGetBookInfo()
|
|
},
|
|
isGetBookInfo() {
|
|
const readDirectoryActive = this.readDirectoryActive;
|
|
const bodyReadingHeight = this.bodyReadingHeight;
|
|
const novelReadingContentText = this.myData[readDirectoryActive];
|
|
// this.computeRichText = novelReadingContentText.content
|
|
this.$nextTick(() => {
|
|
this.$refs.paging.complete([novelReadingContentText]);
|
|
})
|
|
|
|
// const query = uni.createSelectorQuery().in(this);
|
|
// this.$nextTick(() => {
|
|
// query.select(`#compute_rich_text`).boundingClientRect(data => {
|
|
// console.log(data.height / bodyReadingHeight, "============")
|
|
// const swiperItemHeightObj = [{
|
|
// ...novelReadingContentText,
|
|
// swiperItemHeight: data.height,
|
|
// swiperItemPage: parseInt(data.height / bodyReadingHeight)
|
|
// }]
|
|
// this.novelReadingContentText = [...this.novelReadingContentText, ...
|
|
// swiperItemHeightObj
|
|
// ];
|
|
// console.log(this.novelReadingContentText, "=========")
|
|
// }).exec()
|
|
// })
|
|
//
|
|
// this.novelReadingContentText = [novelReadingContentText];
|
|
// this.$nextTick(() => {query.select(`.novelReading_main #richText_${readDirectoryActive}`).boundingClientRect(
|
|
// this.$nextTick(() => {
|
|
// query.select(`#compute_rich_text`).boundingClientRect(
|
|
// data => {
|
|
// // const swiperItemHeightObj = {
|
|
// // ...this.swiperItemHeightObj,
|
|
// // id: readDirectoryActive,
|
|
// // swiperItemHeight: data.height,
|
|
// // swiperItemPage: data.height / bodyReadingHeight
|
|
// // }
|
|
// // this.swiperItemHeightObj = {
|
|
// // ...swiperItemHeightObj
|
|
// // };
|
|
// console.log(data.height, "==========")
|
|
// setTimeout(() => {
|
|
// this.isScrollTop = parseInt(data.height) - 8632;
|
|
// // this.isScrollTop = 0;
|
|
// this.novelReadingContentText = [this.myData[0], ...this
|
|
// .novelReadingContentText
|
|
// ];
|
|
// }, 2000)
|
|
// }).exec()
|
|
// })
|
|
// setTimeout(() => {
|
|
// this.novelReadingContentText = [this.myData[0], ...this.novelReadingContentText];
|
|
// }, 1000)
|
|
},
|
|
onRefresh() {
|
|
console.log("refresherTouchendrefresherTouchend")
|
|
this.$refs.paging.complete([this.myData[0]]);
|
|
// setTimeout(() => {
|
|
// this.novelReadingContentText = [this.myData[0], ...this.novelReadingContentText];
|
|
// }, 1000)
|
|
},
|
|
// scrolltolower() {
|
|
// console.log("666666666")
|
|
// this.$refs.paging.complete([this.myData[2]]);
|
|
// },
|
|
// charactersUpper() {
|
|
// console.log("ooooooooooooooo")
|
|
// },
|
|
handelShowStepUp() {
|
|
this.tabBarPopupShow = !this.tabBarPopupShow;
|
|
this.readingPopupshow = !this.readingPopupshow;
|
|
this.stepUpPopupShow = false;
|
|
},
|
|
handelDirectoryPopup() {
|
|
this.directoryPopupShow = true;
|
|
},
|
|
directoryPopupClose() {
|
|
this.directoryPopupShow = false;
|
|
},
|
|
handelSteUpPopup() {
|
|
this.stepUpPopupShow = true;
|
|
},
|
|
tabBarPopupClose() {
|
|
this.tabBarPopupShow = false;
|
|
},
|
|
changNovelMainType(type) {
|
|
this.novelMainTypeColor = type;
|
|
this.initPage(type);
|
|
mySetStorage('novelMainTypeColor', type);
|
|
},
|
|
reduceCharactersSize() {
|
|
const newCharactersSize = this.newCharactersSize;
|
|
this.newCharactersSize = newCharactersSize - 2;
|
|
},
|
|
addCharactersSize() {
|
|
const newCharactersSize = this.newCharactersSize;
|
|
this.newCharactersSize = newCharactersSize + 2;
|
|
},
|
|
handelCharactersSize() {
|
|
const defaultCharactersSize = this.defaultCharactersSize;
|
|
this.newCharactersSize = defaultCharactersSize;
|
|
},
|
|
// 目录划到了最上边
|
|
directoryPopupUpper() {
|
|
const isBooksDirectoryPage = this.booksDirectoryPage;
|
|
const newBooksDirectoryPage = this.newBooksDirectoryPage;
|
|
if (isBooksDirectoryPage > 1 && newBooksDirectoryPage.indexOf(isBooksDirectoryPage) == -1) {
|
|
const booksDirectorySid = this.booksDirectorySid;
|
|
const booksDirectoryPage = isBooksDirectoryPage - 1;
|
|
this.booksDirectoryPage = booksDirectoryPage
|
|
this.isGetDirectory(booksDirectorySid, booksDirectoryPage, 'upper')
|
|
}
|
|
},
|
|
// 目录划到了最下边
|
|
directoryPopupLower() {
|
|
const isBooksDirectoryPage = this.booksDirectoryPage
|
|
const booksDirectorySid = this.booksDirectorySid;
|
|
const booksDirectoryPage = isBooksDirectoryPage + 1;
|
|
const newBooksDirectoryPage = [...this.newBooksDirectoryPage, booksDirectoryPage]
|
|
this.newBooksDirectoryPage = newBooksDirectoryPage;
|
|
this.booksDirectoryPage = booksDirectoryPage
|
|
this.isGetDirectory(booksDirectorySid, booksDirectoryPage, 'lower')
|
|
},
|
|
isGetDirectory(sid, page, type) {
|
|
uni.showLoading({
|
|
title: '加载中...'
|
|
});
|
|
const data = {
|
|
sid,
|
|
page,
|
|
// startOrder,
|
|
}
|
|
uni.$u.http.post('/getDirectory', data).then((res) => {
|
|
uni.hideLoading();
|
|
if (res.status == 1) {
|
|
const directory = res.data.directory;
|
|
// const stage = res.data.stage;
|
|
// const directoryCount = res.data.directory_count;
|
|
let columnsLabel = ''
|
|
if (type == 'upper') {
|
|
this.directoryList = [...directory, ...this.directoryList];
|
|
} else if (type == 'lower') {
|
|
this.directoryList = [...this.directoryList, ...directory];
|
|
} else {
|
|
this.directoryList = directory;
|
|
}
|
|
}
|
|
}).catch((err) => {
|
|
uni.hideLoading();
|
|
console.log(err, "========")
|
|
})
|
|
},
|
|
initPage(novelMainTypeColor) {
|
|
const mainBodyBg = setUpReadingColorAll[novelMainTypeColor].mainBodyBg;
|
|
this.navigationBarTitleTextColor = setUpReadingColorAll[novelMainTypeColor].navigationBarTitleTextColor;
|
|
this.mainBodyBg = mainBodyBg;
|
|
this.bodyReadingBg = mainBodyBg;
|
|
this.dialogTextColor = setUpReadingColorAll[novelMainTypeColor].dialogTextColor;
|
|
this.progressBg = setUpReadingColorAll[novelMainTypeColor].progressBg;
|
|
this.progressActiveBg = setUpReadingColorAll[novelMainTypeColor].progressActiveBg;
|
|
this.setUpModeBlack = set_up_mode_black;
|
|
this.dialogATextBg = setUpReadingColorAll[novelMainTypeColor].dialogATextBg;
|
|
this.tabBarTextColor = setUpReadingColorAll[novelMainTypeColor].tabBarTextColor;
|
|
this.novelContentColor = setUpReadingColorAll[novelMainTypeColor].novelContentColor;
|
|
this.navigationBarTitleTextBackColor = setUpReadingColorAll[novelMainTypeColor]
|
|
.navigationBarTitleTextBackColor;
|
|
},
|
|
rightClick() {
|
|
uni.navigateBack()
|
|
},
|
|
},
|
|
created() {
|
|
const novelMainTypeColor = myGetStorage('novelMainTypeColor') || 'F3EFE9';
|
|
const {
|
|
screenHeight = 0, statusBarHeight = 0, windowHeight = 0,
|
|
devicePixelRatio, windowBottom
|
|
} = isGetSystemInfo();
|
|
console.log(isGetSystemInfo(), "-----------");
|
|
console.log(myData, "myDatamyData")
|
|
this.myData = myData;
|
|
this.novelMainTypeColor = novelMainTypeColor;
|
|
this.bodyReadingHeight = screenHeight - statusBarHeight - devicePixelRatio * 22;
|
|
this.scrollReadingHeight = screenHeight - statusBarHeight - devicePixelRatio * 38;
|
|
// #ifdef APP-PLUS
|
|
this.directoryPopupHeight = screenHeight - statusBarHeight;
|
|
// #endif
|
|
// #ifdef H5 || MP-WEIXIN
|
|
this.directoryPopupHeight = screenHeight - statusBarHeight - devicePixelRatio * 22;
|
|
// #endif
|
|
|
|
this.bottomSecureHeight = screenHeight - windowHeight;
|
|
this.setUpColorAll = setUpReadingColorAll;
|
|
this.barPopupIcon = {
|
|
'F3EFE9': {
|
|
bookshelf_icon: bookshelf_f3efe,
|
|
directory_icon: directory_f3efe9,
|
|
step_up_icon: step_up_f3efe,
|
|
},
|
|
'CCD9E2': {
|
|
bookshelf_icon: bookshelf_ccd9e2,
|
|
directory_icon: directory_ccd9e2,
|
|
step_up_icon: step_up_ccd9e2,
|
|
},
|
|
'333333': {
|
|
bookshelf_icon: bookshelf_333,
|
|
directory_icon: directory_333,
|
|
step_up_icon: step_up_333
|
|
}
|
|
}
|
|
this.initPage(novelMainTypeColor);
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
page {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.is_images {
|
|
display: block;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.mt40rpx {
|
|
margin-top: 40rpx;
|
|
}
|
|
|
|
::v-deep.u-navbar__content__title {
|
|
font-size: 30rpx;
|
|
}
|
|
|
|
::v-deep.u-navbar--fixed {
|
|
box-shadow: 0 0 8rpx rgba(0, 0, 0, 0.2);
|
|
}
|
|
|
|
.novelReading_content::v-deep.z-paging-content {
|
|
position: relative;
|
|
}
|
|
|
|
#compute_rich_text {
|
|
position: fixed;
|
|
top: 1500px;
|
|
}
|
|
|
|
.novelReading_content {
|
|
// display: flex;
|
|
// flex-direction: column;
|
|
width: 100%;
|
|
// height: 100%;
|
|
// overflow: hidden;
|
|
position: relative;
|
|
|
|
.novelReading_body {
|
|
width: 100%;
|
|
|
|
// height: 100%;
|
|
|
|
|
|
.novelReading_main_swiper {
|
|
width: 100%;
|
|
height: 100%;
|
|
|
|
.swiper_item_con {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.novelReading_main {
|
|
width: 100%;
|
|
padding: 32rpx 32rpx;
|
|
box-sizing: border-box;
|
|
position: relative;
|
|
|
|
.novelReading_characters_scroll {
|
|
width: 100%;
|
|
// padding: 32rpx 32rpx;
|
|
// box-sizing: border-box;
|
|
|
|
.novelReading_characters_main {
|
|
width: 100%;
|
|
// height: 100%;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.my_tabBar_Reading {
|
|
width: 100%;
|
|
height: 140rpx;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
padding: 0 24rpx;
|
|
box-sizing: border-box;
|
|
border-top: 1rpx solid #d6d2ce;
|
|
|
|
.tabBar_Reading_item {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
|
|
|
|
.reading_item_icon {
|
|
width: 34rpx;
|
|
height: 34rpx;
|
|
}
|
|
|
|
.reading_item_name {
|
|
font-size: 30rpx;
|
|
line-height: 1;
|
|
margin-top: 10rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.reading_schedule_box {
|
|
width: 100%;
|
|
box-shadow: 0 0 8rpx rgba(0, 0, 0, 0.2);
|
|
border-radius: 40rpx;
|
|
|
|
.reading_schedule_body {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
width: 100%;
|
|
padding: 40rpx 24rpx;
|
|
box-sizing: border-box;
|
|
background: transparent;
|
|
|
|
.schedule_body_text {
|
|
font-size: 34rpx;
|
|
line-height: 1;
|
|
}
|
|
|
|
.reading_schedule_slider {
|
|
width: 430rpx;
|
|
// height: 60rpx;
|
|
|
|
.slider {
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.step_up_box {
|
|
width: 100%;
|
|
box-shadow: 0 0 8rpx rgba(0, 0, 0, 0.2);
|
|
border-radius: 40rpx;
|
|
|
|
.step_up_box_body {
|
|
width: 100%;
|
|
padding: 40rpx 24rpx;
|
|
box-sizing: border-box;
|
|
background: transparent;
|
|
|
|
.step_up_item {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
|
|
.step_up_item_name {
|
|
line-height: 1;
|
|
font-size: 30rpx;
|
|
}
|
|
|
|
.step_up_item_bg {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 188rpx;
|
|
height: 74rpx;
|
|
border-radius: 37rpx;
|
|
box-sizing: border-box;
|
|
border: 2rpx solid transparent;
|
|
}
|
|
|
|
.step_up_item_text_bg {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 188rpx;
|
|
height: 74rpx;
|
|
border-radius: 37rpx;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.step_up_item_bg.activeBlack {
|
|
border-color: #1A1A1A;
|
|
}
|
|
|
|
.step_up_item_bg.activeWhite {
|
|
border-color: #fff;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.reading_schedule_slider::v-deep.uni-slider-handle-wrapper {
|
|
height: 60rpx;
|
|
border-radius: 30rpx;
|
|
|
|
.uni-slider-track {
|
|
border-radius: 30rpx;
|
|
}
|
|
}
|
|
|
|
.directory_popup_box {
|
|
display: flex;
|
|
align-items: flex-end;
|
|
width: 560rpx;
|
|
height: 100%;
|
|
padding: 32rpx;
|
|
box-sizing: border-box;
|
|
|
|
._popup_box_item {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
width: 100%;
|
|
height: 120rpx;
|
|
border-bottom: 1rpx solid #F2F2F2;
|
|
|
|
._item_name {
|
|
font-size: 32rpx;
|
|
color: #333333;
|
|
line-height: 1;
|
|
}
|
|
|
|
._item_name.active {
|
|
color: #FF728F;
|
|
}
|
|
|
|
._item_chapter_lock {
|
|
width: 32rpx;
|
|
height: 32rpx;
|
|
}
|
|
}
|
|
}
|
|
</style> |