Files
InvoiceShelf/resources/scripts/admin/views/installation/Step4VerifyDomain.vue
agencetwogether 3b61440e1f Complete dashboard translations & small UI improvements (#69)
* fix dropdown action Estimate Dashboard and fix translating full Dasboard page

* Update app.php

* fix locale in app.php config

* Wizard install with translation, customer portal with translation, and fixing hardcoding strings to get translation

* fixes asked to review

* fixes pint

---------

Co-authored-by: Max <contact@agencetwogether.fr>
Co-authored-by: Darko Gjorgjijoski <5760249+gdarko@users.noreply.github.com>
2024-06-05 12:07:46 +02:00

107 lines
2.9 KiB
Vue

<template>
<BaseWizardStep
:title="$t('wizard.verify_domain.title')"
:description="$t('wizard.verify_domain.desc')"
>
<div class="w-full md:w-2/3">
<BaseInputGroup
:label="$t('wizard.verify_domain.app_domain')"
:error="v$.app_domain.$error && v$.app_domain.$errors[0].$message"
required
>
<BaseInput
v-model="formData.app_domain"
:invalid="v$.app_domain.$error"
type="text"
@input="v$.app_domain.$touch()"
/>
</BaseInputGroup>
</div>
<p class="mt-4 mb-0 text-sm text-gray-600">{{ $t('wizard.verify_domain.notes.notes') }}</p>
<ul class="w-full text-gray-600 list-disc list-inside">
<li class="text-sm leading-8">
{{ $t('wizard.verify_domain.notes.not_contain') }}
<b class="inline-block px-1 bg-gray-100 rounded-sm">https://</b> {{ $t('wizard.verify_domain.notes.or') }}
<b class="inline-block px-1 bg-gray-100 rounded-sm">http</b> {{ $t('wizard.verify_domain.notes.in_front') }}
</li>
<li class="text-sm leading-8">
{{ $t('wizard.verify_domain.notes.if_you') }}
<b class="inline-block px-1 bg-gray-100">localhost:8080</b>
</li>
</ul>
<BaseButton
:loading="isSaving"
:disabled="isSaving"
class="mt-8"
@click="verifyDomain"
>
{{ $t('wizard.verify_domain.verify_now') }}
</BaseButton>
</BaseWizardStep>
</template>
<script setup>
import { required, helpers } from '@vuelidate/validators'
import useVuelidate from '@vuelidate/core'
import { ref, inject, computed, reactive } from 'vue'
import { useInstallationStore } from '@/scripts/admin/stores/installation'
import { useNotificationStore } from '@/scripts/stores/notification'
import { useI18n } from 'vue-i18n'
const emit = defineEmits(['next'])
const formData = reactive({
app_domain: window.location.origin.replace(/(^\w+:|^)\/\//, ''),
})
const isSaving = ref(false)
const { t } = useI18n()
const utils = inject('utils')
const isUrl = (value) => utils.checkValidDomainUrl(value)
const installationStore = useInstallationStore()
const notificationStore = useNotificationStore()
const rules = {
app_domain: {
required: helpers.withMessage(t('validation.required'), required),
isUrl: helpers.withMessage(t('validation.invalid_domain_url'), isUrl),
},
}
const v$ = useVuelidate(
rules,
computed(() => formData)
)
async function verifyDomain() {
v$.value.$touch()
if (v$.value.$invalid) {
return true
}
isSaving.value = true
try {
await installationStore.setInstallationDomain(formData)
await installationStore.installationLogin()
let driverRes = await installationStore.checkAutheticated()
if (driverRes.data) {
emit('next', 4)
}
isSaving.value = false
} catch (e) {
notificationStore.showNotification({
type: 'error',
message: t('wizard.verify_domain.failed'),
})
isSaving.value = false
}
}
</script>