Save Form Properties

Signed-off-by: Jonas Rittershofer <jotoeri@users.noreply.github.com>

src/mixins/ViewsMixin.js

@@ -19,6 +19,10 @@
  * along with this program. If not, see <http://www.gnu.org/licenses/>.
  */
 
+import { generateUrl } from '@nextcloud/router'
+import { showError } from '@nextcloud/dialogs'
+import axios from '@nextcloud/axios'
+
 export default {
 	props: {
 		hash: {
@@ -30,4 +34,21 @@ export default {
 			required: true,
 		},
 	},
+
+	methods: {
+		async saveFormProperty(key) {
+			try {
+				// TODO: add loading status feedback ?
+				await axios.post(generateUrl('/apps/forms/api/v1/form/update/'), {
+					id: this.form.id,
+					keyValuePairs: {
+						[key]: this.form[key],
+					},
+				})
+			} catch (error) {
+				showError(t('forms', 'Error while saving form'))
+				console.error(error)
+			}
+		},
+	},
 }

src/views/Create.vue

@@ -237,21 +237,6 @@ export default {
 			this.saveForm()
 		}, 200),
 
-		async saveFormProperty(key) {
-			try {
-				// TODO: add loading status feedback ?
-				await axios.post(generateUrl('/apps/forms/api/v1/form/update'), {
-					id: this.form.id,
-					keyValuePairs: {
-						[key]: this.form[key],
-					},
-				})
-			} catch (error) {
-				showError(t('forms', 'Error while saving form'))
-				console.error(error)
-			}
-		},
-
 		/**
 		 * Title & description save methods
 		 */

src/views/Sidebar.vue

@@ -31,7 +31,8 @@
 				v-model="form.isAnonymous"
 
 				type="checkbox"
-				class="checkbox">
+				class="checkbox"
+				@change="onAnonChange">
 			<label for="isAnonymous" class="title">
 				{{ t('forms', 'Anonymous form') }}
 			</label>
@@ -40,7 +41,8 @@
 				v-model="form.submitOnce"
 				:disabled="form.access.type === 'public' || form.isAnonymous"
 				type="checkbox"
-				class="checkbox">
+				class="checkbox"
+				@change="onSubmOnceChange">
 			<label for="submitOnce" class="title">
 				<span>{{ t('forms', 'Only allow one submission per user') }}</span>
 			</label>
@@ -57,7 +59,8 @@
 			<DatetimePicker v-show="formExpires"
 				id="expiresDatetimePicker"
 				v-model="form.expires"
-				v-bind="expirationDatePicker" />
+				v-bind="expirationDatePicker"
+				@change="onExpiresChange" />
 		</div>
 
 		<div class="configBox">
@@ -69,7 +72,8 @@
 				v-model="form.access.type"
 				type="radio"
 				value="registered"
-				class="radio">
+				class="radio"
+				@change="onAccessChange">
 			<label for="registered" class="title">
 				<div class="title icon-group" />
 				<span>{{ t('forms', 'Registered users only') }}</span>
@@ -79,7 +83,8 @@
 				v-model="form.access.type"
 				type="radio"
 				value="public"
-				class="radio">
+				class="radio"
+				@change="onAccessChange">
 			<label for="public" class="title">
 				<div class="title icon-link" />
 				<span>{{ t('forms', 'Public access') }}</span>
@@ -89,7 +94,8 @@
 				v-model="form.access.type"
 				type="radio"
 				value="selected"
-				class="radio">
+				class="radio"
+				@change="onAccessChange">
 			<label for="selected" class="title">
 				<div class="title icon-shared" />
 				<span>{{ t('forms', 'Only shared') }}</span>
@@ -159,6 +165,7 @@ export default {
 			handler: function() {
 				if (!this.formExpires) {
 					this.form.expires = 0
+					this.onExpiresChange()
 				} else {
 					this.form.expires = moment().unix() + 3600 // Expires in one hour.
 				}
@@ -219,6 +226,22 @@ export default {
 		onToggle() {
 			this.opened = !this.opened
 		},
+
+		/**
+		 * Save Form-Properties
+		 */
+		onAnonChange() {
+			this.saveFormProperty('isAnonymous')
+		},
+		onSubmOnceChange() {
+			this.saveFormProperty('submitOnce')
+		},
+		onAccessChange() {
+			this.saveFormProperty('access')
+		},
+		onExpiresChange() {
+			this.saveFormProperty('expires')
+		},
 	},
 }
 </script>