1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
| <template>
| <div style="padding: 10px">
| <el-form :model="queryParam" ref="queryForm" :inline="true " style="display: flex">
| <el-form-item label="试卷：" >
| <el-select v-model="queryParam.examPaperId" filterable placeholder="试卷">
| <el-option v-for="item in examPaperList" :key="item.id" :value="item.id" :label="item.name"/>
| </el-select>
| </el-form-item>
| <el-form-item label="部门：" v-if="true">
| <el-select v-model="queryParam.departmentId" placeholder="部门" clearable>
| <el-option v-for="item in levelEnum" :key="item.key" :value="item.key" :label="item.value"/>
| </el-select>
| </el-form-item>
| <el-form-item>
| <el-button type="primary" @click="submitForm">查询</el-button>
| </el-form-item>
|
| </el-form>
| <el-row class="echarts-line">
| <div id="echarts-moth-user" style="width: 100%;height:400px;" v-loading="loading"/>
| </el-row>
| </div>
| </template>
| <script>
| import { mapGetters, mapState, mapActions } from 'vuex'
| import dashboardApi from '@/api/dashboard'
| export default {
| data(){
| return{
| examPaperList: [],
| max:'',
| min:'',
| avg:'',
| loading:false,
| examPaperCount: 0,
| questionCount: 0,
| doExamPaperCount: 0,
| doQuestionCount: 0,
| echartsUserAction: null,
| queryParam: {
| examPaperId: '85',
| departmentId: '',
| subjectId: null,
| pageIndex: 1,
| pageSize: 10
| },
| listLoading:false
| }
| },
| mounted(){
| dashboardApi.examPaperList().then(res => {
| this.examPaperList = res.response
| })
| let _this = this
| dashboardApi.getData(this.queryParam).then(re => {
| let response = re.response
| console.log(response)
| _this.avg = response.avg
| _this.max = response.max
| _this.min = response.min
| _this.examPaperCount = response.examPaperCount
| _this.questionCount = response.questionCount
| _this.doExamPaperCount = response.doExamPaperCount
| _this.doQuestionCount = response.doQuestionCount
| _this.echartsUserAction.setOption(this.option('用户活跃度', '{b}分{c}人', response.mothDayText, response))
| // _this.echartsQuestion.setOption(this.option('题目月数量', '{b}日{c}题', response.mothDayText, response.mothDayDoExamQuestionValue))
| this.loading = false
| })
| this.echartsUserAction = echarts.init(document.getElementById('echarts-moth-user'), 'macarons')
| },
| methods:{
| option (title, formatter, label, vaule) {
| return {
| title: {
| text: '答卷统计',
| x: 'center'
| },
| tooltip: {
| trigger: 'item',
| formatter: formatter
| },
| xAxis: {
| type: 'category',
| data: ['0-60','60-80','80-100']
| },
| grid: {
| left: 10,
| right: 10,
| bottom: 20,
| top: 30,
| containLabel: true
| },
| yAxis: {
| type: 'value'
| },
| series: [{
| data: [vaule.lowGrade,vaule.intermediate,vaule.advanced],
| type: 'bar',
| barMaxWidth:'10%'
| }]
| }
| },
| search () {
| // this.listLoading = true
| let _this = this
| dashboardApi.getData(this.queryParam).then(re => {
| console.log(re)
| let response = re.response
| _this.avg = response.avg
| _this.max = response.max
| _this.min = response.min
| _this.echartsUserAction.setOption(this.option('用户活跃度', '{b}分{c}人', response.mothDayText, response))
| })
| this.echartsUserAction = echarts.init(document.getElementById('echarts-moth-user'), 'macarons')
| },
| submitForm () {
| this.queryParam.pageIndex = 1
| this.search()
| }
| },
| computed: {
| ...mapGetters('enumItem', ['enumFormat']),
| ...mapState('enumItem', {
| levelEnum: state => state.user.levelEnum
| })
| }
| }
| </script>
|
| <style scoped lang="scss">
|
| </style>
|
|
