lion
abb1cdb952
- 以 TabBar + 三个视图（任务/搜索/设置）替换原有 DashBoard/Side/HentaiSearch 单页结构 - 拆分 TaskView / TaskRow / TaskDetailSheet / SearchView / SettingsView / AuthScreen - 统一 theme.css 视觉规范，补 AppIcon 与缩略图工具 thumbnail.js 及其单测 - 提交弹层默认选中最高可用分辨率，缩略图加载失败走占位 - E站搜索结果与远端抽屉补回「在线看」入口
72 lines
2.5 KiB
Vue
72 lines
2.5 KiB
Vue
<script setup>
|
|
import {computed, onBeforeUnmount, onMounted} from "vue";
|
|
import store from "./store/index.js";
|
|
import TaskView from "./components/TaskView.vue";
|
|
import SearchView from "./components/SearchView.vue";
|
|
import SettingsView from "./components/SettingsView.vue";
|
|
import TabBar from "./components/TabBar.vue";
|
|
import AuthScreen from "./components/AuthScreen.vue";
|
|
import TaskDetailSheet from "./components/TaskDetailSheet.vue";
|
|
import OnlineReader from "./components/OnlineReader.vue";
|
|
|
|
const activeTab = computed(() => store.state.activeTab);
|
|
|
|
function isSystemDark() {
|
|
return window.matchMedia("(prefers-color-scheme: dark)").matches;
|
|
}
|
|
|
|
// Theme is a single class on <html>; colours come from the CSS variables.
|
|
function adjustForStyle() {
|
|
const stored = localStorage.getItem("darkConfig");
|
|
if (stored !== null) {
|
|
const darkConfig = JSON.parse(stored);
|
|
document.documentElement.classList.toggle("dark", Boolean(darkConfig.followSystem) && isSystemDark());
|
|
} else {
|
|
document.documentElement.classList.remove("dark");
|
|
}
|
|
}
|
|
|
|
const resumeProgress = () => {
|
|
if (store.state.isAuth && document.visibilityState === "visible") store.dispatch("initWebsocket");
|
|
};
|
|
const pauseProgress = () => store.dispatch("disconnectWebsocket");
|
|
|
|
onMounted(() => {
|
|
adjustForStyle();
|
|
store.state.lengthPerPage = Number(localStorage.getItem("lengthPerPage")) || 30;
|
|
store.commit("_setCategory", localStorage.getItem("category") ?? "myDownload");
|
|
store.commit("_setSortType", localStorage.getItem("sortType") ?? "createTime");
|
|
store.commit("_setGalleryNameType", localStorage.getItem("galleryNameType") ?? "shortName");
|
|
|
|
const auth = localStorage.getItem("auth");
|
|
if (auth !== null) store.dispatch("validate", auth);
|
|
|
|
window.addEventListener("online", resumeProgress);
|
|
window.addEventListener("pageshow", resumeProgress);
|
|
window.addEventListener("pagehide", pauseProgress);
|
|
document.addEventListener("visibilitychange", resumeProgress);
|
|
});
|
|
|
|
onBeforeUnmount(() => {
|
|
window.removeEventListener("online", resumeProgress);
|
|
window.removeEventListener("pageshow", resumeProgress);
|
|
window.removeEventListener("pagehide", pauseProgress);
|
|
document.removeEventListener("visibilitychange", resumeProgress);
|
|
pauseProgress();
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div class="app">
|
|
<main class="app-views">
|
|
<TaskView v-show="activeTab === 'tasks'"/>
|
|
<SearchView v-show="activeTab === 'search'"/>
|
|
<SettingsView v-show="activeTab === 'settings'"/>
|
|
</main>
|
|
<TabBar/>
|
|
<TaskDetailSheet/>
|
|
<OnlineReader/>
|
|
<AuthScreen/>
|
|
</div>
|
|
</template>
|