Blame view

src/views/basic/ask/archiving.vue 26.8 KB
e5e4a3e6   梁保满   v1.3
1
2
3
4
5
6
7
8
9
  <template>
    <div class="main" ref="main">
      <back-box>
        <template slot="title">
          <span>问答-已归档数据报表</span>
        </template>
      </back-box>
      <div class="answer-header">
        <div class="sel-box">
f45b3c05   LH_PC   云平台新UI界面
10
11
          <el-select class="sel" v-model="query.classId" placeholder="选择班级" @change="changeclass">
            <el-option v-for="item in classList" :key="item.value" :label="item.label" :value="item.value">
e5e4a3e6   梁保满   v1.3
12
13
            </el-option>
          </el-select>
f45b3c05   LH_PC   云平台新UI界面
14
15
16
          <el-select v-if="role == 'ROLE_BANZHUREN' || role == 'ROLE_PERSONAL'" class="sel" multiple
            v-model="query.subjectNames" placeholder="选择科目" @change="changeSub">
            <el-option v-for="item in subjectList" :key="item.value" :label="item.label" :value="item.value">
e5e4a3e6   梁保满   v1.3
17
18
            </el-option>
          </el-select>
f45b3c05   LH_PC   云平台新UI界面
19
20
          <el-select v-else class="sel" v-model="query.subjectNames" placeholder="选择科目">
            <el-option v-for="item in subjectList" :key="item.value" :label="item.label" :value="item.value">
e5e4a3e6   梁保满   v1.3
21
22
23
            </el-option>
          </el-select>
          <div class="d1">
f45b3c05   LH_PC   云平台新UI界面
24
25
            <el-date-picker v-model="query.startDay" type="date" @change="handleChangeTimeStart" placeholder="选择日期时间"
              value-format="yyyy-MM-dd">
e5e4a3e6   梁保满   v1.3
26
27
            </el-date-picker>
            ~
f45b3c05   LH_PC   云平台新UI界面
28
29
            <el-date-picker v-model="query.endDay" type="date" placeholder="选择日期时间" @change="handleChangeTimeEnd"
              value-format="yyyy-MM-dd">
e5e4a3e6   梁保满   v1.3
30
31
32
            </el-date-picker>
          </div>
          <p class="p1">
f45b3c05   LH_PC   云平台新UI界面
33
34
35
36
            <span @click="setDate(1)" :class="[date == 1 ? 'active' : '', 's1']">今天</span>
            <span @click="setDate(2)" :class="[date == 2 ? 'active' : '', 's1']">本周</span>
            <span @click="setDate(3)" :class="[date == 3 ? 'active' : '', 's1']">本月</span>
            <span @click="setDate(4)" :class="[date == 4 ? 'active' : '', 's1']">本季度</span>
e5e4a3e6   梁保满   v1.3
37
38
39
40
41
          </p>
          <el-button type="primary" round @click="_QueryData()">筛选</el-button>
        </div>
      </div>
      <div class="table-box">
3587d377   梁保满   归档流程调整
42
        <!-- <el-radio-group
e5e4a3e6   梁保满   v1.3
43
44
45
46
47
48
49
50
51
52
53
54
          v-model="tabIndex"
          @change="tabChange"
          style="margin-bottom: 20px"
        >
          <template v-for="(item, index) in tabList">
            <el-radio-button
              v-if="index == 0 || query.startDay != query.endDay"
              :key="index"
              :label="index + 1"
              >{{ item }}</el-radio-button
            >
          </template>
3587d377   梁保满   归档流程调整
55
        </el-radio-group> -->
e5e4a3e6   梁保满   v1.3
56
57
58
        <div class="table-cont" v-loading="loading">
          <div id="print-content">
            <div v-show="tabIndex == 1">
f45b3c05   LH_PC   云平台新UI界面
59
60
61
62
63
64
65
66
              <el-table :data="tableData" border style="width: 100%" @sort-change="sortChange">
                <el-table-column prop="title" label="课时" align="center"></el-table-column>
                <el-table-column prop="questionNum" label="题目总数" align="center" width="100"></el-table-column>
                <el-table-column prop="startTime" label="上课时间" align="center"></el-table-column>
                <el-table-column prop="participationRate" label="参与度" sortable="custom" align="center">
                  <template slot-scope="scoped">{{ scoped.row.participationRate }}%</template></el-table-column>
                <el-table-column prop="answerCorrectRate" label="已答总正确率" sortable="custom" align="center">
                  <template slot-scope="scoped">{{ scoped.row.answerCorrectRate }}%</template>
e5e4a3e6   梁保满   v1.3
67
                </el-table-column>
f45b3c05   LH_PC   云平台新UI界面
68
69
                <el-table-column prop="classCorrectRate" label="班级总正确率" sortable="custom" align="center"><template
                    slot-scope="scoped">{{ scoped.row.classCorrectRate }}%</template></el-table-column>
e5e4a3e6   梁保满   v1.3
70
71
72
                <el-table-column label="操作" align="center">
                  <template slot-scope="scoped">
                    <el-tooltip effect="dark" content="详情" placement="top">
f45b3c05   LH_PC   云平台新UI界面
73
74
                      <el-button type="primary" circle size="mini" icon="fa fa-arrow-right"
                        @click="linkTo(scoped.row)"></el-button>
e5e4a3e6   梁保满   v1.3
75
76
77
78
79
80
                    </el-tooltip>
                  </template>
                </el-table-column>
              </el-table>
            </div>
            <div v-show="tabIndex == 2">
f45b3c05   LH_PC   云平台新UI界面
81
82
83
84
85
86
87
88
89
90
91
92
              <el-table id="print-content2" v-if="role == 'ROLE_JIAOSHI'" :max-height="tableMaxHeight" :data="tableData"
                border style="width: 100%">
                <el-table-column prop="studentCode" label="学号" fixed align="center"></el-table-column>
                <el-table-column prop="studentName" label="姓名" fixed align="center" width="100"></el-table-column>
                <el-table-column prop="answerTimes" label="累计答题次数" sortable align="center"></el-table-column>
                <el-table-column prop="correctAnswerTimes" label="累计答对次数" sortable align="center"></el-table-column>
                <el-table-column prop="participationRate" label="总参与度" sortable align="center">
                  <template slot-scope="scoped">{{ scoped.row.participationRate }}%</template></el-table-column>
                <el-table-column prop="correctRate" label="总正确率" sortable align="center">
                  <template slot-scope="scoped">{{ scoped.row.correctRate }}%</template></el-table-column>
                <el-table-column prop="answerCorrectRate" label="已答总正确率" sortable align="center">
                  <template slot-scope="scoped">{{ scoped.row.answerCorrectRate }}%</template>
e5e4a3e6   梁保满   v1.3
93
                </el-table-column>
f45b3c05   LH_PC   云平台新UI界面
94
                <el-table-column prop="classRank" label="总正确率班排名" sortable align="center"></el-table-column>
e5e4a3e6   梁保满   v1.3
95
              </el-table>
f45b3c05   LH_PC   云平台新UI界面
96
97
98
99
100
101
              <el-table id="print-content2" :max-height="tableMaxHeight" v-else :data="tableData" border
                style="width: 100%">
                <el-table-column prop="studentCode" label="学号" align="center" fixed></el-table-column>
                <el-table-column prop="studentName" label="姓名" align="center" fixed width="100"></el-table-column>
                <el-table-column v-for="(item, index) in phaseOption" :key="index" :label="item" align="center">
                  <el-table-column align="center" :label="index == 0 ? '总课时数' : '课时数'" :prop="'periodCount' + item">
e5e4a3e6   梁保满   v1.3
102
                  </el-table-column>
f45b3c05   LH_PC   云平台新UI界面
103
                  <el-table-column align="center" :label="index == 0 ? '总出题数' : '出题数'" :prop="'questionNum' + item">
e5e4a3e6   梁保满   v1.3
104
                  </el-table-column>
f45b3c05   LH_PC   云平台新UI界面
105
106
                  <el-table-column align="center" :label="index == 0 ? '总参与度' : '参与度'"
                    :prop="'participationRate' + item"><template slot-scope="scoped">
ef16e57e   LH_PC   fix:前端版本迭代
107
108
                      {{ scoped.row["participationRate" + item] }}%
                    </template>
e5e4a3e6   梁保满   v1.3
109
                  </el-table-column>
f45b3c05   LH_PC   云平台新UI界面
110
111
112
                  <el-table-column align="center" :label="index == 0 ? '总正确率' : '正确率'"
                    :prop="'correctRate' + item"><template slot-scope="scoped">{{ scoped.row["correctRate" + item]
                      }}%</template>
e5e4a3e6   梁保满   v1.3
113
114
115
116
117
                  </el-table-column>
                </el-table-column>
              </el-table>
            </div>
            <div v-show="tabIndex == 3">
f45b3c05   LH_PC   云平台新UI界面
118
119
120
121
122
123
124
125
126
127
              <el-table id="print-content3" v-if="role == 'ROLE_JIAOSHI'" :max-height="tableMaxHeight" :data="tableData"
                border style="width: 100%">
                <el-table-column prop="studentCode" label="学号" fixed align="center"></el-table-column>
                <el-table-column prop="studentName" label="姓名" fixed align="center" width="100"></el-table-column>
                <el-table-column prop="rushAnswerTimes" label="抢答成功次数" sortable align="center"></el-table-column>
                <el-table-column prop="rushAnswerCorrectTimes" label="抢答答对次数" sortable align="center"></el-table-column>
                <el-table-column prop="checkAnswerTimes" label="抽答次数" sortable align="center"></el-table-column>
                <el-table-column prop="checkAnswerCorrectTimes" label="抽答答对次数" sortable align="center"></el-table-column>
                <el-table-column prop="interactionsNum" label="参与得分" sortable align="center"></el-table-column>
                <el-table-column prop="interactionsCorrectNum" label="对错得分" sortable align="center"></el-table-column>
e5e4a3e6   梁保满   v1.3
128
              </el-table>
f45b3c05   LH_PC   云平台新UI界面
129
130
131
132
133
134
              <el-table id="print-content3" v-else :max-height="tableMaxHeight" :data="tableData" border
                style="width: 100%">
                <el-table-column prop="studentCode" label="学号" align="center"></el-table-column>
                <el-table-column prop="studentName" label="姓名" align="center" width="100"></el-table-column>
                <el-table-column v-for="(item, index) in phaseInter" :key="index" :label="item" align="center">
                  <el-table-column align="center" v-if="index == 0" label="参与分" sortable :prop="'interactionsNum' + item">
e5e4a3e6   梁保满   v1.3
135
                  </el-table-column>
f45b3c05   LH_PC   云平台新UI界面
136
                  <el-table-column v-else align="center" label="互动数" :prop="'interactionsNum' + item">
e5e4a3e6   梁保满   v1.3
137
                  </el-table-column>
f45b3c05   LH_PC   云平台新UI界面
138
139
                  <el-table-column v-if="index == 0" align="center" label="对错分" sortable
                    :prop="'interactionsCorrectNum' + item">
e5e4a3e6   梁保满   v1.3
140
                  </el-table-column>
f45b3c05   LH_PC   云平台新UI界面
141
                  <el-table-column v-else align="center" label="参与数" :prop="'interactionsCorrectNum' + item">
e5e4a3e6   梁保满   v1.3
142
143
144
145
146
147
                  </el-table-column>
                </el-table-column>
              </el-table>
            </div>
          </div>
          <div class="pagination-box" v-show="tabIndex == 1">
f45b3c05   LH_PC   云平台新UI界面
148
149
            <el-pagination small="" layout="total,prev, pager, next" :hide-on-single-page="true" :total="total"
              @current-change="changePage" :current-page="page" :page-size="size">
e5e4a3e6   梁保满   v1.3
150
151
            </el-pagination>
          </div>
f45b3c05   LH_PC   云平台新UI界面
152
153
154
155
          <p class="down" v-if="(tabIndex == 3 || tabIndex == 2) && tableData.length">
            <el-button @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>
e5e4a3e6   梁保满   v1.3
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
          </p>
        </div>
      </div>
    </div>
  </template>
  
  <script>
  import { formatDate, downloadFile, tablePrint } from "utils";
  import BusEvent from "@/utils/busEvent";
  export default {
    data() {
      return {
        tableMaxHeight: 300,
        code: "",
        role: "",
        loading: false,
        date: "", //今天-昨天-本周
        query: {
          //搜索条件
          classId: "",
          subjectNames: "",
          startDay: "",
          endDay: "",
          day: "",
        },
        tabList: ["单课时报表", "阶段问答报表", "阶段互动报表"],
        custom: {
          //单课时排序
          orderField: null,
          orderType: null,
        },
        classList: [], //班级
        subjectList: [], //科目
        tabIndex: 1, //选项卡
        tableData: [],
        phaseOption: [], //问答补充数据
        phaseInter: [], //互动补充数据
        page: 1,
        size: 20,
        total: 0,
      };
    },
    async created() {
7812e986   梁保满   班主任查看报表添加额外信息
199
      this.code = this.$store.getters.csCode;
e5e4a3e6   梁保满   v1.3
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
      this.role =
        this.$store.getters.info.showRole ||
        this.$store.getters.info.permissions[0].role;
      this.query.subjectNames = this.role == "ROLE_BANZHUREN" ? [] : "";
      await this._QueryClassList();
      if (!this.query.classId) {
        return;
      }
      await this._QuerySubjectList();
      await this.setDate(1);
      let startDay = this.query?.startDay;
      if (!startDay) {
        this.query.startDay = new Date();
        this.query.endDay = new Date();
      }
    },
    activated() {
      const that = this;
      BusEvent.$on("keepAlive", async function () {
c3cdce9c   梁保满   bug
219
220
221
222
223
224
225
226
227
228
229
230
        that.query.subjectNames = that.role == "ROLE_BANZHUREN" ? [] : "";
        await that._QueryClassList();
        if (!that.query.classId) {
          return;
        }
        await that._QuerySubjectList();
        await that.setDate(1);
        let startDay = that.query?.startDay;
        if (!startDay) {
          that.query.startDay = new Date();
          that.query.endDay = new Date();
        }
e5e4a3e6   梁保满   v1.3
231
232
233
234
235
      });
    },
    methods: {
      print() {
        tablePrint(
ef16e57e   LH_PC   fix:前端版本迭代
236
237
238
239
          {
            id: "print-content",
            title: "随堂问-已归档" + this.tabList[this.tabIndex - 1]
          }
e5e4a3e6   梁保满   v1.3
240
241
242
243
244
245
246
247
        );
      },
      changeSub(val) {
        let sub;
        if (val && val.length) {
          let leng = val.length - 1;
          sub = val[leng];
        }
e5e4a3e6   梁保满   v1.3
248
249
250
251
252
253
254
255
256
        this.query.subjectNames = val.filter((item) => {
          return sub != "全部" ? item != "全部" : item == "全部";
        });
      },
      linkTo(obj) {
        //去详情
        this.$router.push({
          path: "/askAnalysis",
          query: {
3587d377   梁保满   归档流程调整
257
258
259
260
261
262
263
264
            id: JSON.stringify([obj.id]),
            types: 1,
            subjectNames: obj.subjectName,
            params: JSON.stringify({
              ...this.query,
              subjectNames: [this.query.subjectNames],
            }),
            className: this.$route.query.className,
e5e4a3e6   梁保满   v1.3
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
          },
        });
      },
      setDate(index) {
        const that = this;
        this.date = index == this.date ? "" : index;
        let aYear = new Date().getFullYear();
        let aMonth = new Date().getMonth() + 1;
        that.query.day = "";
        that.query.startDay = "";
        that.query.endDay = "";
        switch (index) {
          case 1:
            that.query.day = formatDate(new Date(), "yyyy-MM-dd");
            that.query.startDay = that.query.day;
            that.query.endDay = that.query.day;
            that.tabIndex = 1;
            break;
          case 2:
            let day = new Date().getDay();
            if (day == 0) {
              //中国式星期天是一周的最后一天
              day = 7;
            }
            day--;
            let aTime = new Date().getTime() - 24 * 60 * 60 * 1000 * day;
            that.query.startDay = formatDate(new Date(aTime), "yyyy-MM-dd");
            that.query.endDay = formatDate(new Date(), "yyyy-MM-dd");
            break;
          case 3:
            aMonth = aMonth < 10 ? "0" + aMonth : aMonth;
            that.query.startDay = `${aYear}-${aMonth}-01`;
            that.query.endDay = formatDate(new Date(), "yyyy-MM-dd");
            break;
          case 4:
            if (aMonth > 0 && aMonth < 4) {
              aMonth = "1";
            } else if (aMonth > 3 && aMonth < 7) {
              aMonth = "4";
            } else if (aMonth > 6 && aMonth < 10) {
              aMonth = "7";
            } else {
              aMonth = "10";
            }
  
            aMonth = aMonth < 10 ? "0" + aMonth : aMonth;
            that.query.startDay = `${aYear}-${aMonth}-01`;
            that.query.endDay = formatDate(new Date(), "yyyy-MM-dd");
            break;
        }
        this.page = 1;
        this._QueryData();
      },
      handleChangeTimeStart(val) {
        this.query.day = "";
        this.date = "";
        if (this.query.endDay) {
          if (new Date(val).getTime() > new Date(this.query.endDay).getTime()) {
            this.$message.error("任务结束时间不能任务开始时间前面,请重新设置");
            this.query.startDay = "";
          }
        }
      },
      handleChangeTimeEnd(val) {
        this.query.day = "";
        this.date = "";
        if (this.query.startDay) {
          if (new Date(val).getTime() < new Date(this.query.startDay).getTime()) {
            this.$message.error("任务结束时间不能任务开始时间前面,请重新设置");
            this.query.endDay = "";
          }
        }
      },
      tabChange() {
        this.tableMaxHeight = this.$refs.main.offsetHeight;
        this.page = 1;
        this.tableData = [];
        this._QueryData();
      },
      sortChange(obj) {
        this.custom.orderField =
          obj.prop == "participationRate"
            ? 1
            : obj.prop == "answerCorrectRate"
f45b3c05   LH_PC   云平台新UI界面
349
350
              ? 2
              : 3;
e5e4a3e6   梁保满   v1.3
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
        this.custom.orderType = obj.order == "ascending" ? 0 : 1;
        this.page = 1;
        this._QueryData();
      },
      changePage(page) {
        this.page = page;
        this._QueryData();
      },
      async changeclass() {
        await this._QuerySubjectList();
        this.page = 1;
        this._QueryData();
      },
      async changClazz() {
        await this._QuerySubjectList();
        // await this.setDate(1);
        this._QueryData();
      },
      async _QueryClassList() {
        const fetchClassList =
          this.role == "ROLE_BANZHUREN"
            ? this.$request.cTClassList
            : this.$request.tClassList;
        const { data, status, info } = await fetchClassList({ status: 1 });
        if (status === 0) {
          this.classList = data.list.map((item) => {
            return {
              value: item.classId,
              label: item.className,
            };
          });
          this.query.classId = this.classList[0]?.value;
        } else {
          this.$message.error(info);
        }
      },
      async _QuerySubjectList() {
        const fetchSubjectList =
          this.role == "ROLE_BANZHUREN"
            ? this.$request.cTSubjectList
            : this.$request.tSubjectList;
  
        const { data, status, info } = await fetchSubjectList({
          classId: this.query.classId,
          status: 1,
        });
        if (status === 0) {
          this.subjectList =
            data.subjectNames?.map((item) => {
              return {
                value: item,
                label: item,
              };
            }) || [];
          if (this.role == "ROLE_BANZHUREN") {
            this.subjectList.unshift({
              value: "全部",
              label: "全部",
            });
            this.query.subjectNames.push(this.subjectList[0]?.value);
          } else {
            this.query.subjectNames = this.subjectList[0]?.value;
          }
        } else {
          this.$message.error(info);
        }
      },
      async _QueryData() {
c3cdce9c   梁保满   bug
419
420
421
        if (!this.query.classId) {
          return;
        }
e5e4a3e6   梁保满   v1.3
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
        if (this.tabIndex == 1) {
          this.periodReportList();
        } else if (this.tabIndex == 2) {
          this.phaseAnswerReport();
        } else if (this.tabIndex == 3) {
          this.phaseInteractiveReport();
        }
      },
      //分页查询课时报表列表
      async periodReportList() {
        this.loading = true;
        let query = {};
        for (let key in this.query) {
          if (this.query[key] != "") {
            query[key] = this.query[key];
          }
        }
        if (this.custom.orderField !== null) {
          query = { ...query, ...this.custom };
        }
        if (this.role != "ROLE_BANZHUREN") {
          query.subjectNames = [query.subjectNames];
        } else {
          if (
            query["subjectNames"] &&
            query["subjectNames"].length == 1 &&
            query["subjectNames"][0] == "全部"
          ) {
            query["subjectNames"] = this.subjectList.map((item) => {
              return item.value;
            });
            query["subjectNames"].shift();
          }
          if (!query["subjectNames"]) {
            this.$message.warning("请选择科目");
            return;
          }
        }
        const { data, status, info } = await this.$request.periodReportList({
          ...query,
          page: this.page,
          size: this.size,
72b9bb79   梁保满   归档问题
464
          status: 1,
e5e4a3e6   梁保满   v1.3
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
        });
        this.loading = false;
        if (status === 0) {
          this.tableData = (data?.list && [...data?.list]) || [];
          this.total = data?.count || 0;
        } else {
          this.$message.error(info);
        }
      },
      //查询阶段问答报表
      async phaseAnswerReport() {
        this.loading = true;
        let query = {};
        for (let key in this.query) {
          if (this.query[key] != "") {
            if (key == "subjectNames" && this.role != "ROLE_BANZHUREN") {
              query["subjectName"] = this.query[key];
3587d377   梁保满   归档流程调整
482
483
            } else if (key == "classId") {
              query.classIds = [query.classId];
e5e4a3e6   梁保满   v1.3
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
            } else {
              query[key] = this.query[key];
            }
          }
        }
        if (this.role == "ROLE_BANZHUREN") {
          if (
            query["subjectNames"] &&
            query["subjectNames"].length == 1 &&
            query["subjectNames"][0] == "全部"
          ) {
            query["subjectNames"] = this.subjectList.map((item) => {
              return item.value;
            });
            query["subjectNames"].shift();
          }
          if (!query["subjectNames"]) {
            this.$message.warning("请选择科目");
            return;
          }
        }
3587d377   梁保满   归档流程调整
505
  
e5e4a3e6   梁保满   v1.3
506
507
508
509
510
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
560
561
        const phaseAnswerReport =
          this.role == "ROLE_BANZHUREN"
            ? this.$request.cTPhaseAnswerReport
            : this.$request.phaseAnswerReport;
  
        const { data, status, info } = await phaseAnswerReport({
          ...query,
        });
        this.loading = false;
        if (status === 0) {
          if (this.role == "ROLE_BANZHUREN") {
            let subjectName = [];
            let tableData = data?.list.map((item) => {
              let params = {};
              item.dataList.map((items, index) => {
                if (!subjectName.includes(items.subjectName)) {
                  subjectName.push(items.subjectName);
                }
                params["answerCorrectRate" + items.subjectName] =
                  items.answerCorrectRate;
                params["correctRate" + items.subjectName] = items.correctRate;
                params["participationRate" + items.subjectName] =
                  items.participationRate;
                params["periodCount" + items.subjectName] = items.periodCount;
                params["questionNum" + items.subjectName] = items.questionNum;
              });
              return {
                ...item,
                ...params,
              };
            });
            this.phaseOption = [...subjectName];
            this.tableData = tableData.sort((a, b) => {
              return a.studentCode - b.studentCode;
            });
          } else {
            this.tableData =
              (data?.list &&
                [...data?.list].sort((a, b) => {
                  return a.studentCode - b.studentCode;
                })) ||
              [];
          }
          this.total = data.count;
        } else {
          this.$message.error(info);
        }
      },
      //查询阶段互动报表
      async phaseInteractiveReport() {
        this.loading = true;
        let query = {};
        for (let key in this.query) {
          if (this.query[key] != "") {
            if (key == "subjectNames" && this.role != "ROLE_BANZHUREN") {
              query["subjectName"] = this.query[key];
3587d377   梁保满   归档流程调整
562
563
            } else if (key == "classId") {
              query.classIds = [query.classId];
e5e4a3e6   梁保满   v1.3
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
            } else {
              query[key] = this.query[key];
            }
          }
        }
        if (this.role == "ROLE_BANZHUREN") {
          if (
            query["subjectNames"] &&
            query["subjectNames"].length == 1 &&
            query["subjectNames"][0] == "全部"
          ) {
            query["subjectNames"] = this.subjectList.map((item) => {
              return item.value;
            });
            query["subjectNames"].shift();
          }
          if (!query["subjectNames"]) {
            this.$message.warning("请选择科目");
            return;
          }
        }
        const phaseInteractiveReport =
          this.role == "ROLE_BANZHUREN"
            ? this.$request.cTPhaseInteractiveReport
            : this.$request.phaseInteractiveReport;
  
        const { data, status, info } = await phaseInteractiveReport({
          ...query,
        });
        this.loading = false;
        if (status === 0) {
          if (this.role == "ROLE_BANZHUREN") {
            let subjectName = [];
            let tableData = data?.list.map((item) => {
              let params = {};
              item.dataList.map((items, index) => {
                if (!subjectName.includes(items.subjectName)) {
                  subjectName.push(items.subjectName);
                }
                params["interactionsNum" + items.subjectName] =
                  items.interactionsNum;
                params["interactionsCorrectNum" + items.subjectName] =
                  items.interactionsCorrectNum;
              });
              return {
                ...item,
                ...params,
              };
            });
            this.phaseInter = [...subjectName];
            this.tableData = tableData.sort((a, b) => {
              return a.studentCode - b.studentCode;
            });
          } else {
            this.tableData =
              (data?.list &&
                [...data?.list].sort((a, b) => {
                  return a.studentCode - b.studentCode;
                })) ||
              [];
          }
          this.total = data.count;
        } else {
          this.$message.error(info);
        }
      },
      //导出
      async exportData() {
        if (this.exportLoading == true) return;
        let query = {};
        for (let key in this.query) {
          if (this.query[key] != "") {
            if (key == "subjectNames" && this.role != "ROLE_BANZHUREN") {
              query["subjectName"] = this.query[key];
            } else {
              query[key] = this.query[key];
            }
          }
        }
        if (this.role == "ROLE_BANZHUREN") {
          if (
            query["subjectNames"] &&
            query["subjectNames"].length == 1 &&
            query["subjectNames"][0] == "全部"
          ) {
            query["subjectNames"] = this.subjectList.map((item) => {
              return item.value;
            });
            query["subjectNames"].shift();
          }
          if (!query["subjectNames"]) {
            this.$message.warning("请选择科目");
            return;
          }
        }
        this.exportLoading = true;
        let exportData;
        if (this.role == "ROLE_BANZHUREN") {
          exportData =
            this.tabIndex == 2
              ? this.$request.cTExportPhaseAnswerReport
              : this.$request.cTExportPhaseInteractiveReport;
        } else {
          exportData =
            this.tabIndex == 2
              ? this.$request.exportPhaseAnswerReport
              : this.$request.exportPhaseInteractiveReport;
        }
        const data = await exportData({ ...query });
        this.exportLoading = false;
        if (data) {
          let blob = new Blob([data], {
            type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
          });
          downloadFile("随堂问-已归档阶段报表.xlsx", blob);
        } else {
          this.$message.error("下载失败");
        }
      },
    },
  };
  </script>
  <style>
  div::-webkit-scrollbar {
    width: 3px;
    height: 10px;
  }
f45b3c05   LH_PC   云平台新UI界面
691
  
e5e4a3e6   梁保满   v1.3
692
693
694
695
696
697
698
699
700
  div::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #ccc;
  }
  </style>
  <style lang="scss" scoped>
  .main {
    height: 100%;
  }
f45b3c05   LH_PC   云平台新UI界面
701
  
e5e4a3e6   梁保满   v1.3
702
703
704
705
706
  .table-box {
    margin: 0 20px;
    padding: 16px;
    background: #f8f8f8;
    border-radius: 5px;
f45b3c05   LH_PC   云平台新UI界面
707
  
e5e4a3e6   梁保满   v1.3
708
709
710
    .table-cont {
      min-height: 300px;
    }
f45b3c05   LH_PC   云平台新UI界面
711
  
e5e4a3e6   梁保满   v1.3
712
713
714
    :deep(.fa-arrow-right) {
      padding-left: 2px;
    }
f45b3c05   LH_PC   云平台新UI界面
715
  
e5e4a3e6   梁保满   v1.3
716
717
718
719
720
721
722
723
724
725
726
    :deep(.fa-file-text) {
      padding-left: 2px;
    }
  }
  
  .fa-exchange {
    color: #667ffd;
    cursor: pointer;
    font-size: 16px;
    margin-left: 10px;
  }
f45b3c05   LH_PC   云平台新UI界面
727
  
e5e4a3e6   梁保满   v1.3
728
729
730
731
732
  .dia-btn {
    border-radius: 20px;
    margin: 0 20px;
    padding: 10px 20px;
  }
f45b3c05   LH_PC   云平台新UI界面
733
  
e5e4a3e6   梁保满   v1.3
734
735
736
  .dia-tips {
    padding-bottom: 10px;
  }
f45b3c05   LH_PC   云平台新UI界面
737
  
e5e4a3e6   梁保满   v1.3
738
739
740
741
742
743
744
745
746
747
748
  .dia-question-box {
    padding: 16px 16px 1px;
    background: #f8f8f8;
    border-radius: 10px;
  
    .answer-s {
      width: 36px;
      height: 28px;
      cursor: pointer;
    }
  }
f45b3c05   LH_PC   云平台新UI界面
749
  
e5e4a3e6   梁保满   v1.3
750
751
752
753
  .set-questions {
    display: flex;
    margin-bottom: 12px;
    width: 100%;
f45b3c05   LH_PC   云平台新UI界面
754
  
e5e4a3e6   梁保满   v1.3
755
756
757
758
    .qs-num {
      flex-shrink: 0;
      margin-right: 10px;
    }
f45b3c05   LH_PC   云平台新UI界面
759
  
e5e4a3e6   梁保满   v1.3
760
761
    .qs-options {
      flex: 1;
f45b3c05   LH_PC   云平台新UI界面
762
  
e5e4a3e6   梁保满   v1.3
763
764
765
766
      .ipt {
        margin-bottom: 5px;
      }
    }
f45b3c05   LH_PC   云平台新UI界面
767
  
e5e4a3e6   梁保满   v1.3
768
769
770
771
772
773
    .delButton {
      border-color: #ff6868;
      background: #ff6868 url("../../../assets/images/arrow.png") no-repeat center;
      background-size: 19px;
      color: transparent;
    }
f45b3c05   LH_PC   云平台新UI界面
774
  
e5e4a3e6   梁保满   v1.3
775
776
777
778
779
780
    .ac {
      border-color: #ff6868;
      background: #ff6868;
      color: #fff;
    }
  }
f45b3c05   LH_PC   云平台新UI界面
781
  
e5e4a3e6   梁保满   v1.3
782
783
784
785
  .down {
    padding-top: 16px;
  }
  </style>