Browse Source

feat(gui-v2): close dropdown menu on esc keydown

pull/3095/head
braks 2 years ago
parent
commit
198a4af698
  1. 17
      packages/nc-gui-v2/pages/nc/[projectId]/index.vue

17
packages/nc-gui-v2/pages/nc/[projectId]/index.vue

@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { navigateTo, provideSidebar, ref, useProject, useRoute, useSidebar, useTabs, useUIPermission } from '#imports' import { navigateTo, onKeyStroke, provideSidebar, ref, useProject, useRoute, useTabs, useUIPermission } from '#imports'
import { TabType } from '~/composables' import { TabType } from '~/composables'
import { openLink } from '~/utils' import { openLink } from '~/utils'
@ -11,9 +11,6 @@ const { addTab, clearTabs } = useTabs()
const { isUIAllowed } = useUIPermission() const { isUIAllowed } = useUIPermission()
// set old sidebar state
useSidebar({ isOpen: true })
// create a new sidebar state // create a new sidebar state
const { isOpen, toggle } = provideSidebar({ isOpen: true }) const { isOpen, toggle } = provideSidebar({ isOpen: true })
@ -21,6 +18,16 @@ const dialogOpen = ref(false)
const openDialogKey = ref<string>() const openDialogKey = ref<string>()
const dropdownOpen = ref(false)
onKeyStroke(
'Escape',
() => {
dropdownOpen.value = false
},
{ eventName: 'keydown' },
)
clearTabs() clearTabs()
if (!route.params.type) { if (!route.params.type) {
@ -58,7 +65,7 @@ await loadTables()
<img alt="NocoDB" src="~/assets/img/icons/512x512-trans.png" /> <img alt="NocoDB" src="~/assets/img/icons/512x512-trans.png" />
</div> </div>
<a-dropdown :trigger="['click']"> <a-dropdown v-model:visible="dropdownOpen" :trigger="['click']">
<div <div
:style="{ width: isOpen ? 'calc(100% - 40px) pr-2' : '100%' }" :style="{ width: isOpen ? 'calc(100% - 40px) pr-2' : '100%' }"
:class="[isOpen ? '' : 'justify-center']" :class="[isOpen ? '' : 'justify-center']"

Loading…
Cancel
Save