1.优化后台菜单页面

web/src/components/table/fieldRender/buttons.vue

@@ -1,5 +1,5 @@
 <template>
-    <div v-memo="[field]">
+    <div v-memo="[field]" class="ba-table-operate-buttons">
         <template v-for="(btn, idx) in field.buttons" :key="idx">
             <template v-if="btn.display ? btn.display(row, field) : true">
                 <!-- 常规按钮 -->
@@ -147,16 +147,34 @@ const getTranslation = (key?: string) => {
 </script>
 
 <style scoped lang="scss">
+.ba-table-operate-buttons {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    flex-wrap: nowrap;
+    width: 100%;
+    gap: 0;
+    vertical-align: middle;
+}
 .ba-table-render-buttons-item {
+    width: 40px;
+    min-width: 40px;
+    height: 32px;
+    padding: 0 !important;
+    margin: 0 !important;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
     .text {
-        font-size: 14px;
+        font-size: 12px;
+        line-height: 1;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        max-width: 100%;
     }
     .icon + .text {
-        padding-left: 5px;
-    }
-    &.el-button--small {
-        padding: 4px 5px;
-        height: auto;
+        padding-left: 2px;
     }
 }
 .ba-table-render-buttons-move {
@@ -164,9 +182,10 @@ const getTranslation = (key?: string) => {
 }
 .buttons-popconfirm-reference-box {
     display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 40px;
+    min-width: 40px;
     vertical-align: middle;
 }
-.buttons-ml-6 + .buttons-ml-6 {
-    margin-left: 6px;
-}
 </style>