Browse Source

refactor(gui-v2): make view list section grow

Signed-off-by: Pranav C <pranavxc@gmail.com>
pull/3262/head
Pranav C 2 years ago
parent
commit
763eae1c39
  1. 14
      packages/nc-gui-v2/components/smartsheet-toolbar/ViewActions.vue
  2. 39
      packages/nc-gui-v2/components/smartsheet/sidebar/MenuBottom.vue
  3. 2
      packages/nc-gui-v2/components/smartsheet/sidebar/MenuTop.vue
  4. 2
      packages/nc-gui-v2/components/smartsheet/sidebar/index.vue

14
packages/nc-gui-v2/components/smartsheet-toolbar/ViewActions.vue

@ -44,6 +44,8 @@ const showWebhookDrawer = ref(false)
const quickImportDialog = ref(false) const quickImportDialog = ref(false)
const showApiSnippet = ref(false)
const { isUIAllowed } = useUIPermission() const { isUIAllowed } = useUIPermission()
const exportFile = async (exportType: ExportTypes) => { const exportFile = async (exportType: ExportTypes) => {
@ -151,7 +153,6 @@ async function changeLockType(type: LockType) {
> >
<template #title> <template #title>
<div v-t="['c:navdraw:preview-as']" class="nc-project-menu-item group px-0"> <div v-t="['c:navdraw:preview-as']" class="nc-project-menu-item group px-0">
<SmartsheetToolbarLockType hide-tick :type="selectedView?.lock_type || LockType.Collaborative" /> <SmartsheetToolbarLockType hide-tick :type="selectedView?.lock_type || LockType.Collaborative" />
<MaterialSymbolsChevronRightRounded <MaterialSymbolsChevronRightRounded
@ -255,6 +256,17 @@ async function changeLockType(type: LockType) {
{{ $t('objects.webhooks') }} {{ $t('objects.webhooks') }}
</div> </div>
</a-menu-item> </a-menu-item>
<a-menu-item>
<div
v-if="isUIAllowed('webhook') && !isView && !isPublicView"
v-t="['c:actions:webhook']"
class="py-2 flex gap-2"
@click="showWebhookDrawer = true"
>
<MdiHook class="text-gray-500" />
<mdi-hook />{{ $t('objects.webhooks') }}
</div>
</a-menu-item>
</a-menu-item-group> </a-menu-item-group>
</a-menu> </a-menu>
</template> </template>

39
packages/nc-gui-v2/components/smartsheet/sidebar/MenuBottom.vue

@ -9,33 +9,19 @@ interface Emits {
const emits = defineEmits<Emits>() const emits = defineEmits<Emits>()
const { $e } = useNuxtApp()
const { isUIAllowed } = useUIPermission() const { isUIAllowed } = useUIPermission()
const isView = ref(false) const isView = ref(false)
let showApiSnippet = $ref(false)
const showWebhookDrawer = ref(false) const showWebhookDrawer = ref(false)
function onApiSnippet() {
// get API snippet
showApiSnippet = true
$e('a:view:api-snippet')
}
function onWebhooks() {
showWebhookDrawer.value = true
}
function onOpenModal(type: ViewTypes, title = '') { function onOpenModal(type: ViewTypes, title = '') {
emits('openModal', { type, title }) emits('openModal', { type, title })
} }
</script> </script>
<template> <template>
<a-menu :selected-keys="[]" class="flex-1 flex flex-col"> <a-menu :selected-keys="[]" class="flex flex-col">
<div class="flex-1"></div> <div class="flex-1"></div>
<div v-if="isUIAllowed('virtualViewsCreateOrEdit')"> <div v-if="isUIAllowed('virtualViewsCreateOrEdit')">
<h3 class="px-3 py-1 text-xs font-semibold flex items-center gap-4 text-gray-500"> <h3 class="px-3 py-1 text-xs font-semibold flex items-center gap-4 text-gray-500">
@ -112,26 +98,9 @@ function onOpenModal(type: ViewTypes, title = '') {
<div class="w-full h-4"></div> <div class="w-full h-4"></div>
</div> </div>
<!-- <SmartsheetSidebarMenuApiSnippet v-model="showApiSnippet" /> --> <!--
todo: bring back later
<!-- <div class="flex-auto justify-end flex flex-col gap-3 mt-3"> --> <general-flipping-card class="my-4 lg:my-6 min-h-[100px]" :triggers="['click', { duration: 15000 }]">
<!-- <button -->
<!-- v-if="isUIAllowed('virtualViewsCreateOrEdit')" -->
<!-- class="flex items-center gap-2 w-full mx-3 px-4 py-3 rounded border transform translate-x-4 hover:(translate-x-0 shadow-lg) transition duration-150 ease !text-xs nc-webhook-btn" -->
<!-- @click="onWebhooks" -->
<!-- > -->
<!-- <mdi-hook />{{ $t('objects.webhooks') }} -->
<!-- </button> -->
<!-- <button -->
<!-- class="flex items-center gap-2 w-full mx-3 px-4 py-3 rounded border transform translate-x-4 hover:(translate-x-0 shadow-lg) transition duration-150 ease !text-xs" -->
<!-- @click="onApiSnippet" -->
<!-- > -->
<!-- <mdi-xml />Get API Snippet -->
<!-- </button> -->
<!-- </div> -->
<!-- <general-flipping-card class="my-4 lg:my-6 min-h-[100px]" :triggers="['click', { duration: 15000 }]">
<template #front> <template #front>
<div class="flex h-full w-full gap-6 flex-col"> <div class="flex h-full w-full gap-6 flex-col">
<general-social /> <general-social />

2
packages/nc-gui-v2/components/smartsheet/sidebar/MenuTop.vue

@ -197,7 +197,7 @@ function onDeleted() {
<style lang="scss"> <style lang="scss">
.nc-views-menu { .nc-views-menu {
@apply flex-1 max-h-[30vh] overflow-y-scroll scrollbar-thin-dull; @apply flex-1 overflow-y-scroll scrollbar-thin-dull;
.ghost, .ghost,
.ghost > * { .ghost > * {

2
packages/nc-gui-v2/components/smartsheet/sidebar/index.vue

@ -131,7 +131,7 @@ function onCreate(view: GridType | FormType | KanbanType | GalleryType) {
</Toolbar> </Toolbar>
--> -->
<div v-if="isOpen" class="flex-1 flex flex-col"> <div v-if="isOpen" class="flex-1 flex flex-col">
<MenuTop @open-modal="openModal" @deleted="loadViews" @sorted="loadViews" /> <MenuTop class="flex-1" @open-modal="openModal" @deleted="loadViews" @sorted="loadViews" />
<a-divider v-if="isUIAllowed('virtualViewsCreateOrEdit')" class="my-2" /> <a-divider v-if="isUIAllowed('virtualViewsCreateOrEdit')" class="my-2" />

Loading…
Cancel
Save