告警日志和消息推送开发并联调

1、优化列表操作列宽度
2、联调告警日志模块(100%)
3、前端开发并联调消息推送模块(100%)
4、服务器管理和交换机管理的图形监控下的数据进行默认展开排序

src/components/table/index.vue

@@ -71,7 +71,7 @@
                 </el-table-column>
             </template>
             <!--  表格行内按钮   -->
-            <el-table-column v-if="config && config.tableButton && config.tableButton.line" :width="config.tableButton.line.length * 70 + `px`" label="操作" fixed="right" align="center" class-name="small-padding fixed-width">
+            <el-table-column v-if="config && config.tableButton && config.tableButton.line" :width="calculateOperationColumnWidth(config.tableButton.line, tableList)" label="操作" fixed="right" align="center" class-name="small-padding fixed-width">
                 <template #default="scope">
                   <template v-for="item of config.tableButton.line">
                     <template v-if="item && item.more && item.more.length > 0">
@@ -189,6 +189,64 @@
             this.$refs.selChangeList.setCurrentRow(targetRow); // 使用传入的row参数
           });
         },
+        // 计算操作列宽度
+        calculateOperationColumnWidth(buttonConfigs, rowData) {
+          let maxTotalWidth = 0;
+          // 遍历每一行数据
+          rowData.forEach(row => {
+            let currentLineWidth = 0;
+            let visibleButtonCount = 0;
+
+            // 计算当前行所有可见按钮的总宽度
+            buttonConfigs.forEach(config => {
+              // 判断按钮是否显示
+              if (this.isButtonVisible(config, row)) {
+                // 12是图标的宽度
+                const btnWidth = this.calculateButtonWidth(config) + 14;
+                currentLineWidth += btnWidth;
+                visibleButtonCount++;
+              }
+            });
+
+            // 加上按钮间距（假设每个按钮左右有5px间距）
+            if (visibleButtonCount > 0) {
+              currentLineWidth += (visibleButtonCount - 1) * 10;
+            }
+            // 更新最大宽度
+            if (currentLineWidth > maxTotalWidth) {
+              maxTotalWidth = currentLineWidth;
+            }
+          });
+          // 加上单元格内边距
+          return Math.max(maxTotalWidth + 40); // 最小宽度120px
+        },
+
+        // 计算单个按钮宽度（根据字符数）
+        calculateButtonWidth(buttonConfig) {
+          const text = buttonConfig.content || buttonConfig.title || '';
+          let width = 0;
+
+          // 计算文本宽度（根据中英文字符不同宽度）
+          for (const char of text) {
+            if (char >= '\u4e00' && char <= '\u9fa5') {
+              // 中文字符约15px
+              width += 12;
+            } else {
+              // 英文字符约8px
+              width += 4;
+            }
+          }
+          // 加上按钮内边距和边框（约60px基础宽度）
+          return Math.max(width);
+        },
+
+        // 判断按钮是否显示
+        isButtonVisible(buttonConfig, row) {
+          if (buttonConfig.showName) {
+            return buttonConfig.showVal.includes(row[buttonConfig.showName]);
+          }
+          return true;
+        },
         // 所有方法都抛出到父组件里去
         handleClick(result, row) {
           if (result && result.fnCode) {