4295ede6
梁保满
即使测报表对比页面开发
|
1
2
3
4
|
<template>
<div ref="main" class="page-container">
<back-box>
<template slot="title">
|
ee00775c
梁保满
测试bug
|
5
|
<span>多班_{{ subjectNames }}_{{ title }}_测练成绩对比分析</span>
|
4295ede6
梁保满
即使测报表对比页面开发
|
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
</template>
</back-box>
<div class="page-content">
<div class="content-header">
<div class="tab-box">
<span
v-for="(item, index) in tabList"
:key="item"
class="tab-item"
:class="type == index ? 'active' : ''"
@click="setType(index)"
>{{ item }}</span
>
</div>
|
ca630320
梁保满
中天挑的问题
|
20
|
<el-button class="setMinScore" @click="openDia" round size="small"
|
4295ede6
梁保满
即使测报表对比页面开发
|
21
22
23
24
25
26
27
28
29
30
31
32
33
34
|
>对比成绩等级设置</el-button
>
</div>
<div id="print-content" class="table-box" v-loading="loading">
<el-table
:max-height="tableMaxHeight"
v-show="type == 0"
:data="tableData"
border
style="width: 100%"
>
<el-table-column
type="index"
label="序号"
|
ee00775c
梁保满
测试bug
|
35
|
fixed
|
4295ede6
梁保满
即使测报表对比页面开发
|
36
37
38
39
40
41
42
43
|
align="center"
width="60"
></el-table-column>
<el-table-column
prop="className"
label="班级"
align="center"
fixed
|
ee00775c
梁保满
测试bug
|
44
|
></el-table-column>
|
e5f407d6
梁保满
测试问题
|
45
46
47
48
49
50
51
|
<el-table-column label="测验人数/班级人数" align="center" width="84">
<template slot-scope="scope">
<p v-for="(item, index) in scope.row.count.split('/')">
{{ item }}{{ index == 0 ? "/" : "" }}
</p>
</template>
</el-table-column>
|
4295ede6
梁保满
即使测报表对比页面开发
|
52
53
|
<el-table-column
prop="percent"
|
4295ede6
梁保满
即使测报表对比页面开发
|
54
55
56
57
|
label="参与度"
align="center"
></el-table-column>
<el-table-column
|
4295ede6
梁保满
即使测报表对比页面开发
|
58
59
60
61
62
|
prop="avg"
label="班平均分"
align="center"
></el-table-column>
<el-table-column
|
4295ede6
梁保满
即使测报表对比页面开发
|
63
64
65
66
67
68
|
prop="max"
label="班最高分"
sortable
align="center"
></el-table-column>
<el-table-column
|
4295ede6
梁保满
即使测报表对比页面开发
|
69
70
71
72
73
74
75
|
prop="min"
label="班最低分"
sortable
align="center"
></el-table-column>
<el-table-column
|
ee00775c
梁保满
测试bug
|
76
77
|
v-for="(item, index) in defaultLevels.levels"
:label="item[0] + '数(率)'"
|
4295ede6
梁保满
即使测报表对比页面开发
|
78
|
align="center"
|
ee00775c
梁保满
测试bug
|
79
80
81
82
|
><template slot-scope="scoped">
<p class="p1">{{ scoped.row.levels[index].people }}</p>
<p class="p1">({{ scoped.row.levels[index].percent }})</p>
</template></el-table-column
|
4295ede6
梁保满
即使测报表对比页面开发
|
83
84
85
86
87
88
89
90
91
92
|
>
</el-table>
<el-table
v-show="type == 1"
:max-height="tableMaxHeight"
:data="tableData2"
border
style="width: 100%"
>
<el-table-column
|
ee00775c
梁保满
测试bug
|
93
|
prop="rank"
|
4295ede6
梁保满
即使测报表对比页面开发
|
94
|
label="排名"
|
da9346ee
梁保满
全选和排序问题
|
95
|
sortable
|
4295ede6
梁保满
即使测报表对比页面开发
|
96
97
98
99
100
101
102
103
104
105
|
align="center"
></el-table-column>
<el-table-column
prop="name"
label="姓名"
align="center"
></el-table-column>
<el-table-column
prop="className"
label="班级"
|
4295ede6
梁保满
即使测报表对比页面开发
|
106
107
108
109
110
111
112
113
114
115
116
|
align="center"
></el-table-column>
<el-table-column
prop="score"
label="总分"
sortable
align="center"
></el-table-column>
<el-table-column
prop="levelName"
label="成绩等级"
|
4295ede6
梁保满
即使测报表对比页面开发
|
117
118
119
120
121
122
123
|
align="center"
></el-table-column>
</el-table>
</div>
<div class="down">
<div>
<el-button
|
ee00775c
梁保满
测试bug
|
124
|
v-loading="exportLoading"
|
4295ede6
梁保满
即使测报表对比页面开发
|
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
|
@click="exportData"
type="primary"
plain
round
icon="fa fa-cloud-download"
>导出报表</el-button
>
<el-button
v-if="!this.$store.getters.code"
@click="print"
type="primary"
plain
round
icon="el-icon-printer"
>打印</el-button
>
</div>
</div>
<el-dialog
:close-on-click-modal="false"
title="等级设置"
:visible.sync="diaLogBox"
|
ca630320
梁保满
中天挑的问题
|
148
|
width="800px"
|
4295ede6
梁保满
即使测报表对比页面开发
|
149
150
151
152
153
154
155
156
157
158
|
@closed="closeDia"
>
<el-form class="use-form">
<el-form-item class="use-form-item-box">
<el-form-item label="等级名称:" class="use-form-item">
<el-select
size="small"
v-model="fromData.type"
@change="changeType"
>
|
ca630320
梁保满
中天挑的问题
|
159
160
161
|
<el-option label="优良合格不合格" :value="0"></el-option>
<el-option label="ABCD" :value="1"></el-option>
<el-option label="自定义" :value="2"></el-option>
|
4295ede6
梁保满
即使测报表对比页面开发
|
162
163
164
|
</el-select>
</el-form-item>
<el-form-item label="等级设置模式:" class="use-form-item">
|
ee00775c
梁保满
测试bug
|
165
166
167
|
<el-select size="small" v-model="fromData.levelType">
<el-option label="按分数比例" :value="0"></el-option>
<el-option label="按已考人数比例" :value="1"></el-option>
|
4295ede6
梁保满
即使测报表对比页面开发
|
168
169
170
171
172
173
174
175
|
</el-select>
</el-form-item>
</el-form-item>
<el-form-item>
<div class="dia-tab-box">
<p class="dia-tab-tit">
<span class="item1">编号</span>
<span class="item2"><i>*</i>等级名称</span>
|
e5f407d6
梁保满
测试问题
|
176
177
178
|
<span class="item3"><i>*</i>等级最高</span>
<span class="item3"><i>*</i>等级最低</span>
<span class="item"></span>
|
4295ede6
梁保满
即使测报表对比页面开发
|
179
180
181
182
183
184
185
186
187
188
189
|
</p>
<div
class="dia-tab-item"
v-for="(item, index) in fromData.levels"
>
<span class="item1">{{ index + 1 }}</span>
<p class="item2">
<el-input
class="score-ipt"
v-model="item[0]"
:maxlength="12"
|
ee00775c
梁保满
测试bug
|
190
|
@keydown.native="keydownRange($event)"
|
4295ede6
梁保满
即使测报表对比页面开发
|
191
192
|
></el-input>
</p>
|
e5f407d6
梁保满
测试问题
|
193
|
<p class="item3">
|
4295ede6
梁保满
即使测报表对比页面开发
|
194
195
196
197
198
|
<el-input
class="score-ipt"
type="number"
v-model="item[1]"
:min="item[2]"
|
ca630320
梁保满
中天挑的问题
|
199
|
:max="index == 0 ? 100 : fromData.levels[index - 1][2]"
|
ee00775c
梁保满
测试bug
|
200
|
@keydown.native="keydownRange($event)"
|
4295ede6
梁保满
即使测报表对比页面开发
|
201
|
></el-input>
|
e5f407d6
梁保满
测试问题
|
202
203
|
%
<template v-if="fromData.levelType == 0">
|
f6fc4301
梁保满
等级调整
|
204
|
({{ index != 0 ? "不含" : ""
|
ca630320
梁保满
中天挑的问题
|
205
|
}}{{
|
e5f407d6
梁保满
测试问题
|
206
207
208
|
Number(((item[1] / 100) * examPaperScore).toFixed(1))
}}分)
</template>
|
f6fc4301
梁保满
等级调整
|
209
|
<template v-else>{{ index != 0 ? "不含" : "" }}</template>
|
4295ede6
梁保满
即使测报表对比页面开发
|
210
|
</p>
|
e5f407d6
梁保满
测试问题
|
211
212
|
<p>~</p>
<p class="item3">
|
4295ede6
梁保满
即使测报表对比页面开发
|
213
214
215
216
217
|
<el-input
class="score-ipt"
type="number"
v-model="item[2]"
:min="0"
|
ca630320
梁保满
中天挑的问题
|
218
|
:max="item[1]"
|
ee00775c
梁保满
测试bug
|
219
|
@keydown.native="keydownRange($event)"
|
4295ede6
梁保满
即使测报表对比页面开发
|
220
|
></el-input>
|
e5f407d6
梁保满
测试问题
|
221
222
|
%
<template v-if="fromData.levelType == 0">
|
f6fc4301
梁保满
等级调整
|
223
|
({{
|
e5f407d6
梁保满
测试问题
|
224
225
226
|
Number(((item[2] / 100) * examPaperScore).toFixed(1))
}}分)
</template>
|
4295ede6
梁保满
即使测报表对比页面开发
|
227
|
</p>
|
e5f407d6
梁保满
测试问题
|
228
|
<p class="item">
|
4295ede6
梁保满
即使测报表对比页面开发
|
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
|
<el-link
type="danger"
:underline="false"
@click="fromData.levels.splice(index, 1)"
>删除</el-link
>
</p>
</div>
<div class="add">
<p @click="fromData.levels.push(['', '', ''])">
<el-button
size="mini"
icon="el-icon-plus"
circle
type="primary"
></el-button
>添加一行
</p>
</div>
</div>
</el-form-item>
</el-form>
<div class="dialog-footer" slot="footer" align="center">
<el-button type="danger" @click="savefrom">保存</el-button>
<el-button @click="diaLogBox = false">取 消</el-button>
</div>
</el-dialog>
</div>
</div>
</template>
<script>
import { downloadFile, tablePrint } from "@/utils";
export default {
data() {
return {
ids: "",
title: "",
subjectNames: "",
tabList: ["班级对比情况", "学生成绩排名"],
type: 0,
loading: false,
|
ee00775c
梁保满
测试bug
|
272
|
exportLoading: false,
|
4295ede6
梁保满
即使测报表对比页面开发
|
273
274
|
diaLogBox: false,
fromData: {
|
ca630320
梁保满
中天挑的问题
|
275
|
type: 0,
|
4295ede6
梁保满
即使测报表对比页面开发
|
276
277
278
279
280
281
282
283
|
levelType: 0,
levels: [
["优秀", 100, 90],
["良好", 89.9, 70],
["合格", 69.9, 60],
["不合格", 59.9, 0],
],
},
|
ee00775c
梁保满
测试bug
|
284
285
286
287
|
defaultLevels: {
levelType: 0,
levels: [],
},
|
4295ede6
梁保满
即使测报表对比页面开发
|
288
289
290
|
tableMaxHeight: 600,
tableData: [],
tableData2: [],
|
e5f407d6
梁保满
测试问题
|
291
|
examPaperScore: 100, //卷面最高分
|
4295ede6
梁保满
即使测报表对比页面开发
|
292
293
|
};
},
|
e5f407d6
梁保满
测试问题
|
294
|
async created() {
|
4295ede6
梁保满
即使测报表对比页面开发
|
295
|
this.ids = this.$route.query.ids;
|
e5f407d6
梁保满
测试问题
|
296
297
|
await this._QueryData();
await this._QueryDefaultLevels();
|
4295ede6
梁保满
即使测报表对比页面开发
|
298
|
},
|
ee00775c
梁保满
测试bug
|
299
300
301
|
destroyed() {
sessionStorage.setItem("levelFromData", "");
},
|
4295ede6
梁保满
即使测报表对比页面开发
|
302
|
methods: {
|
ee00775c
梁保满
测试bug
|
303
304
305
306
307
308
|
// 禁止输入负数
keydownRange(event) {
if (event.key == "-" || event.key == "e") {
event.returnValue = "";
}
},
|
4295ede6
梁保满
即使测报表对比页面开发
|
309
|
print() {
|
ee00775c
梁保满
测试bug
|
310
311
312
313
|
tablePrint(
"print-content",
`多班_${this.subjectNames}_${this.title}_测练成绩对比分析`
);
|
4295ede6
梁保满
即使测报表对比页面开发
|
314
315
316
317
318
319
|
},
setType(type) {
console.log(this.$refs.main.offsetHeight - 50);
this.tableMaxHeight = this.$refs.main.offsetHeight;
this.type = type;
},
|
ca630320
梁保满
中天挑的问题
|
320
321
322
|
openDia() {
this.diaLogBox = true;
},
|
4295ede6
梁保满
即使测报表对比页面开发
|
323
|
closeDia() {
|
ee00775c
梁保满
测试bug
|
324
325
326
327
328
329
330
|
let levelFromData = sessionStorage.getItem("levelFromData");
if (levelFromData) {
levelFromData = JSON.parse(levelFromData);
this.fromData.type = levelFromData.type;
this.fromData.levelType = levelFromData.levelType;
this.fromData.levels = [...levelFromData.levels];
} else {
|
ca630320
梁保满
中天挑的问题
|
331
|
this.fromData.type = 0;
|
ee00775c
梁保满
测试bug
|
332
333
334
|
this.fromData.levelType = this.defaultLevels.levelType;
this.fromData.levels = [...this.defaultLevels.levels];
}
|
4295ede6
梁保满
即使测报表对比页面开发
|
335
336
|
},
changeType(val) {
|
ca630320
梁保满
中天挑的问题
|
337
|
if (val == this.defaultLevels.type) {
|
ee00775c
梁保满
测试bug
|
338
|
this.fromData.levels = [...this.defaultLevels.levels];
|
4295ede6
梁保满
即使测报表对比页面开发
|
339
|
} else {
|
ca630320
梁保满
中天挑的问题
|
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
|
this.fromData.levels = this.fromData.levels.splice(0, 4);
if (val == 0) {
this.fromData.levels = this.fromData.levels.map((item, index) => {
let arrTxt = ["优秀", "良好", "合格", "不合格"];
return [arrTxt[index], item[1], item[2]];
});
} else if (val == 1) {
this.fromData.levels = this.fromData.levels.map((item, index) => {
let arrTxt = ["A", "B", "C", "D"];
return [arrTxt[index], item[1], item[2]];
});
} else {
this.fromData.levels = this.fromData.levels.map((item, index) => {
return ["", item[1], item[2]];
});
}
|
4295ede6
梁保满
即使测报表对比页面开发
|
356
357
|
}
},
|
4295ede6
梁保满
即使测报表对比页面开发
|
358
|
savefrom() {
|
4295ede6
梁保满
即使测报表对比页面开发
|
359
360
361
362
363
364
|
for (let i = 0; i < this.fromData.levels.length; i++) {
if (this.fromData.levels[i].includes("")) {
this.$message.warning("请补全编号" + (i + 1) + "设置信息!");
return;
}
}
|
31436559
梁保满
多班级样式问题,成绩登记设置问题
|
365
366
|
if (this.fromData.levels.length == 0) {
this.$message.warning("请添加等级设置!");
|
e5f407d6
梁保满
测试问题
|
367
368
369
370
371
372
373
374
375
|
return;
}
let nums = [];
let ERR_OK = false;
this.fromData.levels.map((item) => {
nums.push(Number(item[1]));
nums.push(Number(item[2]));
});
for (let i = 0; i < nums.length; i++) {
|
ca630320
梁保满
中天挑的问题
|
376
|
if (nums[i + 1] && nums[i + 1] > nums[i]) {
|
e5f407d6
梁保满
测试问题
|
377
378
379
380
|
ERR_OK = true;
this.$message.warning("高等级比例不能低于低等级比例!请检查");
break;
}
|
31436559
梁保满
多班级样式问题,成绩登记设置问题
|
381
|
}
|
e5f407d6
梁保满
测试问题
|
382
|
if (ERR_OK) return;
|
31436559
梁保满
多班级样式问题,成绩登记设置问题
|
383
384
|
this.tableData = [];
this.tableData2 = [];
|
ca630320
梁保满
中天挑的问题
|
385
|
this.defaultLevels.type = this.fromData.type;
|
ee00775c
梁保满
测试bug
|
386
387
388
389
|
this.defaultLevels.levelType = this.fromData.levelType;
this.defaultLevels.levels = [...this.fromData.levels];
sessionStorage.setItem("levelFromData", JSON.stringify(this.fromData));
this.diaLogBox = false;
|
4295ede6
梁保满
即使测报表对比页面开发
|
390
391
392
393
394
395
|
this._QueryData({
levelType: this.fromData.levelType,
levels: this.fromData.levels,
});
},
|
ee00775c
梁保满
测试bug
|
396
397
398
399
|
async _QueryDefaultLevels() {
const { data, info, status } = await this.$request.defaultLevels();
if (status === 0) {
this.defaultLevels = { ...data } || {
|
ee00775c
梁保满
测试bug
|
400
401
402
403
404
405
406
407
|
levelType: 0,
levels: [
["优秀", 100, 90],
["良好", 89.9, 70],
["合格", 69.9, 60],
["不合格", 59.9, 0],
],
};
|
f6fc4301
梁保满
等级调整
|
408
|
this.defaultLevels.type = 0
|
ee00775c
梁保满
测试bug
|
409
410
|
this.fromData.levelType = this.defaultLevels.levelType;
this.fromData.levels = [...this.defaultLevels.levels];
|
ca630320
梁保满
中天挑的问题
|
411
412
413
414
|
sessionStorage.setItem(
"levelFromData",
JSON.stringify(this.defaultLevels)
);
|
ee00775c
梁保满
测试bug
|
415
416
417
418
|
} else {
this.$message.error(info);
}
},
|
4295ede6
梁保满
即使测报表对比页面开发
|
419
420
421
|
async _QueryData(params) {
let query = {};
if (params) {
|
15537b36
梁保满
等级优化
|
422
423
424
|
let paramObj = JSON.parse(JSON.stringify(params))
if (paramObj.levelType == 0) {
paramObj.levels = paramObj.levels.map((item) => {
|
e5f407d6
梁保满
测试问题
|
425
426
427
428
429
|
item[1] = ((item[1] / 100) * this.examPaperScore).toFixed(1);
item[2] = ((item[2] / 100) * this.examPaperScore).toFixed(1);
return item;
});
}
|
15537b36
梁保满
等级优化
|
430
|
query = { ...paramObj };
|
4295ede6
梁保满
即使测报表对比页面开发
|
431
432
433
434
435
|
}
const { data, info, status } = await this.$request.examMultiClassReport({
examIds: this.ids,
...query,
});
|
ee00775c
梁保满
测试bug
|
436
437
|
if (status === 0) {
this.title = data.title;
|
e5f407d6
梁保满
测试问题
|
438
|
this.examPaperScore = data.examPaperScore || 100;
|
ee00775c
梁保满
测试bug
|
439
440
|
this.subjectNames = data.subjectName;
this.tableData = data.classes || [];
|
da9346ee
梁保满
全选和排序问题
|
441
442
443
444
445
|
this.tableData2 =
data.students.map((item) => {
item.score = Number(item.score);
return item;
}) || [];
|
4295ede6
梁保满
即使测报表对比页面开发
|
446
447
448
449
450
451
452
453
454
|
} else {
this.$message.error(info);
}
},
//导出
async exportData() {
if (this.exportLoading == true) return;
this.exportLoading = true;
|
0074e60a
梁保满
导出报表参数设置
|
455
456
457
458
459
460
461
462
463
|
let params = { ...this.fromData };
if (params.levelType == 0) {
params.levels = params.levels.map((item) => {
console.log(item);
item[1] = ((item[1] / 100) * this.examPaperScore).toFixed(1);
item[2] = ((item[2] / 100) * this.examPaperScore).toFixed(1);
return item;
});
}
|
4295ede6
梁保满
即使测报表对比页面开发
|
464
|
const data = await this.$request.exportExamMultiReport({
|
ee00775c
梁保满
测试bug
|
465
|
examIds: this.ids,
|
0074e60a
梁保满
导出报表参数设置
|
466
467
|
levels: params.levels,
levelType: params.levelType,
|
4295ede6
梁保满
即使测报表对比页面开发
|
468
469
470
471
472
473
|
});
this.exportLoading = false;
if (data) {
let blob = new Blob([data], {
type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
});
|
ee00775c
梁保满
测试bug
|
474
475
476
477
|
downloadFile(
`多班_${this.subjectNames}_${this.title}_测练成绩对比分析`,
blob
);
|
4295ede6
梁保满
即使测报表对比页面开发
|
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
|
} else {
this.$message.error("下载失败");
}
},
},
};
</script>
<style lang="scss" scoped>
.page-container {
position: relative;
height: 100%;
.table-box {
min-height: 100%;
}
&.active {
overflow: hidden;
}
.content-header {
width: 100%;
position: relative;
.setMinScore {
position: absolute;
bottom: 0;
|
0074e60a
梁保满
导出报表参数设置
|
502
|
right: 0;
|
4295ede6
梁保满
即使测报表对比页面开发
|
503
504
505
506
507
508
509
|
}
}
.page-content {
padding: 20px 20px 0;
}
}
.tab-box {
|
0074e60a
梁保满
导出报表参数设置
|
510
|
width: 400px;
|
4295ede6
梁保满
即使测报表对比页面开发
|
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
|
margin: 0 auto 12px;
background: #f8f8f8;
border-radius: 20px;
display: flex;
user-select: none;
.tab-item {
flex: 1;
height: 40px;
line-height: 40px;
text-align: center;
font-size: 16px;
color: #666;
font-weight: 500;
background: transparent;
border-radius: 20px;
cursor: pointer;
&.active {
background: #667ffd;
color: #fff;
}
}
}
.down {
padding-top: 20px;
width: 100%;
display: flex;
justify-content: space-between;
}
.use-form {
padding: 0 12px;
.use-form-item-box {
:deep(.el-form-item__content) {
display: flex;
}
.use-form-item {
width: 40%;
margin-right: 20px;
}
}
}
.dia-tab-box {
.dia-tab-tit,
.dia-tab-item {
margin-bottom: 10px;
i {
color: #f30;
padding-right: 5px;
}
display: flex;
|
e5f407d6
梁保满
测试问题
|
560
561
562
|
.item {
width: 40px;
}
|
4295ede6
梁保满
即使测报表对比页面开发
|
563
564
|
.item1 {
padding-left: 10px;
|
e5f407d6
梁保满
测试问题
|
565
|
width: 10%;
|
4295ede6
梁保满
即使测报表对比页面开发
|
566
567
|
}
.item2 {
|
e5f407d6
梁保满
测试问题
|
568
569
570
571
|
width: 18%;
}
.item3 {
padding-left: 12px;
|
4295ede6
梁保满
即使测报表对比页面开发
|
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
|
flex: 1;
}
.score-ipt {
width: 100px;
}
}
.dia-tab-tit {
background: rgba(243, 243, 243, 1);
}
.add {
display: flex;
justify-content: center;
margin: 0 auto;
p {
cursor: pointer;
}
.el-button {
margin-right: 6px;
}
}
}
|
da9346ee
梁保满
全选和排序问题
|
593
594
|
.p1 {
line-height: 18px;
|
ee00775c
梁保满
测试bug
|
595
|
}
|
4295ede6
梁保满
即使测报表对比页面开发
|
596
|
</style>
|