commie/im
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

12

Browse Source
This commit is contained in:
cansnow
2025-12-08 18:10:51 +08:00
parent 22ee59cd3d
commit b2e1b8930e
19 changed files with 218 additions and 300 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/conversation/chating/components/ChatingFooter/ChatingActionBar.vue
+16 -11
View File
@@ -9,7 +9,8 @@
</swiper-item>
</swiper>
<view style="padding:0rpx 20rpx;position: absolute;bottom: 1rpx;right: 10rpx;
width: 250rpx;height: 150rpx;z-index: 1000;opacity: 0.9;" class="u-flex u-row-right u-col-center">
width: 250rpx;height: 150rpx;z-index: 1000;opacity: 0.9;"
class="u-flex u-row-right u-col-center">
<view class="u-flex u-row-center u-col-center"
style="border: 1px solid #f1f1f1;border-radius: 10rpx; background-color: #82848a;width: 100rpx;padding: 15rpx 20rpx;margin-right: 8rpx;">
<view @click="delSendStr()" @longpress="clearSendStr()">
@@ -25,7 +26,7 @@
<u-row class="action_row" v-else>
<u-col v-for="item in actionList" :key="item.idx" @click="actionClick(item)" span="3">
<view class="action_item">
<image :src="item.icon" alt="" srcset="" />
<image class="img" :src="item.icon" alt="" srcset="" />
<text class="action_item_title">{{ item.title }}</text>
</view>
</u-col>
@@ -36,6 +37,10 @@
<script>
import {ChatingFooterActionTypes,} from "@/constant";
import emojis from "@/common/emojis.js"
import chating_action_image from "@/static/images/chating_action_image.png";
import chating_action_camera from "@/static/images/chating_action_camera.png";
import chating_action_call from "@/static/images/chating_action_call.png";
import chating_action_location from "@/static/images/chating_action_location.png";
export default {
props:{
@@ -59,37 +64,37 @@
idx: 0,
type: ChatingFooterActionTypes.Album,
title: "照片",
icon: require("static/images/chating_action_image.png"),
icon: chating_action_image,
},
{
idx: 1,
type: ChatingFooterActionTypes.Camera,
title: "拍摄",
icon: require("static/images/chating_action_camera.png"),
icon: chating_action_camera,
},
{
idx: 2,
type: ChatingFooterActionTypes.Video,
title: "视频通话",
icon: require("static/images/chating_action_call.png"),
icon: chating_action_call,
},
{
idx: 3,
type: ChatingFooterActionTypes.Location,
title: "位置",
icon: require("static/images/chating_action_location.png"),
icon: chating_action_location,
},
// {
// idx: 0,
// type: ChatingFooterActionTypes.Album,
// title: "红包",
// icon: require("static/images/chating_action_image.png"),
// icon: chating_action_image,
// },
// {
// idx: 0,
// type: ChatingFooterActionTypes.Album,
// title: "转账",
// icon: require("static/images/chating_action_image.png"),
// icon: chating_action_image,
// }
],
};
@@ -127,7 +132,7 @@
position: relative;
background: #ececec;
padding: 24rpx 36rpx;
.action_row {
flex-wrap: wrap;
margin-bottom: 24rpx;
@@ -138,7 +143,7 @@
flex-direction: column;
margin-top: 24rpx;
image {
.img {
width: 96rpx;
height: 96rpx;
}
@@ -154,7 +159,7 @@
}
}
.emoji-swiper {
height: 400rpx;
pages/conversation/chating/components/ChatingFooter/index.vue
+4 -4
View File
@@ -58,8 +58,8 @@
import {ChatingFooterActionTypes,UpdateMessageTypes,} from "@/constant";
import IMSDK, {IMMethods,MessageStatus,MessageType,} from "openim-uniapp-polyfill";
import UParse from "@/components/gaoyia-parse/parse.vue";
import CustomEditor from "./CustomEditor.vue";
import ChatingActionBar from "./ChatingActionBar.vue";
import CustomEditor from "./CustomEditor";
import ChatingActionBar from "./ChatingActionBar";
const needClearTypes = [MessageType.TextMessage];
@@ -533,7 +533,7 @@
.emoji_action {
margin-right: 24rpx;
}
image {
width: 26px;
height: 26px;
@@ -544,7 +544,7 @@
height: 30px;
line-height: 30px;
background-color: $uni-color-success;
padding: 0 8px;
padding: 0 8px;
border-radius: 4px;
color: #fff;
}
pages/conversation/chating/components/ChatingHeader.vue
+4 -4
View File
@@ -1,7 +1,7 @@
<template>
<u-navbar @click="click" placeholder class="chating_header" bgColor="transparent">
<view @click="routeBack" class="u-nav-slot" slot="left">
<img class="back_icon" width="12" height="20" src="static/images/common_left_arrow.png" alt="" srcset="" />
<image class="back_icon" style="width: 12px; height: 20px;" src="/static/images/common_left_arrow.png"></image>
</view>
<view class="u-nav-slot" slot="center">
<view class="chating_info" :class="{ chating_info_single: isSingle }">
@@ -122,7 +122,7 @@
flex-direction: row;
justify-content: center;
@include vCenterBox();
.title {
@include nomalEllipsis();
max-width: 280rpx;
@@ -179,7 +179,7 @@
}
}
}
.group_announcement_tab {
display: flex;
flex-direction: column;
@@ -218,7 +218,7 @@
min-width: 16px;
}
}
.group_calling_tab {
position: absolute;
left: 0;
pages/conversation/chating/components/ChatingList.vue
+1 -1
View File
@@ -25,7 +25,7 @@
<script>
import {mapGetters,mapActions} from "vuex";
import MessageItemRender from "./MessageItem/index.vue";
import MessageItemRender from "./MessageItem/index";
export default {
name: "",
pages/conversation/chating/components/MessageItem/MediaMessageRender.vue
+17 -17
View File
@@ -58,24 +58,24 @@ export default {
<style lang="scss" scoped>
.media_message_container {
position: relative;
border-radius: 16rpx;
overflow: hidden;
position: relative;
border-radius: 16rpx;
overflow: hidden;
.play_icon {
width: 48px;
height: 48px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.play_icon {
width: 48px;
height: 48px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.video_duration {
position: absolute;
bottom: 12rpx;
right: 24rpx;
color: #fff;
}
.video_duration {
position: absolute;
bottom: 12rpx;
right: 24rpx;
color: #fff;
}
}
</style>
pages/conversation/chating/components/MessageItem/index.vue
+9 -131
View File
@@ -12,7 +12,7 @@
<view style="height: 100%;display: flex;justify-items: center;align-items: center;">
<view class="message_send_state">
<u-loading-icon v-if="showSending && !isPreview" />
<image v-if="isFailedMessage && !isPreview" src="@/static/images/chating_message_failed.png" />
<image v-if="isFailedMessage && !isPreview" class="state_img" src="@/static/images/chating_message_failed.png" />
</view>
</view>
<view class="message_content_wrap message_content_wrap_shadow" :id="`message_content_wrap_${source.clientMsgID}`" @longtap.stop.prevent="longtapEvent($event)">
@@ -23,12 +23,6 @@
</view>
</view>
<!-- 长按菜单 -->
<chunLei-popups v-model="toolTipFlag" :popData="toolTipData" @tapPopup="tapPopup"
:x="toolTipX" :y="toolTipY" :placement="popPostion"
:triangle="false"
direction="row" theme="dark" :dynamic="true">
</chunLei-popups>
</view>
<view v-else class="notice_message_container" style="margin: 0 auto;" :id="`auchor${source.clientMsgID}`">
@@ -39,11 +33,10 @@
<script>
import {mapGetters} from "vuex";
import {MessageStatus,MessageType,SessionType,} from "openim-uniapp-polyfill";
import chunLeiPopups from "@/components/chunLei-popups.vue";
import MyAvatar from "@/components/MyAvatar/index.vue";
import TextMessageRender from "./TextMessageRender.vue";
import MediaMessageRender from "./MediaMessageRender.vue";
import ErrorMessageRender from "./ErrorMessageRender.vue";
import TextMessageRender from "./TextMessageRender";
import MediaMessageRender from "./MediaMessageRender";
import ErrorMessageRender from "./ErrorMessageRender";
import {noticeMessageTypes} from "@/constant";
import {tipMessaggeFormat,formatMessageTime} from "@/util/imCommon";
@@ -56,8 +49,7 @@
MyAvatar,
TextMessageRender,
MediaMessageRender,
ErrorMessageRender,
chunLeiPopups
ErrorMessageRender
},
props: {
source: Object,
@@ -139,123 +131,9 @@
},
longtapEvent(e){
console.log('longtapEvent');
// console.log("#"+e.currentTarget.id,e);
// let view = uni.createSelectorQuery().in(this).select("#"+e.currentTarget.id.replace('message_content_wrap_','auchor'));
// console.log(e.touches[0].clientX,e.touches[0].clientY);
// view.boundingClientRect((data) => {
// console.log(data.left,data.top);
// //console.log("得到布局位置信息" + JSON.stringify(data));
// }).exec();
this.$emit('userEvent',{type:"longtapMsgContent"},this.source);
//this.showToolTip(e);
},
//操作项
showToolTip: function(e) {
let that = this;
that.toolTipData=[
{
id: 1,
icon: '/static/images/chat/longTipIcon/copy.png',
title: '复制',
disabled: false
},
{
id: 4,
icon: '/static/images/chat/longTipIcon/zhuanfa.png',
title: '转发',
disabled: false
},
{
id: 6,
icon: '/static/images/chat/longTipIcon/select.png',
title: '多选',
disabled: false
},
{
id: 7,
icon: '/static/images/chat/longTipIcon/delete.png',
title: '删除',
disabled: false
},
// {
// id: 5,
// icon: '/static/images/chat/longTipIcon/tag.png',
// title: '编辑',
// disabled: false
// }
];
that.toolTipX =e.touches[0].clientX;
that.toolTipY = e.touches[0].clientY-20;
that.toolTipFlag = !that.toolTipFlag;
if(that.toolTipFlag==true){
let nowTime=new Date().getTime();
let msgTime=that.source.createTime;
let diff= nowTime-msgTime;
if(this.isSender&&diff<120000){
that.toolTipData.push({
id: 3,
icon: '/static/images/chat/longTipIcon/revert.png',
title: '撤回',
disabled: false
})
}
}
},
tapPopup(e) {
let that = this;
let currentHandleMsg=that.source;
console.log(currentHandleMsg);
if (e.title == "撤回") {
that.toolTipFlag = false;
that.$emit('userEvent',{type:'revokeMessage'},that.source);
}
if (e.title == "复制") {
let content = currentHandleMsg.textElem?.content;
if (content) {
let copyContent =content.text;
let formatStr = copyContent;
//let formatStr = this.replaceReseverEmoji(copyContent);
uni.setClipboardData({
data:formatStr,
success: (res) => {
uni.showToast({
title: res,
icon: 'none'
})
},
error: (e) => {
uni.showToast({
title: e,
icon: 'none',
duration: 3000,
})
}
})
}
that.toolTipFlag = false;
return;
}
if (e.title == "转发") {
that.$emit('userEvent',{type:'forward'},that.source);
that.toolTipFlag = false;
return
}
if(e.title=="调换"){
that.toolTipFlag = false;
return;
}
if (e.title == "多选") {
that.$emit('userEvent',{type:'select'},that.source);
that.toolTipFlag = false;
return
}
if (e.title == "删除") {
that.toolTipFlag = false;
that.$emit('userEvent',{type:'deleteMsg'},that.source);
return
}
},
},
};
</script>
@@ -346,7 +224,7 @@
color: #999;
}
image {
.state_img {
width: 16px;
height: 16px;
}
@@ -376,7 +254,7 @@
}
.message_content_wrap {
flex-direction: row-reverse;
.bg_container {
border-radius: 12rpx 0 12rpx 12rpx;
background-color: #94ec68 !important;
@@ -398,7 +276,7 @@
background-color: #fdf5e9;
}
}
.notice_message_container {
@include ellipsisWithLine(2);
text-align: center;
pages/conversation/chating/components/SelectHeader.vue
+1 -1
View File
@@ -51,7 +51,7 @@
flex-direction: row;
justify-content: center;
@include vCenterBox();
.title {
@include nomalEllipsis();
max-width: 280rpx;