Swift
109 lines
3.5 KiB
Vue
109 lines
3.5 KiB
Vue
<template>
|
|
<div class="contact--page page">
|
|
<section class="s1">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-12 col-md-6 message">
|
|
<form class="form form_1" @submit.prevent="send">
|
|
<div class="title">
|
|
<p>برای ما پیام بگذارید:</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.full_name ? 'err' : null">
|
|
<input v-model="formData.full_name" type="text" placeholder="نام و نام خانوادگی" />
|
|
<p v-if="validation.full_name">{{ validation.full_name.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.email ? 'err' : null">
|
|
<input v-model="formData.email" type="text" class="email" placeholder="ایمیل" />
|
|
<p v-if="validation.email">{{ validation.email.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.message ? 'err' : null">
|
|
<textarea v-model="formData.message" rows="3" placeholder="پیام"></textarea>
|
|
<p v-if="validation.message">{{ validation.message.msg }}</p>
|
|
</div>
|
|
<div class="btnRow">
|
|
<button class="btn btn-primary" type="submit">ارسال پیام</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="col-12 col-md-6 mt-5 mt-md-0 contact">
|
|
<div class="info">
|
|
<ul>
|
|
<li>
|
|
<p>
|
|
<i class="fal fa-map-marker-alt"></i>
|
|
<span> {{ config.address }} </span>
|
|
</p>
|
|
</li>
|
|
<li>
|
|
<a :href="`tel: ${config.contactTel}`">
|
|
<i class="fal fa-phone"></i>
|
|
<span>{{ config.contactTel }}</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a :href="`mailto: ${config.contactEmail}`">
|
|
<i class="fal fa-envelope"></i>
|
|
<span>{{ config.contactEmail }}</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'ContactUsPage',
|
|
data() {
|
|
return {
|
|
formData: {
|
|
full_name: '',
|
|
email: '',
|
|
message: ''
|
|
},
|
|
validation: {}
|
|
}
|
|
},
|
|
head() {
|
|
return {
|
|
title: 'آسان سرویس | ارتباط با ما'
|
|
}
|
|
},
|
|
computed: {
|
|
config() {
|
|
return this.$config
|
|
}
|
|
},
|
|
methods: {
|
|
send() {
|
|
this.validation = {}
|
|
this.$axios
|
|
.post(`/api/public/contact`, this.formData)
|
|
.then(res => {
|
|
this.$message({
|
|
type: 'success',
|
|
message: 'پیام شما با موفقیت ارسال شد.'
|
|
})
|
|
this.formData = {
|
|
full_name: '',
|
|
email: '',
|
|
message: ''
|
|
}
|
|
})
|
|
.catch(err => {
|
|
if (err.response.status === 422) this.validation = err.response.data.validation
|
|
else {
|
|
this.$message({
|
|
type: 'error',
|
|
message: err.response.data.message
|
|
})
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script> |