|
@@ -11,9 +11,9 @@
|
|
|
<div class="user-date">{{ formatDate(item.timestamps, 'YYYY-mm-dd HH:MM:SS') }}</div>
|
|
|
</div>
|
|
|
<div class="user-content">{{ item.body?.content?.callSentenceInfo.text }}</div>
|
|
|
- <div class="user-tag">
|
|
|
- <el-tag v-for="(items, index) in item.body?.content?.callSentenceInfo.tags" size="small">{{items}}</el-tag>
|
|
|
- </div>
|
|
|
+ <div class="user-tag">
|
|
|
+ <el-tag v-for="(items, index) in item.body?.content?.callSentenceInfo.tags" size="small">{{ items }}</el-tag>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div v-else class="agent">
|
|
|
<img v-lazy="getImageUrl('order/service.png')" alt="" class="agent-avatar" src="" />
|
|
@@ -22,9 +22,9 @@
|
|
|
{{ item.body?.content?.calledNumber }}
|
|
|
</div>
|
|
|
<div class="agent-content">{{ item.body?.content?.callSentenceInfo.text }}</div>
|
|
|
- <div class="agent-tag">
|
|
|
- <el-tag v-for="(items, index) in item.body?.content?.callSentenceInfo.tags" size="small">{{items}}</el-tag>
|
|
|
- </div>
|
|
|
+ <div class="agent-tag">
|
|
|
+ <el-tag v-for="(items, index) in item.body?.content?.callSentenceInfo.tags" size="small">{{ items }}</el-tag>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<el-text class="end-call" tag="p" v-if="talkEnd">-- 通话结束 --</el-text>
|
|
@@ -113,7 +113,7 @@
|
|
|
</template>
|
|
|
<script setup lang="ts" name="orderAcceptVoiceAssistant">
|
|
|
import { nextTick, onActivated, onDeactivated, onMounted, ref, watch } from 'vue';
|
|
|
-import { ElMessage, ElMessageBox } from "element-plus";
|
|
|
+import { ElMessage, ElMessageBox } from 'element-plus';
|
|
|
import { getImageUrl } from '@/utils/tools';
|
|
|
import { useRoute } from 'vue-router';
|
|
|
import { formatDate } from '@/utils/formatTime';
|
|
@@ -124,7 +124,7 @@ import other from '@/utils/other';
|
|
|
const emit = defineEmits(['orderOverwrite']);
|
|
|
// 消息列表
|
|
|
const messageList = ref<any>([
|
|
|
-/* {
|
|
|
+ /* {
|
|
|
body: {
|
|
|
content: {
|
|
|
callSentenceInfo: {
|
|
@@ -154,242 +154,34 @@ const messageList = ref<any>([
|
|
|
},*/
|
|
|
]); // 消息列表
|
|
|
const showMessageList = ref([
|
|
|
-/* {
|
|
|
- body: {
|
|
|
- content: {
|
|
|
- callSentenceInfo: {
|
|
|
- text: '你好,我是小智,有什么可以帮您的吗122222222222222222222222dsadsadddddddddd?',
|
|
|
- role: 'agent',
|
|
|
- tags:['语速过快','情绪激动']
|
|
|
- },
|
|
|
- calledNumber: '1009',
|
|
|
- callerNumber: '19136073037',
|
|
|
- },
|
|
|
- },
|
|
|
- timestamps: new Date().getTime(),
|
|
|
- },
|
|
|
- {
|
|
|
- body: {
|
|
|
- content: {
|
|
|
- callSentenceInfo: {
|
|
|
- text: '12311?',
|
|
|
- role: 'user',
|
|
|
- tags:['语速过快','情绪激动']
|
|
|
- },
|
|
|
- calledNumber: '1009',
|
|
|
- callerNumber: '19136073037',
|
|
|
- },
|
|
|
- },
|
|
|
- timestamps: new Date().getTime(),
|
|
|
- },{
|
|
|
- body: {
|
|
|
- content: {
|
|
|
- callSentenceInfo: {
|
|
|
- text: '12311?',
|
|
|
- role: 'user',
|
|
|
- tags:['语速过快','情绪激动']
|
|
|
- },
|
|
|
- calledNumber: '1009',
|
|
|
- callerNumber: '19136073037',
|
|
|
- },
|
|
|
- },
|
|
|
- timestamps: new Date().getTime(),
|
|
|
- },{
|
|
|
- body: {
|
|
|
- content: {
|
|
|
- callSentenceInfo: {
|
|
|
- text: '12311?',
|
|
|
- role: 'user',
|
|
|
- tags:['语速过快','情绪激动']
|
|
|
- },
|
|
|
- calledNumber: '1009',
|
|
|
- callerNumber: '19136073037',
|
|
|
- },
|
|
|
- },
|
|
|
- timestamps: new Date().getTime(),
|
|
|
- },{
|
|
|
- body: {
|
|
|
- content: {
|
|
|
- callSentenceInfo: {
|
|
|
- text: '12311?',
|
|
|
- role: 'user',
|
|
|
- tags:['语速过快','情绪激动']
|
|
|
- },
|
|
|
- calledNumber: '1009',
|
|
|
- callerNumber: '19136073037',
|
|
|
- },
|
|
|
- },
|
|
|
- timestamps: new Date().getTime(),
|
|
|
- },{
|
|
|
- body: {
|
|
|
- content: {
|
|
|
- callSentenceInfo: {
|
|
|
- text: '12311?',
|
|
|
- role: 'user',
|
|
|
- tags:['语速过快','情绪激动']
|
|
|
- },
|
|
|
- calledNumber: '1009',
|
|
|
- callerNumber: '19136073037',
|
|
|
- },
|
|
|
- },
|
|
|
- timestamps: new Date().getTime(),
|
|
|
- },{
|
|
|
- body: {
|
|
|
- content: {
|
|
|
- callSentenceInfo: {
|
|
|
- text: '12311?',
|
|
|
- role: 'user',
|
|
|
- tags:['语速过快','情绪激动']
|
|
|
- },
|
|
|
- calledNumber: '1009',
|
|
|
- callerNumber: '19136073037',
|
|
|
- },
|
|
|
- },
|
|
|
- timestamps: new Date().getTime(),
|
|
|
- },{
|
|
|
- body: {
|
|
|
- content: {
|
|
|
- callSentenceInfo: {
|
|
|
- text: '12311?',
|
|
|
- role: 'user',
|
|
|
- tags:['语速过快','情绪激动']
|
|
|
- },
|
|
|
- calledNumber: '1009',
|
|
|
- callerNumber: '19136073037',
|
|
|
- },
|
|
|
- },
|
|
|
- timestamps: new Date().getTime(),
|
|
|
- },{
|
|
|
- body: {
|
|
|
- content: {
|
|
|
- callSentenceInfo: {
|
|
|
- text: '12311?',
|
|
|
- role: 'user',
|
|
|
- tags:['语速过快','情绪激动']
|
|
|
- },
|
|
|
- calledNumber: '1009',
|
|
|
- callerNumber: '19136073037',
|
|
|
- },
|
|
|
- },
|
|
|
- timestamps: new Date().getTime(),
|
|
|
- },{
|
|
|
- body: {
|
|
|
- content: {
|
|
|
- callSentenceInfo: {
|
|
|
- text: '12311?',
|
|
|
- role: 'user',
|
|
|
- tags:['语速过快','情绪激动']
|
|
|
- },
|
|
|
- calledNumber: '1009',
|
|
|
- callerNumber: '19136073037',
|
|
|
- },
|
|
|
- },
|
|
|
- timestamps: new Date().getTime(),
|
|
|
- },{
|
|
|
- body: {
|
|
|
- content: {
|
|
|
- callSentenceInfo: {
|
|
|
- text: '12311?',
|
|
|
- role: 'user',
|
|
|
- tags:['语速过快','情绪激动']
|
|
|
- },
|
|
|
- calledNumber: '1009',
|
|
|
- callerNumber: '19136073037',
|
|
|
- },
|
|
|
- },
|
|
|
- timestamps: new Date().getTime(),
|
|
|
- },{
|
|
|
- body: {
|
|
|
- content: {
|
|
|
- callSentenceInfo: {
|
|
|
- text: '12311?',
|
|
|
- role: 'user',
|
|
|
- tags:['语速过快','情绪激动']
|
|
|
+ /* {
|
|
|
+ body: {
|
|
|
+ content: {
|
|
|
+ callSentenceInfo: {
|
|
|
+ text: '你好,我是小智,有什么可以帮您的吗?',
|
|
|
+ role: 'agent',
|
|
|
+ tags:['语速过快','情绪激动']
|
|
|
+ },
|
|
|
+ calledNumber: '1009',
|
|
|
+ callerNumber: '19136073037',
|
|
|
},
|
|
|
- calledNumber: '1009',
|
|
|
- callerNumber: '19136073037',
|
|
|
},
|
|
|
+ timestamps: new Date().getTime(),
|
|
|
},
|
|
|
- timestamps: new Date().getTime(),
|
|
|
- },{
|
|
|
- body: {
|
|
|
- content: {
|
|
|
- callSentenceInfo: {
|
|
|
- text: '12311?',
|
|
|
- role: 'user',
|
|
|
- tags:['语速过快','情绪激动']
|
|
|
- },
|
|
|
- calledNumber: '1009',
|
|
|
- callerNumber: '19136073037',
|
|
|
- },
|
|
|
- },
|
|
|
- timestamps: new Date().getTime(),
|
|
|
- },{
|
|
|
- body: {
|
|
|
- content: {
|
|
|
- callSentenceInfo: {
|
|
|
- text: '12311?',
|
|
|
- role: 'user',
|
|
|
- tags:['语速过快','情绪激动']
|
|
|
+ {
|
|
|
+ body: {
|
|
|
+ content: {
|
|
|
+ callSentenceInfo: {
|
|
|
+ text: '12311?',
|
|
|
+ role: 'user',
|
|
|
+ tags:['语速过快','情绪激动']
|
|
|
+ },
|
|
|
+ calledNumber: '1009',
|
|
|
+ callerNumber: '19136073037',
|
|
|
},
|
|
|
- calledNumber: '1009',
|
|
|
- callerNumber: '19136073037',
|
|
|
},
|
|
|
- },
|
|
|
- timestamps: new Date().getTime(),
|
|
|
- },{
|
|
|
- body: {
|
|
|
- content: {
|
|
|
- callSentenceInfo: {
|
|
|
- text: '12311?',
|
|
|
- role: 'user',
|
|
|
- tags:['语速过快','情绪激动']
|
|
|
- },
|
|
|
- calledNumber: '1009',
|
|
|
- callerNumber: '19136073037',
|
|
|
- },
|
|
|
- },
|
|
|
- timestamps: new Date().getTime(),
|
|
|
- },{
|
|
|
- body: {
|
|
|
- content: {
|
|
|
- callSentenceInfo: {
|
|
|
- text: '12311?',
|
|
|
- role: 'user',
|
|
|
- tags:['语速过快','情绪激动']
|
|
|
- },
|
|
|
- calledNumber: '1009',
|
|
|
- callerNumber: '19136073037',
|
|
|
- },
|
|
|
- },
|
|
|
- timestamps: new Date().getTime(),
|
|
|
- },{
|
|
|
- body: {
|
|
|
- content: {
|
|
|
- callSentenceInfo: {
|
|
|
- text: '12311?',
|
|
|
- role: 'user',
|
|
|
- tags:['语速过快','情绪激动']
|
|
|
- },
|
|
|
- calledNumber: '1009',
|
|
|
- callerNumber: '19136073037',
|
|
|
- },
|
|
|
- },
|
|
|
- timestamps: new Date().getTime(),
|
|
|
- },{
|
|
|
- body: {
|
|
|
- content: {
|
|
|
- callSentenceInfo: {
|
|
|
- text: '12311?',
|
|
|
- role: 'user',
|
|
|
- tags:['语速过快','情绪激动']
|
|
|
- },
|
|
|
- calledNumber: '1009',
|
|
|
- callerNumber: '19136073037',
|
|
|
- },
|
|
|
- },
|
|
|
- timestamps: new Date().getTime(),
|
|
|
- },*/
|
|
|
+ timestamps: new Date().getTime(),
|
|
|
+ },*/
|
|
|
]);
|
|
|
const recognizeList = ref<EmptyObjectType>({}); // 识别信息
|
|
|
const route = useRoute();
|
|
@@ -455,7 +247,7 @@ const getRecognize = async () => {
|
|
|
recognizeList.value = result;
|
|
|
} catch (error) {
|
|
|
console.log('获取识别内容失败', error);
|
|
|
- ElMessage.error('获取识别内容失败');
|
|
|
+ ElMessage.error('获取识别内容失败');
|
|
|
}
|
|
|
};
|
|
|
// 停止滚动
|
|
@@ -516,20 +308,19 @@ const subscribe = () => {
|
|
|
});
|
|
|
};
|
|
|
// 消息筛选
|
|
|
-const staticMessage = other.deepClone(messageList.value);
|
|
|
const filterMessage = (type: string) => {
|
|
|
switch (type) {
|
|
|
case '市民':
|
|
|
- showMessageList.value = staticMessage.filter((item: any) => item.body.content.callSentenceInfo.role === 'user');
|
|
|
+ showMessageList.value = messageList.value.filter((item: any) => item.body.content.callSentenceInfo.role === 'user');
|
|
|
break;
|
|
|
case '坐席':
|
|
|
- showMessageList.value = staticMessage.filter((item: any) => item.body.content.callSentenceInfo.role === 'agent');
|
|
|
+ showMessageList.value = messageList.value.filter((item: any) => item.body.content.callSentenceInfo.role === 'agent');
|
|
|
break;
|
|
|
case '全部':
|
|
|
- showMessageList.value = staticMessage;
|
|
|
+ showMessageList.value = messageList.value;
|
|
|
break;
|
|
|
default:
|
|
|
- showMessageList.value = staticMessage;
|
|
|
+ showMessageList.value = messageList.value;
|
|
|
break;
|
|
|
}
|
|
|
};
|
|
@@ -574,9 +365,9 @@ defineExpose({
|
|
|
color: var(--el-color-white);
|
|
|
margin: 10px 10px 50px 10px;
|
|
|
display: flex;
|
|
|
- &:last-child {
|
|
|
- margin-bottom: 0;
|
|
|
- }
|
|
|
+ &:last-child {
|
|
|
+ margin-bottom: 0;
|
|
|
+ }
|
|
|
.user {
|
|
|
&-content {
|
|
|
border-radius: var(--el-border-radius-base);
|
|
@@ -606,24 +397,24 @@ defineExpose({
|
|
|
margin-bottom: 5px;
|
|
|
margin-left: 65px;
|
|
|
|
|
|
- display: flex;
|
|
|
- justify-content: flex-end;
|
|
|
- align-items: center;
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ align-items: center;
|
|
|
}
|
|
|
|
|
|
&-date {
|
|
|
font-size: var(--el-font-size-extra-small);
|
|
|
color: var(--el-text-color-placeholder);
|
|
|
- margin-left: 10px;
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
+ &-tag {
|
|
|
+ position: absolute;
|
|
|
+ bottom: -30px;
|
|
|
+ left: 65px;
|
|
|
+ :deep(.el-tag) {
|
|
|
+ margin-right: 10px;
|
|
|
+ }
|
|
|
}
|
|
|
- &-tag{
|
|
|
- position: absolute;
|
|
|
- bottom: -30px;
|
|
|
- left: 65px;
|
|
|
- :deep(.el-tag){
|
|
|
- margin-right: 10px;
|
|
|
- }
|
|
|
- }
|
|
|
|
|
|
&-avatar {
|
|
|
width: 40px;
|
|
@@ -665,24 +456,24 @@ defineExpose({
|
|
|
margin-bottom: 5px;
|
|
|
text-align: right;
|
|
|
margin-right: 65px;
|
|
|
- display: flex;
|
|
|
- justify-content: flex-end;
|
|
|
- align-items: center;
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ align-items: center;
|
|
|
}
|
|
|
|
|
|
&-date {
|
|
|
font-size: var(--el-font-size-extra-small);
|
|
|
color: var(--el-text-color-placeholder);
|
|
|
- margin-right: 10px;
|
|
|
+ margin-right: 10px;
|
|
|
+ }
|
|
|
+ &-tag {
|
|
|
+ position: absolute;
|
|
|
+ bottom: -30px;
|
|
|
+ right: 65px;
|
|
|
+ :deep(.el-tag) {
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
}
|
|
|
- &-tag{
|
|
|
- position: absolute;
|
|
|
- bottom: -30px;
|
|
|
- right: 65px;
|
|
|
- :deep(.el-tag){
|
|
|
- margin-left: 10px;
|
|
|
- }
|
|
|
- }
|
|
|
&-avatar {
|
|
|
width: 40px;
|
|
|
height: 40px;
|