文件消息，地理位置消息

pages/im/components/show/showFile.vue

@@ -0,0 +1,95 @@
+<template>
+    <view class="msg--file">
+        <message-state :message="message" :isGroup="isGroup" :isRemote="isRemote" />
+
+        <view class="">
+            <view class="name" v-if="isGroup && isRemote">{{ contact(message.senderUserId).name }}</view>
+            <view class="file" :class="isRemote ? 'left': 'right'">
+                <view class="img">
+                    {{ content.fileType }}
+                    {{ content.name }}
+                </view>
+            </view>
+        </view>
+    </view>
+</template>
+
+<!-- "content": {
+        "fileType": "jpg",
+        "remote": "https://rongcloud-spic.ronghub.com/Xl1PRVpHVldeRQAGVgEHAAcBBgYGBgcDAwMGMjA3MA%3D%3D.jpg?e=1661583313&token=livk5rb3__JZjCtEiMxXpQ8QscLxbNLehwhHySnX:t58hs4uvM1RFsBeKLTcDbVW-k5w=",
+        "size": 347062,
+        "objectName": "RC:FileMsg",
+        "name": "Screenshot_2022-02-25-14-44-55-886_io.zhhealth.app.jpg",
+        "local": "file:///storage/emulated/0/DCIM/Screenshots/Screenshot_2022-02-25-14-44-55-886_io.zhhealth.app.jpg",
+        "userInfo": {
+            "userId": "10051",
+            "name": "Jason.电信",
+            "extra": "",
+            "portraitUrl": "http://storage.zh.shangkelian.cn/uploads/2022/02/16/29b13f5301694721ad7acd8b8b67bbd9.jpg"
+        }
+    }, -->
+<script>
+    import * as RongIMLib from '@/uni_modules/RongCloud-IMWrapper/js_sdk/index'
+    import messageState from './messageState'
+    import imBase from '../../mixins/imBase.js'
+
+    export default {
+        mixins: [
+            imBase
+        ],
+        props: {
+            message: {
+                type: Object,
+                default: () => {
+                    return {}
+                }
+            },
+            isGroup: {
+                type: Boolean,
+                default: false
+            }
+        },
+        components: {
+            messageState
+        },
+        computed: {
+            isRemote() {
+                return this.message.messageDirection == 2
+            },
+            content() {
+                return this.message.content
+            }
+        }
+    }
+</script>
+
+<style lang="scss" scoped>
+    .msg--file {
+        display: flex;
+        align-items: flex-end;
+
+        .name {
+            font-size: 24rpx;
+            color: $text-gray-m;
+        }
+
+        .file {
+            .img {
+                width: 180rpx;
+            }
+
+            &.left {
+                .img {
+                    border-radius: 0 10rpx 10rpx 10rpx;
+                }
+            }
+
+            &.right {
+                .img {
+                    border-radius: 10rpx 0 10rpx 10rpx;
+                }
+            }
+        }
+
+    }
+</style>