Browse Source

fix(gui): after save maintain the relation data in expanded-form

re #3566

Signed-off-by: Pranav C <pranavxc@gmail.com>
pull/3569/head
Pranav C 2 years ago committed by Raju Udava
parent
commit
08e1db23fd
  1. 5
      packages/nc-gui/components/smartsheet/expanded-form/Header.vue
  2. 25
      packages/nc-gui/components/smartsheet/expanded-form/index.vue
  3. 17
      packages/nc-gui/composables/useExpandedFormStore.ts

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

@ -5,7 +5,7 @@ const emit = defineEmits(['cancel'])
const { meta, isSqlView } = useSmartsheetStoreOrThrow() const { meta, isSqlView } = useSmartsheetStoreOrThrow()
const { commentsDrawer, primaryValue, save: _save } = useExpandedFormStoreOrThrow() const { commentsDrawer, primaryValue, save: _save, loadRow } = useExpandedFormStoreOrThrow()
const { isNew, syncLTARRefs } = useSmartsheetRowStoreOrThrow() const { isNew, syncLTARRefs } = useSmartsheetRowStoreOrThrow()
@ -15,6 +15,7 @@ const save = async () => {
if (isNew.value) { if (isNew.value) {
const data = await _save() const data = await _save()
await syncLTARRefs(data) await syncLTARRefs(data)
await loadRow()
} else { } else {
await _save() await _save()
} }
@ -46,7 +47,7 @@ const iconColor = '#1890ff'
<template #title> <template #title>
<div class="text-center w-full">{{ $t('general.reload') }}</div> <div class="text-center w-full">{{ $t('general.reload') }}</div>
</template> </template>
<mdi-reload class="cursor-pointer select-none text-gray-500" /> <mdi-reload class="cursor-pointer select-none text-gray-500" @click="loadRow" />
</a-tooltip> </a-tooltip>
<a-tooltip v-if="!isSqlView" placement="bottom"> <a-tooltip v-if="!isSqlView" placement="bottom">
<!-- Toggle comments draw --> <!-- Toggle comments draw -->

25
packages/nc-gui/components/smartsheet/expanded-form/index.vue

@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import type { ColumnType, TableType, ViewType } from 'nocodb-sdk' import type { TableType, ViewType } from 'nocodb-sdk'
import { isSystemColumn, isVirtualCol } from 'nocodb-sdk' import { isSystemColumn, isVirtualCol } from 'nocodb-sdk'
import type { Ref } from 'vue' import type { Ref } from 'vue'
import Cell from '../Cell.vue' import Cell from '../Cell.vue'
@ -10,14 +10,10 @@ import {
FieldsInj, FieldsInj,
IsFormInj, IsFormInj,
MetaInj, MetaInj,
NOCO,
computedInject, computedInject,
extractPkFromRow,
provide, provide,
ref, ref,
toRef, toRef,
useNuxtApp,
useProject,
useProvideExpandedFormStore, useProvideExpandedFormStore,
useProvideSmartsheetStore, useProvideSmartsheetStore,
useVModel, useVModel,
@ -53,25 +49,10 @@ const fields = computedInject(FieldsInj, (_fields) => {
provide(MetaInj, meta) provide(MetaInj, meta)
const { commentsDrawer, changedColumns, state: rowState, isNew } = useProvideExpandedFormStore(meta, row) const { commentsDrawer, changedColumns, state: rowState, isNew, loadRow } = useProvideExpandedFormStore(meta, row)
const { $api } = useNuxtApp()
if (props.loadRow) { if (props.loadRow) {
const { project } = useProject() await loadRow()
const { sharedView } = useSharedView() as Record<string, any>
row.value.row = await $api.dbTableRow.read(
NOCO,
(project?.value?.id || sharedView.value.view.project_id) as string,
meta.value.title,
extractPkFromRow(row.value.row, meta.value.columns as ColumnType[]),
)
row.value.oldRow = { ...row.value.row }
row.value.rowMeta = {}
} }
useProvideSmartsheetStore(ref({}) as Ref<ViewType>, meta) useProvideSmartsheetStore(ref({}) as Ref<ViewType>, meta)

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

@ -29,6 +29,8 @@ const [useProvideExpandedFormStore, useExpandedFormStore] = useInjectionState((m
const changedColumns = ref(new Set<string>()) const changedColumns = ref(new Set<string>())
const { project } = useProject() const { project } = useProject()
const rowStore = useProvideSmartsheetRowStore(meta, row) const rowStore = useProvideSmartsheetRowStore(meta, row)
const { sharedView } = useSharedView() as Record<string, any>
// todo // todo
// const activeView = inject(ActiveViewInj) // const activeView = inject(ActiveViewInj)
@ -174,6 +176,20 @@ const [useProvideExpandedFormStore, useExpandedFormStore] = useInjectionState((m
return data return data
} }
const loadRow = async () => {
const record = await $api.dbTableRow.read(
NOCO,
(project?.value?.id || sharedView.value.view.project_id) as string,
meta.value.title,
extractPkFromRow(row.value.row, meta.value.columns as ColumnType[]),
)
Object.assign(row.value, {
row: record,
oldRow: { ...record },
rowMeta: {},
})
}
return { return {
...rowStore, ...rowStore,
commentsOnly, commentsOnly,
@ -189,6 +205,7 @@ const [useProvideExpandedFormStore, useExpandedFormStore] = useInjectionState((m
primaryValue, primaryValue,
save, save,
changedColumns, changedColumns,
loadRow,
} }
}, 'expanded-form-store') }, 'expanded-form-store')

Loading…
Cancel
Save