首页

src/views/home/components/provincial/Bottom1-2.vue

@@ -18,7 +18,20 @@
         <tbody>
           <tr v-for="(row, index) in tableData" :key="index" class="row-sty" :style="rowStyle(index)">
             <td class="index-num" style="width: 50px" :style="indexStyle(index)">NO0{{ index + 1 }}</td>
-            <td style="width: 180px; font-size: 14px">{{ row.name }}</td>
+            <!-- <td style="width: 180px; font-size: 14px">{{ row.name }}</td> -->
+            <td style="width: 180px">
+              <el-tooltip
+                effect="dark"
+                :content="row.name"
+                placement="top"
+                :disabled="!row.name || row.name.length <= 10"
+              >
+                <div class="name-cell">
+                  <span class="ellipsis">{{ row.name }}</span>
+                </div>
+              </el-tooltip>
+            </td>
+
             <td class="num">{{ row.proportion }}%</td>
             <td>
               <span class="num">{{ row.turnoverRate }}</span> <span style="font-size: 14px">次/年</span></td
@@ -42,7 +55,7 @@ export default {
   name: 'Bottom1-2',
   components: {
     TitleBox,
-    UsageRateMore
+    UsageRateMore,
   },
   data() {
     return {
@@ -121,6 +134,21 @@ export default {
   margin-bottom: 7px;
   border-radius: 5px;
 }
+.name-cell {
+  height: 100%;
+  display: flex;
+  align-items: center; // ✅ 垂直居中
+  justify-content: center; // 如果你想左对齐就删掉
+}
+
+.ellipsis {
+  max-width: 180px;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  font-size: 14px;
+}
+
 table {
   border-collapse: separate;
   border-spacing: 0 7px;