1122

cdTMP/src/hooks/permission.js

@@ -12,6 +12,7 @@ export default function usePermission() {
                 route.meta?.roles?.includes(userStore.role)
             )
         },
+        // 返回第一个可访问的路径
         findFirstPermissionRoute(_routers, role = "admin") {
             const cloneRouters = [..._routers]
             while (cloneRouters.length) {

cdTMP/src/hooks/responsive.ts

@@ -0,0 +1,32 @@
+import { onMounted, onBeforeMount, onBeforeUnmount } from 'vue'
+import { useDebounceFn } from '@vueuse/core'
+import { useAppStore } from '@/store'
+import { addEventListen, removeEventListen } from '@/utils/event'
+
+const WIDTH = 992 // https://arco.design/vue/component/grid#responsivevalue
+
+function queryDevice() {
+    const rect = document.body.getBoundingClientRect()
+    return rect.width - 1 < WIDTH
+}
+
+export default function useResponsive(immediate?: boolean) {
+    const appStore = useAppStore()
+    function resizeHandler() {
+        if (!document.hidden) {
+            const isMobile = queryDevice()
+            appStore.toggleDevice(isMobile ? 'mobile' : 'desktop')
+            appStore.toggleMenu(isMobile)
+        }
+    }
+    const debounceFn = useDebounceFn(resizeHandler, 100)
+    onMounted(() => {
+        if (immediate) debounceFn()
+    })
+    onBeforeMount(() => {
+        addEventListen(window, 'resize', debounceFn)
+    })
+    onBeforeUnmount(() => {
+        removeEventListen(window, 'resize', debounceFn)
+    })
+}