Browse Source

chore(nc-gui): rename primary value to display value

pull/5117/head
Wing-Kam Wong 2 years ago
parent
commit
304502d538
  1. 4
      packages/nc-gui/components/smartsheet/expanded-form/Header.vue
  2. 4
      packages/nc-gui/components/smartsheet/header/Menu.vue
  3. 10
      packages/nc-gui/components/smartsheet/toolbar/FieldsMenu.vue
  4. 6
      packages/nc-gui/components/virtual-cell/BelongsTo.vue
  5. 6
      packages/nc-gui/components/virtual-cell/HasMany.vue
  6. 6
      packages/nc-gui/components/virtual-cell/ManyToMany.vue
  7. 4
      packages/nc-gui/components/virtual-cell/components/ListChildItems.vue
  8. 4
      packages/nc-gui/components/virtual-cell/components/ListItems.vue
  9. 6
      packages/nc-gui/composables/useExpandedFormStore.ts
  10. 22
      packages/nc-gui/composables/useLTARStore.ts

4
packages/nc-gui/components/smartsheet/expanded-form/Header.vue

@ -18,7 +18,7 @@ const route = useRoute()
const { meta, isSqlView } = useSmartsheetStoreOrThrow()
const { commentsDrawer, primaryValue, primaryKey, save: _save, loadRow } = useExpandedFormStoreOrThrow()
const { commentsDrawer, displayValue, primaryKey, save: _save, loadRow } = useExpandedFormStoreOrThrow()
const { isNew, syncLTARRefs, state } = useSmartsheetRowStoreOrThrow()
@ -99,7 +99,7 @@ const onConfirmDeleteRowClick = async () => {
{{ meta.title }}
</template>
<template v-if="primaryValue">: {{ primaryValue }}</template>
<template v-if="displayValue">: {{ displayValue }}</template>
</h5>
<div class="flex-1" />

4
packages/nc-gui/components/smartsheet/header/Menu.vue

@ -68,7 +68,7 @@ const deleteColumn = () =>
},
})
const setAsPrimaryValue = async () => {
const setAsDisplayValue = async () => {
try {
await $api.dbTableColumn.primaryColumnSet(column?.value?.id as string)
@ -280,7 +280,7 @@ const hideField = async () => {
</a-menu-item>
<a-divider class="!my-0" />
<a-menu-item v-if="(!virtual || column?.uidt === UITypes.Formula) && !column?.pv" @click="setAsPrimaryValue">
<a-menu-item v-if="(!virtual || column?.uidt === UITypes.Formula) && !column?.pv" @click="setAsDisplayValue">
<div class="nc-column-set-primary nc-header-menu-item">
<MdiStar class="text-primary" />

10
packages/nc-gui/components/smartsheet/toolbar/FieldsMenu.vue

@ -68,7 +68,7 @@ watch(
const numberOfHiddenFields = computed(() => filteredFieldList.value?.filter((field) => !field.show)?.length)
const gridPrimaryValueField = computed(() => {
const gridDisplayValueField = computed(() => {
if (activeView.value?.type !== ViewTypes.GRID) return null
const pvCol = Object.values(metaColumnById.value)?.find((col) => col?.pv)
return filteredFieldList.value?.find((field) => field.fk_column_id === pvCol?.id)
@ -194,7 +194,7 @@ useMenuCloseOnEsc(open)
<Draggable v-model="fields" item-key="id" @change="onMove($event)">
<template #item="{ element: field, index: index }">
<div
v-if="filteredFieldList.filter((el) => el !== gridPrimaryValueField).includes(field)"
v-if="filteredFieldList.filter((el) => el !== gridDisplayValueField).includes(field)"
:key="field.id"
class="px-2 py-1 flex items-center"
:data-testid="`nc-fields-menu-${field.title}`"
@ -220,10 +220,10 @@ useMenuCloseOnEsc(open)
</template>
<template v-if="activeView?.type === ViewTypes.GRID" #header>
<div
v-if="gridPrimaryValueField"
:key="`pv-${gridPrimaryValueField.id}`"
v-if="gridDisplayValueField"
:key="`pv-${gridDisplayValueField.id}`"
class="px-2 py-1 flex items-center"
:data-testid="`nc-fields-menu-${gridPrimaryValueField.title}`"
:data-testid="`nc-fields-menu-${gridDisplayValueField.title}`"
@click.stop
>
<a-tooltip placement="bottom">

6
packages/nc-gui/components/virtual-cell/BelongsTo.vue

@ -44,7 +44,7 @@ const listItemsDlg = ref(false)
const { state, isNew, removeLTARRef } = useSmartsheetRowStoreOrThrow()
const { loadRelatedTableMeta, relatedTablePrimaryValueProp, unlink } = useProvideLTARStore(
const { loadRelatedTableMeta, relatedTableDisplayValueProp, unlink } = useProvideLTARStore(
column as Ref<Required<ColumnType>>,
row,
isNew,
@ -85,8 +85,8 @@ useSelectedCellKeyupListener(active, (e: KeyboardEvent) => {
<template>
<div class="flex w-full chips-wrapper items-center" :class="{ active }">
<div class="chips flex items-center flex-1">
<template v-if="value && relatedTablePrimaryValueProp">
<VirtualCellComponentsItemChip :item="value" :value="value[relatedTablePrimaryValueProp]" @unlink="unlinkRef(value)" />
<template v-if="value && relatedTableDisplayValueProp">
<VirtualCellComponentsItemChip :item="value" :value="value[relatedTableDisplayValueProp]" @unlink="unlinkRef(value)" />
</template>
</div>

6
packages/nc-gui/components/virtual-cell/HasMany.vue

@ -40,7 +40,7 @@ const { isUIAllowed } = useUIPermission()
const { state, isNew, removeLTARRef } = useSmartsheetRowStoreOrThrow()
const { loadRelatedTableMeta, relatedTablePrimaryValueProp, unlink } = useProvideLTARStore(
const { loadRelatedTableMeta, relatedTableDisplayValueProp, unlink } = useProvideLTARStore(
column as Ref<Required<ColumnType>>,
row,
isNew,
@ -60,9 +60,9 @@ const localCellValue = computed<any[]>(() => {
const cells = computed(() =>
localCellValue.value.reduce((acc, curr) => {
if (!relatedTablePrimaryValueProp.value) return acc
if (!relatedTableDisplayValueProp.value) return acc
const value = curr[relatedTablePrimaryValueProp.value]
const value = curr[relatedTableDisplayValueProp.value]
if (!value) return acc

6
packages/nc-gui/components/virtual-cell/ManyToMany.vue

@ -42,7 +42,7 @@ const { isUIAllowed } = useUIPermission()
const { state, isNew, removeLTARRef } = useSmartsheetRowStoreOrThrow()
const { loadRelatedTableMeta, relatedTablePrimaryValueProp, unlink } = useProvideLTARStore(
const { loadRelatedTableMeta, relatedTableDisplayValueProp, unlink } = useProvideLTARStore(
column as Ref<Required<ColumnType>>,
row,
isNew,
@ -62,9 +62,9 @@ const localCellValue = computed<any[]>(() => {
const cells = computed(() =>
localCellValue.value.reduce((acc, curr) => {
if (!relatedTablePrimaryValueProp.value) return acc
if (!relatedTableDisplayValueProp.value) return acc
const value = curr[relatedTablePrimaryValueProp.value]
const value = curr[relatedTableDisplayValueProp.value]
if (!value) return acc

4
packages/nc-gui/components/virtual-cell/components/ListChildItems.vue

@ -37,7 +37,7 @@ const {
deleteRelatedRow,
loadChildrenList,
childrenListPagination,
relatedTablePrimaryValueProp,
relatedTableDisplayValueProp,
unlink,
getRelatedTableRowId,
relatedTableMeta,
@ -146,7 +146,7 @@ const onClick = (row: Row) => {
>
<div class="flex items-center">
<div class="flex-1 overflow-hidden min-w-0">
{{ row[relatedTablePrimaryValueProp] }}
{{ row[relatedTableDisplayValueProp] }}
<span class="text-gray-400 text-[11px] ml-1">(Primary key : {{ getRelatedTableRowId(row) }})</span>
</div>

4
packages/nc-gui/components/virtual-cell/components/ListItems.vue

@ -32,7 +32,7 @@ const {
childrenExcludedList,
loadChildrenExcludedList,
childrenExcludedListPagination,
relatedTablePrimaryValueProp,
relatedTableDisplayValueProp,
link,
getRelatedTableRowId,
relatedTableMeta,
@ -201,7 +201,7 @@ const activeRow = (vNode?: InstanceType<typeof Card>) => {
:class="{ 'nc-selected-row': selectedRowIndex === i }"
@click="linkRow(refRow)"
>
{{ refRow[relatedTablePrimaryValueProp] }}
{{ refRow[relatedTableDisplayValueProp] }}
<span class="hidden group-hover:(inline) text-gray-400 text-[11px] ml-1">
({{ $t('labels.primaryKey') }} : {{ getRelatedTableRowId(refRow) }})
</span>

6
packages/nc-gui/composables/useExpandedFormStore.ts

@ -49,7 +49,7 @@ const [useProvideExpandedFormStore, useExpandedFormStore] = useInjectionState((m
const { sharedView } = useSharedView()
// getters
const primaryValue = computed(() => {
const displayValue = computed(() => {
if (row?.value?.row) {
const col = meta?.value?.columns?.find((c) => c.pv)
@ -199,7 +199,7 @@ const [useProvideExpandedFormStore, useExpandedFormStore] = useInjectionState((m
addOrEditStackRow(row.value, isNewRow)
}
message.success(`${primaryValue.value || 'Row'} updated successfully.`)
message.success(`${displayValue.value || 'Row'} updated successfully.`)
changedColumns.value = new Set()
} catch (e: any) {
@ -237,7 +237,7 @@ const [useProvideExpandedFormStore, useExpandedFormStore] = useInjectionState((m
isYou,
commentsDrawer,
row,
primaryValue,
displayValue,
save,
changedColumns,
loadRow,

22
packages/nc-gui/composables/useLTARStore.ts

@ -94,14 +94,14 @@ const [useProvideLTARStore, useLTARStore] = useInjectionState(
await getMeta(colOptions.fk_related_model_id as string)
}
const relatedTablePrimaryValueProp = computed(() => {
const relatedTableDisplayValueProp = computed(() => {
return (relatedTableMeta.value?.columns?.find((c) => c.pv) || relatedTableMeta?.value?.columns?.[0])?.title || ''
})
const relatedTablePrimaryKeyProps = computed(() => {
return relatedTableMeta.value?.columns?.filter((c) => c.pk)?.map((c) => c.title) ?? []
})
const primaryValueProp = computed(() => {
const displayValueProp = computed(() => {
return (meta.value?.columns?.find((c: Required<ColumnType>) => c.pv) || relatedTableMeta?.value?.columns?.[0])?.title
})
@ -125,8 +125,8 @@ const [useProvideLTARStore, useLTARStore] = useInjectionState(
offset: childrenExcludedListPagination.size * (childrenExcludedListPagination.page - 1),
where:
childrenExcludedListPagination.query &&
`(${relatedTablePrimaryValueProp.value},like,${childrenExcludedListPagination.query})`,
fields: [relatedTablePrimaryValueProp.value, ...relatedTablePrimaryKeyProps.value],
`(${relatedTableDisplayValueProp.value},like,${childrenExcludedListPagination.query})`,
fields: [relatedTableDisplayValueProp.value, ...relatedTablePrimaryKeyProps.value],
} as RequestParams,
},
)
@ -142,8 +142,8 @@ const [useProvideLTARStore, useLTARStore] = useInjectionState(
offset: childrenExcludedListPagination.size * (childrenExcludedListPagination.page - 1),
where:
childrenExcludedListPagination.query &&
`(${relatedTablePrimaryValueProp.value},like,${childrenExcludedListPagination.query})`,
fields: [relatedTablePrimaryValueProp.value, ...relatedTablePrimaryKeyProps.value],
`(${relatedTableDisplayValueProp.value},like,${childrenExcludedListPagination.query})`,
fields: [relatedTableDisplayValueProp.value, ...relatedTablePrimaryKeyProps.value],
} as any,
)
} else {
@ -160,7 +160,7 @@ const [useProvideLTARStore, useLTARStore] = useInjectionState(
// todo: where clause is missing from type
where:
childrenExcludedListPagination.query &&
`(${relatedTablePrimaryValueProp.value},like,${childrenExcludedListPagination.query})`,
`(${relatedTableDisplayValueProp.value},like,${childrenExcludedListPagination.query})`,
} as any,
)
}
@ -183,7 +183,7 @@ const [useProvideLTARStore, useLTARStore] = useInjectionState(
limit: String(childrenListPagination.size),
offset: String(childrenListPagination.size * (childrenListPagination.page - 1)),
where:
childrenListPagination.query && `(${relatedTablePrimaryValueProp.value},like,${childrenListPagination.query})`,
childrenListPagination.query && `(${relatedTableDisplayValueProp.value},like,${childrenListPagination.query})`,
} as any,
)
} else {
@ -198,7 +198,7 @@ const [useProvideLTARStore, useLTARStore] = useInjectionState(
limit: String(childrenListPagination.size),
offset: String(childrenListPagination.size * (childrenListPagination.page - 1)),
where:
childrenListPagination.query && `(${relatedTablePrimaryValueProp.value},like,${childrenListPagination.query})`,
childrenListPagination.query && `(${relatedTableDisplayValueProp.value},like,${childrenListPagination.query})`,
} as any,
)
}
@ -320,13 +320,13 @@ const [useProvideLTARStore, useLTARStore] = useInjectionState(
return {
relatedTableMeta,
loadRelatedTableMeta,
relatedTablePrimaryValueProp,
relatedTableDisplayValueProp,
childrenExcludedList,
childrenList,
rowId,
childrenExcludedListPagination,
childrenListPagination,
primaryValueProp,
displayValueProp,
meta,
unlink,
link,

Loading…
Cancel
Save