diff --git a/client/components/open/forms/components/FormFieldsEditor.vue b/client/components/open/forms/components/FormFieldsEditor.vue index 72b5210..99e9200 100644 --- a/client/components/open/forms/components/FormFieldsEditor.vue +++ b/client/components/open/forms/components/FormFieldsEditor.vue @@ -246,7 +246,7 @@ export default { }, init () { if (this.route.name === 'forms-create' || this.route.name === 'forms-create-guest') { // Set Default fields - if (!this.form.properties) { + if (!this.form.properties || this.form.properties.length===0) { this.form.properties = this.getDefaultFields() } } else { diff --git a/client/pages/forms/[slug]/edit.vue b/client/pages/forms/[slug]/edit.vue index a4b5200..d9591d4 100644 --- a/client/pages/forms/[slug]/edit.vue +++ b/client/pages/forms/[slug]/edit.vue @@ -17,6 +17,7 @@ import { computed } from 'vue' import Breadcrumb from '~/components/global/Breadcrumb.vue' import FormEditor from "~/components/open/forms/components/FormEditor.vue"; +import {hash} from "~/lib/utils.js"; export default { name: 'EditForm', @@ -86,7 +87,7 @@ export default { } this.updatedForm = useForm(this.form) - this.formInitialHash = this.hashString(JSON.stringify(this.updatedForm.data())) + this.formInitialHash = hash(JSON.stringify(this.updatedForm.data())) if (this.updatedForm && (!this.updatedForm.notification_settings || Array.isArray(this.updatedForm.notification_settings))) { this.updatedForm.notification_settings = {} @@ -95,19 +96,7 @@ export default { methods: { isDirty () { - return this.formInitialHash && this.formInitialHash !== this.hashString(JSON.stringify(this.updatedForm.data())) - }, - hashString (str, seed = 0) { - let h1 = 0xdeadbeef ^ seed - let h2 = 0x41c6ce57 ^ seed - for (let i = 0, ch; i < str.length; i++) { - ch = str.charCodeAt(i) - h1 = Math.imul(h1 ^ ch, 2654435761) - h2 = Math.imul(h2 ^ ch, 1597334677) - } - h1 = Math.imul(h1 ^ (h1 >>> 16), 2246822507) ^ Math.imul(h2 ^ (h2 >>> 13), 3266489909) - h2 = Math.imul(h2 ^ (h2 >>> 16), 2246822507) ^ Math.imul(h1 ^ (h1 >>> 13), 3266489909) - return 4294967296 * (2097151 & h2) + (h1 >>> 0) + return this.formInitialHash && this.formInitialHash !== hash(JSON.stringify(this.updatedForm.data())) } } } diff --git a/client/pages/forms/create/guest.vue b/client/pages/forms/create/guest.vue index 6b53111..8810164 100644 --- a/client/pages/forms/create/guest.vue +++ b/client/pages/forms/create/guest.vue @@ -28,18 +28,20 @@ import FormEditor from "~/components/open/forms/components/FormEditor.vue" import QuickRegister from '~/components/pages/auth/components/QuickRegister.vue' import CreateFormBaseModal from '../../../components/pages/forms/create/CreateFormBaseModal.vue' import {initForm} from "~/composables/forms/initForm.js" -import {loadAllTemplates} from "~/stores/templates.js"; +import {fetchTemplate} from "~/stores/templates.js" import {fetchAllWorkspaces} from "~/stores/workspaces.js"; -definePageMeta({ - middleware: "auth" -}) const templatesStore = useTemplatesStore() const workingFormStore = useWorkingFormStore() const workspacesStore = useWorkspacesStore() const route = useRoute() -loadAllTemplates(templatesStore) + +// Fetch the template +if (route.query.template !== undefined && route.query.template) { + const {data} = await fetchTemplate(route.query.template) + templatesStore.save(data.value) +} // Store values const workspace = computed(() => workspacesStore.getCurrent) @@ -69,15 +71,14 @@ onMounted(() => { form.value = initForm() if (route.query.template !== undefined && route.query.template) { - const template = this.templatesStore.getByKey(route.query.template) + const template = templatesStore.getByKey(route.query.template) if (template && template.structure) { - form.value = useForm({...this.form.data(), ...template.structure}) + form.value = useForm({...form.value.data(), ...template.structure}) } } else { // No template loaded, ask how to start showInitialFormModal.value = true } - // this.closeAlert() stateReady.value = true }) @@ -87,7 +88,7 @@ const afterLogin = () => { fetchAllWorkspaces() setTimeout(() => { if (editor) { - editor.saveFormCreate() + editor.value.saveFormCreate() } }, 500) } diff --git a/client/pages/forms/create/index.vue b/client/pages/forms/create/index.vue index 2d8bc67..fa72a27 100644 --- a/client/pages/forms/create/index.vue +++ b/client/pages/forms/create/index.vue @@ -25,6 +25,8 @@ import {watch} from 'vue' import {initForm} from "~/composables/forms/initForm.js" import FormEditor from "~/components/open/forms/components/FormEditor.vue" import CreateFormBaseModal from '../../../components/pages/forms/create/CreateFormBaseModal.vue' +import {fetchTemplate} from "~/stores/templates.js" +import {hash} from "~/lib/utils.js" definePageMeta({ middleware: "auth" @@ -49,6 +51,12 @@ const workingFormStore = useWorkingFormStore() const workspacesStore = useWorkspacesStore() const formStore = useFormsStore() +// Fetch the template +if (route.query.template !== undefined && route.query.template) { + const {data} = await fetchTemplate(route.query.template) + templatesStore.save(data.value) +} + const { getCurrent: workspace, getAll: workspaces, @@ -77,22 +85,21 @@ onMounted(() => { } if (!formStore.allLoaded) { - formStore.load(workspace.value.id) + formStore.loadAll(workspace.value.id) } form.value = initForm({workspace_id: workspace.value?.id}) - formInitialHash.value = hashString(JSON.stringify(form.value.data())) - // if (this.$route.query.template !== undefined && this.$route.query.template) { - // const template = this.templatesStore.getByKey(this.$route.query.template) - // if (template && template.structure) { - // this.form = new Form({...this.form.data(), ...template.structure}) - // } - // } else { - // // No template loaded, ask how to start - // this.showInitialFormModal = true - // } - // this.closeAlert() - // this.workspacesStore.loadIfEmpty() + formInitialHash.value = hash(JSON.stringify(form.value.data())) + if (route.query.template !== undefined && route.query.template) { + const template = templatesStore.getByKey(route.query.template) + if (template && template.structure) { + form.value = useForm({...form.value.data(), ...template.structure}) + } + } else { + // No template loaded, ask how to start + showInitialFormModal.value = true + } + // workspacesStore.loadIfEmpty() }) // Methods @@ -101,21 +108,6 @@ const formGenerated = (newForm) => { } const isDirty = () => { - return !loading.value && formInitialHash.value && formInitialHash.value !== hashString(JSON.stringify(form.value.data())) -} - -const hashString = (str, seed = 0) => { - let h1 = 0xdeadbeef ^ seed - let h2 = 0x41c6ce57 ^ seed - for (let i = 0, ch; i < str.length; i++) { - ch = str.charCodeAt(i) - h1 = Math.imul(h1 ^ ch, 2654435761) - h2 = Math.imul(h2 ^ ch, 1597334677) - } - - h1 = Math.imul(h1 ^ (h1 >>> 16), 2246822507) ^ Math.imul(h2 ^ (h2 >>> 13), 3266489909) - h2 = Math.imul(h2 ^ (h2 >>> 16), 2246822507) ^ Math.imul(h1 ^ (h1 >>> 13), 3266489909) - - return 4294967296 * (2097151 & h2) + (h1 >>> 0) + return !loading.value && formInitialHash.value && formInitialHash.value !== hash(JSON.stringify(form.value.data())) } diff --git a/client/pages/templates/[slug].vue b/client/pages/templates/[slug].vue index 6e11d45..2476f84 100644 --- a/client/pages/templates/[slug].vue +++ b/client/pages/templates/[slug].vue @@ -18,7 +18,7 @@ Copy Template URL Use this template @@ -71,7 +71,7 @@
+ :to="createFormWithTemplateUrl"> Use this template
@@ -156,7 +156,7 @@ Copy the template and change it the way you like

- + Click here to copy this template and start customizing it. Change the questions, add new ones, choose colors and @@ -243,12 +243,9 @@ const breadcrumbs = computed(() => { return [{route: {name: 'templates'}, label: 'Templates'}, {label: template.value.name}] }) const relatedTemplates = computed(() => templatesStore.getByKey(template?.value?.related_templates)) -const canEditTemplate = computed(() => authStore.authenticated && template.value && (authStore.user.admin || authStore.user.template_editor || template.creator_id === authStore.user.id)) +const canEditTemplate = computed(() => authStore.check && template.value && (authStore.user.admin || authStore.user.template_editor || template.creator_id === authStore.user.id)) const createFormWithTemplateUrl = computed(() => { - if (authStore.authenticated) { - return '/forms/create?template=' + template?.value?.slug - } - return '/forms/create/guest?template=' + template?.value?.slug + return {name: (authStore.check) ? 'forms-create' : 'forms-create-guest', query: {template: template?.value?.slug}} }) // methods