54 lines
1.8 KiB
Vue
54 lines
1.8 KiB
Vue
<template>
|
|
<div v-if="files">
|
|
<div class="has-text-right" v-if="!hideopt">
|
|
<FileUpload @files="getFiles"></FileUpload>
|
|
</div>
|
|
<div class="field is-grouped is-grouped-multiline" v-if="files.length>0">
|
|
<div class="control mb-2" v-for="(v,i) in files">
|
|
<ChipImage style="width: 128px;" @remove="remove(v,i)"
|
|
v-bind="{row: row, show: show, pagename: pagename, api: api, file: v, image: `${$getpath()}download/?name=${v.file__file}&type=file`}"></ChipImage>
|
|
</div>
|
|
</div>
|
|
<div class="mt-3 has-text-grey f5-16" v-if="files.length===0">
|
|
{{ store.lang==='en'? 'No images' : "Chưa có hình ảnh"}}
|
|
</div>
|
|
<Modal @close="showmodal=undefined" v-bind="showmodal" v-if="showmodal"></Modal>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import { useStore } from '~/stores/index'
|
|
export default {
|
|
setup() {
|
|
const store = useStore()
|
|
return { store }
|
|
},
|
|
props: ['row', 'pagename', 'api', 'hideopt', 'vapi', 'show'],
|
|
data() {
|
|
return {
|
|
showmodal: undefined,
|
|
files: undefined
|
|
}
|
|
},
|
|
async created() {
|
|
this.files = await this.$getdata(this.api, {ref: this.row.id, file__type: 2})
|
|
},
|
|
methods: {
|
|
async remove(v, i) {
|
|
this.$remove(this.files, i)
|
|
await this.$deleteapi(this.api, v.id)
|
|
},
|
|
async getFiles(files) {
|
|
let arr = files.map(v=>{return {ref: this.row.id, file: v.id}})
|
|
let found = this.$findapi(this.api)
|
|
let rs = await this.$insertapi(this.api, arr, found.params.values)
|
|
if(rs==='error') return
|
|
this.files = this.files.concat(rs)
|
|
if(this.pagename) {
|
|
let vapi = this.vapi? this.vapi : this.api.replace('file', '')
|
|
let ele = await this.$getdata(vapi, {id: this.row.id}, undefined, true)
|
|
this.$updatepage(this.pagename, ele)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script> |