TKO/services/frontend/components/ContactUs.vue

87 lines
2 KiB
Vue
Raw Normal View History

2025-02-07 17:29:15 +01:00
<template>
2025-02-16 14:20:40 +01:00
<v-card class="contact">
2025-02-19 20:51:19 +01:00
<v-form v-model="valid">
2025-02-16 14:20:40 +01:00
<v-container>
<v-card-title class="contact__title">Kontaktujte nás!</v-card-title>
<v-row>
<v-col
cols="12"
md="4"
>
<v-text-field
v-model="fullName"
label="Jméno"
variant="underlined"
></v-text-field>
</v-col>
2025-02-07 17:29:15 +01:00
2025-02-16 14:20:40 +01:00
<v-col
cols="12"
md="4"
>
<v-text-field
v-model="email"
label="Emailová adresa"
variant="underlined"
></v-text-field>
</v-col>
2025-02-08 14:50:44 +01:00
2025-02-16 14:20:40 +01:00
<v-col
cols="12"
md="4"
2025-02-08 14:50:44 +01:00
>
2025-02-16 14:20:40 +01:00
<v-text-field
v-model="phone"
label="Telefonní číslo"
variant="underlined"
></v-text-field>
</v-col>
</v-row>
<v-row>
<v-col>
<v-textarea
v-model="textField"
label="Váš dotaz *"
variant="underlined"
/>
</v-col>
</v-row>
<v-row>
<v-col>
<v-btn
class="contact__button"
type="submit"
2025-02-19 20:51:19 +01:00
@click.prevent="sendContact"
2025-02-16 14:20:40 +01:00
>
Poslat
</v-btn>
</v-col>
</v-row>
</v-container>
</v-form>
</v-card>
2025-02-07 17:29:15 +01:00
</template>
<script setup lang="ts">
2025-02-16 14:20:40 +01:00
import './assets/css/main.css'
2025-02-19 20:51:19 +01:00
import {useAPI} from "~/composables/useAPI";
2025-02-07 17:29:15 +01:00
2025-02-08 14:50:44 +01:00
const valid = ref<boolean>(false);
const fullName = ref<string>("");
const email = ref<string>("");
const phone = ref<string>("");
const textField = ref<string>("");
2025-03-05 16:21:16 +01:00
async function sendContact() {
const { data, error } = await useAPI('create-contact/', {
2025-02-19 20:51:19 +01:00
method: "POST",
body: {
name: fullName.value,
email: email.value,
phone_number: phone.value,
content: textField.value,
}
});
2025-02-08 14:50:44 +01:00
}
2025-02-16 14:20:40 +01:00
</script>