update code
parent
8edf6d6bb4
commit
67c57cc17e
|
@ -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'
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in New Issue