feat: Reflect route change on stepper click, re-capture original form after section change to fix confirm dialog issue

This commit is contained in:
2026-02-07 09:04:02 +01:00
parent 56d77ebb89
commit 52b2bd4cfb
2 changed files with 16 additions and 3 deletions

View File

@@ -264,9 +264,15 @@ onUnmounted(() => {
watch( watch(
() => activeStepperItemIndex.value, () => activeStepperItemIndex.value,
async () => { async (newIdx, oldIdx) => {
await nextTick() await nextTick()
scrollToActiveStep() scrollToActiveStep()
// Emit navigate event when stepper index changes (from direct clicks)
// Note: navigateStepper() emits via its onNavigate callback, so button clicks are covered
if (newIdx !== oldIdx && oldIdx !== undefined) {
emit('navigate', { direction: newIdx > oldIdx ? 'forward' : 'backward', index: newIdx })
}
} }
) )
@@ -379,7 +385,6 @@ function findSubsectionByKey(subsectionKey: string): FormElementSubSectionDto |
async function handleNavigate(direction: 'forward' | 'backward') { async function handleNavigate(direction: 'forward' | 'backward') {
await navigateStepper(direction) await navigateStepper(direction)
emit('navigate', { direction, index: activeStepperItemIndex.value })
} }
function handleCloneElement(element: FormElementDto, position: number, subsectionKey: string) { function handleCloneElement(element: FormElementDto, position: number, subsectionKey: string) {

View File

@@ -102,7 +102,8 @@ const isReadOnly = computed(() => {
// Unsaved changes tracking // Unsaved changes tracking
const originalFormJson = ref<string>('') const originalFormJson = ref<string>('')
onMounted(() => { onMounted(async () => {
await nextTick()
originalFormJson.value = JSON.stringify(applicationForm.value) originalFormJson.value = JSON.stringify(applicationForm.value)
window.addEventListener('beforeunload', handleBeforeUnload) window.addEventListener('beforeunload', handleBeforeUnload)
}) })
@@ -161,6 +162,13 @@ watch(
{ deep: true } { deep: true }
) )
// Re-capture baseline after section navigation to absorb initialization effects
// (e.g. TheTable applying row presets, TheEditor normalizing content on mount)
watch(sectionIndex, async () => {
await nextTick()
originalFormJson.value = JSON.stringify(applicationForm.value)
})
async function onSave() { async function onSave() {
if (applicationForm.value?.id) { if (applicationForm.value?.id) {
const updated = await updateForm(applicationForm.value.id, applicationForm.value) const updated = await updateForm(applicationForm.value.id, applicationForm.value)