start translating the form

pull/105/head
Alex Turchyn 2 years ago
parent 61b79d5b24
commit ceb052b158

@ -7,13 +7,13 @@
:height="30"
/>
<span>
Form has been completed!
{{ t('form_has_been_completed') }}
</span>
</p>
<div class="space-y-3 mt-5">
<button
v-if="canSendEmail && !isDemo"
class="white-button flex items-center space-x-1 w-full"
class="white-button !h-auto flex items-center space-x-1 w-full"
:disabled="isSendingCopy"
@click.prevent="sendCopyToEmail"
>
@ -23,7 +23,7 @@
/>
<IconMail v-else />
<span>
Send copy via email
{{ t('send_copy_via_email') }}
</span>
</button>
<button
@ -37,7 +37,7 @@
/>
<IconDownload v-else />
<span>
Download
{{ t('download') }}
</span>
</button>
<a
@ -58,17 +58,17 @@
>
<IconLogin />
<span>
Create a Free Account
{{ t('create_a_free_account') }}
</span>
</a>
</div>
<div class="text-center mt-4">
Signed with
{{ t('signed_with') }}
<a
href="https://www.docuseal.co"
target="_blank"
class="underline"
>DocuSeal</a> - open source documents software
>DocuSeal</a> - {{ t('open_source_documents_software') }}
</div>
</div>
</template>
@ -86,7 +86,7 @@ export default {
IconLogin,
IconDownload
},
inject: ['baseUrl'],
inject: ['baseUrl', 't'],
props: {
submitterSlug: {
type: String,

@ -29,7 +29,7 @@
{{ message }}
</div>
<div class="text-xs">
<span class="font-medium">Click to upload</span> or drag and drop files
<span class="font-medium">{{ t('click_to_upload') }}</span> {{ t('or_drag_and_drop_files') }}
</div>
</div>
</div>
@ -55,7 +55,7 @@ export default {
IconCloudUpload,
IconInnerShadowTop
},
inject: ['baseUrl'],
inject: ['baseUrl', 't'],
props: {
message: {
type: String,

@ -13,7 +13,7 @@
class="btn btn-neutral flex text-white absolute rounded-none border-x-0 md:border md:rounded-full bottom-0 w-full md:mb-4 text-base"
@click.prevent="isFormVisible = true"
>
Submit Form
{{ t('submit_form') }}
<IconArrowsDiagonal
class="absolute right-0 mr-4"
:width="20"
@ -63,7 +63,7 @@
:for="currentField.uuid"
class="label text-2xl mb-2"
>{{ currentField.name }}
<template v-if="!currentField.required">(optional)</template>
<template v-if="!currentField.required">({{ t('optional') }})</template>
</label>
<div
v-else
@ -75,7 +75,7 @@
v-model="values[currentField.uuid]"
class="base-input !text-2xl w-full"
:required="currentField.required"
:placeholder="`Type here...${currentField.required ? '' : ' (optional)'}`"
:placeholder="`${t('type_here')}...${currentField.required ? '' : ` (${t('optional')})`}`"
type="text"
:name="`values[${currentField.uuid}]`"
@focus="$refs.areas.scrollIntoField(currentField)"
@ -88,7 +88,7 @@
:for="currentField.uuid"
class="label text-2xl mb-2"
>{{ currentField.name }}
<template v-if="!currentField.required">(optional)</template>
<template v-if="!currentField.required">({{ t('optional') }})</template>
</label>
<div
v-else
@ -112,7 +112,7 @@
:for="currentField.uuid"
class="label text-2xl mb-2"
>{{ currentField.name }}
<template v-if="!currentField.required">(optional)</template>
<template v-if="!currentField.required">({{ t('optional') }})</template>
</label>
<div
v-else
@ -130,7 +130,7 @@
value=""
:selected="!values[currentField.uuid]"
>
Select your option
{{ t('select_your_option') }}
</option>
<option
v-for="(option, index) in currentField.options"
@ -148,7 +148,7 @@
:for="currentField.uuid"
class="label text-2xl mb-2"
>{{ currentField.name }}
<template v-if="!currentField.required">(optional)</template>
<template v-if="!currentField.required">({{ t('optional') }})</template>
</label>
<div class="flex w-full">
<div class="space-y-3.5 mx-auto">
@ -196,7 +196,7 @@
>
<template v-if="isAnonymousChecboxes">
<span class="text-xl">
Complete hightlighted checkboxes and click <span class="font-semibold">{{ stepFields.length === currentStep + 1 ? 'submit' : 'next' }}</span>.
{{ t('complete_hightlighted_checkboxes_and_click') }} <span class="font-semibold">{{ stepFields.length === currentStep + 1 ? t('submit') : t('next') }}</span>.
</span>
<input
v-for="field in currentStepFields"
@ -278,10 +278,10 @@
class="mr-1 animate-spin"
/>
<span v-if="stepFields.length === currentStep + 1">
Submit
{{ t('submit') }}
</span>
<span v-else>
Next
{{ t('next') }}
</span><span
v-if="isSubmitting"
class="w-6 flex justify-start mr-1"
@ -321,6 +321,7 @@ import AttachmentStep from './attachment_step'
import MultiSelectStep from './multi_select_step'
import FormCompleted from './completed'
import { IconInnerShadowTop, IconArrowsDiagonal, IconArrowsDiagonalMinimize2 } from '@tabler/icons-vue'
import { t } from './i18n'
export default {
name: 'SubmissionForm',
@ -337,7 +338,8 @@ export default {
},
provide () {
return {
baseUrl: this.baseUrl
baseUrl: this.baseUrl,
t: this.t
}
},
props: {
@ -468,6 +470,7 @@ export default {
}
},
methods: {
t,
goToStep (step, scrollToArea = false, clickUpload = false) {
this.currentStep = this.stepFields.indexOf(step)

@ -0,0 +1,134 @@
const en = {
submit_form: 'Submit Form',
type_here: 'Type here',
optional: 'optional',
select_your_option: 'Select your option',
complete_hightlighted_checkboxes_and_click: 'Complete hightlighted checkboxes and click',
submit: 'submit',
next: 'next',
click_to_upload: 'Click to upload',
or_drag_and_drop_files: 'or drag and drop files',
send_copy_via_email: 'Send copy via email',
download: 'Download',
form_has_been_completed: 'Form has been completed!',
create_a_free_account: 'Create a Free Account',
signed_with: 'Signed with',
open_source_documents_software: 'open source documents software'
}
const es = {
submit_form: 'Enviar Formulario',
type_here: 'Escribe aquí',
optional: 'opcional',
select_your_option: 'Selecciona tu opción',
complete_hightlighted_checkboxes_and_click: 'Completa las casillas resaltadas y haz clic',
submit: 'enviar',
next: 'siguiente',
click_to_upload: 'Haz clic para cargar',
or_drag_and_drop_files: 'o arrastra y suelta archivos',
send_copy_via_email: 'Enviar copia por correo electrónico',
download: 'Descargar',
form_has_been_completed: '¡El formulario ha sido completado!',
create_a_free_account: 'Crear una Cuenta Gratuita',
signed_with: 'Firmado con',
open_source_documents_software: 'software de documentos de código abierto'
}
const it = {
submit_form: 'Invia Modulo',
type_here: 'Digita qui',
optional: 'opzionale',
select_your_option: 'Seleziona la tua opzione',
complete_hightlighted_checkboxes_and_click: 'Completa le caselle evidenziate e fai clic',
submit: 'invia',
next: 'avanti',
click_to_upload: 'Clicca per caricare',
or_drag_and_drop_files: 'oppure trascina e rilascia i file',
send_copy_via_email: 'Invia copia via email',
download: 'Scarica',
form_has_been_completed: 'Il modulo è stato completato!',
create_a_free_account: 'Crea un Account Gratuito',
signed_with: 'Firmato con',
open_source_documents_software: 'software di documenti open source'
}
const de = {
submit_form: 'Formular absenden',
type_here: 'Hier eingeben',
optional: 'optional',
select_your_option: 'Wähle deine Option',
complete_hightlighted_checkboxes_and_click: 'Markierte Kontrollkästchen ausfüllen und klicken',
submit: 'absenden',
next: 'weiter',
click_to_upload: 'Klicken zum Hochladen',
or_drag_and_drop_files: 'oder Dateien hierher ziehen und ablegen',
send_copy_via_email: 'Kopie per E-Mail senden',
download: 'Herunterladen',
form_has_been_completed: 'Formular wurde ausgefüllt!',
create_a_free_account: 'Kostenloses Konto erstellen',
signed_with: 'Unterschrieben mit',
open_source_documents_software: 'Open-Source-Dokumentensoftware'
}
const fr = {
submit_form: 'Envoyer le Formulaire',
type_here: 'Tapez ici',
optional: 'facultatif',
select_your_option: 'Sélectionnez votre option',
complete_hightlighted_checkboxes_and_click: 'Complétez les cases à cocher en surbrillance et cliquez',
submit: 'envoyer',
next: 'suivant',
click_to_upload: 'Cliquez pour télécharger',
or_drag_and_drop_files: 'ou faites glisser-déposer les fichiers',
send_copy_via_email: 'Envoyer une copie par e-mail',
download: 'Télécharger',
form_has_been_completed: 'Le formulaire a été complété !',
create_a_free_account: 'Créer un Compte Gratuit',
signed_with: 'Signé avec',
open_source_documents_software: 'logiciel de documents open source'
}
const pl = {
submit_form: 'Wyślij Formularz',
type_here: 'Wpisz tutaj',
optional: 'opcjonalny',
select_your_option: 'Wybierz swoją opcję',
complete_hightlighted_checkboxes_and_click: 'Wypełnij zaznaczone pola wyboru i kliknij',
submit: 'wyślij',
next: 'dalej',
click_to_upload: 'Kliknij, aby przesłać',
or_drag_and_drop_files: 'lub przeciągnij i upuść pliki',
send_copy_via_email: 'Wyślij kopię drogą mailową',
download: 'Pobierz',
form_has_been_completed: 'Formularz został wypełniony!',
create_a_free_account: 'Utwórz darmowe konto',
signed_with: 'Podpisane za pomocą',
open_source_documents_software: 'oprogramowanie do dokumentów open source'
}
const uk = {
submit_form: 'Надіслати Форму',
type_here: 'Введіть тут',
optional: 'необов’язково',
select_your_option: 'Виберіть свій варіант',
complete_hightlighted_checkboxes_and_click: 'Заповніть позначені прапорці та натисніть',
submit: 'надіслати',
next: 'далі',
click_to_upload: 'Клацніть, щоб завантажити',
or_drag_and_drop_files: 'або перетягніть файли сюди',
send_copy_via_email: 'Надіслати копію електронною поштою',
download: 'Завантажити',
form_has_been_completed: 'Форму заповнено!',
create_a_free_account: 'Створити безкоштовний обліковий запис',
signed_with: 'Підписано за допомогою',
open_source_documents_software: 'відкритий програмний засіб для документів'
}
const i18n = { en, es, it, de, fr, pl, uk }
const browserLanguage = (navigator.language || navigator.userLanguage || 'en').split('-')[0]
const t = (key) => i18n[browserLanguage][key] || i18n.en[key] || key
export default i18n
export { t }
Loading…
Cancel
Save