修改table样式

src/views/components/dataEngine/hotTranslation.vue

@@ -16,7 +16,46 @@
           </template>
         </a-popover>
       </a-space>
-      <a-table :columns="columns" :data="dataList" :filter-icon-align-left="alignLeft" @change="handleChange">
+      <a-table
+        :columns="columns"
+        :data="dataList"
+        :filter-icon-align-left="alignLeft"
+        @change="handleChange"
+        :scroll="true"
+        :pagination="false"
+      >
+        <template #hotTitle>
+          <a-space>
+            <span>热度指数</span>
+            <a-popover position="tl">
+              <a-button type="primary" class="pop-btn2">
+                <template #icon>
+                  <icon-question-circle />
+                </template>
+              </a-button>
+              <template #content>
+                <p style="margin: 0">综合话题出现频次、互动数据（如点赞、收藏、评论）加权计算的热度得分。</p>
+              </template>
+            </a-popover>
+          </a-space>
+        </template>
+        <template #sentimentTitle>
+          <a-space>
+            <span>情感倾向</span>
+            <a-popover position="tr">
+              <a-button type="primary" class="pop-btn2">
+                <template #icon>
+                  <icon-question-circle />
+                </template>
+              </a-button>
+              <template #content>
+                <p style="margin: 0">
+                  统计该行业下全部内容的情绪分布，选取占比最高的情绪类型作为该话题的整体情感倾向。
+                </p>
+              </template>
+            </a-popover>
+          </a-space>
+        </template>
         <template #rank="{ record }">
           <img v-if="record.rank == 1" :src="topImages[0]" style="width: 25px; height: 17px" />
           <img v-else-if="record.rank == 2" :src="topImages[1]" style="width: 25px; height: 17px" />
@@ -127,17 +166,26 @@ const columns = [
     title: '排名',
     dataIndex: 'rank',
     slotName: 'rank',
+    width: 60,
+    minWidth: 60,
   },
   {
     title: '话题名称',
     dataIndex: 'name',
+    width: 300,
+    minWidth: 300,
   },
   {
     title: '关键词',
     dataIndex: 'keywords',
     slotName: 'keywords',
+    width: 250,
+    minWidth: 250,
   },
   {
+    titleSlotName: 'hotTitle',
+    width: 180,
+    minWidth: 180,
     title: '热度指数',
     dataIndex: 'hot',
     sortable: {
@@ -146,13 +194,18 @@ const columns = [
     slotName: 'hot',
   },
   {
+    titleSlotName: 'sentimentTitle',
     title: '情感倾向',
     dataIndex: 'sentiment',
     slotName: 'sentiment',
+    width: 120,
+    minWidth: 120,
   },
   {
     title: '操作',
     slotName: 'optional',
+    width: 120,
+    minWidth: 120,
   },
 ];
 // 切换排序方向
@@ -273,7 +326,14 @@ const handleOk = () => {
   background: #fff !important;
   border-color: #fff !important;
   color: #737478 !important;
-  margin-left: -5px;
+  margin-left: -10px;
+}
+
+.pop-btn2 {
+  background: transparent !important;
+  border-color: transparent !important;
+  color: #737478 !important;
+  margin-left: -10px;
 }
 
 :deep(.arco-icon) {