|
|
|
|
@ -1,6 +1,6 @@ |
|
|
|
|
<template> |
|
|
|
|
<div class="container"> |
|
|
|
|
<div class="title">河南机电学院比赛综合报告</div> |
|
|
|
|
<div class="title">河南机电学院比赛综合报告<div style="margin-left: 10px;cursor: pointer;"><SvgIcon name="log" @click="log"/></div></div> |
|
|
|
|
<p class="description" |
|
|
|
|
>我是比赛综述:全面落实立德树人根本任务，依据CDI0工程教育理念，培养德、智、体、美、劳全面发展，掌握软件工程专业所需的数学与自然科学基础知识、专业基础理论知识;在企业级软件开发和工业智能软件开发方向，能承担软件分析、设计、开发、项目管理等任务，具备解决复杂工程问题的能力;具有终身学习和创新创业意识、国际交流能力、团队合作精神等良好案养，能适应产业与社会变革的国阿化应用型人才。<br />本专业毕业生经过五年左右的实际工作，能够达到以下目标:</p |
|
|
|
|
> |
|
|
|
|
@ -58,29 +58,40 @@ |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<cardTitle title="比赛学生参赛情况分析" /> |
|
|
|
|
<p class="description" |
|
|
|
|
>我是比赛综述:全面落实立德树人根本任务，依据CDI0工程教育理念，培养德、智、体、美、劳全面发展，掌握软件工程专业所需的数学与自然科学基础知识、专业基础理论知识;在企业级软件开发和工业智能软件开发方向，能承担软件分析、设计、开发、项目管理等任务，具备解决复杂工程问题的能力;具有终身学习和创新创业意识、国际交流能力、团队合作精神等良好案养，能适应产业与社会变革的国阿化应用型人才。<br />本专业毕业生经过五年左右的实际工作，能够达到以下目标:</p |
|
|
|
|
> |
|
|
|
|
<div class="participation-status-content"> |
|
|
|
|
<div class="right border-000"> |
|
|
|
|
<cardList2 /> |
|
|
|
|
|
|
|
|
|
<div class="participation-status-content-edit"> |
|
|
|
|
<div class="edit-box"> |
|
|
|
|
<div class="right"> |
|
|
|
|
<p class="description tetx-style" |
|
|
|
|
>我是比赛综述:全面落实立德树人根本任务，依据CDI0工程教育理念，培养德、智、体、美、劳全面发展，掌握软件工程专业所需的数学与自然科学基础知识、专业基础理论知识;在企业级软件开发和工业智能软件开发方向，能承担软件分析、设计、开发、项目管理等任务，具备解决复杂工程问题的能力;具有终身学习和创新创业意识、国际交流能力、团队合作精神等良好案养，能适应产业与社会变革的国阿化应用型人才。<br />本专业毕业生经过五年左右的实际工作，能够达到以下目标:</p |
|
|
|
|
> |
|
|
|
|
</div> |
|
|
|
|
<div class="left border-000"> |
|
|
|
|
<!-- <div class="border-title">年度维度分析</div> --> |
|
|
|
|
|
|
|
|
|
<cakeChart /> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="left border-000"> |
|
|
|
|
<!-- <div class="border-title">年度维度分析</div> --> |
|
|
|
|
<cakeChart /> |
|
|
|
|
<div class="footer-edit border-000"> |
|
|
|
|
<cardList2 /> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<cardTitle title="比赛学生获奖情况分析" /> |
|
|
|
|
<p class="description" |
|
|
|
|
>我是比赛综述:全面落实立德树人根本任务，依据CDI0工程教育理念，培养德、智、体、美、劳全面发展，掌握软件工程专业所需的数学与自然科学基础知识、专业基础理论知识;在企业级软件开发和工业智能软件开发方向，能承担软件分析、设计、开发、项目管理等任务，具备解决复杂工程问题的能力;具有终身学习和创新创业意识、国际交流能力、团队合作精神等良好案养，能适应产业与社会变革的国阿化应用型人才。<br />本专业毕业生经过五年左右的实际工作，能够达到以下目标:</p |
|
|
|
|
> |
|
|
|
|
<div class="participation-status-content"> |
|
|
|
|
<div class="right border-000"> |
|
|
|
|
<cardList3 /> |
|
|
|
|
|
|
|
|
|
<div class="participation-status-content-edit"> |
|
|
|
|
<div class="edit-box"> |
|
|
|
|
<div class="right"> |
|
|
|
|
<p class="description tetx-style" |
|
|
|
|
>我是比赛综述:全面落实立德树人根本任务，依据CDI0工程教育理念，培养德、智、体、美、劳全面发展，掌握软件工程专业所需的数学与自然科学基础知识、专业基础理论知识;在企业级软件开发和工业智能软件开发方向，能承担软件分析、设计、开发、项目管理等任务，具备解决复杂工程问题的能力;具有终身学习和创新创业意识、国际交流能力、团队合作精神等良好案养，能适应产业与社会变革的国阿化应用型人才。<br />本专业毕业生经过五年左右的实际工作，能够达到以下目标:</p |
|
|
|
|
> |
|
|
|
|
</div> |
|
|
|
|
<div class="left border-000"> |
|
|
|
|
<!-- <div class="border-title">年度维度分析</div> --> |
|
|
|
|
<ringChart /> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="left border-000"> |
|
|
|
|
<!-- <div class="border-title">年度维度分析</div> --> |
|
|
|
|
<ringChart /> |
|
|
|
|
<div class="footer-edit border-000"> |
|
|
|
|
<cardList3 /> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<cardTitle title="部门参赛情况分析" /> |
|
|
|
|
@ -110,12 +121,14 @@ |
|
|
|
|
import cardList4 from './components/cardList4.vue'; |
|
|
|
|
import cardList5 from './components/cardList5.vue'; |
|
|
|
|
import cardList6 from './components/cardList6.vue'; |
|
|
|
|
import { SvgIcon } from '/@/components/Icon'; |
|
|
|
|
|
|
|
|
|
import randerChart from './components/randerChart.vue'; |
|
|
|
|
import cakeChart from './components/cakeChart.vue'; |
|
|
|
|
import ringChart from './components/ringChart.vue'; |
|
|
|
|
import pillarChart from './components/pillarChart.vue'; |
|
|
|
|
import { ref } from 'vue'; |
|
|
|
|
import { ref, onMounted, nextTick } from 'vue'; |
|
|
|
|
import { jsPDF } from 'jspdf'; |
|
|
|
|
const activeKey = ref('1'); |
|
|
|
|
var indicator = [ |
|
|
|
|
{ |
|
|
|
|
@ -167,24 +180,89 @@ |
|
|
|
|
max: 5000, |
|
|
|
|
}, |
|
|
|
|
]; |
|
|
|
|
const log = async () => { |
|
|
|
|
nextTick(async () => { |
|
|
|
|
await clickDom(); |
|
|
|
|
// return |
|
|
|
|
var canvas = document.createElement('canvas'); |
|
|
|
|
var w = parseInt(document.querySelector('.container').clientWidth); |
|
|
|
|
var h = parseInt(document.querySelector('.container').clientHeight); |
|
|
|
|
console.log(w, h); |
|
|
|
|
|
|
|
|
|
canvas.width = w; |
|
|
|
|
canvas.height = h; |
|
|
|
|
canvas.style.width = w + 'px'; |
|
|
|
|
canvas.style.height = h + 'px'; |
|
|
|
|
canvas.style.background = '#ffffff'; |
|
|
|
|
html2canvas(document.querySelector('.container'), { canvas: canvas, background: '#ffffff' }).then(function (canvas) { |
|
|
|
|
var contentWidth = canvas.width; |
|
|
|
|
var contentHeight = canvas.height; |
|
|
|
|
var position = 0; |
|
|
|
|
var imgWidth = 595.28; |
|
|
|
|
var imgHeight = (592.28 / contentWidth) * contentHeight; |
|
|
|
|
var pageData = canvas.toDataURL('image/jpeg', 1.0); |
|
|
|
|
var pdf = new jsPDF('', 'pt', 'a4'); |
|
|
|
|
var pageHeight = (contentWidth / 592.28) * 841.89; |
|
|
|
|
var leftHeight = contentHeight; |
|
|
|
|
var pdf = new jsPDF('', 'pt', 'a4'); |
|
|
|
|
while (leftHeight > 0) { |
|
|
|
|
pdf.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight); |
|
|
|
|
leftHeight -= pageHeight; |
|
|
|
|
position -= 840; |
|
|
|
|
if (leftHeight > 0 && imgHeight > 841.89) { |
|
|
|
|
pdf.addPage(); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
pdf.save('综合报告.pdf'); |
|
|
|
|
}); |
|
|
|
|
}); |
|
|
|
|
}; |
|
|
|
|
onMounted(async () => { |
|
|
|
|
console.log(Array.from(document.querySelectorAll('.log-btn'))); |
|
|
|
|
// Array.from(document.querySelectorAll('.log-btn'))[0].click() |
|
|
|
|
// Array.from(document.querySelectorAll('.log-btn'))[1].click() |
|
|
|
|
// clickDom() |
|
|
|
|
}); |
|
|
|
|
const clickDom = () => { |
|
|
|
|
return new Promise((res: any, rej: any) => { |
|
|
|
|
try { |
|
|
|
|
const dom = Array.from(document.querySelectorAll('.log-btn')); |
|
|
|
|
dom.forEach((item: any) => { |
|
|
|
|
item.click(); |
|
|
|
|
}); |
|
|
|
|
setTimeout(() => { |
|
|
|
|
res(true); |
|
|
|
|
}, 2000); |
|
|
|
|
} catch (error) { |
|
|
|
|
rej(); |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
}; |
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<style lang="less" scoped> |
|
|
|
|
.container { |
|
|
|
|
width: 1200px; |
|
|
|
|
width: 1240px; |
|
|
|
|
margin: 0 auto; |
|
|
|
|
// height: 100vh; |
|
|
|
|
padding: 0 20px; |
|
|
|
|
padding-bottom: 30px; |
|
|
|
|
.title { |
|
|
|
|
width: 100%; |
|
|
|
|
font-size: 36px; |
|
|
|
|
text-align: center; |
|
|
|
|
font-weight: 700; |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
justify-content: center; |
|
|
|
|
} |
|
|
|
|
.description { |
|
|
|
|
text-indent: 2em; |
|
|
|
|
margin: 30px 0; |
|
|
|
|
} |
|
|
|
|
.tetx-style { |
|
|
|
|
font-size: 24px; |
|
|
|
|
} |
|
|
|
|
.card-content { |
|
|
|
|
display: flex; |
|
|
|
|
.item { |
|
|
|
|
@ -258,7 +336,7 @@ |
|
|
|
|
align-items: center; |
|
|
|
|
.content-left, |
|
|
|
|
.content-right { |
|
|
|
|
padding-left: 40px; |
|
|
|
|
padding-left: 40px; |
|
|
|
|
width: 100%; |
|
|
|
|
.item { |
|
|
|
|
display: flex; |
|
|
|
|
@ -300,6 +378,31 @@ |
|
|
|
|
height: auto; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.participation-status-content-edit { |
|
|
|
|
width: 100%; |
|
|
|
|
height: auto; |
|
|
|
|
|
|
|
|
|
.edit-box { |
|
|
|
|
width: 100%; |
|
|
|
|
height: 100%; |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
} |
|
|
|
|
.left { |
|
|
|
|
width: 500px; |
|
|
|
|
height: 500px; |
|
|
|
|
margin-left: 50px; |
|
|
|
|
} |
|
|
|
|
.right { |
|
|
|
|
flex: 1; |
|
|
|
|
height: auto; |
|
|
|
|
} |
|
|
|
|
.footer-edit { |
|
|
|
|
margin-top: 30px; |
|
|
|
|
width: 100%; |
|
|
|
|
height: 100%; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.footer { |
|
|
|
|
width: 100%; |
|
|
|
|
margin: 30px 0; |
|
|
|
|
@ -315,5 +418,6 @@ |
|
|
|
|
line-height: 50px; |
|
|
|
|
font-size: 14px; |
|
|
|
|
padding: 0 20px; |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
</style> |
|
|
|
|
|
