BUG修改 标题过长导致右边样式不统一

front/src/views/personalCenter/components/PurchaseVehicle.vue

@@ -108,20 +108,23 @@
                 >
                   <template #title>
                     <div>
-                      <span
+                      <a-tooltip>
-                        @click="
+                        <template #title>{{ item.resourceName }}</template>
-                          showItem(
+                        <span
-                            item.resourceId,
+                          @click="
-                            item.type,
+                            showItem(
-                            item.delFlag,
+                              item.resourceId,
-                            item.note1
+                              item.type,
-                          )
+                              item.delFlag,
-                        "
+                              item.note1
-                        style="cursor: pointer"
+                            )
-                        class="name"
+                          "
-                      >
+                          style="cursor: pointer"
-                        {{ item.resourceName }}
+                          class="name"
-                      </span>
+                        >
+                          {{ item.resourceName }}
+                        </span>
+                      </a-tooltip>
                       <span class="type">{{ item.type }}</span>
                     </div>
                     <span class="time">
@@ -973,6 +976,14 @@
       color: #0087ff;
     }
   }
+  .name {
+    max-width: 4.15rem;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    -o-text-overflow: ellipsis;
+    word-break: break-all;
+  }
   .name:hover {
     color: #0087ff;
   }
@@ -1048,5 +1059,10 @@
   :deep(.ant-list-item-meta-title) {
     display: flex;
     justify-content: space-between;
+    align-items: center;
+    div {
+      display: flex;
+      align-items: center;
+    }
   }
 </style>