修改撤回、群公告、转发等类型消息的展示逻辑
This commit is contained in:
parent
5f4dd80b2a
commit
f9d02d67a6
@ -16,12 +16,16 @@ const props = defineProps({
|
||||
createdAt: {
|
||||
type: String,
|
||||
required: false
|
||||
}
|
||||
},
|
||||
modalTitle: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
})
|
||||
const isShow=defineModel<boolean>('show')
|
||||
const { showUserInfoModal } = useInject()
|
||||
const items = ref<ITalkRecord[]>([])
|
||||
const title = ref('会话记录')
|
||||
const title = ref(props?.modalTitle || '会话记录')
|
||||
|
||||
const onMaskClick = () => {
|
||||
isShow.value=false
|
||||
@ -30,7 +34,7 @@ const onMaskClick = () => {
|
||||
const onLoadData = () => {
|
||||
ServeGetForwardRecords({
|
||||
msg_id: props.msgId,
|
||||
biz_date: parseTime(new Date(props.createdAt), '{y}{m}')
|
||||
biz_date: parseTime(new Date(props.createdAt || ''), '{y}{m}')
|
||||
}).then((res) => {
|
||||
if (res.code == 200) {
|
||||
items.value = res.data.items || []
|
||||
|
||||
@ -12,7 +12,13 @@ const props = defineProps<{
|
||||
const isShowRecord = ref(false)
|
||||
|
||||
const title = computed(() => {
|
||||
return [...new Set(props.extra.records.map((v) => v.nickname))].join('、')
|
||||
const uniqueNames = [...new Set(props.extra.records.map(v => v.nickname))];
|
||||
if (uniqueNames.length <= 2) {
|
||||
return uniqueNames.join('和');
|
||||
} else {
|
||||
return uniqueNames.slice(0, 2).join('和') + '等';
|
||||
}
|
||||
// return [...new Set(props.extra.records.map((v) => v.nickname))].join('和')
|
||||
})
|
||||
|
||||
const onClick = () => {
|
||||
@ -21,7 +27,7 @@ const onClick = () => {
|
||||
</script>
|
||||
<template>
|
||||
<section class="im-message-forward pointer" @click="onClick">
|
||||
<div class="title">{{ title }} 的会话记录</div>
|
||||
<div class="title">{{ extra.forward_name || title}}的会话记录</div>
|
||||
<div class="list" v-for="(record, index) in extra.records" :key="index">
|
||||
<p>
|
||||
<span>{{ record.nickname }}: </span>
|
||||
@ -33,7 +39,7 @@ const onClick = () => {
|
||||
<span>转发：聊天会话记录 ({{ extra.msg_ids.length }}条)</span>
|
||||
</div>
|
||||
|
||||
<ForwardRecord v-model:show="isShowRecord" :msg-id="data.msg_id" @close="isShowRecord = false" :created-at="data.created_at"/>
|
||||
<ForwardRecord v-model:show="isShowRecord" :msg-id="data.msg_id" @close="isShowRecord = false" :created-at="data.created_at" :modalTitle="(extra.forward_name || title) + '的会话记录'"/>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
@ -41,19 +47,21 @@ const onClick = () => {
|
||||
.im-message-forward {
|
||||
width: 250px;
|
||||
min-height: 95px;
|
||||
max-height: 150px;
|
||||
max-height: 190px;
|
||||
border-radius: 10px;
|
||||
padding: 8px 10px;
|
||||
border: 1px solid var(--im-message-border-color);
|
||||
user-select: none;
|
||||
|
||||
.title {
|
||||
height: 30px;
|
||||
max-height: 60px;
|
||||
line-height: 30px;
|
||||
font-size: 15px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
font-weight: 400;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
@ -11,12 +11,20 @@ defineProps<{
|
||||
let show = ref(false)
|
||||
</script>
|
||||
<template>
|
||||
<section class="im-message-group-notice pointer" @click="show = !show">
|
||||
<section
|
||||
class="im-message-group-notice pointer"
|
||||
@click="show = !show"
|
||||
:class="{
|
||||
left: data.float === 'left',
|
||||
right: data.float === 'right'
|
||||
}"
|
||||
>
|
||||
<div class="title">
|
||||
<n-tag :bordered="false" size="small" type="primary"> 群公告 </n-tag>
|
||||
《{{ extra.title }}》
|
||||
<!-- <n-tag :bordered="false" size="small" type="primary"> 群公告 </n-tag>
|
||||
《{{ extra.title }}》 -->
|
||||
<text>群公告</text>
|
||||
</div>
|
||||
<div class="content" :class="{ ellipsis: !show }">
|
||||
<div class="title" :class="{ ellipsis: !show }">
|
||||
{{ extra.content }}
|
||||
</div>
|
||||
</section>
|
||||
@ -30,14 +38,14 @@ let show = ref(false)
|
||||
padding: 8px 10px;
|
||||
border: 1px solid var(--im-message-border-color);
|
||||
user-select: none;
|
||||
background-color: #fff;
|
||||
|
||||
.title {
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
font-size: 14px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
line-height: 44rpx;
|
||||
font-size: 32rpx;
|
||||
// overflow: hidden;
|
||||
// text-overflow: ellipsis;
|
||||
// white-space: nowrap;
|
||||
font-weight: 400;
|
||||
margin-bottom: 5px;
|
||||
position: relative;
|
||||
@ -56,5 +64,18 @@ let show = ref(false)
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
&.left {
|
||||
background-color: #fff;
|
||||
border-radius: 0 16rpx 16rpx 16rpx;
|
||||
}
|
||||
|
||||
&.right {
|
||||
background-color: #46299d;
|
||||
border-radius: 16rpx 0 16rpx 16rpx;
|
||||
.title {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -27,6 +27,16 @@ const props = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
default: () => {}
|
||||
},
|
||||
revokeInfo: {
|
||||
type: Object,
|
||||
default() {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
extra: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
})
|
||||
|
||||
@ -42,16 +52,104 @@ const onRevoke = () => {
|
||||
</script>
|
||||
<template>
|
||||
<div class="im-message-revoke">
|
||||
<div class="content">
|
||||
<div v-if="login_uid === user_id">
|
||||
<span> 你撤回了一条消息 | {{ formatTime(datetime) }} </span>
|
||||
<n-button @click="onRevoke" v-if="data.msg_type === 1&&data.extra?.content" text class="text-#46299D text-11px">重新编辑</n-button>
|
||||
</div>
|
||||
<span v-else-if="talk_type == 1"> 对方撤回了一条消息 | {{ formatTime(datetime) }} </span>
|
||||
<span v-else>
|
||||
"{{ nickname }}" 撤回了一条消息 |
|
||||
<div class="content" v-if="JSON.stringify(revokeInfo) !== '{}'">
|
||||
<span v-if="talk_type === 1 && login_uid === revokeInfo.withdraw_id">
|
||||
你撤回了一条消息 | {{ formatTime(datetime) }}
|
||||
</span>
|
||||
<span v-if="talk_type === 1 && login_uid !== revokeInfo.withdraw_id">
|
||||
{{ revokeInfo.withdraw_name }}撤回了一条消息 | {{ formatTime(datetime) }}
|
||||
</span>
|
||||
<span
|
||||
v-if="
|
||||
talk_type === 2 &&
|
||||
login_uid === revokeInfo.withdraw_id &&
|
||||
login_uid === revokeInfo.retracted_id
|
||||
"
|
||||
>
|
||||
你撤回了一条消息 |
|
||||
{{ formatTime(datetime) }}
|
||||
<slot></slot>
|
||||
</span>
|
||||
<span
|
||||
v-if="
|
||||
talk_type === 2 &&
|
||||
login_uid === revokeInfo.withdraw_id &&
|
||||
login_uid !== revokeInfo.retracted_id
|
||||
"
|
||||
>
|
||||
你撤回了{{ revokeInfo.retracted_name }}一条消息 |
|
||||
{{ formatTime(datetime) }}
|
||||
</span>
|
||||
<span
|
||||
v-if="
|
||||
talk_type === 2 &&
|
||||
login_uid !== revokeInfo.withdraw_id &&
|
||||
revokeInfo.withdraw_id === revokeInfo.retracted_id
|
||||
"
|
||||
>
|
||||
{{ revokeInfo.withdraw_name }}撤回了一条消息 |
|
||||
{{ formatTime(datetime) }}
|
||||
</span>
|
||||
|
||||
<span
|
||||
v-if="
|
||||
talk_type === 2 &&
|
||||
login_uid !== revokeInfo.withdraw_id &&
|
||||
login_uid === revokeInfo.retracted_id &&
|
||||
revokeInfo.withdraw_id !== revokeInfo.retracted_id
|
||||
"
|
||||
>
|
||||
{{ revokeInfo.withdraw_name }}撤回了你一条消息 |
|
||||
{{ formatTime(datetime) }}
|
||||
</span>
|
||||
<span
|
||||
v-if="
|
||||
talk_type === 2 &&
|
||||
login_uid !== revokeInfo.withdraw_id &&
|
||||
login_uid !== revokeInfo.retracted_id &&
|
||||
revokeInfo.withdraw_id !== revokeInfo.retracted_id
|
||||
"
|
||||
>
|
||||
{{ revokeInfo.withdraw_name }}撤回了{{ revokeInfo.retracted_name }}一条消息 |
|
||||
{{ formatTime(datetime) }}
|
||||
</span>
|
||||
|
||||
<div style="display: inline-block;" v-if="login_uid === user_id">
|
||||
<n-button
|
||||
@click="onRevoke"
|
||||
v-if="data.msg_type === 1 && data.extra?.content"
|
||||
text
|
||||
class="text-#46299D text-11px"
|
||||
>重新编辑</n-button
|
||||
>
|
||||
</div>
|
||||
<!-- <span v-if="login_uid == user_idA"> 你撤回B了一条消息 | {{ formatTime(datetime) }} </span>
|
||||
<span v-else-if="login_uid == user_idB"> A撤回你了一条消息 | {{ formatTime(datetime) }} </span>
|
||||
<span v-else> A撤回B了一条消息 | {{ formatTime(datetime) }} </span> -->
|
||||
</div>
|
||||
<div class="content" v-if="JSON.stringify(revokeInfo) === '{}'">
|
||||
<span v-if="talk_type === 1 && login_uid === user_id">
|
||||
你撤回了一条消息 | {{ formatTime(datetime) }}
|
||||
</span>
|
||||
<span v-if="talk_type === 1 && login_uid !== user_id">
|
||||
{{ nickname }}撤回了一条消息 | {{ formatTime(datetime) }}
|
||||
</span>
|
||||
<span v-if="talk_type === 2 && !extra && login_uid === user_id">
|
||||
你撤回了一条消息 | {{ formatTime(datetime) }}
|
||||
</span>
|
||||
<span v-if="talk_type === 2 && !extra && login_uid !== user_id">
|
||||
{{ nickname }}撤回了一条消息 | {{ formatTime(datetime) }}
|
||||
</span>
|
||||
<span v-if="talk_type === 2 && extra"> {{ extra }} | {{ formatTime(datetime) }} </span>
|
||||
<div style="display: inline-block;" v-if="login_uid === user_id">
|
||||
<n-button
|
||||
@click="onRevoke"
|
||||
v-if="data.msg_type === 1 && data.extra?.content"
|
||||
text
|
||||
class="text-#46299D text-11px"
|
||||
>重新编辑</n-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -70,6 +70,12 @@ class Revoke extends Base {
|
||||
useTalkStore().updateItem({
|
||||
index_name: this.getIndexName(),
|
||||
msg_text: this.resource.text,
|
||||
revokeInfo: {
|
||||
retracted_id: this.resource.retracted_id,
|
||||
retracted_name: this.resource.retracted_name,
|
||||
withdraw_id: this.resource.withdraw_id,
|
||||
withdraw_name: this.resource.withdraw_name,
|
||||
},
|
||||
updated_at: parseTime(new Date())
|
||||
})
|
||||
|
||||
@ -80,6 +86,12 @@ class Revoke extends Base {
|
||||
|
||||
useDialogueStore().updateDialogueRecord({
|
||||
msg_id: this.msg_id,
|
||||
revokeInfo: {
|
||||
retracted_id: this.resource.retracted_id,
|
||||
retracted_name: this.resource.retracted_name,
|
||||
withdraw_id: this.resource.withdraw_id,
|
||||
withdraw_name: this.resource.withdraw_name,
|
||||
},
|
||||
is_revoke: 1
|
||||
})
|
||||
}
|
||||
|
||||
@ -51,7 +51,8 @@ export interface ITalkRecord {
|
||||
float: string,
|
||||
is_convert_text?:number//语音记录的 是否是在展示转文本状态 1：是 0：否,
|
||||
erp_user_id:number,
|
||||
read_total_num:number
|
||||
read_total_num:number,
|
||||
revokeInfo?: any
|
||||
}
|
||||
|
||||
export interface ITalkRecordExtraText {
|
||||
@ -81,6 +82,7 @@ export interface ITalkRecordExtraForward {
|
||||
}[]
|
||||
talk_type: number
|
||||
user_id: number
|
||||
forward_name?: any
|
||||
}
|
||||
|
||||
export interface ITalkRecordExtraGroupNotice {
|
||||
|
||||
@ -766,6 +766,8 @@ const onCustomSkipBottomEvent = () => {
|
||||
:nickname="item.nickname"
|
||||
:talk_type="item.talk_type"
|
||||
:datetime="item.created_at"
|
||||
:revokeInfo="item.revokeInfo"
|
||||
:extra="item.extra"
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user