<template>
	<image :src="imgUrlShow" fit="cover"></image>
</template>

<script>
	import {previewFile, previewCacheThumbImage} from'@/api/common.js'
	import {get_base_url} from '@/api/request.js'
	export default {
		name:"image-preview",
		props:{
			imgId:{
				default:'',
				type:String
			},
			src:{
				default:'',
				type:String
			},
			width:{
				default:50,
				type:[String, Number]
			},
			height:{
				default:50,
				type:[String, Number]
			},
			isCache:{
				type: Boolean,
				default: false
			}
		},
		data() {
			return {
				imgUrlShow: '',
				watching: false,
				base_url: get_base_url()
			};
		},
		watch: {
			imgId: {
				handler(newval, oldval) {
					if (newval && this.watching) {
						this.getPreviewUrlBlob(newval);
					}
				},
				immediate: true,
				deep: true,
			},
			src: {
				handler(newval, oldval) {
					if (newval && this.watching) {
						this.imgUrlShow = this.base_url + this.src
					}
				},
				immediate: true,
				deep: true,
			}
		},
		methods: {
			getPreviewUrlBlob(id) {
				
				if (id === null) {
					console.log('谢谢谢谢谢谢', id);
				}
				if(this.isCache){
					previewCacheThumbImage(id, this.width,this.height).then((res) => {
						this.imgUrlShow = res;
					});
				}else{
					previewFile(id).then((result) => {
						//#ifdef APP-PLUS
						let _header = result.header['Content-Type'].split(';')[0]
						// #endif
						//#ifndef APP-PLUS
						let _header = result.header['content-type'].split(';')[0]
						// #endif
						let base64 = `data:${_header};base64,` + uni.arrayBufferToBase64(result.data)
						this.imgUrlShow = base64;
					});
				}
			},
		},
		mounted() {
			if (this.imgId) {
				this.getPreviewUrlBlob(this.imgId);
			}
			this.watching = true
			if(this.src) {
				this.imgUrlShow = this.base_url + this.src
			}
		}
	}
</script>

<style>

</style>