Migrate to nuxt settings page AND remove axios (#266)

* Settings pages migration

* remove axios and use opnFetch

* Make created form reactive (#267)

* Remove verify pages and axios lib

---------

Co-authored-by: Julien Nahum <julien@nahum.net>
This commit is contained in:
formsdev
2024-01-02 17:39:41 +05:30
committed by GitHub
parent 6fd2985ff5
commit 178424a184
27 changed files with 622 additions and 888 deletions

View File

@@ -76,7 +76,6 @@
</template>
<script>
import axios from 'axios'
import { inputProps, useFormInput } from './useFormInput.js'
import InputWrapper from './components/InputWrapper.vue'
import UploadedFile from './components/UploadedFile.vue'
@@ -193,13 +192,14 @@ export default {
}
if (this.moveToFormAssets) {
// Move file to permanent storage for form assets
axios.post('/api/open/forms/assets/upload', {
opnFetch('/open/forms/assets/upload', {
method: 'POST',
type: 'files',
url: file.name.split('.').slice(0, -1).join('.') + '_' + response.uuid + '.' + response.extension
}).then(moveFileResponse => {
}).then(moveFileResponseData => {
this.files.push({
file: file,
url: moveFileResponse.data.url,
url: moveFileResponseData.url,
src: this.getFileSrc(file)
})
this.loading = false

View File

@@ -107,7 +107,6 @@
</template>
<script>
import axios from 'axios'
import { inputProps, useFormInput } from './useFormInput.js'
import InputWrapper from './components/InputWrapper.vue'
import Modal from '../global/Modal.vue'
@@ -190,13 +189,14 @@ export default {
// Store file in s3
this.storeFile(this.file).then(response => {
// Move file to permanent storage for form assets
axios.post('/api/open/forms/assets/upload', {
opnFetch('/open/forms/assets/upload', {
method: 'POST',
url: this.file.name.split('.').slice(0, -1).join('.') + '_' + response.uuid + '.' + response.extension
}).then(moveFileResponse => {
}).then(moveFileResponseData => {
if (!this.multiple) {
this.files = []
}
this.compVal = moveFileResponse.data.url
this.compVal = moveFileResponseData.url
this.showUploadModal = false
this.loading = false
}).catch((error) => {

View File

@@ -16,7 +16,6 @@
</template>
<script>
import axios from 'axios'
export default {
components: { },
@@ -52,10 +51,10 @@ export default {
this.useAlert.confirm('Do you really want to delete this record?', this.deleteRecord)
},
async deleteRecord () {
axios.delete('/api/open/forms/' + this.form.id + '/records/' + this.rowid + '/delete').then(async (response) => {
if (response.data.type === 'success') {
opnFetch('/open/forms/' + this.form.id + '/records/' + this.rowid + '/delete', {method:'DELETE'}).then(async (data) => {
if (data.type === 'success') {
this.$emit('deleted')
this.useAlert.success(response.data.message)
this.useAlert.success(data.message)
} else {
this.useAlert.error('Something went wrong!')
}

View File

@@ -60,7 +60,6 @@
</template>
<script>
import axios from 'axios'
import clonedeep from 'clone-deep'
import draggable from 'vuedraggable'
import OpenFormButton from './OpenFormButton.vue'
@@ -293,8 +292,8 @@ export default {
return null
}
await this.recordsStore.loadRecord(
axios.get('/api/forms/' + this.form.slug + '/submissions/' + this.form.submission_id).then((response) => {
return { submission_id: this.form.submission_id, ...response.data.data }
opnFetch('/forms/' + this.form.slug + '/submissions/' + this.form.submission_id).then((data) => {
return { submission_id: this.form.submission_id, ...data.data }
})
)
return this.recordsStore.getById(this.form.submission_id)

View File

@@ -28,7 +28,6 @@
</template>
<script>
import axios from 'axios'
import { Line as LineChart } from 'vue-chartjs'
import {
Chart as ChartJS,

View File

@@ -72,7 +72,6 @@
</template>
<script>
import axios from 'axios'
import { computed } from 'vue'
import QuestionsEditor from './QuestionsEditor.vue'
@@ -175,9 +174,9 @@ export default {
},
async deleteFormTemplate () {
if (!this.template) return
axios.delete('/api/templates/' + this.template.id).then((response) => {
if (response.data.message) {
this.useAlert.success(response.data.message)
opnFetch('/templates/' + this.template.id, {method:'DELETE'}).then((data) => {
if (data.message) {
this.useAlert.success(data.message)
}
this.$router.push({ name: 'templates' })
this.templatesStore.remove(this.template)

View File

@@ -63,7 +63,6 @@
<script>
import { computed } from 'vue'
import axios from 'axios'
import { useAuthStore } from '../../../stores/auth';
import VTransition from '~/components/global/transitions/VTransition.vue'
@@ -98,8 +97,8 @@ export default {
methods: {
loadChangelogEntries () {
axios.get('/api/content/changelog/entries').then(response => {
this.changelogEntries = response.data.splice(0, 3)
opnFetch('/content/changelog/entries').then(data => {
this.changelogEntries = data.splice(0, 3)
})
}
}

View File

@@ -91,7 +91,6 @@
</template>
<script>
import axios from 'axios'
export default {
props: {
@@ -133,12 +132,12 @@ export default {
fetchGeneratedForm (generationId) {
// check every 4 seconds if form is generated
setTimeout(() => {
axios.get('/api/forms/ai/' + generationId).then(response => {
if (response.data.ai_form_completion.status === 'completed') {
this.useAlert.success(response.data.message)
this.$emit('form-generated', JSON.parse(response.data.ai_form_completion.result))
opnFetch('/forms/ai/' + generationId).then(data => {
if (data.ai_form_completion.status === 'completed') {
this.useAlert.success(data.message)
this.$emit('form-generated', JSON.parse(data.ai_form_completion.result))
this.$emit('close')
} else if (response.data.ai_form_completion.status === 'failed') {
} else if (data.ai_form_completion.status === 'failed') {
this.useAlert.error('Something went wrong, please try again.')
this.state = 'default'
this.loading = false

View File

@@ -140,7 +140,6 @@
<script>
import { computed } from 'vue'
import axios from 'axios'
import Dropdown from '~/components/global/Dropdown.vue'
import FormTemplateModal from '../../../open/forms/components/templates/FormTemplateModal.vue'

View File

@@ -73,7 +73,6 @@
<script>
import { computed } from 'vue'
import axios from 'axios'
import { useFormsStore } from '../../../../stores/forms'
export default {
@@ -103,10 +102,10 @@ export default {
regenerateLink(option) {
if (this.loadingNewLink) return
this.loadingNewLink = true
axios.put(this.formEndpoint.replace('{id}', this.form.id) + '/regenerate-link/' + option).then((response) => {
this.formsStore.addOrUpdate(response.data.form)
this.$router.push({name: 'forms-slug-show-share', params: {slug: response.data.form.slug}})
useAlert().success(response.data.message)
opnFetch(this.formEndpoint.replace('{id}', this.form.id) + '/regenerate-link/' + option, {method:'PUT'}).then((data) => {
this.formsStore.addOrUpdate(data.form)
this.$router.push({name: 'forms-slug-show-share', params: {slug: data.form.slug}})
useAlert().success(data.message)
this.loadingNewLink = false
}).finally(() => {
this.showGenerateFormLinkModal = false

View File

@@ -12,7 +12,6 @@
<script>
import { computed } from 'vue'
import axios from 'axios'
import TextInput from '../../forms/TextInput.vue'
import VButton from '~/components/global/VButton.vue'
@@ -81,8 +80,8 @@ export default {
if (this.form.busy) return
this.form.put('api/subscription/update-customer-details').then(() => {
this.loading = true
axios.get('/api/subscription/new/' + this.plan + '/' + (!this.yearly ? 'monthly' : 'yearly') + '/checkout/with-trial').then((response) => {
window.location = response.data.checkout_url
opnFetch('/subscription/new/' + this.plan + '/' + (!this.yearly ? 'monthly' : 'yearly') + '/checkout/with-trial').then((data) => {
window.location = data.checkout_url
}).catch((error) => {
useAlert().error(error.response.data.message)
}).finally(() => {

View File

@@ -109,7 +109,6 @@
<script>
import { computed } from 'vue'
import { useAuthStore } from '../../../stores/auth'
import axios from 'axios'
import MonthlyYearlySelector from './MonthlyYearlySelector.vue'
import CheckoutDetailsModal from './CheckoutDetailsModal.vue'
import CustomPlan from './CustomPlan.vue'
@@ -160,9 +159,9 @@ export default {
},
openBilling () {
this.billingLoading = true
axios.get('/api/subscription/billing-portal').then((response) => {
opnFetch('/subscription/billing-portal').then((data) => {
this.billingLoading = false
const url = response.data.portal_url
const url = data.portal_url
window.location = url
})
}