📝 更新文档

app/app.vue

@@ -2,12 +2,13 @@
  * @Author: fzf404
  * @Date: 2022-05-25 23:36:33
  * @LastEditors: fzf404 [email protected]
- * @LastEditTime: 2022-07-22 00:50:16
+ * @LastEditTime: 2022-09-09 11:15:59
  * @Description: app 入口
 -->
-
 <template>
- <router-view></router-view>
+ <Layout />
 </template>
 
-<style></style>
+<script setup>
+import Layout from '@/layouts/layout.vue'
+</script>

app/layouts/layout.vue

@@ -2,11 +2,12 @@
  * @Author: fzf404
  * @Date: 2022-08-12 10:39:12
  * @LastEditors: fzf404 [email protected]
- * @LastEditTime: 2022-08-14 17:47:16
+ * @LastEditTime: 2022-09-10 14:37:08
  * @Description: 布局切换
 -->
 <template>
- <component :is="layout[state.layout]" :layouts="layouts" :themes="themes" :state="state"></component>
+ <component :is="layout[state.layout]" :state="state"></component>
+ <router-view> </router-view>
 </template>
 
 <script setup>
@@ -29,10 +30,6 @@ const layout = {
  maco,
  wine,
 }
-// 布局列表
-const layouts = ['maco', 'wine']
-// 主题列表
-const themes = ['dark', 'light']
 
 const state = reactive({
  top: get('top', false), // 置顶

app/layouts/maco.vue

@@ -2,12 +2,11 @@
  * @Author: fzf404
  * @Date: 2022-05-23 17:03:20
  * @LastEditors: fzf404 [email protected]
- * @LastEditTime: 2022-08-13 18:33:46
+ * @LastEditTime: 2022-09-10 14:37:39
  * @Description: maco 布局
 -->
 <template>
  <nav>
- <!-- 窗口控制器 -->
  <ul class="absolute left-2 z-40 space-x-1">
  <!-- 关闭 -->
  <CloseSVG class="w-3.5 p-0.5 btn-svg rounded-full bg-red-400 text-primary" @click="sendEvent('window-close')" />
@@ -25,14 +24,11 @@
  <!-- 断网提示 -->
  <WifiSVG v-show="!store.network" class="w-4 btn-svg text-red-400" />
  <!-- 布局 -->
- <MacoSVG class="w-4 btn-svg text-cyan-500" @click="state.layout = layouts[1]" />
+ <MacoSVG class="w-4 btn-svg text-cyan-500" @click="state.layout = 'wine'" />
  <!-- 主题 -->
- <LightSVG v-if="state.theme === themes[0]" class="w-4 btn-svg text-orange-400" @click="state.theme = themes[1]" />
- <DarkSVG
- v-else="state.theme === themes[1]"
- class="w-4 btn-svg text-indigo-300"
- @click="state.theme = themes[0]"
- />
+ <LightSVG v-if="state.theme === 'dark'" class="w-4 btn-svg text-orange-400" @click="state.theme = 'light'" />
+ <PunkSVG v-else-if="state.theme === 'light'" class="w-4 btn-svg text-yellow-400" @click="state.theme = 'punk'" />
+ <DarkSVG v-else class="w-4 btn-svg text-indigo-300" @click="state.theme = 'dark'" />
  <!-- 设置 -->
  <SettingSVG v-show="store.setting.has" class="w-4 btn-svg text-blue-400" @click="store.setting.show = true" />
  </ul>
@@ -51,12 +47,13 @@ import MacoSVG from '@/assets/layout/maco.svg'
 
 import DarkSVG from '@/assets/layout/dark.svg'
 import LightSVG from '@/assets/layout/light.svg'
+import PunkSVG from '@/assets/layout/punk.svg'
 
 import SettingSVG from '@/assets/layout/setting.svg'
 import WifiSVG from '@/assets/layout/wifi.svg'
 
 // 初始化 props
-const props = defineProps(['layouts', 'themes', 'state'])
+const props = defineProps(['state'])
 
 // 初始化 store
 const store = useStore()

app/layouts/wine.vue

@@ -2,7 +2,7 @@
  * @Author: fzf404
  * @Date: 2022-07-22 00:24:58
  * @LastEditors: fzf404 [email protected]
- * @LastEditTime: 2022-08-13 18:32:02
+ * @LastEditTime: 2022-09-10 14:40:25
  * @Description: winer 布局
 -->
 <template>
@@ -17,21 +17,22 @@
  />
  <!-- 主题 -->
  <LightSVG
- v-if="state.theme === themes[0]"
+ v-if="state.theme === 'dark'"
  class="w-5 hover-dynamic btn-svg text-orange-400"
- @click="state.theme = themes[1]"
+ @click="state.theme = 'light'"
  />
- <DarkSVG
- v-else="state.theme === themes[1]"
- class="w-5 hover-dynamic btn-svg text-indigo-300"
- @click="state.theme = themes[0]"
+ <PunkSVG
+ v-else-if="state.theme === 'light'"
+ class="w-5 hover-dynamic btn-svg text-yellow-400"
+ @click="state.theme = 'punk'"
  />
+ <DarkSVG v-else class="w-5 hover-dynamic btn-svg text-indigo-300" @click="state.theme = 'dark'" />
  <!-- 布局 -->
- <WineSVG class="w-5 hover-dynamic btn-svg text-cyan-500" @click="state.layout = layouts[0]" />
+ <WineSVG class="w-5 hover-dynamic btn-svg text-cyan-500" @click="state.layout = 'maco'" />
  <!-- 断网提示 -->
  <WifiSVG v-show="!store.network" class="w-5 hover-dynamic btn-svg text-red-400" />
  </ul>
- <!-- 窗口控制器 -->
+
  <ul class="absolute right-2 z-40">
  <!-- 置顶 -->
  <UpSVG
@@ -59,12 +60,13 @@ import WineSVG from '@/assets/layout/wine.svg'
 
 import DarkSVG from '@/assets/layout/dark.svg'
 import LightSVG from '@/assets/layout/light.svg'
+import PunkSVG from '@/assets/layout/punk.svg'
 
 import SettingSVG from '@/assets/layout/setting.svg'
 import WifiSVG from '@/assets/layout/wifi.svg'
 
 // 初始化 props
-const props = defineProps(['layouts', 'themes', 'state'])
+const props = defineProps(['state'])
 
 // 初始化 store
 const store = useStore()

app/plugins/bilibili.vue

@@ -2,13 +2,11 @@
  * @Author: fzf404
  * @Date: 2022-05-25 23:18:50
  * @LastEditors: fzf404 [email protected]
- * @LastEditTime: 2022-08-01 13:53:00
+ * @LastEditTime: 2022-09-09 12:34:38
  * @Description: bilibili 信息监控
 -->
 <template>
  <main>
- <!-- 菜单 -->
- <Layout />
  <!-- 设置-->
  <Setting />
  <!-- 页面内容 -->
@@ -20,6 +18,5 @@
 
 <!-- TODO 插件 bilibili -->
 <script setup>
-import Layout from '@/layouts/layout.vue'
 import Setting from '@/plugins/bilibili.vue'
 </script>

app/plugins/camera.vue

@@ -2,13 +2,11 @@
  * @Author: fzf404
  * @Date: 2022-07-15 22:55:49
  * @LastEditors: fzf404 [email protected]
- * @LastEditTime: 2022-08-15 22:58:08
+ * @LastEditTime: 2022-09-08 22:52:46
  * @Description: camera 相机监控
 -->
 <template>
  <main>
- <!-- 窗口控制器 -->
- <Layout />
  <!-- 设置-->
  <Setting :setting="setting" :config="config" />
  <!-- 页面内容 -->
@@ -75,7 +73,6 @@ import { initHolistic } from '~/holistic'
 import { storage } from '~/storage'
 
 import Setting from '@/components/setting.vue'
-import Layout from '@/layouts/layout.vue'
 
 import CameraSVG from '@/assets/camera/camera.svg'
 import OffSVG from '@/assets/camera/off.svg'

app/plugins/clock.vue

@@ -7,8 +7,6 @@
 -->
 <template>
  <main>
- <!-- 窗口控制器 -->
- <Layout />
  <!-- 页面内容 -->
  <article class="h-screen flex-col-center space-y-6">
  <!-- 翻牌器 -->
@@ -66,8 +64,6 @@
 <script setup>
 import { onMounted, ref } from 'vue'
 
-import Layout from '@/layouts/layout.vue'
-
 import ClockSVG from '@/assets/clock/clock.svg'
 import OffSVG from '@/assets/clock/off.svg'
 import TimerSVG from '@/assets/clock/timer.svg'

app/plugins/count.vue

@@ -7,8 +7,6 @@
 -->
 <template>
  <main>
- <!-- 窗口控制器 -->
- <Layout />
  <!-- 设置 -->
  <Setting size="small" :setting="setting" :config="config" />
  <!-- 页面内容 -->
@@ -31,7 +29,7 @@
 import AddSVG from '@/assets/count/add.svg'
 import SubSVG from '@/assets/count/sub.svg'
 import Setting from '@/components/setting.vue'
-import Layout from '@/layouts/layout.vue'
+
 import { reactive } from 'vue'
 import { storage } from '~/storage'
 
@@ -71,7 +69,6 @@ export default {
  return { setting, config }
  },
  components: {
- Layout,
  AddSVG,
  SubSVG,
  Setting,

app/plugins/github.vue

@@ -7,8 +7,6 @@
 -->
 <template>
  <main>
- <!-- 窗口控制器 -->
- <Layout />
  <!-- 设置 -->
  <Setting :setting="setting" :config="config" @save="onSave" />
  <!-- 页面内容 -->

app/plugins/juejin.vue

@@ -7,8 +7,6 @@
 -->
 <template>
  <main>
- <!-- 窗口控制器 -->
- <Layout />
  <!-- 设置 -->
  <Setting :setting="setting" :config="config" @save="onSave" />
  <!-- 页面内容 -->

app/plugins/live2d.vue

@@ -7,8 +7,6 @@
 -->
 <template>
  <main>
- <!-- 窗口控制器 -->
- <Layout />
  <!-- 页面内容 -->
  <article class="h-screen flex-col-center">
  <video ref="character"></video>
@@ -18,7 +16,6 @@
 
 <!-- TODO 插件 live2d -->
 <script setup>
-import Layout from '@/layouts/layout.vue'
 import { ref } from 'vue'
 
 const character = ref(null)

app/plugins/music.vue

@@ -7,8 +7,6 @@
 -->
 <template>
  <main>
- <!-- 窗口控制器 -->
- <Layout />
  <!-- 页面内容 -->
  <article class="h-screen flex-col-center">
  <h1 class="text-lg">Music</h1>
@@ -17,8 +15,6 @@
 </template>
 
 <!-- TODO 插件 music -->
-<script setup>
-import Layout from '@/layouts/layout.vue'
-</script>
+<script setup></script>
 
 <style scoped></style>

app/plugins/todo.vue

@@ -2,13 +2,12 @@
  * @Author: fzf404
  * @Date: 2022-05-26 17:37:12
  * @LastEditors: fzf404 [email protected]
- * @LastEditTime: 2022-08-12 04:47:43
+ * @LastEditTime: 2022-09-09 11:48:08
  * @Description: todo 代办事项管理
 -->
 
 <template lang="pug">
 main
- Layout
  article.h-screen.flex.flex-col.justify-between.pt-8.pb-3.px-4
  draggable.flex.flex-col.items-start.overflow-hidden.overflow-y-scroll(class="space-y-1" tag="ul" :list="todos" handle=".handle" :animation="200" item-key="id")
  template(#item="{element,index}")
@@ -32,7 +31,6 @@ import { storage } from '~/storage'
 import AddSVG from '@/assets/todo/add.svg'
 import DeleteSVG from '@/assets/todo/delete.svg'
 import MoveSVG from '@/assets/todo/move.svg'
-import Layout from '@/layouts/layout.vue'
 
 // 初始化 storeage
 const { set, get } = storage()

app/plugins/welcome.vue

@@ -7,8 +7,6 @@
 -->
 <template>
  <main>
- <!-- 窗口控制器 -->
- <Layout />
  <!-- 引导页 -->
  <article class="h-screen flex-col-center space-y-3">
  <!-- 欢迎-->
@@ -26,7 +24,6 @@
 
 <script setup>
 import { openURL } from '#/ipc'
-import Layout from '@/layouts/layout.vue'
 
 import FaviconSVG from '@/assets/favicon.svg'
 import GithubSVG from '@/assets/github/github.svg'

app/router.js

@@ -2,22 +2,28 @@
  * @Author: fzf404
  * @Date: 2022-05-25 23:18:50
  * @LastEditors: fzf404 [email protected]
- * @LastEditTime: 2022-08-11 16:00:14
+ * @LastEditTime: 2022-09-08 18:57:58
  * @Description: router 配置
  */
 
 import { pluginList } from '#/plugin'
 import { createRouter, createWebHashHistory } from 'vue-router'
 
+const isDebug = process.env.NODE_ENV === 'development'
+
+// 生产模式 & debug 不开启插件
+const pluginLists = pluginList.filter(({ debug }) => !(!isDebug && debug))
+
 // 自动生成 router
-const routes = pluginList.map((item) => {
+const routes = pluginLists.map((item) => {
  return {
  name: item.name,
  path: '/' + item.name,
  component: () => import('./plugins/' + item.name),
  }
 })
 
+// 创建路由
 const router = createRouter({
  history: createWebHashHistory(),
  routes,