update scoreStatistic

src/modules/oe/views/scoreStatistic.vue

@@ -6,7 +6,7 @@
           v-model="searchParams.examId"
           filterable
           remote
-          :remote-method="getExams"
+          :remote-method="getExamList"
           clearable
           placeholder="请选择考试"
           size="small"
@@ -20,33 +20,16 @@
           ></el-option>
         </el-select>
       </el-form-item>
-      <el-form-item label="课程" label-width="70px" label-position="right">
-        <el-select
-          v-model="searchParams.courseId"
-          class="form_search_width"
-          clearable
-          filterable
-          placeholder="请选择课程"
-          size="small"
-        >
-          <el-option
-            v-for="item in courseList"
-            :key="item.id"
-            :label="item.name"
-            :value="item.id"
-          ></el-option>
-        </el-select>
-      </el-form-item>
-      <el-button type="primary" :disabled="paramsMiss()" @click="searchHandler"
-        >查询</el-button
-      >
+
+      <!-- <el-button type="primary" :disabled="paramsMiss()" @click="searchHandler">查询</el-button>-->
+
       <el-button type="primary" :disabled="paramsMiss()" @click="countHandler"
         >刷新计算</el-button
       >
       <el-button
         type="primary"
         style="float: right"
-        :disabled="!searchParams.examId"
+        :disabled="paramsMiss()"
         @click="openDialog"
         >及格线设置</el-button
       >
@@ -54,13 +37,14 @@
 
     <div class="search-result flex">
       <div class="result-column">
-        <div class="title">批次整体统计</div>
         <div class="desc-item">
           应考人次： <span>{{ examResult.allCount }}</span>
         </div>
         <div class="desc-item">
           实考人次：<span> {{ examResult.finishCount }}</span>
         </div>
+      </div>
+      <div class="result-column">
         <div class="desc-item">
           缺考人次：<span> {{ examResult.unFinishCount }}</span>
         </div>
@@ -69,80 +53,109 @@
         </div>
       </div>
       <div class="result-column">
-        <div class="title">整体成绩概况</div>
         <div class="desc-item">
           及格人数：<span> {{ examResult.passScoreCount }}</span>
         </div>
         <div class="desc-item">
           及格率：<span> {{ examResult.passScoreRate }}</span>
         </div>
-        <div class="desc-item">
-          优秀人数：<span> {{ examResult.goodScoreCount }}</span>
-        </div>
-        <div class="desc-item">
-          优秀率：<span> {{ examResult.goodScoreRate }}</span>
-        </div>
       </div>
       <div class="result-column">
-        <div class="title">
-          批次整体统计：<span>{{ courseResult.courseName }}</span>
-        </div>
         <div class="desc-item">
-          应考人次： <span>{{ courseResult.allCount }}</span>
-        </div>
-        <div class="desc-item">
-          实考人次：<span> {{ courseResult.finishCount }}</span>
-        </div>
-        <div class="desc-item">
-          缺考人次：<span> {{ courseResult.unFinishCount }}</span>
+          优秀人数：<span> {{ examResult.goodScoreCount }}</span>
         </div>
         <div class="desc-item">
-          缺考率：<span> {{ courseResult.unFinishRate }}</span>
+          优秀率：<span> {{ examResult.goodScoreRate }}</span>
         </div>
       </div>
       <div class="result-column">
-        <div class="title">科目成绩概况</div>
         <div class="desc-item">
-          及格人数：<span> {{ courseResult.passScoreCount }}</span>
+          违纪人数：<span> {{ examResult.illegalityCount }}</span>
         </div>
         <div class="desc-item">
-          及格率： <span>{{ courseResult.passScoreRate }}</span>
-        </div>
-        <div class="desc-item">
-          优秀人数： <span>{{ courseResult.goodScoreCount }}</span>
-        </div>
-        <div class="desc-item">
-          优秀率：<span> {{ courseResult.goodScoreRate }}</span>
+          违纪率：<span> {{ examResult.illegalityRate }}</span>
         </div>
       </div>
     </div>
 
-    <el-form :inline="true">
-      <el-form-item label="学习中心统计：">
-        <el-select v-model="subOrgId" clearable @change="filterSubOrg">
-          <el-option
-            v-for="item in orgOptions"
-            :key="item.id"
-            :label="item.name"
-            :value="item.id"
-          ></el-option>
-        </el-select>
-      </el-form-item>
+    <el-tabs type="border-card">
+      <el-tab-pane label="学习中心统计">
+        <el-form :inline="true">
+          <el-form-item label="">
+            <el-select
+              v-model="searchParams.orgId"
+              placeholder="请选择学习中心"
+              clearable
+              @change="changeOrg"
+            >
+              <el-option
+                v-for="item in orgList"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
+              ></el-option>
+            </el-select>
+          </el-form-item>
 
-      <el-button type="primary" :disabled="paramsMiss()" @click="exportExcel"
-        >导出</el-button
-      >
-    </el-form>
+          <el-button
+            type="primary"
+            :disabled="paramsMiss()"
+            @click="orgExportExcel"
+            >导出</el-button
+          >
+        </el-form>
 
-    <el-table :data="tableData" style="margin-top: 10px">
-      <el-table-column
-        v-for="(item, index) in tableColumns"
-        :key="index"
-        :label="item.label"
-        :prop="item.prop"
-      >
-      </el-table-column>
-    </el-table>
+        <el-table :data="orgTableData" style="margin-top: 10px">
+          <el-table-column
+            v-for="(item, index) in orgTableColumns"
+            :key="index"
+            :label="item.label"
+            :prop="item.prop"
+          >
+          </el-table-column>
+        </el-table>
+      </el-tab-pane>
+
+      <el-tab-pane label="课程统计">
+        <el-form :inline="true">
+          <el-form-item label="">
+            <el-select
+              v-model="searchParams.courseId"
+              class="form_search_width"
+              clearable
+              filterable
+              placeholder="请选择课程"
+              size="small"
+              @change="changeCourse"
+            >
+              <el-option
+                v-for="item in courseList"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+
+          <el-button
+            type="primary"
+            :disabled="paramsMiss()"
+            @click="courseExportExcel"
+            >导出</el-button
+          >
+        </el-form>
+
+        <el-table :data="courseTableData" style="margin-top: 10px">
+          <el-table-column
+            v-for="(item, index) in courseTableColumns"
+            :key="index"
+            :label="item.label"
+            :prop="item.prop"
+          >
+          </el-table-column>
+        </el-table>
+      </el-tab-pane>
+    </el-tabs>
 
     <el-dialog
       ref="dialog"
@@ -224,13 +237,11 @@ import { mapState } from "vuex";
 export default {
   data() {
     return {
-      dialogLoading: false,
-      searchParams: {
-        examId: "",
-        courseId: "",
-      },
-      subOrgId: "",
+      counting: false,
+      setLineLoading: false,
       visible: false,
+      dialogLoading: false,
+      dialogChecked: false,
       originDialogTableData: [],
       dialogTableData: [],
       dialogTableColumns: [
@@ -238,33 +249,16 @@ export default {
         { label: "及格线", prop: "passScoreLine" },
         { label: "优秀线", prop: "goodScoreLine" },
       ],
-      originTableData: [],
-      tableData: [],
-      tableColumns: [
-        { label: "学习中心", prop: "orgName" },
-        { label: "应考", prop: "allCount" },
-        { label: "实考", prop: "finishCount" },
-        { label: "缺考", prop: "unFinishCount" },
-        { label: "缺考率", prop: "unFinishRate" },
-        { label: "及格人数", prop: "passScoreCount" },
-        { label: "及格率", prop: "passScoreRate" },
-        { label: "优秀人数", prop: "goodScoreCount" },
-        { label: "优秀率", prop: "goodScoreRate" },
-      ],
+      searchParams: {
+        examId: "",
+        courseId: "",
+        orgId: "",
+      },
       examList: [],
       courseList: [],
+      orgList: [],
       examResult: {
-        courseName: "",
-        allCount: "",
-        finishCount: "",
-        unFinishCount: "",
-        unFinishRate: "",
-        passScoreCount: "",
-        passScoreRate: "",
-        goodScoreCount: "",
-        goodScoreRate: "",
-      },
-      courseResult: {
+        examName: "",
         allCount: "",
         finishCount: "",
         unFinishCount: "",
@@ -273,48 +267,53 @@ export default {
         passScoreRate: "",
         goodScoreCount: "",
         goodScoreRate: "",
+        illegalityCount: "",
+        illegalityRate: "",
       },
-      orgOptions: [],
-      dialogChecked: false,
-      counting: false,
-      setLineLoading: false,
+      orgTableData: [],
+      orgTableColumns: [
+        { label: "学习中心", prop: "orgName" },
+        { label: "应考", prop: "allCount" },
+        { label: "实考", prop: "finishCount" },
+        { label: "缺考", prop: "unFinishCount" },
+        { label: "缺考率", prop: "unFinishRate" },
+        { label: "及格人数", prop: "passScoreCount" },
+        { label: "及格率", prop: "passScoreRate" },
+        { label: "优秀人数", prop: "goodScoreCount" },
+        { label: "优秀率", prop: "goodScoreRate" },
+        { label: "违纪人数", prop: "illegalityCount" },
+        { label: "违纪率", prop: "illegalityRate" },
+      ],
+      courseTableData: [],
+      courseTableColumns: [
+        { label: "课程代码", prop: "courseCode" },
+        { label: "课程名称", prop: "courseName" },
+        { label: "应考", prop: "allCount" },
+        { label: "实考", prop: "finishCount" },
+        { label: "缺考", prop: "unFinishCount" },
+        { label: "缺考率", prop: "unFinishRate" },
+        { label: "及格人数", prop: "passScoreCount" },
+        { label: "及格率", prop: "passScoreRate" },
+        { label: "优秀人数", prop: "goodScoreCount" },
+        { label: "优秀率", prop: "goodScoreRate" },
+        { label: "违纪人数", prop: "illegalityCount" },
+        { label: "违纪率", prop: "illegalityRate" },
+      ],
     };
   },
   computed: {
     ...mapState({ user: (state) => state.user }),
   },
   created() {
-    this.getExams();
+    this.getExamList();
     this.getOrgList();
   },
 
   methods: {
     paramsMiss() {
-      return !this.searchParams.examId || !this.searchParams.courseId;
-    },
-    filterSubOrg() {
-      if (!this.subOrgId) {
-        this.tableData = this.originTableData;
-      } else {
-        this.tableData = this.originTableData.filter(
-          (item) => item.orgId == this.subOrgId
-        );
-      }
-    },
-    getOrgList() {
-      this.$http
-        .get("/api/ecs_core/org/query", {
-          params: { name: "", rootOrgId: this.user.rootOrgId, enable: true },
-        })
-        .then((res) => {
-          this.orgOptions = res.data;
-        });
-    },
-    openDialog() {
-      this.getDialogData();
-      this.visible = true;
+      return !this.searchParams.examId;
     },
-    getExams(examName) {
+    getExamList(examName) {
       if (!examName) {
         examName = "";
       }
@@ -330,7 +329,16 @@ export default {
           this.examList = response.data;
         });
     },
-    getCourses() {
+    getOrgList() {
+      this.$http
+        .get("/api/ecs_core/org/query", {
+          params: { name: "", rootOrgId: this.user.rootOrgId, enable: true },
+        })
+        .then((res) => {
+          this.orgList = res.data;
+        });
+    },
+    getCourseList() {
       this.courseList = [];
       this.searchParams.courseId = "";
       var examId = this.searchParams.examId;
@@ -341,7 +349,6 @@ export default {
         .get("/api/ecs_oe_admin/exam/student/findCoursesByExamIdAndOrgId", {
           params: {
             examId: examId,
-            // orgId: this.user.rootOrgId,
           },
         })
         .then((response) => {
@@ -349,54 +356,95 @@ export default {
         });
     },
     searchHandler() {
-      this.getStatisticInfo();
-      this.getTableData();
+      this.getStatisticForExam();
+      this.getStatisticForOrg();
+      this.getStatisticForCourse();
     },
-    countHandler() {
-      this.counting = true;
-      this.$http
-        .post(
-          "/api/ecs_oe_admin/exam/statistic/overview/refresh",
-          {},
-          {
-            params: {
-              courseId: this.searchParams.courseId,
-              examId: this.searchParams.examId,
-            },
-          }
-        )
-        .then(() => {
-          this.counting = false;
-          this.searchHandler();
-        });
+    changeExam() {
+      this.getCourseList();
+      this.getStatisticForExam();
+      this.getStatisticForOrg();
+      this.getStatisticForCourse();
     },
-    getStatisticInfo() {
-      const { examId, courseId } = this.searchParams;
+    changeOrg() {
+      this.getStatisticForOrg();
+    },
+    changeCourse() {
+      this.getStatisticForCourse();
+    },
+    getStatisticForExam() {
+      const { examId } = this.searchParams;
       this.$http
-        .post("/api/ecs_oe_admin/exam/statistic/overview", null, {
+        .post("/api/ecs_oe_admin/exam/statistic/overview/for/exam", null, {
           params: {
             examId,
-            courseId,
           },
           headers: { "content-type": "application/x-www-form-urlencoded" },
         })
         .then((res) => {
-          Object.assign(this.examResult, res.data.examResult || {});
-          Object.assign(this.courseResult, res.data.courseResult || {});
+          Object.assign(this.examResult, res.data || {});
         });
     },
-    getTableData() {
-      const { examId, courseId } = this.searchParams;
+
+    getStatisticForOrg() {
+      const { examId, orgId } = this.searchParams;
       this.$http
         .post("/api/ecs_oe_admin/exam/statistic/overview/for/org", null, {
+          params: { examId, orgId },
+          headers: { "content-type": "application/x-www-form-urlencoded" },
+        })
+        .then((res) => {
+          this.orgTableData = res.data || [];
+        });
+    },
+
+    getStatisticForCourse() {
+      const { examId, courseId } = this.searchParams;
+      this.$http
+        .post("/api/ecs_oe_admin/exam/statistic/overview/for/course", null, {
           params: { examId, courseId },
           headers: { "content-type": "application/x-www-form-urlencoded" },
         })
         .then((res) => {
-          this.tableData = res.data || [];
-          this.originTableData = JSON.parse(JSON.stringify(res.data || []));
+          this.courseTableData = res.data || [];
         });
     },
+    orgExportExcel() {
+      const { examId, orgId } = this.searchParams;
+      let key = this.user.key;
+      let token = this.user.token;
+      let url = `/api/ecs_oe_admin/exam/statistic/overview/for/org/export?examId=${examId}&orgId=${orgId}&$key=${key}&$token=${token}`;
+      location.href = url;
+    },
+    courseExportExcel() {
+      const { examId, courseId } = this.searchParams;
+      let key = this.user.key;
+      let token = this.user.token;
+      let url = `/api/ecs_oe_admin/exam/statistic/overview/for/course/export?examId=${examId}&courseId=${courseId}&$key=${key}&$token=${token}`;
+      location.href = url;
+    },
+    countHandler() {
+      this.counting = true;
+      this.$http
+        .post(
+          "/api/ecs_oe_admin/exam/statistic/overview/refresh",
+          {},
+          {
+            params: {
+              examId: this.searchParams.examId,
+            },
+          }
+        )
+        .then(() => {
+          this.counting = false;
+          this.searchHandler();
+        });
+    },
+
+    openDialog() {
+      this.getDialogData();
+      this.visible = true;
+    },
     resetDialogData() {
       this.getDialogData();
     },
@@ -422,17 +470,6 @@ export default {
           this.dialogLoading = false;
         });
     },
-    changeExam() {
-      this.getCourses();
-      // this.getDialogData();
-    },
-    exportExcel() {
-      const { examId, courseId } = this.searchParams;
-      let key = this.user.key;
-      let token = this.user.token;
-      let url = `/api/ecs_oe_admin/exam/statistic/overview/for/org/export?examId=${examId}&courseId=${courseId}&$key=${key}&$token=${token}`;
-      location.href = url;
-    },
     hasNumValue(val) {
       return !!val || val === 0;
     },