<template name="im-image">
	<template v-if="src && info && info.fixMode">
		<image v-if="info.fixMode<=2" :src="src" class="radius" :mode="info.fixMode==1 ? 'widthFix' : 'heightFix' "  :style="info.fixMode==1 ? 'width:200px' : 'height:240px'" @tap="showImgs"  :data-img="src" ></image>
		<image v-if="info.fixMode==3" :src="src" class="radius" mode="scaleToFill"  :style="[{width:info.width+'px',height:info.height+'px'}]" @tap="showImgs"  :data-img="src" ></image>
	</template>
	<template v-else-if="!src && info && info.width">
		<image  :src="src" class="radius" mode="scaleToFill"  :style="$util.imageCoverStyle(info.width,info.height)" @tap="showImgs"  :data-img="src" ></image>
	</template>
	<template v-else>
		<image :src="src" style="width:200px" class="radius" mode="widthFix" @tap="showImgs"  :data-img="src" ></image>
	</template>
</template>
<script>
export default {
	name  : "im-image",
	props : {
		info:{type:Object, default:function(){return {};}},
		src:{type:String, default:''},
		isview:{type:Object, default:function(){return {};}},
	},
	emits:['showImgs','viewImgs'],
	data() {
		return {
		}
	},
	created : function(){
	},
	methods:{
		showImgs(e){
			if(this.isview.is_view==0){
				this.$api.msgApi.viewOriginalImage({file_id:this.isview.file_id,msg_id:this.isview.msg_id}).then(res => {
					// console.log(res);
					const valobj = {img:res.data.src,is_view:this.isview.is_view}
					this.$emit('showImgs',valobj);
					this.$emit('viewImgs',{src:res.data.src,msg_id:this.isview.msg_id});
				})
			}else{
				this.$emit('showImgs',e);
			}
		},
	}
}
</script>