mirror of
https://github.com/nocodb/nocodb.git
synced 2026-05-01 11:47:01 +00:00
fix: some review changes
This commit is contained in:
@@ -296,44 +296,47 @@ if (!props.isNewWsPage) {
|
||||
{{ $t('general.integrations') }}
|
||||
</div>
|
||||
</template>
|
||||
<div class="nc-integrations-tabs-wrapper h-full flex flex-col">
|
||||
<NcTabs v-model:active-key="integrationsSubTab" class="nc-nested-tabs flex-1 min-h-0">
|
||||
<template #leftExtra>
|
||||
<div class="w-3"></div>
|
||||
</template>
|
||||
<a-tab-pane key="integrations" class="w-full">
|
||||
<template #tab>
|
||||
<div class="tab-title">
|
||||
<GeneralIcon icon="integration" />
|
||||
{{ $t('general.integrations') }}
|
||||
</div>
|
||||
</template>
|
||||
<div class="h-full overflow-auto nc-scrollbar-thin">
|
||||
<WorkspaceIntegrationsTab show-filter />
|
||||
<div class="nc-integrations-layout h-full flex">
|
||||
<!-- Left: vertical nav -->
|
||||
<div class="nc-integrations-sidebar flex flex-col gap-1 pl-6 pr-2 pt-6 w-48 flex-shrink-0">
|
||||
<div
|
||||
class="nc-integrations-nav-item"
|
||||
:class="{ active: integrationsSubTab === 'integrations' }"
|
||||
@click="integrationsSubTab = 'integrations'"
|
||||
>
|
||||
<GeneralIcon icon="integration" class="h-4 w-4 flex-none" />
|
||||
<span>{{ $t('general.integrations') }}</span>
|
||||
</div>
|
||||
<div
|
||||
class="nc-integrations-nav-item"
|
||||
:class="{ active: integrationsSubTab === 'connections' }"
|
||||
@click="integrationsSubTab = 'connections'"
|
||||
>
|
||||
<GeneralIcon icon="gitCommit" class="h-4 w-4 flex-none" />
|
||||
<span>{{ $t('general.connections') }}</span>
|
||||
<div
|
||||
v-if="integrationPaginationData?.totalRows"
|
||||
class="tab-info flex-none ml-auto"
|
||||
:class="{
|
||||
'bg-primary-selected': integrationsSubTab === 'connections',
|
||||
'bg-nc-bg-gray-extralight': integrationsSubTab !== 'connections',
|
||||
}"
|
||||
>
|
||||
{{ integrationPaginationData.totalRows }}
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="connections" class="w-full">
|
||||
<template #tab>
|
||||
<div class="tab-title">
|
||||
<GeneralIcon icon="gitCommit" />
|
||||
{{ $t('general.connections') }}
|
||||
<div
|
||||
v-if="integrationPaginationData?.totalRows"
|
||||
class="tab-info flex-none"
|
||||
:class="{
|
||||
'bg-primary-selected': integrationsSubTab === 'connections',
|
||||
'bg-nc-bg-gray-extralight': integrationsSubTab !== 'connections',
|
||||
}"
|
||||
>
|
||||
{{ integrationPaginationData.totalRows }}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<div class="p-6 h-full overflow-auto nc-scrollbar-thin">
|
||||
<WorkspaceIntegrationsConnectionsTab />
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
</NcTabs>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Right: content -->
|
||||
<div class="flex-1 min-w-0 flex flex-col">
|
||||
<div v-if="integrationsSubTab === 'integrations'" class="h-full overflow-auto nc-scrollbar-thin">
|
||||
<WorkspaceIntegrationsTab show-filter />
|
||||
</div>
|
||||
<div v-else-if="integrationsSubTab === 'connections'" class="p-6 h-full overflow-auto nc-scrollbar-thin">
|
||||
<WorkspaceIntegrationsConnectionsTab />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<WorkspaceIntegrationsEditOrAdd />
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
@@ -430,22 +433,17 @@ if (!props.isNewWsPage) {
|
||||
@apply flex flex-row items-center gap-x-2 py-[1px];
|
||||
}
|
||||
|
||||
// Integrations sub-tabs: propagate height through Ant tabs internal DOM
|
||||
.nc-integrations-tabs-wrapper {
|
||||
:deep(.ant-tabs) {
|
||||
@apply flex flex-col;
|
||||
.nc-integrations-nav-item {
|
||||
@apply flex items-center gap-2 px-3 py-1.5 rounded-md cursor-pointer
|
||||
text-bodyDefaultSm text-nc-content-gray-subtle
|
||||
transition-colors;
|
||||
|
||||
&:hover {
|
||||
@apply bg-nc-bg-gray-medium;
|
||||
}
|
||||
|
||||
:deep(.ant-tabs-content-holder) {
|
||||
@apply flex-1 min-h-0;
|
||||
}
|
||||
|
||||
:deep(.ant-tabs-content) {
|
||||
@apply h-[calc(100vh-var(--topbar-height)-41px-44px)];
|
||||
}
|
||||
|
||||
:deep(.ant-tabs-tabpane) {
|
||||
@apply h-[calc(100vh-var(--topbar-height)-41px-44px)];
|
||||
&.active {
|
||||
@apply bg-nc-bg-gray-medium text-nc-content-brand font-medium;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user