137 lines
4.1 KiB
Vue
137 lines
4.1 KiB
Vue
<template>
|
|
<el-dialog title="پیگیری وضعیت درخواست" :visible.sync="showModal">
|
|
<div v-if="!$auth.loggedIn || !$auth.hasScope('user')" class="panel not-logged-in">
|
|
<h3>
|
|
<span> برای بررسی درخواست نمایندگی باید </span>
|
|
|
|
<nuxt-link :to="{ name: 'auth-login-register', query: { path: 'representation' } }">وارد حساب کاربری</nuxt-link>
|
|
|
|
<span>خود شوید.</span>
|
|
</h3>
|
|
</div>
|
|
|
|
<div v-else class="checkUploadModalContent">
|
|
<div class="repCheckBox">
|
|
<form class="form form_3" @submit.prevent="checkRepCode">
|
|
<div class="formRow" :class="validation.representation_code && 'err'">
|
|
<input
|
|
id="repCodeInput"
|
|
v-model="repCodeInput"
|
|
type="text"
|
|
placeholder="کد پیگیری درخواست خود را وارد کنید"
|
|
/>
|
|
|
|
<p v-if="validation.representation_code">{{ validation.representation_code.msg }}</p>
|
|
</div>
|
|
|
|
<div class="formRow">
|
|
<button type="submit" class="btn btn-primary">بررسی</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="resultBox">
|
|
<div class="repInfo" :class="repInfo.status">
|
|
<p>
|
|
<span>تاریخ ثبت درخواست:</span>
|
|
|
|
<b> {{ $jDate(repInfo.created_at) }} </b>
|
|
</p>
|
|
|
|
<p>
|
|
<span>وضعیت درخواست: </span>
|
|
|
|
<b v-if="repInfo.status === 'registered'"> ثبت شده در سیستم </b>
|
|
|
|
<b v-if="repInfo.status === 'ongoing'"> در دست اقدام </b>
|
|
|
|
<b v-if="repInfo.status === 'verification'"> احراز هویت و بررسی مدارک </b>
|
|
|
|
<b v-if="repInfo.status === 'accepted'"> تایید شده </b>
|
|
|
|
<b v-if="repInfo.status === 'rejected'"> رد شده </b>
|
|
</p>
|
|
|
|
<p v-if="repInfo.status !== 'rejected'">
|
|
<span>دسترسی برای آپلود مدارک: </span>
|
|
|
|
<b v-if="repInfo.upload"> دارید </b>
|
|
|
|
<b v-else> ندارید </b>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</el-dialog>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'CheckRepAndUploadDocs',
|
|
props: {
|
|
show: {
|
|
type: Boolean,
|
|
default: false
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
checkingRepCode: false,
|
|
repCodeInput: '',
|
|
repInfo: {},
|
|
validation: {}
|
|
}
|
|
},
|
|
computed: {
|
|
showModal: {
|
|
get() {
|
|
return this.show
|
|
},
|
|
set(value) {
|
|
this.$emit('closeModal')
|
|
}
|
|
}
|
|
},
|
|
watch: {
|
|
showModal(newVal, oldVal) {
|
|
if (newVal) setTimeout(() => $('#repCodeInput').focus(), 300)
|
|
}
|
|
},
|
|
methods: {
|
|
showResult() {
|
|
const _DU = 0.3
|
|
this.$gsap
|
|
.timeline({ onCompleted: () => console.log('hiiiiiiiiiiii') })
|
|
.to(
|
|
$('.checkUploadModalContent'),
|
|
{ height: $('.checkUploadModalContent .resultBox').height() + 32, duration: _DU },
|
|
0
|
|
)
|
|
.set($('.checkUploadModalContent .repCheckBox'), { position: 'absolute', left: 0, top: 0 }, 0)
|
|
.to($('.checkUploadModalContent .repCheckBox'), { top: '-100%', opacity: 0, duration: _DU }, 0)
|
|
.to($('.checkUploadModalContent .resultBox'), { top: 0, opacity: 1, duration: _DU }, 0.05)
|
|
.set($('.checkUploadModalContent .resultBox'), { position: 'static' })
|
|
.set($('.checkUploadModalContent'), { height: 'auto' })
|
|
},
|
|
checkRepCode() {
|
|
this.validation = {}
|
|
this.$axios
|
|
.post('/api/user/checkRepresentation', { representation_code: this.repCodeInput?.trim() })
|
|
.then(res => {
|
|
this.repInfo = res.data
|
|
setTimeout(() => this.showResult(), 300)
|
|
})
|
|
.catch(err => {
|
|
if (err.response.status === 422) this.validation = err.response.data.validation
|
|
else {
|
|
const title = 'خطا'
|
|
this.$alert(err.response.data.message, title, {
|
|
confirmButtonText: 'بستن'
|
|
})
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|