From 2979e7e216404d90bd03d5b521a4713c81b085da Mon Sep 17 00:00:00 2001
From: lbw_9527443 <780139497@qq.com>
Date: Wed, 22 Oct 2025 18:03:59 +0800
Subject: [PATCH] =?UTF-8?q?refactor(topOne):=20=E4=BC=98=E5=8C=96=E4=BC=98?=
 =?UTF-8?q?=E7=A7=80=E5=BD=95=E9=9F=B3=E5=B1=95=E7=A4=BA=E9=80=BB=E8=BE=91?=
 =?UTF-8?q?=E5=92=8C=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 将excellentRecord和qualityCalls类型从Object改为Array以简化数据处理
- 添加录音分数显示并设置前三名特殊样式
- 调整录音列表的padding和布局
- 移除不必要的overflow-y属性
---
 .../views/topOne/components/QualityCalls.vue  | 64 ++++++++++++++-----
 my-vue-app/src/views/topOne/topone.vue        |  2 +-
 2 files changed, 49 insertions(+), 17 deletions(-)

diff --git a/my-vue-app/src/views/topOne/components/QualityCalls.vue b/my-vue-app/src/views/topOne/components/QualityCalls.vue
index b2817e4..1887c1b 100644
--- a/my-vue-app/src/views/topOne/components/QualityCalls.vue
+++ b/my-vue-app/src/views/topOne/components/QualityCalls.vue
@@ -18,6 +18,7 @@
                   :class="{ active: selectedRecording === index }"
                   @click="selectRecording(index)"
                 >
+                <span class="recording-index">{{ recording.score}}</span>
                   <div class="recording-info">
                     <div class="recording-name" :title="recording.name">{{ recording.name.length > 10 ? recording.name.substring(0, 10) + '...' : recording.name }}</div>
                     <div class="recording-meta">
@@ -172,8 +173,8 @@ import MarkdownIt from 'markdown-it'
 // Props定义
 const props = defineProps({
   qualityCalls: {
-    type: Object,
-    default: () => ({})
+    type: Array,
+    default: () => []
   }
 })
 
@@ -221,24 +222,23 @@ const recordings = computed(() => {
   if (!props.qualityCalls ) {
     return staticRecordings.value;
   }
-  
+  console.log(66666,props.qualityCalls);
   const recordingsList = [];
-  Object.keys(props.qualityCalls).forEach(userName => {
-    props.qualityCalls[userName].forEach((record, index) => {
+    props.qualityCalls.forEach((record, index) => {
       recordingsList.push({
         id: recordingsList.length + 1,
-        name: record.obj_file_name ? record.obj_file_name.split('/').pop() : `${record.sale_name}-录音-${index + 1}`,
+        name: record.record_name ? record.record_name : `${record.sale_name}-录音-${index + 1}`,
         date: new Date().toISOString().split('T')[0],
-        url: record.obj_file_name,
-        transcription: record.context || null,
-        score: record.score,
-        sop: record.sop,
-        sale_name: record.sale_name,
+        url: record.record_file_addr,
+        transcription: record.record_context || null,
+        score: record.record_score,
+        sop: record.record_report,
+        sale_name: record.record_name,
         size: 2048576, // 默认文件大小 2MB
-        uploadTime: new Date().toLocaleDateString('zh-CN')
+        uploadTime: record.created_at,
       });
     });
-  });
+
   
   return recordingsList;
 })
@@ -512,7 +512,7 @@ const downloadRecording = (index) => {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  padding: 20px 20px 0;
+  padding: 10px 20px 0;
   border-bottom: 1px solid #ebeef5;
 }
 
@@ -549,7 +549,7 @@ const downloadRecording = (index) => {
 }
 
 .chart-content {
-  padding: 20px;
+  padding: 10px;
 }
 
 .recording-section {
@@ -562,7 +562,6 @@ const downloadRecording = (index) => {
 .recording-list {
   margin-bottom: 20px;
   max-height: 400px;
-  overflow-y: auto;
 }
 
 .recording-item {
@@ -602,6 +601,39 @@ const downloadRecording = (index) => {
   display: inline-block;
 }
 
+.recording-index {
+  /* 基础分数样式 */
+  padding: 2px 8px;
+  border-radius: 12px;
+  font-size: 12px;
+  font-weight: 600;
+  background-color: #e9ecef;
+  color: #495057;
+  margin-right: 10px;
+}
+
+/* 第一名样式 */
+.recording-item:first-child .recording-index {
+  background: linear-gradient(135deg, #FFD700, #FFA500);
+  color: #fff;
+  box-shadow: 0 2px 4px rgba(255, 215, 0, 0.3);
+}
+
+/* 第二名样式 */
+.recording-item:nth-child(2) .recording-index {
+  background: linear-gradient(135deg, #C0C0C0, #A9A9A9);
+  color: #fff;
+  box-shadow: 0 2px 4px rgba(192, 192, 192, 0.3);
+}
+
+/* 第三名样式 */
+.recording-item:nth-child(3) .recording-index {
+  background: linear-gradient(135deg, #CD7F32, #A0522D);
+  color: #fff;
+  box-shadow: 0 2px 4px rgba(205, 127, 50, 0.3);
+}
+
+
 .recording-meta {
   display: flex;
   gap: 12px;
diff --git a/my-vue-app/src/views/topOne/topone.vue b/my-vue-app/src/views/topOne/topone.vue
index 0540fff..c46958e 100644
--- a/my-vue-app/src/views/topOne/topone.vue
+++ b/my-vue-app/src/views/topOne/topone.vue
@@ -665,7 +665,7 @@ const handleFilterChange = (filterParams) => {
   getDetailData(filterParams)
 }
 // 优秀录音
-const excellentRecord = ref({});
+const excellentRecord = ref([]);
 async function CenterExcellentRecord() {
 const params={
   user_level:userStore.userInfo.user_level.toString(),