mahyargdz
125 lines
4.1 KiB
Vue
125 lines
4.1 KiB
Vue
<template>
|
|
<div class="meeting-page">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<LineTxt label="نظرات و پیشنهادات"/>
|
|
</div>
|
|
<div class="col-12 ">
|
|
<div class="view-form">
|
|
<form @submit.prevent="post">
|
|
<div class="formRow" :class="validation.name ? 'err' : null">
|
|
<input class="input" v-model="message.name" name="name" type="text" placeholder="نام و نام خانوادگی خود را وارد کنید"/>
|
|
<p v-if="validation.name">{{ validation.name.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.email ? 'err' : null">
|
|
<input class="input" v-model="message.email" name="email" type="email" placeholder="ایمیل خود را وارد کنید"/>
|
|
<p v-if="validation.email">{{ validation.email.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.phoneNumber ? 'err' : null">
|
|
<input class="input" v-model="message.phoneNumber" name="phoneNumber" type="text" placeholder="شماره تماس خود را وارد کنید"/>
|
|
<p v-if="validation.phoneNumber">{{ validation.phoneNumber.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.description ? 'err' : null">
|
|
<textarea class="input" v-model="message.description" name="description" type="text" placeholder="ایده یا نظر"/>
|
|
<p v-if="validation.description">{{ validation.description.msg }}</p>
|
|
</div>
|
|
<div class="row view-captcha">
|
|
<div class="formRow col-12 col-md-6" :class="validation.captcha ? 'err' : null">
|
|
<input v-model="message.captcha" class="input" name="captcha" type="text" placeholder="متن داخل عکس را وارد کنید"/>
|
|
</div>
|
|
<div class="new-captcha col-12 col-md-6">
|
|
<div class="captcha" v-html="captcha"></div>
|
|
<button @click="reloadCaptcha" type="button" class="btn btn-primary">
|
|
<i class="fas fa-sync-alt"></i>
|
|
</button>
|
|
</div>
|
|
|
|
<p class="err-captcha" v-if="validation.captcha">{{ validation.captcha.msg }}</p>
|
|
|
|
</div>
|
|
|
|
<div class="btnSub">
|
|
<button class="btn btn-primary btn-link" type="submit">ثبت</button>
|
|
<!-- <nuxt-link >SUBMIT NOW</nuxt-link> -->
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
message: {
|
|
name: '',
|
|
description: '',
|
|
email: '',
|
|
phoneNumber: '',
|
|
captcha: '',
|
|
},
|
|
validation: {},
|
|
captcha: null
|
|
}
|
|
},
|
|
|
|
methods: {
|
|
reloadCaptcha() {
|
|
this.$axios.get('/api/public/getCaptcha').then(res => {
|
|
this.captcha = res.data
|
|
})
|
|
},
|
|
post() {
|
|
this.validation = {}
|
|
this.$axios.post('/api/public/addFeedBack', this.message)
|
|
.then(res => {
|
|
this.reloadCaptcha()
|
|
this.$message({
|
|
type: 'success',
|
|
message: 'پیام شما با موفقیت ارسال شد'
|
|
})
|
|
this.message = {
|
|
name: '',
|
|
description: '',
|
|
email: '',
|
|
phoneNumber: '',
|
|
captcha: '',
|
|
}
|
|
})
|
|
.catch(e => {
|
|
this.reloadCaptcha()
|
|
if (e.response.status === 422) this.validation = e.response.data.validation
|
|
else console.log(e)
|
|
})
|
|
}
|
|
},
|
|
|
|
computed: {},
|
|
async asyncData({$axios, error, params}) {
|
|
try {
|
|
|
|
const request = [
|
|
$axios.get('/api/public/getCaptcha'),
|
|
]
|
|
let fetch = await Promise.all(request)
|
|
const [captcha] = fetch
|
|
return {
|
|
captcha: captcha.data,
|
|
}
|
|
} catch (e) {
|
|
error({
|
|
status: 500, message: 'دریافت اطلاعات با مشکل مواجه شد!'
|
|
})
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
|
|
</script>
|