fix(CustomerDetail): 移除SOP分析按钮的加载状态限制并更新API地址
refactor(RawDataCards): 重构通话记录卡片布局并添加时间格式化功能 - 在CustomerDetail组件中,简化SOP分析按钮的状态逻辑并更新API地址 - 在RawDataCards组件中,重新设计操作按钮布局,添加时间显示功能并优化样式
This commit is contained in:
@@ -93,14 +93,19 @@
|
||||
<span class="call-duration">客户: {{ call.customer_name }}</span>
|
||||
</div>
|
||||
<div class="call-actions">
|
||||
<button class="action-btn download-btn" @click="downloadRecording(call)">
|
||||
<i class="icon-download"></i>
|
||||
录音下载
|
||||
</button>
|
||||
<button class="action-btn view-btn" @click="viewTranscript(call)">
|
||||
<i class="icon-view"></i>
|
||||
查看原文
|
||||
</button>
|
||||
<div class="action-buttons">
|
||||
<button class="action-btn download-btn" @click="downloadRecording(call)">
|
||||
<i class="icon-download"></i>
|
||||
录音下载
|
||||
</button>
|
||||
<button class="action-btn view-btn" @click="viewTranscript(call)">
|
||||
<i class="icon-view"></i>
|
||||
查看原文
|
||||
</button>
|
||||
</div>
|
||||
<div class="call-time-info">
|
||||
<span class="call-duration">{{ formatDateTime(call.record_create_time) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -278,6 +283,26 @@ const viewTranscript = async (call) => {
|
||||
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>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@@ -531,17 +556,25 @@ const viewTranscript = async (call) => {
|
||||
|
||||
.call-actions {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-top: 12px;
|
||||
padding-top: 8px;
|
||||
border-top: 1px solid #f3f4f6;
|
||||
|
||||
.action-buttons {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.action-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 8px 12px;
|
||||
padding: 6px 10px;
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
font-size: 12px;
|
||||
font-size: 11px;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
@@ -553,6 +586,7 @@ const viewTranscript = async (call) => {
|
||||
&:hover {
|
||||
background: #bfdbfe;
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 2px 4px rgba(59, 130, 246, 0.2);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -563,12 +597,13 @@ const viewTranscript = async (call) => {
|
||||
&:hover {
|
||||
background: #a7f3d0;
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 2px 4px rgba(5, 150, 105, 0.2);
|
||||
}
|
||||
}
|
||||
|
||||
i {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
|
||||
&.icon-download::before {
|
||||
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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user