From 881a7e55a938ea64823d6d7d11e79e250aac9b2c Mon Sep 17 00:00:00 2001
From: 梁保满 <lbm@liangbaomandeMacBook-Pro.local>
Date: Fri, 15 Dec 2023 16:11:51 +0800
Subject: [PATCH] 多班对比

---
 src/views/basic/test/contrast.vue | 596 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 596 insertions(+), 0 deletions(-)
 create mode 100644 src/views/basic/test/contrast.vue

diff --git a/src/views/basic/test/contrast.vue b/src/views/basic/test/contrast.vue
new file mode 100644
index 0000000..cfe1429
--- /dev/null
+++ b/src/views/basic/test/contrast.vue
@@ -0,0 +1,596 @@
+<template>
+  <div ref="main" class="page-container">
+    <back-box>
+      <template slot="title">
+        <span>多班_{{ subjectNames }}_{{ title }}_测练成绩对比分析</span>
+      </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>
+        <el-button class="setMinScore" @click="openDia" round size="small"
+          >对比成绩等级设置</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="序号"
+            fixed
+            align="center"
+            width="60"
+          ></el-table-column>
+          <el-table-column
+            prop="className"
+            label="班级"
+            align="center"
+            fixed
+          ></el-table-column>
+          <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>
+          <el-table-column
+            prop="percent"
+            label="参与度"
+            align="center"
+          ></el-table-column>
+          <el-table-column
+            prop="avg"
+            label="班平均分"
+            align="center"
+          ></el-table-column>
+          <el-table-column
+            prop="max"
+            label="班最高分"
+            sortable
+            align="center"
+          ></el-table-column>
+          <el-table-column
+            prop="min"
+            label="班最低分"
+            sortable
+            align="center"
+          ></el-table-column>
+
+          <el-table-column
+            v-for="(item, index) in defaultLevels.levels"
+            :label="item[0] + '数(率)'"
+            align="center"
+            ><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
+          >
+        </el-table>
+        <el-table
+          v-show="type == 1"
+          :max-height="tableMaxHeight"
+          :data="tableData2"
+          border
+          style="width: 100%"
+        >
+          <el-table-column
+            prop="rank"
+            label="排名"
+            sortable
+            align="center"
+          ></el-table-column>
+          <el-table-column
+            prop="name"
+            label="姓名"
+            align="center"
+          ></el-table-column>
+          <el-table-column
+            prop="className"
+            label="班级"
+            align="center"
+          ></el-table-column>
+          <el-table-column
+            prop="score"
+            label="总分"
+            sortable
+            align="center"
+          ></el-table-column>
+          <el-table-column
+            prop="levelName"
+            label="成绩等级"
+            align="center"
+          ></el-table-column>
+        </el-table>
+      </div>
+      <div class="down">
+        <div>
+          <el-button
+            v-loading="exportLoading"
+            @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"
+        width="800px"
+        @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"
+              >
+                <el-option label="优良合格不合格" :value="0"></el-option>
+                <el-option label="ABCD" :value="1"></el-option>
+                <el-option label="自定义" :value="2"></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="等级设置模式：" class="use-form-item">
+              <el-select size="small" v-model="fromData.levelType">
+                <el-option label="按分数比例" :value="0"></el-option>
+                <el-option label="按已考人数比例" :value="1"></el-option>
+              </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>
+                <span class="item3"><i>*</i>等级最高</span>
+                <span class="item3"><i>*</i>等级最低</span>
+                <span class="item"></span>
+              </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"
+                    @keydown.native="keydownRange($event)"
+                  ></el-input>
+                </p>
+                <p class="item3">
+                  <el-input
+                    class="score-ipt"
+                    type="number"
+                    v-model="item[1]"
+                    :min="item[2]"
+                    :max="index == 0 ? 100 : fromData.levels[index - 1][2]"
+                    @keydown.native="keydownRange($event)"
+                  ></el-input>
+                  %
+                  <template v-if="fromData.levelType == 0">
+                    ({{ index != 0 ? "不含" : ""
+                    }}{{
+                      Number(((item[1] / 100) * examPaperScore).toFixed(1))
+                    }}分)
+                  </template>
+                  <template v-else>{{ index != 0 ? "不含" : "" }}</template>
+                </p>
+                <p>~</p>
+                <p class="item3">
+                  <el-input
+                    class="score-ipt"
+                    type="number"
+                    v-model="item[2]"
+                    :min="0"
+                    :max="item[1]"
+                    @keydown.native="keydownRange($event)"
+                  ></el-input>
+                  %
+                  <template v-if="fromData.levelType == 0">
+                    ({{
+                      Number(((item[2] / 100) * examPaperScore).toFixed(1))
+                    }}分)
+                  </template>
+                </p>
+                <p class="item">
+                  <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,
+      exportLoading: false,
+      diaLogBox: false,
+      fromData: {
+        type: 0,
+        levelType: 0,
+        levels: [
+          ["优秀", 100, 90],
+          ["良好", 89.9, 70],
+          ["合格", 69.9, 60],
+          ["不合格", 59.9, 0],
+        ],
+      },
+      defaultLevels: {
+        levelType: 0,
+        levels: [],
+      },
+      tableMaxHeight: 600,
+      tableData: [],
+      tableData2: [],
+      examPaperScore: 100, //卷面最高分
+    };
+  },
+  async created() {
+    this.ids = this.$route.query.ids;
+    await this._QueryData();
+    await this._QueryDefaultLevels();
+  },
+  destroyed() {
+    sessionStorage.setItem("levelFromData", "");
+  },
+  methods: {
+    // 禁止输入负数
+    keydownRange(event) {
+      if (event.key == "-" || event.key == "e") {
+        event.returnValue = "";
+      }
+    },
+    print() {
+      tablePrint(
+        "print-content",
+        `多班_${this.subjectNames}_${this.title}_测练成绩对比分析`
+      );
+    },
+    setType(type) {
+      console.log(this.$refs.main.offsetHeight - 50);
+      this.tableMaxHeight = this.$refs.main.offsetHeight;
+      this.type = type;
+    },
+    openDia() {
+      this.diaLogBox = true;
+    },
+    closeDia() {
+      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 {
+        this.fromData.type = 0;
+        this.fromData.levelType = this.defaultLevels.levelType;
+        this.fromData.levels = [...this.defaultLevels.levels];
+      }
+    },
+    changeType(val) {
+      if (val == this.defaultLevels.type) {
+        this.fromData.levels = [...this.defaultLevels.levels];
+      } else {
+        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]];
+          });
+        }
+      }
+    },
+    savefrom() {
+      for (let i = 0; i < this.fromData.levels.length; i++) {
+        if (this.fromData.levels[i].includes("")) {
+          this.$message.warning("请补全编号" + (i + 1) + "设置信息！");
+          return;
+        }
+      }
+      if (this.fromData.levels.length == 0) {
+        this.$message.warning("请添加等级设置！");
+        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++) {
+        if (nums[i + 1] && nums[i + 1] > nums[i]) {
+          ERR_OK = true;
+          this.$message.warning("高等级比例不能低于低等级比例！请检查");
+          break;
+        }
+      }
+      if (ERR_OK) return;
+      this.tableData = [];
+      this.tableData2 = [];
+      this.defaultLevels.type = this.fromData.type;
+      this.defaultLevels.levelType = this.fromData.levelType;
+      this.defaultLevels.levels = [...this.fromData.levels];
+      sessionStorage.setItem("levelFromData", JSON.stringify(this.fromData));
+      this.diaLogBox = false;
+      this._QueryData({
+        levelType: this.fromData.levelType,
+        levels: this.fromData.levels,
+      });
+    },
+
+    async _QueryDefaultLevels() {
+      const { data, info, status } = await this.$request.defaultLevels();
+      if (status === 0) {
+        this.defaultLevels = { ...data } || {
+          levelType: 0,
+          levels: [
+            ["优秀", 100, 90],
+            ["良好", 89.9, 70],
+            ["合格", 69.9, 60],
+            ["不合格", 59.9, 0],
+          ],
+        };
+        this.defaultLevels.type = 0
+        this.fromData.levelType = this.defaultLevels.levelType;
+        this.fromData.levels = [...this.defaultLevels.levels];
+        sessionStorage.setItem(
+          "levelFromData",
+          JSON.stringify(this.defaultLevels)
+        );
+      } else {
+        this.$message.error(info);
+      }
+    },
+    async _QueryData(params) {
+      let query = {};
+      if (params) {
+        let paramObj = JSON.parse(JSON.stringify(params))
+        if (paramObj.levelType == 0) {
+          paramObj.levels = paramObj.levels.map((item) => {
+            item[1] = ((item[1] / 100) * this.examPaperScore).toFixed(1);
+            item[2] = ((item[2] / 100) * this.examPaperScore).toFixed(1);
+            return item;
+          });
+        }
+        query = { ...paramObj };
+      }
+      const { data, info, status } = await this.$request.examMultiClassReport({
+        examIds: this.ids,
+        ...query,
+      });
+      if (status === 0) {
+        this.title = data.title;
+        this.examPaperScore = data.examPaperScore || 100;
+        this.subjectNames = data.subjectName;
+        this.tableData = data.classes || [];
+        this.tableData2 =
+          data.students.map((item) => {
+            item.score = Number(item.score);
+            return item;
+          }) || [];
+      } else {
+        this.$message.error(info);
+      }
+    },
+
+    //导出
+    async exportData() {
+      if (this.exportLoading == true) return;
+      this.exportLoading = true;
+      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;
+        });
+      }
+      const data = await this.$request.exportExamMultiReport({
+        examIds: this.ids,
+        levels: params.levels,
+        levelType: params.levelType,
+      });
+      this.exportLoading = false;
+      if (data) {
+        let blob = new Blob([data], {
+          type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+        });
+        downloadFile(
+          `多班_${this.subjectNames}_${this.title}_测练成绩对比分析`,
+          blob
+        );
+      } 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;
+      right: 0;
+    }
+  }
+  .page-content {
+    padding: 20px 20px 0;
+  }
+}
+.tab-box {
+  width: 400px;
+  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;
+    .item {
+      width: 40px;
+    }
+    .item1 {
+      padding-left: 10px;
+      width: 10%;
+    }
+    .item2 {
+      width: 18%;
+    }
+    .item3 {
+      padding-left: 12px;
+      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;
+    }
+  }
+}
+.p1 {
+  line-height: 18px;
+}
+</style>
\ No newline at end of file
--
libgit2 0.21.4