53 lines
1.3 KiB
Vue
53 lines
1.3 KiB
Vue
<script setup>
|
|
import LiveCallItem from '@/components/liveCall/liveCallItem.vue'
|
|
const dialogVisible = ref(false);
|
|
const recordLeftRef = ref(null);
|
|
const open = (row) => {
|
|
dialogVisible.value = true;
|
|
};
|
|
|
|
const leftHeadData = ref({
|
|
username: '张三',
|
|
phone: '13546812315',
|
|
orderName: '张三工单',
|
|
})
|
|
|
|
const recordLeftObj = ref({
|
|
content: []
|
|
});
|
|
|
|
const scrollToBottom = (scrollbarRef) => {
|
|
if (scrollbarRef) {
|
|
const container = scrollbarRef.$el.querySelector('.el-scrollbar__wrap');
|
|
container.style.scrollBehavior = 'smooth'; // 添加平滑滚动效果
|
|
container.scrollTop = container.scrollHeight;
|
|
}
|
|
};
|
|
|
|
scrollToBottom(recordLeftRef.value)
|
|
|
|
defineExpose({
|
|
open,
|
|
});
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<el-dialog v-model="dialogVisible" title="历史通话记录" width="600" :before-close="handleClose" class="box">
|
|
<LiveCallItem ref="recordLeftRef" :recordObj="recordLeftObj" :headData="leftHeadData" style="width: 100%;" />
|
|
<template #footer>
|
|
<div class="dialog-footer">
|
|
<el-button type="primary" @click="dialogVisible = false">
|
|
关闭
|
|
</el-button>
|
|
</div>
|
|
</template>
|
|
</el-dialog>
|
|
</template>
|
|
|
|
<style>
|
|
.box {
|
|
height: 68vh;
|
|
}
|
|
</style>
|