销售汇总表合并样式和单元格样式 隐藏搜索导出等按钮

This commit is contained in:
mll
2026-04-27 21:56:22 +08:00
parent 7b162944e4
commit 8a3d5bf562

View File

@@ -14,7 +14,9 @@
v-bind="crudBind" v-bind="crudBind"
:summary-method=summaryMethod1 :summary-method=summaryMethod1
:row-style="rowStyleMethod" :row-style="rowStyleMethod"
:span-method="reportCode=='zhxs-hz'? spanMethod:null"
:cell-class-name="cellClassNameMethod" :cell-class-name="cellClassNameMethod"
:header-cell-class-name="headerCellClassNameMethod"
@search-change="searchChange" @search-change="searchChange"
@search-reset="resetChange" @search-reset="resetChange"
@refresh-change="refreshChange" @refresh-change="refreshChange"
@@ -306,6 +308,65 @@ const openSaleDetail=(row)=>{
getSaleInfo(row) getSaleInfo(row)
} }
// 第一列纵向合并的标记数组
const rowMergeArr = ref([])
// 预处理计算第一列相邻bk相同的纵向合并规则
const initMerge = () => {
const list = tableData.value
const len = list.length
rowMergeArr.value = new Array(len).fill(1)
// 遍历所有行统计相邻bk相同的行数
let count = 1
for (let i = 1; i < len; i++) {
if (list[i].bk === list[i - 1].bk) {
// 相同bk当前行标记为0隐藏累加计数
count++
rowMergeArr.value[i] = 0
} else {
// 不同bk把之前的计数赋值给组内第一行
rowMergeArr.value[i - count] = count
count = 1
}
}
// 处理最后一组数据
rowMergeArr.value[len - count] = count
}
// Avue 核心合并方法
const spanMethod = ({ row, rowIndex, columnIndex }) => {
// ======================================
// 规则1同一行 bk 和 zone_name 相同 → 横向合并前两列
// ======================================
const isSameRowField = row.bk === row.zone_name
if (isSameRowField) {
// 第一列跨2列合并
if (columnIndex === 0) {
return { rowspan: 1, colspan: 2 }
}
// 第二列:隐藏当前单元格
if (columnIndex === 1) {
return { rowspan: 1, colspan: 0 }
}
}
// ======================================
// 规则2第一列相邻bk相同 → 纵向合并行
// ======================================
if (columnIndex === 0) {
return {
rowspan: rowMergeArr.value[rowIndex],
colspan: 1
}
}
// ======================================
// 其他列:完全不合并,保持原样!
// ======================================
return { rowspan: 1, colspan: 1 }
}
const refreshSaleChange=()=>{ const refreshSaleChange=()=>{
getSaleInfo() getSaleInfo()
} }
@@ -433,10 +494,19 @@ const summaryMethod1=({columns,data})=>{
} }
const cellClassNameMethod=({row,column,rowIndex,columnIndex})=>{ const cellClassNameMethod=({row,column,rowIndex,columnIndex})=>{
// if(textAlignFiels.value[column.property]){ if(props.reportCode=='zhxs-hz'){
// return 'textAlignCell' 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})=>{
if(props.reportCode=='zhxs-hz'){
return 'color-90B3E2'
}
}
function getCurrentDate() { function getCurrentDate() {
const now = new Date(); const now = new Date();
// 补零函数小于10则前面加0 // 补零函数小于10则前面加0
@@ -481,6 +551,8 @@ const initTable = async () => {
// stripe: reportVo.tableConfig.includes('stripe'), // stripe: reportVo.tableConfig.includes('stripe'),
showSummary:false, showSummary:false,
stripe:true, stripe:true,
searchShow:props.reportCode=='zhxs-hz'?false:true,
searchShowBtn:props.reportCode=='zhxs-hz'?false:true,
searchBtnText:'查询', searchBtnText:'查询',
column: {} column: {}
} }
@@ -1014,6 +1086,9 @@ const getTableData = async (isLoading = true) => {
}) })
}) })
resolve(data.records) resolve(data.records)
if(props.reportCode=='zhxs-hz'){
initMerge()
}
} finally { } finally {
if (isLoading) loading.value = false if (isLoading) loading.value = false
@@ -1173,7 +1248,18 @@ defineExpose({
&.el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell{ &.el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell{
background-color: #FFFFD2; background-color: #FFFFD2;
} }
.color-B9DEE8{
background-color: #B9DEE8 !important;
font-weight: bold !important;
}
.color-90B3E2{
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{ td.el-table__cell,th.el-table__cell{
border-right: 1px solid #000 !important; border-right: 1px solid #000 !important;
border-bottom: 1px solid #000 !important; border-bottom: 1px solid #000 !important;