Amir Mohamadi
120 lines
3.6 KiB
Vue
120 lines
3.6 KiB
Vue
<template>
|
|
<div class="container-fluid">
|
|
<div class="row">
|
|
<admin-title-bar :title="title"></admin-title-bar>
|
|
<div class="col-12">
|
|
<admin-panel>
|
|
<h2>افزودن یا بروزرسانی کاتالوگ:</h2>
|
|
</admin-panel>
|
|
</div>
|
|
<div class="col-6">
|
|
<admin-panel>
|
|
<h2>کاتالوگ فارسی:</h2>
|
|
<el-divider></el-divider>
|
|
<el-form>
|
|
<input type="file" ref="file_fa">
|
|
<el-button @click="upload('fa')" type="success">افزودن</el-button>
|
|
<p style="color: red;" v-if="validation.pdf && locale === 'fa'">{{ validation.pdf.msg }}</p>
|
|
</el-form>
|
|
<el-divider></el-divider>
|
|
<a v-if="catalog && catalog.file && catalog.file.fa" :href="catalog.file.fa" target="_blank">
|
|
<el-button>دانلود و مشاهده کاتالوگ فعلی</el-button>
|
|
</a>
|
|
</admin-panel>
|
|
</div>
|
|
<div class="col-6">
|
|
<admin-panel>
|
|
<h2>کاتالوگ انگلیسی:</h2>
|
|
<el-divider></el-divider>
|
|
<el-form>
|
|
<input type="file" ref="file_en">
|
|
<el-button @click="upload('en')" type="success">افزودن</el-button>
|
|
<p style="color: red;" v-if="validation.pdf && locale === 'en'">{{ validation.pdf.msg }}</p>
|
|
</el-form>
|
|
<el-divider></el-divider>
|
|
<a v-if="catalog && catalog.file && catalog.file.en" :href="catalog.file.en" target="_blank">
|
|
<el-button>دانلود و مشاهده کاتالوگ فعلی</el-button>
|
|
</a>
|
|
</admin-panel>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
catalog: null,
|
|
locale: null,
|
|
validation: {},
|
|
uploading: false,
|
|
uploadProgress: null
|
|
}
|
|
},
|
|
head() {
|
|
return {
|
|
title: this.title,
|
|
}
|
|
},
|
|
computed: {
|
|
title() {
|
|
if (!this.uploading) {
|
|
return 'آپلود کاتالوگ اصلی سایت'
|
|
} else {
|
|
return this.uploadProgress
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
upload(locale) {
|
|
this.locale = locale
|
|
this.validation = {}
|
|
locale === 'fa' ? this.$refs.file_en.value = null : this.$refs.file_fa.value = null
|
|
const data = new FormData()
|
|
data.append('locale', locale)
|
|
locale === 'fa' ? data.append('pdf', this.$refs.file_fa.files[0]) : data.append('pdf', this.$refs.file_en.files[0])
|
|
|
|
const axiosConfig = {
|
|
onUploadProgress: progressEvent => {
|
|
this.uploading = true
|
|
this.uploadProgress = 'درحال آپلود ' + Math.floor(((progressEvent.loaded / progressEvent.total) * 100)) + '%'
|
|
|
|
if ((progressEvent.loaded / progressEvent.total) * 100 === 100) {
|
|
this.uploading = false
|
|
}
|
|
}
|
|
}
|
|
|
|
this.$axios.post(`/api/private/catalog`, data, axiosConfig)
|
|
.then(res => {
|
|
this.$message({
|
|
type: 'success',
|
|
message: 'کاتالوگ با موفقیت آپلود شد'
|
|
})
|
|
this.$refs.file_fa.value = null
|
|
this.$refs.file_en.value = null
|
|
this.catalog = res.data
|
|
})
|
|
.catch(err => {
|
|
if (err.response.status === 422) this.validation = err.response.data.validation
|
|
else console.log(err.response.data)
|
|
})
|
|
}
|
|
},
|
|
layout: 'admin',
|
|
async asyncData({$axios, error}) {
|
|
try {
|
|
let catalog = await $axios.get('/api/public/catalog')
|
|
return {
|
|
catalog: catalog.data
|
|
}
|
|
} catch (e) {
|
|
error({status: 404, message: 'There is a problem here'})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|