研发需求229 支持增加多个检测，每个检测需要“是否开启答题”的开关

src/pages/chapter/qjkc.vue

@@ -1,6 +1,15 @@
 <template>
   <div>
     <van-nav-bar
+     v-if="is_tjkc"
+      :title="kcDetailData.tmk_kcm"
+      left-arrow  
+      right-text="检测"
+      @click-left="onClickLeft"
+      @click-right="onClickRight"
+    />
+     <van-nav-bar
+       v-else
       :title="kcDetailData.tmk_kcm"
       left-arrow
       @click-left="onClickLeft"
@@ -68,6 +77,7 @@ const onClickLeft = () => history.back();
 const router = useRouter();
 const route = useRoute();
 let id = route.query.tmk_id;
+let is_tjkc = route.query.is_tjkc;
 let chapterData = $ref([]);
 let kcDetailData = $ref({});
 let title = $ref("");
@@ -130,6 +140,9 @@ function linkTo(item, path){
   }
 }
 
+function onClickRight(){
+   router.push({ path: '/exam', query: { tmk_id:id} })
+}
 watch(
   () => param.keyword,
   (val) => {

src/pages/exam/index.vue

@@ -0,0 +1,81 @@
+<script setup lang='ts'>
+import { TypeMap } from "~/pages/detail/util";
+import Img from "~/assets/icon-no-data.png";
+const router = useRouter();
+const route = useRoute();
+let tmk_id = route.query.tmk_id;
+let kcDetailData = $ref({});
+let exam_list = $ref([]);
+
+getDetail();
+function getDetail() {
+  request({
+    url: "/txwx/mszy_kc/detail",
+    data: {
+      tmk_id,
+    },
+  }).then((res) => {
+    if (res.code == "1") {
+      kcDetailData = res.data.one_info;
+      exam_list = kcDetailData.txwx_exam;
+    }
+  });
+}
+function showDetail(item) {
+  router.push({
+    path: "/exam/testQuestions",
+    query: { tmk_id, te_id: item.te_id, tq_id: item.tq_ids },
+  });
+}
+</script>
+
+<template>
+  <van-nav-bar left-arrow title="检测" @click-left="() => router.back()" />
+  <div>
+    <ul v-if="exam_list.length > 0" class="res-list">
+      <li v-for="item in exam_list" :key="item"  v-show="item.te_open == '1'">
+        <h3 class="ml-10px flex-1 text-14px text-overflow color-171721">
+          {{ item.te_name }}
+        </h3>
+        <button
+          type="button"
+          class="ml-10px file-btn"
+          @click="showDetail(item)"
+        >
+          查看
+        </button>
+      </li>
+    </ul>
+    <div v-else class="py-40px text-center">
+      <div>
+        <img :src="Img" width="138" class="block m-0-auto" alt="" />
+        <h3 class="text-18px color-050026 mt-20px">暂无数据，敬请期待！</h3>
+      </div>
+    </div>
+  </div>
+</template>
+<style lang="scss" scoped>
+.res-list {
+  width: 100%;
+  padding-top: 20px;
+  li {
+    display: flex;
+    padding: 10px 20px;
+    align-items: center;
+
+    & + li {
+      border-top: 1px dashed rgba(110, 88, 197, 0.5);
+    }
+
+    .file-btn {
+      width: 58px;
+      height: 24px;
+      border: 1px solid #1259a1;
+      border-radius: 12px;
+      font-size: 12px;
+      color: #1259a1;
+      text-align: center;
+    }
+  }
+}
+</style>

src/pages/exam/testQuestions.vue

@@ -0,0 +1,264 @@
+<script setup lang='ts'>
+import { TypeMap } from "~/pages/detail/util";
+import { showFailToast, showSuccessToast } from "vant";
+const router = useRouter();
+const route = useRoute();
+let tmk_id = route.query.tmk_id;
+let te_id = route.query.te_id;
+let tq_id = route.query.tq_id;
+import Img from '~/assets/icon-no-data.png'
+let te_name = $ref("");
+let kcDetailData = $ref({});
+getDetail();
+function getDetail() {
+  request({
+    url: "/txwx/mszy_kc/detail",
+    data: {
+      tmk_id,
+    },
+  }).then((res) => {
+    if (res.code == "1") {
+      kcDetailData = res.data.one_info;
+     kcDetailData?.txwx_exam?.map((item) => {
+    if (item.te_id == te_id) {
+      te_name = item.te_name;
+    }
+  });
+   // 判断章节试题存在
+  if (te_id) getTest(te_id, tq_id, "init");
+    }
+  });
+}let testInfo = $ref([]);
+let wordVisiable = $ref(true);
+let answerVisiable = $ref(false);
+function getTest(tqr_pos, tq_id, type) {
+  request({
+    url: "/txwx/question/index",
+    data: {
+      tq_id,
+      tqr_data_type: "5",
+      tqr_data_id: tmk_id,
+      tqr_pos,
+    },
+  }).then((res) => {
+    if (res.code == "1") {
+      testInfo = res.data.page_data;
+      if (type === "init") {
+        res.data.page_data.forEach((item) => {
+          if (item.my_answer.length !== 0) {
+            answerVisiable = true;
+            wordVisiable = false;
+          } else {
+            answerVisiable = false;
+            wordVisiable = true;
+          }
+        });
+      } else {
+        answerVisiable = true;
+      }
+    }
+  });
+}
+
+let question = $ref([]);
+let flag = $ref(true);
+function isFlag(info) {
+  question = [];
+  flag = true;
+  info.forEach((item, index) => {
+    // 单选题或判断题
+    if (item.tq_type == "1" || item.tq_type == "3") {
+      if (!item.answer) {
+       showFailToast(`第${index + 1}题未选择`);
+        flag = false;
+      }
+      question.push({
+        tq_id: item.tq_id,
+        user_answer: item.answer,
+      });
+    } else {
+      // 多选题
+      if (!item.answers || item.answers?.length == 0) {
+        showFailToast(`第${index + 1}题未选择`);
+        flag = false;
+      }
+      question.push({
+        tq_id: item.tq_id,
+        user_answer: item.answers,
+      });
+      question.forEach((el) => {
+        if (Array.isArray(el.user_answer)) {
+          // 重新排序使选中数据的顺序为ABC....
+          el = el.user_answer?.sort((a, b) => {
+            return (
+              item.tq_option_choosen?.indexOf(a) -
+              item.tq_option_choosen?.indexOf(b)
+            );
+          });
+        }
+      });
+    }
+  });
+}
+function submitTest(tqr_pos) {
+  isFlag(testInfo);
+  if (flag) {
+    question.forEach((el) => {
+      if (Array.isArray(el.user_answer))
+        el.user_answer = el.user_answer.join("");
+    });
+    request({
+      url: "/txwx/question_record/save",
+      data: {
+        tqr_data_type: "5",
+        tqr_data_id: tmk_id,
+        tqr_pos,
+        question,
+      },
+    }).then((res) => {
+      if (res.code == "1") {
+       showSuccessToast(res.msg);
+        wordVisiable = false;
+        getTest(tqr_pos, tq_id, "1");
+      }
+    });
+  }
+}
+</script>
+
+<template>
+  <van-nav-bar
+    left-arrow
+    :title="te_name"
+    @click-left="() => router.back()"
+  />
+  <div>
+    <div v-if="wordVisiable && testInfo.length > 0">
+      <div class="text-14px space-y-20px px-20px" v-if="testInfo.length > 0">
+        <div v-for="item in testInfo" :key="item.tq_id">
+          <div class="flex justify-between">
+            <div class="leading-18px" v-html="item.tq_content" />
+            <div class="min-w-60px mt-8px ml-10px">
+              <span
+                class="py-3px px-10px rounded-10px bg-hex-1259A1 text-white text-12px"
+                >{{ item.tq_type_name }}</span
+              >
+            </div>
+          </div>
+          <van-radio-group
+            direction="horizontal"
+            v-if="item.tq_type == '1'"
+            v-model="item.answer"
+            fill="#1259a1"
+            class="mt-10px mb-20px"
+          >
+            <van-radio
+              v-for="e in item.tq_option_choosen"
+              :key="e"
+              size="30"
+              class="mx-10px"
+              :name="e"
+            >
+              {{ e }}
+            </van-radio>
+          </van-radio-group>
+          <van-checkbox-group
+            v-else-if="item.tq_type == '2'"
+            v-model="item.answers"
+            fill="#1259a1"
+            class="mt-10px mb-20px"
+          >
+            <van-checkbox
+              v-for="e in item.tq_option_choosen"
+              :key="e"
+              class="mx-10px"
+              :name="e"
+
+            >
+              {{ e }}
+            </van-checkbox>
+          </van-checkbox-group>
+          <van-radio-group
+            direction="horizontal"
+            v-else
+            v-model="item.answer"
+            fill="#1259a1"
+            class="mt-10px mb-20px"
+            size="30"
+          >
+            <van-radio
+              horizontal
+              v-for="e in item.tq_option_choosen"
+              :key="e"
+              size="30"
+              class="mx-10px"
+              :name="e"
+            >
+              <span class="px-10px">{{ e }}</span>
+            </van-radio>
+          </van-radio-group>
+        </div>
+        <div class="flex justify-center">
+          <span
+            class="w-80px h-35px leading-35px text-center rounded-10px bg-hex-1259A1 text-white text-18px"
+            @click="submitTest(te_id)"
+            >提交</span
+          >
+        </div>
+      </div>
+      <empty v-else />
+    </div>
+
+    <div
+      v-else-if="answerVisiable && testInfo.length > 0"
+      class="res-list bg-hex-fff w-full "
+    >
+      <div v-if="testInfo.length > 0">
+        <div class="text-14px space-y-20px px-20px" v-for="item in testInfo" :key="item.tq_id">
+          <div class="flex justify-between">
+            <div class="leading-18px" v-html="item.tq_content" />
+            <div class="min-w-60px mt-8px ml-10px">
+              <span
+                class="py-3px px-10px rounded-10px bg-hex-1259A1 text-white text-12px"
+                >{{ item.tq_type_name }}</span
+              >
+            </div>
+          </div>
+          <div class="flex my-15px text-16px">
+            <p class="mr-10px">正确答案:</p>
+            <p class="text-hex-5dc248">
+              {{ item.tq_answer }}
+            </p>
+          </div>
+          <div class="flex text-16px">
+            <p class="mr-10px">你的答案:</p>
+            <p
+              :class="
+                item.my_answer.tqr_correct == '0'
+                  ? 'text-red-500'
+                  : 'text-hex-1259A1'
+              "
+            >
+              {{ item.my_answer?.tqr_user_answer }}
+            </p>
+          </div>
+          <div class="mb-25px mt-15px text-16px">
+            <p class="text-red-500 my-10px">解析:</p>
+            <p class="leading-loose" v-html="item.tq_alyz" />
+          </div>
+        </div>
+      </div>
+    </div>
+    <div v-if="testInfo.length === 0" class="py-40px text-center">
+      <div>
+        <img
+          :src="Img"
+          width="138"
+          class="block m-0-auto"
+          alt=""
+        />
+        <h3 class="text-18px color-050026 mt-20px">暂无数据，敬请期待！</h3>
+      </div>
+    </div>
+  </div>
+</template>