From 8451b074f6247a91e7b9bf560bb32e3339579769 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BA=B7=E5=86=89=E5=86=89?= <kangranran@dingxuantech.cn>
Date: Mon, 1 Sep 2025 18:33:42 +0800
Subject: [PATCH] =?UTF-8?q?=E6=94=B6=E7=9B=8A=E7=AE=A1=E7=90=86=E7=9A=84?=
 =?UTF-8?q?=E5=9B=BE=E5=BD=A2=E5=88=86=E6=9E=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/echartsList/bar.vue            |  2 +-
 src/components/echartsList/line.vue           |  6 +-
 src/components/table/index.vue                | 66 ++++++++--------
 .../earnManage/server/dialogView.vue          | 38 ++++++----
 .../disRevenue/earnManage/server/index.vue    | 75 ++++++++++---------
 .../earnManage/server/relevantData.vue        | 36 ++++++---
 .../disRevenue/earnManage/switch/index.vue    | 26 +++++--
 .../earnManage/switch/switchRelevantData.vue  | 39 ++++++----
 8 files changed, 172 insertions(+), 116 deletions(-)

diff --git a/src/components/echartsList/bar.vue b/src/components/echartsList/bar.vue
index f844882..a1c86a9 100644
--- a/src/components/echartsList/bar.vue
+++ b/src/components/echartsList/bar.vue
@@ -91,7 +91,7 @@
               {
                 type: dataXY && dataXY.yAxis ? 'category' :'value',
                 name: dataXY.name || '单位Mbps',
-                inverse: true,
+                inverse: dataXY && dataXY.yAxis ? true : false,
                 // 去掉y轴线
                 axisLine: { show: false },
                 // 去掉y轴刻度线
diff --git a/src/components/echartsList/line.vue b/src/components/echartsList/line.vue
index d83de7a..55ddc5a 100644
--- a/src/components/echartsList/line.vue
+++ b/src/components/echartsList/line.vue
@@ -88,9 +88,9 @@
               {
                 data: dataXY.data,
                 type: 'line',
-                areaStyle: {
-                  color: 'rgba(140, 158, 217, 1)'
-                }
+                // areaStyle: {  // 阴影
+                //   color: 'rgba(140, 158, 217, 1)'
+                // }
               }
             ]
           };
diff --git a/src/components/table/index.vue b/src/components/table/index.vue
index 6f4e4a3..81aa3cc 100644
--- a/src/components/table/index.vue
+++ b/src/components/table/index.vue
@@ -11,7 +11,7 @@
         </el-row>
         <!-- 表格数据 -->
         <el-table v-loading="loading" :data="tableList" ref="selChangeList" @selection-change="handleSelectionChange">
-            <el-table-column v-if="!config && config.colHiddenCheck" type="selection" width="55" align="center" />
+            <el-table-column v-if="!(config && config.colHiddenCheck)" type="selection" width="55" align="center" />
             <template v-for="(column, key, index) of columns">
                 <el-table-column :label="column.label" :key="key" :prop="key" :width="column.width" min-width="100px" v-if="column && column.visible" align="center" :show-overflow-tooltip="true">
                     <!--  插槽 自定义列表表头数据格式  -->
@@ -27,6 +27,7 @@
                         <!-- 传递行数据、行索引等信息到父组件的插槽 -->
                         <slot
                             :name="column.slotName"
+                            :valueKey="key"
                             :row="scope.row"
                             :rowIndex="scope.$index"
                             :column="column"
@@ -102,39 +103,44 @@
 
         /** 多选框选中数据 */
         handleSelectionChange(selection) {
-          this.selectList = [];
-          this.ids = [];
-          if (this.isProcessing) return;
-          this.isProcessing = true;
-          // 当选中行有关联值时，默认把所关联的的行选中
-          selection.forEach(res => {
-            if (res && res.relevance) {
-              let selArr = [res];
-              Object.keys(res.relevance).forEach(item => {
-                res.relevance[item].forEach(val => {
-                  this.tableList.some(tabVal => {
-                    if (tabVal[item] === val) {
-                      selArr.push(tabVal);
-                      return true;
-                    }
+          if (this.config && this.config['tableKey']) {
+            this.selectList = [];
+            this.ids = [];
+            if (this.isProcessing) return;
+            this.isProcessing = true;
+            // 当选中行有关联值时，默认把所关联的的行选中
+            selection.forEach(res => {
+              if (res && res.relevance) {
+                let selArr = [res];
+                Object.keys(res.relevance).forEach(item => {
+                  res.relevance[item].forEach(val => {
+                    this.tableList.some(tabVal => {
+                      if (tabVal[item] === val) {
+                        selArr.push(tabVal);
+                        return true;
+                      }
+                    });
                   });
                 });
-              });
-              this.selectList = this.selectList.concat(selArr);
-              this.ids = this.ids.concat(selArr.map(item => item.id));
-            } else {
-              if (!this.ids.includes(res.id)) {
-                this.selectList = this.selectList.concat(res);
-                this.ids = this.ids.concat(res.id);
+                this.selectList = this.selectList.concat(selArr);
+                this.ids = this.ids.concat(selArr.map(item => item.id));
+              } else {
+                if (!this.ids.includes(res.id)) {
+                  this.selectList = this.selectList.concat(res);
+                  this.ids = this.ids.concat(res.id);
+                }
               }
-            }
-            this.isProcessing = false;
-          });
-          this.selectList.forEach(val => {
-            this.$refs.selChangeList.toggleRowSelection(val,true);
-          });
+              this.isProcessing = false;
+            });
+            this.selectList.forEach(val => {
+              this.$refs.selChangeList.toggleRowSelection(val,true);
+            });
+          } else {
+            this.selectList = selection;
+            this.ids = selection.map(item => item.id);
+          }
         },
-        // 提供给父组件调用的方法：返回当前表格的选中数据
+        // 提供给父组件调用的方法：返回当前表格的选中数据 资源监控策略和资源监控模块使用
         getSelectedData() {
           return {
             tableKey: this.config.tableKey, // 表格唯一标识
diff --git a/src/views/disRevenue/earnManage/server/dialogView.vue b/src/views/disRevenue/earnManage/server/dialogView.vue
index 0416fd4..2896c67 100644
--- a/src/views/disRevenue/earnManage/server/dialogView.vue
+++ b/src/views/disRevenue/earnManage/server/dialogView.vue
@@ -3,25 +3,26 @@
     <div style="height: 90px;">
       <el-form ref="noticeRef" :model="form" label-width="80px">
         <el-form-item label="节点名称" prop="noticeType">
-          <el-select v-model="form.noticeType" multiple placeholder="请选择节点名称">
+          <el-select v-model="form.noticeType" multiple filterable allow-create default-first-option placeholder="请选择节点名称">
             <el-option
               v-for="item in selectChangeList"
               :key="item.id"
               :label="item.nodeName"
-              :value="item.id"/>
+              :value="item.id">
+            </el-option>
           </el-select>
         </el-form-item>
       </el-form>
-      <el-switch v-for="item of switchData" v-model="item.type" :activeText="item.name" class="mr20" />
+      <el-switch v-for="item of switchData" v-model="item.type" :activeText="item.label" class="mr20" />
     </div>
     <div style="height: calc(100vh - 130px);overflow: scroll;">
       <template v-for="(item,index) of selectChoose">
         <EchartsLine v-show="switchData[0].type" :chartData="chartDataEvent"
-                     :lineData="lineDataParams" :title="'【' + item.nodeName + '】【' + item.businessName + '】' + switchData[0].name" class="w100 h40 mt20 mb20" style="border: 1.5px solid #878787;"></EchartsLine>
+                     :lineData="lineDataParams" :title="'【' + item.nodeName + '】【' + item.businessName + '】' + switchData[0].label" class="w100 h40 mt20 mb20" style="border: 1.5px solid #878787;"></EchartsLine>
         <EchartsLine v-show="switchData[1].type" :chartData="chartDataEvent"
-                     :lineData="lineDataParams" :title="'【' + item.nodeName + '】【' + item.businessName + '】' + switchData[1].name" class="w100 h40 mt20 mb20" style="border: 1.5px solid #878787;"></EchartsLine>
+                     :lineData="lineDataParams" :title="'【' + item.nodeName + '】【' + item.businessName + '】' + switchData[1].label" class="w100 h40 mt20 mb20" style="border: 1.5px solid #878787;"></EchartsLine>
         <EchartsBar v-show="switchData[2].type" :chartData="chartDataEvent"
-                    :barData="lineDataParams" :title="'【' + item.nodeName + '】【' + item.businessName + '】' + switchData[2].name" class="w100 h40 mt20 mb20" style="border: 1.5px solid #878787;"></EchartsBar>
+                    :barData="lineDataParams" :title="'【' + item.nodeName + '】【' + item.businessName + '】' + switchData[2].label" class="w100 h40 mt20 mb20" style="border: 1.5px solid #878787;"></EchartsBar>
       </template>
     </div>
 <!--    <template #footer>-->
@@ -40,21 +41,18 @@
   export default {
     name: 'DialogView',
     components: {Form, EchartsLine, EchartsBar},
+    dicts: ['eps_bandwidth_type'],
     data() {
       return {
         paramsData: {},
         form: {},
         storageKey: '',
         selectChangeList: [],
-        switchData: [
-          {id: 'ninetyFiveDay', type: true, name: '95宽带值Mbps/日'},
-          {id: 'ninetyFiveMonth', type: true, name: '95宽带值Mbps/月'},
-          {id: 'packageEnd', type: true, name: '包端宽带值Mbps/日'}
-        ],
+        switchData: [],
         selectChoose: [],
         lineDataParams: {
           lineXData: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
-          data: [820, 932, 901, 934, 1290, 1330, 1320]
+          data: [120, 132, 101, 134, 90, 230, 210]
         },
       }
     },
@@ -62,9 +60,19 @@
     mounted() {
       this.storageKey = this.$route.query && this.$route.query['storageKey'];
       if (this.storageKey) {
-        this.paramsData = localStorage.getItem(this.storageKey);
-        if (this.paramsData) {
-          this.processData(JSON.parse(this.paramsData));
+        this.paramsData = JSON.parse(localStorage.getItem(this.storageKey));
+        if (this.paramsData && this.paramsData.dictList) {
+          this.switchData = this.paramsData.dictList.map(item => {
+            let obj = {
+              label: item.label,
+              value: item.value,
+              type: true
+            };
+            return obj;
+          });
+        }
+        if (this.paramsData && this.paramsData.list) {
+          this.processData(this.paramsData.list);
         }
       }
     },
diff --git a/src/views/disRevenue/earnManage/server/index.vue b/src/views/disRevenue/earnManage/server/index.vue
index bd0ddeb..e48b904 100644
--- a/src/views/disRevenue/earnManage/server/index.vue
+++ b/src/views/disRevenue/earnManage/server/index.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="app-container pageTopForm">
-        <el-form :model="queryParams" ref="queryRef" v-show="showSearch" label-width="70px" class="demo-ruleForm">
+        <el-form :model="queryParams" ref="queryRef" v-show="showSearch" label-width="80px" class="demo-ruleForm">
           <el-col :span="8">
             <el-form-item label="节点名称" prop="nodeName">
               <el-input
@@ -79,19 +79,25 @@
         </el-form>
 
         <!-- 表格数据 -->
-        <TableList :columns="columns" :config="config" :queryParams="queryParams" :tableList="tableList" @fnClick="callback" @fnRenderList="getList" @value-change="handleValueChange"></TableList>
+        <TableList :columns="columns" :config="config" :queryParams="queryParams" :tableList="tableList" @fnClick="callback" @fnRenderList="getList" @value-change="handleValueChange">
+          <template #tempDay="{ valueKey, row, column }">
+            <span v-if="row && row[valueKey]">{{row[valueKey]}}/{{row.createTime}}</span>
+          </template>
+          <template #tempMonth="{ valueKey, row, column }">
+            <span v-if="row && row[valueKey]">{{row[valueKey]}}/{{row.createTime.slice(0, 7)}}</span>
+          </template>
+        </TableList>
     </div>
 </template>
 
 <script>
-    import EchartsLine from "@/components/echartsList/line.vue";
     import EchartsBar from "@/components/echartsList/bar.vue";
     import TableList from "@/components/table/index.vue";
     import {listBandWidth, avgDetailMsg, recalBandWidth} from "@/api/disRevenue/earnManage"
     export default {
       name: 'Server',
       dicts: ['eps_bandwidth_type'],
-      components: {TableList, EchartsLine, EchartsBar},
+      components: {TableList, EchartsBar},
       data() {
         return {
           tableList: [],
@@ -105,16 +111,16 @@
             uplinkSwitch: {label: `上联交换机`},
             businessId: {label: `业务代码`},
             businessName: {label: `业务名称`},
-            bandwidth95Daily: {label: `95宽带值Mbps/日`, slotHeaderName: '使用服务器的发送流量，发送流量值除以1000000', visible: true},
-            bandwidth95Monthly: {label: `95宽带值Mbps/月`, visible: true,
+            bandwidth95Daily: {label: `95宽带值Mbps/日`, slotName: 'tempDay', slotHeaderName: '使用服务器的发送流量，发送流量值除以1000000', visible: true},
+            bandwidth95Monthly: {label: `95宽带值Mbps/月`, visible: true, slotName: 'tempMonth',
               slotHeaderName: '使用服务器的发送流量，发送流量值除以1000000；若服务器在一个自然月内有收益方式的变更，以最后一次变更的时间为开始到月末，进行该值的统计；若服务器收益方式为包端，则月底不用进行该值的计算。'},
-            packageBandwidthDaily: {label: `包端带宽值Mbps/日`, visible: true},
+            packageBandwidthDaily: {label: `包端带宽值Mbps/日`, slotName: 'tempDay', visible: true},
             // customerName: {label: `设备业务客户`,visible: true},
+            avgMonthlyBandwidth95: {label: `月均日95值Mbps`,slotName: 'tempDay'},
+            effectiveBandwidth95Daily: {label: `有效95带宽值Mbps/日`, slotName: 'tempDay'},
+            effectiveBandwidth95Monthly: {label: `有效95带宽值Mbps/月`,slotName: 'tempMonth'},
+            effectiveAvgMonthlyBandwidth95: {label: `有效月均日95值Mbps`,slotName: 'tempDay'},
             resourceType: {label: `创建时间`},
-            avgMonthlyBandwidth95: {label: `月均日95值Mbps`},
-            effectiveBandwidth95Daily: {label: `有效95带宽值Mbps/日`},
-            effectiveBandwidth95Monthly: {label: `有效95带宽值Mbps/月`},
-            effectiveAvgMonthlyBandwidth95: {label: `有效月均日95值Mbps`}
           },
           config: {
             // searcherForm: [
@@ -137,9 +143,11 @@
             pageNum: 1,
             pageSize: 10,
             total: 0,
-            bandwidth95Daily: [],
-            bandwidth95Monthly: [],
-            packageBandwidthDaily: [],
+            bandwidthType: undefined,
+            hardwareSn: undefined,
+            bandwidth95Daily: undefined,
+            bandwidth95Monthly: undefined,
+            packageBandwidthDaily: undefined,
           }
         }
       },
@@ -153,23 +161,24 @@
         /** 查询角色列表 */
         getList() {
           this.loading = true;
-          this.queryParams['resourceType'] = 1;
-          if (this.queryParams['bandwidth95Daily']) {
-            this.queryParams['startTime'] = this.queryParams['bandwidth95Daily'][0];
-            this.queryParams['endTime'] = this.queryParams['bandwidth95Daily'][1];
-            delete this.queryParams['bandwidth95Daily'];
+          let newParams = {...this.queryParams};
+          newParams['resourceType'] = 1;
+          if (newParams['bandwidth95Daily']) {
+            newParams['startTime'] = newParams['bandwidth95Daily'][0];
+            newParams['endTime'] = newParams['bandwidth95Daily'][1];
+            delete newParams['bandwidth95Daily'];
           }
-          if (this.queryParams['bandwidth95Monthly']) {
-            this.queryParams['startTime'] = this.queryParams['bandwidth95Monthly'][0];
-            this.queryParams['endTime'] = this.queryParams['bandwidth95Monthly'][1];
-            delete this.queryParams['bandwidth95Monthly'];
+          if (newParams['bandwidth95Monthly']) {
+            newParams['startTime'] = newParams['bandwidth95Monthly'][0];
+            newParams['endTime'] = newParams['bandwidth95Monthly'][1];
+            delete newParams['bandwidth95Monthly'];
           }
-          if (this.queryParams['packageBandwidthDaily']) {
-            this.queryParams['startTime'] = this.queryParams['packageBandwidthDaily'][0];
-            this.queryParams['endTime'] = this.queryParams['packageBandwidthDaily'][1];
-            delete this.queryParams['packageBandwidthDaily'];
+          if (newParams['packageBandwidthDaily']) {
+            newParams['startTime'] = newParams['packageBandwidthDaily'][0];
+            newParams['endTime'] = newParams['packageBandwidthDaily'][1];
+            delete newParams['packageBandwidthDaily'];
           }
-          listBandWidth(this.queryParams).then(response => {
+          listBandWidth(newParams).then(response => {
             this.tableList = response.rows;
             this.queryParams.total = response.total;
             this.loading = false;
@@ -190,10 +199,11 @@
 
         /** 图形分析 */
         graphicAnalysis(list) {
+          const dictTypeArr = this.dict.type.eps_bandwidth_type;
           // 生成唯一 key（避免数据冲突）
           const storageKey = `temp_data_${Date.now()}`;
           // 1. 将数据存入 localStorage（需序列化）
-          localStorage.setItem(storageKey, JSON.stringify(list));
+          localStorage.setItem(storageKey, JSON.stringify({list: list, dictList: dictTypeArr}));
           // 1. 用 Vue Router 解析目标路由的完整 URL
           const routeLocation = this.$router.resolve({
             name: 'DialogView',
@@ -222,15 +232,12 @@
                 this.$router.push({
                   path:'/disRevenue/earnManage/server/list/index',
                   query:{
-                    id: rowData.id
+                    id: rowData.id,
+                    bandwidthType: rowData && rowData.bandwidthType
                   }
                 });
                 break;
               case 'echartView':
-                if (selectList && selectList.length <= 0) {
-                  this.$modal.msgWarning("请选择数据！");
-                  return;
-                }
                 this.graphicAnalysis(selectList);
                 break;
               case 'createData':
diff --git a/src/views/disRevenue/earnManage/server/relevantData.vue b/src/views/disRevenue/earnManage/server/relevantData.vue
index 2a92aef..67dff77 100644
--- a/src/views/disRevenue/earnManage/server/relevantData.vue
+++ b/src/views/disRevenue/earnManage/server/relevantData.vue
@@ -3,7 +3,11 @@
         <!-- 表格数据 -->
         <el-table v-loading="loading" :data="roleList">
             <template v-for="(item,index) of columns">
-                <el-table-column :label="item.label" :prop="item.prop" :sortable="item.sortable" :width="item.width" v-if="item.visible" :show-overflow-tooltip="true"></el-table-column>
+                <el-table-column :label="item.label" :prop="item.prop" :sortable="item.sortable" :width="item.width" v-if="item.visible" :show-overflow-tooltip="true">
+                  <template v-if="item.slotName" #default="scope">
+                    <span v-if="scope.row && scope.row[item.prop]">{{scope.row[item.prop]}}/{{scope.row.createTime}}</span>
+                  </template>
+                </el-table-column>
             </template>
         </el-table>
         <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
@@ -24,15 +28,7 @@
           total: 0,
           serverId: '',
           // 列显隐信息
-          columns: [
-            {label: `时间`, prop: 'createTime', visible: true},
-            {label: `业务代码`, prop: 'businessId',visible: true},
-            {label: `95宽带值Mbps/日`, prop: 'bandwidth95Daily', visible: true},
-            {label: `有效95带宽值Mbps/日`, prop: 'effectiveAvgMonthlyBandwidth95', visible: true},
-            {label: `包端带宽值Mbps/日`, prop: 'packageBandwidthDaily', visible: true},
-            {label: `流量端口`, prop: 'trafficPort', visible: true},
-            {label: `发送流量值（bytes）`, prop: 'sendTraffic', visible: true},
-          ],
+          columns: [],
           queryParams: {
             pageNum: 1,
             pageSize: 10
@@ -41,16 +37,32 @@
       },
       created() {
         this.serverId = this.$route.query && this.$route.query.id;
+        this.columsList(this.$route.query && this.$route.query.bandwidthType);
         this.getList();
       },
       methods: {
+        columsList(num) {
+          let type = false;
+          if (num === '4') {
+            type = true;
+          }
+          this. columns = [
+            {label: `时间`, prop: 'createTime', visible: !type},
+            {label: `业务代码`, prop: 'businessId',visible: true},
+            {label: `95宽带值Mbps/日`, prop: 'bandwidth95Daily', slotName: true, visible: type},
+            {label: `有效95带宽值Mbps/日`, prop: 'effectiveAvgMonthlyBandwidth95', slotName: true, visible: type},
+            {label: `包端带宽值Mbps/日`, prop: 'packageBandwidthDaily', slotName: true, visible: type},
+            {label: `流量端口`, prop: 'name', visible: !type},
+            {label: `发送流量值（bytes）`, prop: 'outSpeed', visible: !type},
+          ];
+        },
         /** 查询角色列表 */
         getList() {
           this.loading = true;
           relatedBandWidth(this.serverId).then(response => {
-            this.roleList = response.data;
-            this.total = response && response.total || response && response.data.length;
             this.loading = false;
+            this.roleList = response && response.rows;
+            this.total = response && response.total || response && response.data.length;
           })
         },
         goBack() {
diff --git a/src/views/disRevenue/earnManage/switch/index.vue b/src/views/disRevenue/earnManage/switch/index.vue
index 50315ae..2a95af5 100644
--- a/src/views/disRevenue/earnManage/switch/index.vue
+++ b/src/views/disRevenue/earnManage/switch/index.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="app-container pageTopForm">
-      <el-form :model="queryParams" ref="queryRef" v-show="showSearch" label-width="auto" class="demo-ruleForm">
+      <el-form :model="queryParams" ref="queryRef" v-show="showSearch" label-width="80px" class="demo-ruleForm">
           <el-col :span="6">
             <el-form-item label="交换机名称" prop="uplinkSwitch">
                   <el-select
@@ -159,7 +159,14 @@
           queryParams: {
             pageNum: 1,
             pageSize: 10,
-            total: 0
+            total: 0,
+            uplinkSwitch:undefined,
+            interfaceName:undefined,
+            hardwareSn:undefined,
+            nodeName:undefined,
+            bandwidthType:undefined,
+            bandwidth95Daily:undefined,
+            bandwidth95Monthly:undefined,
           }
         }
       },
@@ -174,10 +181,11 @@
         /** 查询角色列表 */
         getList() {
           this.loading = true;
-          this.queryParams['resourceType'] = 2;
-          this.queryParams['bandwidth95Daily'] = this.queryParams['bandwidth95Daily'] && this.queryParams['bandwidth95Daily'].length >1 ? this.queryParams['bandwidth95Daily'] : null;
-          this.queryParams['bandwidth95Monthly'] = this.queryParams['bandwidth95Monthly'] && this.queryParams['bandwidth95Monthly'].length >1 ? this.queryParams['bandwidth95Monthly'] : null;
-          listBandWidth(this.queryParams).then(response => {
+          let newParams = {...this.queryParams};
+          newParams['resourceType'] = 2;
+          newParams['bandwidth95Daily'] = newParams['bandwidth95Daily'] && newParams['bandwidth95Daily'].length >1 ? newParams['bandwidth95Daily'] : null;
+          newParams['bandwidth95Monthly'] = newParams['bandwidth95Monthly'] && newParams['bandwidth95Monthly'].length >1 ? newParams['bandwidth95Monthly'] : null;
+          listBandWidth(newParams).then(response => {
             this.tableList = response.rows;
             this.queryParams.total = response.total;
             this.loading = false;
@@ -204,10 +212,11 @@
 
         /** 图形分析 */
         graphicAnalysis(list) {
+          const dictTypeArr = this.dict.type.eps_bandwidth_type;
           // 生成唯一 key（避免数据冲突）
           const storageKey = `temp_data_${Date.now()}`;
           // 1. 将数据存入 localStorage（需序列化）
-          localStorage.setItem(storageKey, JSON.stringify(list));
+          localStorage.setItem(storageKey, JSON.stringify({list: list, dictList: dictTypeArr}));
           // 1. 用 Vue Router 解析目标路由的完整 URL
           const routeLocation = this.$router.resolve({
             name: 'DialogView',
@@ -238,7 +247,8 @@
                 this.$router.push({
                   path:'/disRevenue/earnManage/switch/list/index',
                   query:{
-                    id: rowData.id
+                    id: rowData.id,
+                    bandwidthType: rowData && rowData.bandwidthType
                   }
                 });
                 break;
diff --git a/src/views/disRevenue/earnManage/switch/switchRelevantData.vue b/src/views/disRevenue/earnManage/switch/switchRelevantData.vue
index c53f475..3aec079 100644
--- a/src/views/disRevenue/earnManage/switch/switchRelevantData.vue
+++ b/src/views/disRevenue/earnManage/switch/switchRelevantData.vue
@@ -3,7 +3,11 @@
         <!-- 表格数据 -->
         <el-table v-loading="loading" :data="roleList">
             <template v-for="(item,index) of columns">
-                <el-table-column :label="item.label" :prop="item.prop" :sortable="item.sortable" :width="item.width" v-if="item.visible" :show-overflow-tooltip="true"></el-table-column>
+                <el-table-column :label="item.label" :prop="item.prop" :sortable="item.sortable" :width="item.width" v-if="item.visible" :show-overflow-tooltip="true">
+                  <template v-if="item.slotName" #default="scope">
+                    <span v-if="scope.row && scope.row[item.prop]">{{scope.row[item.prop]}}/{{scope.row.createTime}}</span>
+                  </template>
+                </el-table-column>
             </template>
         </el-table>
         <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
@@ -25,16 +29,7 @@
           dateRange: [],
           switchId: '',
           // 列显隐信息
-          columns: [
-            {label: `时间`, prop: 'createTime', visible: true},
-            {label: `业务代码`, prop: 'businessId',visible: true},
-            {label: `95宽带值Mbps/日`, prop: 'bandwidth95Daily', visible: true},
-            {label: `有效95带宽值Mbps/日`, prop: 'effectiveAvgMonthlyBandwidth95', visible: true},
-            {label: `包端带宽值Mbps/日`, prop: 'packageBandwidthDaily', visible: true},
-            {label: `流量端口`, prop: 'trafficPort', visible: true},
-            {label: `发送流量值（bytes/s）`, prop: 'sendTraffic', visible: true},
-            {label: `接收流量值（bytes/s）`, prop: 'receiveTraffic', visible: true},
-          ],
+          columns: [],
           queryParams: {
             pageNum: 1,
             pageSize: 10
@@ -43,16 +38,34 @@
       },
       created() {
         this.switchId = this.$route.query && this.$route.query.id;
+        this.columsList(this.$route.query && this.$route.query.bandwidthType);
         this.getList();
       },
       methods: {
+        columsList(num) {
+          let type = false;
+          if (num === '4') {
+            type = true;
+          }
+          this. columns = [
+            {label: `时间`, prop: 'createTime', visible: !type},
+            {label: `业务代码`, prop: 'businessCode',visible: !type},
+            {label: `业务代码`, prop: 'businessId',visible: type},
+            {label: `95宽带值Mbps/日`, prop: 'bandwidth95Daily', slotName: true, visible: type},
+            {label: `有效95带宽值Mbps/日`, prop: 'effectiveAvgMonthlyBandwidth95', slotName: true, visible: type},
+            {label: `包端带宽值Mbps/日`, prop: 'packageBandwidthDaily', slotName: true, visible: type},
+            {label: `流量端口`, prop: 'name', visible: !type},
+            {label: `发送流量值（bytes/s）`, prop: 'outSpeed', visible: !type},
+            {label: `接收流量值（bytes/s）`, prop: 'inSpeed', visible: !type},
+          ];
+        },
         /** 查询角色列表 */
         getList() {
           this.loading = true;
           relatedBandWidth(this.switchId).then(response => {
-            this.roleList = response.data;
-            this.total = response && response.total || response && response.data.length;
             this.loading = false;
+            this.roleList = response && response.rows;
+            this.total = response && response.total || response && response.data.length;
           })
         },
         goBack() {