web端优化数据加载

modules/web/.prettierignore

@@ -0,0 +1,3 @@
+# d.ts files Generated by unplugin-auto unplugin-vue-components
+auto-imports.d.ts
+components.d.ts

modules/web/src/api/index.ts

@@ -1,16 +1,12 @@
 import type { AxiosResponse } from 'axios'
 import type { LeagdoApiResponse } from './api'
-import API, {
-  setWebsocketOnError,
-  legado_http_entry_point,
-  legado_webSocket_entry_point,
-  setApiEntryPoint,
-} from './api'
+import API, { setWebsocketOnError, setApiEntryPoint } from './api'
 import ajax from './axios'
 import { validatorHttpUrl } from '@/utils/utils'
 
 const LeagdoApiResponseKeys: string[] = Array.of('isSuccess', 'errorMsg')
 
+const notification = ElMessage
 /** Axios.Interceptor: check if resp is LeagaoLeagdoApiResponse*/
 const responseCheckInterceptor = (resp: AxiosResponse) => {
   let isLeagdoApiResponse = true
@@ -26,21 +22,23 @@ const responseCheckInterceptor = (resp: AxiosResponse) => {
     if ((data as LeagdoApiResponse<unknown>).isSuccess === true) {
       if (!('data' in data)) {
         isLeagdoApiResponse = false
-        LeagdoApiResponseKeys.length = 0
       }
     }
   } catch {
     isLeagdoApiResponse = false
   }
   if (isLeagdoApiResponse === false) {
-    ElNotification.warning('后端返回内容格式错误')
+    notification.warning({ message: '后端返回内容格式错误', grouping: true })
     throw new Error()
   }
   return resp
 }
 
 const axiosErrorInterceptor = (err: unknown) => {
-  ElNotification.error('后端连接失败，请检查阅读WEB服务或者设置其它可用链接')
+  notification.error({
+    message: '后端连接失败，请检查阅读WEB服务或者设置其它可用链接',
+    grouping: true,
+  })
   throw err
 }
 // http全局
@@ -80,8 +78,8 @@ export const parseLeagdoHttpUrlWithDefault = (
 
   console.info('legado_api_config:')
   console.table({
-    'http API入口': legado_http_entry_point,
-    'webSocket API入口': legado_webSocket_entry_point,
+    'http API入口': http_entry_point,
+    'webSocket API入口': webSocket_entry_point,
   })
   return [http_entry_point, webSocket_entry_point]
 }

modules/web/src/auto-imports.d.ts

@@ -9,7 +9,6 @@ declare global {
   const EffectScope: typeof import('vue')['EffectScope']
   const ElMessage: typeof import('element-plus/es')['ElMessage']
   const ElMessageBox: typeof import('element-plus/es')['ElMessageBox']
-  const ElNotification: typeof import('element-plus/es')['ElNotification']
   const acceptHMRUpdate: typeof import('pinia')['acceptHMRUpdate']
   const computed: typeof import('vue')['computed']
   const createApp: typeof import('vue')['createApp']

modules/web/src/components/BookItems.vue

@@ -76,7 +76,7 @@ const subJustify = computed(() =>
 )
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 .books-wrapper {
   overflow: auto;
 

modules/web/src/components/CatalogItem.vue

@@ -33,7 +33,7 @@ const catas = computed(() => {
 })
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 .selected {
   color: #eb4259;
 }

modules/web/src/components/ChapterContent.vue

@@ -26,6 +26,7 @@ import type { webReadConfig } from '@/web'
 const store = useBookStore()
 const readWidth = computed(() => store.config.readWidth)
 const bookUrl = computed(() => store.readingBook.bookUrl)
+
 const props = defineProps<{
   chapterIndex: number
   contents: Array<string>
@@ -116,7 +117,7 @@ onUnmounted(() => {
 })
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 .title {
   margin-bottom: 57px;
   font:

modules/web/src/components/PopCatalog.vue

@@ -92,7 +92,7 @@ const gotoChapter = (chapter: BookChapter) => {
 }
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 .cata-wrapper {
   margin: -16px;
   padding: 18px 0 24px 25px;

modules/web/src/components/ReadSettings.vue

@@ -356,7 +356,7 @@ const setInfiniteLoading = (loading: boolean) => {
 }
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 :deep(.iconfont) {
   font-family: iconfont;
   font-style: normal;

modules/web/src/components/SourceDebug.vue

@@ -60,7 +60,7 @@ const isBookSource = computed(() => {
 })
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 :deep(#debug-text) {
   height: calc(100vh - 45px - 36px - 5px);
 }

modules/web/src/components/SourceHelp.vue

@@ -53,7 +53,7 @@ import { Link } from '@element-plus/icons-vue'
   </div>
 </template>
 
-<style scoped>
+<style lang="scss" scoped>
 .el-link {
   padding: 4px;
 }

modules/web/src/components/SourceItem.vue

@@ -36,7 +36,7 @@ const isSaveError = computed(() => {
   return !map.has(sourceUrl.value)
 })
 </script>
-<style scoped>
+<style lang="scss" scoped>
 :deep(.el-checkbox__label) {
   flex: 1;
   display: flex;

modules/web/src/components/SourceJson.vue

@@ -34,7 +34,7 @@ watchEffect(async () => {
   }
 })
 </script>
-<style scoped>
+<style lang="scss" scoped>
 :deep(.el-input) {
   width: 100%;
 }

modules/web/src/components/SourceList.vue

@@ -143,7 +143,7 @@ const outExport = () => {
 }
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 .tool {
   display: flex;
   margin: 4px 0;

modules/web/src/components/ToolBar.vue

@@ -309,7 +309,7 @@ onMounted(() => {
 })
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 .flex-space-between {
   display: flex;
   justify-content: space-between;

modules/web/src/config/sourceConfig.d.ts

@@ -2,11 +2,6 @@ import type { Source } from '@/source'
 import bookSourceEditConfig from './bookSourceEditConfig'
 import rssSourceEditConfig from './rssSourceEditConfig'
 
-type PickAnyValueKey<T> = {
-  [K in keyof T]: T[K] extends { [prop: string]: string } ? K : never
-}
-type b = keyof PickAnyValueKey<BookSoure>
-
 type SourceConfigKey =
   | keyof typeof bookSourceEditConfig
   | keyof typeof rssSourceEditConfig

modules/web/src/router/bookRouter.ts

@@ -19,4 +19,18 @@ const router = createRouter({
   routes: bookRoutes,
 })
 
+import { createApp } from 'vue'
+import App from '@/App.vue'
+import store, { useBookStore } from '@/store'
+
+//  init pinia instance
+createApp(App).use(store)
+router.beforeEach((to, from, next) => {
+  // 自动加载阅读配置
+  useBookStore()
+    .loadWebConfig()
+    .then(() => next())
+    .catch(() => next())
+})
+
 export default router

modules/web/src/router/index.ts

@@ -11,4 +11,19 @@ const router = createRouter({
 router.afterEach(to => {
   if (to.name == 'shelf') document.title = '书架'
 })
+
+import { createApp } from 'vue'
+import App from '@/App.vue'
+import store, { useBookStore } from '@/store'
+
+//  init pinia instance
+createApp(App).use(store)
+router.beforeEach((to, from, next) => {
+  // 自动加载阅读配置
+  useBookStore()
+    .loadWebConfig()
+    .then(() => next())
+    .catch(() => next())
+})
+
 export default router