mirror of https://github.com/nocodb/nocodb
Wing-Kam Wong
2 years ago
35 changed files with 1257 additions and 257 deletions
@ -0,0 +1,29 @@
|
||||
<script setup lang="ts"> |
||||
import { useSidebar } from '#imports' |
||||
|
||||
const rightSidebar = useSidebar('nc-right-sidebar') |
||||
const leftSidebar = useSidebar('nc-left-sidebar') |
||||
|
||||
const isSidebarsOpen = computed({ |
||||
get: () => rightSidebar.isOpen.value || leftSidebar.isOpen.value, |
||||
set: (value) => { |
||||
rightSidebar.toggle(value) |
||||
leftSidebar.toggle(value) |
||||
}, |
||||
}) |
||||
</script> |
||||
|
||||
<template> |
||||
<a-tooltip> |
||||
<!-- todo: i18n --> |
||||
<template #title> {{ isSidebarsOpen ? 'Full width': 'Exit full width' }}</template> |
||||
<div |
||||
v-e="['c:toolbar:fullscreen']" |
||||
class="nc-fullscreen-btn cursor-pointer flex align-center self-center px-2 py-2 mr-2" |
||||
@click="isSidebarsOpen = !isSidebarsOpen" |
||||
> |
||||
<IcTwotoneWidthFull v-if="isSidebarsOpen" class="text-gray-300" /> |
||||
<IcTwotoneWidthNormal v-else class="text-gray-300" /> |
||||
</div> |
||||
</a-tooltip> |
||||
</template> |
||||
@ -0,0 +1,45 @@
|
||||
<script lang="ts" setup> |
||||
import { onKeyStroke } from '@vueuse/core' |
||||
|
||||
interface Props { |
||||
// Key to be pressed on hover to trigger the tooltip |
||||
modifierKey?: string |
||||
wrapperClass?: string |
||||
} |
||||
|
||||
const { modifierKey } = defineProps<Props>() |
||||
|
||||
const showTooltip = ref(false) |
||||
const isMouseOver = ref(false) |
||||
|
||||
if (modifierKey) { |
||||
onKeyStroke(modifierKey, (e) => { |
||||
e.preventDefault() |
||||
if (modifierKey && isMouseOver.value) { |
||||
showTooltip.value = true |
||||
} |
||||
}) |
||||
} |
||||
|
||||
watch(isMouseOver, (val) => { |
||||
if (!val) { |
||||
showTooltip.value = false |
||||
} |
||||
|
||||
// Show tooltip on mouseover if no modifier key is provided |
||||
if (val && !modifierKey) { |
||||
showTooltip.value = true |
||||
} |
||||
}) |
||||
</script> |
||||
|
||||
<template> |
||||
<a-tooltip v-model:visible="showTooltip" :trigger="[]"> |
||||
<template #title> |
||||
<slot name="title" /> |
||||
</template> |
||||
<div class="w-full" :class="wrapperClass" @mouseenter="isMouseOver = true" @mouseleave="isMouseOver = false"> |
||||
<slot /> |
||||
</div> |
||||
</a-tooltip> |
||||
</template> |
||||
@ -0,0 +1,36 @@
|
||||
/** |
||||
* Stores all currently created store instances |
||||
*/ |
||||
export class MemStorage<T = any> { |
||||
public currentId = 0 |
||||
public items = new Map<string, T>() |
||||
static instance: MemStorage |
||||
|
||||
public static getInstance(): MemStorage { |
||||
if (!MemStorage.instance) { |
||||
MemStorage.instance = new MemStorage() |
||||
} |
||||
|
||||
return MemStorage.instance |
||||
} |
||||
|
||||
public set(id: string, item: T) { |
||||
return this.items.set(id, item) |
||||
} |
||||
|
||||
public get(id: string) { |
||||
return this.items.get(id) |
||||
} |
||||
|
||||
public has(id: string) { |
||||
return this.items.has(id) |
||||
} |
||||
|
||||
public remove(id: string) { |
||||
return this.items.delete(id) |
||||
} |
||||
|
||||
public getId(prefix?: string) { |
||||
return `${prefix}${this.currentId++}` |
||||
} |
||||
} |
||||
Loading…
Reference in new issue