Merge pull request #3447 from nocodb/fix/3432-lookup-column

fix: lookup column rendering

packages/nc-gui-v2/components/cell/DatePicker.vue

@@ -75,4 +75,8 @@ const placeholder = computed(() => (isDateInvalid ? 'Invalid date' : ''))
   </a-date-picker>
 </template>
 
-<style scoped></style>
+<style scoped>
+:deep(.ant-picker-input > input[disabled]) {
+  @apply !text-current;
+}
+</style>

packages/nc-gui-v2/components/cell/DateTimePicker.vue

@@ -77,4 +77,8 @@ watch(
   </a-date-picker>
 </template>
 
-<style scoped></style>
+<style scoped>
+:deep(.ant-picker-input > input[disabled]) {
+  @apply !text-current;
+}
+</style>

packages/nc-gui-v2/components/cell/TimePicker.vue

@@ -87,4 +87,8 @@ watch(
   </a-time-picker>
 </template>
 
-<style scoped></style>
+<style scoped>
+:deep(.ant-picker-input > input[disabled]) {
+  @apply !text-current;
+}
+</style>

packages/nc-gui-v2/components/cell/YearPicker.vue

@@ -73,3 +73,9 @@ const placeholder = computed(() => (isYearInvalid ? 'Invalid year' : ''))
     <template #suffixIcon></template>
   </a-date-picker>
 </template>
+
+<style scoped>
+:deep(.ant-picker-input > input[disabled]) {
+  @apply !text-current;
+}
+</style>

packages/nc-gui-v2/components/virtual-cell/Lookup.vue

@@ -37,7 +37,7 @@ const lookupColumnMetaProps = useColumn(lookupColumn)
 </script>
 
 <template>
-  <div class="w-full h-full flex gap-1">
+  <div class="h-full flex gap-1">
     <template v-if="lookupColumn">
       <!-- Render virtual cell -->
       <div v-if="isVirtualCol(lookupColumn)">
@@ -62,7 +62,13 @@ const lookupColumnMetaProps = useColumn(lookupColumn)
         <div
           v-for="(v, i) of arrValue"
           :key="i"
-          :class="{ 'bg-gray-100 px-2 rounded-full': !lookupColumnMetaProps.isAttachment }"
+          class="min-w-max"
+          :class="{
+            'bg-gray-100 px-1 rounded-full flex-1': !lookupColumnMetaProps.isAttachment,
+            ' border-gray-200 rounded border-1': ![UITypes.Attachment, UITypes.MultiSelect, UITypes.SingleSelect].includes(
+              lookupColumn.uidt,
+            ),
+          }"
         >
           <SmartsheetCell :model-value="v" :column="lookupColumn" :edit-enabled="false" :virtual="true" />
         </div>

packages/nc-gui-v2/composables/useViewData.ts

@@ -162,7 +162,7 @@ export function useViewData(
   async function loadData(params: Parameters<Api<any>['dbViewRow']['list']>[4] = {}) {
     if ((!project?.value?.id || !meta?.value?.id || !viewMeta?.value?.id) && !isPublic.value) return
     const response = !isPublic.value
-      ? await api.dbViewRow.list('noco', project.value.id!, meta?.value.id!, viewMeta!.value.id, {
+      ? await api.dbViewRow.list('noco', project.value.id!, meta!.value.id!, viewMeta!.value.id, {
           ...params,
           ...(isUIAllowed('sortSync') ? {} : { sortArrJson: JSON.stringify(sorts.value) }),
           ...(isUIAllowed('filterSync') ? {} : { filterArrJson: JSON.stringify(nestedFilters.value) }),