diff --git a/packages/nc-gui/components/smartsheet/header/CellIcon.ts b/packages/nc-gui/components/smartsheet/header/CellIcon.ts
index a19f476908..fb28f4622c 100644
--- a/packages/nc-gui/components/smartsheet/header/CellIcon.ts
+++ b/packages/nc-gui/components/smartsheet/header/CellIcon.ts
@@ -126,7 +126,7 @@ export default defineComponent({
return () => {
if (!column.value) return null
- return h(renderIcon(column.value, abstractType.value), { class: 'text-grey mx-1 !text-sm' })
+ return h(renderIcon(column.value, abstractType.value), { class: 'text-grey mx-1 !text-xs' })
}
},
})
diff --git a/packages/nc-gui/components/smartsheet/header/CellIcon.vue b/packages/nc-gui/components/smartsheet/header/CellIcon.vue
deleted file mode 100644
index e69de29bb2..0000000000
diff --git a/packages/nc-gui/components/smartsheet/header/VirtualCellIcon.vue b/packages/nc-gui/components/smartsheet/header/VirtualCellIcon.ts
similarity index 59%
rename from packages/nc-gui/components/smartsheet/header/VirtualCellIcon.vue
rename to packages/nc-gui/components/smartsheet/header/VirtualCellIcon.ts
index c92a98a17f..850dadee6d 100644
--- a/packages/nc-gui/components/smartsheet/header/VirtualCellIcon.vue
+++ b/packages/nc-gui/components/smartsheet/header/VirtualCellIcon.ts
@@ -1,8 +1,8 @@
-
+}
+
+export default defineComponent({
+ name: 'VirtualCellIcon',
+ props: {
+ columnMeta: {
+ type: Object as PropType,
+ required: false,
+ },
+ },
+ setup(props) {
+ const columnMeta = toRef(props, 'columnMeta')
+
+ const column = inject(ColumnInj, ref(columnMeta)) as Ref
+
+ let relationColumn: ColumnType & { colOptions: LookupType }
+
+ watch(
+ column,
+ () => {
+ if (column && column.value) {
+ if (
+ isMm(column.value) ||
+ isHm(column.value) ||
+ isBt(column.value) ||
+ isLookup(column.value) ||
+ isRollup(column.value)
+ ) {
+ const meta = inject(MetaInj, ref())
-
-
-
+ relationColumn = meta.value?.columns?.find(
+ (c) => c.id === column.value?.colOptions?.fk_relation_column_id,
+ ) as ColumnType & {
+ colOptions: LinkToAnotherRecordType
+ }
+ }
+ }
+ },
+ { immediate: true },
+ )
+
+ return () => {
+ if (!column.value) return null
+
+ const { icon: Icon, color } = renderIcon(column.value, relationColumn)
+
+ return h(Icon, { class: `${color} mx-1 !text-xs` })
+ }
+ },
+})