update code

main
lijun 2024-09-18 21:13:30 +08:00
parent 8edf6d6bb4
commit 67c57cc17e
1 changed files with 27 additions and 16 deletions

View File

@ -1,5 +1,5 @@
<template> <template>
<div class="app-container simulation-report-desc"> <div class="app-container simulation-report-desc" v-loading="loading">
<div style="background-color: #fff;padding:20px;margin-bottom: 60px;" id="print_simulation_report_desc"> <div style="background-color: #fff;padding:20px;margin-bottom: 60px;" id="print_simulation_report_desc">
<div class="report-name">{{ info.report.report_name }}</div> <div class="report-name">{{ info.report.report_name }}</div>
<div class="report-info"> <div class="report-info">
@ -60,12 +60,13 @@
</el-table> </el-table>
<div class="print-page"></div> <div class="print-page"></div>
<el-row class="report-chart1" style="margin-top:20px;" :key="info.elPrint" :style="info.isPrint?'width:18cm;':''"> <el-row class="report-chart1" style="margin-top:20px;" :key="info.elPrint" :style="info.isPrint?'width:18cm;':''">
<el-col :span="info.isPrint ? 24 : 12"> <el-col :span="info.isPrint || it.classes.length>20 ? 24 : 12">
<charts :id="'reportChart1-' + idx" width="100%" height="400px" <charts :id="'reportChart1-' + idx" width="100%" :height="calcChartHeight(it)"
:render="opt => renderChart1(it, 'roc')"></charts> :render="opt => renderChart1(it, 'roc')"></charts>
</el-col> </el-col>
<el-col :span="info.isPrint ? 24 : 12"> <div :class=" info.isPrint && it.classes.length>20?'print-page':''"></div>
<charts :id="'reportChart2-' + idx" width="100%" height="400px" <el-col :span="info.isPrint || it.classes.length>20 ? 24 : 12">
<charts :id="'reportChart2-' + idx" width="100%" :height="calcChartHeight(it)"
:render="opt => renderChart1(it, 'rp')"></charts> :render="opt => renderChart1(it, 'rp')"></charts>
</el-col> </el-col>
</el-row> </el-row>
@ -133,6 +134,14 @@ const info = reactive({
isPrint: false, isPrint: false,
elPrint: 0, elPrint: 0,
}) })
const loading=ref(false)
const calcChartHeight=it=>{
let tmp=it.classes.length<=20?'400px':((it.classes.length/10-2)*40+400+'px');
if(info.isPrint){
tmp=it.classes.length<=20?'400px':((it.classes.length/5-2)*30+400+'px');
}
return tmp;
}
const doExport = async () => { const doExport = async () => {
try { try {
let dom = document.querySelector("#print_simulation_report_desc"); let dom = document.querySelector("#print_simulation_report_desc");
@ -157,12 +166,16 @@ function doPrint() {
document.querySelector("html").classList.add("report-print"); document.querySelector("html").classList.add("report-print");
info.isPrint = true; info.isPrint = true;
info.elPrint++; info.elPrint++;
loading.value=true;
setTimeout(() => {
loading.value=false;
setTimeout(()=>{ setTimeout(()=>{
window.print(); window.print();
document.querySelector("html").classList.remove("report-print"); document.querySelector("html").classList.remove("report-print");
info.isPrint = false; info.isPrint = false;
info.elPrint++; info.elPrint++;
}, 800); },100);
}, 2000);
} }
const doDelete = () => { const doDelete = () => {
@ -186,12 +199,13 @@ const doDelete = () => {
function renderChart1(data, type) { function renderChart1(data, type) {
let chartInfo = data.chartsInfo let chartInfo = data.chartsInfo
let gridTop=info.isPrint?20*(data.classes.length/5):20*(data.classes.length/10);
let opt = { let opt = {
legend: { legend: {
left: '10%', right: '10%', left: '10%', right: '20%',
data: chartInfo.names data: chartInfo.names
}, },
grid: { top: '25%', }, grid: { top: gridTop, },
xAxis: [{ xAxis: [{
type: 'category', // type type: 'category', // type
data: ['0.0', '0.1', '0.2', '0.3', '0.4', '0.5', '0.6', '0.7', "0.8", "0.9", "1.0"], // x data: ['0.0', '0.1', '0.2', '0.3', '0.4', '0.5', '0.6', '0.7', "0.8", "0.9", "1.0"], // x
@ -223,9 +237,6 @@ function initTaskChart(it) {
let names = []; let names = [];
let classes = it.classes || []; let classes = it.classes || [];
classes.forEach(d => { classes.forEach(d => {
if (rocs.length > 20) {
return;
}
rocs.push({ rocs.push({
name: d.class_name, data: d.roc, type: 'line' name: d.class_name, data: d.roc, type: 'line'
}); });