<template>
    <view class="im--img" :class="guest ? 'right': 'left'">
        <image class="src" :src="msg" @click="openImg" mode="widthFix"></image>
    </view>
</template>

<script>
    export default {
        name:"im",
        props:{
            msg : {
                type   : String,
                default: 'https://images.pexels.com/photos/9024609/pexels-photo-9024609.jpeg'
            },
            guest: {
                type: Boolean,
                default: true
            }
        },
        methods:{
            openImg(){
                uni.previewImage({
                    urls    : [this.msg],
                    current : 1
                })
            }
        }
    }
</script>

<style scoped>
    .im--img{
        padding: 19rpx;
    }
    .im--img.left{
        border-radius: 0 20rpx 20rpx 20rpx;
        background: white;
    }
    
    .im--img.right{
        border-radius: 20rpx 0 20rpx 20rpx;
        background: #34CE98;
    }
    .src{
        width: 240rpx;
    }
</style>
