销售汇总表合计行固定在底部 板块列内容竖排 第二列相同内容合并

src/components/LowDesign/src/LowReport/index.vue

@@ -310,15 +310,17 @@ const openSaleDetail=(row)=>{
 
 // 第一列纵向合并的标记数组
 const rowMergeArr = ref([])
+const rowMergeArr1 = ref([])
 
 // 预处理：计算第一列相邻bk相同的纵向合并规则
 const initMerge = () => {
   const list = tableData.value
   const len = list.length
   rowMergeArr.value = new Array(len).fill(1)
-
+  rowMergeArr1.value = new Array(len).fill(1)
   // 遍历所有行，统计相邻bk相同的行数
-  let count = 1
+  let count = 1,count1=1
+  
   for (let i = 1; i < len; i++) {
     if (list[i].bk === list[i - 1].bk) {
       // 相同bk，当前行标记为0（隐藏），累加计数
@@ -329,9 +331,19 @@ const initMerge = () => {
       rowMergeArr.value[i - count] = count
       count = 1
     }
+    if (list[i].zone_name === list[i - 1].zone_name) {
+      // 相同bk，当前行标记为0（隐藏），累加计数
+      count1++
+      rowMergeArr1.value[i] = 0
+    } else {
+      // 不同bk，把之前的计数赋值给组内第一行
+      rowMergeArr1.value[i - count1] = count1
+      count1 = 1
+    }
   }
   // 处理最后一组数据
   rowMergeArr.value[len - count] = count
+  rowMergeArr1.value[len - count1] = count1
 }
 
 // Avue 核心合并方法
@@ -360,6 +372,11 @@ const spanMethod = ({ row, rowIndex, columnIndex }) => {
       rowspan: rowMergeArr.value[rowIndex],
       colspan: 1
     }
+  }else if(columnIndex===1){
+    return {
+      rowspan: rowMergeArr1.value[rowIndex],
+      colspan: 1
+    }
   }
 
   // ======================================
@@ -440,7 +457,7 @@ watch(()=>tableHeightRef.value,()=>{
   if(tableHeightRef.value){
     setTimeout(()=>{
       observeHeightChange(document.querySelector('.avue-crud__search'))
-      if(tableOption.value.showSummary&&tableOption.value.index&&tableOption.value.selection){
+      if(tableOption.value.showSummary&&(tableOption.value.index&&tableOption.value.selection||props.reportCode==='zhxs-hz')){
         document.querySelector('tfoot tr td').colSpan="2"
         document.querySelectorAll('tfoot tr td')[1].style.display="none"
       }
@@ -497,7 +514,7 @@ const summaryMethod1=({columns,data})=>{
     if(props.reportCode=='zhxs-hz'){
       if(row.zone_name.includes('总计')&&row.zone_name!=='总计')  return 'color-B9DEE8'
       else if((row.zone_name.includes('合计')&&row.bk!=='合计')||row.zone_name=='其他收入'||(columnIndex==0&&row.zone_name!=='总计')) return 'color-90B3E2'
-      else if(row.bk=='总计'&&row.zone_name=='总计') return 'color-548CD6'
+    
     }
   }
   const headerCellClassNameMethod=({row,column,rowIndex,columnIndex})=>{
@@ -623,6 +640,9 @@ const initTable = async () => {
         }
         defualtSearch.value[config.prop]=tableSearch.value[config.prop]
     }
+    if(props.reportCode=='zhxs-hz'&&item.fieldName=='板块'){
+      config.overHidden=false
+    }
    
     if(['年','年度','年份','月','月度','月份','年月'].includes(item.fieldName)&&config.search){
       config.searchSpan=3
@@ -1047,6 +1067,15 @@ const getTableData = async (isLoading = true) => {
           })
           tableData.value=tableData.value.filter(item=>item.customname!=='合计')
         }
+        if(props.reportCode==='zhxs-hz'&&tableData.value.filter(item=>item.bk=='总计').length){
+          value=tData.filter(item=>item.bk=='总计'&&item.zone_name=='总计')[0]
+          value.bk=''
+          value.zone_name=''
+          Object.keys(value).forEach(key=>{
+            value[key+'_s']=value[key]
+          })
+          tableData.value=tableData.value.filter(item=> item.bk!=='总计'&&item.zone_name!=='总计')
+        }
         keys.forEach(item=>{
           let key=amountFieds.value[item].prop
           key!=='fistField'?obj[key]=value[item]:''
@@ -1074,7 +1103,8 @@ const getTableData = async (isLoading = true) => {
         'PSI':['产品ID','货品ID','产品名称','产品规格','单位','每件数量'],
         'ZHXSQK':['标准品名','客户名称'],
         'kcqmltj':['产品名称','规格','商品名','通用名'],
-        'zd_customer':['客户名称','年月']
+        'zd_customer':['客户名称','年月'],
+        'zhxs-hz':['板块']
       }
       Object.keys(tableOption.value.column).forEach(key=>{
         const showCols=Object.values(tableOption.value.column).filter(item=>!item.hide)
@@ -1256,10 +1286,7 @@ defineExpose({
         background-color: #90B3E2 !important;
         font-weight: bold !important;
       }
-      .color-548CD6{
-        background-color: #548CD6 !important;
-         font-weight: bold !important;
-      }
+
       td.el-table__cell,th.el-table__cell{
         border-right: 1px solid #000 !important;
         border-bottom: 1px solid #000 !important;

src/styles/index.scss

@@ -159,5 +159,8 @@
   white-space: normal;
   word-break: break-all;
 }
+.low-reoprt.low-report__zhxs-hz .el-table__footer-wrapper tfoot td.el-table__cell{
+  background-color:#548CD6 !important;color:#fff !important;font-weight:bold !important;
+}
 
 @include scrollBar;