From 78b9083ce8abd11d8cff874ac847a0590f693401 Mon Sep 17 00:00:00 2001
From: rd <>
Date: Sat, 28 Jun 2025 16:41:14 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E8=A1=8C=E4=B8=9A=E5=85=B3=E9=94=AE?=
 =?UTF-8?q?=E8=AF=8D=E5=8A=A8=E5=90=91=E6=A0=B7=E5=BC=8F=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/components/dataEngine/keyWord.vue | 40 ++++++++-------------
 1 file changed, 14 insertions(+), 26 deletions(-)

diff --git a/src/views/components/dataEngine/keyWord.vue b/src/views/components/dataEngine/keyWord.vue
index 6c54794..112182e 100644
--- a/src/views/components/dataEngine/keyWord.vue
+++ b/src/views/components/dataEngine/keyWord.vue
@@ -20,9 +20,9 @@
         :columns="columns"
         :data="dataList"
         :filter-icon-align-left="alignLeft"
-        @change="handleChange"
         :scroll="true"
         :pagination="false"
+        @change="handleChange"
       >
         <template #heatLevel>
           <a-space>
@@ -85,23 +85,11 @@
           />
         </template>
         <template #tred="{ record }">
-          <a-statistic
-            style="font-size: 14px"
-            v-if="record.trend > 0"
-            :value="record.trend * 100"
-            :value-style="{ color: '#F64B31' }"
-          >
-            <template #prefix>
-              <icon-arrow-rise />
-            </template>
-            <template #suffix>%</template>
-          </a-statistic>
-          <a-statistic
-            v-else
-            style="font-size: 14px"
-            :value="record.trend * 100"
-            :value-style="{ color: '#25C883' }"
-          ></a-statistic>
+          <div class="flex items-center justify-end" :class="record.trend >= 0 ? 'color-#f64b31' : 'color-#25c883'">
+            <icon-arrow-up v-if="record.trend >= 0" size="16" />
+            <icon-arrow-down v-else size="16" />
+            {{ `${record.trend === 0 ? 0 : Math.abs(record.trend * 100)}%` }}
+          </div>
         </template>
       </a-table>
     </a-space>
@@ -126,7 +114,7 @@
         <a-space>
           <a-space style="width: 320px">
             <div id="container" style="height: 180px; width: 180px"></div>
-            <a-space direction="vertical" style="font-size: 14px" v-if="fellingRate.length > 0">
+            <a-space v-if="fellingRate.length > 0" direction="vertical" style="font-size: 14px">
               <a-space>
                 <span style="width: 8px; height: 8px; background-color: #25c883; border-radius: 50%"></span>
                 <span>正面情绪 </span>
@@ -144,9 +132,9 @@
             :data="rowData"
             :span-method="spanMethod"
             :filter-icon-align-left="alignLeft"
-            @change="handleChange"
             :scroll="true"
             :pagination="false"
+            @change="handleChange"
           >
             <template #felling="{ record }">
               <img
@@ -188,9 +176,9 @@
         :columns="columns3"
         :data="keywordList"
         :filter-icon-align-left="alignLeft"
-        @change="handleChange"
         :scroll="true"
         :pagination="false"
+        @change="handleChange"
       >
         <template #rank="{ record }">
           <img v-if="record.rank == 1" :src="topImages[0]" style="width: 25px; height: 17px" />
@@ -254,10 +242,10 @@
         </template>
         <template #tred="{ record }">
           <a-statistic
+            v-if="record.trend > 0"
             style="font-size: 14px"
             :value="record.trend * 100"
             :value-style="{ color: '#F64B31' }"
-            v-if="record.trend > 0"
           >
             <template #prefix>
               <icon-arrow-rise />
@@ -277,7 +265,7 @@
       </a-table>
     </a-space>
     <!-- modal -->
-    <a-modal :visible="visible" @ok="handleOk" @cancel="handleCancel" unmountOnClose>
+    <a-modal :visible="visible" unmountOnClose @ok="handleOk" @cancel="handleCancel">
       <template #title>
         <span style="text-align: left; width: 100%">新兴关键词</span>
       </template>
@@ -594,12 +582,12 @@ const getNewKeywordList = async () => {
 };
 
 const drawChart = () => {
-  var dom = document.getElementById('container');
-  var myChart = echarts.init(dom, null, {
+  let dom = document.getElementById('container');
+  let myChart = echarts.init(dom, null, {
     renderer: 'canvas',
     useDirtyRect: false,
   });
-  var option;
+  let option;
   option = {
     color: ['#25C883', '#F64B31'],
     series: [