Remember input in LocalStorage fix #456

Signed-off-by: hamza mahjoubi <hamzamahjoubi221@gmail.com>
nextcloud · Oct 16, 2022 · b99fb6d · b99fb6d
1 parent a63e531
commit b99fb6d
Show file tree

Hide file tree

Showing 2 changed files with 62 additions and 2 deletions.
diff --git a/src/components/Questions/QuestionDropdown.vue b/src/components/Questions/QuestionDropdown.vue
@@ -97,6 +97,13 @@ export default {
 	},
 
 	mixins: [QuestionMixin],
+	props: {
+		dropDownState: {
+			type: Object,
+			required: false,
+			default: null,
+		},
+	},
 
 	data() {
 		return {
@@ -140,6 +147,16 @@ export default {
 	},
 
 	watch: {
+		dropDownState: {
+			handler(val) {
+				if (val) {
+					const prop = val.value
+					this.selectedOption = { id: prop.id, questionId: prop.questionId, text: prop.text }
+				}
+			},
+			deep: true,
+			immediate: true,
+		},
 		edit(edit) {
 			// When leaving edit mode, filter and delete empty options
 			if (!edit) {

diff --git a/src/views/Submit.vue b/src/views/Submit.vue
@@ -81,8 +81,10 @@
 					:max-string-lengths="maxStringLengths"
 					v-bind="question"
 					:values.sync="answers[question.id]"
+					:drop-down-state="formValuesForLocalStorage[question.id]"
 					@keydown.enter="onKeydownEnter"
-					@keydown.ctrl.enter="onKeydownCtrlEnter" />
+					@keydown.ctrl.enter="onKeydownCtrlEnter"
+					@update:values="addFormFieldToLocalStorage(question,answers[question.id],answerTypes[question.type])" />
 			</ul>
 			<input ref="submitButton"
 				class="primary"
@@ -150,6 +152,7 @@ export default {
 			maxStringLengths: loadState('forms', 'maxStringLengths'),
 			answerTypes,
 			answers: {},
+			formValuesForLocalStorage: [],
 			loading: false,
 			success: false,
 		}
@@ -209,7 +212,6 @@ export default {
 			return message
 		},
 	},
-
 	watch: {
 		hash() {
 			// If public view, abort. Should normally not occur.
@@ -223,6 +225,26 @@ export default {
 			SetWindowTitle(this.formTitle)
 		},
 	},
+	mounted() {
+		if (localStorage.getItem(`${this.shareHash}`)) {
+			this.formValuesForLocalStorage = JSON.parse(localStorage.getItem(`${this.shareHash}`))
+
+			this.formValuesForLocalStorage.forEach(answer => {
+				if (answer) {
+					switch (answer?.type) {
+					case 'QuestionMultiple':
+						this.answers[answer.id] = answer.value
+						break
+					case 'QuestionDate':
+						break
+					default:
+						this.answers[answer.id] = [answer.value]
+						break
+					}
+				}
+			})
+		}
+	},
 
 	beforeMount() {
 		// Public Views get their form by initial-state from parent. No fetch necessary.
@@ -257,11 +279,32 @@ export default {
 			// Using button-click event to not bypass validity-checks and use our specified behaviour
 			this.$refs.submitButton.click()
 		},
+		addFormFieldToLocalStorage(question, value, type) {
+			if (question.type === 'dropdown') {
+				for (const option in question.options) {
+					if (question.options[option].id === value[0]) {
+						this.formValuesForLocalStorage[question.id] = { id: question.id, value: question.options[option], type: type.component.name }
+						break
+					}
+				}
+			} else {
+				this.formValuesForLocalStorage[question.id] = { id: question.id, value, type: type.component.name }
+			}
+			const parsed = JSON.stringify(this.formValuesForLocalStorage)
+			localStorage.setItem(`${this.shareHash}`, parsed)
+
+		},
+		deleteFormFieldFromLocalStorage() {
+			this.formValuesForLocalStorage = []
+			const parsed = JSON.stringify(this.formValuesForLocalStorage)
+			localStorage.setItem('formFields', parsed)
+		},
 
 		/**
 		 * Submit the form after the browser validated it 🚀
 		 */
 		async onSubmit() {
+			this.deleteFormFieldFromLocalStorage()
 			this.loading = true
 
 			try {