61 lines
1.6 KiB
Vue
61 lines
1.6 KiB
Vue
<template>
|
|
<div class="flex flex-row w-2/3 lg:w-1/3">
|
|
<div class="flex-col w-full">
|
|
<div
|
|
class="w-full border border-gray-800 rounded bg-white text-gray-800 p-5 mb-4"
|
|
v-if="message"
|
|
v-text="message"
|
|
>
|
|
</div>
|
|
<div class="flex w-full">
|
|
<input
|
|
class="bg-gray-100 h-10 px-2 rounded flex-1"
|
|
type="email"
|
|
name="email"
|
|
v-model="form.email"
|
|
placeholder="Subscribe for News Letters"
|
|
/>
|
|
<button
|
|
@click="submit()"
|
|
:disabled="form.email == ''"
|
|
class="ml-4 text-white h-10 flex items-center justify-center px-4 bg-main-link rounded shadow font-medium"
|
|
>
|
|
Subscribe
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: "news-letter",
|
|
|
|
data() {
|
|
return {
|
|
form: {
|
|
email: ""
|
|
},
|
|
errors: false,
|
|
message: ""
|
|
};
|
|
},
|
|
|
|
methods: {
|
|
submit() {
|
|
axios
|
|
.post("/api/newsletter/subscribe", this.form)
|
|
|
|
.then(response => {
|
|
this.message = response.data.message;
|
|
this.form.email = "";
|
|
})
|
|
.catch(error => {
|
|
this.errors = true;
|
|
this.message = error.response.data.errors.email[0];
|
|
});
|
|
}
|
|
}
|
|
};
|
|
</script>
|