From 9b7404df6d727e6b54eabc48e7a456749eafd8e5 Mon Sep 17 00:00:00 2001
From: waibao2 <1@qq.com>
Date: Thu, 30 Oct 2025 14:35:52 +0800
Subject: [PATCH] =?UTF-8?q?docs=EF=BC=9A=E6=B0=B4=E4=BD=8D=E6=88=90?=
 =?UTF-8?q?=E6=9E=9C=EF=BC=88=E9=80=90=E6=97=A5=E5=B9=B3=E5=9D=87=E6=B0=B4?=
 =?UTF-8?q?=E4=BD=8D=E8=A1=A8=E3=80=81=E6=B4=AA=E6=B0=B4=E6=B0=B4=E4=BD=8D?=
 =?UTF-8?q?=E6=91=98=E5=BD=95=E8=A1=A8=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/report/reportwater/index.vue | 115 ++++++++
 src/views/report/waterZl/index.vue     | 200 ++++++++++++++
 src/views/report/zrsw/index.vue        | 353 +++++++++++++++++++++++++
 3 files changed, 668 insertions(+)
 create mode 100644 src/views/report/reportwater/index.vue
 create mode 100644 src/views/report/waterZl/index.vue
 create mode 100644 src/views/report/zrsw/index.vue

diff --git a/src/views/report/reportwater/index.vue b/src/views/report/reportwater/index.vue
new file mode 100644
index 0000000..3d9a0a2
--- /dev/null
+++ b/src/views/report/reportwater/index.vue
@@ -0,0 +1,115 @@
+<template>
+    <div class="report-rain">
+        <div class="tjfx-menu">
+            <el-select v-model="menu" placeholder="请选择">
+                <el-option v-for="dict in tjfxMenus" :key="dict.value" :label="dict.label" :value="dict.value" />
+            </el-select>
+        </div>
+        <!-- 添加加载状态和错误提示 -->
+        <div v-if="componentError" class="error-message">
+            组件加载失败，请刷新页面重试
+        </div>
+        <component :is="currentComponent" :tableTitle="tableTitle"></component>
+    </div>
+</template>
+
+<script setup>
+    import { ref, computed, defineAsyncComponent } from 'vue'
+
+
+    // 定义菜单选项
+    const tjfxMenus = [
+        // {
+        //     value: '1',
+        //     label: '水位、水文站一览表'
+        // },
+        // {
+        //     value: '2',
+        //     label: '各站月年平均水位对照表'
+        // }, 
+        {
+            value: '3',
+            label: '逐日平均水位表'
+        }, 
+        // {
+        //     value: '4',
+        //     label: '月最高水位及出现日期'
+        // }, 
+        // {
+        //     value: '5',
+        //     label: '月最低水位及出现日期'
+        // }, 
+        {
+            value: '6',
+            label: '洪水水位摘录表'
+        },
+        // {
+        //     value: '7',
+        //     label: '洪水水文要素摘录表'
+        // },
+        // {
+        //     value: '8',
+        //     label: '堰闸洪水水文要素摘录表'
+        // },
+        // {
+        //     value: '9',
+        //     label: '水库水文要素摘录表'
+        // }
+    ]
+
+    // 当前选中的菜单
+    const menu = ref(tjfxMenus.length > 0 ? tjfxMenus[0].value : '')
+
+    // 动态组件映射
+    const componentMap = {
+        '1': defineAsyncComponent(() => import('@/views/report/swswzylb/index.vue')),
+        '2': defineAsyncComponent(() => import('@/views/report/gzynswdzb/index.vue')),
+        '3': defineAsyncComponent(() => import('@/views/report/zrsw/index.vue')),
+        '4': defineAsyncComponent(() => import('@/views/report/swpeak/index.vue')),
+        '5': defineAsyncComponent(() => import('@/views/report/swpeakmin/index.vue')),
+        '6': defineAsyncComponent(() => import('@/views/report/waterZl/index.vue')),
+        '7': defineAsyncComponent(() => import('@/views/report/waterswys/index.vue')),
+        '8': defineAsyncComponent(() => import('@/views/report/zyhssw/index.vue')),
+        '9': defineAsyncComponent(() => import('@/views/report/rvhsswyszl/index.vue'))
+    }
+    // 添加错误处理
+    const componentError = ref(false)
+
+    onErrorCaptured((error) => {
+        componentError.value = true
+        return true
+    })
+
+    // 计算当前应该显示的组件
+    const currentComponent = computed(() => {
+        return componentMap[menu.value]
+    })
+    // 原代码有误，tjfxMenus 中的对象没有 name 属性
+    const tableTitle = computed(() => {
+        const currentItem = tjfxMenus.find(item => item.value === menu.value);
+        return currentItem ? currentItem.label : '';
+    })
+</script>
+
+<style lang="scss">
+    .tjfx-menu {
+        position: absolute;
+        right: 25px;
+        top: 30px;
+        z-index: 999999;
+
+        .el-input__wrapper {
+            background: #10163A;
+        }
+
+        .el-input__inner {
+            background: #10163A;
+            color: #fff;
+            border-color: #10163A;
+        }
+
+        .el-select .el-input .el-select__caret {
+            color: #fff !important;
+        }
+    }
+</style>
\ No newline at end of file
diff --git a/src/views/report/waterZl/index.vue b/src/views/report/waterZl/index.vue
new file mode 100644
index 0000000..6d4f251
--- /dev/null
+++ b/src/views/report/waterZl/index.vue
@@ -0,0 +1,200 @@
+<template>
+    <div class="app-container app-container-bg">
+        <el-card class="first-card" ref='firstCard' shadow="always">
+            <el-form :model="queryParams" ref="queryForm" :inline="true" @submit.native.prevent>
+                <el-form-item label="选择站点">
+                    <ESelectSingle ref="eSelectSingle" :stationType="stationType" @stationChange="handleStationChange" @loadingChange="handleStationLoading" />
+                </el-form-item>
+                <el-form-item label="年份">
+                    <el-date-picker v-model="queryParams.year" type="year" value-format="YYYY" placeholder="选择年" :clearable="false">
+                    </el-date-picker>
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+                    <el-button type="warning" icon="Download" @click="handleExport">下载</el-button>
+                </el-form-item>
+            </el-form>
+        </el-card>
+
+        <div class="el-card-p card-shadow carder-border mt10 pad10" style="max-width: 100%; overflow-x: hidden;padding-top:0" v-loading="loading">
+            <div class="main-table-header sticky-header">
+                <div class="table-title">
+                    <span class="pr10" v-if="selectStnm!==''">{{selectStnm}}</span>
+                    <span>{{tableTitle}}</span>
+                </div>
+            </div>
+            <el-empty v-if="total==0" description="暂无数据" />
+            <div v-for="(item,index) in tableData" :key="index" class="mb50 main-table-header">
+                <div class="table-time mb5">
+                    <div>
+                        <span>年份: </span><span id="title1">{{queryParams.year }}</span>
+                    </div>
+                    <div>
+                        <span>测站编码: </span><span id="title2">{{queryParams.stnmId}}</span>
+                    </div>
+                    <div>
+                        <span>共{{total}}页 </span><span id="title3" class="pl10">第{{index+1}}页</span>
+                    </div>
+                </div>
+                <div style="height:100%;display: flex;">
+                    <template v-for="(info,idx) in item.slice(0,5)" :key="idx">
+                        <el-table class="report-table merge-header no-border-table" :data="info" style="width: 100%;" :table-layout="tableLayout">
+                            <el-table-column label="日期" :align="alignment">
+                                <el-table-column label="月" :align="alignment">
+                                    <template #default="scope">
+                                        <span v-if="scope.row.month !== getPrevRow(scope,'month','1')">
+                                            {{ scope.row.month }}
+                                        </span>
+                                    </template>
+                                </el-table-column>
+                                <el-table-column label="日" :align="alignment">
+                                    <template #default="scope">
+                                        <span v-if=" scope.row.day !== getPrevRow(scope,'day','2')">
+                                            {{ scope.row.day }}
+                                        </span>
+                                    </template>
+                                </el-table-column>
+                                <el-table-column prop="hourMinute2" label="时分">
+                                </el-table-column>
+                            </el-table-column>
+                            <el-table-column prop="valueDecimal" align="right">
+                                <template #header>
+                                    <div style="line-height: 1.2;text-align: center;">
+                                        <div>水位</div>
+                                        <div>(m)</div>
+                                    </div>
+                                </template>
+                            </el-table-column>
+                        </el-table>
+                    </template>
+                </div>
+
+            </div>
+
+        </div>
+
+    </div>
+</template>
+<script setup>
+    import dayjs from 'dayjs';
+    import ESelectSingle from '@/components/ESelectSingle/index.vue'
+    import { ref, reactive, onMounted } from 'vue';
+
+    const props = defineProps({
+        tableTitle: {
+            type: String,
+            default: '表格标题'
+        },
+
+    })
+
+    const { proxy } = getCurrentInstance()
+    const alignment = 'center'
+    const stationType = 'C'
+    const tableLayout = ref('fixed')
+    const singleStationRef = ref(null)
+    const selectStnm = ref('')
+
+    const handleStationLoading = (loadingState) => {
+        loading.value = loadingState;
+    }
+    // 新增处理站点变化的函数
+    const handleStationChange = (stnmId) => {
+        queryParams.stnmId = stnmId
+        if (stnmId == undefined) {
+            proxy.$modal.msgWarning("请选择站点后查询");
+            return
+        } else {
+            getList()
+        }
+    }
+    const loading = ref(false);
+    const tableData = ref([]);
+    const queryParams = reactive({
+        year: dayjs(new Date()).format('YYYY'),
+        stnmId: ""
+    });
+    let total = ref(0)
+
+    const getList = async () => {
+        try {
+            const res = await proxy.axiosGet('/report/getWaterZlData', queryParams)
+            if (res.code == 0) {
+                total.value = res.data.datas.length
+                let data = res.data.datas
+                selectStnm.value = res.data.station.stnm
+                // 处理数据，每五行插入一组空数据
+                const processedData = data.map(page => {
+                    return page.map(table => {
+                        const newTable = [];
+                        for (let i = 0; i < table.length; i += 5) {
+                            // 添加原始数据的5行
+                            newTable.push(...table.slice(i, i + 5));
+                            // 每5行后插入一组空数据（如果不是最后一批数据）
+                            if (i + 5 < table.length) {
+                                newTable.push({
+                                    month: '',
+                                    day: '',
+                                    hourMinute2: '',
+                                    valueDecimal: ''
+                                });
+                            }
+                        }
+                        return newTable;
+                    });
+                });
+
+                tableData.value = processedData;
+            }
+        } catch (error) {
+            console.error(error)
+        } finally {
+            // 确保在请求完成后隐藏loading
+            loading.value = false
+        }
+    }
+
+    // 优化后的获取上一行月份的方法
+    const getPrevRow = (scope, field, type) => {
+        const rowIndex = scope.$index;
+        const data = scope.store.states.data;
+
+        // 如果是第一行，返回null
+        if (rowIndex === 0) return null;
+
+        // 找到上一个非空行的月份
+        let prevRowIndex = rowIndex - 1;
+        while (prevRowIndex >= 0 && (!data.value[prevRowIndex][field] || data.value[prevRowIndex][field] === '')) {
+            prevRowIndex--;
+        }
+        if (type == '1') {
+            field = 'month'
+        }
+        let result = prevRowIndex >= 0 ? data.value[prevRowIndex][field] : null;
+        // 如果找到有效的上一行数据，返回其月份；否则返回null
+        return result
+    };
+
+
+    // 搜索按钮操作
+    const handleQuery = () => {
+        getList()
+    }
+    // 下载按钮操作
+    const handleExport = () => { }
+    onMounted(() => { })
+</script>
+<style scoped lang="scss">
+    .no-border-table :deep(.el-table__body-wrapper .el-table__cell) {
+        border-bottom: 0 !important;
+    }
+
+    .no-border-table :deep(.el-table__body-wrapper .el-table__cell) {
+        padding: 2px 0 !important;
+    }
+
+    .no-border-table :deep(.el-table__body-wrapper .el-table__row:nth-child(6n) .el-table__cell) {
+        padding: 10px 0 !important;
+        background-color: #f9f9f9;
+    }
+</style>
\ No newline at end of file
diff --git a/src/views/report/zrsw/index.vue b/src/views/report/zrsw/index.vue
new file mode 100644
index 0000000..7c1ea97
--- /dev/null
+++ b/src/views/report/zrsw/index.vue
@@ -0,0 +1,353 @@
+<template>
+    <div class="app-container app-container-bg">
+        <el-card class="first-card" ref='firstCard' shadow="always">
+            <el-form :model="queryParams" ref="queryForm" :inline="true" @submit.native.prevent>
+                <!-- <el-form-item label="类型">
+                    <el-select v-model="stationType" placeholder="请选择类型" @change="changeStationType" class="w150">
+                        <el-option label="水库" value="C"></el-option>
+                        <el-option label="河道" value="B"></el-option>
+                    </el-select>
+                </el-form-item> -->
+                <el-form-item label="选择站点">
+                    <ESelectSingle ref="eSelectSingle" :stationType="stationType" @stationChange="handleStationChange" @loadingChange="handleStationLoading" />
+                </el-form-item>
+                <el-form-item label="年份">
+                    <el-date-picker v-model="queryParams.year" type="year" value-format="YYYY" placeholder="选择年" :clearable="false">
+                    </el-date-picker>
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+                    <el-button type="warning" icon="Download" @click="handleExport">下载</el-button>
+                </el-form-item>
+            </el-form>
+        </el-card>
+
+        <div class="el-card-p card-shadow carder-border mt10 pad10 " style="max-width: 100%; overflow-x: hidden;">
+            <div class="main-table-header" style="width: 70%;margin:0 auto">
+                <div class="table-title">{{tableTitle}}</div>
+                <div class="table-time mb5">
+                    <div>
+                        <span>年份: </span><span id="title1">{{queryParams.year }}</span>
+                    </div>
+                    <div>
+                        <span>测站编码: </span><span id="title2">{{staid}}</span>
+                    </div>
+                    <div>
+                        <span>{{title}} </span><span id="title3" class="pl10">m= 85基准基准基面以上米数</span>
+                    </div>
+                </div>
+            </div>
+            <el-table class="report-table merge-header" v-table-height="{bottom:130}" v-loading="loading" :data="tableData" style="width: 70%;margin:0 auto" :table-layout="tableLayout" :span-method="arraySpanMethod">
+                <el-table-column prop="value" :align="alignment">
+                    <el-table-column prop="date" width="40" :align="alignment" />
+                    <el-table-column prop="yueTotal" width="40" :align="alignment" />
+                    <template #header>
+                        <div class="diagonal-header">
+                            <svg class="diagonal-line" viewBox="0 0 100 100" preserveAspectRatio="none">
+                                <line x1="0" y1="0" x2="100" y2="100" stroke="#000" stroke-width="1" />
+                            </svg>
+                            <div class="header-month">月份</div>
+                            <div class="header-date">日期</div>
+                        </div>
+                    </template>
+
+                </el-table-column>
+                <el-table-column v-for="(item, index) in columnData" :key="index" :label="item.label" :align="alignment" :prop="item.prop">
+                </el-table-column>
+            </el-table>
+            <!-- <div> 备注：表格中 ' / '表示该日期整天缺测，其余缺测日期为部分缺测。 </div> -->
+        </div>
+    </div>
+</template>
+<script setup>
+    import dayjs from 'dayjs';
+    import ESelectSingle from '@/components/ESelectSingle/index.vue'
+    import { ref, reactive, onMounted } from 'vue';
+
+    const props = defineProps({
+        tableTitle: {
+            type: String,
+            default: '表格标题'
+        },
+
+    })
+
+    const { proxy } = getCurrentInstance()
+    const alignment = 'center'
+    const stationType = 'C'
+    const tableLayout = ref('fixed')
+    const singleStationRef = ref(null)
+    // 新增处理站点变化的函数
+    const handleStationChange = (stnmId) => {
+        queryParams.stnmId = stnmId
+        if (stnmId == undefined) {
+            proxy.$modal.msgWarning("请选择站点后查询");
+            return
+        } else {
+            loading.value = true;
+            getList()
+        }
+    }
+
+    const loading = ref(false);
+    const tableData = ref([]);
+    const queryParams = reactive({
+        year: dayjs(new Date()).format('YYYY'),
+        type: 0
+    });
+    const staid = ref('')
+    const title = ref('')
+    const getList = async () => {
+        loading.value = true;
+        try {
+            const res = await proxy.axiosGet('/report/zrswdata', queryParams)
+            if (res.code == 0) {
+                staid.value = res.data.staid
+                title.value = res.data.title
+                // let data = res.data
+                let data = []
+                // 生成1~31日数据
+                for (let i = 1; i <= 31; i++) {
+                    let j = i - 1
+                    data.push({
+                        date: i,
+                        yueTotal: '',
+                        Jan: res.data.dayCountData[0][j] || '/',
+                        Feb: res.data.dayCountData[1][j] || '/',
+                        Mar: res.data.dayCountData[2][j] || '/',
+                        Apr: res.data.dayCountData[3][j] || '/',
+                        May: res.data.dayCountData[4][j] || '/',
+                        Jun: res.data.dayCountData[5][j] || '/',
+                        Jul: res.data.dayCountData[6][j] || '/',
+                        Aug: res.data.dayCountData[7][j] || '/',
+                        Sep: res.data.dayCountData[8][j] || '/',
+                        Oct: res.data.dayCountData[9][j] || '/',
+                        Nov: res.data.dayCountData[10][j] || '/',
+                        Dec: res.data.dayCountData[11][j] || '/'
+                    })
+                }
+                let yueList = ['平均', '最高', '日期', '最低', '日期']
+
+                for (let i = 0; i < 5; i++) {
+                    data.push(
+                        {
+                            yueTotal: yueList[i],
+                            date: "月统计",
+                            Jan: i == 0 ? res.data.avgList[0] : i == 1 ? res.data.maxList[0] : i == 2 ? res.data.maxDayList[0] : i == 3 ? res.data.minList[0] : i == 4 ? res.data.minDayList[0] : '/',
+                            Feb: i == 0 ? res.data.avgList[1] : i == 1 ? res.data.maxList[1] : i == 2 ? res.data.maxDayList[1] : i == 3 ? res.data.minList[1] : i == 4 ? res.data.minDayList[1] : '/',
+                            Mar: i == 0 ? res.data.avgList[2] : i == 1 ? res.data.maxList[2] : i == 2 ? res.data.maxDayList[2] : i == 3 ? res.data.minList[2] : i == 4 ? res.data.minDayList[2] : '/',
+                            Apr: i == 0 ? res.data.avgList[3] : i == 1 ? res.data.maxList[3] : i == 2 ? res.data.maxDayList[3] : i == 3 ? res.data.minList[3] : i == 4 ? res.data.minDayList[3] : '/',
+                            May: i == 0 ? res.data.avgList[4] : i == 1 ? res.data.maxList[4] : i == 2 ? res.data.maxDayList[4] : i == 3 ? res.data.minList[4] : i == 4 ? res.data.minDayList[4] : '/',
+                            Jun: i == 0 ? res.data.avgList[5] : i == 1 ? res.data.maxList[5] : i == 2 ? res.data.maxDayList[5] : i == 3 ? res.data.minList[5] : i == 4 ? res.data.minDayList[5] : '/',
+                            Jul: i == 0 ? res.data.avgList[6] : i == 1 ? res.data.maxList[6] : i == 2 ? res.data.maxDayList[6] : i == 3 ? res.data.minList[6] : i == 4 ? res.data.minDayList[6] : '/',
+                            Aug: i == 0 ? res.data.avgList[7] : i == 1 ? res.data.maxList[7] : i == 2 ? res.data.maxDayList[7] : i == 3 ? res.data.minList[7] : i == 4 ? res.data.minDayList[7] : '/',
+                            Sep: i == 0 ? res.data.avgList[8] : i == 1 ? res.data.maxList[8] : i == 2 ? res.data.maxDayList[8] : i == 3 ? res.data.minList[8] : i == 4 ? res.data.minDayList[8] : '/',
+                            Oct: i == 0 ? res.data.avgList[9] : i == 1 ? res.data.maxList[9] : i == 2 ? res.data.maxDayList[9] : i == 3 ? res.data.minList[9] : i == 4 ? res.data.minDayList[9] : '/',
+                            Nov: i == 0 ? res.data.avgList[10] : i == 1 ? res.data.maxList[10] : i == 2 ? res.data.maxDayList[10] : i == 3 ? res.data.minList[10] : i == 4 ? res.data.minDayList[10] : '/',
+                            Dec: i == 0 ? res.data.avgList[11] : i == 1 ? res.data.maxList[11] : i == 2 ? res.data.maxDayList[11] : i == 3 ? res.data.minList[11] : i == 4 ? res.data.minDayList[11] : '/'
+
+                        }
+                    )
+                }
+                let yearMaxValue = res.data.yearMax?.replace(/&nbsp;/g, ' ').trim();
+                let yearMinValue = res.data.yearMin?.replace(/&nbsp;/g, ' ').trim();
+
+                let nianList = ['最高水位', '保证率', '水位']
+                for (let i = 0; i < 3; i++) {
+                    data.push(
+                        {
+                            date: "年统计",
+                            yueTotal: '',
+                            Jan: nianList[i],
+                            Feb: i == 0 ? yearMaxValue : i == 1 ? '最高' : i == 2 ? res.data.bz_max : '/',
+                            Mar: i == 0 ? '最低水位' : i == 1 ? '第15天' : i == 2 ? res.data.bz_15 : '/',
+                            Apr: i == 0 ? yearMinValue : i == 1 ? '第30天' : i == 2 ? res.data.bz_30 : '/',
+                            May: i == 0 ? '平均水位' : i == 1 ? '' : i == 2 ? '' : '/',
+                            Jun: i == 0 ? res.data.yearAvg : i == 1 ? '第90天' : i == 2 ? res.data.bz_90 : '/',
+                            Jul: '',
+                            Aug: i == 0 ? '' : i == 1 ? '第180天' : i == 2 ? res.data.bz_180 : '/',
+                            Sep: '',
+                            Oct: i == 0 ? '' : i == 1 ? '第270天' : i == 2 ? res.data.bz_270 : '/',
+                            Nov: '',
+                            Dec: i == 0 ? '' : i == 1 ? '最低' : i == 2 ? res.data.bz_min : '/',
+
+                        }
+                    )
+                }
+                // 添加附注行
+                data.push({
+                    date: '附录',
+                    Jan: res.data.fuzhu
+                })
+                tableData.value = data
+
+            }
+            console.log(tableData.value, 'tableData')
+            loading.value = false
+        } catch (error) {
+            loading.value = false
+        }
+    }
+    // 改变类型操作
+    const changeStationType = (val) => {
+        queryParams.stationType = val
+        queryParams.type = val == 'B' ? 1 : 0
+    }
+    // 搜索按钮操作
+    const handleQuery = () => {
+        getList()
+    }
+    // 重置按钮操作
+    const resetQuery = () => { }
+    // 下载按钮操作
+    const handleExport = () => { }
+    onMounted(() => { })
+    const columnData = ref([
+        { label: '一月', prop: 'Jan' },
+        { label: '二月', prop: 'Feb' },
+        { label: '三月', prop: 'Mar' },
+        { label: '四月', prop: 'Apr' },
+        { label: '五月', prop: 'May' },
+        { label: '六月', prop: 'Jun' },
+        { label: '七月', prop: 'Jul' },
+        { label: '八月', prop: 'Aug' },
+        { label: '九月', prop: 'Sep' },
+        { label: '十月', prop: 'Oct' },
+        { label: '十一月', prop: 'Nov' },
+        { label: '十二月', prop: 'Dec' }
+    ])
+
+    const arraySpanMethod = ({ row, column, rowIndex, columnIndex }) => {
+        let rowList = [31, 32, 33, 34, 35, 36, 37, 38]
+        // 表头行（第一行）合并第一列和第二列
+        if (!rowList.includes(rowIndex)) {
+            if (columnIndex === 0) {
+                // 第一列合并两列
+                return [1, 2];
+            } else if (columnIndex === 1) {
+                // 第二列被合并，不显示
+                return [0, 0];
+            }
+        }
+
+        // 月统计行合并
+        if (rowIndex >= 31 && rowIndex <= 35) {
+            if (columnIndex === 0) {
+                return rowIndex === 31 ? [5, 1] : [0, 0];
+            }
+            if (columnIndex === 1) return [1, 1];
+        }
+
+        // 年统计行合并
+        if (rowIndex >= 36 && rowIndex <= 38) {
+            if (columnIndex === 0) {
+                return rowIndex === 36 ? [3, 2] : [0, 0];
+            }
+
+            if (columnIndex === 1) return [0, 0];
+            if (rowIndex == 36) {
+                if (columnIndex === 2) {
+                    return [1, 1];
+                } else if (columnIndex === 3) {
+                    return [1, 3];
+                } else if (columnIndex === 4) {
+                    return [1, 1];
+                } else if (columnIndex === 5) {
+                    return [1, 3];
+                } else if (columnIndex === 6) {
+                    return [1, 1];
+                } else if (columnIndex === 7) {
+                    return [1, 3];
+                } else {
+                    return [0, 0];
+                }
+            }
+        }
+        // 附录行合并
+        if (rowIndex === tableData.value.length - 1) {
+            if (columnIndex === 1) {
+                return [1, 2];
+            } else if (columnIndex === 2) {
+                return [1, 12];
+            } else {
+                return [0, 0];
+
+            }
+        }
+        // 其他行不合并
+        return [1, 1];
+    }
+</script>
+<style scoped lang='scss'>
+    /* 斜线表头容器 */
+    .diagonal-header {
+        position: relative;
+        width: 100%;
+        height: 100%;
+        min-height: 60px;
+        /* 确保有足够空间 */
+    }
+
+    /* SVG 斜线 */
+    .diagonal-line {
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        pointer-events: none;
+        /* 防止遮挡点击事件 */
+    }
+
+    /* 月份/日期文本样式 */
+    .header-month,
+    .header-date {
+        position: absolute;
+        font-size: 12px;
+        line-height: 1;
+        z-index: 1;
+    }
+
+    /* 右上角月份 */
+    .header-month {
+        top: 10%;
+        right: 10%;
+        text-align: right;
+    }
+
+    /* 左下角日期 */
+    .header-date {
+        bottom: 10%;
+        left: 10%;
+        text-align: left;
+    }
+
+    /* 表头单元格高度调整 */
+    ::v-deep .el-table__header th {
+        padding: 0;
+        height: 60px;
+        /* 增加高度保证斜线效果 */
+    }
+
+    ::v-deep .el-table__header th.el-table__cell>.cell {
+        padding: 0 !important;
+    }
+
+    /* 隐藏子列的表头行 */
+    .merge-header :deep(.el-table__header tr:nth-child(2)) {
+        display: none;
+    }
+
+    /* 隐藏前31行的下边框 */
+    ::v-deep .el-table__body tr:nth-child(-n+30) td,
+    ::v-deep .el-table__body tr:nth-child(32) td,
+    ::v-deep .el-table__body tr:nth-child(33) td,
+    ::v-deep .el-table__body tr:nth-child(34) td,
+    ::v-deep .el-table__body tr:nth-child(35) td {
+        border-bottom: none !important;
+    }
+
+    ::v-deep .el-table__body tr:nth-child(32) td:nth-child(1) {
+        border-bottom: 1px solid #000 !important;
+    }
+</style>
\ No newline at end of file