diff --git a/packages/nc-gui/assets/style.scss b/packages/nc-gui/assets/style.scss index 3ba970b751..3997ab5763 100644 --- a/packages/nc-gui/assets/style.scss +++ b/packages/nc-gui/assets/style.scss @@ -79,6 +79,11 @@ main { width: 4px; height: 4px; } + + &::-webkit-scrollbar-track { + -webkit-border-radius: 10px; + border-radius: 10px; + } &::-webkit-scrollbar-track-piece { width: 0px; } @@ -86,11 +91,14 @@ main { @apply bg-transparent; } &::-webkit-scrollbar-thumb { + -webkit-border-radius: 10px; + border-radius: 10px; + width: 4px; - @apply bg-gray-200; + @apply bg-gray-300; } &::-webkit-scrollbar-thumb:hover { - @apply bg-gray-300; + @apply bg-gray-400; } } diff --git a/packages/nc-gui/components/dashboard/Sidebar.vue b/packages/nc-gui/components/dashboard/Sidebar.vue index fe8c5907bc..164c11e554 100644 --- a/packages/nc-gui/components/dashboard/Sidebar.vue +++ b/packages/nc-gui/components/dashboard/Sidebar.vue @@ -43,7 +43,7 @@ onUnmounted(() => {
diff --git a/packages/nc-gui/components/dashboard/TreeView/TableNode.vue b/packages/nc-gui/components/dashboard/TreeView/TableNode.vue index 9a4619e3b4..a356e29b38 100644 --- a/packages/nc-gui/components/dashboard/TreeView/TableNode.vue +++ b/packages/nc-gui/components/dashboard/TreeView/TableNode.vue @@ -20,6 +20,10 @@ const project = toRef(props, 'project') const table = toRef(props, 'table') const baseIndex = toRef(props, 'baseIndex') +const { openTable } = useTableNew({ + projectId: project.value.id!, +}) + const route = useRoute() const { isUIAllowed } = useRoles() @@ -34,9 +38,13 @@ useTableNew({ }) const projectRole = inject(ProjectRoleInj) +provide(SidebarTableInj, table) const { setMenuContext, openRenameTableDialog, duplicateTable } = inject(TreeViewInj)! +const { loadViews: _loadViews } = useViewsStore() +const { activeView } = storeToRefs(useViewsStore()) + // todo: temp const { projectTables } = storeToRefs(useTablesStore()) const tables = computed(() => projectTables.value.get(project.value.id!) ?? []) @@ -73,80 +81,128 @@ const { isSharedBase } = useProject() const canUserEditEmote = computed(() => { return isUIAllowed('tableIconEdit', { roles: projectRole?.value }) }) + +const isExpanded = ref(false) +const isLoading = ref(false) + +const onExpand = async () => { + if (isExpanded.value) { + isExpanded.value = false + return + } + + isLoading.value = true + try { + await _loadViews({ tableId: table.value.id, ignoreLoading: true }) + } catch (e) { + message.error(await extractSdkResponseErrorMsg(e)) + } finally { + isLoading.value = false + isExpanded.value = true + } +} + +watch( + () => activeView.value?.id, + () => { + if (!activeView.value) return + + if (activeView.value?.fk_model_id === table.value?.id) { + isExpanded.value = true + } + }, + { + immediate: true, + }, +) + +const isTableOpened = computed(() => { + return openedTableId.value === table.value?.id && activeView.value?.is_default +})