Skip to content

P
pica.cloud.web-education-admin
提交 aec25b02 编写于 作者: zhentian.jia's avatar zhentian.jia
浏览文件
操作

学习效果

上级 6c93a2c0
隐藏空白字符变更
内嵌 并排
正在显示 包含 109 行增加 和 111 行删除
src/views/learning/item-data-all.vue
浏览文件 @ aec25b02
...@@ -138,7 +138,7 @@ export default { ...@@ -138,7 +138,7 @@ export default {
return { return {
roleType: "L1", roleType: "L1",
projectId: "", projectId: "",
dataType: 1, dataType: 0,
tableType: "0", tableType: "0",
echartsData: { echartsData: {
chart0: {}, chart0: {},
...@@ -174,10 +174,12 @@ export default { ...@@ -174,10 +174,12 @@ export default {
vm.initCard(); vm.initCard();
if(vm.dataType == 0) { if(vm.dataType == 0) {
setTimeout(function() { setTimeout(function() {
// vm.$nextTick(() => {
vm.setDistributeChart(); vm.setDistributeChart();
vm.setRecordChart(); vm.setRecordChart();
vm.setDurationChart(); vm.setDurationChart();
vm.setCertificateChart(); vm.setCertificateChart();
// });
}, 20); }, 20);
} else { } else {
vm.setTable(); vm.setTable();
...@@ -988,6 +990,7 @@ export default { ...@@ -988,6 +990,7 @@ export default {
.person-title { .person-title {
font-size:18px; font-size:18px;
font-weight:700; font-weight:700;
margin-bottom: 20px;
} }
.person-radio { .person-radio {
margin-top: 10px; margin-top: 10px;
......
src/views/learning/item-learning-effect.vue
浏览文件 @ aec25b02
<template> <template>
<div class="learning-effect"> <div class="learning-effect">
<div class="learning" ref="learning"></div>
<div class="education" ref="education"></div> <div class="education" ref="education"></div>
<div class="learning" ref="learning"></div>
</div> </div>
</template> </template>
<script> <script>
import { openLoading, closeLoading } from "../../utils/utils"; import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils"; import * as commonUtil from "../../utils/utils";
const echarts = require("echarts"); import echarts from "echarts";
let vm = null;
export default { export default {
data() { data() {
return {}; return {
echartsData: {
chart1: {},
chart2: {}
}
};
},
created() {
vm = this;
vm.$nextTick(() => {
vm.setEducation();
vm.setLearning();
});
}, },
mounted() { mounted() {
commonUtil.resizeHeight(); commonUtil.resizeHeight();
this.initEcharts();
}, },
methods: { methods: {
// 初始化图表 updateResize() {
initEcharts() { this.$nextTick(function() {
openLoading(this); window.onresize = function() {
let trainChart = echarts.init(this.$refs["learning"]); vm.echartsData.chart1.resize();
let educationChart = echarts.init(this.$refs["education"]); vm.echartsData.chart2.resize();
let trainPara = { };
color: ["#FF9999", "#66CCFF"], });
text: '培训前后知识点掌握情况变化',
xAxisData: [
"转诊与履约",
"转诊与履约",
"周三",
"治疗原则及降压目标",
"周五",
"治疗原则及降压目标",
"周日"
],
seriesBeforeDate: [20, 32, 31, 34, 39, 33, 32],
seriesAfterDate: [86, 10, 96, 10, 16, 16, 15]
}
let educationPara = {
color: ["#33FFFF", "#FF9999"],
text: '不同学历培训前后正确率对比',
xAxisData: [
"转诊与履约",
"转诊与履约",
"周三",
"治疗原则及降压目标",
"周五",
"治疗原则及降压目标",
"周日"
],
seriesBeforeDate: [20, 32, 31, 34, 39, 33, 32],
seriesAfterDate: [86, 10, 96, 10, 16, 16, 15]
};
// 显示图表。
trainChart.setOption(this.echartOptions(trainPara));
educationChart.setOption(this.echartOptions(educationPara));
closeLoading(this)
}, },
// 图表的参数 setEducation() {
echartOptions(parameter) { let myChart = echarts.init(this.$refs.education);
let option = { let option = {
color: parameter.color,
title: { title: {
text: parameter.text, text: ""
x: "center",
textStyle: {
//主标题文本样式
fontSize: 16,
fontWeight: "bolder",
color: "#333"
}
}, },
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
...@@ -78,10 +50,9 @@ export default { ...@@ -78,10 +50,9 @@ export default {
type: "shadow" type: "shadow"
} }
}, },
color: ['#5D7092','#FFB01B'],
legend: { legend: {
data: ["培训前正确率", "培训后正确率"], data: ["项目前总正确率", "项目后总正确率"]
right: 0,
top: 20
}, },
grid: { grid: {
left: "3%", left: "3%",
...@@ -89,70 +60,94 @@ export default { ...@@ -89,70 +60,94 @@ export default {
bottom: "3%", bottom: "3%",
containLabel: true containLabel: true
}, },
xAxis: [ xAxis: {
{ type: "category",
type: "category", data: ["本科", "大专", "中专及以下", "硕士", "博士", "其他"]
data: parameter.xAxisData, },
axisLabel: { yAxis: {
//坐标轴刻度标签的相关设置。 min: 0,
interval: 0, max: 100,
rotate: "45" type: "value",
} axisLabel: {
formatter: "{value} %"
} }
], },
yAxis: [ series: [
{ {
name: "比率(%)", name: "项目前总正确率",
type: "value", type: "bar",
axisLabel: { barWidth: 10,
show: true, data: [45, 45, 34, 34, 4, 8]
interval: "auto", },
formatter: "{value} %" {
}, name: "项目后总正确率",
show: true, type: "bar",
axisLine: { barWidth: 10,
// 轴线 data: [70, 66, 67, 67, 24, 24]
show: false }
} ]
};
myChart.setOption(option);
vm.echartsData.chart1 = myChart;
vm.updateResize();
},
setLearning() {
let myChart = echarts.init(this.$refs.learning);
let option = {
title: {
text: ""
},
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow"
}
},
color: ['#5D7092','#FFB01B'],
legend: {
data: ["培训前正确率", "培训后正确率"]
},
grid: {
left: "3%",
right: "4%",
bottom: "3%",
containLabel: true
},
xAxis: {
axisLabel: {
interval: 0,
rotate: 45
},
type: "category",
data: ["推荐联合用药方案"]
},
yAxis: {
min: 0,
max: 100,
type: "value",
axisLabel: {
formatter: "{value} %"
} }
], },
series: [ series: [
{ {
name: "培训前正确率", name: "培训前正确率",
type: "bar", type: "bar",
barGap: "20%", barWidth: 10,
barMaxWidth: "50", data: [45]
itemStyle: {
normal: {
label: {
show: true,
position: "top",
formatter: "{c}%"
}
}
},
data: parameter.seriesBeforeDate
}, },
{ {
name: "培训后正确率", name: "培训后正确率",
type: "bar", type: "bar",
barGap: "20%", barWidth: 10,
barMaxWidth: "50", data: [81]
itemStyle: {
normal: {
label: {
show: true,
position: "top",
formatter: "{c}%" //这是关键，在需要的地方加上就行了
}
}
},
data: parameter.seriesAfterDate
} }
] ]
}; };
return option; myChart.setOption(option);
} vm.echartsData.chart2 = myChart;
vm.updateResize();
},
} }
}; };
</script> </script>
......
src/views/learning/item-list.vue
浏览文件 @ aec25b02
...@@ -97,7 +97,7 @@ ...@@ -97,7 +97,7 @@
:organizationList="organizationList" :organizationList="organizationList"
></examination-analysisfrom> ></examination-analysisfrom>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="数据总览" name="fifth"> <el-tab-pane label="数据总览" name="zero">
<data-all <data-all
ref="childDataAll" ref="childDataAll"
:formInline="formInline" :formInline="formInline"
...@@ -106,9 +106,9 @@ ...@@ -106,9 +106,9 @@
:organizationList="organizationList" :organizationList="organizationList"
></data-all> ></data-all>
</el-tab-pane> </el-tab-pane>
<!-- <el-tab-pane label="学习效果分析" name="fifth" lazy> <el-tab-pane label="学习效果分析" name="fifth" lazy>
<learning-effect></learning-effect> <learning-effect></learning-effect>
</el-tab-pane>--> </el-tab-pane>
</el-tabs> </el-tabs>
<el-dialog title="提示" :visible.sync="dialogVisible" width="30%" center> <el-dialog title="提示" :visible.sync="dialogVisible" width="30%" center>
<p style="text-align:center">文件正在生成，你可以去“我的导出下载”页，下载文件</p> <p style="text-align:center">文件正在生成，你可以去“我的导出下载”页，下载文件</p>
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或