odjbin/SmartOpsWeb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 优化直播通话组件的聊天内容展示和样式

Browse Source
This commit is contained in:
dj
2024-11-30 16:43:35 +08:00
parent da08543d9b
commit 00fb1e261a
3 changed files with 21 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
auto-imports.d.ts vendored
View File

@@ -6,6 +6,7 @@ export {}
declare global {
const EffectScope: typeof import('vue')['EffectScope']
const ElMessage: typeof import('element-plus/es')['ElMessage']
const ElMessageBox: typeof import('element-plus/es')['ElMessageBox']
const computed: typeof import('vue')['computed']
const createApp: typeof import('vue')['createApp']
const customRef: typeof import('vue')['customRef']

9
src/components/liveCall/LiveCallItemHome.vue
View File

@@ -19,7 +19,7 @@
<div v-for="(item,index) in recordObj.content" :key="index">
<el-divider border-style="dotted" v-if="item.isLine">{{ item.lineMsg }}</el-divider>
<div v-else>
<div class="time-grap"><span>{{ item.conversationTimestamp || '6月5日 12:05' }}</span></div>
<div class="time-grap"><span>{{ item.conversationTimestamp || '2024-11-24 21:31:55' }}</span></div>
<!-- 我的 -->
<div v-if="item.speaker==0" class="word-my">
<div class="info">
@@ -33,12 +33,12 @@
<div class="info-content" @contextmenu="showContextMenu($event,item.message)">{{ item.message }}</div>
</el-tooltip>
</div>
<el-avatar>{{ item.speaker == 0 ? recordObj.name : '运维助手' }}</el-avatar>
<el-avatar style="flex-shrink: 0;">{{ item.speaker == 0 ? recordObj.name : '运维助手' }}</el-avatar>
</div>
<!-- 对方 -->
<div v-else class="word">
<el-avatar> {{ item.speaker == 0 ? recordObj.name : '运维助手' }}</el-avatar>
<el-avatar style="flex-shrink: 0;"> {{ item.speaker == 0 ? recordObj.name : '运维助手' }}</el-avatar>
<div class="info">
<p class="name">{{ item.speaker == 0 ? recordObj.name : '运维助手' }} </p>
<div class="info-content">{{ item.message }}</div>
@@ -251,6 +251,7 @@ defineExpose({
}
.info-content {
//max-width: 94%;
padding: 10px;
font-size: 14px;
background: #f5f5f5;
@@ -299,7 +300,7 @@ defineExpose({
}
.info-content {
max-width: 70%;
max-width: 94%;
padding: 10px;
font-size: 14px;
float: right;

17
src/components/liveCall/index.vue
View File

@@ -52,13 +52,26 @@ const getCurrentMsg=(line)=>{
recordLeftObj.value.phone=res.data.callPhone
recordLeftObj.value.orderName=res.data.orderName
recordLeftObj.value.type=res.data.type
recordLeftObj.value.content=res.data.textVoList||[
recordLeftObj.value.content=res.data.textVoList||[]
// recordLeftObj.value.content=[
// {
// name: '张三',
// speaker: '1',
// conversationTimestamp:'2024-11-24 21:31:55',
// message: '2024年04月033日14:16:13六合变1号装置故障动作',
// },{
// name: '张三',
// speaker: '0',
// conversationTimestamp:'2024-11-24 21:31:56',
// message: '大概需要多长时间修复',
// },{
// name: '张三',
// speaker: '1',
// conversationTimestamp:'2024-11-24 21:31:58',
// message: '这个很难确定具体的修复时间呢，因为还不清楚故障的具体情况。但我们希望您能以最快的速度进行处理，尽量减少对业务的影响。',
// }
]
//
// ]
}else if(line==2){
recordRightObj.value.name=res.data.name
recordRightObj.value.phone=res.data.callPhone