Merge branch 'jzl'

danger-manage-web/src/api/educationPlanExam/lessonsProgram.js

@@ -2,7 +2,7 @@
  * @Author: 纪泽龙 jizelong@qq.com
  * @Date: 2022-09-23 11:02:24
  * @LastEditors: 纪泽龙 jizelong@qq.com
- * @LastEditTime: 2022-12-28 09:57:47
+ * @LastEditTime: 2023-01-29 14:53:07
  * @FilePath: /danger-manage-web/src/api/educationPlanExam/trainingProgram.js
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -186,3 +186,10 @@ export function bachAddTopic(data) {
   })
 }
 
+export function bachAddTopicGuest(data) {
+  return request({
+    url: '/contractTrainTopic/bachAddTopic',
+    method: 'post',
+    data: data
+  })
+}

danger-manage-web/src/views/educationPlanExam/lessonsProgram/components/AddQuestion.vue

@@ -276,7 +276,6 @@ export default {
     // 新增选项
     add(addValue) {
       this.form.questions.push({ value: addValue });
-      console.log();
     },
     save(num = 2) {
       return new Promise((resove) => {

danger-manage-web/src/views/educationPlanExam/visitorProgram/ChangeQuestion.vue

+<!--
+ * @Author: 纪泽龙 jizelong@qq.com
+ * @Date: 2022-12-27 09:30:19
+ * @LastEditors: 纪泽龙 jizelong@qq.com
+ * @LastEditTime: 2023-01-29 14:52:33
+ * @FilePath: /danger-manage-web/src/views/educationPlanExam/textPaper/components/ChangeQuestion.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<template>
+  <div class="table-wrapper">
+    <el-form :model="queryParams" ref="queryForm" :inline="true">
+      <el-form-item label="所属单位" prop="deptId" ref="treeItem">
+        <Treeselect
+          class="tree"
+          v-model="queryParams.deptId"
+          :options="deptOptions"
+          :show-count="true"
+          placeholder="请选择归属部门"
+          style="width: 200px"
+        />
+      </el-form-item>
+      <el-form-item label="题库名称" prop="bankName">
+        <el-input
+          v-model="queryParams.bankName"
+          placeholder="考试时间"
+          clearable
+          size="small"
+        />
+      </el-form-item>
+
+      <el-form-item>
+        <el-button
+          type="primary"
+          icon="el-icon-search"
+          size="mini"
+          @click="search"
+          >搜索</el-button
+        >
+        <el-button icon="el-icon-refresh" size="mini" @click="resetClick"
+          >重置</el-button
+        >
+      </el-form-item>
+    </el-form>
+
+    <el-table v-loading="loading" :data="list" height="435" ref="multipleTable">
+      <!-- <el-table-column type="selection"></el-table-column> -->
+      <el-table-column label="" align="center" prop="profession">
+        <template v-slot="{ row }">
+          <!-- <div> -->
+          <el-checkbox
+            :disabled="row.numberQuestions == 0"
+            v-model="row.checked"
+          ></el-checkbox>
+          <!-- </div> -->
+        </template>
+      </el-table-column>
+      <el-table-column label="题库名称" align="center" prop="bankName">
+      </el-table-column>
+      <el-table-column label="所属单位" align="center" prop="courseType">
+        <template v-slot="scope">
+          <div>
+            {{ selectList(deptOptions, scope.row.deptId) || "-" }}
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="包含题目数量"
+        align="center"
+        prop="numberQuestions"
+        :formatter="formatter"
+      >
+      </el-table-column>
+      <el-table-column label="选取题目数量" align="center" prop="profession">
+        <template v-slot="{ row }">
+          <div>
+            <!-- <el-input
+              :disabled="!row.checked|| row.numberQuestions==0 "
+              v-model="row.changeNum"
+              size="mini"
+              style="width: 100px"
+            ></el-input> -->
+            <el-input-number
+              v-model="row.changeNum"
+              :disabled="!row.checked || row.numberQuestions == 0"
+              size="mini"
+              :min="1"
+              :max="+row.numberQuestions ? +row.numberQuestions : 1000000"
+              label="描述文字"
+            ></el-input-number>
+          </div>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- <div> -->
+    <el-pagination
+      :layout="'prev, pager, next'"
+      v-show="total > 0"
+      :total="total"
+      :current-page="queryParams.pageNum"
+      :page-sizes="[queryParams.pageSize]"
+      @current-change="currentChangeClick"
+    />
+  </div>
+</template>
+
+<script>
+import { listBank, delBank } from "@/api/educationPlanExam/questionBank";
+import { bachAddTopicGuest } from "@/api/educationPlanExam/lessonsProgram.js";
+
+// 部门列表
+
+import { treeselect } from "@/api/system/dept";
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+export default {
+  name: "",
+  components: {
+    Treeselect,
+  },
+  props: {
+    courseId: {
+      type: Number,
+    },
+  },
+  data() {
+    return {
+      queryParams: {
+        deptId: null,
+        courseName: "",
+        pageNum: 1,
+        pageSize: 10,
+      },
+      list: [
+        {
+          checked: false,
+        },
+      ],
+      total: 20,
+      loading: false,
+      // 题库id
+      deptId: null,
+      // 归属部门列表
+      deptOptions: [],
+    };
+  },
+  created() {
+    this.getList();
+    this.getTreeselect();
+  },
+  methods: {
+    getTreeselect() {
+      treeselect().then((response) => {
+        this.deptOptions = response.data;
+        // console.log("123", this.deptOptions);
+        // console.log(this.selectList(this.deptOptions, 175));
+      });
+    },
+    // 递归查值的方法
+    selectList(list, id) {
+      for (let i = 0; i < list.length; i++) {
+        let item = list[i];
+        if (item.id == id) {
+          return item.label;
+        } else {
+          if (Array.isArray(item.children)) {
+            let a = this.selectList(item.children, id);
+            if (a) {
+              return a;
+            }
+          }
+        }
+      }
+    },
+    getList() {
+      this.loading = true;
+      listBank(this.queryParams)
+        .then((res) => {
+          console.log(res);
+          this.list = res.rows.map((item, index) => {
+            return {
+              bankNum:
+                index +
+                1 +
+                (this.queryParams.pageNum - 1) * this.queryParams.pageSize,
+              checked: false,
+              changeNum: 0,
+              ...item,
+            };
+          });
+          this.total = res.total;
+        })
+        .finally(() => {
+          this.loading = false;
+        });
+    },
+    saveAndNext() {
+      const topicInfos = this.list
+        .filter((item) => item.checked)
+        .map((item) => {
+          return {
+            bankId: item.bankId,
+            quan: item.changeNum,
+          };
+        });
+
+      console.log(this.courseId, topicInfos);
+      const data = { courseId: this.courseId, topicInfos };
+      console.log(data);
+
+      bachAddTopicGuest(data).then((res) => {
+        console.log(res);
+        if (res.code == 200) {
+          // this.$parent.$parent.componentsNumChange(2);
+          this.$parent.$parent.getContractTopicList(this.courseId);
+          this.$parent.$parent.dialogVisible2=false;
+        }
+      });
+    },
+    resetClick() {},
+    search() {
+      this.getList();
+    },
+    currentChangeClick() {},
+    formatter(row, column, cellValue, index) {
+      // console.log(row, column, cellValue, index);
+      if (!cellValue) return "-";
+      else return cellValue;
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.table-wrapper {
+  padding-top: 22px;
+  width: 100%;
+  height: 550px;
+  overflow: hidden;
+  // padding-bottom: 10px;
+  margin-bottom: 20px;
+}
+</style>

danger-manage-web/src/views/educationPlanExam/visitorProgram/index.vue

 <template>
-    <div class="form-wrapper">
-        <div style="width: 100%;height:100%;">
-            <el-form :model="contractTrainForm" :rules="rules" ref="contractTrainForm" label-width="100px" class="demo-ruleForm">
-                <el-form-item label="培训名称" prop="courseName">
-                  <el-input v-model="contractTrainForm.courseName"></el-input>
-                </el-form-item>
-                <el-form-item label="培训内容" prop="courseConent">
-                    <el-input type="textarea" v-model="contractTrainForm.courseConent" rows="5"></el-input>
-                </el-form-item>
-                <div class="flex">
-                  <el-form-item label="视频上传" v-if="!readOnly" prop="video">
-                    <FileUpload
-                      listType="picture"
-                      @resFun="getFileInfoVideo"
-                      @remove="listRemoveVideo"
-                      :fileArr="fileListVideo"
-                      :fileSize="500"
-                      :fileType="['mp4']"
-                    />
-                    <el-input v-show="false" disabled v-model="contractTrainForm.video"></el-input>
-                  </el-form-item>
-                  <el-form-item label="附件上传" v-if="!readOnly" prop="enclosure">
-                    <FileUpload
-                      listType="picture"
-                      @resFun="getFileInfoFile"
-                      @remove="listRemoveFile"
-                      :fileArr="fileListFile"
-                    />
-                    <el-input v-show="false" disabled v-model="contractTrainForm.enclosure"></el-input>
-                  </el-form-item>
-                </div>
-            </el-form>
+  <div class="form-wrapper">
+    <div style="width: 100%; height: 100%">
+      <el-form
+        :model="contractTrainForm"
+        :rules="rules"
+        ref="contractTrainForm"
+        label-width="100px"
+        class="demo-ruleForm"
+      >
+        <el-form-item label="培训名称" prop="courseName">
+          <el-input v-model="contractTrainForm.courseName"></el-input>
+        </el-form-item>
+        <el-form-item label="培训内容" prop="courseConent">
+          <el-input
+            type="textarea"
+            v-model="contractTrainForm.courseConent"
+            rows="5"
+          ></el-input>
+        </el-form-item>
+        <div class="flex">
+          <el-form-item label="视频上传" v-if="!readOnly" prop="video">
+            <FileUpload
+              listType="picture"
+              @resFun="getFileInfoVideo"
+              @remove="listRemoveVideo"
+              :fileArr="fileListVideo"
+              :fileSize="500"
+              :fileType="['mp4']"
+            />
+            <el-input
+              v-show="false"
+              disabled
+              v-model="contractTrainForm.video"
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="附件上传" v-if="!readOnly" prop="enclosure">
+            <FileUpload
+              listType="picture"
+              @resFun="getFileInfoFile"
+              @remove="listRemoveFile"
+              :fileArr="fileListFile"
+            />
+            <el-input
+              v-show="false"
+              disabled
+              v-model="contractTrainForm.enclosure"
+            ></el-input>
+          </el-form-item>
         </div>
-        <visitorQuestion ref="visitorQuestion"></visitorQuestion>
+      </el-form>
     </div>
+    <visitorQuestion ref="visitorQuestion"></visitorQuestion>
+  </div>
 </template>
 <script>
-  import FileUpload from "@/components/FileUpload";
-  import uploadfile from "@/assets/uploadfile.png";
-  import visitorQuestion from "@/views/educationPlanExam/visitorProgram/visitorQuestion";
-  import {listCourse} from "@/api/contractTrain/contractTrain";
-  export default {
-    data() {
-      return {
-        contractTrainForm: {
-          courseName: '',
-          courseConent: '',
-          video: "",
-          enclosure: "",
-        },
-        fileListVideo: [],
-        fileListFile: [],
-        readOnly: false,
-        rules: {
-          name: [
-            { required: true, message: '请输入培训名称', trigger: 'blur' }
-          ],
-          region: [
-            { required: true, message: '请输入培训内容', trigger: 'change' }
-          ],
-          video: [
-            { required: true, trigger: "blue", message: "视频不能为空" }
-          ],
-          enclosure: [
-            { required: true, trigger: "blur", message: "附件不能为空" },
-          ],
+import FileUpload from "@/components/FileUpload";
+import uploadfile from "@/assets/uploadfile.png";
+import visitorQuestion from "@/views/educationPlanExam/visitorProgram/visitorQuestion";
+import { listCourse } from "@/api/contractTrain/contractTrain";
+export default {
+  data() {
+    return {
+      contractTrainForm: {
+        courseName: "",
+        courseConent: "",
+        video: "",
+        enclosure: "",
+      },
+      fileListVideo: [],
+      fileListFile: [],
+      readOnly: false,
+      rules: {
+        name: [{ required: true, message: "请输入培训名称", trigger: "blur" }],
+        region: [
+          { required: true, message: "请输入培训内容", trigger: "change" },
+        ],
+        video: [{ required: true, trigger: "blue", message: "视频不能为空" }],
+        enclosure: [
+          { required: true, trigger: "blur", message: "附件不能为空" },
+        ],
+      },
+    };
+  },
+  components: {
+    FileUpload,
+    visitorQuestion,
+  },
+  created() {
+    this.getContractTrainList();
+  },
+  methods: {
+    getContractTrainList() {
+      listCourse().then((res) => {
+        this.contractTrainForm = res.rows[0];
+        console.log("this.contractTrainForm", this.contractTrainForm);
+        if (this.contractTrainForm.video) {
+          this.fileListVideo = [
+            {
+              name: this.contractTrainForm.courseName + "视频",
+              url: uploadfile,
+            },
+          ];
+        }
+        if (this.contractTrainForm.enclosure) {
+          this.fileListFile = [
+            {
+              name: this.contractTrainForm.courseName + "附件",
+              url: uploadfile,
+            },
+          ];
+        }
+        // this.$refs.visitorQuestion.rightNum =
+        //   this.contractTrainForm.qualifiedNum;
+
+        this.$refs.visitorQuestion.bottomFrom = {
+          judgmentScore: this.contractTrainForm.judgmentScore || 0,
+          multipleChoiceScore: this.contractTrainForm.multipleChoiceScore || 0,
+          qualifiedNum: this.contractTrainForm.qualifiedNum || 0,
+          singleChoiceScore: this.contractTrainForm.singleChoiceScore || 0,
+        };
+
+        this.$refs.visitorQuestion.getContractTopicList(
+          this.contractTrainForm.contractorCourseId
+        );
+      });
+    },
+    submitForm(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          alert("submit!");
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+
+    getFileInfoVideo(res) {
+      this.contractTrainForm.video = res.url;
+      this.fileListVideo = [
+        {
+          name: res.fileName,
+          url: uploadfile,
         },
-      };
+      ];
     },
-    components: {
-      FileUpload,
-      visitorQuestion,
+    listRemoveVideo(e) {
+      this.fileListVideo = [];
+      this.contractTrainForm.video = "";
+      // this.form.videoName = null;
     },
-    created() {
-      this.getContractTrainList();
+    getFileInfoFile(res) {
+      this.contractTrainForm.enclosure = res.url;
+      this.fileListFile = [
+        {
+          name: res.fileName,
+          url: uploadfile,
+        },
+      ];
     },
-    methods: {
-      getContractTrainList(){
-        listCourse().then(res =>{
-          this.contractTrainForm = res.rows[0];
-          if(this.contractTrainForm.video){
-            this.fileListVideo = [
-              {
-                name: this.contractTrainForm.courseName + "视频",
-                url: uploadfile,
-              },
-            ];
-          }
-          if(this.contractTrainForm.enclosure){
-            this.fileListFile = [
-              {
-                name: this.contractTrainForm.courseName + "附件",
-                url: uploadfile,
-              },
-            ];
-          }
-          this.$refs.visitorQuestion.rightNum = this.contractTrainForm.qualifiedNum;
-          this.$refs.visitorQuestion.getContractTopicList(this.contractTrainForm.contractorCourseId)
-        })
-      },
-      submitForm(formName) {
-        this.$refs[formName].validate((valid) => {
-          if (valid) {
-            alert('submit!');
-          } else {
-            console.log('error submit!!');
-            return false;
-          }
-        });
-      },
-
-      getFileInfoVideo(res) {
-        this.contractTrainForm.video = res.url;
-        this.fileListVideo = [
-          {
-            name: res.fileName,
-            url: uploadfile,
-          },
-        ];
-      },
-      listRemoveVideo(e) {
-        this.fileListVideo = [];
-        this.contractTrainForm.video = "";
-        // this.form.videoName = null;
-      },
-      getFileInfoFile(res) {
-        this.contractTrainForm.enclosure = res.url;
-        this.fileListFile = [
-          {
-            name: res.fileName,
-            url: uploadfile,
-          },
-        ];
-      },
-      listRemoveFile(e) {
-        this.fileListFild = [];
-        this.contractTrainForm.enclosure = "";
-        // this.form.fileName = null;
-      },
-    }
-  }
+    listRemoveFile(e) {
+      this.fileListFild = [];
+      this.contractTrainForm.enclosure = "";
+      // this.form.fileName = null;
+    },
+  },
+};
 </script>
 <style lang="scss" scoped>
 .form-wrapper {
@@ -148,7 +174,7 @@
   height: 100%;
   margin-bottom: 20px;
 }
-.flex{
+.flex {
   width: 100%;
   justify-content: space-around;
   padding: 20px 30px;

danger-manage-web/src/views/educationPlanExam/visitorProgram/visitorAdd.vue

 <template>
-    <div ref="myBody" class="add-question flex">
-      <div class="text flex">
-        <div class="left">
-          目前录入题目是第<span>{{ questionNextNum }}</span
-          >道题
-        </div>
+  <div ref="myBody" class="add-question flex">
+    <div class="text flex">
+      <div class="left">
+        目前录入题目是第<span>{{ questionNextNum }}</span
+        >道题
+      </div>
+
+      <div>
+        <el-radio-group
+          v-model="form.topicType"
+          size="mini"
+          @input="topicTypeChange"
+        >
+          <el-radio-button :label="1">单选</el-radio-button>
+          <el-radio-button :label="2">多选</el-radio-button>
+          <el-radio-button :label="3">判断</el-radio-button>
+        </el-radio-group>
       </div>
-      <el-form class="form flex" ref="form" :model="form" label-width="auto">
-        <!-- <div class="top flex"> -->
-        <div>
-          <el-form-item
-            label="题目"
-            prop="topicTitle"
-            :rules="{
-              required: true,
-              message: '必须输入题目内容',
-              trigger: 'blur',
-            }"
+    </div>
+    <el-form class="form flex" ref="form" :model="form" label-width="auto">
+      <!-- <div class="top flex"> -->
+      <div>
+        <el-form-item
+          label="题目"
+          prop="topicTitle"
+          :rules="{
+            required: true,
+            message: '必须输入题目内容',
+            trigger: 'blur',
+          }"
+        >
+          <el-input
+            type="textarea"
+            placeholder="多行输入"
+            resize="none"
+            rows="4"
+            v-model="form.topicTitle"
           >
+          </el-input>
+        </el-form-item>
+      </div>
+
+      <div class="bottom">
+        <!-- <el-form-item label="选项1" prop="title">
+            <el-input v-model="form.title" placeholder="请输入"></el-input>
+          </el-form-item> -->
+        <el-form-item
+          v-for="(question, index) in form.questions"
+          :label="'选项' + (index + 1)"
+          :key="question.key"
+          :prop="'questions.' + index + '.value'"
+          :rules="
+            index === 0
+              ? {
+                  required: true,
+                  message: '第一项不能为空不能为空',
+                  trigger: 'blur',
+                }
+              : {}
+          "
+        >
+          <div class="add-select flex">
+            <el-input
+              type="textarea"
+              placeholder="多行输入"
+              style="flex: 1; margin-right: 10px"
+              rows="2"
+              v-model="question.value"
+            ></el-input>
+            <div class="flex algin-items">
+              <el-button
+                @click="rightAnswerClick(index)"
+                class="right"
+                :class="{
+                  active: answerNum.indexOf(index) >= 0,
+                }"
+                icon="el-icon-check"
+              >
+                设为答案
+              </el-button>
+              <el-button
+                size="mini"
+                type="danger"
+                v-if="index > 0"
+                @click.prevent="removeDomain(question)"
+                plain
+                icon="el-icon-delete"
+                >删除</el-button
+              >
+            </div>
+          </div>
+        </el-form-item>
+
+        <!-- <el-form-item
+          class="noAttr"
+          :label="`选项${form.questions.length + 1}`"
+          prop=""
+        >
+          <div class="add-select flex">
             <el-input
               type="textarea"
               placeholder="多行输入"
               resize="none"
-              rows="4"
-              v-model="form.topicTitle"
+              rows="2"
+              v-model="addValue"
+              style="flex: 1; margin-right: 10px"
             >
             </el-input>
-          </el-form-item>
-        </div>
-
-        <div class="bottom">
-          <!-- <el-form-item label="选项1" prop="title">
-            <el-input v-model="form.title" placeholder="请输入"></el-input>
-          </el-form-item> -->
-          <el-form-item
-            v-for="(question, index) in form.questions"
-            :label="'选项' + (index + 1)"
-            :key="question.key"
-            :prop="'questions.' + index + '.value'"
-            :rules="
-              index === 0
-                ? {
-                    required: true,
-                    message: '第一项不能为空不能为空',
-                    trigger: 'blur',
-                  }
-                : {}
-            "
-          >
-            <div class="add-select flex">
-              <el-input
-                type="textarea"
-                placeholder="多行输入"
-                style="flex: 1; margin-right: 10px"
-                rows="2"
-                v-model="question.value"
-              ></el-input>
-              <div class="flex algin-items">
-                <el-button
-                  @click="rightAnswerClick(index)"
-                  class="right"
-                  :class="{ active: answerNum === index }"
-                  icon="el-icon-check"
-                >
-                  设为答案
-                </el-button>
-                <el-button
-                  size="mini"
-                  type="danger"
-                  v-if="index > 0"
-                  @click.prevent="removeDomain(question)"
-                  plain
-                  icon="el-icon-delete"
-                  >删除</el-button
-                >
-              </div>
-            </div>
-          </el-form-item>
-
-          <el-form-item
-            class="noAttr"
-            :label="`选项${form.questions.length + 1}`"
-            prop=""
-          >
-            <div class="add-select flex">
-              <el-input
-                type="textarea"
-                placeholder="多行输入"
-                resize="none"
-                rows="2"
-                v-model="addValue"
-                style="flex: 1; margin-right: 10px"
+            <div class="flex algin-items">
+              <el-button
+                @click="rightAnswerClick(form.questions.length)"
+                class="right"
+                :class="{ active: answerNum === form.questions.length }"
+                icon="el-icon-check"
               >
-              </el-input>
-              <div class="flex algin-items">
-                <el-button
-                  @click="rightAnswerClick(form.questions.length)"
-                  class="right"
-                  :class="{ active: answerNum === form.questions.length }"
-                  icon="el-icon-check"
-                >
-                  设为答案
-                </el-button>
+                设为答案
+              </el-button>
 
-                <el-button
-                  size="mini"
-                  class="right1"
-                  @click.prevent="add(addValue)"
-                  icon="el-icon-plus"
-                  >新增</el-button
-                >
-              </div>
+              <el-button
+                size="mini"
+                class="right1"
+                @click.prevent="add(addValue)"
+                icon="el-icon-plus"
+                >新增</el-button
+              >
             </div>
-          </el-form-item>
+          </div>
+        </el-form-item> -->
+        <div style="padding-left: 55px" v-if="form.topicType != 3">
+          <el-button size="mini" type="primary" @click.prevent="add(addValue)"
+            >新增选项</el-button
+          >
         </div>
-      </el-form>
-    </div>
-  </template>
+      </div>
+    </el-form>
+  </div>
+</template>
 
   <script>
-  export default {
-    name: "AnswerLesson",
-    data() {
-      return {
-        form: {
-          topicTitle: "",
-          questions: [{ value: "" }, { value: "" }, { value: "" }],
-        },
-        answerNum: null,
-        addValue: "",
-        // 录入的是第几道题
-        questionNextNum: 1,
-        courseName: "",
-      };
-    },
-
-    created() {
+export default {
+  name: "AnswerLesson",
+  data() {
+    return {
+      form: {
+        topicType: 1,
+        topicTitle: "",
+        questions: [{ value: "" }, { value: "" }],
+      },
+      answerNum: [],
+      addValue: "",
+      // 录入的是第几道题
+      questionNextNum: 1,
+      courseName: "",
+    };
+  },
 
+  created() {},
+  methods: {
+    topicTypeChange(num) {
+      if (num == 1) {
+        this.answerNum = [];
+      } else if (num == 2) {
+        this.answerNum = [];
+        // this.form.questions=[{ value: "" }, { value: "" }];
+      } else {
+        this.answerNum = [];
+        const form = {
+          topicType: 3,
+          topicTitle: this.form.topicTitle,
+          questions: [{ value: "对" }, { value: "错" }],
+        };
+        this.form = form;
+      }
     },
-    methods: {
-      //设置正确答案
-      rightAnswerClick(index) {
-        this.answerNum = index;
-      },
-      // 删除选项
-      removeDomain(question) {
-        const index = this.form.questions.indexOf(question);
-        // 如果是正确答案,就让正确答案清空
-        if (this.answerNum === index) {
-          this.answerNum = null;
-        }
-        if (index >= 0) {
-          this.form.questions.splice(index, 1);
+    //设置正确答案
+    // rightAnswerClick(index) {
+    //   this.answerNum = index;
+    // },
+    rightAnswerClick(index) {
+      if (this.form.topicType === 2) {
+        const ind = this.answerNum.indexOf(index);
+        if (ind < 0) {
+          this.answerNum.push(index);
+        } else {
+          this.answerNum.splice(ind, 1);
         }
-      },
-      // 新增选项
-      add(addValue) {
-        this.form.questions.push({ value: addValue });
-      },
-      reset() {
-        this.form = {
-          topicTitle: "",
-          questions: [{ value: "" }, { value: "" }, { value: "" }],
-        };
-        this.answerNum = null;
-        this.addValue = "";
-      },
+        this.answerNum = this.answerNum.sort((a, b) => {
+          return a - b;
+        });
+        console.log(this.answerNum);
+      } else {
+        // 判断跟单选模式差不多
+        this.answerNum = [index];
+      }
     },
-  };
-  </script>
+    // 删除选项
+    // removeDomain(question) {
+    //   const index = this.form.questions.indexOf(question);
+    //   // 如果是正确答案,就让正确答案清空
+    //   if (this.answerNum === index) {
+    //     this.answerNum = null;
+    //   }
+    //   if (index >= 0) {
+    //     this.form.questions.splice(index, 1);
+    //   }
+    // },
+    removeDomain(question) {
+      const index = this.form.questions.indexOf(question);
+      console.log(index);
+      // 如果是正确答案,就让正确答案清空
+      const ind = this.answerNum.indexOf(index);
+      if (ind >= 0) {
+        this.answerNum.splice(ind, 1);
+      }
+      // 如果是最后一位呗删除，那不用管，如果不是最后一位置，这一位删除之后，则这一位后面的所有数字都要-1;
+      if (index != this.form.questions.length - 1) {
+        this.answerNum = this.answerNum.map((item, i) => {
+          if (item >= index) {
+            return item - 1;
+          } else {
+            return item;
+          }
+        });
+      }
+      if (index >= 0) {
+        this.form.questions.splice(index, 1);
+      }
+      console.log(this.answerNum);
+      // console.log(this.form.questions)
+    },
+    // 新增选项
+    add(addValue) {
+      this.form.questions.push({ value: addValue });
+    },
+    reset() {
+      this.form = {
+        topicTitle: "",
+        questions: [{ value: "" }, { value: "" }],
+      };
+      this.answerNum = null;
+      this.addValue = "";
+    },
+  },
+};
+</script>
   <style lang="scss" scoped>
-  .add-question {
-    width: 100%;
-    height: 250px;
-    // overflow: hidden;
+.add-question {
+  width: 100%;
+  height: 250px;
+  // overflow: hidden;
+  flex-direction: column;
+  padding-bottom: 7px;
+  margin-bottom: 20px;
+  border-bottom: 1px solid #bbbbbb;
+  justify-content: space-between;
+  .form {
+    flex: 1;
     flex-direction: column;
-    padding-bottom: 7px;
-    margin-bottom: 20px;
-    border-bottom: 1px solid #bbbbbb;
-    justify-content: space-between;
-    .form {
-      flex: 1;
-      flex-direction: column;
-      height: 100%;
-      .bottom {
-        overflow-y: auto;
-        height: 330px;
-        box-sizing: border-box;
+    height: 100%;
+    .bottom {
+      overflow-y: auto;
+      height: 330px;
+      box-sizing: border-box;
 
-        .algin-items {
-          align-items: center;
-          width: 200px;
+      .algin-items {
+        align-items: center;
+        width: 200px;
+      }
+      .right {
+        display: inline-block;
+        width: 133px;
+        margin-right: 10px;
+        line-height: initial;
+        padding: 4px 0;
+        border: 1px solid #0bab0c;
+        color: #0bab0c;
+        font-size: 12px;
+        text-align: center;
+        border-radius: 4px;
+        box-sizing: border-box;
+        cursor: pointer;
+        &.active {
+          background-color: #0bab0c;
+          color: #ffffff;
         }
-        .right {
-          display: inline-block;
-          width: 133px;
-          margin-right: 10px;
-          line-height: initial;
-          padding: 4px 0;
-          border: 1px solid #0bab0c;
-          color: #0bab0c;
-          font-size: 12px;
-          text-align: center;
-          border-radius: 4px;
-          box-sizing: border-box;
-          cursor: pointer;
-          &.active {
-            background-color: #0bab0c;
-            color: #ffffff;
-          }
-          &:hover {
-            background-color: rgba(11, 171, 12, 0.5);
-            color: #ffffff;
-          }
+        &:hover {
+          background-color: rgba(11, 171, 12, 0.5);
+          color: #ffffff;
         }
-        .right1 {
-          display: inline-block;
-          margin-right: 10px;
-          line-height: initial;
-          width: 90px;
-          border: 1px solid #0bab0c;
-          color: #0bab0c;
-          font-size: 12px;
-          padding: 4px 0;
-          text-align: center;
-          border-radius: 4px;
-          box-sizing: border-box;
-          cursor: pointer;
-          &.active {
-            background-color: #0bab0c;
-            color: #ffffff;
-          }
-          &:hover {
-            background-color: rgba(11, 171, 12, 0.5);
-            color: #ffffff;
-          }
+      }
+      .right1 {
+        display: inline-block;
+        margin-right: 10px;
+        line-height: initial;
+        width: 90px;
+        border: 1px solid #0bab0c;
+        color: #0bab0c;
+        font-size: 12px;
+        padding: 4px 0;
+        text-align: center;
+        border-radius: 4px;
+        box-sizing: border-box;
+        cursor: pointer;
+        &.active {
+          background-color: #0bab0c;
+          color: #ffffff;
+        }
+        &:hover {
+          background-color: rgba(11, 171, 12, 0.5);
+          color: #ffffff;
         }
       }
     }
-    .text {
-      margin-top: 13px;
-      margin-bottom: 34px;
-      justify-content: space-between;
-      height: 28px;
-      .left {
-        line-height: 28px;
-        color: #101010;
-        font-size: 14px;
-      }
-      .right {
-        width: 411px;
-        line-height: 28px;
-        background: #1d84ff;
-        padding-right: 5px;
-        color: #fff;
-        text-align: right;
-      }
+  }
+  .text {
+    margin-top: 13px;
+    margin-bottom: 34px;
+    justify-content: space-between;
+    height: 28px;
+    .left {
+      line-height: 28px;
+      color: #101010;
+      font-size: 14px;
+    }
+    .right {
+      width: 411px;
+      line-height: 28px;
+      background: #1d84ff;
+      padding-right: 5px;
+      color: #fff;
+      text-align: right;
     }
   }
-  </style>
+}
+</style>

danger-manage-web/src/views/educationPlanExam/visitorProgram/visitorQuestion.vue

@@ -2,330 +2,564 @@
  * @Author: 纪泽龙 jizelong@qq.com
  * @Date: 2022-09-22 17:56:05
  * @LastEditors: 纪泽龙 jizelong@qq.com
- * @LastEditTime: 2022-09-28 17:54:16
+ * @LastEditTime: 2023-01-29 10:44:36
  * @FilePath: /danger-manage-web/src/views/lessonsProgram/components/QuestionList.vue
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
 <template>
-    <div ref="myBody" class="add-question flex">
-      <div style="color: #1890ff;">题目管理</div>
-      <div class="text flex">
-        <div class="left">
-          <el-button type="primary"  plain @click="enterContractTrainTopic">录入考题</el-button>
-          目前有<span>{{questionNum}}</span>道题
-          <span class="warn">温馨提示：发布课程前需要进行考试设置</span>
-        </div>
-        <!-- <div class="right">{{courseName}}</div> -->
+  <div ref="myBody" class="add-question flex">
+    <div style="color: #1890ff">题目管理</div>
+    <div class="text flex">
+      <div class="left">
+        <el-button type="primary" plain @click="enterContractTrainTopic"
+          >录入考题</el-button
+        >
+        <el-button type="primary" plain @click="changeQuestionClick"
+          >题库选题</el-button
+        >
+        目前有<span>{{ questionNum }}</span
+        >道题
+        <span class="warn">温馨提示：发布课程前需要进行考试设置</span>
+      </div>
+      <!-- <div class="right">{{courseName}}</div> -->
+    </div>
+    <div class="detail flex">
+      <div class="detail-item">
+        单选题<span>{{ bottomFrom.singleChoiceScore }}</span
+        >分/题,共<span>{{ danxs }}</span
+        >题，计<span class="textC">{{
+          danxs * bottomFrom.singleChoiceScore
+        }}</span
+        >分
+      </div>
+      <div class="detail-item">
+        多选题<span>{{ bottomFrom.multipleChoiceScore }}</span
+        >分/题,共<span>{{ duoxs }}</span> 题，计<span class="textC">{{
+          duoxs * bottomFrom.multipleChoiceScore
+        }}</span
+        >分
+      </div>
+      <div class="detail-item">
+        判断提<span>{{ bottomFrom.judgmentScore }}</span
+        >/题,共<span>{{ pds }}</span> 题，计<span class="textC">{{
+          pds * bottomFrom.judgmentScore
+        }}</span
+        >分
       </div>
+      <div class="detail-item">
+        一共<span>{{ danxs + duoxs + pds }}</span
+        >道题，总共计<span class="textC">{{
+          danxs * bottomFrom.singleChoiceScore +
+          duoxs * bottomFrom.multipleChoiceScore +
+          pds * bottomFrom.judgmentScore
+        }}</span
+        >分
+      </div>
+    </div>
 
-      <!-- 试题列表 -->
-      <div class="table flex">
-        <div class="th flex">
-          <div class="left">序号</div>
-          <div class="middle">题目名称</div>
-          <div class="right">操作</div>
-        </div>
-        <div class="td-wrapper">
-          <div
-            v-for="(item, index) in questionList"
-            :key="item.topicId"
-            class="td flex"
-          >
-            <div class="left">{{ index + 1 }}</div>
-            <div class="middle zzz">
-              {{ item.topicTitle }}
-            </div>
-            <div class="right">
-              <div>
-                <el-button
-                  @click="editContractTrainTopic(item.topicId,index + 1)"
-                  icon="el-icon-edit"
-                  type="text"
+    <!-- 试题列表 -->
+    <div class="table flex">
+      <div class="th flex">
+        <div class="left">序号</div>
+        <div class="type">题目类型</div>
+        <div class="middle">题目名称</div>
+        <div class="right">操作</div>
+      </div>
+      <div class="td-wrapper">
+        <div
+          v-for="(item, index) in questionList"
+          :key="item.topicId"
+          class="td flex"
+        >
+          <div class="left">{{ index + 1 }}</div>
+          <div class="type">{{ topicTypeArr[item.topicType] }}</div>
+
+          <div class="middle zzz">
+            {{ item.topicTitle }}
+          </div>
+          <div class="right">
+            <div>
+              <el-button
+                @click="editContractTrainTopic(item.topicId, index + 1)"
+                icon="el-icon-edit"
+                type="text"
                 >修改</el-button
-                >
-                <el-button
-                  @click="deleteContractTrainTopic(item.topicId)"
-                  icon="el-icon-delete"
-                  type="text"
+              >
+              <el-button
+                @click="deleteContractTrainTopic(item.topicId)"
+                icon="el-icon-delete"
+                type="text"
                 >删除</el-button
-                >
-              </div>
+              >
             </div>
           </div>
         </div>
-
       </div>
+    </div>
 
-      <!-- 底部 -->
-      <div class="d3">
-        <div class="rightNum flex">
-          <div class="left">考试设置</div>
-          <div class="middle flex">
-            <div class="left-text">答对题目大于</div>
-            <div>
-              <el-input
-                v-model="rightNum"
-                style="width: 60px"
-                size="mini"
-              ></el-input>
-            </div>
-            <div>为合格</div>
-          </div>
-          <div class="right">
-            <el-button
-              @click="saveRightNum"
-              icon="el-icon-check"
+    <!-- 底部 -->
+    <div class="d3">
+      <!-- <div class="rightNum flex">
+        <div class="left">考试设置</div>
+        <div class="middle flex">
+          <div class="left-text">答对题目大于</div>
+          <div>
+            <el-input
+              v-model="rightNum"
+              style="width: 60px"
               size="mini"
-              type="success"
-              >保存</el-button
-            >
+            ></el-input>
           </div>
+          <div>为合格</div>
         </div>
-        <div slot="footer" class="dialog-footer">
+        <div class="right">
           <el-button
-            type="primary"
-            @click="saveContractTrian"
-            >{{ "确认" }}</el-button
+            @click="saveRightNum"
+            icon="el-icon-check"
+            size="mini"
+            type="success"
+            >保存</el-button
           >
-          <el-button>取消</el-button>
         </div>
-      </div>
+      </div> -->
+      <div class="rightNum flex">
+        <div class="left">考试设置</div>
 
-      <el-dialog
-        title="录入题目"
-        :visible.sync="dialogVisible"
-      >
-        <visitorAdd ref="visitorAdd" :key="next"/>
-        <span slot="footer" class="dialog-footer">
-          <div slot="footer" class="dialog-footer">
-            <el-button
-              type="primary"
-              @click="save"
-              >保存</el-button
-            >
-            <el-button type="primary" @click="saveAndNext">保存并录入下一题</el-button>
-            <el-button  @click="dialogVisible = false">取消</el-button>
+        <div class="middle flex">
+          <div class="left-text">单选一题</div>
+          <div>
+            <el-input
+              v-model="bottomFrom.singleChoiceScore"
+              style="width: 50px"
+              size="mini"
+            ></el-input>
+          </div>
+          <div>分</div>
+        </div>
+        <div class="middle flex">
+          <div class="left-text">多选一题</div>
+          <div>
+            <el-input
+              v-model="bottomFrom.multipleChoiceScore"
+              style="width: 50px"
+              size="mini"
+            ></el-input>
           </div>
-        </span>
-      </el-dialog>
+          <div>分</div>
+        </div>
+
+        <div class="middle flex">
+          <div class="left-text">判断一题</div>
+          <div>
+            <el-input
+              v-model="bottomFrom.judgmentScore"
+              style="width: 50px"
+              size="mini"
+            ></el-input>
+          </div>
+          <div>分</div>
+        </div>
+
+        <div class="middle flex">
+          <div class="left-text">总分大于</div>
+          <div>
+            <el-input
+              v-model="bottomFrom.qualifiedNum"
+              style="width: 60px"
+              size="mini"
+            ></el-input>
+          </div>
+          <div>为合格</div>
+        </div>
+
+        <div class="right">
+          <el-button
+            @click="saveRightNum"
+            icon="el-icon-check"
+            size="mini"
+            type="success"
+            >保存</el-button
+          >
+        </div>
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="saveContractTrian">{{
+          "确认"
+        }}</el-button>
+        <el-button>取消</el-button>
+      </div>
     </div>
-  </template>
+
+    <el-dialog title="录入题目" :visible.sync="dialogVisible">
+      <visitorAdd ref="visitorAdd" :key="next" />
+      <span slot="footer" class="dialog-footer">
+        <div slot="footer" class="dialog-footer">
+          <el-button type="primary" @click="save">保存</el-button>
+          <el-button type="primary" @click="saveAndNext"
+            >保存并录入下一题</el-button
+          >
+          <el-button @click="dialogVisible = false">取消</el-button>
+        </div>
+      </span>
+    </el-dialog>
+    <!-- 从题库选择 -->
+    <el-dialog :visible.sync="dialogVisible2">
+      <ChangeQuestion ref="current" :courseId="courseId" />
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="currentSave">保存</el-button>
+        <el-button type="primary" @click="dialogVisible2 = false"
+          >取消</el-button
+        >
+      </div>
+    </el-dialog>
+  </div>
+</template>
 
   <script>
-  import visitorAdd from "@/views/educationPlanExam/visitorProgram/visitorAdd";
-  import {updateCourse} from "@/api/contractTrain/contractTrain";
-  import { addTopic,listTopic,getTopic,delTopic,updateTopic } from "@/api/contractTrain/contractTrainTopic";
-  export default {
-    name: "AnswerLesson",
-    props: {
-      visible: {
-        type: Boolean,
-        default: false,
+import visitorAdd from "@/views/educationPlanExam/visitorProgram/visitorAdd";
+import ChangeQuestion from "@/views/educationPlanExam/visitorProgram/ChangeQuestion";
+import { updateCourse } from "@/api/contractTrain/contractTrain";
+import {
+  addTopic,
+  listTopic,
+  getTopic,
+  delTopic,
+  updateTopic,
+} from "@/api/contractTrain/contractTrainTopic";
+export default {
+  name: "AnswerLesson",
+  props: {
+    visible: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  components: {
+    visitorAdd,
+    ChangeQuestion,
+  },
+  data() {
+    return {
+      dialogVisible: false,
+      dialogVisible2: false,
+      rightNum: 0,
+      next: 0,
+      questionList: [],
+      questionNum: null,
+      courseId: "",
+      topicTypeArr: {
+        1: "单选题",
+        2: "多选题",
+        3: "判断题",
+      },
+      bottomFrom: {
+        singleChoiceScore: 0,
+        multipleChoiceScore: 0,
+        judgmentScore: 0,
+        qualifiedNum: 0,
       },
+    };
+  },
+  computed: {
+    danxs() {
+      // return 1;
+      return this.questionList.filter((item) => item.topicType === 1).length;
     },
-    components: {
-      visitorAdd,
+    duoxs() {
+      // return 1;
+      return this.questionList.filter((item) => item.topicType === 2).length;
     },
-    data() {
-      return {
-        dialogVisible: false,
-        rightNum: 0,
-        next: 0,
-        questionList: [],
-        questionNum: null,
-        courseId: ""
-      };
+    pds() {
+      // return 1;
+      return this.questionList.filter((item) => item.topicType === 3).length;
     },
-    methods: {
-      //获取考题列表
-      getContractTopicList(contractorCourseId){
-        this.courseId = contractorCourseId;
-        listTopic({contractorCourseId:contractorCourseId}).then(res =>{
-          this.questionList = res.rows.map((item) => {
-              return {
-                topicId: item.topicId,
-                topicTitle: item.topicTitle,
-              };
+  },
+  methods: {
+    //获取考题列表
+    getContractTopicList(contractorCourseId) {
+      this.courseId = contractorCourseId;
+      listTopic({ contractorCourseId: contractorCourseId }).then((res) => {
+        console.log(res.rows);
+        this.questionList = res.rows.map((item) => {
+          return {
+            topicType: item.topicType,
+            topicId: item.topicId,
+            topicTitle: item.topicTitle,
+          };
+        });
+        this.questionNum = res.total;
+      });
+    },
+
+    //录入考题
+    enterContractTrainTopic() {
+      this.dialogVisible = true;
+      this.next++;
+      this.$nextTick(() => {
+        this.$refs.visitorAdd.questionNextNum = this.questionNum + 1;
+      });
+    },
+    changeQuestionClick() {
+      this.dialogVisible2 = true;
+    },
+    currentSave() {
+      this.$refs.current.saveAndNext();
+    },
+    //保存试题
+    save(next) {
+      new Promise((resove) => {
+        if (
+          !this.$refs.visitorAdd.answerNum &&
+          this.$refs.visitorAdd.answerNum !== 0
+        ) {
+          this.$message({
+            message: "警告，请设置一个正确答案",
+            type: "warning",
           });
-          this.questionNum = res.total;
-        })
-      },
-      //录入考题
-      enterContractTrainTopic(){
-        this.dialogVisible = true;
-        this.next++;
-        this.$nextTick(() => {
-          this.$refs.visitorAdd.questionNextNum = this.questionNum + 1;
-        })
-      },
-      //保存试题
-      save(next) {
-        new Promise((resove) => {
-            if (!this.$refs.visitorAdd.answerNum && this.$refs.visitorAdd.answerNum !== 0) {
-            this.$message({
-              message: "警告，请设置一个正确答案",
-              type: "warning",
+          return resove(false);
+        }
+
+        this.$refs.visitorAdd.$refs.form.validate((valid) => {
+          if (valid) {
+            const data = {};
+            data.contractorCourseId = this.courseId;
+            data.topicTitle = this.$refs.visitorAdd.form.topicTitle;
+            data.topicOption = JSON.stringify(
+              this.$refs.visitorAdd.form.questions
+            );
+            // data.answer = this.$refs.visitorAdd.answerNum;
+            data.answer = JSON.stringify(this.$refs.visitorAdd.answerNum);
+            data.topicType = this.$refs.visitorAdd.form.topicType;
+
+            // console.log()
+            console.log(data);
+            this.addContractTrainTopic(data).then((res) => {
+              if (res.code == 200) {
+                // 把修改的这个归位，变成正常添加
+                this.$emit("update:topicId", null);
+                this.$message({
+                  message: "添加题目成功",
+                  type: "success",
+                });
+                if (next != 1) {
+                  this.dialogVisible = false;
+                  this.getContractTopicList(this.courseId);
+                } else {
+                  this.next++;
+                }
+                resove(true);
+              }
             });
-            return resove(false);
           }
-
-          this.$refs.visitorAdd.$refs.form.validate((valid) => {
-            if (valid) {
-              const data = {};
-              data.contractorCourseId = this.courseId;
-              data.topicTitle = this.$refs.visitorAdd.form.topicTitle;
-              data.topicOption = JSON.stringify(this.$refs.visitorAdd.form.questions);
-              data.answer = this.$refs.visitorAdd.answerNum;
-              this.addContractTrainTopic(data).then((res) => {
-                  if (res.code == 200) {
-                    // 把修改的这个归位，变成正常添加
-                    this.$emit("update:topicId", null);
-                    this.$message({
-                      message: "添加题目成功",
-                      type: "success",
-                    });
-                    if(next != 1){
-                      this.dialogVisible = false;
-                      this.getContractTopicList(this.courseId)
-                    }else{
-                      this.next++;
-                    }
-                    resove(true);
-                  }
-              });
-            }
-          });
         });
-      },
-      //保存并录入下一题
-      saveAndNext() {
-        this.save(1);
-      },
-      //新增试题
-      addContractTrainTopic(data){
-        if (this.$refs.visitorAdd.form.topicId) {
-          return updateTopic({ topicId: this.$refs.visitorAdd.form.topicId, ...data });
-        } else {
-          return addTopic({ contractorCourseId: this.courseId, ...data });
-        }
-      },
-      //试题修改
-      editContractTrainTopic(topicId,index){
-        this.dialogVisible = true;
-        getTopic(topicId).then(res =>{
-          const data = res.data;
-          this.$refs.visitorAdd.form = {
-            topicId: data.topicId,
-            topicTitle: data.topicTitle,
-            questions: JSON.parse(data.topicOption),
-          };
-          this.$refs.visitorAdd.answerNum = data.answer;
-        })
-        this.$nextTick(() => {
-          this.$refs.visitorAdd.questionNextNum = index;
-        })
-      },
-      //试题删除
-      deleteContractTrainTopic(topicId){
-        this.$confirm("请确定删除该题", {
-            confirmButtonText: "确定",
-            cancelButtonText: "取消",
-            type: "warning",
-          }).then(() => {
+      });
+    },
+    //保存并录入下一题
+    saveAndNext() {
+      this.save(1);
+    },
+    //新增试题
+    addContractTrainTopic(data) {
+      if (this.$refs.visitorAdd.form.topicId) {
+        return updateTopic({
+          topicId: this.$refs.visitorAdd.form.topicId,
+          ...data,
+        });
+      } else {
+        return addTopic({ contractorCourseId: this.courseId, ...data });
+      }
+    },
+    //试题修改
+    editContractTrainTopic(topicId, index) {
+      this.dialogVisible = true;
+      getTopic(topicId).then((res) => {
+        const data = res.data;
+        this.$refs.visitorAdd.form = {
+          topicId: data.topicId,
+          topicTitle: data.topicTitle,
+          topicType: data.topicType,
+          questions: JSON.parse(data.topicOption),
+        };
+        console.log(data);
+        this.$refs.visitorAdd.answerNum = data.answer;
+      });
+      this.$nextTick(() => {
+        this.$refs.visitorAdd.questionNextNum = index;
+      });
+    },
+    //试题删除
+    deleteContractTrainTopic(topicId) {
+      this.$confirm("请确定删除该题", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
           return delTopic(topicId);
-        }).then((res) => {
-            if (res.code == 200) {
+        })
+        .then((res) => {
+          if (res.code == 200) {
             this.$message({
               message: "删除成功",
               type: "success",
             });
           }
           return this.getContractTopicList(this.courseId);
-        })
-      },
-      saveRightNum() {
-        if (this.rightNum > this.questionList.length) {
+        });
+    },
+    saveRightNum() {
+      // if (this.rightNum > this.questionList.length) {
+      //   this.$message({
+      //     message: "答对题目数应小于等于考试题目总数",
+      //     type: "warning",
+      //   });
+      //   return;
+      // }
+      if (
+        !(
+          this.bottomFrom.singleChoiceScore > 0 &&
+          this.bottomFrom.multipleChoiceScore > 0 &&
+          this.bottomFrom.judgmentScore > 0 &&
+          this.bottomFrom.qualifiedNum > 0
+        )
+      ) {
+        this.$message({
+          message: "请将分数填写完整",
+          type: "warning",
+        });
+        return;
+      }
+      console.log(this.bottomFrom);
+      // const bottomFrom = this.bottomFrom.map(item=>{
+      //   return {
+      //     singleChoiceScore:+item.singleChoiceScore,
+      //     multipleChoiceScore:+item.multipleChoiceScore,
+      //     judgmentScore:+item.judgmentScore,
+      //     qualifiedNum:+item.qualifiedNum,
+      //   }
+      // })
+      updateCourse({
+        contractorCourseId: this.courseId,
+        ...this.bottomFrom,
+      }).then((res) => {
+        if (res.code == 200) {
           this.$message({
-            message: "答对题目数应小于等于考试题目总数",
-            type: "warning",
+            message: "答题合格数修改成功",
+            type: "success",
           });
-          return;
         }
-        updateCourse({ contractorCourseId: this.courseId, qualifiedNum: this.rightNum }).then((res) => {
-            if (res.code == 200) {
-                this.$message({
-                  message: "答题合格数修改成功",
-                  type: "success",
-                });
-              }
-            }
-        );
-
-      },
+      });
+    },
 
-      //保存承包商信息
-      saveContractTrian(){
-        updateCourse(this.$parent.contractTrainForm).then(res =>{
-          if(res.code == 200){
-            this.$message({
-              message: "培训信息修改成功",
-              type: "success",
-            });
-            this.$parent.getContractTrainList();
-          }
-        })
-      }
+    //保存承包商信息
+    saveContractTrian() {
+      updateCourse(this.$parent.contractTrainForm).then((res) => {
+        if (res.code == 200) {
+          this.$message({
+            message: "培训信息修改成功",
+            type: "success",
+          });
+          this.$parent.getContractTrainList();
+        }
+      });
     },
-  };
-  </script>
+  },
+};
+</script>
   <style lang="scss" scoped>
-  .add-question {
-    width: 100%;
-    height: 550px;
-    // overflow: hidden;
+.add-question {
+  width: 100%;
+  height: 550px;
+  // overflow: hidden;
+  flex-direction: column;
+  padding-bottom: 7px;
+  margin-bottom: 20px;
+  border-bottom: 1px solid #bbbbbb00;
+
+  .text {
+    margin-top: 13px;
+    margin-bottom: 32px;
+    justify-content: space-between;
+    height: 28px;
+    .left {
+      line-height: 28px;
+      color: #101010;
+      font-size: 14px;
+      .warn {
+        display: inline-flex;
+        font-size: 12px;
+        color: red;
+        margin-left: 10px;
+      }
+    }
+
+    .right {
+      width: 411px;
+      line-height: 28px;
+      background: #1d84ff;
+      padding-right: 5px;
+      color: #fff;
+      text-align: right;
+    }
+  }
+
+  .detail {
+    position: absolute;
+    bottom: 10px;
+    left: 50px;
+    .textC {
+      font-weight: 800;
+      font-size: 18px;
+    }
+    .detail-item {
+      margin-right: 20px;
+      color: red;
+    }
+  }
+  .table {
+    flex: 1;
+    height: 0;
+
     flex-direction: column;
-    padding-bottom: 7px;
-    margin-bottom: 20px;
-    border-bottom: 1px solid #bbbbbb00;
+    .th {
+      width: 100%;
+      height: 70px;
+      line-height: 70px;
+      background: #f5f5f5;
+      color: #606266;
 
-    .text {
-      margin-top: 13px;
-      margin-bottom: 32px;
-      justify-content: space-between;
-      height: 28px;
+      > div {
+        height: 100%;
+      }
       .left {
-        line-height: 28px;
-        color: #101010;
-        font-size: 14px;
-        .warn {
-          display: inline-flex;
-          font-size: 12px;
-          color: red;
-          margin-left: 10px;
-        }
+        width: 15%;
+        text-align: center;
+      }
+      .type {
+        width: 10%;
+        text-align: center;
+      }
+      .middle {
+        width: 50%;
+        padding-left: 50px;
       }
-
       .right {
-        width: 411px;
-        line-height: 28px;
-        background: #1d84ff;
-        padding-right: 5px;
-        color: #fff;
-        text-align: right;
+        width: 25%;
+        text-align: center;
       }
     }
-    .table {
+    .td-wrapper {
       flex: 1;
-      height: 0;
-
-      flex-direction: column;
-      .th {
-        width: 100%;
-        height: 70px;
-        line-height: 70px;
-        background: #f5f5f5;
-        color: #606266;
-
+      overflow-y: auto;
+      // 这样子元素才能有滚动条
+      .td {
+        height: 68px;
+        line-height: 68px;
+        box-sizing: border-box;
+        border-bottom: 1px solid #bbbbbb;
+        &:last-child {
+          border-bottom: none;
+        }
         > div {
           height: 100%;
         }
@@ -333,82 +567,59 @@
           width: 15%;
           text-align: center;
         }
+        .type {
+          width: 10%;
+          text-align: center;
+        }
         .middle {
-          width: 60%;
-          padding-left: 100px;
+          width: 50%;
+          padding-left: 50px;
         }
         .right {
           width: 25%;
           text-align: center;
         }
       }
-      .td-wrapper {
-        flex: 1;
-        overflow-y: auto;
-        // 这样子元素才能有滚动条
-        .td {
-          height: 68px;
-          line-height: 68px;
-          box-sizing: border-box;
-          border-bottom: 1px solid #bbbbbb;
-          &:last-child {
-            border-bottom: none;
-          }
-          > div {
-            height: 100%;
-          }
-          .left {
-            width: 15%;
-            text-align: center;
-          }
-          .middle {
-            width: 60%;
-            padding-left: 10px;
-          }
-          .right {
-            width: 25%;
-            text-align: center;
-          }
-        }
-      }
-    }
-    .d3{
-      display: flex;
-      justify-content: right;
     }
-    .dialog-footer{
-      margin-top: 15px;
+  }
+  .d3 {
+    display: flex;
+    justify-content: right;
+  }
+  .dialog-footer {
+    margin-top: 15px;
+  }
+  .rightNum {
+    margin-top: 5px;
+    // width: 50%;
+    height: 55px;
+    box-sizing: border-box;
+    border: 1px solid #bbbbbb;
+    line-height: 55px;
+    margin-right: 20px;
+    padding-right: 10px;
+    > .left {
+      width: 100px;
+      background: #0bab0c;
+      font-size: 14px;
+      color: #fff;
+      text-align: center;
     }
-    .rightNum {
-      margin-top: 5px;
-      width: 50%;
-      height: 55px;
-      box-sizing: border-box;
-      border: 1px solid #bbbbbb;
-      line-height: 55px;
-      margin-right: 20px;
-      > .left {
-        width: 140px;
-        background: #0bab0c;
-        font-size: 14px;
-        color: #fff;
-        text-align: center;
+    > .middle {
+      > div {
+        margin-right: 5px;
       }
-      > .middle {
-        > div {
-          margin-right: 5px;
-        }
-        .left-text {
-          margin-left: 10px;
-        }
-        .middle {
-          margin-right: 20px;
-        }
+      .left-text {
+        margin-left: 10px;
       }
-      .right {
-        margin-left: 20px;
+      .middle {
+        margin-right: 20px;
       }
-      // background: black;
     }
+    .right {
+      margin-left: 20px;
+    }
+    // background: black;
   }
-  </style>
+}
+</style>

danger-manage-web/src/views/system/qRCode/index.vue

+<!--
+ * @Author: 纪泽龙 jizelong@qq.com
+ * @Date: 2023-01-17 13:47:40
+ * @LastEditors: 纪泽龙 jizelong@qq.com
+ * @LastEditTime: 2023-01-28 17:58:47
+ * @FilePath: /danger-manage-web/src/views/system/qRCode/index.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
 <template>
-  <img :src="src" style="  position: relative;
-left: 37%;
-top: 10%;
-width: 27%;">
+  <img :src="src" style="position: relative; left: 37%; top: 10%; width: 27%" />
 </template>
 <script>
-  const src = require('../qRCode/img/qrcode_1673250700723.png')
-  export default{
-    computed:{
-      src(){
-        return src
-      }
-    }
-  }
+const src = require("../qRCode/img/qrcode_1673250700723.png");
+export default {
+  computed: {
+    src() {
+      return src;
+    },
+  },
+};
 </script>
 

danger-manage-web/src/views/visitorExam/Trainingmaterials/ExaminationQuestions.vue

@@ -11,24 +11,44 @@
     destroy-on-close
   >
     <div ref="myBody" class="body" v-loading="loading">
-<!--      <div class="text">-->
-<!--        <div class="float">访客和供应商培训管理</div>-->
-<!--      </div>-->
+      <!--      <div class="text">-->
+      <!--        <div class="float">访客和供应商培训管理</div>-->
+      <!--      </div>-->
       <transition name="fade" mode="out-in">
         <div :key="goodJobShow">
           <template v-if="!goodJobShow">
-            <transition name="fade" mode="out-in" >
+            <transition name="fade" mode="out-in">
               <div class="question-wrapper" v-if="visible" :key="nowQuestion">
                 <div v-for="(item, index) in list" :key="item.id">
-                  <Question
-                    style="width: 89%;"
+                  <!-- <Question
+                    style="width: 89%"
                     v-if="index === nowQuestion"
                     :questionObj="item"
                     :index="index"
                     :nowQuestion="nowQuestion"
                     :selectLetter="selectLetter"
                     @changeLetter="changeLetter"
-                  />
+                  /> -->
+                  <template v-if="item.topicType == 1 || item.topicType === 3">
+                    <Question
+                      v-if="index === nowQuestion"
+                      :questionObj="item"
+                      :index="index"
+                      :nowQuestion="nowQuestion"
+                      :selectLetter="selectLetter"
+                      @changeLetter="changeLetter"
+                    />
+                  </template>
+                  <template v-else>
+                    <QuestionChoice
+                      v-if="index === nowQuestion"
+                      :questionObj="item"
+                      :index="index"
+                      :nowQuestion="nowQuestion"
+                      :selectLetter="selectLetter"
+                      @changeLetter="changeLetter"
+                    />
+                  </template>
                 </div>
               </div>
             </transition>
@@ -65,14 +85,14 @@
     </div>
 
     <div slot="footer" class="dialog-footer">
-<!--      <el-button type="primary" @click="closeFinished" v-if="goodJobShow"-->
-<!--      >重新考试</el-button-->
-<!--      >-->
+      <!--      <el-button type="primary" @click="closeFinished" v-if="goodJobShow"-->
+      <!--      >重新考试</el-button-->
+      <!--      >-->
       <el-button type="primary" @click="closeFinished" v-if="goodJobShow"
-      >确定</el-button
+        >确定</el-button
       >
       <el-button type="primary" @click="dialogSubmitForm" v-else
-      >交卷</el-button
+        >交卷</el-button
       >
       <el-button @click="dialogCancel">取消</el-button>
     </div>
@@ -80,247 +100,254 @@
 </template>
 
 <script>
-  import Question from "../Trainingmaterials/components/Question";
-  import GoodJob from "../Trainingmaterials/components/GoodJob.vue";
-  import {
-    userQuestionList,
-    setAnswer,
-  } from "@/api/educationPlanExam/lessonsProgram";
-  import {
-    listTopic,
-    setEsult
-  } from "@/api/contractTrain/contractTrainTopic";
-  export default {
-    name: "AnswerLesson",
-    props: {
-      visible: {
-        type: Boolean,
-        default: false,
-      },
-      userCourseId: {
-        type: [Number, String],
-      },
-      courseId: {
-        type: [Number, String],
-      },
+import Question from "../Trainingmaterials/components/Question";
+import QuestionChoice from "../Trainingmaterials/components/QuestionChoice";
+import GoodJob from "./components/GoodJob.vue";
+import {
+  userQuestionList,
+  setAnswer,
+} from "@/api/educationPlanExam/lessonsProgram";
+import { listTopic, setEsult } from "@/api/contractTrain/contractTrainTopic";
+export default {
+  name: "AnswerLesson",
+  props: {
+    visible: {
+      type: Boolean,
+      default: false,
     },
-    from:{
-      answers:{}
+    userCourseId: {
+      type: [Number, String],
     },
-    components: {
-      Question,
-      GoodJob,
+    courseId: {
+      type: [Number, String],
     },
-    data() {
-      return {
-        nowQuestion: 0,
-        startHeight: "0px",
-        goodJobShow: false,
-        goodJobData: {},
-        loading: false,
-        from:{},
-        list: [
-          {
-            id: 19,
-            text: "j9",
-            question: ["adsf", "dfgsdfg", "adsfadsf", "dfasdfadsf"],
-          },
-        ],
-        answerArr: [],
-        // 题目是否被答过，如果答过，就把值传回去，如果没有答过，就是空
-        selectLetter: 999,
-      };
-    },
-    // watch: {
-    //   visible(newValue) {
-    //     if (newValue) {
-    //       this.$nextTick(() => {
-    //         this.saveBody();
-    //       });
-    //     }
-    //   },
-    // },
-    created() {
-      listTopic().then((res) => {
-        console.log(res);
-        this.list = res.rows.map((item) => {
-          return {
-            id: item.topicId,
-            text: item.topicTitle,
-            question: JSON.parse(item.topicOption).map((item) => item.value),
-          };
-        });
+  },
+  from: {
+    answers: {},
+  },
+  components: {
+    Question,
+    QuestionChoice,
+    GoodJob,
+  },
+  data() {
+    return {
+      nowQuestion: 0,
+      startHeight: "0px",
+      goodJobShow: false,
+      goodJobData: {},
+      loading: false,
+      from: {},
+      list: [
+        {
+          id: 19,
+          text: "j9",
+          question: ["adsf", "dfgsdfg", "adsfadsf", "dfasdfadsf"],
+        },
+      ],
+      answerArr: [],
+      // 题目是否被答过，如果答过，就把值传回去，如果没有答过，就是空
+      selectLetter: [],
+    };
+  },
+  // watch: {
+  //   visible(newValue) {
+  //     if (newValue) {
+  //       this.$nextTick(() => {
+  //         this.saveBody();
+  //       });
+  //     }
+  //   },
+  // },
+  created() {
+    listTopic().then((res) => {
+      console.log(res);
+      this.list = res.rows.map((item) => {
+        return {
+          id: item.topicId,
+          text: item.topicTitle,
+          topicType: item.topicType,
+          question: JSON.parse(item.topicOption).map((item) => item.value),
+        };
       });
+    });
+  },
+  methods: {
+    saveBody() {
+      this.startHeight = this.$refs.myBody.offsetHeight - 55 + "px";
     },
-    methods: {
-      saveBody() {
-        this.startHeight = this.$refs.myBody.offsetHeight - 55 + "px";
-      },
-      dialogSubmitForm() {
-        console.log(JSON.parse(this.$route.query.params))
-        // this.answerClear();
-        // this.$emit("update:visible", false);
-        this.saveBody();
-        const answers = this.answerArr.map((item) => item.answer).join(",");
-        this.form=JSON.parse(this.$route.query.params);
-        this.loading = true;
-        console.log(this.form)
-        this.form.answers=answers
-        console.log(this.form)
-        setEsult(this.form)
-          .then((res) => {
-            if (res.code == 200) {
-              this.goodJobData = res.data;
-              this.goodJobShow = true;
-            }
-          })
-          .finally(() => {
-            this.loading = false;
-            // 是否作对
-            this.$emit('jj',this.goodJobData)
-          });
-      },
-      dialogCancel() {
-        this.$emit("update:visible", false);
-      },
-      // 关闭之后
-      closeFinished() {
-        const routeData = this.$router.resolve({
-          path: '/enterInformation',      //跳转目标窗口的地址
-          query: {
+    dialogSubmitForm() {
+      // console.log(JSON.parse(this.$route.query.params));
+      // this.answerClear();
+      // this.$emit("update:visible", false);
+      this.saveBody();
+      // const answers = this.answerArr.map((item) => item.answer).join(",");
+
+      const json = JSON.stringify(this.answerArr.map((item) => item.answer));
+      const answers = json.slice(1, json.length - 1);
+
+      this.form = JSON.parse(this.$route.query.params);
+      // this.form={
+      //   beyondUnit:'1111',
+      //   name:'zzz',
+      //   sex:1,
+      //   phoneNum:13012341234
+      // }
+      this.loading = true;
+      this.form.answers = answers;
+      this.loading = true;
+      setEsult(this.form)
+        .then((res) => {
+          if (res.code == 200) {
+            this.goodJobData = res.data;
+            this.goodJobShow = true;
           }
         })
-        window.open(routeData.href, "_search");
-        // this.answerClear();
-        this.goodJobShow = false;
-      },
-      answerClear() {
-        this.answerArr = [];
-        this.nowQuestion = 0;
-      },
-      // 点题目时
-      questionNumClick(index) {
-        // 是否是回答过的,数组中存在它，那它就是回答过的
-        const bool =
-          this.answerArr.findIndex((item) => item.questionNum === index + 1) >= 0;
-        // 或者下一题与当前题目是紧挨着的并且当前题目是答完的，相差为1就算是紧挨着的
-        const nowQuestionAnswerBool = this.nextQuestion(index);
-        if (bool || nowQuestionAnswerBool) {
-          this.nowQuestion = index;
-        }
-        // 赋值，如果答过的，就传回去，如果没答过，就是空 变成字符串是因为0位false
-        this.selectLetter =
-          this.answerArr[this.nowQuestion]?.answer + "" || 99999;
-      },
-      nextBtnClick() {
-        // 到头了，打完了
-        if (this.nowQuestion + 1 == this.list.length) return;
-        this.questionNumClick(this.nowQuestion + 1);
-      },
-      // 紧挨着且当前题目是打完的
-      nextQuestion(index) {
-        // 下一题相差1
-        // const nextIndexBool = index - this.nowQuestion == 1;
-        // 答案数组的长度，就是档当前达到了第几题，长度-1是因为题目是从0开始记录
-        const nextIndexBool = index - (this.answerArr.length - 1) == 1;
-        // 当前题已经回答过
-        const nowQuestionAnswerBool =
-          this.answerArr.findIndex(
-            (item) => item.questionNum === this.nowQuestion + 1
-          ) >= 0;
-        return nextIndexBool && nowQuestionAnswerBool;
-      },
-      changeLetter(letter) {
-        console.log(letter);
-        console.log(this.$route.query) // 输出为：{params:"message"}
-        const obj = {};
-        obj.questionNum = this.nowQuestion + 1;
-        obj.answer = letter;
-        // 数组中是否存在这个题目
-        const index = this.answerArr.findIndex(
+        .finally(() => {
+          this.loading = false;
+          // 是否作对
+          this.$emit("jj", this.goodJobData);
+        });
+    },
+    dialogCancel() {
+      this.$emit("update:visible", false);
+    },
+    // 关闭之后
+    closeFinished() {
+      const routeData = this.$router.resolve({
+        path: "/enterInformation", //跳转目标窗口的地址
+        query: {},
+      });
+      window.open(routeData.href, "_search");
+      // this.answerClear();
+      this.goodJobShow = false;
+    },
+    answerClear() {
+      this.answerArr = [];
+      this.nowQuestion = 0;
+    },
+    // 点题目时
+    questionNumClick(index) {
+      // 是否是回答过的,数组中存在它，那它就是回答过的
+      const bool =
+        this.answerArr.findIndex((item) => item.questionNum === index + 1) >= 0;
+      // 或者下一题与当前题目是紧挨着的并且当前题目是答完的，相差为1就算是紧挨着的
+      const nowQuestionAnswerBool = this.nextQuestion(index);
+      if (bool || nowQuestionAnswerBool) {
+        this.nowQuestion = index;
+      }
+      // 赋值，如果答过的，就传回去，如果没答过，就是空 变成字符串是因为0位false
+      this.selectLetter = this.answerArr[this.nowQuestion]?.answer || [];
+    },
+    nextBtnClick() {
+      // 到头了，打完了
+      if (this.nowQuestion + 1 == this.list.length) return;
+      this.questionNumClick(this.nowQuestion + 1);
+    },
+    // 紧挨着且当前题目是打完的
+    nextQuestion(index) {
+      // 下一题相差1
+      // const nextIndexBool = index - this.nowQuestion == 1;
+      // 答案数组的长度，就是档当前达到了第几题，长度-1是因为题目是从0开始记录
+      const nextIndexBool = index - (this.answerArr.length - 1) == 1;
+      // 当前题已经回答过
+      const nowQuestionAnswerBool =
+        this.answerArr.findIndex(
           (item) => item.questionNum === this.nowQuestion + 1
-        );
-        if (index < 0) {
-          // 如果不存在
-          // 推入
-          this.answerArr.push(obj);
-        } else {
-          // 如果存在
-          // 替换
-          this.answerArr.splice(index, 1, obj);
-        }
-        // console.log(this.answerArr);
-      },
+        ) >= 0;
+      return nextIndexBool && nowQuestionAnswerBool;
     },
-  };
+    changeLetter(letter) {
+      console.log(letter);
+      console.log(this.$route.query); // 输出为：{params:"message"}
+      const obj = {};
+      obj.questionNum = this.nowQuestion + 1;
+      obj.answer = letter;
+      // 数组中是否存在这个题目
+      const index = this.answerArr.findIndex(
+        (item) => item.questionNum === this.nowQuestion + 1
+      );
+      if (index < 0) {
+        // 如果不存在
+        // 推入
+        this.answerArr.push(obj);
+      } else {
+        // 如果存在
+        // 替换
+        this.answerArr.splice(index, 1, obj);
+      }
+      // console.log(this.answerArr);
+    },
+  },
+};
 </script>
 <style lang="scss" scoped>
-  .body {
-    width: 120%;
-    height: 100%;
-    padding-right: 40px;
-    padding-left: 20px;
-    .question-wrapper {
+.body {
+  width: 100%;
+  height: 100%;
+  padding-right: 40px;
+  padding-left: 20px;
+  .question-wrapper {
+  }
+  .text {
+    margin-bottom: 16px;
+    .float {
+      padding-right: 70%;
+      width: 106%;
+      height: 28px;
+      background: #1d84ff;
+      line-height: 28px;
+      color: #ffffff;
+      font-size: 10px;
+      text-align: right;
+      float: right;
+    }
+    &:after {
+      content: "";
+      display: block;
+      clear: both;
     }
-    .text {
-      margin-bottom: 16px;
-      .float {
-        padding-right: 70%;
-        width: 106%;
+  }
+  .select {
+    .select-item {
+      padding-top: 30px;
+      flex-wrap: wrap;
+      > div {
+        margin-bottom: 10px;
+      }
+      .item {
+        width: 38px;
         height: 28px;
-        background: #1d84ff;
+        border: 1px solid #bbbbbb;
         line-height: 28px;
-        color: #ffffff;
-        font-size: 10px;
-        text-align: right;
-        float: right;
-      }
-      &:after {
-        content: "";
-        display: block;
-        clear: both;
-      }
-    }
-    .select {
-      .select-item {
-        padding-top: 30px;
-        flex-wrap: wrap;
-        > div {
-          margin-bottom: 10px;
+        font-size: 14px;
+        text-align: center;
+        margin-right: 18px;
+        cursor: pointer;
+        &.active {
+          background: #e9e9e9;
         }
-        .item {
-          width: 38px;
-          height: 28px;
-          border: 1px solid #bbbbbb;
-          line-height: 28px;
-          font-size: 14px;
-          text-align: center;
-          margin-right: 18px;
-          cursor: pointer;
-          &.active {
-            background: #e9e9e9;
-          }
-          &.now {
-            background: #a3d3ff;
-            border: none;
-          }
+        &.now {
+          background: #a3d3ff;
+          border: none;
         }
-        .btn {
-          width: 84px;
-          height: 28px;
-          background: #e8f4ff;
-          border: 1px solid #a3d3ff;
-          color: #1d84ff;
-          text-align: center;
-          line-height: 28px;
-          font-size: 14px;
-          cursor: pointer;
-          &:hover {
-            background: rgba(29, 132, 255, 0.5);
-            color: #ffffff;
-          }
+      }
+      .btn {
+        width: 84px;
+        height: 28px;
+        background: #e8f4ff;
+        border: 1px solid #a3d3ff;
+        color: #1d84ff;
+        text-align: center;
+        line-height: 28px;
+        font-size: 14px;
+        cursor: pointer;
+        &:hover {
+          background: rgba(29, 132, 255, 0.5);
+          color: #ffffff;
         }
       }
     }
   }
+}
 </style>

danger-manage-web/src/views/visitorExam/Trainingmaterials/components/AnswerLesson.vue

@@ -13,11 +13,12 @@
     <div ref="myBody" class="body" v-loading="loading">
       <div class="text">
         <div class="float">炼铁车间炉前工安全生产规范课程</div>
+        
       </div>
       <transition name="fade" mode="out-in">
         <div :key="goodJobShow">
           <template v-if="!goodJobShow">
-            <transition name="fade" mode="out-in">
+            <!-- <transition name="fade" mode="out-in">
               <div class="question-wrapper" v-if="visible" :key="nowQuestion">
                 <div v-for="(item, index) in list" :key="item.id">
                   <Question
@@ -30,6 +31,33 @@
                   />
                 </div>
               </div>
+            </transition> -->
+
+            <transition name="fade" mode="out-in">
+              <div class="question-wrapper" v-if="visible" :key="nowQuestion">
+                <div v-for="(item, index) in list" :key="item.id">
+                  <template v-if="item.topicType == 1 || item.topicType === 3">
+                    <Question
+                      v-if="index === nowQuestion"
+                      :questionObj="item"
+                      :index="index"
+                      :nowQuestion="nowQuestion"
+                      :selectLetter="selectLetter"
+                      @changeLetter="changeLetter"
+                    />
+                  </template>
+                  <template v-else>
+                    <QuestionChoice
+                      v-if="index === nowQuestion"
+                      :questionObj="item"
+                      :index="index"
+                      :nowQuestion="nowQuestion"
+                      :selectLetter="selectLetter"
+                      @changeLetter="changeLetter"
+                    />
+                  </template>
+                </div>
+              </div>
             </transition>
 
             <div class="select flex">
@@ -77,7 +105,7 @@
 
 <script>
 import Question from "./Question";
-import GoodJob from "./GoodJob.vue";
+import GoodJob from "./GoodJobOld.vue";
 import {
   userQuestionList,
   setAnswer,
@@ -148,7 +176,9 @@ export default {
       // this.answerClear();
       // this.$emit("update:visible", false);
       this.saveBody();
-      const answers = this.answerArr.map((item) => item.answer).join(",");
+      // const answers = this.answerArr.map((item) => item.answer).join(",");
+      const json = JSON.stringify(this.answerArr.map((item) => item.answer));
+      const answers = json.slice(1, json.length - 1);
       this.loading = true;
       setAnswer({
         userCourseId: this.userCourseId,
@@ -158,13 +188,12 @@ export default {
           if (res.code == 200) {
             this.goodJobData = res.data;
             this.goodJobShow = true;
-
           }
         })
         .finally(() => {
           this.loading = false;
           // 是否作对
-          this.$emit('jj',this.goodJobData)
+          this.$emit("jj", this.goodJobData);
         });
     },
     dialogCancel() {

danger-manage-web/src/views/visitorExam/Trainingmaterials/components/GoodJob.vue

@@ -2,7 +2,7 @@
  * @Author: 纪泽龙 jizelong@qq.com
  * @Date: 2022-09-21 17:20:49
  * @LastEditors: 纪泽龙 jizelong@qq.com
- * @LastEditTime: 2022-09-28 11:56:49
+ * @LastEditTime: 2023-01-12 17:00:34
  * @FilePath: /danger-manage-web/src/views/myLessons/components/GoodJob.vue
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
@@ -13,17 +13,16 @@
         <template v-if="goodJobData.answer >= goodJobData.qualifiedNum">
           <div class="icon"><i class="iconfont icon-smiling" /></div>
           <div>
-            恭喜你，做对{{ goodJobData.answer }}道题得分{{
-              Math.floor((goodJobData.answer / goodJobData.topicNum) * 100)
-            }}，成绩合格！
+            <!-- 恭喜你，做对{{ goodJobData.answer }}道题 -->
+            恭喜你，得分{{ goodJobData.answer }}，成绩合格！
           </div>
         </template>
         <template v-else>
           <div class="icon"><i class="iconfont icon-nanguo" /></div>
           <div>
-            继续努力，做对{{ goodJobData.answer }}道题得分{{
-              Math.floor((goodJobData.answer / goodJobData.topicNum) * 100)
-            }}，成绩不合格！
+            继续努力，
+            <!-- 做对{{ goodJobData.answer }}道题 -->
+            得分{{ goodJobData.answer }}，成绩不合格！
           </div>
         </template>
       </div>
@@ -49,16 +48,16 @@ export default {
 .goodjob-wrapper {
   justify-content: center;
   align-items: center;
-  width: 86%;
+  width: 100%;
   height: 100%;
   border-bottom: 1px solid #bbbbbb;
   .text {
-    width: 94%;
-    height: 174px;
+    width: 100%;
+    height: 136px;
     color: #1d84ff;
     background: #f9f9f9 100%;
     border-radius: 15px;
-    line-height: 40px;
+    line-height: 136px;
     font-size: 28px;
     justify-content: center;
     align-items: center;

danger-manage-web/src/views/visitorExam/Trainingmaterials/components/GoodJobOld.vue

+<!--
+ * @Author: 纪泽龙 jizelong@qq.com
+ * @Date: 2022-09-21 17:20:49
+ * @LastEditors: 纪泽龙 jizelong@qq.com
+ * @LastEditTime: 2022-09-28 11:56:49
+ * @FilePath: /danger-manage-web/src/views/myLessons/components/GoodJob.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<template>
+  <div class="goodjob-wrapper flex">
+    <div class="text flex">
+      <div class="text flex">
+        <template v-if="goodJobData.answer >= goodJobData.qualifiedNum">
+          <div class="icon"><i class="iconfont icon-smiling" /></div>
+          <div>
+            恭喜你，做对{{ goodJobData.answer }}道题得分{{
+              Math.floor((goodJobData.answer / goodJobData.topicNum) * 100)
+            }}，成绩合格！
+          </div>
+        </template>
+        <template v-else>
+          <div class="icon"><i class="iconfont icon-nanguo" /></div>
+          <div>
+            继续努力，做对{{ goodJobData.answer }}道题得分{{
+              Math.floor((goodJobData.answer / goodJobData.topicNum) * 100)
+            }}，成绩不合格！
+          </div>
+        </template>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "",
+  props: {
+    goodJobData: {
+      type: Object,
+    },
+  },
+  data() {
+    return {};
+  },
+  methods: {},
+};
+</script>
+<style lang="scss" scoped>
+.goodjob-wrapper {
+  justify-content: center;
+  align-items: center;
+  width: 86%;
+  height: 100%;
+  border-bottom: 1px solid #bbbbbb;
+  .text {
+    width: 94%;
+    height: 174px;
+    color: #1d84ff;
+    background: #f9f9f9 100%;
+    border-radius: 15px;
+    line-height: 40px;
+    font-size: 28px;
+    justify-content: center;
+    align-items: center;
+    .icon {
+      margin-right: 10px;
+      .iconfont {
+        color: #e2852a;
+        font-size: 40px !important;
+      }
+    }
+  }
+}
+</style>

danger-manage-web/src/views/visitorExam/Trainingmaterials/components/Question.vue

@@ -2,12 +2,13 @@
  * @Author: 纪泽龙 jizelong@qq.com
  * @Date: 2022-09-21 11:00:14
  * @LastEditors: 纪泽龙 jizelong@qq.com
- * @LastEditTime: 2022-09-28 11:15:27
+ * @LastEditTime: 2023-01-29 09:29:14
  * @FilePath: /danger-manage-web/src/views/myLessons/components/Question.vue
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
 <template>
   <div class="question flex">
+    <div class="tips">{{ tipsArr[questionObj.topicType] }}</div>
     <div
       class="top"
       :class="{ flex: alignItemsCenter }"
@@ -23,7 +24,7 @@
       <div
         class="item flex"
         v-for="(item, index) in questionObj.question"
-        :key="item+'aas'+index"
+        :key="item + 'aas' + index"
       >
         <div class="letter">
           {{ letters[index] }}
@@ -38,10 +39,10 @@
       <div class="change-wrapper flex">
         <div
           class="change"
-          :class="{ active: letterActive+'' === index+'' }"
+          :class="{ active: letterActive.indexOf(index) >= 0 }"
           @click="changeLetter(index)"
           v-for="(item, index) in questionObj.question"
-          :key="item+'a'+index"
+          :key="item + 'a' + index"
         >
           {{ letters[index] }}
         </div>
@@ -105,8 +106,8 @@ export default {
     },
     // 从外面传进来的选项，选择过的才有，没选择过的没有
     selectLetter: {
-      type: [String, Number],
-      default:999,
+      type: [String, Number, Array],
+      default: [],
     },
   },
   data() {
@@ -115,6 +116,11 @@ export default {
       // 如果传进来了，就是这个值，如果没有就是null，因为动画需要那个key的问题，会清空原始的盒子，所以要传一下值
       letterActive: this.selectLetter,
       letters,
+      tipsArr: {
+        1: "单选题",
+        2: "多选题",
+        3: "判断题",
+      },
     };
   },
   mounted() {
@@ -143,8 +149,10 @@ export default {
       }
     },
     changeLetter(index) {
-      this.letterActive = index;
-      this.$emit("changeLetter", index);
+      // this.letterActive = index;
+      // this.$emit("changeLetter", index);
+      this.letterActive = [index];
+      this.$emit("changeLetter", this.letterActive);
       // this.$emit("changeLetter", this.letters[index]);
     },
   },
@@ -161,6 +169,22 @@ export default {
   border-bottom: 1px solid #bbbbbb;
   // background: red;
   flex-direction: column;
+  position: relative;
+
+  .tips {
+    width: 80px;
+    height: 24px;
+    background: #1d84ff;
+    font-size: 14px;
+    color: #fff;
+    position: absolute;
+    // top: -45px;
+    // left: 0px;
+    top: -25px;
+    left: 70px;
+    text-align: center;
+    line-height: 24px;
+  }
   .top {
     background: #f9f9f9;
     height: 54px;
@@ -207,6 +231,7 @@ export default {
       }
     }
   }
+
   .bottom {
     max-height: 70px;
     // background: black;
@@ -217,6 +242,7 @@ export default {
       width: 756px;
       flex-wrap: wrap;
       margin: 0 auto;
+      overflow: hidden;
       .change {
         width: 90px;
         height: 30px;

danger-manage-web/src/views/visitorExam/Trainingmaterials/components/QuestionChoice.vue

+<!--
+ * @Author: 纪泽龙 jizelong@qq.com
+ * @Date: 2022-09-21 11:00:14
+ * @LastEditors: 纪泽龙 jizelong@qq.com
+ * @LastEditTime: 2023-01-29 09:34:10
+ * @FilePath: /danger-manage-web/src/views/myLessons/components/Question.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<template>
+  <div class="question flex">
+    <div class="tips">{{ tipsArr[questionObj.topicType]}}</div>
+
+    <div
+      class="top"
+      :class="{ flex: alignItemsCenter }"
+      :style="{ alignItems: alignItemsCenter ? 'center' : '' }"
+      ref="top"
+    >
+      <div class="text" ref="text">
+        {{ questionObj.text }}
+      </div>
+      <div class="num">{{ nowQuestion + 1 }}</div>
+    </div>
+    <div class="middle">
+      <div
+        class="item flex"
+        v-for="(item, index) in questionObj.question"
+        :key="item + 'aas' + index"
+      >
+        <div class="letter">
+          {{ letters[index] }}
+        </div>
+        <div class="">
+          {{ item }}
+        </div>
+      </div>
+    </div>
+
+    <div class="bottom flex">
+      <div class="change-wrapper flex">
+        <div
+          class="change"
+          :class="{ active: letterActive.indexOf(index) >= 0 }"
+          @click="changeLetter(index)"
+          v-for="(item, index) in questionObj.question"
+          :key="item + 'a' + index"
+        >
+          {{ letters[index] }}
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+const letters = [
+  "A",
+  "B",
+  "C",
+  "D",
+  "E",
+  "F",
+  "G",
+  "H",
+  "I",
+  "J",
+  "K",
+  "L",
+  "M",
+  "N",
+  "O",
+  "P",
+  "Q",
+  "R",
+  "S",
+  "T",
+  "U",
+  "V",
+  "W",
+  "X",
+  "Y",
+  "Z",
+];
+export default {
+  name: "question",
+  props: {
+    questionObj: {
+      type: Object,
+      default: () => {
+        return {
+          text: "asdfasdf",
+          question: [
+            "沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师",
+            "沙发斯蒂芬大师",
+            "沙发斯蒂芬大师",
+            "沙发斯蒂芬大师",
+            "沙发斯蒂芬大师",
+          ],
+        };
+      },
+    },
+    nowQuestion: {
+      type: Number,
+    },
+    index: {
+      type: Number,
+    },
+    // 从外面传进来的选项，选择过的才有，没选择过的没有
+    selectLetter: {
+      type: [String, Number, Array],
+      default: () => {
+        return [];
+      },
+    },
+  },
+  data() {
+    return {
+      alignItemsCenter: false,
+      // 如果传进来了，就是这个值，如果没有就是null，因为动画需要那个key的问题，会清空原始的盒子，所以要传一下值
+      letterActive: this.selectLetter,
+      letters,
+      tipsArr: {
+        1: "单选题",
+        2: "多选题",
+        3: "判断题",
+      },
+    };
+  },
+  mounted() {
+    // console.log('123')
+    // 每次都会更新，所以不需要watch 直接在这里面写 因为动画需要那个key的问题，会清空原始的盒子，所以要传一下值
+    this.textCenter();
+  },
+  watch: {
+    // 监听一下当前题目，调整一下位置
+    // nowQuestion(value) {
+    //   console.log('nowQuestion变化',value)
+    //   this.$nextTick(() => {
+    //     this.textCenter();
+    //   });
+    // },
+  },
+  methods: {
+    textCenter() {
+      let h1 = this.$refs.text?.offsetHeight;
+      let h2 = this.$refs.top?.offsetHeight;
+      // 如果text大于或者等于top，就出不居中，如果不小于top，就上下居中
+      if (h2 <= h1) {
+        this.alignItemsCenter = false;
+      } else {
+        this.alignItemsCenter = true;
+      }
+    },
+    changeLetter(index) {
+      // this.letterActive = index;
+      const ind = this.letterActive.indexOf(index);
+      console.log(this.letterActive);
+      if (ind < 0) {
+        this.letterActive.push(index);
+      } else {
+        this.letterActive.splice(ind, 1);
+      }
+
+      this.$emit("changeLetter", this.letterActive);
+      // this.$emit("changeLetter", this.letters[index]);
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.question {
+  // position: absolute;
+  // top: 0px;
+  // display: inline-block;
+  width: 100%;
+  height: 370px;
+  padding-bottom: 10px;
+  border-bottom: 1px solid #bbbbbb;
+  // background: red;
+  flex-direction: column;
+  position: relative;
+  .tips {
+    width: 80px;
+    height: 24px;
+    background: #1d84ff;
+    font-size: 14px;
+    color: #fff;
+    position: absolute;
+    // top: -45px;
+    // left: 0px;
+    top: -25px;
+    left: 70px;
+    text-align: center;
+    line-height: 24px;
+  }
+  .top {
+    background: #f9f9f9;
+    height: 54px;
+    padding: 0px 10px 0px 43px;
+    overflow-wrap: anywhere;
+    // align-items: center;
+    overflow-y: auto;
+    position: relative;
+    .text {
+      font-size: 14px;
+      text-indent: 2em;
+    }
+    .num {
+      position: absolute;
+      left: 0;
+      width: 48px;
+      height: 48px;
+      top: 4px;
+      background: #1d84ff;
+      border-radius: 50%;
+      text-align: center;
+      line-height: 48px;
+      font-size: 18px;
+      color: #ffffff;
+    }
+  }
+  .middle {
+    flex: 1;
+    // background: blue;
+    overflow-y: auto;
+    padding-left: 43px;
+    padding-right: 10px;
+    margin-bottom: 15px;
+    .item {
+      padding-top: 38px;
+      width: 100%;
+      overflow-wrap: anywhere;
+      font-size: 14px;
+      color: #101010;
+      .letter {
+        padding: 2px;
+        margin-right: 10px;
+        box-sizing: border-box;
+      }
+    }
+  }
+  .bottom {
+    max-height: 70px;
+    // background: black;
+    padding-left: 43px;
+    padding-right: 10px;
+    overflow-y: auto;
+    .change-wrapper {
+      width: 756px;
+      flex-wrap: wrap;
+      margin: 0 auto;
+      .change {
+        width: 90px;
+        height: 30px;
+        background: #e8f4ff;
+        color: #101010;
+        border: 1px solid #a3d3ff;
+        line-height: 30px;
+        text-align: center;
+        margin: 0 9px 5px;
+        border-radius: 4px;
+        cursor: pointer;
+        &.active {
+          background: #1d84ff;
+          color: #ffffff;
+          border: 1px solid #a3d3ff;
+        }
+        &:hover {
+          background: rgba(29, 132, 255, 0.5);
+          color: #ffffff;
+        }
+      }
+    }
+  }
+}
+</style>

danger-manage-web/src/views/visitorExam/Trainingmaterials/index.vue

@@ -163,7 +163,7 @@
     methods: {
       getPlanList() {
         //跳转页面的传值
-        console.log(JSON.parse(this.$route.query.params).beyondUnit)
+        // console.log(JSON.parse(this.$route.query.params).beyondUnit)
         ITContractorTrainCourse().then((res) => {
           this.data=res.data;
           this.changeVideo(this.data.video);