调整统计界面布局颜色

This commit is contained in:
tangw 2026-09-16 18:12:35 +08:00
commit 409d625a95

View File

@ -8,8 +8,8 @@
<div class="unified-panel">
<div class="btn-bar">
<el-button type="primary" icon="Search" @click="search">查询</el-button>
<el-button type="warning" icon="Printer" plain @click="print">打印</el-button>
<el-button type="primary" icon="Download" plain @click="exportHandle">导出Excel</el-button>
<el-button type="warning" icon="Printer" plain :loading="printLoading" @click="print">打印</el-button>
<el-button type="primary" icon="Download" plain :loading="exportLoading" @click="exportHandle">导出Excel</el-button>
</div>
<div class="divider-h"></div>
@ -138,7 +138,6 @@ const userStore = useUserStore()
const mbStore = useCommonStore();
const route = useRoute();
const openDetail = ref(false)
const mxtableData = ref([])
const queryParams = ref({
@ -154,7 +153,8 @@ const checkBoxs = ref([])
const originalColumn = ref([]) //原始列
const tableColumns = ref([]);
const Template = ref({})
const exportLoading = ref(false)
const printLoading = ref(false)
const instrGroupOptions = ref([])
const instrGroupFields = ref([
@ -194,13 +194,11 @@ const getSummaries = ({ columns, data }) => {
// return '合计';
// } else
if (isSumColumn) {
// 对合计列求和(处理空值/非数字)
const sum = data.reduce((total, row) => {
const value = Number(row[colField] || 0);
return total + (isNaN(value) ? 0 : value);
const value = Number(row[colField] ?? 0);
return total + (Number.isNaN(value) ? 0 : value);
}, 0);
return sum;
return Math.round(sum * 100) / 100;
} else {
// 非合计列显示空
return '';
@ -257,6 +255,8 @@ const handleCheckBoxChange = (val) => {
// 列双击
const cellDblclickEvent = ({ row }) => {
console.log("🚀 ~ cellDblclickEvent ~ row:", row)
// if(row.paramZct == '1'){
// }
openDetail.value = true
mxtableData.value = []
}
@ -277,7 +277,9 @@ const search = () => {
};
loading.value = true;
getstatsQuery(data).then(res => {
tableData.value = res.data
if (res.code == 0) {
tableData.value = res.data || []
}
}).finally(() => {
loading.value = false;
})
@ -298,7 +300,6 @@ const getPrintFooterText = (col, idx) => {
// 打印
const print = () => {
// 不直接改 originalColumn,拷贝一份,避免影响导出等其他功能
const printColumns = originalColumn.value.map(item => {
const matchTabCol = tableColumns.value.find(col => col.prop === item.paramCode)
return { ...item, paramSequence: matchTabCol ? matchTabCol.paramSequence : 0 }
@ -309,50 +310,11 @@ const print = () => {
Column: printColumns,
Template: Template.value
}
printLoading.value = true
printTemplate(data).then(res => {
// 后端错误 JSON 判断,避免静默失败
if (res instanceof Blob && res.type.includes('application/json')) {
const reader = new FileReader()
reader.onload = e => {
const err = JSON.parse(e.target.result)
ElMessage.error(err.msg || '打印失败')
}
reader.readAsText(res)
return
}
const blob = new Blob([res], { type: 'application/pdf' })
const pdfUrl = URL.createObjectURL(blob)
// 不要 display:none,Chrome 对隐藏 iframe 的 PDF 打印有兼容问题;移出屏幕即可
const iframe = document.createElement('iframe')
iframe.style.position = 'fixed'
iframe.style.right = '0'
iframe.style.bottom = '0'
iframe.style.width = '0'
iframe.style.height = '0'
iframe.style.border = '0'
iframe.src = pdfUrl
document.body.appendChild(iframe)
iframe.onload = () => {
// 等 PDF 渲染完再打印,避免空白页
setTimeout(() => {
const win = iframe.contentWindow
if (win) {
win.focus()
win.print() // Chrome/Firefox 阻塞到打印对话框关闭
}
// print() 阻塞时,这里在对话框关闭后才执行;留 2s 缓冲再清理
setTimeout(() => {
URL.revokeObjectURL(pdfUrl)
iframe.remove()
}, 2000)
}, 300)
}
}).catch(() => {
ElMessage.error('打印失败')
classCom.printBlobPDF(res)
}).finally(() => {
printLoading.value = false
})
}
@ -371,18 +333,13 @@ const exportHandle = () => {
Column: originalColumn.value,
Template: Template.value
};
exportLoading.value = true;
exportTemplate(data).then(res => {
//classCom.printBase64PDF(res.data, 'excel', '统计报表')
// 若依拦截器对 blob 直接透传,res 就是 Blob
const blob = new Blob([res], {
type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
})
const link = document.createElement('a')
link.href = URL.createObjectURL(blob)
link.download = '导出_' + new Date().getTime() + '.xlsx'
link.click()
URL.revokeObjectURL(link.href) // 释放内存
classCom.exportFile(res, statsTitle.value)
}).finally(() => {
exportLoading.value = false;
})
}
const xmList = ref([])