diff options
Diffstat (limited to 'packages/client/src/ui/deck.vue')
| -rw-r--r-- | packages/client/src/ui/deck.vue | 33 |
1 files changed, 16 insertions, 17 deletions
diff --git a/packages/client/src/ui/deck.vue b/packages/client/src/ui/deck.vue index e538a93f06..7433264794 100644 --- a/packages/client/src/ui/deck.vue +++ b/packages/client/src/ui/deck.vue @@ -1,18 +1,21 @@ <template> -<div class="mk-deck" :class="[{ isMobile }, `${deckStore.reactiveState.columnAlign.value}`]" :style="{ '--deckMargin': deckStore.reactiveState.columnMargin.value + 'px' }" +<div + class="mk-deck" :class="[{ isMobile }, `${deckStore.reactiveState.columnAlign.value}`]" :style="{ '--deckMargin': deckStore.reactiveState.columnMargin.value + 'px' }" @contextmenu.self.prevent="onContextmenu" > <XSidebar v-if="!isMobile"/> <template v-for="ids in layout"> <!-- sectionを利用しているのは、deck.vue側でcolumnに対してfirst-of-typeを効かせるため --> - <section v-if="ids.length > 1" + <section + v-if="ids.length > 1" class="folder column" :style="columns.filter(c => ids.includes(c.id)).some(c => c.flexible) ? { flex: 1, minWidth: '350px' } : { width: Math.max(...columns.filter(c => ids.includes(c.id)).map(c => c.width)) + 'px' }" > <DeckColumnCore v-for="id in ids" :ref="id" :key="id" :column="columns.find(c => c.id === id)" :is-stacked="true" @parent-focus="moveFocus(id, $event)"/> </section> - <DeckColumnCore v-else + <DeckColumnCore + v-else :ref="ids[0]" :key="ids[0]" class="column" @@ -25,13 +28,14 @@ <div v-if="isMobile" class="buttons"> <button class="button nav _button" @click="drawerMenuShowing = true"><i class="fas fa-bars"></i><span v-if="menuIndicated" class="indicator"><i class="fas fa-circle"></i></span></button> - <button class="button home _button" @click="$router.push('/')"><i class="fas fa-home"></i></button> - <button class="button notifications _button" @click="$router.push('/my/notifications')"><i class="fas fa-bell"></i><span v-if="$i?.hasUnreadNotification" class="indicator"><i class="fas fa-circle"></i></span></button> + <button class="button home _button" @click="mainRouter.push('/')"><i class="fas fa-home"></i></button> + <button class="button notifications _button" @click="mainRouter.push('/my/notifications')"><i class="fas fa-bell"></i><span v-if="$i?.hasUnreadNotification" class="indicator"><i class="fas fa-circle"></i></span></button> <button class="button post _button" @click="os.post()"><i class="fas fa-pencil-alt"></i></button> </div> <transition :name="$store.state.animation ? 'menu-back' : ''"> - <div v-if="drawerMenuShowing" + <div + v-if="drawerMenuShowing" class="menu-back _modalBg" @click="drawerMenuShowing = false" @touchstart.passive="drawerMenuShowing = false" @@ -49,17 +53,17 @@ <script lang="ts" setup> import { computed, provide, ref, watch } from 'vue'; import { v4 as uuid } from 'uuid'; +import XCommon from './_common_/common.vue'; +import { deckStore, addColumn as addColumnToStore, loadDeck } from './deck/deck-store'; import DeckColumnCore from '@/ui/deck/column-core.vue'; import XSidebar from '@/ui/_common_/sidebar.vue'; import XDrawerMenu from '@/ui/_common_/sidebar-for-mobile.vue'; import { getScrollContainer } from '@/scripts/scroll'; import * as os from '@/os'; import { menuDef } from '@/menu'; -import XCommon from './_common_/common.vue'; -import { deckStore, addColumn as addColumnToStore, loadDeck } from './deck/deck-store'; -import { useRoute } from 'vue-router'; import { $i } from '@/account'; import { i18n } from '@/i18n'; +import { mainRouter } from '@/router'; const isMobile = ref(window.innerWidth <= 500); window.addEventListener('resize', () => { @@ -68,7 +72,7 @@ window.addEventListener('resize', () => { const drawerMenuShowing = ref(false); -const route = useRoute(); +const route = 'TODO'; watch(route, () => { drawerMenuShowing.value = false; }); @@ -98,8 +102,8 @@ const addColumn = async (ev) => { const { canceled, result: column } = await os.select({ title: i18n.ts._deck.addColumn, items: columns.map(column => ({ - value: column, text: i18n.t('_deck._columns.' + column) - })) + value: column, text: i18n.t('_deck._columns.' + column), + })), }); if (canceled) return; @@ -119,11 +123,6 @@ const onContextmenu = (ev) => { }; provide('shouldSpacerMin', true); -if (deckStore.state.navWindow) { - provide('navHook', (url) => { - os.pageWindow(url); - }); -} document.documentElement.style.overflowY = 'hidden'; document.documentElement.style.scrollBehavior = 'auto'; |