add app mode

src/pages/appcenter.vue

@@ -0,0 +1,27 @@
+<script setup lang="ts">
+import { NavMenu } from '@/@layouts/types'
+import { SystemNavMenus } from '@/router/menu'
+import store from '@/store'
+
+// 从Vuex Store中获取superuser信息
+const superUser = store.state.auth.superUser
+
+// 根据分类获取菜单列表
+const getMenuList = () => {
+  return SystemNavMenus.filter((item: NavMenu) => !item.admin || superUser)
+}
+</script>
+<template>
+  <div class="ps ps--active-y mx-3" tabindex="0">
+    <VRow class="ma-0 mt-n1">
+      <VCol cols="6" md="4" lg="3" class="text-center cursor-pointer shortcut-icon" v-for="item in getMenuList()">
+        <VCard class="pa-4" :to="item.to" variant="flat">
+          <VAvatar size="64" variant="text">
+            <VIcon size="48" :icon="item.icon" color="primary" />
+          </VAvatar>
+          <h6 class="text-base font-weight-medium mt-2 mb-0">{{ item.full_title || item.title }}</h6>
+        </VCard>
+      </VCol>
+    </VRow>
+  </div>
+</template>

src/pages/dashboard.vue

@@ -5,6 +5,13 @@ import { isNullOrEmptyObject } from '@/@core/utils'
 import { DashboardItem } from '@/api/types'
 import store from '@/store'
 import DashboardElement from '@/components/misc/DashboardElement.vue'
+import { useDisplay } from 'vuetify'
+
+// APP
+const display = useDisplay()
+const appMode = computed(() => {
+  return localStorage.getItem('MP_APPMODE') == '1' && display.mdAndDown.value
+})
 
 // 从Vuex Store中获取superuser信息
 const superUser = store.state.auth.superUser
@@ -314,7 +321,16 @@ onBeforeMount(async () => {
   </draggable>
 
   <!-- 底部操作按钮 -->
-  <VFab icon="mdi-view-dashboard-edit" location="bottom" size="x-large" fixed app appear @click="dialog = true" />
+  <VFab
+    icon="mdi-view-dashboard-edit"
+    location="bottom"
+    size="x-large"
+    fixed
+    app
+    appear
+    @click="dialog = true"
+    :class="{ 'mb-12': appMode }"
+  />
 
   <!-- 弹窗，根据配置生成选项 -->
   <VDialog v-model="dialog" max-width="35rem" scrollable>

src/pages/resource.vue

@@ -5,6 +5,13 @@ import type { Context } from '@/api/types'
 import store from '@/store'
 import TorrentCardListView from '@/views/discover/TorrentCardListView.vue'
 import TorrentRowListView from '@/views/discover/TorrentRowListView.vue'
+import { useDisplay } from 'vuetify'
+
+// APP
+const display = useDisplay()
+const appMode = computed(() => {
+  return localStorage.getItem('MP_APPMODE') == '1' && display.mdAndDown.value
+})
 
 // 路由参数
 const route = useRoute()
@@ -142,13 +149,25 @@ onUnmounted(() => {
   <!-- 视图切换 -->
   <VFab
     v-if="viewType === 'list'"
+    class="mb-12"
     icon="mdi-view-grid"
     location="bottom"
     size="x-large"
+    absolute
+    app
+    appear
+    @click="setViewType('card')"
+    :class="{ 'mb-12': appMode }"
+  />
+  <VFab
+    v-else
+    icon="mdi-view-list"
+    location="bottom"
+    size="x-large"
     fixed
     app
     appear
-    @click="setViewType('card')"
+    @click="setViewType('list')"
+    :class="{ 'mb-12': appMode }"
   />
-  <VFab v-else icon="mdi-view-list" location="bottom" size="x-large" fixed app appear @click="setViewType('list')" />
 </template>