|
@@ -0,0 +1,223 @@
|
|
|
+<template>
|
|
|
+ <div class="body-box study-dash-container">
|
|
|
+ <!-- 左侧 -->
|
|
|
+ <div class="left-box">
|
|
|
+ <div class="left-box-top">
|
|
|
+ <dv-border-box-12>
|
|
|
+ <div class="dashboard-block">
|
|
|
+ <div class="block-content">
|
|
|
+ <div class="static-wrap">
|
|
|
+ <div class="item" v-for="(item,index) in staticArr">
|
|
|
+ <span class="num" :style="{color:item.color}">
|
|
|
+ <countTo :startVal='0' :endVal='item.val' :duration='1000' class="count-num"></countTo>
|
|
|
+ </span>
|
|
|
+ <span class="label">{{ item.label }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- <BaseLine></BaseLine> -->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </dv-border-box-12>
|
|
|
+ </div>
|
|
|
+ <div class="left-box-bottom">
|
|
|
+ <div class="left-bottom-left">
|
|
|
+ <dv-border-box-13>
|
|
|
+ <div class="dashboard-block">
|
|
|
+ <div class="block-title">
|
|
|
+ <span>近三次评测统计图</span>
|
|
|
+ <dv-decoration-1 style="width:150px;height:20px;" />
|
|
|
+ </div>
|
|
|
+ <div class="block-content">
|
|
|
+ <BaseExamLine></BaseExamLine>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </dv-border-box-13>
|
|
|
+ <dv-border-box-13>
|
|
|
+ <div class="dashboard-block">
|
|
|
+ <div class="block-title">
|
|
|
+ <span>学习稳定度统计分布</span>
|
|
|
+ <dv-decoration-1 style="width:150px;height:20px;" />
|
|
|
+ </div>
|
|
|
+ <div class="block-content">
|
|
|
+ <BaseScoreBar></BaseScoreBar>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </dv-border-box-13>
|
|
|
+ </div>
|
|
|
+ <div class="left-bottom-right">
|
|
|
+ <div class="top">
|
|
|
+ <dv-border-box-13>
|
|
|
+ <div class="dashboard-block">
|
|
|
+ <div class="block-title">
|
|
|
+ <span>班级排名</span>
|
|
|
+ <dv-decoration-1 style="width:150px;height:20px;" />
|
|
|
+ </div>
|
|
|
+ <div class="block-content">
|
|
|
+ <dv-scroll-board :config="classRankConfig" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </dv-border-box-13>
|
|
|
+ <dv-border-box-13>
|
|
|
+ <div class="dashboard-block">
|
|
|
+ <div class="block-title">
|
|
|
+ <span>学生排名</span>
|
|
|
+ <dv-decoration-1 style="width:150px;height:20px;" />
|
|
|
+ </div>
|
|
|
+ <div class="block-content">
|
|
|
+ <div class="rank-wrap">
|
|
|
+ <div class="stu-rank-item">
|
|
|
+ <img class="img-avatar" @click="goStudent()" src="https://paas-admin.xydqq.cn/img/avatar.647bbbfe.png" alt="" width="60">
|
|
|
+ <div class="stu-info">
|
|
|
+ <p class="name">张三</p>
|
|
|
+ <p class="id">140015511001</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </dv-border-box-13>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 右侧 -->
|
|
|
+ <div class="right-box">
|
|
|
+ <div class="right-box-top">
|
|
|
+ <dv-border-box-13>
|
|
|
+ <div class="dashboard-block">
|
|
|
+ <div class="block-title">
|
|
|
+ <span>各科表现排行</span>
|
|
|
+ <dv-decoration-1 style="width:150px;height:20px;" />
|
|
|
+ </div>
|
|
|
+ <div class="block-content" style="display:flex;flex-direction:column;">
|
|
|
+ <BaseSubLine></BaseSubLine>
|
|
|
+ <br>
|
|
|
+ <dv-scroll-ranking-board :config="stuRankConfig" style="width:90%;margin-left:5%" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </dv-border-box-13>
|
|
|
+ </div>
|
|
|
+ <div class="right-box-bottom">
|
|
|
+ <dv-border-box-13>
|
|
|
+ <div class="dashboard-block">
|
|
|
+ <div class="block-title">
|
|
|
+ <span>认知层次分布</span>
|
|
|
+ <dv-decoration-1 style="width:150px;height:20px;" />
|
|
|
+ </div>
|
|
|
+ <div class="block-content">
|
|
|
+ <BaseStudyRadar></BaseStudyRadar>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </dv-border-box-13>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import countTo from 'vue-count-to'
|
|
|
+import BaseCircle from '@/components/dashboard/student/BaseCircle'
|
|
|
+import BaseScoreBar from '@/components/dashboard/studentAll/BaseScoreBar'
|
|
|
+import BaseExamLine from './BaseExamLine'
|
|
|
+import BaseSubLine from './BaseSubLine'
|
|
|
+import BaseStudyRadar from './BaseRadar'
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ countTo,
|
|
|
+ BaseCircle,
|
|
|
+ BaseExamLine,
|
|
|
+ BaseScoreBar,
|
|
|
+ BaseSubLine,
|
|
|
+ BaseStudyRadar
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ staticArr: [
|
|
|
+ {
|
|
|
+ label: '学生总数',
|
|
|
+ color: '#7ec4ff',
|
|
|
+ val: 7944
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '评测总数',
|
|
|
+ color: '#7ec4ff',
|
|
|
+ val: 135
|
|
|
+ }, {
|
|
|
+ label: '线上评测数',
|
|
|
+ color: '#7ec4ff',
|
|
|
+ val: 44
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '课中评测数',
|
|
|
+ color: '#7ec4ff',
|
|
|
+ val: 12
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '阅卷评测数',
|
|
|
+ color: '#20d99d',
|
|
|
+ val: 64
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '智育平均分',
|
|
|
+ color: '#ff8e2e',
|
|
|
+ val: 82.26
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ stuTopArr: new Array(10),
|
|
|
+ classRankConfig: {
|
|
|
+ header: ['<span style="color:#32c5e9;font-weight: bold;">班级</span>', '<span style="color:#32c5e9;font-weight: bold;">最高分</span>', '<span style="color:#32c5e9;font-weight: bold;">最低分</span>', '<span style="color:#32c5e9;font-weight: bold;">综合平均分</span>'],
|
|
|
+ data: [
|
|
|
+ ['一年级1班', '84.3 分', '84.3 分', '84.3 分'],
|
|
|
+ ['一年级2班', '82.6 分', '84.3 分', '84.3 分'],
|
|
|
+ ['一年级3班', '76.0 分', '84.3 分', '84.3 分'],
|
|
|
+ ['一年级4班', '74.1 分', '84.3 分', '84.3 分'],
|
|
|
+ ['一年级5班', '65.8 分', '84.3 分', '84.3 分'],
|
|
|
+ ['一年级6班', '64.3 分', '84.3 分', '84.3 分'],
|
|
|
+ ['一年级1班', '84.3 分', '84.3 分', '84.3 分'],
|
|
|
+ ['一年级2班', '82.6 分', '84.3 分', '84.3 分'],
|
|
|
+ ['一年级3班', '76.0 分', '84.3 分', '84.3 分'],
|
|
|
+ ['一年级4班', '74.1 分', '84.3 分', '84.3 分'],
|
|
|
+ ['一年级5班', '65.8 分', '84.3 分', '84.3 分'],
|
|
|
+ ['一年级6班', '64.3 分', '84.3 分', '84.3 分'],
|
|
|
+ ],
|
|
|
+ align: ['center'],
|
|
|
+ rowNum: 12,
|
|
|
+ headerHeight: 30,
|
|
|
+ headerBGC: "transparent", //表头
|
|
|
+ oddRowBGC: "transparent", //奇数行
|
|
|
+ evenRowBGC: "transparent", //偶数行
|
|
|
+ },
|
|
|
+ stuRankConfig: {
|
|
|
+ data: [
|
|
|
+ {
|
|
|
+ name: '詹姆斯',
|
|
|
+ value: 55
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '库里',
|
|
|
+ value: 96
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '奥尼尔',
|
|
|
+ value: 78
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '韦德',
|
|
|
+ value: 66
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '科比',
|
|
|
+ value: 80
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ unit: '分'
|
|
|
+ },
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less">
|
|
|
+@import "StudyDash.less";
|
|
|
+// @import "../fiveEdu/FiveEdu.less";
|
|
|
+</style>
|