|
@@ -1,17 +1,18 @@
|
|
|
<template>
|
|
|
- <div class="pbl" style="position: relative">
|
|
|
- <div class="AiBtn" v-if="isDown">
|
|
|
- <div style="display: flex;">
|
|
|
- <el-button type="primary" size="small" @click="getAiAnalysisCon2"
|
|
|
- >AI分析</el-button
|
|
|
- >
|
|
|
- <el-button type="primary" @click="getPdf" size="small"
|
|
|
- >导出报告</el-button
|
|
|
- >
|
|
|
+ <div
|
|
|
+ class="pbl">
|
|
|
+ <div class="pdfCon" ref="reportPdf" v-loading="loading">
|
|
|
+ <div class="AiBtn" v-if="isDown">
|
|
|
+ <div style="display: flex;">
|
|
|
+ <el-button type="primary" size="small" @click="getAiAnalysisCon2"
|
|
|
+ >AI分析</el-button
|
|
|
+ >
|
|
|
+ <el-button type="primary" @click="isGetPdf" size="small"
|
|
|
+ >导出报告</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div style="margin-top: 15px;">最后一次分析:{{ cTime }}</div>
|
|
|
</div>
|
|
|
- <div style="margin-top: 15px;">最后一次分析:{{ cTime }}</div>
|
|
|
- </div>
|
|
|
- <div ref="reportPdf" v-loading="loading">
|
|
|
<!-- 封面 -->
|
|
|
<div
|
|
|
class="coverPage"
|
|
@@ -113,7 +114,7 @@
|
|
|
</div>
|
|
|
|
|
|
<div
|
|
|
- style="display: flex;justify-content: space-between; height: 275px;margin-bottom: 40px"
|
|
|
+ style="display: flex;justify-content: space-between; height: 200px;margin-bottom: 40px"
|
|
|
>
|
|
|
<div style="width: 49%;height: 100%;">
|
|
|
<div
|
|
@@ -187,7 +188,7 @@
|
|
|
>
|
|
|
工具使用情况
|
|
|
</div>
|
|
|
- <div ref="ringChart" style="height: 270px; width: 100%"></div>
|
|
|
+ <div ref="ringChart" style="height: 200px; width: 100%"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
@@ -345,7 +346,7 @@
|
|
|
<li>素养发展情况</li>
|
|
|
</div>
|
|
|
<div class="suy">素养发展雷达图</div>
|
|
|
- <div style="width: 100%; background-color: #fff;border-radius: 10px;">
|
|
|
+ <div style="width: 100%; background-color: #fff;border-radius: 10px;border: 1px solid #ccc;">
|
|
|
<div
|
|
|
ref="moreChart"
|
|
|
style="width: 85%;margin: auto; height: 400px"
|
|
@@ -355,7 +356,7 @@
|
|
|
<div class="suy">素养发展总览</div>
|
|
|
<div
|
|
|
v-if="treeData"
|
|
|
- style=" width: 100%;background-color: #fff;border-radius: 10px;"
|
|
|
+ style=" width: 100%;background-color: #fff;border-radius: 10px;border: 1px solid #ccc;"
|
|
|
>
|
|
|
<exjsmind :treeData="treeData"> </exjsmind>
|
|
|
</div>
|
|
@@ -413,7 +414,7 @@
|
|
|
<div
|
|
|
v-for="k in i.taskList"
|
|
|
:key="k.task + 'a'"
|
|
|
- style="margin-bottom: 15px"
|
|
|
+ class="taskCon"
|
|
|
v-if="isTask(k.toolEList)"
|
|
|
>
|
|
|
<div
|
|
@@ -835,7 +836,7 @@
|
|
|
<div class="taskScoCon">
|
|
|
<!-- 分数详情与素养 -->
|
|
|
<div style="flex: 1; display: flex; flex-wrap: wrap">
|
|
|
- <div style="width: 322px; margin:0 20px 10px 0">
|
|
|
+ <div style="width: 410px; margin:0 20px 10px 0">
|
|
|
<div class="taskScoConTit">分数详情</div>
|
|
|
<div
|
|
|
v-for="(wItem, ind) in l.eList"
|
|
@@ -1446,7 +1447,7 @@ export default {
|
|
|
children: [
|
|
|
{
|
|
|
id: kind + "+" + elind + "+" + stind + "b",
|
|
|
- topic: `工具${elind}`
|
|
|
+ topic: `工具${elind*1 + 1}`
|
|
|
}
|
|
|
]
|
|
|
});
|
|
@@ -1455,7 +1456,7 @@ export default {
|
|
|
if (lc.topic == st.detail) {
|
|
|
lc.children.push({
|
|
|
id: kind + "+" + elind + "+" + stind + "b",
|
|
|
- topic: `工具${elind}`
|
|
|
+ topic: `工具${elind*1 + 1}`
|
|
|
});
|
|
|
}
|
|
|
});
|
|
@@ -1819,7 +1820,7 @@ export default {
|
|
|
this.AiAnalysisCon2 = JSON.parse(Asd);
|
|
|
}
|
|
|
this.loading = false;
|
|
|
-
|
|
|
+ this.isDown = false;
|
|
|
setTimeout(() => {
|
|
|
this.getPdf();
|
|
|
}, 500);
|
|
@@ -1827,11 +1828,27 @@ export default {
|
|
|
this.circulatePdf();
|
|
|
}
|
|
|
},
|
|
|
+ isGetPdf(){
|
|
|
+ this.$confirm("确定导出本次学生报告吗?", "提示", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning",
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ this.isDown = false;
|
|
|
+ setTimeout(() => {
|
|
|
+ this.getPdf()
|
|
|
+ }, 500);
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+
|
|
|
+ });
|
|
|
+ },
|
|
|
// 下载pdf文件
|
|
|
async getPdf() {
|
|
|
- this.isDown = false;
|
|
|
-
|
|
|
const content = this.$refs.reportPdf;
|
|
|
+ console.log('content',content.offsetHeight);
|
|
|
+
|
|
|
|
|
|
html2canvas(content)
|
|
|
.then(canvas => {
|
|
@@ -4324,11 +4341,18 @@ export default {
|
|
|
height: 100%;
|
|
|
box-sizing: border-box;
|
|
|
margin: auto;
|
|
|
+ background-color: #F3F7FD;
|
|
|
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
|
|
/* padding: 20px; */
|
|
|
/* padding-top: 10px; */
|
|
|
overflow: auto;
|
|
|
border-radius: 10px;
|
|
|
+ position: relative
|
|
|
+}
|
|
|
+.pdfCon {
|
|
|
+ width: 810pt;
|
|
|
+ margin: auto;
|
|
|
+ position: relative;
|
|
|
}
|
|
|
.pageTit {
|
|
|
width: 100%;
|
|
@@ -4363,7 +4387,7 @@ export default {
|
|
|
}
|
|
|
.coverPage {
|
|
|
/* height: 840pt; */
|
|
|
- padding: 185px 15% 0;
|
|
|
+ padding: 185px 8% 0;
|
|
|
background-color: #ccc;
|
|
|
position: relative;
|
|
|
background-image: url("../../../assets/icon/exportPdfworks/bcg1.svg"),
|
|
@@ -4412,9 +4436,9 @@ export default {
|
|
|
border-radius: 16px;
|
|
|
background-color: #fff;
|
|
|
padding: 40px 32px;
|
|
|
- width: 75%;
|
|
|
+ width: 77%;
|
|
|
font-family: PingFang SC;
|
|
|
- margin: 40px 0 8px;
|
|
|
+ margin: 8px 0;
|
|
|
color: rgba(35, 99, 205, 1);
|
|
|
}
|
|
|
.fromCss > div {
|
|
@@ -4568,7 +4592,7 @@ export default {
|
|
|
line-height: 25px;
|
|
|
}
|
|
|
.termC {
|
|
|
- margin: 40px auto 10px;
|
|
|
+ margin: 30px auto 45px;
|
|
|
font-size: 18px;
|
|
|
color: rgba(92, 80, 70, 1);
|
|
|
display: flex;
|
|
@@ -4839,6 +4863,8 @@ export default {
|
|
|
color: rgba(0, 0, 0, 0.6);
|
|
|
font-weight: 400;
|
|
|
line-height: 30px;
|
|
|
+ padding: 0 10px;
|
|
|
+
|
|
|
}
|
|
|
.taskSco {
|
|
|
background-color: rgba(253, 247, 243, 1);
|
|
@@ -4915,8 +4941,8 @@ export default {
|
|
|
text-overflow: ellipsis;
|
|
|
}
|
|
|
.termC {
|
|
|
- margin: 15px auto 10px;
|
|
|
- font-size: 18px;
|
|
|
+ margin: 30px auto;
|
|
|
+ font-size: 22px;
|
|
|
color: rgba(92, 80, 70, 1);
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
@@ -4928,4 +4954,11 @@ export default {
|
|
|
padding: 3px 10px;
|
|
|
margin: 0 8px;
|
|
|
}
|
|
|
+.taskCon{
|
|
|
+ margin-bottom: 15px;
|
|
|
+ background-color: #fff;
|
|
|
+ padding: 20px;
|
|
|
+ border: 1px solid #ccc;
|
|
|
+ border-radius: 15px;
|
|
|
+}
|
|
|
</style>
|