From b1166f5187b1e8117973550aa5d0540a0212a374 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, 17 Sep 2025 10:34:22 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9C=8D=E5=8A=A1=E5=99=A8=E6=94=B6=E7=9B=8A?=
 =?UTF-8?q?=E3=80=81=E4=BA=A4=E6=8D=A2=E6=9C=BA=E6=94=B6=E7=9B=8A=E3=80=81?=
 =?UTF-8?q?=E5=9B=BE=E5=BD=A2=E5=88=86=E6=9E=90=E6=B7=BB=E5=8A=A0tab?=
 =?UTF-8?q?=E6=A0=8F=E5=88=87=E6=8D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/echartsList/dateTimeSelect.vue |   6 +
 .../earnManage/server/analysisChart.vue       | 395 +++++++++++++++
 .../earnManage/server/dialogView.vue          | 380 ++------------
 .../disRevenue/earnManage/server/index.vue    | 361 +-------------
 .../earnManage/server/serverTabs.vue          | 382 ++++++++++++++
 .../disRevenue/earnManage/switch/index.vue    | 471 ++----------------
 .../earnManage/switch/switchTabs.vue          | 463 +++++++++++++++++
 7 files changed, 1335 insertions(+), 1123 deletions(-)
 create mode 100644 src/views/disRevenue/earnManage/server/analysisChart.vue
 create mode 100644 src/views/disRevenue/earnManage/server/serverTabs.vue
 create mode 100644 src/views/disRevenue/earnManage/switch/switchTabs.vue

diff --git a/src/components/echartsList/dateTimeSelect.vue b/src/components/echartsList/dateTimeSelect.vue
index 6f42b52..8afd0cd 100644
--- a/src/components/echartsList/dateTimeSelect.vue
+++ b/src/components/echartsList/dateTimeSelect.vue
@@ -69,6 +69,7 @@
       methods: {
         toggle(val, num) {
           this.isActive = val;
+          this.dateRange = [];
           if (val && val === 'MONTH') {
             this.getDaysOfPreviousMonth();
           } else if (val && (val === 'THREEMONTH' || val === 'HALFYEAR' || val === 'YEAR')) {
@@ -80,6 +81,7 @@
         // 时间选择器
         dateChange() {
           this.$emit("dataChange", this.isActive, this.dateRange);
+          this.isActive = '';
           // this.getDaysOfPreviousMonth(this.dateRange[0], this.dateRange[1]);
         },
         // 获取当前日期前7天的所有日期（格式：YYYY-MM-DD）
@@ -178,6 +180,10 @@
   }
   ::v-deep .el-date-editor .el-range-separator {
     vertical-align: super!important;
+  }
+  ::v-deep .el-date-editor .el-range__close-icon {
+    margin-top: -38px;
+    margin-right: -14px;
   }
     .ultabs {
       width: 500px;
diff --git a/src/views/disRevenue/earnManage/server/analysisChart.vue b/src/views/disRevenue/earnManage/server/analysisChart.vue
new file mode 100644
index 0000000..12ea9b7
--- /dev/null
+++ b/src/views/disRevenue/earnManage/server/analysisChart.vue
@@ -0,0 +1,395 @@
+<template>
+  <div style="height: calc(100vh)!important">
+    <div style="height: 90px;">
+      <el-form ref="noticeRef" :model="form" label-width="80px">
+        <el-form-item label="节点名称" prop="noticeType">
+          <!--  allow-create default-first-option： 搜索下拉框中没有的数据并展示查询 -->
+          <el-select v-model="form.noticeType" multiple filterable placeholder="请选择节点名称" @change="handleChange">
+            <el-option
+              v-for="item in selectChangeList"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </el-form-item>
+      </el-form>
+      <el-switch v-for="item of switchData" v-model="item.checkType" :activeText="item.label" class="mr20" />
+    </div>
+    <div style="height: calc(100vh - 160px);overflow: scroll;">
+      <template v-for="(item,index) of echartListData">
+        <template v-if="item && item.dateShowType === 'day'">
+          <EchartsLine v-show="switchData[item.indexVal].checkType" :chartData="(valData) => chartDataEvent(valData, item.fnEvent)" :dateShowType="item.dateShowType"
+                       :lineData="item.resultData" :title="item.titleList + switchData[item.indexVal].label" class="w100 h40 mt20 mb20" style="border: 1.5px solid #878787;"></EchartsLine>
+        </template>
+        <template v-if="item && item.dateShowType === 'month'">
+          <EchartsBar v-show="switchData[item.indexVal].checkType" :chartData="(valData) => chartDataEvent(valData, item.fnEvent)" :dateShowType="item.dateShowType"
+                      :barData="item.resultData" :title="item.titleList + switchData[item.indexVal].label" class="w100 h40 mt20 mb20" style="border: 1.5px solid #878787;"></EchartsBar>
+        </template>
+      </template>
+    </div>
+  </div>
+</template>
+
+<script setup>
+  import Form from '@/components/form/index.vue';
+  import EchartsLine from "@/components/echartsList/line.vue";
+  import EchartsBar from "@/components/echartsList/bar.vue";
+  import {graPackage, graMonthly, graEffectiveMonthly, graEffectiveDaily, graEffectiveAvgMonthly, graDaily, graAvgMonthly} from "@/api/disRevenue/earnManage"
+  import {listAllResourList} from "@/api/disRevenue/resource";
+  export default {
+    name: 'AnalysisChart',
+    components: {Form, EchartsLine, EchartsBar},
+    dicts: ['eps_bandwidth_type'],
+    props: {
+      activeName: {
+        type: String,
+        default: "1000"
+      },
+      noticeType: {
+        type: Array,
+        default: []
+      }
+    },
+    watch: {
+      activeName: {
+        handler(val) {
+          this.initData();
+        },
+        deep: true,
+        immediate: true
+      }
+    },
+    data() {
+      return {
+        paramsData: {},
+        form: {},
+        storageKey: '',
+        selectChangeList: [],
+        switchData: [],
+        disabledList: {},
+        echartListData: [],
+        typeObj: {},
+        paramsVal: {},
+        resourceType: '',
+        lineDataParams: {
+          lineXData: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sa', 'Sun'],
+          data: [120, 132, 101, 134, 90, 230, 210]
+        },
+      }
+    },
+    created() {},
+    mounted() {},
+    methods: {
+      initData(){
+        this.storageKey = this.$route.query && this.$route.query['storageKey'];
+        if (this.storageKey) {
+          this.paramsData = JSON.parse(localStorage.getItem(this.storageKey));
+          this.resourceType = this.paramsData && this.paramsData.resourceType;
+          if (this.paramsData && this.paramsData.dictList) {
+            this.switchData = this.paramsData.dictList.map((item,index) => {
+              this.typeObj[item.value] = {type: item.value, indexVal: index};
+              let obj = {
+                label: item.label,
+                value: item.value,
+                checkType: true
+              };
+              return obj;
+            });
+          }
+          if (this.paramsData && this.paramsData.list) {
+            this.processData(this.paramsData.list);
+          }
+          if (this.paramsData && this.paramsData.resourceType) {
+            this.fnNodeName(this.paramsData.resourceType);
+          }
+        }
+      },
+      fnNodeName(type){
+        listAllResourList({resourceType: type}).then(val => {
+          this.selectChangeList = val && val.map(item => {
+            return Object.assign({label: item.resourceName, value: item.resourceName});
+          });
+        });
+      },
+      // 下拉数据改变时触发
+      handleChange(eventVal) {
+        if (this.resourceType === 1) {
+          this.paramsVal = {
+            nodeNames: eventVal
+          };
+        } else {
+          this.paramsVal = {
+            switchNames: eventVal
+          };
+        }
+        this.echartListData = [];
+        this.paramsVal['calculationMode'] = this.activeName;
+        let dayList = this.getDaysOfPreviousMonth();
+        let monthList = this.getLastMonths();
+        this.graDailyList(dayList);
+        this.graMonthlyList(monthList);
+        this.graPackageList(dayList);
+        this.graAvgMonthlyList(monthList);
+        this.graEffectiveDailyList(dayList);
+        this.graEffectiveMonthlyList(monthList);
+        this.graEffectiveAvgMonthlyList(dayList);
+      },
+      // 初始化
+      processData(list) {
+        let nameArr = [];
+        let nameListArr = [];
+        let showNameList = [];
+        list.forEach(item => {
+          let name = this.resourceType === 1 ? item.nodeName : item.uplinkSwitch;
+          if (!nameArr.includes(name)) {
+            item.label = name;
+            item.value = name;
+            nameArr.push(name);
+            nameListArr.push(item);
+          }
+        });
+        if (this.noticeType && this.noticeType.length > 0) {
+          this.form.noticeType = this.noticeType;
+        } else {
+          if (nameArr && nameArr.length > 0) {
+            if (nameListArr.length >=2) {
+              this.form.noticeType = [nameListArr[0].label, nameListArr[1].label];
+            } else {
+              this.form.noticeType = [nameListArr[0].label];
+            }
+          }
+        }
+        showNameList = this.form.noticeType;
+        this.echartListData = [];
+        if (showNameList && showNameList.length > 0) {
+          if (this.resourceType === 1) {
+            this.paramsVal = {
+              nodeNames: showNameList
+            };
+          } else {
+            this.paramsVal = {
+              switchNames: showNameList
+            };
+          }
+          this.paramsVal['calculationMode'] = this.activeName;
+          let dayList = this.getDaysOfPreviousMonth();
+          let monthList = this.getLastMonths();
+          this.graDailyList(dayList);
+          this.graMonthlyList(monthList);
+          this.graPackageList(dayList);
+          this.graAvgMonthlyList(monthList);
+          this.graEffectiveDailyList(dayList);
+          this.graEffectiveMonthlyList(monthList);
+          this.graEffectiveAvgMonthlyList(dayList);
+        }
+      },
+      // 95带宽值Mbps/日---图表
+      graDailyList(timeArr){
+        graDaily(Object.assign({resourceType: this.resourceType, bandwidthType: 1} ,this.paramsVal, timeArr)).then(res => {
+          if (res && res.data && res.data.length > 0) {
+            res.data.forEach((item, index) => {
+              item.titleList = this.resourceType === 1 ? '【' + item.nodeName + '】【' + item.businessName + '】' : '【' + item.nodeName + '】【' + item.interfaceName + '】【' + item.businessName + '】';
+              let dataList = Object.assign({dateShowType: 'day', fnEvent: 'graDailyList'},item, this.typeObj[1]);
+              this.$set(this.echartListData, index * 7, dataList);
+              this.$set(this.disabledList, index * 7, dataList);
+            });
+            this.disabledList[1] = {disabled: false};
+          } else {
+            this.disabledList[1] = {disabled: true};
+            this.$set(this.echartListData, 0, {});
+          }
+        });
+      },
+      // 95带宽值Mbps/月---图表
+      graMonthlyList(timeArr){
+        graMonthly(Object.assign({resourceType: this.resourceType, bandwidthType: 2}, this.paramsVal, timeArr)).then(res => {
+          if (res && res.data && res.data.length > 0) {
+            res.data.forEach((item, index) => {
+              item.titleList = this.resourceType === 1 ? '【' + item.nodeName + '】【' + item.businessName + '】' : '【' + item.nodeName + '】【' + item.interfaceName + '】【' + item.businessName + '】';
+              let dataList = Object.assign({dateShowType: 'month', fnEvent: 'graMonthlyList'},item, this.typeObj[2]);
+              this.$set(this.echartListData, index * 7 + 1, dataList);
+            });
+            // let dataList = Object.assign({dateShowType: 'month', fnEvent: 'graMonthlyList'},res.data, this.typeObj[2]);
+            // this.$set(this.echartListData, 1, dataList);
+          } else {
+            this.$set(this.echartListData, 1, {});
+          }
+        });
+      },
+      // 包端图表
+      graPackageList(timeArr){
+        graPackage(Object.assign({resourceType: this.resourceType, bandwidthType: 3}, this.paramsVal, timeArr)).then(res => {
+          if (res && res.data && res.data.length > 0) {
+            res.data.forEach((item, index) => {
+              item.targetName = this.resourceType === 1 ? item.nodeName : item.switchName;
+              item.targetInter = item.interfaceName;
+              let dataList = Object.assign({dateShowType: 'day', fnEvent: 'graPackageList'}, item, this.typeObj[3]);
+              this.$set(this.echartListData, index * 7 + 2, dataList);
+            });
+            // let dataList = Object.assign({dateShowType: 'day', fnEvent: 'graPackageList'},res.data, this.typeObj[3]);
+            // this.$set(this.echartListData, 2, dataList);
+          } else {
+            this.$set(this.echartListData, 2, {});
+          }
+        });
+      },
+      // 月均日95值Mbps---图表
+      graAvgMonthlyList(timeArr){
+        graAvgMonthly(Object.assign({resourceType: this.resourceType, bandwidthType: 4}, this.paramsVal, timeArr)).then(res => {
+          if (res && res.data && res.data.length > 0) {
+            res.data.forEach((item, index) => {
+              item.titleList = this.resourceType === 1 ? '【' + item.nodeName + '】【' + item.businessName + '】' : '【' + item.nodeName + '】【' + item.interfaceName + '】【' + item.businessName + '】';
+              let dataList = Object.assign({dateShowType: 'month', fnEvent: 'graAvgMonthlyList'}, item, this.typeObj[4]);
+              this.$set(this.echartListData, index * 7 + 3, dataList);
+            });
+            // let dataList = Object.assign({dateShowType: 'month', fnEvent: 'graAvgMonthlyList'},res.data, this.typeObj[4]);
+            // this.$set(this.echartListData, 3, dataList);
+          } else {
+            this.$set(this.echartListData, 3, {});
+          }
+        });
+      },
+      // 有效-95带宽值Mbps/日---图表
+      graEffectiveDailyList(timeArr){
+        graEffectiveDaily(Object.assign({resourceType: this.resourceType, bandwidthType: 5}, this.paramsVal, timeArr)).then(res => {
+          if (res && res.data && res.data.length > 0) {
+            res.data.forEach((item, index) => {
+              item.titleList = this.resourceType === 1 ? '【' + item.nodeName + '】【' + item.businessName + '】' : '【' + item.nodeName + '】【' + item.interfaceName + '】【' + item.businessName + '】';
+              let dataList = Object.assign({dateShowType: 'day', fnEvent: 'graEffectiveDailyList'}, item, this.typeObj[5]);
+              this.$set(this.echartListData, index * 7 + 4, dataList);
+            });
+            // let dataList = Object.assign({dateShowType: 'day', fnEvent: 'graEffectiveDailyList'},res.data, this.typeObj[5]);
+            // this.$set(this.echartListData, 4, dataList);
+          } else {
+            this.$set(this.echartListData, 4, {});
+          }
+        });
+      },
+      // 有效-95带宽值Mbps/月----图表
+      graEffectiveMonthlyList(timeArr){
+        graEffectiveMonthly(Object.assign({resourceType: this.resourceType, bandwidthType: 6}, this.paramsVal, timeArr)).then(res => {
+          if (res && res.data && res.data.length > 0) {
+            res.data.forEach((item, index) => {
+              item.titleList = this.resourceType === 1 ? '【' + item.nodeName + '】【' + item.businessName + '】' : '【' + item.nodeName + '】【' + item.interfaceName + '】【' + item.businessName + '】';
+              let dataList = Object.assign({dateShowType: 'month', fnEvent: 'graEffectiveMonthlyList'}, item, this.typeObj[6]);
+              this.$set(this.echartListData, index * 7 + 5, dataList);
+            });
+            // let dataList = Object.assign({dateShowType: 'month', fnEvent: 'graEffectiveMonthlyList'},res.data, this.typeObj[6]);
+            // this.$set(this.echartListData, 5, dataList);
+          } else {
+            this.$set(this.echartListData, 5, {});
+          }
+        });
+      },
+      // 有效-月均日95值Mbps----图表
+      graEffectiveAvgMonthlyList(timeArr){
+        graEffectiveAvgMonthly(Object.assign({resourceType: this.resourceType, bandwidthType: 7}, this.paramsVal, timeArr)).then(res => {
+          if (res && res.data && res.data.length > 0) {
+            res.data.forEach((item, index) => {
+              item.titleList = this.resourceType === 1 ? '【' + item.nodeName + '】【' + item.businessName + '】' : '【' + item.nodeName + '】【' + item.interfaceName + '】【' + item.businessName + '】';
+              let dataList = Object.assign({dateShowType: 'month', fnEvent: 'graEffectiveAvgMonthlyList'}, item, this.typeObj[7]);
+              this.$set(this.echartListData, index * 7 + 6, dataList);
+            });
+            // let dataList = Object.assign({dateShowType: 'month', fnEvent: 'graEffectiveAvgMonthlyList'},res.data, this.typeObj[7]);
+            // this.$set(this.echartListData, 6, dataList);
+          } else {
+            this.$set(this.echartListData, 6, {});
+          }
+        });
+      },
+      chartDataEvent(valData, funcName) {
+        // 检查函数是否存在，避免报错
+        if (typeof this[funcName] === 'function') {
+          // 调用实际函数，并传递参数（如选中的值、当前项）
+          this[funcName]({startTime: valData[0], endTime: valData[1]});
+        } else {
+          console.warn(`函数 ${funcName} 未定义`);
+        }
+      },
+      // 获取前一个月的所有日期
+      getDaysOfPreviousMonth(star, end) {
+        const currentDate = new Date();
+        const endYear = currentDate.getFullYear();
+        const endMonth = currentDate.getMonth(); // 0=1月，11=12月
+        const endDay = currentDate.getDate();     // 当前日（如8）
+
+        // 2. 计算起点日期（当前日期的“上月同日”，处理边界：如3月31日→2月28/29日）
+        const startDate = new Date(endYear, endMonth, endDay);
+        // 核心：将当前日期的月份减1（得到上月同日，自动处理天数不足问题）
+        startDate.setMonth(startDate.getMonth() - 1);
+
+        // 3. 提取起点日期的年、月、日（用于循环判断）
+        const startYear = startDate.getFullYear();
+        const startMonth = startDate.getMonth();
+        const startDay = startDate.getDate();
+
+        // 4. 循环生成“起点~终点”的所有日期
+        const dateCollection = [];
+        // 临时日期：从起点日期开始递增
+        const tempDate = new Date(startYear, startMonth, startDay);
+
+        // 循环条件：临时日期 <= 当前日期（终点）
+        while (tempDate <= currentDate) {
+          // 格式化日期为“YYYY-MM-DD”（补零处理：如8月→08，5日→05）
+          const year = tempDate.getFullYear();
+          const month = String(tempDate.getMonth() + 1).padStart(2, '0');
+          const day = String(tempDate.getDate()).padStart(2, '0');
+          const formattedDate = `${year}-${month}-${day}`;
+
+          dateCollection.push(formattedDate);
+
+          // 临时日期加1天（进入下一天）
+          tempDate.setDate(tempDate.getDate() + 1);
+        }
+        return {startTime: dateCollection[0], endTime: dateCollection[dateCollection.length - 1]};
+      },
+      // 获取前一年的月
+      getLastMonths() {
+        const threeMonths = [];
+        const today = new Date(); // 当前日期
+        const currentYear = today.getFullYear();
+        const currentMonth = today.getMonth() + 1; // 月份从0开始（0=1月，11=12月）
+        // 循环获取前3个月（i=0: 前1个月，i=1: 前2个月，i=2: 前3个月）
+        for (let i = 1; i <= 12; i++) {
+          // 计算目标月份（当前月 - i）
+          let targetMonth = currentMonth - i;
+          let targetYear = currentYear;
+          // 处理月份溢出（如1月-1=12月，年份减1）
+          if (targetMonth < 0) {
+            targetMonth += 12;
+            targetYear -= 1;
+          }
+          // 格式化月份为两位数（如5月→'05'）
+          const monthStr = String(targetMonth + 1).padStart(2, '0'); // 加1是因为月份从0开始
+          threeMonths.unshift(`${targetYear}-${monthStr}`);
+        }
+        return {startTime: threeMonths[0], endTime: threeMonths[threeMonths.length - 1]};
+      },
+      // 监听事件
+      callback(result, dataVal, formVal) {
+        if (result && result.fnCode) {
+          switch (result.fnCode) {
+            case 'submit':
+              break;
+            case 'cancle':
+              break;
+            default:
+          }
+        }
+      }
+    }
+  }
+</script>
+<style scoped>
+  ::v-deep .ultabs .el-range-editor .el-range-input {
+    vertical-align: super!important;
+  }
+  ::v-deep .ultabs .el-date-editor .el-range-separator {
+    vertical-align: super!important;
+  }
+  ::-webkit-scrollbar {
+    width: 0px!important;
+    height: 0px!important;
+  }
+</style>
diff --git a/src/views/disRevenue/earnManage/server/dialogView.vue b/src/views/disRevenue/earnManage/server/dialogView.vue
index 290e40b..2668db4 100644
--- a/src/views/disRevenue/earnManage/server/dialogView.vue
+++ b/src/views/disRevenue/earnManage/server/dialogView.vue
@@ -1,369 +1,65 @@
 <template>
   <div class="app-container" style="height: calc(100vh)!important">
-    <div style="height: 90px;">
-      <el-form ref="noticeRef" :model="form" label-width="80px">
-        <el-form-item label="节点名称" prop="noticeType">
-          <!--  allow-create default-first-option： 搜索下拉框中没有的数据并展示查询 -->
-          <el-select v-model="form.noticeType" multiple filterable placeholder="请选择节点名称" @change="handleChange">
-            <el-option
-              v-for="item in selectChangeList"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value">
-            </el-option>
-          </el-select>
-        </el-form-item>
-      </el-form>
-      <el-switch v-for="item of switchData" v-model="item.checkType" :activeText="item.label" class="mr20" />
-    </div>
-    <div style="height: calc(100vh - 100px);overflow: scroll;">
-      <template v-for="(item,index) of echartListData">
-        <template v-if="item && item.dateShowType === 'day'">
-          <EchartsLine v-show="switchData[item.indexVal].checkType" :chartData="(valData) => chartDataEvent(valData, item.fnEvent)" :dateShowType="item.dateShowType"
-                       :lineData="item.resultData" :title="'【' + item.nodeName + '】【' + item.businessName + '】' + switchData[item.indexVal].label" class="w100 h40 mt20 mb20" style="border: 1.5px solid #878787;"></EchartsLine>
-        </template>
-        <template v-if="item && item.dateShowType === 'month'">
-          <EchartsBar v-show="switchData[item.indexVal].checkType" :chartData="(valData) => chartDataEvent(valData, item.fnEvent)" :dateShowType="item.dateShowType"
-                      :barData="item.resultData" :title="'【' + item.nodeName + '】【' + item.businessName + '】' + switchData[item.indexVal].label" class="w100 h40 mt20 mb20" style="border: 1.5px solid #878787;"></EchartsBar>
-        </template>
-      </template>
-    </div>
+    <el-tabs class="h100" v-model="activeName" @tab-click="handleClick">
+      <el-tab-pane label="1000计算方式" name="1000">
+        <AnalysisChart ref="childRef" v-if="activeName === '1000'" :activeName="activeName" :noticeType="noticeType"></AnalysisChart>
+      </el-tab-pane>
+      <el-tab-pane label="1024计算方式" name="1024">
+        <AnalysisChart ref="childRef" v-if="activeName === '1024'" :activeName="activeName" :noticeType="noticeType"></AnalysisChart>
+      </el-tab-pane>
+    </el-tabs>
   </div>
 </template>
 
 <script setup>
-  import Form from '@/components/form/index.vue';
-  import EchartsLine from "@/components/echartsList/line.vue";
-  import EchartsBar from "@/components/echartsList/bar.vue";
-  import {graPackage, graMonthly, graEffectiveMonthly, graEffectiveDaily, graEffectiveAvgMonthly, graDaily, graAvgMonthly} from "@/api/disRevenue/earnManage"
-  import {listAllResourList} from "@/api/disRevenue/resource";
+  import AnalysisChart from './analysisChart'
   export default {
     name: 'DialogView',
-    components: {Form, EchartsLine, EchartsBar},
+    components: {AnalysisChart},
     dicts: ['eps_bandwidth_type'],
     data() {
       return {
-        paramsData: {},
-        form: {},
-        storageKey: '',
-        selectChangeList: [],
-        switchData: [],
-        disabledList: {},
-        selectChoose: [],
-        echartListData: [],
-        typeObj: {},
-        paramsVal: {},
-        resourceType: '',
-        lineDataParams: {
-          lineXData: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
-          data: [120, 132, 101, 134, 90, 230, 210]
-        },
+        activeName: '',
+        noticeType: [],
       }
     },
     created() {},
     mounted() {
       this.storageKey = this.$route.query && this.$route.query['storageKey'];
       if (this.storageKey) {
-        this.paramsData = JSON.parse(localStorage.getItem(this.storageKey));
-        if (this.paramsData && this.paramsData.dictList) {
-          this.switchData = this.paramsData.dictList.map((item,index) => {
-            this.typeObj[item.value] = {type: item.value, indexVal: index};
-            let obj = {
-              label: item.label,
-              value: item.value,
-              checkType: true
-            };
-            return obj;
-          });
-        }
-        if (this.paramsData && this.paramsData.list) {
-          this.processData(this.paramsData.list);
-        }
-        if (this.paramsData && this.paramsData.resourceType) {
-          this.fnNodeName(this.paramsData.resourceType);
-        }
+        let paramsData = JSON.parse(localStorage.getItem(this.storageKey));
+        this.activeName = paramsData.activeName;
+      //   if (this.paramsData && this.paramsData.dictList) {
+      //     this.switchData = this.paramsData.dictList.map((item,index) => {
+      //       this.typeObj[item.value] = {type: item.value, indexVal: index};
+      //       let obj = {
+      //         label: item.label,
+      //         value: item.value,
+      //         checkType: true
+      //       };
+      //       return obj;
+      //     });
+      //   }
+      //   if (this.paramsData && this.paramsData.list) {
+      //     this.processData(this.paramsData.list);
+      //   }
+      //   if (this.paramsData && this.paramsData.resourceType) {
+      //     this.fnNodeName(this.paramsData.resourceType);
+      //   }
       }
     },
-    destroyed() {
-      localStorage.removeItem(this.storageKey);
-    },
+    // destroyed() {
+    //   localStorage.removeItem(this.storageKey);
+    // },
     methods: {
-      fnNodeName(type){
-        listAllResourList({resourceType: type}).then(val => {
-          this.selectChangeList = val && val.map(item => {
-            return Object.assign({label: item.resourceName, value: item.resourceName});
-          });
-        });
-      },
-      // 下拉数据改变时触发
-      handleChange(eventVal) {
-        if (this.resourceType === '1') {
-          this.paramsVal = {
-            nodeNames: eventVal
-          };
-        } else {
-          this.paramsVal = {
-            switchNames: eventVal
-          };
-        }
-        let dayList = this.getDaysOfPreviousMonth();
-        let monthList = this.getLastMonths();
-        this.graDailyList(dayList);
-        this.graMonthlyList(monthList);
-        this.graPackageList(dayList);
-        this.graAvgMonthlyList(monthList);
-        this.graEffectiveDailyList(dayList);
-        this.graEffectiveMonthlyList(monthList);
-        this.graEffectiveAvgMonthlyList(dayList);
-      },
-      // 初始化
-      processData(list) {
-        let nameArr = [];
-        let nameListArr = [];
-        let showNameList = [];
-        list.forEach(item => {
-          this.resourceType = item.resourceType;
-          let name = item.resourceType === '1' ? item.nodeName : item.uplinkSwitch;
-          if (!nameArr.includes(name)) {
-            item.label = name;
-            item.value = name;
-            nameArr.push(name);
-            nameListArr.push(item);
-          }
-        });
-        if (nameArr && nameArr.length > 0) {
-          if (nameListArr.length >=2) {
-            this.form.noticeType = [nameListArr[0].label, nameListArr[1].label];
-          } else {
-            this.form.noticeType = [nameListArr[0].label];
-          }
-          this.form.noticeType.forEach(item => {
-            nameListArr.some(val => {
-              if (item === val.label) {
-                showNameList.push(val.label);
-                this.selectChoose.push(val);
-                return true;
-              }
-            });
-          });
-          if (this.resourceType === '1') {
-            this.paramsVal = {
-              nodeNames: showNameList
-            };
-          } else {
-            this.paramsVal = {
-              switchNames: showNameList
-            };
-          }
-          let dayList = this.getDaysOfPreviousMonth();
-          let monthList = this.getLastMonths();
-          this.graDailyList(dayList);
-          this.graMonthlyList(monthList);
-          this.graPackageList(dayList);
-          this.graAvgMonthlyList(monthList);
-          this.graEffectiveDailyList(dayList);
-          this.graEffectiveMonthlyList(monthList);
-          this.graEffectiveAvgMonthlyList(dayList);
-        }
-      },
-      // 95带宽值Mbps/日---图表
-      graDailyList(timeArr){
-        graDaily(Object.assign({} ,this.paramsVal, timeArr)).then(res => {
-          if (res && res.data && res.data.length > 0) {
-            res.data.forEach((item, index) => {
-              let dataList = Object.assign({dateShowType: 'day', fnEvent: 'graDailyList'},item, this.typeObj[1]);
-              this.$set(this.echartListData, index * 7, dataList);
-              this.$set(this.disabledList, index * 7, dataList);
-            });
-            this.disabledList[1] = {disabled: false};
-          } else {
-            this.disabledList[1] = {disabled: true};
-            this.$set(this.echartListData, 0, {});
-          }
-        });
-      },
-      // 95带宽值Mbps/月---图表
-      graMonthlyList(timeArr){
-        graMonthly(Object.assign({resourceType: 1, bandwidthType: 2}, this.paramsVal, timeArr)).then(res => {
-          if (res && res.data && res.data.length > 0) {
-            res.data.forEach((item, index) => {
-              let dataList = Object.assign({dateShowType: 'month', fnEvent: 'graMonthlyList'},item, this.typeObj[2]);
-              this.$set(this.echartListData, index * 7 + 1, dataList);
-            });
-            // let dataList = Object.assign({dateShowType: 'month', fnEvent: 'graMonthlyList'},res.data, this.typeObj[2]);
-            // this.$set(this.echartListData, 1, dataList);
-          } else {
-            this.$set(this.echartListData, 1, {});
-          }
-        });
-      },
-      // 包端图表
-      graPackageList(timeArr){
-        graPackage(Object.assign({resourceType: 1, bandwidthType: 3}, this.paramsVal, timeArr)).then(res => {
-          if (res && res.data && res.data.length > 0) {
-            res.data.forEach((item, index) => {
-              let dataList = Object.assign({dateShowType: 'day', fnEvent: 'graPackageList'}, item, this.typeObj[3]);
-              this.$set(this.echartListData, index * 7 + 2, dataList);
-            });
-            // let dataList = Object.assign({dateShowType: 'day', fnEvent: 'graPackageList'},res.data, this.typeObj[3]);
-            // this.$set(this.echartListData, 2, dataList);
-          } else {
-            this.$set(this.echartListData, 2, {});
-          }
-        });
-      },
-      // 月均日95值Mbps---图表
-      graAvgMonthlyList(timeArr){
-        graAvgMonthly(Object.assign({}, this.paramsVal, timeArr)).then(res => {
-          if (res && res.data && res.data.length > 0) {
-            res.data.forEach((item, index) => {
-              let dataList = Object.assign({dateShowType: 'month', fnEvent: 'graAvgMonthlyList'}, item, this.typeObj[4]);
-              this.$set(this.echartListData, index * 7 + 3, dataList);
-            });
-            // let dataList = Object.assign({dateShowType: 'month', fnEvent: 'graAvgMonthlyList'},res.data, this.typeObj[4]);
-            // this.$set(this.echartListData, 3, dataList);
-          } else {
-            this.$set(this.echartListData, 3, {});
-          }
-        });
-      },
-      // 有效-95带宽值Mbps/日---图表
-      graEffectiveDailyList(timeArr){
-        graEffectiveDaily(Object.assign({}, this.paramsVal, timeArr)).then(res => {
-          if (res && res.data && res.data.length > 0) {
-            res.data.forEach((item, index) => {
-              let dataList = Object.assign({dateShowType: 'day', fnEvent: 'graEffectiveDailyList'}, item, this.typeObj[5]);
-              this.$set(this.echartListData, index * 7 + 4, dataList);
-            });
-            // let dataList = Object.assign({dateShowType: 'day', fnEvent: 'graEffectiveDailyList'},res.data, this.typeObj[5]);
-            // this.$set(this.echartListData, 4, dataList);
-          } else {
-            this.$set(this.echartListData, 4, {});
-          }
-        });
-      },
-      // 有效-95带宽值Mbps/月----图表
-      graEffectiveMonthlyList(timeArr){
-        graEffectiveMonthly(Object.assign({}, this.paramsVal, timeArr)).then(res => {
-          if (res && res.data && res.data.length > 0) {
-            res.data.forEach((item, index) => {
-              let dataList = Object.assign({dateShowType: 'month', fnEvent: 'graEffectiveMonthlyList'}, item, this.typeObj[6]);
-              this.$set(this.echartListData, index * 7 + 5, dataList);
-            });
-            // let dataList = Object.assign({dateShowType: 'month', fnEvent: 'graEffectiveMonthlyList'},res.data, this.typeObj[6]);
-            // this.$set(this.echartListData, 5, dataList);
-          } else {
-            this.$set(this.echartListData, 5, {});
-          }
-        });
-      },
-      // 有效-月均日95值Mbps----图表
-      graEffectiveAvgMonthlyList(timeArr){
-        graEffectiveAvgMonthly(Object.assign({}, this.paramsVal, timeArr)).then(res => {
-          if (res && res.data && res.data.length > 0) {
-            res.data.forEach((item, index) => {
-              let dataList = Object.assign({dateShowType: 'month', fnEvent: 'graEffectiveAvgMonthlyList'}, item, this.typeObj[7]);
-              this.$set(this.echartListData, index * 7 + 6, dataList);
-            });
-            // let dataList = Object.assign({dateShowType: 'month', fnEvent: 'graEffectiveAvgMonthlyList'},res.data, this.typeObj[7]);
-            // this.$set(this.echartListData, 6, dataList);
-          } else {
-            this.$set(this.echartListData, 6, {});
-          }
-        });
-      },
-      chartDataEvent(valData, funcName) {
-        // 检查函数是否存在，避免报错
-        if (typeof this[funcName] === 'function') {
-          // 调用实际函数，并传递参数（如选中的值、当前项）
-          this[funcName]({startTime: valData[0], endTime: valData[1]});
-        } else {
-          console.warn(`函数 ${funcName} 未定义`);
-        }
-      },
-      // 获取前一个月的所有日期
-      getDaysOfPreviousMonth(star, end) {
-        const currentDate = new Date();
-        const endYear = currentDate.getFullYear();
-        const endMonth = currentDate.getMonth(); // 0=1月，11=12月
-        const endDay = currentDate.getDate();     // 当前日（如8）
-
-        // 2. 计算起点日期（当前日期的“上月同日”，处理边界：如3月31日→2月28/29日）
-        const startDate = new Date(endYear, endMonth, endDay);
-        // 核心：将当前日期的月份减1（得到上月同日，自动处理天数不足问题）
-        startDate.setMonth(startDate.getMonth() - 1);
-
-        // 3. 提取起点日期的年、月、日（用于循环判断）
-        const startYear = startDate.getFullYear();
-        const startMonth = startDate.getMonth();
-        const startDay = startDate.getDate();
-
-        // 4. 循环生成“起点~终点”的所有日期
-        const dateCollection = [];
-        // 临时日期：从起点日期开始递增
-        const tempDate = new Date(startYear, startMonth, startDay);
-
-        // 循环条件：临时日期 <= 当前日期（终点）
-        while (tempDate <= currentDate) {
-          // 格式化日期为“YYYY-MM-DD”（补零处理：如8月→08，5日→05）
-          const year = tempDate.getFullYear();
-          const month = String(tempDate.getMonth() + 1).padStart(2, '0');
-          const day = String(tempDate.getDate()).padStart(2, '0');
-          const formattedDate = `${year}-${month}-${day}`;
-
-          dateCollection.push(formattedDate);
-
-          // 临时日期加1天（进入下一天）
-          tempDate.setDate(tempDate.getDate() + 1);
-        }
-        return {startTime: dateCollection[0], endTime: dateCollection[dateCollection.length - 1]};
-      },
-      // 获取前一年的月
-      getLastMonths() {
-        const threeMonths = [];
-        const today = new Date(); // 当前日期
-        const currentYear = today.getFullYear();
-        const currentMonth = today.getMonth() + 1; // 月份从0开始（0=1月，11=12月）
-        // 循环获取前3个月（i=0: 前1个月，i=1: 前2个月，i=2: 前3个月）
-        for (let i = 1; i <= 12; i++) {
-          // 计算目标月份（当前月 - i）
-          let targetMonth = currentMonth - i;
-          let targetYear = currentYear;
-          // 处理月份溢出（如1月-1=12月，年份减1）
-          if (targetMonth < 0) {
-            targetMonth += 12;
-            targetYear -= 1;
-          }
-          // 格式化月份为两位数（如5月→'05'）
-          const monthStr = String(targetMonth + 1).padStart(2, '0'); // 加1是因为月份从0开始
-          threeMonths.unshift(`${targetYear}-${monthStr}`);
-        }
-        return {startTime: threeMonths[0], endTime: threeMonths[threeMonths.length - 1]};
-      },
-      // 监听事件
-      callback(result, dataVal, formVal) {
-        if (result && result.fnCode) {
-          switch (result.fnCode) {
-            case 'submit':
-              break;
-            case 'cancle':
-              break;
-            default:
-          }
-        }
+      handleClick() {
+        this.noticeType = this.$refs.childRef.form.noticeType;
       }
     }
   }
 </script>
 <style scoped>
-  ::v-deep .ultabs .el-range-editor .el-range-input {
-    vertical-align: super!important;
-  }
-  ::v-deep .ultabs .el-date-editor .el-range-separator {
-    vertical-align: super!important;
-  }
-  ::-webkit-scrollbar {
-    width: 0px!important;
-    height: 0px!important;
+  ::v-deep .el-tabs__content {
+    height: calc(100vh - 70px)!important;
   }
 </style>
diff --git a/src/views/disRevenue/earnManage/server/index.vue b/src/views/disRevenue/earnManage/server/index.vue
index c21e9ec..b0d0f18 100644
--- a/src/views/disRevenue/earnManage/server/index.vue
+++ b/src/views/disRevenue/earnManage/server/index.vue
@@ -1,367 +1,42 @@
 <template>
-    <div class="app-container pageTopForm">
-        <el-form :model="queryParams" ref="queryRef" v-show="showSearch" size="small" label-width="80px" class="demo-ruleForm">
-          <el-col :span="8">
-            <el-form-item label="节点名称" prop="nodeName">
-              <el-input
-                  v-model="queryParams.nodeName"
-                  placeholder="节点名称"
-                  clearable
-                  @keyup.enter="handleQuery">
-              </el-input>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="类型" prop="bandwidthType">
-              <el-select
-                v-model="queryParams.bandwidthType"
-                placeholder="请选择类型"
-                clearable>
-                <el-option
-                  v-for="dict in dict.type.eps_bandwidth_type"
-                  :key="dict.value"
-                  :label="dict.label"
-                  :value="dict.value"/>
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8" v-if="queryParams.bandwidthType === '1'">
-            <el-form-item label="95带宽值Mbps/日" title="95带宽值Mbps/日" prop="bandwidth95Daily" :rules="[{ required: true, message: `95带宽值Mbps/日为必填项`, trigger: 'change' }]">
-                <el-date-picker
-                    v-model="queryParams.bandwidth95Daily"
-                    type="daterange"
-                    format="yyyy-MM-dd"
-                    value-format="yyyy-MM-dd"
-                    range-separator="至"
-                    start-placeholder="开始日期"
-                    end-placeholder="结束日期"/>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8" v-if="queryParams.bandwidthType === '2'">
-            <el-form-item label="95带宽值Mbps/月" title="95带宽值Mbps/月" prop="bandwidth95Monthly" :rules="[{ required: true, message: `95带宽值Mbps/月为必填项`, trigger: 'change' }]">
-                <el-date-picker
-                  v-model="queryParams.bandwidth95Monthly"
-                  type="monthrange"
-                  value-format="yyyy-MM"
-                  range-separator="至"
-                  start-placeholder="开始月份"
-                  end-placeholder="结束月份"/>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8" v-if="queryParams.bandwidthType === '3'">
-            <el-form-item label="包端带宽值Mbps/日" title="包端带宽值Mbps/日" prop="packageBandwidthDaily" :rules="[{ required: true, message: `包端带宽值Mbps/日为必填项`, trigger: 'change' }]">
-              <el-date-picker
-                v-model="queryParams.packageBandwidthDaily"
-                type="daterange"
-                format="yyyy-MM-dd"
-                value-format="yyyy-MM-dd"
-                range-separator="至"
-                start-placeholder="开始日期"
-                end-placeholder="结束日期"/>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8" v-if="queryParams.bandwidthType === '4'">
-            <el-form-item label="月均日95值Mbps" title="月均日95值Mbps" prop="avgMonthlyBandwidth95" :rules="[{ required: true, message: `月均日95值Mbps为必填项`, trigger: 'change' }]">
-              <el-date-picker
-                v-model="queryParams.avgMonthlyBandwidth95"
-                type="monthrange"
-                format="yyyy-MM"
-                value-format="yyyy-MM"
-                range-separator="至"
-                start-placeholder="开始日期"
-                end-placeholder="结束日期"/>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8" v-if="queryParams.bandwidthType === '5'">
-            <el-form-item label="有效95带宽值Mbps/日" title="有效95带宽值Mbps/日" prop="effectiveBandwidth95Daily" :rules="[{ required: true, message: `有效95带宽值Mbps/日为必填项`, trigger: 'change' }]">
-              <el-date-picker
-                v-model="queryParams.effectiveBandwidth95Daily"
-                type="daterange"
-                format="yyyy-MM-dd"
-                value-format="yyyy-MM-dd"
-                range-separator="至"
-                start-placeholder="开始日期"
-                end-placeholder="结束日期"/>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8" v-if="queryParams.bandwidthType === '6'">
-            <el-form-item label="有效95带宽值Mbps/月" title="有效95带宽值Mbps/月" prop="effectiveBandwidth95Monthly" :rules="[{ required: true, message: `有效95带宽值Mbps/月为必填项`, trigger: 'change' }]">
-              <el-date-picker
-                v-model="queryParams.effectiveBandwidth95Monthly"
-                type="monthrange"
-                format="yyyy-MM"
-                value-format="yyyy-MM"
-                range-separator="至"
-                start-placeholder="开始日期"
-                end-placeholder="结束日期"/>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8" v-if="queryParams.bandwidthType === '7'">
-            <el-form-item label="有效月均日95值Mbps" title="有效月均日95值Mbps" prop="effectiveAvgMonthlyBandwidth95" :rules="[{ required: true, message: `有效月均日95值Mbps为必填项`, trigger: 'change' }]">
-              <el-date-picker
-                v-model="queryParams.effectiveAvgMonthlyBandwidth95"
-                type="daterange"
-                format="yyyy-MM-dd"
-                value-format="yyyy-MM-dd"
-                range-separator="至"
-                start-placeholder="开始日期"
-                end-placeholder="结束日期"/>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="硬件SN" prop="hardwareSn">
-              <el-input
-                v-model="queryParams.hardwareSn"
-                placeholder="请输入硬件SN"
-                clearable
-                @keyup.enter="handleQuery"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item class="lastBtnSty">
-              <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-              <el-button icon="Refresh" @click="resetQuery">重置</el-button>
-            </el-form-item>
-          </el-col>
-        </el-form>
-
-        <!-- 表格数据 -->
-        <TableList class="w100 h100" :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>
+  <div class="app-container" style="height: calc(100vh - 85px);">
+    <el-tabs class="h100" v-model="activeName">
+      <el-tab-pane label="1000计算方式" name="1000">
+        <ServerTabs v-if="activeName === '1000'" :activeName="activeName"></ServerTabs>
+      </el-tab-pane>
+      <el-tab-pane label="1024计算方式" name="1024">
+        <ServerTabs v-if="activeName === '1024'" :activeName="activeName"></ServerTabs>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
 </template>
 
 <script>
-    import EchartsBar from "@/components/echartsList/bar.vue";
-    import TableList from "@/components/table/index.vue";
-    import {listBandWidth, avgDetailMsg, recalBandWidth} from "@/api/disRevenue/earnManage"
+  import ServerTabs from './serverTabs'
     export default {
       name: 'Server',
-      dicts: ['eps_bandwidth_type'],
-      components: {TableList, EchartsBar},
+      components: {ServerTabs},
       data() {
         return {
-          tableList: [],
-          loading: true,
-          showSearch: true,
-          // 列显隐信息
-          columns: {
-            id: {label: `ID`},
-            nodeName: {label: `节点名称`, minWidth: '250', visible: true},
-            hardwareSn: {label: `硬件SN`, minWidth: '200'},
-            uplinkSwitch: {label: `上联交换机`, minWidth: '150'},
-            businessId: {label: `业务代码`, minWidth: '150'},
-            businessName: {label: `业务名称`, minWidth: '150'},
-            bandwidth95Daily: {label: `95带宽值Mbps/日`, minWidth: '200', slotName: 'tempDay', slotHeaderName: '使用服务器的发送流量，发送流量值除以1000000',visible: true},
-            effectiveBandwidth95Daily: {label: `有效95带宽值Mbps/日`, minWidth: '200', slotName: 'tempDay', visible: true},
-            packageBandwidthDaily: {label: `包端带宽值Mbps/日`, minWidth: '200', slotName: 'tempDay',visible: true},
-            bandwidth95Monthly: {label: `95带宽值Mbps/月`, minWidth: '200', slotName: 'tempMonth',
-              slotHeaderName: '使用服务器的发送流量，发送流量值除以1000000；若服务器在一个自然月内有收益方式的变更，以最后一次变更的时间为开始到月末，进行该值的统计；若服务器收益方式为包端，则月底不用进行该值的计算。'},
-            // customerName: {label: `设备业务客户`,visible: true},
-            avgMonthlyBandwidth95: {label: `月均日95值Mbps`, minWidth: '200',slotName: 'tempDay'},
-            effectiveBandwidth95Monthly: {label: `有效95带宽值Mbps/月`, minWidth: '200', slotName: 'tempMonth', visible: true},
-            effectiveAvgMonthlyBandwidth95: {label: `有效月均日95值Mbps`, minWidth: '200', slotName: 'tempDay', visible: true},
-            createDatetime: {label: `创建时间`, minWidth: '150'},
-          },
-          config: {
-            // searcherForm: [
-            //   {label: '交换机名称', prop: 'roleName', type: 'selset', options: []}
-            // ],
-            tableButton: {
-              top: [
-                {content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'disRevenue:earnManage:server:export'},
-                {content: '图形分析', fnCode: 'echartView', type: 'success', icon: 'el-icon-data-analysis', hasPermi: 'disRevenue:earnManage:server:graphicAnalysis'},
-                {content: '生成月均日95值', fnCode: 'createData', type: 'success', icon: 'el-icon-data-analysis', hasPermi: 'disRevenue:earnManage:server:add'},
-              ],
-              line: [
-                {content: '相关数据', fnCode: 'edit', type: 'text', icon: 'el-icon-tickets', hasPermi: 'disRevenue:earnManage:server:relevantData'},
-                {content: '重新计算', fnCode: 'calculate', type: 'text', icon: 'el-icon-brush', hasPermi: 'disRevenue:earnManage:server:calculate'},
-                {}
-              ]
-            }
-          },
-          queryParams: {
-            pageNum: 1,
-            pageSize: 10,
-            total: 0,
-            bandwidthType: undefined,
-            hardwareSn: undefined,
-            bandwidth95Daily: undefined,
-            bandwidth95Monthly: undefined,
-            packageBandwidthDaily: undefined,
-            avgMonthlyBandwidth95: undefined,
-            effectiveBandwidth95Daily: undefined,
-            effectiveBandwidth95Monthly: undefined,
-            effectiveAvgMonthlyBandwidth95: undefined,
-          },
+          activeName: '1000'
         }
       },
       created() {
         this.$nextTick(() => {
-          this.getList(1);
         });
       },
       activated() {
         this.$nextTick(() => {
-          this.getList();
         });
       },
-      methods: {
-        /** 查询角色列表 */
-        getList(num) {
-          this.loading = true;
-          let newParams = {...this.queryParams};
-          delete newParams['total'];
-          newParams['resourceType'] = 1;
-          if (newParams['bandwidth95Daily']) {
-            newParams['startTime'] = newParams['bandwidth95Daily'][0];
-            newParams['endTime'] = newParams['bandwidth95Daily'][1];
-            delete newParams['bandwidth95Daily'];
-          }
-          if (newParams['bandwidth95Monthly']) {
-            newParams['startTime'] = newParams['bandwidth95Monthly'][0];
-            newParams['endTime'] = newParams['bandwidth95Monthly'][1];
-            delete newParams['bandwidth95Monthly'];
-          }
-          if (newParams['packageBandwidthDaily']) {
-            newParams['startTime'] = newParams['packageBandwidthDaily'][0];
-            newParams['endTime'] = newParams['packageBandwidthDaily'][1];
-            delete newParams['packageBandwidthDaily'];
-          }
-          if (newParams['avgMonthlyBandwidth95']) {
-            newParams['startTime'] = newParams['avgMonthlyBandwidth95'][0];
-            newParams['endTime'] = newParams['avgMonthlyBandwidth95'][1];
-            delete newParams['avgMonthlyBandwidth95'];
-          }
-          if (newParams['effectiveBandwidth95Daily']) {
-            newParams['startTime'] = newParams['effectiveBandwidth95Daily'][0];
-            newParams['endTime'] = newParams['effectiveBandwidth95Daily'][1];
-            delete newParams['effectiveBandwidth95Daily'];
-          }
-          if (newParams['effectiveBandwidth95Monthly']) {
-            newParams['startTime'] = newParams['effectiveBandwidth95Monthly'][0];
-            newParams['endTime'] = newParams['effectiveBandwidth95Monthly'][1];
-            delete newParams['effectiveBandwidth95Monthly'];
-          }
-          if (newParams['effectiveAvgMonthlyBandwidth95']) {
-            newParams['startTime'] = newParams['effectiveAvgMonthlyBandwidth95'][0];
-            newParams['endTime'] = newParams['effectiveAvgMonthlyBandwidth95'][1];
-            delete newParams['effectiveAvgMonthlyBandwidth95'];
-          }
-          if (newParams && newParams.bandwidthType && !newParams['startTime']) {
-            this.$refs['queryRef'].validate((valid) => {
-              if (!valid) {
-                return false;
-              }
-            });
-            return;
-          }
-          listBandWidth(newParams).then(response => {
-            this.tableList = response.rows;
-            this.queryParams.total = response.total;
-            this.loading = false;
-          })
-        },
-
-        /** 搜索按钮操作 */
-        handleQuery() {
-          this.$refs['queryRef'].validate((valid) => {
-            if (!valid) {
-              return false;
-            }
-          });
-          this.queryParams.pageNum = 1;
-          this.getList();
-        },
-
-        /** 重置按钮操作 */
-        resetQuery() {
-          this.resetForm("queryRef");
-          this.handleQuery();
-        },
-
-        /** 图形分析 */
-        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: list, dictList: dictTypeArr, resourceType: 1}));
-          // 1. 用 Vue Router 解析目标路由的完整 URL
-          const routeLocation = this.$router.resolve({
-            name: 'DialogView',
-            query: { storageKey }
-          });
-          // 2. 打开新窗口（routeLocation.href 是完整路径）
-          window.open(routeLocation.href, '_blank');
-          // _blank：新标签页；_self：当前窗口（默认）
-        },
-
-        chartDataEvent(val) {
-          // console.log('val===',val);
-          return val;
-        },
-
-        // 处理子组件传递的新值
-        handleValueChange(newValue) {
-          // 父组件更新自身数据，实现同步
-          this.showSearch = newValue;
-          // console.log('父组件拿到新值:', newValue);
-        },
-        callback(result, rowData, selectChange, selectList) {
-          if (result && result.fnCode) {
-            switch (result.fnCode) {
-              case 'edit':
-                this.$router.push({
-                  path:'/disRevenue/earnManage/server/list/index',
-                  query:{
-                    id: rowData.id,
-                    bandwidthType: rowData && rowData.bandwidthType
-                  }
-                });
-                break;
-              case 'echartView':
-                this.graphicAnalysis(selectList);
-                break;
-              case 'createData':
-                  this.$router.push({
-                    path:'/disRevenue/earnManage/server/edit/index',
-                    query:{
-                      resourceType: 1
-                    }
-                  });
-                  break;
-              case 'calculate':
-                let fnType = recalBandWidth;
-                if (rowData && rowData.bandwidthType === '4') {
-                  fnType = avgDetailMsg;
-                }
-                fnType(rowData.id).then(res => {
-                  this.getList();
-                  this.$modal.msgSuccess("操作成功！");
-                }).catch(() => {});
-                break;
-              case 'export':
-                let paramsList = Object.assign(this.queryParams,rowData, {resourceType: 1});
-                this.download("system/bandwidth/export", paramsList, `服务器带宽收益_${new Date().getTime()}.xlsx`, null, 'json');
-                break;
-              default:
-            }
-          }
-        },
-      }
+      methods: {}
     }
 </script>
 
 <style scoped>
-  ::v-deep .lastBtnSty .el-form-item__content{
-    margin-left: 10px!important;
+  ::v-deep .el-tabs__content{
+    height: 100%;
+    overflow: auto;
+    padding-bottom: 40px;
   }
 </style>
diff --git a/src/views/disRevenue/earnManage/server/serverTabs.vue b/src/views/disRevenue/earnManage/server/serverTabs.vue
new file mode 100644
index 0000000..7fc3f1f
--- /dev/null
+++ b/src/views/disRevenue/earnManage/server/serverTabs.vue
@@ -0,0 +1,382 @@
+<template>
+  <div class="pageTopForm">
+    <el-form :model="queryParams" ref="queryRef" v-show="showSearch" size="small" label-width="80px" class="demo-ruleForm">
+      <el-col :span="8">
+        <el-form-item label="节点名称" prop="nodeName">
+          <el-input
+            v-model="queryParams.nodeName"
+            placeholder="节点名称"
+            clearable
+            @keyup.enter="handleQuery">
+          </el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="8">
+        <el-form-item label="类型" prop="bandwidthType">
+          <el-select
+            v-model="queryParams.bandwidthType"
+            placeholder="请选择类型"
+            clearable>
+            <el-option
+              v-for="dict in dict.type.eps_bandwidth_type"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"/>
+          </el-select>
+        </el-form-item>
+      </el-col>
+      <el-col :span="8" v-if="queryParams.bandwidthType === '1'">
+        <el-form-item label="95带宽值Mbps/日" title="95带宽值Mbps/日" prop="bandwidth95Daily" :rules="[{ required: true, message: `95带宽值Mbps/日为必填项`, trigger: 'change' }]">
+          <el-date-picker
+            v-model="queryParams.bandwidth95Daily"
+            type="daterange"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"/>
+        </el-form-item>
+      </el-col>
+      <el-col :span="8" v-if="queryParams.bandwidthType === '2'">
+        <el-form-item label="95带宽值Mbps/月" title="95带宽值Mbps/月" prop="bandwidth95Monthly" :rules="[{ required: true, message: `95带宽值Mbps/月为必填项`, trigger: 'change' }]">
+          <el-date-picker
+            v-model="queryParams.bandwidth95Monthly"
+            type="monthrange"
+            value-format="yyyy-MM"
+            range-separator="至"
+            start-placeholder="开始月份"
+            end-placeholder="结束月份"/>
+        </el-form-item>
+      </el-col>
+      <el-col :span="8" v-if="queryParams.bandwidthType === '3'">
+        <el-form-item label="包端带宽值Mbps/日" title="包端带宽值Mbps/日" prop="packageBandwidthDaily" :rules="[{ required: true, message: `包端带宽值Mbps/日为必填项`, trigger: 'change' }]">
+          <el-date-picker
+            v-model="queryParams.packageBandwidthDaily"
+            type="daterange"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"/>
+        </el-form-item>
+      </el-col>
+      <el-col :span="8" v-if="queryParams.bandwidthType === '4'">
+        <el-form-item label="月均日95值Mbps" title="月均日95值Mbps" prop="avgMonthlyBandwidth95" :rules="[{ required: true, message: `月均日95值Mbps为必填项`, trigger: 'change' }]">
+          <el-date-picker
+            v-model="queryParams.avgMonthlyBandwidth95"
+            type="monthrange"
+            format="yyyy-MM"
+            value-format="yyyy-MM"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"/>
+        </el-form-item>
+      </el-col>
+      <el-col :span="8" v-if="queryParams.bandwidthType === '5'">
+        <el-form-item label="有效95带宽值Mbps/日" title="有效95带宽值Mbps/日" prop="effectiveBandwidth95Daily" :rules="[{ required: true, message: `有效95带宽值Mbps/日为必填项`, trigger: 'change' }]">
+          <el-date-picker
+            v-model="queryParams.effectiveBandwidth95Daily"
+            type="daterange"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"/>
+        </el-form-item>
+      </el-col>
+      <el-col :span="8" v-if="queryParams.bandwidthType === '6'">
+        <el-form-item label="有效95带宽值Mbps/月" title="有效95带宽值Mbps/月" prop="effectiveBandwidth95Monthly" :rules="[{ required: true, message: `有效95带宽值Mbps/月为必填项`, trigger: 'change' }]">
+          <el-date-picker
+            v-model="queryParams.effectiveBandwidth95Monthly"
+            type="monthrange"
+            format="yyyy-MM"
+            value-format="yyyy-MM"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"/>
+        </el-form-item>
+      </el-col>
+      <el-col :span="8" v-if="queryParams.bandwidthType === '7'">
+        <el-form-item label="有效月均日95值Mbps" title="有效月均日95值Mbps" prop="effectiveAvgMonthlyBandwidth95" :rules="[{ required: true, message: `有效月均日95值Mbps为必填项`, trigger: 'change' }]">
+          <el-date-picker
+            v-model="queryParams.effectiveAvgMonthlyBandwidth95"
+            type="daterange"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"/>
+        </el-form-item>
+      </el-col>
+      <el-col :span="8">
+        <el-form-item label="硬件SN" prop="hardwareSn">
+          <el-input
+            v-model="queryParams.hardwareSn"
+            placeholder="请输入硬件SN"
+            clearable
+            @keyup.enter="handleQuery"
+          />
+        </el-form-item>
+      </el-col>
+      <el-col :span="8">
+        <el-form-item class="lastBtnSty">
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+          <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+        </el-form-item>
+      </el-col>
+    </el-form>
+
+    <!-- 表格数据 -->
+    <TableList class="w100 h100" :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 EchartsBar from "@/components/echartsList/bar.vue";
+  import TableList from "@/components/table/index.vue";
+  import {listBandWidth, avgDetailMsg, recalBandWidth} from "@/api/disRevenue/earnManage"
+  export default {
+    name: 'ServerTabs',
+    dicts: ['eps_bandwidth_type'],
+    components: {TableList, EchartsBar},
+    props: {
+      activeName: {
+        type: String,
+        default: "1000"
+      }
+    },
+    watch: {
+      activeName: {
+        handler(val) {
+          this.getList();
+        },
+        deep: true,
+        immediate: true
+      }
+    },
+    data() {
+      return {
+        tableList: [],
+        loading: true,
+        showSearch: true,
+        // 列显隐信息
+        columns: {
+          id: {label: `ID`},
+          nodeName: {label: `节点名称`, minWidth: '250', visible: true},
+          hardwareSn: {label: `硬件SN`, minWidth: '350'},
+          uplinkSwitch: {label: `上联交换机`, minWidth: '150'},
+          businessId: {label: `业务代码`, minWidth: '150'},
+          businessName: {label: `业务名称`, minWidth: '150'},
+          bandwidth95Daily: {label: `95带宽值Mbps/日`, minWidth: '200', slotName: 'tempDay',visible: true},
+          effectiveBandwidth95Daily: {label: `有效95带宽值Mbps/日`, minWidth: '200', slotName: 'tempDay', visible: true},
+          packageBandwidthDaily: {label: `包端带宽值Mbps/日`, minWidth: '200', slotName: 'tempDay',visible: true},
+          bandwidth95Monthly: {label: `95带宽值Mbps/月`, minWidth: '200', slotName: 'tempMonth'},
+          // customerName: {label: `设备业务客户`,visible: true},
+          avgMonthlyBandwidth95: {label: `月均日95值Mbps`, minWidth: '200',slotName: 'tempDay'},
+          effectiveBandwidth95Monthly: {label: `有效95带宽值Mbps/月`, minWidth: '200', slotName: 'tempMonth'},
+          effectiveAvgMonthlyBandwidth95: {label: `有效月均日95值Mbps`, minWidth: '200', slotName: 'tempDay'},
+          createDatetime: {label: `创建时间`, minWidth: '150'},
+        },
+        config: {
+          // searcherForm: [
+          //   {label: '交换机名称', prop: 'roleName', type: 'selset', options: []}
+          // ],
+          tableButton: {
+            top: [
+              {content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'disRevenue:earnManage:server:export'},
+              {content: '图形分析', fnCode: 'echartView', type: 'success', icon: 'el-icon-data-analysis', hasPermi: 'disRevenue:earnManage:server:graphicAnalysis'},
+              {content: '生成月均日95值', fnCode: 'createData', type: 'success', icon: 'el-icon-data-analysis', hasPermi: 'disRevenue:earnManage:server:add'},
+            ],
+            line: [
+              {content: '相关数据', fnCode: 'edit', type: 'text', icon: 'el-icon-tickets', hasPermi: 'disRevenue:earnManage:server:relevantData'},
+              {content: '重新计算', fnCode: 'calculate', type: 'text', icon: 'el-icon-brush', hasPermi: 'disRevenue:earnManage:server:calculate'},
+              {}
+            ]
+          }
+        },
+        queryParams: {
+          pageNum: 1,
+          pageSize: 10,
+          total: 0,
+          bandwidthType: undefined,
+          hardwareSn: undefined,
+          bandwidth95Daily: undefined,
+          bandwidth95Monthly: undefined,
+          packageBandwidthDaily: undefined,
+          avgMonthlyBandwidth95: undefined,
+          effectiveBandwidth95Daily: undefined,
+          effectiveBandwidth95Monthly: undefined,
+          effectiveAvgMonthlyBandwidth95: undefined,
+        },
+      }
+    },
+    // created() {
+    //   this.$nextTick(() => {
+    //     this.getList(1);
+    //   });
+    // },
+    // activated() {
+    //   this.$nextTick(() => {
+    //     this.getList();
+    //   });
+    // },
+    methods: {
+      /** 查询角色列表 */
+      getList(num) {
+        this.loading = true;
+        let newParams = {...this.queryParams};
+        delete newParams['total'];
+        newParams['calculationMode'] = this.activeName;
+        newParams['resourceType'] = 1;
+        if (newParams['bandwidth95Daily']) {
+          newParams['startTime'] = newParams['bandwidth95Daily'][0];
+          newParams['endTime'] = newParams['bandwidth95Daily'][1];
+          delete newParams['bandwidth95Daily'];
+        }
+        if (newParams['bandwidth95Monthly']) {
+          newParams['startTime'] = newParams['bandwidth95Monthly'][0];
+          newParams['endTime'] = newParams['bandwidth95Monthly'][1];
+          delete newParams['bandwidth95Monthly'];
+        }
+        if (newParams['packageBandwidthDaily']) {
+          newParams['startTime'] = newParams['packageBandwidthDaily'][0];
+          newParams['endTime'] = newParams['packageBandwidthDaily'][1];
+          delete newParams['packageBandwidthDaily'];
+        }
+        if (newParams['avgMonthlyBandwidth95']) {
+          newParams['startTime'] = newParams['avgMonthlyBandwidth95'][0];
+          newParams['endTime'] = newParams['avgMonthlyBandwidth95'][1];
+          delete newParams['avgMonthlyBandwidth95'];
+        }
+        if (newParams['effectiveBandwidth95Daily']) {
+          newParams['startTime'] = newParams['effectiveBandwidth95Daily'][0];
+          newParams['endTime'] = newParams['effectiveBandwidth95Daily'][1];
+          delete newParams['effectiveBandwidth95Daily'];
+        }
+        if (newParams['effectiveBandwidth95Monthly']) {
+          newParams['startTime'] = newParams['effectiveBandwidth95Monthly'][0];
+          newParams['endTime'] = newParams['effectiveBandwidth95Monthly'][1];
+          delete newParams['effectiveBandwidth95Monthly'];
+        }
+        if (newParams['effectiveAvgMonthlyBandwidth95']) {
+          newParams['startTime'] = newParams['effectiveAvgMonthlyBandwidth95'][0];
+          newParams['endTime'] = newParams['effectiveAvgMonthlyBandwidth95'][1];
+          delete newParams['effectiveAvgMonthlyBandwidth95'];
+        }
+        if (newParams && newParams.bandwidthType && !newParams['startTime']) {
+          this.$refs['queryRef'].validate((valid) => {
+            if (!valid) {
+              return false;
+            }
+          });
+          return;
+        }
+        listBandWidth(newParams).then(response => {
+          this.tableList = response.rows;
+          this.queryParams.total = response.total;
+          this.loading = false;
+        })
+      },
+
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$refs['queryRef'].validate((valid) => {
+          if (!valid) {
+            return false;
+          }
+        });
+        this.queryParams.pageNum = 1;
+        this.getList();
+      },
+
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.resetForm("queryRef");
+        this.handleQuery();
+      },
+
+      /** 图形分析 */
+      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: list, dictList: dictTypeArr, resourceType: 1, activeName: this.activeName}));
+        // 1. 用 Vue Router 解析目标路由的完整 URL
+        const routeLocation = this.$router.resolve({
+          name: 'DialogView',
+          query: { storageKey }
+        });
+        // 2. 打开新窗口（routeLocation.href 是完整路径）
+        window.open(routeLocation.href, '_blank');
+        // _blank：新标签页；_self：当前窗口（默认）
+      },
+
+      chartDataEvent(val) {
+        // console.log('val===',val);
+        return val;
+      },
+
+      // 处理子组件传递的新值
+      handleValueChange(newValue) {
+        // 父组件更新自身数据，实现同步
+        this.showSearch = newValue;
+        // console.log('父组件拿到新值:', newValue);
+      },
+      callback(result, rowData, selectChange, selectList) {
+        if (result && result.fnCode) {
+          switch (result.fnCode) {
+            case 'edit':
+              this.$router.push({
+                path:'/disRevenue/earnManage/server/list/index',
+                query:{
+                  id: rowData.id,
+                  bandwidthType: rowData && rowData.bandwidthType
+                }
+              });
+              break;
+            case 'echartView':
+              this.graphicAnalysis(selectList);
+              break;
+            case 'createData':
+              this.$router.push({
+                path:'/disRevenue/earnManage/server/edit/index',
+                query:{
+                  resourceType: 1
+                }
+              });
+              break;
+            case 'calculate':
+              let fnType = recalBandWidth;
+              if (rowData && rowData.bandwidthType === '4') {
+                fnType = avgDetailMsg;
+              }
+              fnType(rowData.id).then(res => {
+                this.getList();
+                this.$modal.msgSuccess("操作成功！");
+              }).catch(() => {});
+              break;
+            case 'export':
+              let paramsList = Object.assign(this.queryParams,rowData, {resourceType: 1,calculationMode: this.activeName});
+              this.download("system/bandwidth/export", paramsList, `服务器带宽收益_${new Date().getTime()}.xlsx`, null, 'json');
+              break;
+            default:
+          }
+        }
+      },
+    }
+  }
+</script>
+
+<style scoped>
+  ::v-deep .lastBtnSty .el-form-item__content{
+    margin-left: 10px!important;
+  }
+</style>
diff --git a/src/views/disRevenue/earnManage/switch/index.vue b/src/views/disRevenue/earnManage/switch/index.vue
index ffed083..cf25069 100644
--- a/src/views/disRevenue/earnManage/switch/index.vue
+++ b/src/views/disRevenue/earnManage/switch/index.vue
@@ -1,447 +1,42 @@
 <template>
-    <div class="app-container pageTopForm">
-      <el-form :model="queryParams" ref="queryRef" v-show="showSearch" size="small" label-width="80px" class="demo-ruleForm">
-          <el-col :span="6">
-            <el-form-item label="交换机名称" prop="uplinkSwitch">
-                  <el-select
-                          v-model="queryParams.uplinkSwitch"
-                          placeholder="请选择交换机名称"
-                          clearable
-                          @change="changeEvent">
-                      <el-option
-                              v-for="item in uplinkList"
-                              :key="item.value"
-                              :label="item.label"
-                              :value="item.value"/>
-                  </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="6">
-            <el-form-item label="接口名称" prop="interfaceName">
-                    <el-select
-                            v-model="queryParams.interfaceName"
-                            placeholder="请选择接口名称"
-                            clearable>
-                        <el-option
-                                v-for="item in interfaceList"
-                                :key="item.value"
-                                :label="item.label"
-                                :value="item.value"/>
-                    </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="6">
-            <el-form-item label="硬件SN" prop="hardwareSn">
-              <el-input
-                v-model="queryParams.hardwareSn"
-                placeholder="请输入硬件SN"
-                clearable
-                @keyup.enter="handleQuery"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="6">
-            <el-form-item label="服务器节点名称" title="服务器节点名称" prop="nodeName">
-              <el-select
-                v-model="queryParams.nodeName"
-                placeholder="请输入服务器节点名称"
-                clearable>
-                <el-option
-                  v-for="item in nodeNameList"
-                  :key="item.value"
-                  :label="item.label"
-                  :value="item.value"/>
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="6">
-            <el-form-item label="类型" prop="bandwidthType">
-              <el-select
-                v-model="queryParams.bandwidthType"
-                placeholder="请选择类型"
-                clearable>
-                <el-option
-                  v-for="dict in dict.type.eps_bandwidth_type"
-                  :key="dict.value"
-                  :label="dict.label"
-                  :value="dict.value"/>
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="6" v-if="queryParams.bandwidthType === '1'">
-            <el-form-item label="95带宽值Mbps/日" title="95带宽值Mbps/日" prop="bandwidth95Daily" :rules="[{ required: true, message: `95带宽值Mbps/日为必填项`, trigger: 'change' }]">
-              <el-date-picker
-                v-model="queryParams.bandwidth95Daily"
-                type="daterange"
-                format="yyyy-MM-dd"
-                value-format="yyyy-MM-dd"
-                range-separator="至"
-                start-placeholder="开始日期"
-                end-placeholder="结束日期"/>
-            </el-form-item>
-          </el-col>
-          <el-col :span="6" v-if="queryParams.bandwidthType === '2'">
-            <el-form-item label="95带宽值Mbps/月" title="95带宽值Mbps/月" prop="bandwidth95Monthly"  :rules="[{ required: true, message: `95带宽值Mbps/月为必填项`, trigger: 'change' }]">
-              <el-date-picker
-                v-model="queryParams.bandwidth95Monthly"
-                type="monthrange"
-                value-format="yyyy-MM"
-                range-separator="至"
-                start-placeholder="开始月份"
-                end-placeholder="结束月份"/>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8" v-if="queryParams.bandwidthType === '3'">
-            <el-form-item label="包端带宽值Mbps/日" title="包端带宽值Mbps/日" prop="packageBandwidthDaily" :rules="[{ required: true, message: `包端带宽值Mbps/日为必填项`, trigger: 'change' }]">
-              <el-date-picker
-                v-model="queryParams.packageBandwidthDaily"
-                type="daterange"
-                format="yyyy-MM-dd"
-                value-format="yyyy-MM-dd"
-                range-separator="至"
-                start-placeholder="开始日期"
-                end-placeholder="结束日期"/>
-            </el-form-item>
-          </el-col>
-        <el-col :span="8" v-if="queryParams.bandwidthType === '4'">
-          <el-form-item label="月均日95值Mbps" title="月均日95值Mbps" prop="avgMonthlyBandwidth95" :rules="[{ required: true, message: `月均日95值Mbps为必填项`, trigger: 'change' }]">
-            <el-date-picker
-              v-model="queryParams.avgMonthlyBandwidth95"
-              type="monthrange"
-              format="yyyy-MM"
-              value-format="yyyy-MM"
-              range-separator="至"
-              start-placeholder="开始日期"
-              end-placeholder="结束日期"/>
-          </el-form-item>
-        </el-col>
-        <el-col :span="8" v-if="queryParams.bandwidthType === '5'">
-          <el-form-item label="有效95带宽值Mbps/日" title="有效95带宽值Mbps/日" prop="effectiveBandwidth95Daily" :rules="[{ required: true, message: `有效95带宽值Mbps/日为必填项`, trigger: 'change' }]">
-            <el-date-picker
-              v-model="queryParams.effectiveBandwidth95Daily"
-              type="daterange"
-              format="yyyy-MM-dd"
-              value-format="yyyy-MM-dd"
-              range-separator="至"
-              start-placeholder="开始日期"
-              end-placeholder="结束日期"/>
-          </el-form-item>
-        </el-col>
-        <el-col :span="8" v-if="queryParams.bandwidthType === '6'">
-          <el-form-item label="有效95带宽值Mbps/月" title="有效95带宽值Mbps/月" prop="effectiveBandwidth95Monthly" :rules="[{ required: true, message: `有效95带宽值Mbps/月为必填项`, trigger: 'change' }]">
-            <el-date-picker
-              v-model="queryParams.effectiveBandwidth95Monthly"
-              type="monthrange"
-              format="yyyy-MM"
-              value-format="yyyy-MM"
-              range-separator="至"
-              start-placeholder="开始日期"
-              end-placeholder="结束日期"/>
-          </el-form-item>
-        </el-col>
-        <el-col :span="8" v-if="queryParams.bandwidthType === '7'">
-          <el-form-item label="有效月均日95值Mbps" title="有效月均日95值Mbps" prop="effectiveAvgMonthlyBandwidth95" :rules="[{ required: true, message: `有效月均日95值Mbps为必填项`, trigger: 'change' }]">
-            <el-date-picker
-              v-model="queryParams.effectiveAvgMonthlyBandwidth95"
-              type="daterange"
-              format="yyyy-MM-dd"
-              value-format="yyyy-MM-dd"
-              range-separator="至"
-              start-placeholder="开始日期"
-              end-placeholder="结束日期"/>
-          </el-form-item>
-        </el-col>
-          <el-col :span="6">
-            <el-form-item class="lastBtnSty">
-                <el-button type="primary" size="mini" icon="Search" @click="handleQuery">搜索</el-button>
-                <el-button icon="Refresh" size="mini" @click="resetQuery">重置</el-button>
-            </el-form-item>
-          </el-col>
-        </el-form>
-
-        <!-- 表格数据 -->
-      <TableList :columns="columns" :config="config" :queryParams="queryParams" :tableList="tableList" @fnClick="callback" @fnRenderList="getList" @value-change="handleValueChange">
-        <!--    资源类型    -->
-        <template #tempType="{ row, column }">
-          <dict-tag :options="dict.type.rm_topology_type" :value="row.interfaceLinkDeviceType"/>
-        </template>
-        <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>
+  <div class="app-container" style="height: calc(100vh - 85px);">
+    <el-tabs class="h100" v-model="activeName">
+      <el-tab-pane label="1000计算方式" name="1000">
+        <SwitchTabs v-if="activeName === '1000'" :activeName="activeName"></SwitchTabs>
+      </el-tab-pane>
+      <el-tab-pane label="1024计算方式" name="1024">
+        <SwitchTabs v-if="activeName === '1024'" :activeName="activeName"></SwitchTabs>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
 </template>
 
 <script>
-    import {listBandWidth, recalBandWidth} from "@/api/disRevenue/earnManage"
-    import {listAllResourList,resNameBtType, postInterFaceName} from "@/api/disRevenue/resource"
-    import EchartsLine from "@/components/echartsList/line.vue";
-    import TableList from "@/components/table/index.vue";
-    export default {
-      name: 'Switch',
-      dicts: ['sys_normal_disable','eps_bandwidth_type','rm_topology_type'],
-      components: {TableList,EchartsLine},
-      data() {
-        return {
-          tableList: [],
-          loading: true,
-          showSearch: true,
-          uplinkList:[],  // 交换机名称
-          interfaceList:[],  // 接口名称
-          nodeNameList:[],  // 服务器节点名称
-          // 列显隐信息
-          columns: {
-            id: { label: `ID`,width: '50', visible: false },
-            uplinkSwitch: { label: `交换机名称`, minWidth: '200', visible: true },
-            hardwareSn: { label: `硬件SN`, minWidth: '200', visible: false },
-            interfaceName: { label: `接口名称`, minWidth: '120',visible: true },
-            interfaceLinkDeviceType: { label: `接口连接设备类型`, slotName: 'tempType',minWidth: '180',
-              slotHeaderName: '不同的类型统计方式不一样，当类型是服务器时，使用的是接口的接收流量，95带宽值Mbs/日和95带宽值Mbs/月统计的是交换机接口的接收流量；当类型是机房出口的时候，95带宽值Mbs/日和95带宽值Mbs/月统计的是交换机接口的发送流量', visible: true },
-            businessId: {label: `业务代码`,minWidth: '150'},
-            businessName: {label: `业务名称`,minWidth: '100'},
-            nodeName: { label: `服务器节点名称`, minWidth: '200'},
-            bandwidth95Daily: { label: `95带宽值Mbps/日`, minWidth: '200', slotName: 'tempDay', visible: true },
-            effectiveBandwidth95Daily: {label: `有效95带宽值Mbps/日`, minWidth: '200', slotName: 'tempDay', visible: true },
-            bandwidth95Monthly: { label: `95带宽值Mbps/月`, minWidth: '200', slotName: 'tempMonth', visible: true },
-            avgMonthlyBandwidth95: {label: `月均日95值Mbps`, minWidth: '200', slotName: 'tempDay'},
-            effectiveBandwidth95Monthly: {label: `有效95带宽值Mbps/月`, minWidth: '200', slotName: 'tempMonth',},
-            effectiveAvgMonthlyBandwidth95: {label: `有效月均日95值Mbps`, minWidth: '200', slotName: 'tempDay'},
-            createTime: { label: `创建时间`, minWidth: '160'},
-            lastModifyTime: { label: `修改时间`, minWidth: '160'}
-          },
-          config: {
-            // searcherForm: [
-            //   {label: '交换机名称', prop: 'roleName', type: 'selset', options: []}
-            // ],
-            tableButton: {
-              top: [
-                {content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'disRevenue:earnManage:switch:export'},
-                {content: '图形分析', fnCode: 'echartView', type: 'success', icon: 'el-icon-data-analysis', hasPermi: 'disRevenue:earnManage:switch:graphicAnalysis'},
-                // {content: '生成月均日95值', fnCode: 'createData', type: 'success', icon: 'el-icon-data-analysis', hasPermi: 'disRevenue:earnManage:switch:add'},
-              ],
-              line: [
-                {content: '相关数据', fnCode: 'edit', type: 'text', icon: 'el-icon-tickets', hasPermi: 'disRevenue:earnManage:switch:relevantData'},
-                {content: '重新计算', fnCode: 'calculate', type: 'text', icon: 'el-icon-brush', hasPermi: 'disRevenue:earnManage:switch:calculate'},
-                {}
-              ]
-            }
-          },
-          queryParams: {
-            pageNum: 1,
-            pageSize: 10,
-            total: 0,
-            uplinkSwitch:undefined,
-            interfaceName:undefined,
-            hardwareSn:undefined,
-            nodeName:undefined,
-            bandwidthType:undefined,
-            bandwidth95Daily:undefined,
-            bandwidth95Monthly:undefined,
-            packageBandwidthDaily: undefined,
-            avgMonthlyBandwidth95: undefined,
-            effectiveBandwidth95Daily: undefined,
-            effectiveBandwidth95Monthly: undefined,
-            effectiveAvgMonthlyBandwidth95: undefined,
-          }
-        }
-      },
-      created() {
-        this.getList(1);
-        this.fnSelectAllName();
-      },
-      activated() {
-        this.getList();
-      },
-      methods: {
-        /** 查询角色列表 */
-        getList(num) {
-          this.loading = true;
-          let newParams = {...this.queryParams};
-          delete newParams['total'];
-          newParams['resourceType'] = 2;
-          if (newParams['bandwidth95Daily']) {
-            newParams['startTime'] = newParams['bandwidth95Daily'][0];
-            newParams['endTime'] = newParams['bandwidth95Daily'][1];
-            delete newParams['bandwidth95Daily'];
-          }
-          if (newParams['bandwidth95Monthly']) {
-            newParams['startTime'] = newParams['bandwidth95Monthly'][0];
-            newParams['endTime'] = newParams['bandwidth95Monthly'][1];
-            delete newParams['bandwidth95Monthly'];
-          }
-          if (newParams['packageBandwidthDaily']) {
-            newParams['startTime'] = newParams['packageBandwidthDaily'][0];
-            newParams['endTime'] = newParams['packageBandwidthDaily'][1];
-            delete newParams['packageBandwidthDaily'];
-          }
-          if (newParams['avgMonthlyBandwidth95']) {
-            newParams['startTime'] = newParams['avgMonthlyBandwidth95'][0];
-            newParams['endTime'] = newParams['avgMonthlyBandwidth95'][1];
-            delete newParams['avgMonthlyBandwidth95'];
-          }
-          if (newParams['effectiveBandwidth95Daily']) {
-            newParams['startTime'] = newParams['effectiveBandwidth95Daily'][0];
-            newParams['endTime'] = newParams['effectiveBandwidth95Daily'][1];
-            delete newParams['effectiveBandwidth95Daily'];
-          }
-          if (newParams['effectiveBandwidth95Monthly']) {
-            newParams['startTime'] = newParams['effectiveBandwidth95Monthly'][0];
-            newParams['endTime'] = newParams['effectiveBandwidth95Monthly'][1];
-            delete newParams['effectiveBandwidth95Monthly'];
-          }
-          if (newParams['effectiveAvgMonthlyBandwidth95']) {
-            newParams['startTime'] = newParams['effectiveAvgMonthlyBandwidth95'][0];
-            newParams['endTime'] = newParams['effectiveAvgMonthlyBandwidth95'][1];
-            delete newParams['effectiveAvgMonthlyBandwidth95'];
-          }
-          if (newParams && newParams.bandwidthType && !newParams['startTime']) {
-            this.$refs['queryRef'].validate((valid) => {
-              if (!valid) {
-                return false;
-              }
-            });
-            return;
-          }
-          listBandWidth(newParams).then(response => {
-            this.tableList = response.rows;
-            this.queryParams.total = response.total;
-            this.loading = false;
-          })
-        },
-        fnSelectAllName() {
-          resNameBtType({resourceType: 2}).then(res => {
-            this.uplinkList = res && res.map(item => {
-              return Object.assign({label: item.resourceName, value: item.resourceName, ipAddress: item.ipAddress});
-            });
-          });
-          resNameBtType({resourceType: 1}).then(res => {
-            this.nodeNameList = res && res.map(item => {
-              return Object.assign({label: item.resourceName, value: item.resourceName, ipAddress: item.ipAddress});
-            });
-          });
-        },
-        changeEvent(val){
-          let params = {};
-          this.uplinkList.find(item => {
-            if (item.label === val) {
-              params = {switchIp: item.ipAddress};
-            }
-          });
-          postInterFaceName(Object.assign({},{resourceType: 2}, params)).then(res => {
-            this.interfaceList = res && res.map(item => {
-              return Object.assign({label: item.interfaceName, value: item.interfaceName});
-            });
-          });
-        },
-        /** 搜索按钮操作 */
-        handleQuery() {
-          this.$refs['queryRef'].validate((valid) => {
-            if (!valid) {
-              return false;
-            }
-          });
-          this.queryParams.pageNum = 1;
-          this.getList()
-        },
-
-        /** 重置按钮操作 */
-        resetQuery() {
-          this.resetForm("queryRef");
-          this.handleQuery();
-        },
-
-        /** 图形分析 */
-        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: list, dictList: dictTypeArr, resourceType: 2}));
-          // 1. 用 Vue Router 解析目标路由的完整 URL
-          const routeLocation = this.$router.resolve({
-            name: 'DialogView',
-            query: { storageKey }
-          });
-          // 2. 打开新窗口（routeLocation.href 是完整路径）
-          window.open(routeLocation.href, '_blank');
-          // _blank：新标签页；_self：当前窗口（默认）
-        },
-        chartDataEvent(val) {
-          // console.log('val===',val);
-          return val;
-        },
-        // 处理子组件传递的新值
-        handleValueChange(newValue) {
-          // 父组件更新自身数据，实现同步
-          this.showSearch = newValue;
-          // console.log('父组件拿到新值:', newValue);
-        },
-        callback(result, rowData, selectChange, selectList) {
-          if (result && result.fnCode) {
-            switch (result.fnCode) {
-              case 'insert':
-                this.$router.push({
-                  path:'/disRevenue/earnManage/switch/list/index'});
-                break;
-              case 'edit':
-                this.$router.push({
-                  path:'/disRevenue/earnManage/switch/list/index',
-                  query:{
-                    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':
-              //   this.$router.push({
-              //     path:'/disRevenue/earnManage/switch/edit/index',
-              //     query:{
-              //       resourceType: 2
-              //     }
-              //   });
-              //   break;
-              case 'calculate':
-                recalBandWidth(rowData.id).then(res => {
-                  this.getList();
-                  this.$modal.msgSuccess("操作成功！");
-                }).catch(() => {});
-                break;
-              case 'export':
-                // let dataList = [];
-                // Object.keys(this.columns).forEach(item => {
-                //   if (item.visible) {
-                //     dataList.push(item.prop);
-                //   }
-                // });
-                // this.download("system/bandwidth/export", {properties: dataList, resourceType: 2}, `交换机带宽收益_${new Date().getTime()}.xlsx`);
-                let paramsList = Object.assign(this.queryParams,rowData, {resourceType: 2});
-                this.download("system/bandwidth/export", paramsList, `交换机带宽收益_${new Date().getTime()}.xlsx`, null, 'json');
-                break;
-              default:
-            }
-          }
-        }
+  import SwitchTabs from './switchTabs'
+  export default {
+    name: 'SwitchIndex',
+    components: {SwitchTabs},
+    data() {
+      return {
+        activeName: '1000'
       }
-    }
+    },
+    created() {
+      this.$nextTick(() => {
+      });
+    },
+    activated() {
+      this.$nextTick(() => {
+      });
+    },
+    methods: {}
+  }
 </script>
-<style>
-  ::v-deep .el-tooltip__popper.is-dark{
-    width: 350px!important; /* 固定宽度 */
-    white-space: normal!important; /* 允许换行（默认不换行） */
-  }
-</style>
+
 <style scoped>
-  ::v-deep .lastBtnSty .el-form-item__content{
-    margin-left: 10px!important;
+  ::v-deep .el-tabs__content{
+    height: 100%;
+    overflow: auto;
+    padding-bottom: 40px;
   }
 </style>
diff --git a/src/views/disRevenue/earnManage/switch/switchTabs.vue b/src/views/disRevenue/earnManage/switch/switchTabs.vue
new file mode 100644
index 0000000..8b96b75
--- /dev/null
+++ b/src/views/disRevenue/earnManage/switch/switchTabs.vue
@@ -0,0 +1,463 @@
+<template>
+  <div class="app-container pageTopForm">
+    <el-form :model="queryParams" ref="queryRef" v-show="showSearch" size="small" label-width="80px" class="demo-ruleForm">
+      <el-col :span="6">
+        <el-form-item label="交换机名称" prop="uplinkSwitch">
+          <el-select
+            v-model="queryParams.uplinkSwitch"
+            placeholder="请选择交换机名称"
+            clearable
+            @change="changeEvent">
+            <el-option
+              v-for="item in uplinkList"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"/>
+          </el-select>
+        </el-form-item>
+      </el-col>
+      <el-col :span="6">
+        <el-form-item label="接口名称" prop="interfaceName">
+          <el-select
+            v-model="queryParams.interfaceName"
+            placeholder="请选择接口名称"
+            clearable>
+            <el-option
+              v-for="item in interfaceList"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"/>
+          </el-select>
+        </el-form-item>
+      </el-col>
+      <el-col :span="6">
+        <el-form-item label="硬件SN" prop="hardwareSn">
+          <el-input
+            v-model="queryParams.hardwareSn"
+            placeholder="请输入硬件SN"
+            clearable
+            @keyup.enter="handleQuery"
+          />
+        </el-form-item>
+      </el-col>
+      <el-col :span="6">
+        <el-form-item label="服务器节点名称" title="服务器节点名称" prop="nodeName">
+          <el-select
+            v-model="queryParams.nodeName"
+            placeholder="请输入服务器节点名称"
+            clearable>
+            <el-option
+              v-for="item in nodeNameList"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"/>
+          </el-select>
+        </el-form-item>
+      </el-col>
+      <el-col :span="6">
+        <el-form-item label="类型" prop="bandwidthType">
+          <el-select
+            v-model="queryParams.bandwidthType"
+            placeholder="请选择类型"
+            clearable>
+            <el-option
+              v-for="dict in dict.type.eps_bandwidth_type"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"/>
+          </el-select>
+        </el-form-item>
+      </el-col>
+      <el-col :span="6" v-if="queryParams.bandwidthType === '1'">
+        <el-form-item label="95带宽值Mbps/日" title="95带宽值Mbps/日" prop="bandwidth95Daily" :rules="[{ required: true, message: `95带宽值Mbps/日为必填项`, trigger: 'change' }]">
+          <el-date-picker
+            v-model="queryParams.bandwidth95Daily"
+            type="daterange"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"/>
+        </el-form-item>
+      </el-col>
+      <el-col :span="6" v-if="queryParams.bandwidthType === '2'">
+        <el-form-item label="95带宽值Mbps/月" title="95带宽值Mbps/月" prop="bandwidth95Monthly"  :rules="[{ required: true, message: `95带宽值Mbps/月为必填项`, trigger: 'change' }]">
+          <el-date-picker
+            v-model="queryParams.bandwidth95Monthly"
+            type="monthrange"
+            value-format="yyyy-MM"
+            range-separator="至"
+            start-placeholder="开始月份"
+            end-placeholder="结束月份"/>
+        </el-form-item>
+      </el-col>
+      <el-col :span="8" v-if="queryParams.bandwidthType === '3'">
+        <el-form-item label="包端带宽值Mbps/日" title="包端带宽值Mbps/日" prop="packageBandwidthDaily" :rules="[{ required: true, message: `包端带宽值Mbps/日为必填项`, trigger: 'change' }]">
+          <el-date-picker
+            v-model="queryParams.packageBandwidthDaily"
+            type="daterange"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"/>
+        </el-form-item>
+      </el-col>
+      <el-col :span="8" v-if="queryParams.bandwidthType === '4'">
+        <el-form-item label="月均日95值Mbps" title="月均日95值Mbps" prop="avgMonthlyBandwidth95" :rules="[{ required: true, message: `月均日95值Mbps为必填项`, trigger: 'change' }]">
+          <el-date-picker
+            v-model="queryParams.avgMonthlyBandwidth95"
+            type="monthrange"
+            format="yyyy-MM"
+            value-format="yyyy-MM"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"/>
+        </el-form-item>
+      </el-col>
+      <el-col :span="8" v-if="queryParams.bandwidthType === '5'">
+        <el-form-item label="有效95带宽值Mbps/日" title="有效95带宽值Mbps/日" prop="effectiveBandwidth95Daily" :rules="[{ required: true, message: `有效95带宽值Mbps/日为必填项`, trigger: 'change' }]">
+          <el-date-picker
+            v-model="queryParams.effectiveBandwidth95Daily"
+            type="daterange"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"/>
+        </el-form-item>
+      </el-col>
+      <el-col :span="8" v-if="queryParams.bandwidthType === '6'">
+        <el-form-item label="有效95带宽值Mbps/月" title="有效95带宽值Mbps/月" prop="effectiveBandwidth95Monthly" :rules="[{ required: true, message: `有效95带宽值Mbps/月为必填项`, trigger: 'change' }]">
+          <el-date-picker
+            v-model="queryParams.effectiveBandwidth95Monthly"
+            type="monthrange"
+            format="yyyy-MM"
+            value-format="yyyy-MM"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"/>
+        </el-form-item>
+      </el-col>
+      <el-col :span="8" v-if="queryParams.bandwidthType === '7'">
+        <el-form-item label="有效月均日95值Mbps" title="有效月均日95值Mbps" prop="effectiveAvgMonthlyBandwidth95" :rules="[{ required: true, message: `有效月均日95值Mbps为必填项`, trigger: 'change' }]">
+          <el-date-picker
+            v-model="queryParams.effectiveAvgMonthlyBandwidth95"
+            type="daterange"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"/>
+        </el-form-item>
+      </el-col>
+      <el-col :span="6">
+        <el-form-item class="lastBtnSty">
+          <el-button type="primary" size="mini" icon="Search" @click="handleQuery">搜索</el-button>
+          <el-button icon="Refresh" size="mini" @click="resetQuery">重置</el-button>
+        </el-form-item>
+      </el-col>
+    </el-form>
+
+    <!-- 表格数据 -->
+    <TableList :columns="columns" :config="config" :queryParams="queryParams" :tableList="tableList" @fnClick="callback" @fnRenderList="getList" @value-change="handleValueChange">
+      <!--    资源类型    -->
+      <template #tempType="{ row, column }">
+        <dict-tag :options="dict.type.rm_topology_type" :value="row.interfaceLinkDeviceType"/>
+      </template>
+      <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 {listBandWidth, recalBandWidth} from "@/api/disRevenue/earnManage"
+  import {listAllResourList,resNameBtType, postInterFaceName} from "@/api/disRevenue/resource"
+  import EchartsLine from "@/components/echartsList/line.vue";
+  import TableList from "@/components/table/index.vue";
+  export default {
+    name: 'SwitchTabs',
+    dicts: ['sys_normal_disable','eps_bandwidth_type','rm_topology_type'],
+    components: {TableList,EchartsLine},
+    props: {
+      activeName: {
+        type: String,
+        default: "1000"
+      }
+    },
+    watch: {
+      activeName: {
+        handler(val) {
+          this.getList();
+        },
+        deep: true,
+        immediate: true
+      }
+    },
+    data() {
+      return {
+        tableList: [],
+        loading: true,
+        showSearch: true,
+        uplinkList:[],  // 交换机名称
+        interfaceList:[],  // 接口名称
+        nodeNameList:[],  // 服务器节点名称
+        // 列显隐信息
+        columns: {
+          id: { label: `ID`,width: '50', visible: false },
+          uplinkSwitch: { label: `交换机名称`, minWidth: '180', visible: true },
+          hardwareSn: { label: `硬件SN`, minWidth: '200', visible: false },
+          interfaceName: { label: `接口名称`, minWidth: '120',visible: true },
+          interfaceLinkDeviceType: { label: `接口连接设备类型`, slotName: 'tempType',minWidth: '180',
+            slotHeaderName: '不同的类型统计方式不一样，当类型是服务器时，使用的是接口的接收流量，95带宽值Mbs/日和95带宽值Mbs/月统计的是交换机接口的接收流量；当类型是机房出口的时候，95带宽值Mbs/日和95带宽值Mbs/月统计的是交换机接口的发送流量', visible: true },
+          businessId: {label: `业务代码`,minWidth: '150'},
+          businessName: {label: `业务名称`,minWidth: '100'},
+          nodeName: { label: `服务器节点名称`, minWidth: '200'},
+          bandwidth95Daily: { label: `95带宽值Mbps/日`, minWidth: '200', slotName: 'tempDay', visible: true },
+          effectiveBandwidth95Daily: {label: `有效95带宽值Mbps/日`, minWidth: '200', slotName: 'tempDay', visible: true },
+          bandwidth95Monthly: { label: `95带宽值Mbps/月`, minWidth: '200', slotName: 'tempMonth'},
+          avgMonthlyBandwidth95: {label: `月均日95值Mbps`, minWidth: '200', slotName: 'tempDay'},
+          effectiveBandwidth95Monthly: {label: `有效95带宽值Mbps/月`, minWidth: '200', slotName: 'tempMonth',},
+          effectiveAvgMonthlyBandwidth95: {label: `有效月均日95值Mbps`, minWidth: '200', slotName: 'tempDay'},
+          createTime: { label: `创建时间`, minWidth: '160'},
+          lastModifyTime: { label: `修改时间`, minWidth: '160'}
+        },
+        config: {
+          // searcherForm: [
+          //   {label: '交换机名称', prop: 'roleName', type: 'selset', options: []}
+          // ],
+          tableButton: {
+            top: [
+              {content: '导出', fnCode: 'export', type: 'warning', icon: 'el-icon-download', hasPermi: 'disRevenue:earnManage:switch:export'},
+              {content: '图形分析', fnCode: 'echartView', type: 'success', icon: 'el-icon-data-analysis', hasPermi: 'disRevenue:earnManage:switch:graphicAnalysis'},
+              // {content: '生成月均日95值', fnCode: 'createData', type: 'success', icon: 'el-icon-data-analysis', hasPermi: 'disRevenue:earnManage:switch:add'},
+            ],
+            line: [
+              {content: '相关数据', fnCode: 'edit', type: 'text', icon: 'el-icon-tickets', hasPermi: 'disRevenue:earnManage:switch:relevantData'},
+              {content: '重新计算', fnCode: 'calculate', type: 'text', icon: 'el-icon-brush', hasPermi: 'disRevenue:earnManage:switch:calculate'},
+              {}
+            ]
+          }
+        },
+        queryParams: {
+          pageNum: 1,
+          pageSize: 10,
+          total: 0,
+          uplinkSwitch:undefined,
+          interfaceName:undefined,
+          hardwareSn:undefined,
+          nodeName:undefined,
+          bandwidthType:undefined,
+          bandwidth95Daily:undefined,
+          bandwidth95Monthly:undefined,
+          packageBandwidthDaily: undefined,
+          avgMonthlyBandwidth95: undefined,
+          effectiveBandwidth95Daily: undefined,
+          effectiveBandwidth95Monthly: undefined,
+          effectiveAvgMonthlyBandwidth95: undefined,
+        }
+      }
+    },
+    created() {
+      // this.getList(1);
+      this.fnSelectAllName();
+    },
+    // activated() {
+    //   this.getList();
+    // },
+    methods: {
+      /** 查询角色列表 */
+      getList(num) {
+        this.loading = true;
+        let newParams = {...this.queryParams};
+        delete newParams['total'];
+        newParams['calculationMode'] = this.activeName;
+        newParams['resourceType'] = 2;
+        if (newParams['bandwidth95Daily']) {
+          newParams['startTime'] = newParams['bandwidth95Daily'][0];
+          newParams['endTime'] = newParams['bandwidth95Daily'][1];
+          delete newParams['bandwidth95Daily'];
+        }
+        if (newParams['bandwidth95Monthly']) {
+          newParams['startTime'] = newParams['bandwidth95Monthly'][0];
+          newParams['endTime'] = newParams['bandwidth95Monthly'][1];
+          delete newParams['bandwidth95Monthly'];
+        }
+        if (newParams['packageBandwidthDaily']) {
+          newParams['startTime'] = newParams['packageBandwidthDaily'][0];
+          newParams['endTime'] = newParams['packageBandwidthDaily'][1];
+          delete newParams['packageBandwidthDaily'];
+        }
+        if (newParams['avgMonthlyBandwidth95']) {
+          newParams['startTime'] = newParams['avgMonthlyBandwidth95'][0];
+          newParams['endTime'] = newParams['avgMonthlyBandwidth95'][1];
+          delete newParams['avgMonthlyBandwidth95'];
+        }
+        if (newParams['effectiveBandwidth95Daily']) {
+          newParams['startTime'] = newParams['effectiveBandwidth95Daily'][0];
+          newParams['endTime'] = newParams['effectiveBandwidth95Daily'][1];
+          delete newParams['effectiveBandwidth95Daily'];
+        }
+        if (newParams['effectiveBandwidth95Monthly']) {
+          newParams['startTime'] = newParams['effectiveBandwidth95Monthly'][0];
+          newParams['endTime'] = newParams['effectiveBandwidth95Monthly'][1];
+          delete newParams['effectiveBandwidth95Monthly'];
+        }
+        if (newParams['effectiveAvgMonthlyBandwidth95']) {
+          newParams['startTime'] = newParams['effectiveAvgMonthlyBandwidth95'][0];
+          newParams['endTime'] = newParams['effectiveAvgMonthlyBandwidth95'][1];
+          delete newParams['effectiveAvgMonthlyBandwidth95'];
+        }
+        if (newParams && newParams.bandwidthType && !newParams['startTime']) {
+          this.$refs['queryRef'].validate((valid) => {
+            if (!valid) {
+              return false;
+            }
+          });
+          return;
+        }
+        listBandWidth(newParams).then(response => {
+          this.tableList = response.rows;
+          this.queryParams.total = response.total;
+          this.loading = false;
+        })
+      },
+      fnSelectAllName() {
+        resNameBtType({resourceType: 2}).then(res => {
+          this.uplinkList = res && res.map(item => {
+            return Object.assign({label: item.resourceName, value: item.resourceName, ipAddress: item.ipAddress});
+          });
+        });
+        resNameBtType({resourceType: 1}).then(res => {
+          this.nodeNameList = res && res.map(item => {
+            return Object.assign({label: item.resourceName, value: item.resourceName, ipAddress: item.ipAddress});
+          });
+        });
+      },
+      changeEvent(val){
+        let params = {};
+        this.uplinkList.find(item => {
+          if (item.label === val) {
+            params = {switchIp: item.ipAddress};
+          }
+        });
+        postInterFaceName(Object.assign({},{resourceType: 2}, params)).then(res => {
+          this.interfaceList = res && res.map(item => {
+            return Object.assign({label: item.interfaceName, value: item.interfaceName});
+          });
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$refs['queryRef'].validate((valid) => {
+          if (!valid) {
+            return false;
+          }
+        });
+        this.queryParams.pageNum = 1;
+        this.getList()
+      },
+
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.resetForm("queryRef");
+        this.handleQuery();
+      },
+
+      /** 图形分析 */
+      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: list, dictList: dictTypeArr, resourceType: 2, activeName: this.activeName}));
+        // 1. 用 Vue Router 解析目标路由的完整 URL
+        const routeLocation = this.$router.resolve({
+          name: 'DialogView',
+          query: { storageKey }
+        });
+        // 2. 打开新窗口（routeLocation.href 是完整路径）
+        window.open(routeLocation.href, '_blank');
+        // _blank：新标签页；_self：当前窗口（默认）
+      },
+      chartDataEvent(val) {
+        // console.log('val===',val);
+        return val;
+      },
+      // 处理子组件传递的新值
+      handleValueChange(newValue) {
+        // 父组件更新自身数据，实现同步
+        this.showSearch = newValue;
+        // console.log('父组件拿到新值:', newValue);
+      },
+      callback(result, rowData, selectChange, selectList) {
+        if (result && result.fnCode) {
+          switch (result.fnCode) {
+            case 'insert':
+              this.$router.push({
+                path:'/disRevenue/earnManage/switch/list/index'});
+              break;
+            case 'edit':
+              this.$router.push({
+                path:'/disRevenue/earnManage/switch/list/index',
+                query:{
+                  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':
+            //   this.$router.push({
+            //     path:'/disRevenue/earnManage/switch/edit/index',
+            //     query:{
+            //       resourceType: 2
+            //     }
+            //   });
+            //   break;
+            case 'calculate':
+              recalBandWidth(rowData.id).then(res => {
+                this.getList();
+                this.$modal.msgSuccess("操作成功！");
+              }).catch(() => {});
+              break;
+            case 'export':
+              // let dataList = [];
+              // Object.keys(this.columns).forEach(item => {
+              //   if (item.visible) {
+              //     dataList.push(item.prop);
+              //   }
+              // });
+              // this.download("system/bandwidth/export", {properties: dataList, resourceType: 2}, `交换机带宽收益_${new Date().getTime()}.xlsx`);
+              let paramsList = Object.assign(this.queryParams,rowData, {resourceType: 2, calculationMode: this.activeName});
+              this.download("system/bandwidth/export", paramsList, `交换机带宽收益_${new Date().getTime()}.xlsx`, null, 'json');
+              break;
+            default:
+          }
+        }
+      }
+    }
+  }
+</script>
+<style>
+  ::v-deep .el-tooltip__popper.is-dark{
+    width: 350px!important; /* 固定宽度 */
+    white-space: normal!important; /* 允许换行（默认不换行） */
+  }
+</style>
+<style scoped>
+  ::v-deep .lastBtnSty .el-form-item__content{
+    margin-left: 10px!important;
+  }
+</style>