<template>
	<div class="form-group">
        <label v-if="label" for="name">{{ label }}</label>
		<div class="upload-box">
			<div v-if="preview" v-for="(img, $index) in preview" :key="$index">
              	<div>
        			<img class="img-fluid" alt='' :src="img"/>
        		</div>
        	</div>
	    </div>
	</div>
</template>

<script>
	export default {
		props: {
			label: String,
			exist_img: Array,
		},
		data() {
			return {
				preview: [],
				img: [],
				mime_type: '',
			}
		},
		methods: {
			loadExistingImg() {
				let vm = this;
				if (vm.exist_img[0]) {
					vm.mime_type = vm.exist_img[0].mime_type;
					Array.from(vm.exist_img).forEach(file => { 
						vm.preview.push(file.file_info.original.file);
					});
				}
			}
		},
		watch: {
			'exist_img': 'loadExistingImg',
		},
		created() {
			let vm = this;
			vm.loadExistingImg();
		}
	}
</script>