fix(CustomerDetail): 移除SOP分析按钮的加载状态限制并更新API地址

refactor(RawDataCards): 重构通话记录卡片布局并添加时间格式化功能

- 在CustomerDetail组件中,简化SOP分析按钮的状态逻辑并更新API地址
- 在RawDataCards组件中,重新设计操作按钮布局,添加时间显示功能并优化样式
This commit is contained in:
2025-09-12 17:19:41 +08:00
parent 87c926ebb1
commit 1d63829ed6
2 changed files with 63 additions and 16 deletions

View File

@@ -15,9 +15,9 @@
<button <button
@click="startSopAnalysis" @click="startSopAnalysis"
class="analysis-button sop-button" class="analysis-button sop-button"
:disabled="isSopAnalysisLoading || !hasCallData" :disabled="!hasCallData"
> >
{{ isSopAnalysisLoading ? 'SOP分析中...' : (hasCallData ? 'SOP通话分析' : '暂无通话数据') }} {{ hasCallData ? 'SOP通话分析' : '暂无通话数据'}}
</button> </button>
<!-- <button <!-- <button
@click="startDemandAnalysis" @click="startDemandAnalysis"
@@ -363,7 +363,7 @@ ${callData.length > 0 && callData[0].record_context ? callData[0].record_context
// console.log('SOP通话分析完成'); // console.log('SOP通话分析完成');
// } // }
// ); // );
const res= await axios.get('http://192.168.3.112:6002/api/v1/call', const res= await axios.get('https://analysis.api.nycjy.cn/api/v1/call',
{ {
params:{ params:{
wechat_id:props.selectedContact.wechat_id wechat_id:props.selectedContact.wechat_id

View File

@@ -93,14 +93,19 @@
<span class="call-duration">客户: {{ call.customer_name }}</span> <span class="call-duration">客户: {{ call.customer_name }}</span>
</div> </div>
<div class="call-actions"> <div class="call-actions">
<button class="action-btn download-btn" @click="downloadRecording(call)"> <div class="action-buttons">
<i class="icon-download"></i> <button class="action-btn download-btn" @click="downloadRecording(call)">
录音下载 <i class="icon-download"></i>
</button> 录音下载
<button class="action-btn view-btn" @click="viewTranscript(call)"> </button>
<i class="icon-view"></i> <button class="action-btn view-btn" @click="viewTranscript(call)">
查看原文 <i class="icon-view"></i>
</button> 查看原文
</button>
</div>
<div class="call-time-info">
<span class="call-duration">{{ formatDateTime(call.record_create_time) }}</span>
</div>
</div> </div>
</div> </div>
</div> </div>
@@ -278,6 +283,26 @@ const viewTranscript = async (call) => {
alert('该通话记录暂无原文内容') alert('该通话记录暂无原文内容')
} }
} }
// 时间格式化方法
const formatDateTime = (dateTimeString) => {
if (!dateTimeString) return '暂无时间'
try {
const date = new Date(dateTimeString)
const year = date.getFullYear()
const month = String(date.getMonth() + 1).padStart(2, '0')
const day = String(date.getDate()).padStart(2, '0')
const hours = String(date.getHours()).padStart(2, '0')
const minutes = String(date.getMinutes()).padStart(2, '0')
const seconds = String(date.getSeconds()).padStart(2, '0')
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
} catch (error) {
console.error('时间格式化错误:', error)
return dateTimeString
}
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@@ -531,17 +556,25 @@ const viewTranscript = async (call) => {
.call-actions { .call-actions {
display: flex; display: flex;
gap: 12px; justify-content: space-between;
align-items: center;
margin-top: 12px; margin-top: 12px;
padding-top: 8px;
border-top: 1px solid #f3f4f6;
.action-buttons {
display: flex;
gap: 8px;
}
.action-btn { .action-btn {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 6px; gap: 6px;
padding: 8px 12px; padding: 6px 10px;
border: none; border: none;
border-radius: 6px; border-radius: 6px;
font-size: 12px; font-size: 11px;
font-weight: 500; font-weight: 500;
cursor: pointer; cursor: pointer;
transition: all 0.2s ease; transition: all 0.2s ease;
@@ -553,6 +586,7 @@ const viewTranscript = async (call) => {
&:hover { &:hover {
background: #bfdbfe; background: #bfdbfe;
transform: translateY(-1px); transform: translateY(-1px);
box-shadow: 0 2px 4px rgba(59, 130, 246, 0.2);
} }
} }
@@ -563,12 +597,13 @@ const viewTranscript = async (call) => {
&:hover { &:hover {
background: #a7f3d0; background: #a7f3d0;
transform: translateY(-1px); transform: translateY(-1px);
box-shadow: 0 2px 4px rgba(5, 150, 105, 0.2);
} }
} }
i { i {
width: 14px; width: 12px;
height: 14px; height: 12px;
&.icon-download::before { &.icon-download::before {
content: '⬇'; content: '⬇';
@@ -579,6 +614,18 @@ const viewTranscript = async (call) => {
} }
} }
} }
.call-time-info {
.call-duration {
font-size: 11px;
color: #6b7280;
font-weight: 500;
background: #f9fafb;
padding: 4px 8px;
border-radius: 4px;
border: 1px solid #e5e7eb;
}
}
} }
} }
} }