web loading遮罩透明

This commit is contained in:
Xwite 2023-04-08 12:17:13 +08:00
parent 367d7f9c24
commit 571fa3a32d
4 changed files with 22 additions and 28 deletions

View File

@ -1 +1 @@
VITE_API=http://192.168.10.5:1122
VITE_API=http://192.168.10.11:1122

View File

@ -13,22 +13,22 @@
"@element-plus/icons-vue": "^2.1.0",
"@vueuse/shared": "^9.13.0",
"axios": "^1.3.5",
"element-plus": "^2.3.1",
"pinia": "^2.0.33",
"element-plus": "^2.3.3",
"hotkeys-js": "^3.10.2",
"pinia": "^2.0.34",
"vue": "^3.2.47",
"vue-router": "^4.1.6",
"hotkeys-js": "^3.10.1"
"vue-router": "^4.1.6"
},
"devDependencies": {
"@vitejs/plugin-vue": "^4.1.0",
"eslint": "^8.37.0",
"eslint": "^8.38.0",
"eslint-config-prettier": "^8.8.0",
"eslint-plugin-prettier": "^4.2.1",
"eslint-plugin-vue": "^9.10.0",
"prettier": "^2.8.7",
"sass": "^1.60.0",
"sass": "^1.61.0",
"unplugin-auto-import": "^0.15.2",
"unplugin-icons": "^0.16.0",
"unplugin-icons": "^0.16.1",
"unplugin-vue-components": "^0.24.1",
"vite": "^4.2.1"
}

View File

@ -82,10 +82,10 @@
<div class="content">
<div class="top-bar" ref="top"></div>
<div v-for="data in chapterData" :key="data.index" ref="chapter">
<div class="title" :index="data.index">
<div class="title" :index="data.index" v-if="show">
{{ data.title }}
</div>
<chapter-content :carray="data.content" />
<chapter-content :carray="data.content" v-if="show"/>
</div>
<div class="loading" ref="loading"></div>
<div class="bottom-bar" ref="bottom"></div>
@ -102,13 +102,14 @@ import loadingSvg from "@element-plus/icons-svg/loading.svg?raw";
const showLoading = ref(false);
const loadingSerive = ref(null);
const content = ref();
watch(showLoading, (loading) => {
if (!loading) return loadingSerive.value?.close();
if (!loading) return loadingSerive.value?.close();
loadingSerive.value = ElLoading.service({
target: content.value,
spinner: loadingSvg,
text: "正在获取信息",
backgroud: "rgb(0,0,0,0)",
lock: true,
});
});
@ -121,7 +122,6 @@ try {
} catch {
localStorage.removeItem("config");
}
const content = ref();
const loading = ref();
const noPoint = ref(true);
@ -141,10 +141,10 @@ const {
popCataVisible,
readSettingsVisible,
config,
showContent: show,
miniInterface,
miniInterface
} = storeToRefs(store);
const show = computed(()=>store.showContent)
const theme = computed(() => config.value.theme);
const bodyColor = computed(() => settings.themes[config.value.theme].body);
@ -212,8 +212,7 @@ watchEffect(() => {
});
watchEffect(() => {
document.title = catalog.value[chapterIndex.value]?.title;
console.log(chapterIndex.value, store.readingBook.index);
document.title = catalog.value[chapterIndex.value]?.title || document.title;
store.saveBookProcess();
});
const isNight = ref(false);
@ -652,15 +651,6 @@ onUnmounted(() => {
}
}
.chapter-bar {
.el-breadcrumb {
.item {
font-size: 14px;
color: #606266;
}
}
}
.chapter {
font-family: "Microsoft YaHei", PingFangSC-Regular, HelveticaNeue-Light,
"Helvetica Neue Light", sans-serif;
@ -670,6 +660,9 @@ onUnmounted(() => {
width: 670px;
margin: 0 auto;
:deep(.el-loading-mask) {
background-color: rgba(0, 0, 0, 0);
}
:deep(.el-loading-spinner) {
font-size: 36px;
color: #b5b5b5;

View File

@ -101,7 +101,6 @@ watch(showLoading, (loading) => {
target: shelfWrapper.value,
spinner: loadingSvg,
text: "正在获取书籍信息",
backgroud: "rgb(247,247,247)",
lock: true,
});
});
@ -326,7 +325,9 @@ const fetchBookShelfData = () => {
width: 100%;
display: flex;
flex-direction: column;
:deep(.el-loading-mask) {
background-color: rgba(0, 0, 0, 0);
}
:deep(.el-loading-spinner) {
font-size: 36px;
color: #b5b5b5;