54 lines
1.6 KiB
Vue
54 lines
1.6 KiB
Vue
<template>
|
|
<div>
|
|
<div class="image-container" v-if="picture">
|
|
<img :src="picture" style="max-height: 250px !important;">
|
|
<div class="image-label">
|
|
<span class="is-clickable" @click="remove()">
|
|
<SvgIcon v-bind="{name: 'bin.svg', type: 'danger', size: 30}"></SvgIcon>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div style="width: 130px; border-style: dashed; border-width: 1px;" v-else>
|
|
<a @click="openImage()"><SvgIcon v-bind="{name: 'image.svg', type: 'grey', size: 120}"></SvgIcon></a>
|
|
</div>
|
|
<div class="mt-2">
|
|
<a @click="openCamera()">
|
|
<SvgIcon v-bind="{name: 'camera.svg', type: 'dark', size: 28}"></SvgIcon>
|
|
</a>
|
|
</div>
|
|
<Modal @close="showmodal=undefined" v-bind="showmodal" v-if="showmodal" @selectimage="selectImage"></Modal>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
export default {
|
|
props: ['file', 'image', 'show'],
|
|
data() {
|
|
return {
|
|
showmodal: undefined,
|
|
display: this.show || [],
|
|
picture: this.image || undefined,
|
|
vfile: undefined
|
|
}
|
|
},
|
|
methods: {
|
|
openImage() {
|
|
this.showmodal = {component:'media/Imagebox', title: 'Thư viện hình ảnh', width: '90%', vbind: {source: true}}
|
|
},
|
|
selectImage(files) {
|
|
this.showmodal = undefined
|
|
let v = files
|
|
this.picture = `${this.$path()}download/?name=${v.file__file || v.file}&type=file`
|
|
v.image = this.$copy(this.picture)
|
|
this.vfile = v
|
|
this.$emit('picture', v)
|
|
},
|
|
remove() {
|
|
this.vfile = undefined
|
|
this.picture = undefined
|
|
},
|
|
openCamera() {
|
|
this.showmodal = {component:'media/Camera', title: 'Chụp ảnh', width: '650px'}
|
|
}
|
|
}
|
|
}
|
|
</script> |