Explorar el Código

修改下状态监控页面的特勤Tab中的表格中路线名称最多8个字,多了省略号,鼠标移入名称显示全部

画安 hace 3 semanas
padre
commit
bf377a3a65
Se han modificado 1 ficheros con 11 adiciones y 0 borrados
  1. 11 0
      src/views/StatusMonitoring.vue

+ 11 - 0
src/views/StatusMonitoring.vue

@@ -49,6 +49,9 @@
                     </TechTabPane>
                     <TechTabPane label="特勤" name="specialDuty" class="menu-scroll-view special-duty-pane">
                         <TechTable ref="dutyTable" :columns="tableColumns" :data="tableData" class="duty-table">
+                            <template #name="{ row }">
+                                <span class="duty-name" :title="row.name">{{ row.name }}</span>
+                            </template>
                             <template #level="{ row }">
                                 <span :title="row.level" :style="{ color: row.level === '二级' ? '#FFDF0C' : '#F00' }">
                                     {{ row.level }}
@@ -633,6 +636,14 @@ export default {
     flex-direction: column;
     overflow: hidden;
 }
+.duty-name {
+    display: inline-block;
+    max-width: 8em;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    vertical-align: middle;
+}
 /* 针对特勤 Tab 单独剥离背景和边框 */
 ::v-deep .special-duty-pane {
     background: transparent !important;