You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
68 lines
2.1 KiB
Vue
68 lines
2.1 KiB
Vue
5 months ago
|
<template>
|
||
|
|
<div v-if="props.msg.sendingState == V2NIMConst.V2NIMMessageSendingState.V2NIM_MESSAGE_SENDING_STATE_SUCCEEDED" class="msg-read-wrapper">
|
||
|
|
<div class="g_mr_5 g_mb_5">
|
||
|
|
<div v-if="p2pMsgRotateDeg == 360" class="icon-read-wrapper" :style="{ bottom: isIOS ? '-6px' : '0px' }">
|
||
|
|
<image src="https://matripe-cms.oss-cn-beijing.aliyuncs.com/bocaigongyinglian/yidu_ccc.svg" style="width: 16px; height: 16px; display: block"></image>
|
||
|
|
</div>
|
||
|
|
<div v-else class="icon-read-wrapper" :style="{ bottom: isIOS ? '-6px' : '0px' }">
|
||
|
|
<image src="https://matripe-cms.oss-cn-beijing.aliyuncs.com/bocaigongyinglian/weidu_blue.svg" style="width: 16px; height: 16px; display: block"></image>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script lang="ts" setup>
|
||
|
|
import { computed, defineProps, withDefaults, ref, onMounted, onUnmounted } from "vue";
|
||
|
|
import { V2NIMMessageForUI } from "@xkit-yx/im-store-v2/dist/types/types";
|
||
|
|
import { V2NIMConst } from "nim-web-sdk-ng/dist/v2/NIM_UNIAPP_SDK";
|
||
|
|
import { autorun } from "mobx";
|
||
|
|
import { customNavigateTo } from "../../../utils/customNavigate";
|
||
|
|
import { t } from "../../../utils/i18n";
|
||
|
|
const props = withDefaults(
|
||
|
|
defineProps<{
|
||
|
|
msg: V2NIMMessageForUI;
|
||
|
|
}>(),
|
||
|
|
{}
|
||
|
|
);
|
||
|
|
|
||
|
|
const conversationType = uni.$UIKitNIM.V2NIMConversationIdUtil.parseConversationType(props.msg.conversationId);
|
||
|
|
const p2pMsgRotateDeg = ref(0);
|
||
|
|
|
||
|
|
const setP2pMsgRotateDeg = () => {
|
||
|
|
// 如果是单聊
|
||
|
|
if (conversationType === V2NIMConst.V2NIMConversationType.V2NIM_CONVERSATION_TYPE_P2P) {
|
||
|
|
const conversation = uni.$UIKitStore.conversationStore.conversations.get(props.msg.conversationId);
|
||
|
|
|
||
|
|
p2pMsgRotateDeg.value = props?.msg?.createTime <= (conversation?.msgReceiptTime || 0) ? 360 : 0;
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
const p2pMsgReadWatch = autorun(() => {
|
||
|
|
setP2pMsgRotateDeg();
|
||
|
|
});
|
||
|
|
|
||
|
|
onMounted(() => {
|
||
|
|
setP2pMsgRotateDeg();
|
||
|
|
});
|
||
|
|
|
||
|
|
onUnmounted(() => {
|
||
|
|
p2pMsgReadWatch();
|
||
|
|
});
|
||
|
|
|
||
|
|
const systemInfo = uni.getSystemInfoSync();
|
||
|
|
const isIOS = ref(systemInfo.platform === "ios");
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped lang="scss">
|
||
|
|
@import "../../../base.scss";
|
||
|
|
.msg-read-wrapper {
|
||
|
|
// align-self: flex-end;
|
||
|
|
}
|
||
|
|
.icon-read-wrapper {
|
||
|
|
width: 16px;
|
||
|
|
height: 16px;
|
||
|
|
position: relative;
|
||
|
|
// bottom: 0px;
|
||
|
|
}
|
||
|
|
</style>
|