From 0b66502f4d7ac61f4d81c29d18713bc643781b2d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BA=B7=E5=86=89=E5=86=89?= <kangranran@dingxuantech.cn>
Date: Wed, 10 Dec 2025 18:31:45 +0800
Subject: [PATCH] =?UTF-8?q?MTR=E6=8E=A2=E6=B5=8B=E7=AD=96=E7=95=A5?=
 =?UTF-8?q?=E8=A1=A8=E5=8D=95=E6=8F=90=E4=BA=A4=E6=B7=BB=E5=8A=A0=E6=8B=A6?=
 =?UTF-8?q?=E6=88=AA=E6=8F=90=E7=A4=BA=E3=80=81=E6=9C=8D=E5=8A=A1=E5=99=A8?=
 =?UTF-8?q?=E7=AE=A1=E7=90=86=E6=9F=A5=E7=9C=8BMTR=E4=B8=A2=E5=8C=85?=
 =?UTF-8?q?=E8=B6=8B=E5=8A=BF=E5=9B=BE=E9=A1=B5=E9=9D=A2=EF=BC=8C=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0=E7=82=B9=E5=87=BB=E7=82=B9=E4=B8=8A=E5=BC=B9=E7=AA=97?=
 =?UTF-8?q?=E4=B8=AD=E7=9A=84=E8=AF=A6=E6=83=85=EF=BC=8C=E5=B1=95=E7=A4=BA?=
 =?UTF-8?q?=E5=88=97=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

1、MTR探测策略表单提交添加未知的ClientID提示，拦截提交
2、服务器管理查看MTR丢包趋势图页面，添加点击点上弹窗中的详情，展示列表
3、表单详情中input框的内容超出自动换行
4、优化列表操作按钮展示功能以及修改bug
---
 src/assets/styles/index.scss                  |  9 ++++--
 src/components/echartsList/line.vue           | 21 +++++++-------
 src/components/form/index.vue                 | 23 +++++++++------
 src/components/table/index.vue                | 21 +++++++++++---
 .../resource/agentUpdate/agentUpdateView.vue  |  2 +-
 .../resource/fileManage/fileManageView.vue    |  4 +--
 src/views/resource/mtrAgent/lossRateChart.vue |  9 ++++--
 src/views/resource/mtrAgent/mtrAgent.vue      |  2 +-
 src/views/resource/mtrProbe/mtrProbeView.vue  | 29 ++++++++++++++++++-
 src/views/resource/serverRegister/index.vue   |  2 +-
 10 files changed, 88 insertions(+), 34 deletions(-)

diff --git a/src/assets/styles/index.scss b/src/assets/styles/index.scss
index 5542d1f..9ba2391 100644
--- a/src/assets/styles/index.scss
+++ b/src/assets/styles/index.scss
@@ -341,11 +341,16 @@ aside {
   left: 53% !important;
   //transform: translate(-50%, -50%) !important;
 }
-// 提示信息--应用于Agent更新提交时
-.el-message {
+// 提示信息--应用于Agent更新、mtr探测策略--提交时
+.el-message--warning {
   max-width: 600px!important;
 }
+.el-message--warning .el-message__icon {
+  position: absolute;
+  top: 14px;
+}
 .el-message--warning .el-message__content {
   width: 95%;
   word-wrap: break-word!important;
+  margin-left: 26px;
 }
diff --git a/src/components/echartsList/line.vue b/src/components/echartsList/line.vue
index f316a64..a5c61c4 100644
--- a/src/components/echartsList/line.vue
+++ b/src/components/echartsList/line.vue
@@ -160,7 +160,7 @@
 
                 // 如果太靠右，向左偏移
                 if (x > size.viewSize[0] - size.contentSize[0]) {
-                  x = x - size.contentSize[0] - 20;
+                  x = x - size.contentSize[0] + 10;
                 }
 
                 // 如果太靠下，向上偏移
@@ -168,7 +168,7 @@
                   y = y - size.contentSize[1] - 20;
                 }
 
-                return [x - 10, y + 10];
+                return [x - 5, y + 18];
               },
               formatter: !dataXY.tooltipFormatter ? null : function(params) {   // 主要应对与MTRAgent丢包趋势图模块的功能
                 // 获取当前悬停的日期
@@ -180,12 +180,9 @@
                   if (dataXY.tooltipFormatter && dataXY.tooltipFormatter.customList) {
                     if (paramItem.data.content) {
                       let content = JSON.parse(paramItem.data.content);
-                      html+= `<div>最新一跳平均延迟: ${content[content.length - 1].avgLatency}(ms)</div>
-                                <div>最新一跳丢包率: ${content[content.length - 1].lossPercent}(%)</div>`;
-                      // 如果不是弹窗这显示按钮，可点击查看弹窗信息
-                      if (dataXY.tooltipFormatter && !dataXY.tooltipFormatter.defaultType) {
-                        html+= `<button style="float: right;background: #409eff; border-color: #409eff;color:#fff;box-shadow:none;" onclick="window.detailsVal('${date}' ,'${paramItem.dataIndex}')">详情</button>`;
-                      }
+                      html+= `<div>最后一跳平均延迟: ${content[content.length - 1].avgLatency}(ms)</div>
+                                <div>最后一跳丢包率: ${content[content.length - 1].lossPercent}(%)</div>`;
+                        html+= `<button style="float: right;background: #409eff; border-color: #409eff;color:#fff;box-shadow:none;" onclick="window.detailsVal('${date}' ,'${paramItem.dataIndex}', '${dataXY.dialogOpen}')">详情</button>`;
                     } else {
                       let valueparams = paramItem.value;
                       if (dataXY.tooltipFormatter && dataXY.tooltipFormatter.valueToop) {
@@ -380,8 +377,12 @@
           }
         },
         // tooltip中的按钮点击事件
-        detailsVal(xTime, content) {
-          this.$emit('dialogChartTabList', {value: xTime, tableVal: this.lineData.dataList[0].data[content]});
+        detailsVal(xTime, content, dialogOpen) {
+          if (dialogOpen && dialogOpen !== 'null') {
+            this.$emit('showChartTabList', {value: xTime, tableVal: this.lineData.dataList[0].data[content]});
+          } else {
+            this.$emit('dialogChartTabList', {value: xTime, tableVal: this.lineData.dataList[0].data[content]});
+          }
         }
       }
     }
diff --git a/src/components/form/index.vue b/src/components/form/index.vue
index 29eed1d..a1391d3 100644
--- a/src/components/form/index.vue
+++ b/src/components/form/index.vue
@@ -18,15 +18,20 @@
                   <span :title="formVal.label">{{formVal.label ? formVal.label + '：' : ''}}</span>
                 </template>
                 <template v-if="formVal.type === 'input'">
-                  <el-input
-                    v-model="ruleForm[key]"
-                    :clearable="formVal.clearable !== false"
-                    :disabled="toBoolean(formVal.disabled || formItem.config.readonly)"
-                    :placeholder="toBoolean(formVal.disabled || formItem.config.readonly) ? null : formVal.placeholder || `请输入${formVal.label}`"
-                    :class="toBoolean(formVal.disabled || formItem.config.readonly) ? 'cursorAuto' : ''"
-                    @[formVal.eventName]="(val) => handleChange(key,val,formVal)"></el-input>
-                  <br/><span v-if="!toBoolean(formVal.disabled || formItem.config.readonly)" class="warningCol">{{formVal.warningTitle}}</span>
-                </template>
+                  <div v-if="toBoolean(formVal.disabled || formItem.config.readonly)">
+                    <div style="color: #606266;font-weight: 700;padding-left: 15px;word-wrap: break-word;line-height: 25px;margin-top: 5px;" v-html="ruleForm[key]"></div>
+                  </div>
+                  <template v-else>
+                    <el-input
+                      v-model="ruleForm[key]"
+                      :clearable="formVal.clearable !== false"
+                      :disabled="toBoolean(formVal.disabled || formItem.config.readonly)"
+                      :placeholder="toBoolean(formVal.disabled || formItem.config.readonly) ? null : formVal.placeholder || `请输入${formVal.label}`"
+                      :class="toBoolean(formVal.disabled || formItem.config.readonly) ? 'cursorAuto' : ''"
+                      @[formVal.eventName]="(val) => handleChange(key,val,formVal)"></el-input>
+                    <br/><span v-if="!toBoolean(formVal.disabled || formItem.config.readonly)" class="warningCol">{{formVal.warningTitle}}</span>
+                    </template>
+                  </template>
 
                 <template v-if="formVal.type === 'textarea'">
                   <div v-if="toBoolean(formVal.disabled || formItem.config.readonly)">
diff --git a/src/components/table/index.vue b/src/components/table/index.vue
index fe2b35f..62e254d 100644
--- a/src/components/table/index.vue
+++ b/src/components/table/index.vue
@@ -73,7 +73,7 @@
             <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">
+                    <template v-if="item && item.more && item.more.length > 0 && checkPermi(item.hasPermi)">
                       <el-dropdown size="mini" trigger="click" @command="(command) => handleClick({fnCode: command}, scope.row)">
                         <el-button size="mini" type="text" icon="el-icon-d-arrow-right"><span style="margin-left: -5px;">{{item && item.title ? item.title : '更多'}}</span></el-button>
                         <el-dropdown-menu slot="dropdown">
@@ -260,10 +260,23 @@
 
         // 判断按钮是否显示
         isButtonVisible(buttonConfig, row) {
-          if (buttonConfig.showName) {
-            return buttonConfig.showVal.includes(row[buttonConfig.showName]);
+          if (buttonConfig && buttonConfig.more) {
+            if (!checkPermi(buttonConfig.hasPermi)) {
+              return false;
+            }
+            if (buttonConfig.showName) {
+              return buttonConfig.showVal.includes(row[buttonConfig.showName]);
+            }
+            return true;
+          } else {
+            if (!checkPermi([buttonConfig.hasPermi])) {
+              return false;
+            }
+            if (buttonConfig.showName) {
+              return buttonConfig.showVal.includes(row[buttonConfig.showName]);
+            }
+            return true;
           }
-          return true;
         },
         // 所有方法都抛出到父组件里去
         handleClick(result, row) {
diff --git a/src/views/resource/agentUpdate/agentUpdateView.vue b/src/views/resource/agentUpdate/agentUpdateView.vue
index ecd99ad..24f2150 100644
--- a/src/views/resource/agentUpdate/agentUpdateView.vue
+++ b/src/views/resource/agentUpdate/agentUpdateView.vue
@@ -142,7 +142,7 @@
                 });
               }
               if (unknownData && unknownData.length > 0) {
-                this.$modal.msgWarning(`存在未知的ClientID: ${unknownData.join(';')}`);
+                this.$modal.msgWarning(`存在未知的ClientID: ${unknownData.join('; ')}`);
                 return;
               }
               let fnType = addAgentManage;
diff --git a/src/views/resource/fileManage/fileManageView.vue b/src/views/resource/fileManage/fileManageView.vue
index 3560024..1303a44 100644
--- a/src/views/resource/fileManage/fileManageView.vue
+++ b/src/views/resource/fileManage/fileManageView.vue
@@ -66,8 +66,8 @@
             groupName: {label: '名称', span: 12, type: 'input'},
             type: {label: '类型', span: 12, type: 'input', disabled: true},
             description: {label: '描述', span: 12, type: 'textarea'},
-            createTime: {label: '创建时间', span: 12, type: 'date', disabled: true},
-            includedDevices: {label: '修改时间', span: 12, type: 'date', disabled: true},
+            createTime: {label: '创建时间', span: 12, type: 'datetime', disabled: true},
+            includedDevices: {label: '修改时间', span: 12, type: 'datetime', disabled: true},
             num: {label: '大小(KB)', span: 12, type: 'input', disabled: true},
             md5: {label: 'MD5值', span: 12, type: 'input', disabled: true},
             router: {label: '路径', span: 12, type: 'input', disabled: true},
diff --git a/src/views/resource/mtrAgent/lossRateChart.vue b/src/views/resource/mtrAgent/lossRateChart.vue
index 5ccd521..f61a2ee 100644
--- a/src/views/resource/mtrAgent/lossRateChart.vue
+++ b/src/views/resource/mtrAgent/lossRateChart.vue
@@ -9,7 +9,7 @@
                 <div class="textAlignCenter">探测失败 <br/>{{val.mtrClientId}}</div>
               </div>
               <div v-else class="w100 h100" style="position: relative;">
-                <div style="position: absolute;">最新丢包率：{{item.dataVal.lastYDataNum || 'null'}}</div>
+                <div style="position: absolute;">最后一跳丢包率：{{item.dataVal.lastYDataNum || item.dataVal.lastYDataNum == 0 ? item.dataVal.lastYDataNum : 'null'}}</div>
                 <EchartsLine class="w100 h100" :key="`chart-${val && val.title || ''}-${item && item.title || ''}-${index}`" :lineData="item && item.dataVal || {}" :dateDataTrans="item && item.dateDataTrans || {}" :dateShowType="item && item.dateShowType || 'datetimerange'" :title="item && item.title || '图表数据'" :chartData="(valData) => chartDataEvent(valData,val.title)" @dialogChartTabList="dialogChartTabList" @showChartTabList="showChartTabList"></EchartsLine>
               </div>
             </div>
@@ -19,7 +19,7 @@
     </el-collapse>
     <template v-if="open && roleList.length > 0">
       <div style="font-size: 1.2rem;" class="pt5 pb5">{{tagTitle}}</div>
-      <TableList :columns="columns" :config="{colTopHiddenIcon: true}" :tableList="roleList">
+      <TableList :columns="columns" :config="{colTopHiddenIcon: true, colHiddenCheck: true}" :tableList="roleList">
         <template #tempUnit="{ valueKey, row, column }">
           {{row[valueKey]}}{{column.unit}}
         </template>
@@ -30,7 +30,7 @@
     </div>
     <!--   弹窗    -->
     <el-dialog :title="tagTitle" :visible.sync="tagOpen" width="900px" append-to-body style="padding-bottom: 20px;">
-      <TableList :columns="columns" :config="{colTopHiddenIcon: true}" :tableList="roleList">
+      <TableList :columns="columns" :config="{colTopHiddenIcon: true, colHiddenCheck: true}" :tableList="roleList">
         <template #tempUnit="{ valueKey, row, column }">
           {{row[valueKey]}}{{column.unit}}
         </template>
@@ -71,6 +71,8 @@
             params[this.dialogRowData.clientId]['jointName'] = '丢包率';
             this.activeShowList.push(this.dialogRowData.clientId);
             this.chartDataLit = params;
+            this.tagTitle = '';
+            this.roleList = [];
             this.timeDefault();
             this.$nextTick(() => {
               this.getEchartList(params, 'dialog');
@@ -181,6 +183,7 @@
                     yDataList = res.data.yData.packetLossRate || [];
                   }
                 }
+                chartList.dataVal.dialogOpen = this.open ? this.open : null;
                 chartList.dataVal.tooltipFormatter['defaultType'] = type ? type : null;
                 chartList.dataVal.lineXData = res.data && res.data.xData || [];
                 chartList.dataVal.dataList[0].data = yDataList || [];
diff --git a/src/views/resource/mtrAgent/mtrAgent.vue b/src/views/resource/mtrAgent/mtrAgent.vue
index 8295e76..248ade6 100644
--- a/src/views/resource/mtrAgent/mtrAgent.vue
+++ b/src/views/resource/mtrAgent/mtrAgent.vue
@@ -138,7 +138,7 @@
             line: [
               {content: '查看丢包率趋势', fnCode: 'echartView', type: 'text', icon: 'el-icon-data-analysis', hasPermi: 'resource:mtrAgent:echartView'},
               {content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:mtrAgent:details'},
-              {title: '更多', more: [
+              {title: '更多', hasPermi: ['resource:mtrAgent:update', 'resource:mtrAgent:addMtrProbe'], more: [
                   {content: '配置更新策略', fnCode: 'update', type: 'text', icon: 'el-icon-circle-check', hasPermi: 'resource:mtrAgent:update'},
                   {content: '新建MTR探测策略', fnCode: 'addMtrProbe', type: 'text', icon: 'el-icon-circle-check', hasPermi: 'resource:mtrAgent:addMtrProbe'},
                 ]
diff --git a/src/views/resource/mtrProbe/mtrProbeView.vue b/src/views/resource/mtrProbe/mtrProbeView.vue
index 05c3170..cd04b35 100644
--- a/src/views/resource/mtrProbe/mtrProbeView.vue
+++ b/src/views/resource/mtrProbe/mtrProbeView.vue
@@ -12,7 +12,7 @@
 
 <script setup name="Handle">
   import Form from '@/components/form/index.vue';
-  import {addMtrPolicy, updateMtrPolicy, getMtrPolicyt, allMtrClientIdData, networkInterList} from "@/api/disRevenue/resource"
+  import {addMtrPolicy, updateMtrPolicy, getMtrPolicyt, allMtrClientIdData, networkInterList, getRegistList} from "@/api/disRevenue/resource"
   export default {
     name: 'mtrProbe_view',
     components: {Form},
@@ -60,6 +60,7 @@
         errorMsgOpen: false,
         errorMsg: '',
         routeType: '',
+        clientIdList: {},
       }
     },
     created() {
@@ -84,6 +85,7 @@
         this.fnFormList();
         this.fnMtrClientList();
       }
+      this.getClientIDList();
       if (this.paramsData && this.paramsData.readonly) {
         this.config = {
           buttonGroup: [{title: '返回', fnCode: 'goBack'}]
@@ -154,6 +156,17 @@
           // this.$modal.msgError("操作失败")
         });
       },
+      // 所有ClientID
+      getClientIDList() {
+        this.clientIdList = {};
+        getRegistList({resourceType: 1}).then(res => {
+          if (res && res.data) {
+            res && res.data.map(item => {
+              this.clientIdList[item.clientId] = item.clientId;
+            });
+          }
+        });
+      },
       fnMtrClientList() {
         allMtrClientIdData({}).then(res => {
           this.formList[0].controls.mtrClientId['options'] = res && res.data.map(item => {
@@ -219,6 +232,20 @@
               }
               break;
             case 'submit':
+              let unknownData = [];
+              if (dataVal && dataVal.serverGroup) {
+                let deployList = JSON.parse(JSON.stringify(dataVal.serverGroup.trim())).split('\n');
+                deployList.forEach(item => {
+                  if (!this.clientIdList[item]) {
+                    unknownData.push(item);
+                  }
+                });
+              }
+              if (unknownData && unknownData.length > 0) {
+                this.$modal.msgWarning(`存在未知的ClientID: ${unknownData.join('; ')}`);
+                return;
+              }
+
               if (this.loading) return;
               this.loading = true;
               let fnType = addMtrPolicy;
diff --git a/src/views/resource/serverRegister/index.vue b/src/views/resource/serverRegister/index.vue
index 7a0ff7d..7abd75d 100644
--- a/src/views/resource/serverRegister/index.vue
+++ b/src/views/resource/serverRegister/index.vue
@@ -285,7 +285,7 @@
                 {content: '选择业务IP', fnCode: 'pubilcNet', type: 'text', icon: 'el-icon-thumb', showName: 'multiPublicIpStatus', showVal: '0', hasPermi: 'resource:serverRegister:pubilcNet'},
                 {content: '图形监控', fnCode: 'echartView', type: 'text', icon: 'el-icon-data-analysis', hasPermi: 'rocketmq:traffic'},
                 {content: '详情', fnCode: 'details', type: 'text', icon: 'el-icon-view', hasPermi: 'resource:serverRegister:details'},
-                {title: '更多', more: [
+                {title: '更多', hasPermi: ['system:businessDeploy', 'rocketmq:policy', 'rocketmq:monitorPolicy', 'rocketmq:remote', 'resource:serverRegister:tagRemarkEdit', 'resource:serverRegister:mtrChartVew'], more: [
                     {content: '下发业务', fnCode: 'issueBusiness', type: 'text', icon: 'el-icon-circle-check', hasPermi: 'system:businessDeploy'},
                     {content: '下发脚本策略', fnCode: 'issueScript', type: 'text', icon: 'el-icon-circle-check', hasPermi: 'rocketmq:policy'},
                     {content: '下发监控策略', fnCode: 'issueMonitor', type: 'text', icon: 'el-icon-circle-check', hasPermi: 'rocketmq:monitorPolicy'},