LiuRui/DJKB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(统计指标): 修复数据未加载时显示异常问题

Browse Source 
修改统计指标组件和父组件的数据处理逻辑，确保在数据未加载或返回null时显示默认值0。同时将props类型从Number改为Object，并添加默认空对象防止访问属性错误。
This commit is contained in:
chenpanliang
2025-11-25 15:26:34 +08:00
parent 1647970bed
commit b9f74dc810
2 changed files with 43 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
my-vue-app/src/views/senorManger/components/StatisticalIndicators.vue
View File

@@ -5,35 +5,35 @@
<div class="stat-icon customer-rate">
<i class="el-icon-chat-dot-round"></i>
</div>
<div class="kpi-value">{{ customerCommunicationRate.active_customer_communication_rate||0 }}</div>
<div class="kpi-value">{{ (customerCommunicationRate && customerCommunicationRate.active_customer_communication_rate) || 0 }}</div>
<p>活跃客户沟通率 <i class="el-icon-warning info-icon" @mouseenter="showTooltip($event, 'customerCommunicationRate')" @mouseleave="hideTooltip">ⓘ</i></p>
</div>
<div class="kpi-item stat-item">
<div class="stat-icon response-time">
<i class="el-icon-timer"></i>
</div>
<div class="kpi-value">{{ averageResponseTime.average_answer_time||0 }}<span class="kpi-unit">分钟</span></div>
<div class="kpi-value">{{ (averageResponseTime && averageResponseTime.average_answer_time)||0 }}<span class="kpi-unit">分钟</span></div>
<p>平均应答时间 <i class="el-icon-warning info-icon" @mouseenter="showTooltip($event, 'averageResponseTime')" @mouseleave="hideTooltip">ⓘ</i></p>
</div>
<div class="kpi-item stat-item">
<div class="stat-icon timeout-rate">
<i class="el-icon-warning"></i>
</div>
<div class="kpi-value">{{ timeoutResponseRate.timeout_rate||0 }}</div>
<div class="kpi-value">{{ (timeoutResponseRate && timeoutResponseRate.timeout_rate)||0 }}</div>
<p>超时应答率 <i class="el-icon-warning info-icon" @mouseenter="showTooltip($event, 'timeoutResponseRate')" @mouseleave="hideTooltip">ⓘ</i></p>
</div>
<div class="kpi-item stat-item">
<div class="stat-icon severe-timeout-rate">
<i class="el-icon-warning-outline"></i>
</div>
<div class="kpi-value">{{ timeoutResponseRate.serious_timeout_rate||0 }}</div>
<div class="kpi-value">{{ (timeoutResponseRate && timeoutResponseRate.serious_timeout_rate)||0 }}</div>
<p>严重超时应答率 <i class="el-icon-warning info-icon" @mouseenter="showTooltip($event, 'severeTimeoutRate')" @mouseleave="hideTooltip">ⓘ</i></p>
</div>
<div class="kpi-item stat-item">
<div class="stat-icon form-rate">
<i class="el-icon-document"></i>
</div>
<div class="kpi-value">{{ formCompletionRate.table_filling_rate||0 }}</div>
<div class="kpi-value">{{ (formCompletionRate && formCompletionRate.table_filling_rate)||0 }}</div>
<p>表格填写率 <i class="el-icon-warning info-icon" @mouseenter="showTooltip($event, 'formCompletionRate')" @mouseleave="hideTooltip">ⓘ</i></p>
</div>
</div>
@@ -53,24 +53,24 @@ import Tooltip from '@/components/Tooltip.vue';
defineProps({
customerCommunicationRate: {
type: Number,
default: 0
type: Object,
default: () => ({})
},
averageResponseTime: {
type: Number,
default: 0
type: Object,
default: () => ({})
},
timeoutResponseRate: {
type: Number,
default: 0
type: Object,
default: () => ({})
},
severeTimeoutRate: {
type: Number,
default: 0
type: Object,
default: () => ({})
},
formCompletionRate: {
type: Number,
default: 0
type: Object,
default: () => ({})
}
});