From 32405f6a20669f8de5dab3bd362b5fdb04f5c24a Mon Sep 17 00:00:00 2001 From: plightfield <1207120484@qq.com> Date: Thu, 10 Oct 2024 16:04:00 +0800 Subject: [PATCH] change --- src/layout/dock/index.tsx | 8 ++- src/layout/grid/BlockSettings.tsx | 88 +++++++++++++++++++++++++ src/layout/grid/BlockWrapper.tsx | 16 +++-- src/layout/grid/LinkBlock.tsx | 6 +- src/layout/grid/index.tsx | 34 +++++----- src/settings/SettingsOverlay.tsx | 4 -- src/settings/SettingsOverlayContent.tsx | 3 + src/settings/useSettingsStore.ts | 2 + 8 files changed, 134 insertions(+), 27 deletions(-) create mode 100644 src/layout/grid/BlockSettings.tsx diff --git a/src/layout/dock/index.tsx b/src/layout/dock/index.tsx index 4f5a911..3352115 100644 --- a/src/layout/dock/index.tsx +++ b/src/layout/dock/index.tsx @@ -10,6 +10,12 @@ export default defineComponent(() => { ref('dock') ) const current = ref(-1) + // window.addEventListener('keydown', (e) => { + // const i = layout.state.dockLabels.indexOf(e.key) + // if (i >= 0) { + // layout.state.dock[i] = null + // } + // }) return () => (
{ } }} > - {block && } + {block && }
{ + const settings = useSettingsStore() + return () => ( +
+
图标大小
+ }} + > + + +
图标间距
+ }} + > + + +
区域宽度
+ }} + > + + +
图标圆角
+ }} + > + + {' '} +
添加图标
+ }} + > + + +
显示标签
+ }} + > + + +
+ ) +}) diff --git a/src/layout/grid/BlockWrapper.tsx b/src/layout/grid/BlockWrapper.tsx index e0c883d..45e7f87 100644 --- a/src/layout/grid/BlockWrapper.tsx +++ b/src/layout/grid/BlockWrapper.tsx @@ -6,6 +6,7 @@ import useLayoutStore from '../useLayoutStore' import LinkBlock from './LinkBlock' import DirBlock from './DirBlock' import WidgetBlock from './WidgetBlock' +import useSettingsStore from '@/settings/useSettingsStore' export default defineComponent({ props: { @@ -19,6 +20,7 @@ export default defineComponent({ } }, setup(props) { + const settings = useSettingsStore() const layout = useLayoutStore() let it = 0 const hover = ref(false) @@ -128,12 +130,14 @@ export default defineComponent({ )}
-
- {layout.getLabel(props.block)} -
+ {settings.state.showBlockLabel && ( +
+ {layout.getLabel(props.block)} +
+ )}
) } diff --git a/src/layout/grid/LinkBlock.tsx b/src/layout/grid/LinkBlock.tsx index 4dff436..98feaed 100644 --- a/src/layout/grid/LinkBlock.tsx +++ b/src/layout/grid/LinkBlock.tsx @@ -11,6 +11,10 @@ export default defineComponent({ brief: { type: Boolean, default: false + }, + dock: { + type: Boolean, + default: false } }, setup(props) { @@ -26,7 +30,7 @@ export default defineComponent({ backgroundColor: props.block.background || 'white', color: props.block.color || 'black', backgroundImage: props.block.icon ? `url('${props.block.icon}')` : '', - fontSize: props.brief ? '12px' : 'calc(var(--block-size) / 5)' + fontSize: props.dock ? '16px' : props.brief ? '12px' : 'calc(var(--block-size) / 5)' }} >
{props.brief ? props.block.text[0] : props.block.text}
diff --git a/src/layout/grid/index.tsx b/src/layout/grid/index.tsx index 82599b3..711c7bb 100644 --- a/src/layout/grid/index.tsx +++ b/src/layout/grid/index.tsx @@ -6,11 +6,13 @@ import useRouterStore from '@/useRouterStore' import { globalToast } from '@/main' import useSortable, { dragging, resetDragging } from './useSortable' import BlockWrapper from './BlockWrapper' +import useSettingsStore from '@/settings/useSettingsStore' addIcons(MdAdd) export default defineComponent(() => { const layout = useLayoutStore() + const settings = useSettingsStore() const router = useRouterStore() const container = useSortable( computed(() => layout.currentPage.list), @@ -62,22 +64,24 @@ export default defineComponent(() => { {layout.currentPage.list.map((block, idx) => ( ))} -
-
{ - if (layout.state.content[layout.state.current].pages[layout.state.currentPage]) { - router.go('global-adder') - } else { - globalToast.warning('请先添加页面') - } - }} - > - - - + {settings.state.showAdder && ( +
+
{ + if (layout.state.content[layout.state.current].pages[layout.state.currentPage]) { + router.go('global-adder') + } else { + globalToast.warning('请先添加页面') + } + }} + > + + + +
-
+ )}
) diff --git a/src/settings/SettingsOverlay.tsx b/src/settings/SettingsOverlay.tsx index 937c048..107363e 100644 --- a/src/settings/SettingsOverlay.tsx +++ b/src/settings/SettingsOverlay.tsx @@ -1,7 +1,6 @@ import AvatarCircle from '@/user/AvatarCircle' import useRouterStore from '@/useRouterStore' import asyncLoader from '@/utils/asyncLoader' -import { OhVueIcon } from 'oh-vue-icons' import { computed, defineComponent, Transition } from 'vue' const Content = asyncLoader(() => import('./SettingsOverlayContent')) @@ -77,9 +76,6 @@ export default defineComponent(() => { - - - )} diff --git a/src/settings/SettingsOverlayContent.tsx b/src/settings/SettingsOverlayContent.tsx index ef02420..4c3a938 100644 --- a/src/settings/SettingsOverlayContent.tsx +++ b/src/settings/SettingsOverlayContent.tsx @@ -3,6 +3,7 @@ import { defineComponent, Transition } from 'vue' import UserPage from '@/user/UserPage' import BackgroundPage from '@/layout/background/BackgroundPage' import ThemeProvider from '@/utils/ThemeProvider' +import BlockSettings from '@/layout/grid/BlockSettings' export default defineComponent(() => { const router = useRouterStore() return () => ( @@ -13,6 +14,8 @@ export default defineComponent(() => { ) : router.path === 'settings-background' ? ( + ) : router.path === 'settings-block' ? ( + ) : null} diff --git a/src/settings/useSettingsStore.ts b/src/settings/useSettingsStore.ts index f0534ae..74d85c3 100644 --- a/src/settings/useSettingsStore.ts +++ b/src/settings/useSettingsStore.ts @@ -15,11 +15,13 @@ export default defineStore( showPet: 'show' as VisibleState, showDate: true, showTime: true, + showAdder: true, // 尺寸 blockSize: 6, blockPadding: 1, mainWidth: 70, blockRadius: 0.2, + showBlockLabel: true, // 搜索 searchWidth: 30, searchRadius: 24