Browse Source

chore(nc-gui): reset form to first step

pull/3669/head
braks 2 years ago committed by Raju Udava
parent
commit
9845cd7e78
  1. 5
      packages/nc-gui/composables/useSharedFormViewStore.ts
  2. 15
      packages/nc-gui/pages/[projectType]/form/[viewId]/index/survey.vue

5
packages/nc-gui/composables/useSharedFormViewStore.ts

@ -7,6 +7,7 @@ import { isString } from '@vueuse/core'
import { import {
SharedViewPasswordInj, SharedViewPasswordInj,
computed, computed,
createEventHook,
extractSdkResponseErrorMsg, extractSdkResponseErrorMsg,
message, message,
provide, provide,
@ -33,6 +34,7 @@ const [useProvideSharedFormStore, useSharedFormStore] = useInjectionState((share
const meta = ref<TableType>() const meta = ref<TableType>()
const columns = ref<(ColumnType & { required?: boolean; show?: boolean; label?: string })[]>() const columns = ref<(ColumnType & { required?: boolean; show?: boolean; label?: string })[]>()
const sharedViewMeta = ref<any>({}) const sharedViewMeta = ref<any>({})
const formResetHook = createEventHook<void>()
const { api, isLoading } = useApi() const { api, isLoading } = useApi()
@ -179,6 +181,8 @@ const [useProvideSharedFormStore, useSharedFormStore] = useInjectionState((share
if (secondsRemain.value < 0) { if (secondsRemain.value < 0) {
submitted.value = false submitted.value = false
formResetHook.trigger()
clearInterval(intvl) clearInterval(intvl)
} }
}, 1000) }, 1000)
@ -211,6 +215,7 @@ const [useProvideSharedFormStore, useSharedFormStore] = useInjectionState((share
passwordDlg, passwordDlg,
isLoading, isLoading,
sharedViewMeta, sharedViewMeta,
onReset: formResetHook.on,
} }
}, 'expanded-form-store') }, 'expanded-form-store')

15
packages/nc-gui/pages/[projectType]/form/[viewId]/index/survey.vue

@ -22,7 +22,7 @@ enum TransitionDirection {
const { md } = useBreakpoints(breakpointsTailwind) const { md } = useBreakpoints(breakpointsTailwind)
const { v$, formState, formColumns, submitForm, submitted, secondsRemain, sharedFormView } = useSharedFormStoreOrThrow() const { v$, formState, formColumns, submitForm, submitted, secondsRemain, sharedFormView, onReset } = useSharedFormStoreOrThrow()
const isTransitioning = ref(false) const isTransitioning = ref(false)
@ -46,7 +46,7 @@ const steps = computed(() => {
}, []) }, [])
}) })
const { index, goToPrevious, goToNext, isFirst, isLast } = useStepper(steps) const { index, goToPrevious, goToNext, isFirst, isLast, goTo } = useStepper(steps)
const field = computed(() => formColumns.value?.[index.value]) const field = computed(() => formColumns.value?.[index.value])
@ -119,6 +119,15 @@ function focusInput() {
} }
} }
function resetForm() {
v$.value.$reset()
submitted.value = false
transition(TransitionDirection.Right)
goTo(steps.value[0])
}
onReset(resetForm)
onKeyStroke(['ArrowLeft', 'ArrowDown'], goPrevious) onKeyStroke(['ArrowLeft', 'ArrowDown'], goPrevious)
onKeyStroke(['ArrowRight', 'ArrowUp', 'Enter', 'Space'], goNext) onKeyStroke(['ArrowRight', 'ArrowUp', 'Enter', 'Space'], goNext)
@ -276,7 +285,7 @@ onMounted(() => {
</p> </p>
<div v-if="sharedFormView?.submit_another_form" class="text-center"> <div v-if="sharedFormView?.submit_another_form" class="text-center">
<a-button type="primary" @click="submitted = false"> Submit Another Form</a-button> <button type="button" class="scaling-btn bg-opacity-100" @click="resetForm">Submit Another Form</button>
</div> </div>
</div> </div>
</div> </div>

Loading…
Cancel
Save