Skip to content

X
x-learn
提交 b3eb2c11 authored 作者: matian's avatar matian
浏览文件
操作

feat:新增数据看板页面

上级 25933b6c
隐藏空白字符变更
内嵌 并排
正在显示 包含 295 行增加 和 73 行删除
package-lock.json
浏览文件 @ b3eb2c11
...@@ -9,6 +9,7 @@ ...@@ -9,6 +9,7 @@
"dependencies": { "dependencies": {
"axios": "^0.24.0", "axios": "^0.24.0",
"blueimp-md5": "^2.19.0", "blueimp-md5": "^2.19.0",
"echarts": "^5.2.2",
"element-ui": "^2.15.6", "element-ui": "^2.15.6",
"js-base64": "^3.7.2", "js-base64": "^3.7.2",
"lodash": "^4.17.21", "lodash": "^4.17.21",
...@@ -2422,6 +2423,20 @@ ...@@ -2422,6 +2423,20 @@
"node": ">=6.0.0" "node": ">=6.0.0"
} }
}, },
"node_modules/echarts": {
"version": "5.2.2",
"resolved": "https://registry.npmjs.org/echarts/-/echarts-5.2.2.tgz",
"integrity": "sha512-yxuBfeIH5c+0FsoRP60w4De6omXhA06c7eUYBsC1ykB6Ys2yK5fSteIYWvkJ4xJVLQgCvAdO8C4mN6MLeJpBaw==",
"dependencies": {
"tslib": "2.3.0",
"zrender": "5.2.1"
}
},
"node_modules/echarts/node_modules/tslib": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
"integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg=="
},
"node_modules/ee-first": { "node_modules/ee-first": {
"version": "1.1.1", "version": "1.1.1",
"resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz", "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
...@@ -6235,6 +6250,19 @@ ...@@ -6235,6 +6250,19 @@
"resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz", "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
"integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==", "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
"dev": true "dev": true
},
"node_modules/zrender": {
"version": "5.2.1",
"resolved": "https://registry.npmjs.org/zrender/-/zrender-5.2.1.tgz",
"integrity": "sha512-M3bPGZuyLTNBC6LiNKXJwSCtglMp8XUEqEBG+2MdICDI3d1s500Y4P0CzldQGsqpRVB7fkvf3BKQQRxsEaTlsw==",
"dependencies": {
"tslib": "2.3.0"
}
},
"node_modules/zrender/node_modules/tslib": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
"integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg=="
} }
}, },
"dependencies": { "dependencies": {
...@@ -8188,6 +8216,22 @@ ...@@ -8188,6 +8216,22 @@
"esutils": "^2.0.2" "esutils": "^2.0.2"
} }
}, },
"echarts": {
"version": "5.2.2",
"resolved": "https://registry.npmjs.org/echarts/-/echarts-5.2.2.tgz",
"integrity": "sha512-yxuBfeIH5c+0FsoRP60w4De6omXhA06c7eUYBsC1ykB6Ys2yK5fSteIYWvkJ4xJVLQgCvAdO8C4mN6MLeJpBaw==",
"requires": {
"tslib": "2.3.0",
"zrender": "5.2.1"
},
"dependencies": {
"tslib": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
"integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg=="
}
}
},
"ee-first": { "ee-first": {
"version": "1.1.1", "version": "1.1.1",
"resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz", "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
...@@ -11043,6 +11087,21 @@ ...@@ -11043,6 +11087,21 @@
"resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz", "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
"integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==", "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
"dev": true "dev": true
},
"zrender": {
"version": "5.2.1",
"resolved": "https://registry.npmjs.org/zrender/-/zrender-5.2.1.tgz",
"integrity": "sha512-M3bPGZuyLTNBC6LiNKXJwSCtglMp8XUEqEBG+2MdICDI3d1s500Y4P0CzldQGsqpRVB7fkvf3BKQQRxsEaTlsw==",
"requires": {
"tslib": "2.3.0"
},
"dependencies": {
"tslib": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
"integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg=="
}
}
} }
} }
} }
package.json
浏览文件 @ b3eb2c11
...@@ -12,6 +12,7 @@ ...@@ -12,6 +12,7 @@
"dependencies": { "dependencies": {
"axios": "^0.24.0", "axios": "^0.24.0",
"blueimp-md5": "^2.19.0", "blueimp-md5": "^2.19.0",
"echarts": "^5.2.2",
"element-ui": "^2.15.6", "element-ui": "^2.15.6",
"js-base64": "^3.7.2", "js-base64": "^3.7.2",
"lodash": "^4.17.21", "lodash": "^4.17.21",
......
src/main.js
浏览文件 @ b3eb2c11
...@@ -15,6 +15,8 @@ import AppCard from './components/base/AppCard.vue' ...@@ -15,6 +15,8 @@ import AppCard from './components/base/AppCard.vue'
import AppList from './components/base/AppList.vue' import AppList from './components/base/AppList.vue'
import beforeEnter from './utils/beforeEnter' import beforeEnter from './utils/beforeEnter'
import * as echarts from 'echarts'
Vue.prototype.$echarts = echarts
// 注册element-ui组件 // 注册element-ui组件
Vue.use(ElementUI) Vue.use(ElementUI)
......
src/modules/teacher/data/exam/components/ExamData.vue
浏览文件 @ b3eb2c11
<template> <template>
<app-container> <app-container>
<el-row type="flex" class="row-bg" justify="space-between" style="margin-bottom: 30px">
<el-col :span="10"><h1 style="padding-left: 80px; font-size: 30px">模拟测试一</h1></el-col>
<el-col :span="5">
<!-- <el-select v-model="selectValue" placeholder="请选择">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select> -->
<el-button type="text" style="margin-left: 20px">导出pdf</el-button>
</el-col>
</el-row>
<el-row type="flex" class="row-bg" justify="space-around"> <el-row type="flex" class="row-bg" justify="space-around">
<el-col :span="6"><ExamInfo /></el-col> <el-col :span="6"><ExamInfo /></el-col>
<el-col :span="6"><Submission /></el-col> <el-col :span="6"><Submission /></el-col>
...@@ -10,9 +19,9 @@ ...@@ -10,9 +19,9 @@
<el-col :span="10"><TitleData /></el-col> <el-col :span="10"><TitleData /></el-col>
</el-row> </el-row>
<el-row type="flex" class="row-bg" justify="space-around" style="margin-top: 30px"> <el-row type="flex" class="row-bg" justify="space-around" style="margin-top: 30px">
<el-col :span="6"><Result /></el-col> <el-col :span="7"><Result /></el-col>
<el-col :span="6"><ScoreRange /></el-col> <el-col :span="7"><ScoreRange /></el-col>
<el-col :span="6"><QuestionType /></el-col> <el-col :span="7"><QuestionType /></el-col>
</el-row> </el-row>
</app-container> </app-container>
</template> </template>
......
src/modules/teacher/data/exam/components/components/QuestionType.vue
浏览文件 @ b3eb2c11
...@@ -3,25 +3,66 @@ ...@@ -3,25 +3,66 @@
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
<span>题型数据</span> <span>题型数据</span>
</div> </div>
<el-row type="flex" class="row-bg" justify="space-around"> <div id="type" style="width: 600px; height: 400px"></div>
<el-col :span="6" <div>客观题正确率76%</div>
><div>总分</div> <div>主观题正确率24%</div>
<div>12313</div></el-col
>
<el-col :span="6"
><div>及格分数</div>
<div>31231</div></el-col
>
<el-col :span="6"
><div>考试总时长</div>
<div>12341</div></el-col
>
</el-row>
</el-card> </el-card>
</template> </template>
<script> <script>
export default {} import * as echarts from 'echarts'
export default {
data() {
return {
option: {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
grid: {
left: '10%',
right: '20%',
bottom: '3%',
containLabel: true
},
xAxis: [
{
type: 'category',
data: ['单选题', '多选题', '判断题', '情景题', '实操题'],
axisTick: {
alignWithLabel: true
}
}
],
yAxis: [
{
type: 'value',
name: '题型正确率',
data: ['0%', '20%', '40%', '60%', '80%', '100%'],
axisLabel: {
formatter: '{value} %'
}
}
],
series: [
{
name: 'Direct',
type: 'bar',
barWidth: '30%',
data: [20, 40, 60, 80, 100]
}
]
}
}
},
mounted() {
const myChart = echarts.init(document.getElementById('type'))
myChart.setOption(this.option)
}
}
</script> </script>
<style></style> <style></style>
src/modules/teacher/data/exam/components/components/RankingAll.vue 0 → 100644
浏览文件 @ b3eb2c11
<template>
<app-container>
<app-list v-bind="tableOptions" ref="list">
<template v-slot:table-operate="{ row }">
<el-button type="text">查看</el-button>
</template>
</app-list>
</app-container>
</template>
<script>
export default {
data() {
return {}
},
computed: {
// 列表配置
tableOptions() {
return {
remote: {},
columns: [
{ label: '排名', prop: 'paper_title', align: 'center' },
{ label: '姓名', slots: 'table-name', align: 'center' },
{ label: '客观题', prop: 'cankao_num', align: 'center', sortable: true },
{ label: '主观题', prop: 'efw', align: 'center', sortable: true },
{ label: '总分', prop: 'average_num', align: 'center', sortable: true },
{ label: '操作', slots: 'table-operate', align: 'center' }
],
data: [
{
class_name: '1w1e'
}
]
}
}
},
methods: {
toPersonal(row) {
this.$router.push({
path: '/PersonalList',
query: {
row: row
}
})
}
}
}
</script>
src/modules/teacher/data/exam/components/components/Result.vue
浏览文件 @ b3eb2c11
...@@ -3,25 +3,61 @@ ...@@ -3,25 +3,61 @@
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
<span>结果统计</span> <span>结果统计</span>
</div> </div>
<el-row type="flex" class="row-bg" justify="space-around"> <div id="main" style="width: 600px; height: 400px"></div>
<el-col :span="6"
><div>总分</div>
<div>12313</div></el-col
>
<el-col :span="6"
><div>及格分数</div>
<div>31231</div></el-col
>
<el-col :span="6"
><div>考试总时长</div>
<div>12341</div></el-col
>
</el-row>
</el-card> </el-card>
</template> </template>
<script> <script>
export default {} import * as echarts from 'echarts'
export default {
data() {
return {
option: {
tooltip: {
trigger: 'item'
},
legend: {
top: '5%',
left: 'center'
},
series: [
{
name: 'Access From',
type: 'pie',
radius: ['40%', '70%'],
avoidLabelOverlap: false,
label: {
show: false,
position: 'center'
},
emphasis: {
label: {
show: true,
fontSize: '40',
fontWeight: 'bold'
}
},
labelLine: {
show: false
},
data: [
{ value: 1048, name: 'Search Engine' },
{ value: 735, name: 'Direct' }
// { value: 580, name: 'Email' },
// { value: 484, name: 'Union Ads' },
// { value: 300, name: 'Video Ads' }
]
}
]
}
}
},
mounted() {
const myChart = echarts.init(document.getElementById('main'))
myChart.setOption(this.option)
}
}
</script> </script>
<style></style> <style></style>
src/modules/teacher/data/exam/components/components/ScoreRange.vue
浏览文件 @ b3eb2c11
...@@ -2,26 +2,60 @@ ...@@ -2,26 +2,60 @@
<el-card class="box-card"> <el-card class="box-card">
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
<span>考分区间</span> <span>考分区间</span>
<el-button type="text" style="float: right">设置</el-button>
</div> </div>
<el-row type="flex" class="row-bg" justify="space-around"> <div id="score" style="width: 600px; height: 400px"></div>
<el-col :span="6"
><div>总分</div>
<div>12313</div></el-col
>
<el-col :span="6"
><div>及格分数</div>
<div>31231</div></el-col
>
<el-col :span="6"
><div>考试总时长</div>
<div>12341</div></el-col
>
</el-row>
</el-card> </el-card>
</template> </template>
<script> <script>
export default {} import * as echarts from 'echarts'
export default {
data() {
return {
option: {
title: {
text: 'Referer of a Website',
subtext: 'Fake Data',
left: 'center'
},
tooltip: {
trigger: 'item'
},
legend: {
bottom: 10,
left: 'center'
},
series: [
{
name: 'Access From',
type: 'pie',
radius: '50%',
data: [
{ value: 1048, name: 'Search Engine' },
{ value: 735, name: 'Direct' },
{ value: 580, name: 'Email' },
{ value: 484, name: 'Union Ads' },
{ value: 300, name: 'Video Ads' }
],
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
}
}
]
}
}
},
mounted() {
const myChart = echarts.init(document.getElementById('score'))
myChart.setOption(this.option)
}
}
</script> </script>
<style></style> <style></style>
src/modules/teacher/data/exam/components/components/ScoreRanking.vue
浏览文件 @ b3eb2c11
...@@ -4,14 +4,17 @@ ...@@ -4,14 +4,17 @@
<h1 class="title" style="font-size: 28px">班级排名</h1> <h1 class="title" style="font-size: 28px">班级排名</h1>
<el-button type="text" style="font-size: 28px; float: right; margin-top: -40px">导出</el-button> <el-button type="text" style="font-size: 28px; float: right; margin-top: -40px">导出</el-button>
<el-tabs v-model="tabActive" style="margin-top: 30px"> <el-tabs v-model="tabActive" style="margin-top: 30px">
<el-tab-pane label="已结束" name="baseInfo"> <el-tab-pane label="已完成" name="baseInfo">
<Finished /> <RankingAll />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="待评价" name="contacts" lazy> <el-tab-pane label="待评价" name="contacts" lazy>
<ToEvaluate /> <RankingAll />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="未作答" name="project" lazy> <el-tab-pane label="未作答" name="project" lazy>
<NoAnswer /> <RankingAll />
</el-tab-pane>
<el-tab-pane label="待提交" name="toSubmit" lazy>
<RankingAll />
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
</app-card> </app-card>
...@@ -19,11 +22,9 @@ ...@@ -19,11 +22,9 @@
</template> </template>
<script> <script>
import Finished from '../Finished.vue' import RankingAll from './RankingAll.vue'
import ToEvaluate from '../ToEvaluate.vue'
import NoAnswer from '../NoAnswer.vue'
export default { export default {
components: { Finished, ToEvaluate, NoAnswer }, components: { RankingAll },
data() { data() {
return { return {
tabActive: 'baseInfo' tabActive: 'baseInfo'
......
src/modules/teacher/data/exam/components/components/TitleData.vue
浏览文件 @ b3eb2c11
...@@ -3,13 +3,7 @@ ...@@ -3,13 +3,7 @@
<app-container> <app-container>
<h1 class="title" style="font-size: 28px">题目数据</h1> <h1 class="title" style="font-size: 28px">题目数据</h1>
<el-button type="text" style="font-size: 28px; float: right; margin-top: -40px">导出</el-button> <el-button type="text" style="font-size: 28px; float: right; margin-top: -40px">导出</el-button>
<app-list v-bind="tableOptions" ref="list" style="margin-top: 60px"> <app-list v-bind="tableOptions" ref="list" style="margin-top: 60px"> </app-list>
<!-- 操作 -->
<template v-slot:table-operate="{ row }">
<el-button type="text" size="mini" @click="toExamData(row)">考试数据</el-button>
<el-button type="text" size="mini" @click="toClassData(row)">班级数据</el-button>
</template>
</app-list>
</app-container> </app-container>
</el-card> </el-card>
</template> </template>
...@@ -30,16 +24,12 @@ export default { ...@@ -30,16 +24,12 @@ export default {
return { return {
remote: {}, remote: {},
columns: [ columns: [
{ label: '考试名称', prop: 'paper_title', slots: 'table-name' }, { label: '排序', prop: 'paper_title', align: 'center' },
{ label: '所属课程', prop: 'class_name', align: 'center' }, { label: '题干简述', prop: 'class_name', align: 'center' },
{ label: '参考人数', prop: 'cankao_num', align: 'center' }, { label: '题型', prop: 'cankao_num', align: 'center' },
{ label: '参考率', prop: 'rfert', align: 'center' }, { label: '正确率', prop: 'rfert', align: 'center' },
{ label: '平均得分', prop: 'average_num', align: 'center' }, { label: '总分', prop: 'average_num', align: 'center' },
{ label: '最高分', prop: 'top', align: 'center' }, { label: '平均得分', prop: 'top', align: 'center' }
{ label: '最低分', prop: 'low', align: 'center' },
{ label: '题目总数', prop: 'title_num', align: 'center' },
{ label: '及格率', prop: 'title_percent', align: 'center' },
{ label: '操作', slots: 'table-operate', align: 'center' }
], ],
data: [ data: [
{ {
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论