调卷详情页面改造

src/modules/questions/views/ExtractPaperInfo.vue

@@ -11,7 +11,7 @@
         ref="extractPaperForm"
         :inline="true"
         :model="extractConfig"
-        label-position="right"
+        label-position="left"
         label-width="120px"
       >
         <el-row>
@@ -61,196 +61,299 @@
               <el-radio-group
                 v-model="extractConfig.callType"
                 class="pull_right_ss"
+                disabled
               >
                 <el-radio label="WHOLE_SET">成套调用</el-radio>
+                <el-radio label="RANDOM_PAPER">随机抽题</el-radio>
                 <!-- <el-radio label="RESTRUCT">重组调用</el-radio> -->
               </el-radio-group>
             </el-form-item>
           </el-tab-pane>
         </el-tabs>
-        <el-tabs v-model="tabs">
-          <el-tab-pane label="步骤二：试卷抽取比例" name="first">
-            <el-row>
-              <el-col :span="24">
-                <el-tag v-if="extractConfig.examType === 'TRADITION'"
-                  >传统考试</el-tag
+        <template v-if="extractConfig.callType === 'WHOLE_SET'">
+          <el-tabs v-model="tabs">
+            <el-tab-pane label="步骤二：试卷抽取比例" name="first">
+              <el-row>
+                <el-col :span="24">
+                  <el-tag v-if="extractConfig.examType === 'TRADITION'"
+                    >传统考试</el-tag
+                  >
+                  <el-tag v-if="extractConfig.examType === 'ONLINE'"
+                    >在线考试</el-tag
+                  >
+                  <el-tag v-if="extractConfig.examType === 'PRACTICE'"
+                    >练习考试</el-tag
+                  >
+                </el-col>
+              </el-row>
+              <el-row v-for="(examPaper, num) in examPaperList" :key="num">
+                <el-col :span="24">
+                  <el-form-item label="试卷类型" class="pull-left">
+                    <el-input
+                      v-model="examPaper.groupCode"
+                      class="input_width_lg"
+                      placeholder="请输入试卷类型"
+                      disabled
+                    ></el-input>
+                  </el-form-item>
+                  <el-button
+                    v-if="extractConfig.examType != 'TRADITION'"
+                    type="primary"
+                    @click="addOnLinePaper(examPaper.groupCode)"
+                    ><i class="el-icon-plus"></i> 新增试卷
+                  </el-button>
+                </el-col>
+                <el-col
+                  v-for="(paperInfo, index) in examPaper.paperInfoList"
+                  :key="paperInfo.selectedPaperId"
+                  :span="20"
+                  :offset="2"
+                >
+                  <el-form-item>
+                    <span>试卷选定</span>
+                    <el-select
+                      v-model="paperInfo.paper.id"
+                      filterable
+                      placeholder="请选择"
+                      class="select_width_lg"
+                      @change="searchAudioTimeConfig"
+                    >
+                      <el-option
+                        v-for="item in paperList"
+                        :key="item.id"
+                        :label="item.name"
+                        :value="item.id"
+                      >
+                      </el-option>
+                    </el-select>
+                    <span>选取几率</span>
+                    <span>
+                      <el-input
+                        v-model="paperInfo.weight"
+                        class="input_width_sms"
+                        :disabled="extractConfig.examType === 'TRADITION'"
+                      ></el-input
+                      >%
+                      <i
+                        v-if="index > 0"
+                        class="el-icon-delete"
+                        @click.prevent="
+                          removePaperInfo(examPaper.groupCode, paperInfo)
+                        "
+                      ></i> </span
+                    >&nbsp;
+                    <span :class="'errorMsg_' + num + '_' + index"></span>
+                  </el-form-item>
+                </el-col>
+              </el-row>
+            </el-tab-pane>
+          </el-tabs>
+          <div>
+            <el-tabs v-model="tabs">
+              <el-tab-pane label="步骤三：随机设定" name="first">
+                <el-form-item
+                  label="客观题小题乱序"
+                  prop="scrambling_the_question_order"
                 >
-                <el-tag v-if="extractConfig.examType === 'ONLINE'"
-                  >在线考试</el-tag
+                  <el-radio-group
+                    v-model="extractConfig.scrambling_the_question_order"
+                    class="pull_right_sm"
+                  >
+                    <el-radio :label="1">开启</el-radio>
+                    <el-radio :label="0">关闭</el-radio>
+                  </el-radio-group>
+                </el-form-item>
+                <br />
+                <el-form-item
+                  label="客观题选项乱序"
+                  prop="scrambling_the_option_order"
+                >
+                  <el-radio-group
+                    v-model="extractConfig.scrambling_the_option_order"
+                    class="pull_right_sm"
+                  >
+                    <el-radio :label="1">开启</el-radio>
+                    <el-radio :label="0">关闭</el-radio>
+                  </el-radio-group>
+                </el-form-item>
+              </el-tab-pane>
+            </el-tabs>
+          </div>
+          <div
+            v-show="extractConfig.examType != 'PRACTICE'"
+            style="padding: 5px"
+          >
+            <el-tabs v-model="tabs">
+              <el-tab-pane label="步骤四：音频播放次数设置" name="first">
+                <el-row
+                  v-show="audioTimeConfigList.length > 0"
+                  class="row_header_word"
                 >
-                <el-tag v-if="extractConfig.examType === 'PRACTICE'"
-                  >练习考试</el-tag
+                  <el-col :span="4" :offset="1">试卷类型</el-col>
+                  <el-col :span="4">试卷名称</el-col>
+                  <el-col :span="3">大题号</el-col>
+                  <el-col :span="3">小题号</el-col>
+                  <el-col :span="4">播放次数</el-col>
+                </el-row>
+                <el-row
+                  v-for="(audioTimeConfigInner, index) in audioTimeConfigList"
+                  :key="index"
+                  class="margin-top-10"
                 >
-              </el-col>
-            </el-row>
-            <el-row v-for="(examPaper, num) in examPaperList" :key="num">
-              <el-col :span="24">
-                <el-form-item label="试卷类型" class="pull-left">
-                  <el-input
-                    v-model="examPaper.groupCode"
-                    class="input_width_lg"
-                    placeholder="请输入试卷类型"
-                    disabled
-                  ></el-input>
+                  <el-col :span="4" :offset="1">
+                    {{ audioTimeConfigInner.groupCode }}
+                  </el-col>
+                  <el-col :span="4">
+                    {{ audioTimeConfigInner.paper.name }}
+                  </el-col>
+                  <el-col :span="3">
+                    {{
+                      audioTimeConfigInner.paperDetailUnit.paperDetail.number
+                    }}
+                  </el-col>
+                  <el-col :span="3">
+                    {{ audioTimeConfigInner.paperDetailUnit.number }}
+                  </el-col>
+                  <el-col :span="4">
+                    <el-input
+                      v-model="audioTimeConfigInner.playTime"
+                      class="input_width_ss"
+                      size="small"
+                      >次
+                    </el-input>
+                  </el-col>
+                </el-row>
+                <el-row v-show="audioTimeConfigList.length == 0">
+                  <el-col :span="18" :offset="1"> 无音频试题 </el-col>
+                </el-row>
+              </el-tab-pane>
+            </el-tabs>
+          </div>
+          <div>
+            <el-tabs v-model="tabs">
+              <el-row>
+                <el-col>
+                  <el-form-item label="是否生成文件">
+                    <el-radio-group v-model="isbuildFile">
+                      <el-radio label="1">是</el-radio>
+                      <el-radio label="0">否</el-radio>
+                    </el-radio-group>
+                  </el-form-item>
+                </el-col>
+              </el-row>
+              <el-row v-if="isbuildFile == '1'">
+                <el-form-item label="小题序号">
+                  <el-radio-group v-model="seqMode" class="input">
+                    <el-radio label="MODE1">单题型连续</el-radio>
+                    <el-radio label="MODE2">客观题整体连续</el-radio>
+                    <el-radio label="MODE3">按大题独立</el-radio>
+                  </el-radio-group>
                 </el-form-item>
-                <el-button
-                  v-if="extractConfig.examType != 'TRADITION'"
-                  type="primary"
-                  @click="addOnLinePaper(examPaper.groupCode)"
-                  ><i class="el-icon-plus"></i> 新增试卷
-                </el-button>
-              </el-col>
-              <el-col
-                v-for="(paperInfo, index) in examPaper.paperInfoList"
-                :key="paperInfo.selectedPaperId"
-                :span="20"
-                :offset="2"
-              >
-                <el-form-item>
-                  <span>试卷选定</span>
-                  <el-select
-                    v-model="paperInfo.paper.id"
-                    filterable
-                    placeholder="请选择"
-                    class="select_width_lg"
-                    @change="searchAudioTimeConfig"
+              </el-row>
+              <el-row :gutter="20">
+                <el-col :span="12">
+                  <el-button type="primary" @click="submitForm">
+                    保存
+                  </el-button>
+                  <el-button type="primary" @click="back"
+                    ><i class="el-icon-arrow-left"></i> 返 回</el-button
                   >
+                </el-col>
+              </el-row>
+            </el-tabs>
+          </div>
+        </template>
+
+        <template v-else>
+          <el-tabs v-model="tabs">
+            <el-tab-pane label="步骤二：随机抽题模板选择" name="first">
+              <el-select
+                v-model="extractConfig2.randomPaperId"
+                filterable
+                placeholder="请选择"
+              >
+                <el-option
+                  v-for="item in tplList"
+                  :key="item.id"
+                  :label="item.name"
+                  :value="item.id"
+                >
+                </el-option>
+              </el-select>
+
+              <div style="line-height: 34px; margin-top: 10px" class="label">
+                试卷结构预览
+              </div>
+              <div class="flex items-center">
+                <el-form-item label="组卷结构：" label-width="90px">
+                  <el-select v-model="curStructInfo.paperStructId" disabled>
                     <el-option
-                      v-for="item in paperList"
+                      v-for="item in randomTplInfo.paperStructOptions"
                       :key="item.id"
                       :label="item.name"
                       :value="item.id"
-                    >
-                    </el-option>
+                    ></el-option>
                   </el-select>
-                  <span>选取几率</span>
-                  <span>
-                    <el-input
-                      v-model="paperInfo.weight"
-                      class="input_width_sms"
-                      :disabled="extractConfig.examType === 'TRADITION'"
-                    ></el-input
-                    >%
-                    <i
-                      v-if="index > 0"
-                      class="el-icon-delete"
-                      @click.prevent="
-                        removePaperInfo(examPaper.groupCode, paperInfo)
-                      "
-                    ></i> </span
-                  >&nbsp; <span :class="'errorMsg_' + num + '_' + index"></span>
+                  <p
+                    style="display: inline-block; margin-left: 40px"
+                    class="label"
+                  >
+                    难度：<span style="color: #409eff; font-weight: bold">{{
+                      curStructInfo.difficulty
+                    }}</span>
+                  </p>
                 </el-form-item>
-              </el-col>
-            </el-row>
-          </el-tab-pane>
-        </el-tabs>
-        <div>
-          <el-tabs v-model="tabs">
-            <el-tab-pane label="步骤三：随机设定" name="first">
-              <el-form-item
-                label="客观题小题乱序"
-                prop="scrambling_the_question_order"
+              </div>
+              <el-table
+                :data="randomTplInfo.tableData"
+                border
+                style="margin-top: 8px; width: 700px"
               >
-                <el-radio-group
-                  v-model="extractConfig.scrambling_the_question_order"
-                  class="pull_right_sm"
+                <el-table-column
+                  v-for="(item, index) in randomTplInfo.tableColumns"
+                  :key="index"
+                  :label="item.label"
+                  :prop="item.prop"
                 >
-                  <el-radio :label="1">开启</el-radio>
-                  <el-radio :label="0">关闭</el-radio>
-                </el-radio-group>
-              </el-form-item>
-              <br />
-              <el-form-item
-                label="客观题选项乱序"
-                prop="scrambling_the_option_order"
-              >
-                <el-radio-group
-                  v-model="extractConfig.scrambling_the_option_order"
-                  class="pull_right_sm"
-                >
-                  <el-radio :label="1">开启</el-radio>
-                  <el-radio :label="0">关闭</el-radio>
-                </el-radio-group>
-              </el-form-item>
-            </el-tab-pane>
-          </el-tabs>
-        </div>
-        <div v-show="extractConfig.examType != 'PRACTICE'" style="padding: 5px">
-          <el-tabs v-model="tabs">
-            <el-tab-pane label="步骤四：音频播放次数设置" name="first">
-              <el-row
-                v-show="audioTimeConfigList.length > 0"
-                class="row_header_word"
-              >
-                <el-col :span="4" :offset="1">试卷类型</el-col>
-                <el-col :span="4">试卷名称</el-col>
-                <el-col :span="3">大题号</el-col>
-                <el-col :span="3">小题号</el-col>
-                <el-col :span="4">播放次数</el-col>
-              </el-row>
-              <el-row
-                v-for="(audioTimeConfigInner, index) in audioTimeConfigList"
-                :key="index"
-                class="margin-top-10"
-              >
-                <el-col :span="4" :offset="1">
-                  {{ audioTimeConfigInner.groupCode }}
-                </el-col>
-                <el-col :span="4">
-                  {{ audioTimeConfigInner.paper.name }}
-                </el-col>
-                <el-col :span="3">
-                  {{ audioTimeConfigInner.paperDetailUnit.paperDetail.number }}
-                </el-col>
-                <el-col :span="3">
-                  {{ audioTimeConfigInner.paperDetailUnit.number }}
-                </el-col>
-                <el-col :span="4">
-                  <el-input
-                    v-model="audioTimeConfigInner.playTime"
-                    class="input_width_ss"
-                    size="small"
-                    >次
-                  </el-input>
-                </el-col>
-              </el-row>
-              <el-row v-show="audioTimeConfigList.length == 0">
-                <el-col :span="18" :offset="1"> 无音频试题 </el-col>
-              </el-row>
+                  <template slot-scope="scope">
+                    <span
+                      v-if="
+                        !['hardInfo', 'mediumInfo', 'easyInfo'].includes(
+                          item.prop
+                        )
+                      "
+                      >{{ scope.row[item.prop] }}</span
+                    >
+                    <span v-else>{{ scope.row[item.prop]?.count }}</span>
+                  </template>
+                </el-table-column>
+              </el-table>
             </el-tab-pane>
           </el-tabs>
-        </div>
-        <div>
+
           <el-tabs v-model="tabs">
-            <el-row>
-              <el-col>
-                <el-form-item label="是否生成文件">
-                  <el-radio-group v-model="isbuildFile">
-                    <el-radio label="1">是</el-radio>
-                    <el-radio label="0">否</el-radio>
-                  </el-radio-group>
-                </el-form-item>
-              </el-col>
-            </el-row>
-            <el-row v-if="isbuildFile == '1'">
-              <el-form-item label="小题序号">
-                <el-radio-group v-model="seqMode" class="input">
-                  <el-radio label="MODE1">单题型连续</el-radio>
-                  <el-radio label="MODE2">客观题整体连续</el-radio>
-                  <el-radio label="MODE3">按大题独立</el-radio>
-                </el-radio-group>
+            <el-tab-pane label="步骤三：音频播放次数设置" name="first">
+              <el-form-item label="播放次数：" label-width="90px">
+                <el-input-number
+                  v-model="extractConfig2.playTime"
+                  :min="1"
+                  step-strictly
+                  :precision="0"
+                  :controls="false"
+                  style="width: 60px; margin-right: 5px"
+                ></el-input-number>
               </el-form-item>
-            </el-row>
-            <el-row :gutter="20">
-              <el-col :span="12" :offset="1">
-                <el-button type="primary" @click="submitForm"> 保存 </el-button>
-                <el-button type="primary" @click="back"
-                  ><i class="el-icon-arrow-left"></i> 返 回</el-button
-                >
-              </el-col>
-            </el-row>
+            </el-tab-pane>
           </el-tabs>
-        </div>
+          <el-row style="margin-top: 10px">
+            <el-col :span="12">
+              <el-button type="primary" @click="submitForm"> 保存 </el-button>
+              <el-button type="primary" @click="back"
+                ><i class="el-icon-arrow-left"></i> 返 回</el-button
+              >
+            </el-col>
+          </el-row>
+        </template>
       </el-form>
     </div>
   </section>
@@ -260,6 +363,7 @@ import { EXAM_WORK_API, QUESTION_API } from "@/constants/constants";
 import { mapState } from "vuex";
 import _ from "lodash";
 import LinkTitlesCustom from "@/components/LinkTitlesCustom.vue";
+import qs from "qs";
 export default {
   components: { LinkTitlesCustom },
   data() {
@@ -277,6 +381,28 @@ export default {
         scrambling_the_question_order: 0, //小题乱序  默认关闭
         scrambling_the_option_order: 0, //选项乱序  默认关闭
       },
+      extractConfig2: {
+        randomPaperId: "", //抽题模板id
+        playTime: 1,
+      },
+      randomTplInfo: {
+        paperStructOptions: [],
+        paperStructType: "",
+        paperIds: [],
+        tableData: [],
+        tableColumns: [
+          { label: "题型", prop: "detailName", minWidth: "100" },
+          { label: "总分", prop: "totalScore", minWidth: "80" },
+          { label: "数量", prop: "totalCount", minWidth: "80" },
+          { label: "难", prop: "hardInfo", minWidth: "80" },
+          { label: "中", prop: "mediumInfo", minWidth: "80" },
+          { label: "易", prop: "easyInfo", minWidth: "80" },
+        ],
+      },
+      curStructInfo: {
+        difficulty: "",
+        paperStructId: "",
+      },
       examPaperList: [],
       audioTimeConfig: {
         examId: "",
@@ -298,6 +424,7 @@ export default {
       courseList: [],
       courseAll: [],
       isInsert: false,
+      tplList: [],
     };
   },
   computed: {
@@ -315,8 +442,65 @@ export default {
       return courseList;
     },
   },
+  watch: {
+    "extractConfig.examId"(val) {
+      if (val && this.examList.length) {
+        this.getCurCallType();
+      }
+    },
+    examList(val) {
+      if (this.extractConfig.examId && val.length) {
+        this.getCurCallType();
+      }
+    },
+    "extractConfig2.randomPaperId"(val) {
+      let item = this.tplList.find((v) => v.id == val);
+      this.randomTplInfo.paperStructType = item ? item.paperStructType : "";
+
+      let apiUrl = "/api/ecs_ques/paperStruct/1/10000";
+      let params =
+        this.randomTplInfo.paperStructType == "EXACT"
+          ? { courseNo: "ALL", type: "EXACT" }
+          : this.randomTplInfo.paperStructType === "BLUEPRINT"
+          ? { type: "BLUEPRINT" }
+          : null;
+      if (params) {
+        this.$http.get(apiUrl, { params }).then((res) => {
+          this.randomTplInfo.paperStructOptions = res.data.content;
+
+          this.curStructInfo.paperStructId = item ? item.paperStructId : "";
+          this.randomTplInfo.paperIds = item ? item.paperIds : [];
+
+          let structItem = res.data.content.find(
+            (v) => v.id == this.curStructInfo.paperStructId
+          );
+          this.curStructInfo.difficulty = structItem
+            ? structItem.difficulty
+            : "";
+
+          this.$http
+            .post(
+              "/api/ecs_ques/randompaper/struct/question/view/info",
+              qs.stringify({
+                paperIds: this.randomTplInfo.paperIds.join(","),
+                structId: this.curStructInfo.paperStructId,
+              }),
+              {
+                headers: {
+                  "content-type": "application/x-www-form-urlencoded",
+                },
+              }
+            )
+            .then((res) => {
+              this.randomTplInfo.tableData = res.data.structQuestionInfo || [];
+            });
+        });
+      }
+    },
+  },
   //初始化
-  created: function () {
+  async created() {
+    await this.getTplList();
     let extractConfigId = this.$route.params.extractConfigId;
     //1.查询考试集合
     this.getExams("");
@@ -327,6 +511,30 @@ export default {
     }
   },
   methods: {
+    async getTplList() {
+      try {
+        let res = await this.$http.post(
+          "/api/ecs_ques/randompaper/page",
+          null,
+          {
+            params: {
+              pageNumber: 1,
+              pageSize: 10000,
+              enable: true,
+            },
+          }
+        );
+        this.tplList = res.data.content || [];
+      } catch (e) {
+        this.$message.error("获取抽题模板失败");
+      }
+    },
+    getCurCallType() {
+      let item = this.examList.find(
+        (item) => item.id == this.extractConfig.examId
+      );
+      this.extractConfig.callType = item.callType || "WHOLE_SET";
+    },
     //根据考务查询考试集合
     getExams(query) {
       query = query.trim();
@@ -338,10 +546,26 @@ export default {
           this.examList = response.data;
         });
     },
+    clearPageData() {
+      this.extractConfig2 = {
+        randomPaperId: "", //抽题模板id
+        playTime: 1,
+      };
+      this.randomTplInfo.paperStructOptions = [];
+      this.randomTplInfo.paperStructType = "";
+      this.randomTplInfo.paperIds = [];
+      this.randomTplInfo.tableData = [];
+      this.curStructInfo = {
+        difficulty: "",
+        paperStructId: "",
+      };
+    },
     //根据考试查询课程
     getExamCourses() {
       if (!this.isInsert) {
         this.extractConfig.courseCode = "";
+        // this.clearPageData();
+
         this.courseList = [];
         if (this.extractConfig.examId) {
           //查询该考试下的课程
@@ -387,7 +611,6 @@ export default {
           )
           .then((response) => {
             let examPaperArr = response.data;
-            console.log("examPaperArr:", examPaperArr);
             if (examPaperArr && examPaperArr.length > 0) {
               let _examPaperList = [];
               for (let examPaper of examPaperArr) {
@@ -458,7 +681,6 @@ export default {
           paperIds.push(this.examPaperList[i].paperInfoList[j].paper.id);
         }
         //对试卷集合进行去重
-        console.log("paperIds:", paperIds);
         var ids = [];
         ids = _.uniq(paperIds);
         for (var k = 0; k < ids.length; k++) {
@@ -545,6 +767,10 @@ export default {
         }
         return false;
       }
+      if (this.extractConfig.callType === "RANDOM_PAPER") {
+        this.toSubmit2();
+        return;
+      }
       if (this.extractConfig.examType != "PRACTICE") {
         for (let audioTimeConfig of this.audioTimeConfigList) {
           if (!this.checkValue(audioTimeConfig.playTime)) {
@@ -589,6 +815,50 @@ export default {
           );
       }
     },
+    toSubmit2() {
+      let msg = "";
+      if (!this.extractConfig2.randomPaperId) {
+        msg = "请选择抽题模板";
+      } else if (
+        this.extractConfig2.playTime === "" ||
+        this.extractConfig2.playTime === undefined
+      ) {
+        msg = "请填写播放次数";
+      }
+      if (msg) {
+        this.$notify({
+          message: msg,
+          type: "error",
+        });
+        return;
+      }
+      const { callType, courseCode, examId, examName, examType } =
+        this.extractConfig;
+      this.loading = true;
+      this.$http
+        .put(QUESTION_API + "/extractConfig/0", {
+          ...this.extractConfig2,
+          callType,
+          courseCode,
+          examId,
+          examName,
+          examType,
+        })
+        .then(
+          () => {
+            this.loading = false;
+            this.$notify({ type: "success", message: "保存成功" });
+            this.back();
+          },
+          (error) => {
+            this.loading = false;
+            this.$notify({
+              type: "error",
+              message: error.response.data.desc,
+            });
+          }
+        );
+    },
     //音频播放次数校验
     checkValue(val) {
       if (/(^[0-9]\d*$)/.test(val)) {
@@ -746,6 +1016,10 @@ export default {
         .get(QUESTION_API + "/extractConfig/" + extractConfigId)
         .then((response) => {
           this.extractConfig = response.data;
+
+          this.extractConfig2.randomPaperId = response.data.randomPaperId || "";
+          this.extractConfig2.playTime = response.data.playTime || "";
+
           //查询该考试下的课程
           this.$http
             .get(
@@ -871,6 +1145,10 @@ export default {
 };
 </script>
 <style scoped>
+.label {
+  color: #606266;
+  font-size: 14px;
+}
 .pull_right_ss {
   margin-left: 30px;
 }