github
/
nocodb
mirror of https://github.com/nocodb/nocodb
1
0
Fork 0
Code Issues Releases Wiki Activity
Browse Source

fix(nc-gui): relation settings tables changes

pull/8367/head
Ramesh Mane 5 months ago
parent
e77fd0c1c4
commit
53015b1429
1 changed files with 37 additions and 21 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 58
      packages/nc-gui/components/smartsheet/column/LinkAdvancedOptions.vue

58
packages/nc-gui/components/smartsheet/column/LinkAdvancedOptions.vue
Unescape View File

@ -219,7 +219,7 @@ watch(pkColumn, () => {
> >
<a-select-option v-for="base of basesList" :key="base.title" :value="base.id"> <a-select-option v-for="base of basesList" :key="base.title" :value="base.id">
<div class="flex w-full items-center gap-2"> <div class="flex w-full items-center gap-2">
<div class="min-w-5 flex items-center justify-center"> <div class="flex items-center justify-center">
<GeneralProjectIcon class="nc-project-icon" /> <GeneralProjectIcon class="nc-project-icon" />
</div> </div>
<NcTooltip class="flex-1 truncate" show-on-truncate-only> <NcTooltip class="flex-1 truncate" show-on-truncate-only>
@ -243,7 +243,7 @@ watch(pkColumn, () => {
> >
<a-select-option v-for="table of sourceTables" :key="table.title" :value="table.id"> <a-select-option v-for="table of sourceTables" :key="table.title" :value="table.id">
<div class="flex w-full items-center gap-2"> <div class="flex w-full items-center gap-2">
<div class="min-w-5 flex items-center justify-center"> <div class="flex items-center justify-center">
<GeneralTableIcon :meta="table" class="nc-table-icon" /> <GeneralTableIcon :meta="table" class="nc-table-icon" />
</div> </div>
<NcTooltip class="flex-1 truncate" show-on-truncate-only> <NcTooltip class="flex-1 truncate" show-on-truncate-only>
@ -262,17 +262,18 @@ watch(pkColumn, () => {
placeholder="-select field-" placeholder="-select field-"
:filter-option="filterOption" :filter-option="filterOption"
:bordered="false" :bordered="false"
dropdown-class-name="nc-relation-settings-select nc-dropdown-ltar-source-column !text-xs" dropdown-class-name="nc-relation-settings-select nc-dropdown-ltar-source-column"
@change="onSourceColumnChange" @change="onSourceColumnChange"
> >
<a-select-option v-for="column of columns" :key="column.title" :value="column.id"> <a-select-option v-for="column of columns" :key="column.title" :value="column.id">
<div class="flex w-full items-center gap-2"> <div class="flex w-full items-center gap-2">
<div class="min-w-5 flex items-center justify-center"> <div class="min-w-4 flex items-center justify-center">
<SmartsheetHeaderVirtualCellIcon <SmartsheetHeaderVirtualCellIcon
v-if="isVirtualCol(column)" v-if="isVirtualCol(column)"
:column-meta="column" :column-meta="column"
class="nc-cell-icon"
></SmartsheetHeaderVirtualCellIcon> ></SmartsheetHeaderVirtualCellIcon>
<SmartsheetHeaderCellIcon v-else :column-meta="column"></SmartsheetHeaderCellIcon> <SmartsheetHeaderCellIcon v-else :column-meta="column" class="nc-cell-icon"></SmartsheetHeaderCellIcon>
</div> </div>
<NcTooltip class="flex-1 truncate" show-on-truncate-only> <NcTooltip class="flex-1 truncate" show-on-truncate-only>
<template #title>{{ column.title }}</template> <template #title>{{ column.title }}</template>
@ -303,7 +304,7 @@ watch(pkColumn, () => {
> >
<a-select-option v-for="base of basesList" :key="base.title" :value="base.id"> <a-select-option v-for="base of basesList" :key="base.title" :value="base.id">
<div class="flex w-full items-center gap-2"> <div class="flex w-full items-center gap-2">
<div class="min-w-5 flex items-center justify-center"> <div class="flex items-center justify-center">
<GeneralProjectIcon :color="getBaseIconColor(base, vModel.custom.junc_base_id)" class="nc-project-icon" /> <GeneralProjectIcon :color="getBaseIconColor(base, vModel.custom.junc_base_id)" class="nc-project-icon" />
</div> </div>
<NcTooltip class="flex-1 truncate" show-on-truncate-only> <NcTooltip class="flex-1 truncate" show-on-truncate-only>
@ -330,7 +331,7 @@ watch(pkColumn, () => {
> >
<a-select-option v-for="table of junctionTables" :key="table.title" :value="table.id"> <a-select-option v-for="table of junctionTables" :key="table.title" :value="table.id">
<div class="flex w-full items-center gap-2"> <div class="flex w-full items-center gap-2">
<div class="min-w-5 flex items-center justify-center"> <div class="flex items-center justify-center">
<GeneralTableIcon :meta="table" class="nc-table-icon" /> <GeneralTableIcon :meta="table" class="nc-table-icon" />
</div> </div>
<NcTooltip class="flex-1 truncate" show-on-truncate-only> <NcTooltip class="flex-1 truncate" show-on-truncate-only>
@ -360,15 +361,16 @@ watch(pkColumn, () => {
v-for="column of juncTableColumns" v-for="column of juncTableColumns"
:key="column.title" :key="column.title"
:value="column.id" :value="column.id"
:disabled="sourceColumn?.dt !== column.dt" :disabled="sourceColumn?.dt !== column.dt || vModel.custom.column_id === column.id"
> >
<div class="flex w-full items-center gap-2"> <div class="flex w-full items-center gap-2">
<div class="min-w-5 flex items-center justify-center"> <div class="min-w-4 flex items-center justify-center">
<SmartsheetHeaderVirtualCellIcon <SmartsheetHeaderVirtualCellIcon
v-if="isVirtualCol(column)" v-if="isVirtualCol(column)"
:column-meta="column" :column-meta="column"
class="nc-cell-icon"
></SmartsheetHeaderVirtualCellIcon> ></SmartsheetHeaderVirtualCellIcon>
<SmartsheetHeaderCellIcon v-else :column-meta="column"></SmartsheetHeaderCellIcon> <SmartsheetHeaderCellIcon v-else :column-meta="column" class="nc-cell-icon"></SmartsheetHeaderCellIcon>
</div> </div>
<NcTooltip class="flex-1 truncate" :show-on-truncate-only="sourceColumn?.dt === column.dt"> <NcTooltip class="flex-1 truncate" :show-on-truncate-only="sourceColumn?.dt === column.dt">
<template #title>{{ <template #title>{{
@ -403,15 +405,16 @@ watch(pkColumn, () => {
v-for="column of juncTableColumns" v-for="column of juncTableColumns"
:key="column.title" :key="column.title"
:value="column.id" :value="column.id"
:disabled="sourceColumn?.dt !== column.dt" :disabled="sourceColumn?.dt !== column.dt || vModel.custom.column_id === column.id"
> >
<div class="flex w-full items-center gap-2"> <div class="flex w-full items-center gap-2">
<div class="min-w-5 flex items-center justify-center"> <div class="min-w-4 flex items-center justify-center">
<SmartsheetHeaderVirtualCellIcon <SmartsheetHeaderVirtualCellIcon
v-if="isVirtualCol(column)" v-if="isVirtualCol(column)"
:column-meta="column" :column-meta="column"
class="nc-cell-icon"
></SmartsheetHeaderVirtualCellIcon> ></SmartsheetHeaderVirtualCellIcon>
<SmartsheetHeaderCellIcon v-else :column-meta="column"></SmartsheetHeaderCellIcon> <SmartsheetHeaderCellIcon v-else :column-meta="column" class="nc-cell-icon"></SmartsheetHeaderCellIcon>
</div> </div>
<NcTooltip class="flex-1 truncate" :show-on-truncate-only="sourceColumn?.dt === column.dt"> <NcTooltip class="flex-1 truncate" :show-on-truncate-only="sourceColumn?.dt === column.dt">
<template #title>{{ <template #title>{{
@ -456,7 +459,7 @@ watch(pkColumn, () => {
> >
<a-select-option v-for="base of basesList" :key="base.title" :value="base.id"> <a-select-option v-for="base of basesList" :key="base.title" :value="base.id">
<div class="flex w-full items-center gap-2"> <div class="flex w-full items-center gap-2">
<div class="min-w-5 flex items-center justify-center"> <div class="flex items-center justify-center">
<GeneralProjectIcon :color="getBaseIconColor(base, vModel.custom.base_id)" class="nc-project-icon" /> <GeneralProjectIcon :color="getBaseIconColor(base, vModel.custom.base_id)" class="nc-project-icon" />
</div> </div>
<NcTooltip class="flex-1 truncate" show-on-truncate-only> <NcTooltip class="flex-1 truncate" show-on-truncate-only>
@ -481,7 +484,7 @@ watch(pkColumn, () => {
> >
<a-select-option v-for="table of refTables" :key="table.title" :value="table.id"> <a-select-option v-for="table of refTables" :key="table.title" :value="table.id">
<div class="flex w-full items-center gap-2"> <div class="flex w-full items-center gap-2">
<div class="min-w-5 flex items-center justify-center"> <div class="flex items-center justify-center">
<GeneralTableIcon :meta="table" class="nc-table-icon" /> <GeneralTableIcon :meta="table" class="nc-table-icon" />
</div> </div>
<NcTooltip class="flex-1 truncate" show-on-truncate-only> <NcTooltip class="flex-1 truncate" show-on-truncate-only>
@ -500,22 +503,23 @@ watch(pkColumn, () => {
placeholder="-select field-" placeholder="-select field-"
:filter-option="filterOption" :filter-option="filterOption"
:bordered="false" :bordered="false"
dropdown-class-name="nc-relation-settings-select nc-dropdown-ltar-child-column !text-xs" dropdown-class-name="nc-relation-settings-select nc-dropdown-ltar-child-column"
@change="onDataTypeChange" @change="onDataTypeChange"
> >
<a-select-option <a-select-option
v-for="column of refTableColumns" v-for="column of refTableColumns"
:key="column.title" :key="column.title"
:value="column.id" :value="column.id"
:disabled="sourceColumn?.dt !== column.dt" :disabled="sourceColumn?.dt !== column.dt || vModel.custom.column_id === column.id"
> >
<div class="flex w-full items-center gap-2"> <div class="flex w-full items-center gap-2">
<div class="min-w-5 flex items-center justify-center"> <div class="min-w-4 flex items-center justify-center">
<SmartsheetHeaderVirtualCellIcon <SmartsheetHeaderVirtualCellIcon
v-if="isVirtualCol(column)" v-if="isVirtualCol(column)"
:column-meta="column" :column-meta="column"
class="nc-cell-icon"
></SmartsheetHeaderVirtualCellIcon> ></SmartsheetHeaderVirtualCellIcon>
<SmartsheetHeaderCellIcon v-else :column-meta="column"></SmartsheetHeaderCellIcon> <SmartsheetHeaderCellIcon v-else :column-meta="column" class="nc-cell-icon"></SmartsheetHeaderCellIcon>
</div> </div>
<NcTooltip class="flex-1 truncate" :show-on-truncate-only="sourceColumn?.dt === column.dt"> <NcTooltip class="flex-1 truncate" :show-on-truncate-only="sourceColumn?.dt === column.dt">
<template #title>{{ <template #title>{{
@ -558,7 +562,7 @@ watch(pkColumn, () => {
@apply px-4 text-xs; @apply px-4 text-xs;
.ant-select-selection-search-input { .ant-select-selection-search-input {
@apply pl-2; @apply pl-1;
} }
} }
:deep(.ant-select-arrow) { :deep(.ant-select-arrow) {
@ -570,7 +574,7 @@ watch(pkColumn, () => {
// } // }
.nc-project-icon { .nc-project-icon {
@apply !grayscale; @apply !grayscale flex-none;
filter: grayscale(100%) brightness(115%) !important; filter: grayscale(100%) brightness(115%) !important;
} }
@ -617,13 +621,25 @@ watch(pkColumn, () => {
<style lang="scss"> <style lang="scss">
.nc-relation-settings-table { .nc-relation-settings-table {
.nc-table-icon { .nc-table-icon {
@apply flex-none !w-4 !mx-0;
path, path,
rect { rect {
stroke: currentColor !important; stroke: currentColor !important;
} }
} }
.nc-cell-icon {
@apply !mx-0 flex-none;
}
} }
.nc-relation-settings-select.ant-select-dropdown.nc-select-dropdown { .nc-relation-settings-select.ant-select-dropdown.nc-select-dropdown {
@apply !rounded-md; @apply !rounded-md;
.ant-select-item {
@apply text-xs;
.nc-cell-icon {
@apply !mx-0 flex-none;
}
}
} }
</style> </style>

Write Preview
Loading…
Cancel
Save