Browse Source

fix(gui-v2): revise isUIAllowed & v-t in TreeView

pull/3087/head
Wing-Kam Wong 2 years ago
parent
commit
e808595c80
  1. 44
      packages/nc-gui-v2/components/dashboard/TreeView.vue

44
packages/nc-gui-v2/components/dashboard/TreeView.vue

@ -18,9 +18,13 @@ const { $api, $e } = useNuxtApp()
const route = useRoute() const route = useRoute()
const { tables, loadTables } = useProject(route.params.projectId as string) const { tables, loadTables } = useProject(route.params.projectId as string)
const { activeTab } = useTabs() const { activeTab } = useTabs()
const { deleteTable } = useTable() const { deleteTable } = useTable()
const { isUIAllowed } = useUIPermission()
const tablesById = $computed<Record<string, TableType>>(() => const tablesById = $computed<Record<string, TableType>>(() =>
tables?.value?.reduce((acc: Record<string, TableType>, table: TableType) => { tables?.value?.reduce((acc: Record<string, TableType>, table: TableType) => {
acc[table.id as string] = table acc[table.id as string] = table
@ -29,7 +33,9 @@ const tablesById = $computed<Record<string, TableType>>(() =>
) )
const showTableList = ref(true) const showTableList = ref(true)
const tableCreateDlg = ref(false) const tableCreateDlg = ref(false)
let key = $ref(0) let key = $ref(0)
const menuRef = $ref<HTMLLIElement>() const menuRef = $ref<HTMLLIElement>()
@ -159,6 +165,7 @@ const activeTable = computed(() => {
</span> </span>
<MdiPlus <MdiPlus
v-if="isUIAllowed('treeview-add-button')"
v-t="['c:table:create:navdraw']" v-t="['c:table:create:navdraw']"
class="transform text-gray-500 hover:(text-pink-500 scale-105) nc-btn-tbl-add" class="transform text-gray-500 hover:(text-pink-500 scale-105) nc-btn-tbl-add"
@click.stop="tableCreateDlg = true" @click.stop="tableCreateDlg = true"
@ -190,7 +197,7 @@ const activeTable = computed(() => {
@click="addTableTab(table)" @click="addTableTab(table)"
> >
<div class="flex align-center gap-2 h-full" @contextmenu="setMenuContext('table', table)"> <div class="flex align-center gap-2 h-full" @contextmenu="setMenuContext('table', table)">
<div class="flex w-auto"> <div v-if="isUIAllowed('treeview-drag-n-drop')" class="flex w-auto">
<MdiDrag <MdiDrag
:class="`nc-child-draggable-icon-${table.title}`" :class="`nc-child-draggable-icon-${table.title}`"
class="nc-drag-icon text-xs hidden group-hover:block transition-opacity opacity-0 group-hover:opacity-100 text-gray-500 cursor-move" class="nc-drag-icon text-xs hidden group-hover:block transition-opacity opacity-0 group-hover:opacity-100 text-gray-500 cursor-move"
@ -207,9 +214,22 @@ const activeTable = computed(() => {
<template #overlay> <template #overlay>
<a-menu class="cursor-pointer"> <a-menu class="cursor-pointer">
<a-menu-item v-t="" class="!text-xs" @click="showRenameTableDlg(table)"><div>Rename</div></a-menu-item> <a-menu-item
v-if="isUIAllowed('table-rename')"
<a-menu-item class="!text-xs" @click="deleteTable(table)"> Delete</a-menu-item> v-t="['c:table:rename']"
class="!text-xs"
@click="showRenameTableDlg(table)"
><div>Rename</div></a-menu-item
>
<a-menu-item
v-if="isUIAllowed('table-delete')"
v-t="['c:table:delete']"
class="!text-xs"
@click="deleteTable(table)"
>
Delete</a-menu-item
>
</a-menu> </a-menu>
</template> </template>
</a-dropdown> </a-dropdown>
@ -223,15 +243,25 @@ const activeTable = computed(() => {
<template #overlay> <template #overlay>
<a-menu class="cursor-pointer"> <a-menu class="cursor-pointer">
<template v-if="contextMenuTarget.type === 'table'"> <template v-if="contextMenuTarget.type === 'table'">
<a-menu-item class="!text-xs" @click="showRenameTableDlg(contextMenuTarget.value)"> <a-menu-item
v-if="isUIAllowed('table-rename')"
v-t="['c:table:rename']"
class="!text-xs"
@click="showRenameTableDlg(contextMenuTarget.value)"
>
{{ $t('general.rename') }} {{ $t('general.rename') }}
</a-menu-item> </a-menu-item>
<a-menu-item class="!text-xs" @click="deleteTable(contextMenuTarget.value)"> <a-menu-item
v-if="isUIAllowed('table-delete')"
v-t="['c:table:delete']"
class="!text-xs"
@click="deleteTable(contextMenuTarget.value)"
>
{{ $t('general.delete') }} {{ $t('general.delete') }}
</a-menu-item> </a-menu-item>
</template> </template>
<template v-else> <template v-else>
<a-menu-item class="!text-xs" @click="reloadTables"> <a-menu-item v-t="['c:table:reload']" class="!text-xs" @click="reloadTables">
{{ $t('general.reload') }} {{ $t('general.reload') }}
</a-menu-item> </a-menu-item>
</template> </template>

Loading…
Cancel
Save