diff --git a/package.json b/package.json
index 67c2324..ff921c5 100644
--- a/package.json
+++ b/package.json
@@ -42,6 +42,7 @@
"vuedraggable": "4.1.0"
},
"devDependencies": {
+ "@vicons/antd": "^0.13.0",
"@vicons/ionicons5": "^0.13.0",
"@vicons/utils": "^0.1.4",
"@vitejs/plugin-vue": "5.2.4",
diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue
index d45b59a..5839f05 100644
--- a/src/layout/components/Navbar.vue
+++ b/src/layout/components/Navbar.vue
@@ -43,9 +43,10 @@
-
+
-
+
+
@@ -160,7 +161,13 @@ import {
LockClosedOutline,
ChevronForward,
ExitOutline,
+ ContractSharp,
} from '@vicons/ionicons5'
+
+// AlignLeftOutlined
+// CompressOutlined
+
+import { AlignLeftOutlined, CompressOutlined } from '@vicons/antd'
import { initThemeTransitionCSS } from '@/utils/themeTransition'
import { Icon } from '@vicons/utils'
import Breadcrumb from '@/components/Breadcrumb'
@@ -237,7 +244,20 @@ const handleKeyDown = (e) => {
handleSearch()
}
}
+const isFullscreen = ref(false)
+// 开启全屏
+const handleScan = () => {
+ if (isFullscreen.value) {
+ // 退出全屏
+ document.exitFullscreen()
+ isFullscreen.value = false
+ } else {
+ // 打开全屏
+ document.documentElement.requestFullscreen()
+ isFullscreen.value = true
+ }
+}
onMounted(() => {
window.addEventListener('keydown', handleKeyDown)
// 初始化主题切换动画 CSS
diff --git a/src/settings.js b/src/settings.js
index ac1b77c..d45b1c8 100644
--- a/src/settings.js
+++ b/src/settings.js
@@ -23,7 +23,7 @@ export default {
* 是否显示 tagsView
*/
tagsView: true,
-
+
/**
* 显示页签图标
*/
@@ -32,7 +32,7 @@ export default {
/**
* 是否固定头部
*/
- fixedHeader: false,
+ fixedHeader: true,
/**
* 是否显示logo
diff --git a/src/utils/themeTransition.js b/src/utils/themeTransition.js
index 663c3c7..fa4cab6 100644
--- a/src/utils/themeTransition.js
+++ b/src/utils/themeTransition.js
@@ -109,30 +109,30 @@ export function toggleThemeWithTransition(callback, event = null) {
}
],
{
- duration: 600,
+ duration: 1000,
easing: 'cubic-bezier(0.4, 0, 0.2, 1)',
pseudoElement: '::view-transition-old(root)'
}
)
- // 新视图(日间模式)进入:从图标位置扩展到全屏
- document.documentElement.animate(
- [
- {
- clipPath: `circle(0px at ${iconX}px ${iconY}px)`,
- opacity: 0
- },
- {
- clipPath: `circle(${iconRadius}px at ${iconX}px ${iconY}px)`,
- opacity: 1
- }
- ],
- {
- duration: 600,
- easing: 'cubic-bezier(0.4, 0, 0.2, 1)',
- pseudoElement: '::view-transition-new(root)'
- }
- )
+ // // 新视图(日间模式)进入:从图标位置扩展到全屏
+ // document.documentElement.animate(
+ // [
+ // {
+ // clipPath: `circle(0px at ${iconX}px ${iconY}px)`,
+ // opacity: 0
+ // },
+ // {
+ // clipPath: `circle(${iconRadius}px at ${iconX}px ${iconY}px)`,
+ // opacity: 1
+ // }
+ // ],
+ // {
+ // duration: 600,
+ // easing: 'cubic-bezier(0.4, 0, 0.2, 1)',
+ // pseudoElement: '::view-transition-new(root)'
+ // }
+ // )
}
})
}