Merge pull request 'master' (#93) from master into test
Reviewed-on: http://git.feashow.cn/feashow/SmartOpsWeb/pulls/93
This commit is contained in:
@@ -3,6 +3,10 @@ const dialogVisible = ref(false);
|
|||||||
const open = (row) => {
|
const open = (row) => {
|
||||||
dialogVisible.value = true;
|
dialogVisible.value = true;
|
||||||
};
|
};
|
||||||
|
// console.log(dialogVisible.value);
|
||||||
|
defineProps({
|
||||||
|
title:String
|
||||||
|
})
|
||||||
defineExpose({
|
defineExpose({
|
||||||
open,
|
open,
|
||||||
});
|
});
|
||||||
@@ -10,7 +14,7 @@ defineExpose({
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<el-dialog v-model="dialogVisible" title="语音详情" width="500" :before-close="handleClose">
|
<el-dialog v-model="dialogVisible" :title="title" width="500" >
|
||||||
<audio src="" controls style="width: 100%;"></audio>
|
<audio src="" controls style="width: 100%;"></audio>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<div class="dialog-footer">
|
<div class="dialog-footer">
|
||||||
|
|||||||
@@ -6,7 +6,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="call-history"><h3 >历史通话记录</h3>
|
<div class="call-history"><h3 >历史通话记录</h3>
|
||||||
<fvTable ref="tableIns" :tableConfig="tableConfig" :data="mockData" @headBtnClick="headBtnClick"></fvTable>
|
<fvTable ref="tableIns" :tableConfig="tableConfig" :data="mockData" @headBtnClick="headBtnClick"></fvTable>
|
||||||
<voice ref="voiceRef" />
|
<voice ref="voiceRef" title="语音详情"/>
|
||||||
<infoLiveCall ref="infoLiveCallRef"/>
|
<infoLiveCall ref="infoLiveCallRef"/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -260,7 +260,7 @@ const headBtnClick = (key) => {
|
|||||||
const handleDetail = (row) => {
|
const handleDetail = (row) => {
|
||||||
// console.log(row);
|
// console.log(row);
|
||||||
|
|
||||||
workDialogRef.value.open(row)
|
workDialogRef.value.open()
|
||||||
rowData.value = row
|
rowData.value = row
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -1,20 +1,23 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { nextTick, onMounted, reactive, ref, watch } from "vue";
|
import { nextTick, onMounted, reactive, ref, watch } from "vue";
|
||||||
import { ElMessageBox } from "element-plus";
|
import { ElMessageBox } from "element-plus";
|
||||||
import { MoreFilled } from "@element-plus/icons-vue";
|
import { MoreFilled, Check, Download ,VideoPlay} from "@element-plus/icons-vue";
|
||||||
import { time } from "echarts";
|
import { time } from "echarts";
|
||||||
import { defineExpose } from "vue";
|
import { defineExpose } from "vue";
|
||||||
import { defineProps } from "vue";
|
import { defineProps } from "vue";
|
||||||
import { orderGetDetails } from "@/api/order/order.js"
|
import { orderGetDetails } from "@/api/order/order.js"
|
||||||
|
import Voice from '@/components/voice/index.vue'
|
||||||
//控制显示隐藏
|
//控制显示隐藏
|
||||||
const dialogVisible = ref(false);
|
const dialogVisible = ref(false);
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
rowData: Object
|
rowData: Object
|
||||||
})
|
})
|
||||||
|
|
||||||
let opsCallList = ref([]);
|
let opsCallList = ref([]);
|
||||||
let orderData = ref([]);
|
let orderData = ref([]);
|
||||||
let orderContent = ref([]);
|
let orderContent = ref([]);
|
||||||
|
const voiceRef=ref()
|
||||||
const open = (row) => {
|
const open = (row) => {
|
||||||
dialogVisible.value = true;
|
dialogVisible.value = true;
|
||||||
};
|
};
|
||||||
@@ -22,29 +25,77 @@ const open = (row) => {
|
|||||||
const getData = async () => {
|
const getData = async () => {
|
||||||
// console.log(123);
|
// console.log(123);
|
||||||
const data = await orderGetDetails(props.rowData.orderNumber)
|
const data = await orderGetDetails(props.rowData.orderNumber)
|
||||||
|
|
||||||
// console.log("111", data);
|
// console.log("111", data);
|
||||||
return data
|
return data
|
||||||
|
|
||||||
}
|
}
|
||||||
|
let contentState0 = [
|
||||||
let content = [
|
|
||||||
{
|
{
|
||||||
content: "待处理",
|
content: "待处理",
|
||||||
timestamp: "orderData.value",
|
timestamp: "orderData.value",
|
||||||
|
icon: Check,
|
||||||
color: "#0bbd87",
|
color: "#0bbd87",
|
||||||
|
size: "large",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
content: "已处理",
|
content: "已处理",
|
||||||
timestamp: "2022-07-20 20:00",
|
timestamp: "--",
|
||||||
type: "primary",
|
type: "primary",
|
||||||
icon: MoreFilled,
|
icon: MoreFilled,
|
||||||
size: "large",
|
size: "large",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
content: "结单",
|
content: "结单",
|
||||||
timestamp: "2022-07-20 20:00",
|
timestamp: "--",
|
||||||
size: "large",
|
size: "large",
|
||||||
|
// icon: Check,
|
||||||
|
// color: "#0bbd87",
|
||||||
|
},
|
||||||
|
];
|
||||||
|
let contentState1 = [
|
||||||
|
{
|
||||||
|
content: "待处理",
|
||||||
|
timestamp: "orderData.value",
|
||||||
|
icon: Check,
|
||||||
|
color: "#0bbd87",
|
||||||
|
size: "large",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
content: "已处理",
|
||||||
|
timestamp: "2022-07-20 20:00:00",
|
||||||
|
icon: Check,
|
||||||
|
color: "#0bbd87",
|
||||||
|
size: "large",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
content: "结单",
|
||||||
|
timestamp: "--",
|
||||||
|
size: "large",
|
||||||
|
type: "primary",
|
||||||
|
icon: MoreFilled,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
let contentState2 = [
|
||||||
|
{
|
||||||
|
content: "待处理",
|
||||||
|
timestamp: "orderData.value",
|
||||||
|
icon: Check,
|
||||||
|
color: "#0bbd87",
|
||||||
|
size: "large",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
content: "已处理",
|
||||||
|
timestamp: "2022-07-20 20:00:00",
|
||||||
|
icon: Check,
|
||||||
|
color: "#0bbd87",
|
||||||
|
size: "large",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
content: "结单",
|
||||||
|
timestamp: "2022-07-20 20:00:00",
|
||||||
|
size: "large",
|
||||||
|
icon: Check,
|
||||||
|
color: "#0bbd87",
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
@@ -54,6 +105,7 @@ watch(() => props.rowData, (newRowData) => {
|
|||||||
getData(newRowData).then((data) => {
|
getData(newRowData).then((data) => {
|
||||||
opsCallList.value = []
|
opsCallList.value = []
|
||||||
orderData.value = data.data
|
orderData.value = data.data
|
||||||
|
|
||||||
//电话拨打记录
|
//电话拨打记录
|
||||||
const dataDetails = data.data.opsCallList
|
const dataDetails = data.data.opsCallList
|
||||||
// console.log(dataDetails);
|
// console.log(dataDetails);
|
||||||
@@ -80,36 +132,28 @@ watch(() => props.rowData, (newRowData) => {
|
|||||||
if (info.answeredTime !== null) {
|
if (info.answeredTime !== null) {
|
||||||
// console.log(info.answeredTime);
|
// console.log(info.answeredTime);
|
||||||
let startIndex = info.answeredTime.indexOf(' ') + 1;
|
let startIndex = info.answeredTime.indexOf(' ') + 1;
|
||||||
let timeOnly = info.answeredTime.slice(startIndex, startIndex + 5);
|
let timeOnly = info.answeredTime.slice(startIndex, startIndex + 8);
|
||||||
info.answeredTime = timeOnly.replace(':', ' : ')
|
info.answeredTime = timeOnly.replace(/:/g, ':')
|
||||||
|
// info.answeredTime = timeOnly
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
// console.log(item.data);
|
|
||||||
|
|
||||||
// item.data.sort((a, b) => a.answeredTime - b.answeredTime)
|
// item.data.sort((a, b) => a.answeredTime - b.answeredTime)
|
||||||
opsCallList.value.push(item)
|
opsCallList.value.push(item)
|
||||||
})
|
})
|
||||||
console.log(opsCallList.value);
|
|
||||||
|
|
||||||
//工单时间线
|
//工单时间线
|
||||||
orderContent.value = []
|
orderContent.value = []
|
||||||
// console.log(orderData.value);
|
console.log(orderData.value);
|
||||||
content.map((item, index) => {
|
// orderData.value.orderState='2'
|
||||||
if (index === 0) {
|
if (orderData.value.orderState === '0') {
|
||||||
item.timestamp = orderData.value.operationTime || '--'
|
inputOrderContent(contentState0)
|
||||||
} else if (index === 1) {
|
}
|
||||||
item.timestamp = orderData.value.processedTime || '--'
|
else if (orderData.value.orderState === '1') {
|
||||||
|
inputOrderContent(contentState1)
|
||||||
} else {
|
}
|
||||||
item.timestamp = orderData.value.completionTime || '--'
|
else if (orderData.value.orderState === '2') {
|
||||||
|
inputOrderContent(contentState2)
|
||||||
}
|
}
|
||||||
|
|
||||||
})
|
|
||||||
content.forEach(item => {
|
|
||||||
orderContent.value.push(item)
|
|
||||||
})
|
|
||||||
|
|
||||||
// console.log(orderContent.value);
|
// console.log(orderContent.value);
|
||||||
|
|
||||||
})
|
})
|
||||||
@@ -117,37 +161,31 @@ watch(() => props.rowData, (newRowData) => {
|
|||||||
}, {
|
}, {
|
||||||
immediate: true // 立即执行一次,以便在rowData初始值非空时也能触发
|
immediate: true // 立即执行一次,以便在rowData初始值非空时也能触发
|
||||||
});
|
});
|
||||||
// getData()
|
const inputOrderTime = (item, index) => {
|
||||||
|
|
||||||
|
|
||||||
const test2 = [
|
|
||||||
{
|
{
|
||||||
|
if (index === 0) {
|
||||||
date: '2024-8-31',
|
item.timestamp = orderData.value.operationTime || '--'
|
||||||
type: "primary",
|
} else if (index === 1) {
|
||||||
icon: MoreFilled,
|
// item.timestamp = orderData.value.processedTime || '--'
|
||||||
size: "large",
|
} else {
|
||||||
}, {
|
// item.timestamp = orderData.value.completionTime || '--'
|
||||||
content: "结单",
|
}
|
||||||
size: "large",
|
|
||||||
}
|
}
|
||||||
];
|
}
|
||||||
// const data = [
|
|
||||||
// {
|
const inputOrderContent = (contentState) => {
|
||||||
// number: '17628661307',
|
contentState.map((item, index) => {
|
||||||
// state: '通话中',
|
inputOrderTime(item, index)
|
||||||
// time: '18 : 32',
|
})
|
||||||
// },
|
contentState.forEach(item => {
|
||||||
// {
|
orderContent.value.push(item)
|
||||||
// number: '17628661307',
|
})
|
||||||
// state: '已接通',
|
}
|
||||||
// time: '18 : 32',
|
|
||||||
// },
|
const openRecord = () => {
|
||||||
// {
|
voiceRef.value.open(true)
|
||||||
// number: '17628661307',
|
}
|
||||||
// state: '已接通',
|
|
||||||
// time: '18 : 32',
|
|
||||||
// }]
|
|
||||||
defineExpose({
|
defineExpose({
|
||||||
open,
|
open,
|
||||||
});
|
});
|
||||||
@@ -178,11 +216,11 @@ defineExpose({
|
|||||||
<el-main :style="{ position: 'static' }" class="main-content">
|
<el-main :style="{ position: 'static' }" class="main-content">
|
||||||
<div class="top">
|
<div class="top">
|
||||||
<div class="info">
|
<div class="info">
|
||||||
<span>创始人:{{ rowData.createBy }}</span>
|
<!-- <span>创始人:{{ rowData.createBy }}</span> -->
|
||||||
<span>处理人:{{ rowData.operationUser }}</span>
|
<span>处理人:{{ rowData.operationUser }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="info">
|
<div class="info">
|
||||||
<span>工单名称:{{ rowData.siteName }}</span>
|
<span>工单名称:{{ rowData.orderName }}</span>
|
||||||
<span>关单人:{{ rowData.knotter }}</span>
|
<span>关单人:{{ rowData.knotter }}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -196,7 +234,7 @@ defineExpose({
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div>处理内容:</div>
|
<div>通话记录:</div>
|
||||||
<div class="textBox">
|
<div class="textBox">
|
||||||
<el-scrollbar>
|
<el-scrollbar>
|
||||||
<div class="text">{{ rowData.processedContent }}</div>
|
<div class="text">{{ rowData.processedContent }}</div>
|
||||||
@@ -206,10 +244,17 @@ defineExpose({
|
|||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div>录音信息:</div>
|
<div>录音信息:</div>
|
||||||
<div class="textBox">
|
<div class="textBox—record">
|
||||||
<el-scrollbar>
|
|
||||||
<div class="text">{{ rowData.recordUrl }}</div>
|
<el-button @click="openRecord" type="primary" :icon="VideoPlay" style="margin-right: 10px ;">播放录音
|
||||||
</el-scrollbar>
|
</el-button>
|
||||||
|
<voice ref="voiceRef" title="录音详情"/>
|
||||||
|
<a :href="opsCallList.recordUrl" download="record.mp3">
|
||||||
|
<el-button type="primary" :icon="Download">下载录音</el-button>
|
||||||
|
</a>
|
||||||
|
<!-- <el-scrollbar> -->
|
||||||
|
<!-- <div class="text">{{ rowData.recordUrl }}</div> -->
|
||||||
|
<!-- </el-scrollbar> -->
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
@@ -234,7 +279,7 @@ defineExpose({
|
|||||||
color: info.callState === '通话中' ? '#6cc23a' : '#409eff'
|
color: info.callState === '通话中' ? '#6cc23a' : '#409eff'
|
||||||
}">{{ info.callState }}</span> -->
|
}">{{ info.callState }}</span> -->
|
||||||
<span class="span-3th" :style="{ color: '#a8abb2' }">{{
|
<span class="span-3th" :style="{ color: '#a8abb2' }">{{
|
||||||
info.answeredTime || '00 : 00' }}</span>
|
info.answeredTime || '00:00:00' }}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -298,13 +343,19 @@ defineExpose({
|
|||||||
padding: 15px;
|
padding: 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.main-content .body .textBox—record {
|
||||||
|
width: 100%;
|
||||||
|
min-height: 10vh;
|
||||||
|
// max-height: 15vh;
|
||||||
|
// border: 1.5px solid #e4e7ed;
|
||||||
|
// box-shadow: 0 4px 8px 0 rgba(242, 242, 242, 1);
|
||||||
|
// margin-bottom: 20px;
|
||||||
|
padding: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
.main-content .body .text {
|
.main-content .body .text {
|
||||||
|
|
||||||
resize: none;
|
resize: none;
|
||||||
|
|
||||||
|
|
||||||
// overflow-y: auto;
|
// overflow-y: auto;
|
||||||
|
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
line-height: 25px
|
line-height: 25px
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user