parent
b30277b617
commit
8205c11bd9
|
@ -77,53 +77,38 @@
|
|||
<form class="form flex flex-wrap w-full">
|
||||
<div class="w-full">
|
||||
<div class="form-element">
|
||||
<div class="form-label">{{ $t('vorname') }}</div>
|
||||
<input
|
||||
name="first-name"
|
||||
class="w-full dark:bg-gray-800 rounded border border-gray-700 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-900 text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
|
||||
type="text"
|
||||
:placeholder="[[$t('vorname')]]"
|
||||
v-model="state.firstname"
|
||||
<div class="text-lg">{{ $t('vorname') }}</div>
|
||||
<p
|
||||
class="w-full dark:bg-gray-800 rounded text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
|
||||
v-text="state.firstname"
|
||||
/>
|
||||
</div>
|
||||
<div class="form-element">
|
||||
<div class="form-label">{{ $t('mittelname') }}</div>
|
||||
<input
|
||||
name="middle-name"
|
||||
class="w-full dark:bg-gray-800 rounded border border-gray-700 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-900 text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
|
||||
type="text"
|
||||
:placeholder="[[$t('mittelname')]]"
|
||||
v-model="state.middlename"
|
||||
<div class="text-lg">{{ $t('mittelname') }}</div>
|
||||
<p
|
||||
class="w-full dark:bg-gray-800 rounded text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
|
||||
v-text="state.middlename"
|
||||
/>
|
||||
</div>
|
||||
<div class="form-element">
|
||||
<div class="form-label">{{ $t('nachname') }}</div>
|
||||
<input
|
||||
name="last-name"
|
||||
type="text"
|
||||
class="w-full dark:bg-gray-800 rounded border border-gray-700 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-900 text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
|
||||
:placeholder="[[$t('nachname')]]"
|
||||
v-model="state.lastname"
|
||||
<div class="text-lg">{{ $t('nachname') }}</div>
|
||||
<p
|
||||
class="w-full dark:bg-gray-800 rounded text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
|
||||
v-text="state.lastname"
|
||||
/>
|
||||
</div>
|
||||
<div class="form-element">
|
||||
<div class="form-label">{{ $t('e_mail_adress') }}</div>
|
||||
<input
|
||||
name="email"
|
||||
type="email"
|
||||
class="w-full dark:bg-gray-800 rounded border border-gray-700 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-900 text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
|
||||
:placeholder="[[$t('e_mail_adress')]]"
|
||||
v-model="state.email"
|
||||
<div class="text-lg">{{ $t('e_mail_adress') }}</div>
|
||||
<p
|
||||
class="w-full dark:bg-gray-800 rounded text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
|
||||
v-text="state.email"
|
||||
/>
|
||||
</div>
|
||||
<div class="form-element">
|
||||
<div class="form-label">{{ $t('phone_number') }}</div>
|
||||
<input
|
||||
name="tel"
|
||||
type="tel"
|
||||
class="w-full dark:bg-gray-800 rounded border border-gray-700 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-900 text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
|
||||
:placeholder="[[$t('phone_number')]]"
|
||||
v-model="state.phone"
|
||||
<div class="text-lg">{{ $t('phone_number') }}</div>
|
||||
<p
|
||||
class="w-full dark:bg-gray-800 rounded text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
|
||||
v-text="state.phone"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -183,12 +168,12 @@
|
|||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed, ref, reactive, watch, defineProps } from "vue";
|
||||
import { ref, reactive } from "vue";
|
||||
import { useToast } from "vue-toastification";
|
||||
import axios from "redaxios";
|
||||
import isEmail from 'validator/es/lib/isEmail';
|
||||
import isMobilePhone from 'validator/es/lib/isMobilePhone';
|
||||
import isPostalCode from 'validator/es/lib/isPostalCode';
|
||||
// import isEmail from 'validator/es/lib/isEmail';
|
||||
// import isMobilePhone from 'validator/es/lib/isMobilePhone';
|
||||
// import isPostalCode from 'validator/es/lib/isPostalCode';
|
||||
//
|
||||
const state = reactive({
|
||||
phone: "",
|
||||
|
|
Loading…
Reference in New Issue