1

src/components/subject/SingleChoice.vue

@@ -3,7 +3,7 @@
   <view>
     <view class="item">
       <view class="name"
-        >{{ changeNumToHan(data.GSortNum + 1) }}、{{ data.GroupName }}</view
+        >{{ changeNumToHan(sort + 1) }}、{{ data.GroupName }}</view
       >
       <view
         v-for="(item1, index1) in data.DetailsList"
@@ -51,7 +51,7 @@ import {
 } from "vue";
 import { changeNumToHan } from "../../utils/index";
 export default {
-  props: { paperData: Object },
+  props: { paperData: Object, sort: Number },
   setup(props, context) {
     let { ctx } = getCurrentInstance();
 

src/components/subject/SingleChoice1.vue

+<template>
+  <!-- 单选题 -->
+  <view>
+    <view class="item">
+      <view class="name"
+        >{{ changeNumToHan(sort + 1) }}、{{ data.GroupName }}</view
+      >
+      <swiper class="swiper-box" :autoplay="autoplay">
+        <swiper-item
+          v-for="(item1, index1) in data.DetailsList"
+          :key="item1.id"
+        >
+          <view class="item1">
+            <view class="flex flex_start_center">
+              <view>{{ index1 + 1 }}、</view>
+              <view class="num" v-html="item1.Title"></view>
+            </view>
+
+            <view
+              v-for="(item2, index2) in item1.QuestionContentObj"
+              :key="item2.id"
+              class="flex item2 flex_start_center"
+            >
+              <view
+                class="chooseNum"
+                :class="{ myAnswer: item1.myAnswer === item2.Name }"
+                @click="change(index1, index2)"
+                >{{ item2.Name }}
+              </view>
+              <view
+                class="chooseName"
+                @click="change(index1, index2)"
+                v-html="item2.Content"
+              ></view>
+            </view>
+          </view>
+        </swiper-item>
+      </swiper>
+    </view>
+    <van-toast id="van-toast" />
+  </view>
+</template>
+
+<script>
+import {
+  ref,
+  reactive,
+  toRefs,
+  toRef,
+  getCurrentInstance,
+  watch,
+  computed,
+  onMounted,
+} from "vue";
+import { changeNumToHan } from "../../utils/index";
+export default {
+  props: { paperData: Object, sort: Number },
+  setup(props, context) {
+    let { ctx } = getCurrentInstance();
+
+    let data = reactive({
+      autoplay: false,
+
+      data: props.paperData,
+    });
+
+    let methods = {
+      changeNumToHan,
+      jumpPage() {
+        uni.navigateTo({
+          url: "/pages/exam/examPaper",
+        });
+      },
+      back() {
+        uni.navigateBack();
+      },
+      //选题
+      change(index1, index2) {
+        data.data.DetailsList[index1].myAnswer =
+          data.data.DetailsList[index1].QuestionContentObj[index2].Name;
+      },
+    };
+    return {
+      ...toRefs(data),
+      ...methods,
+    };
+  },
+};
+</script>
+<style scoped>
+.name {
+  height: 90rpx;
+  font-size: 28rpx;
+  font-family: PingFang SC;
+  font-weight: 800;
+  color: #111111;
+  display: flex;
+  align-items: center;
+}
+.swiper-box {
+  /* height: calc(100vh - 250rpx - constant(safe-area-inset-top, 40rpx)); */
+  height: calc(100vh - 270rpx);
+  box-sizing: border-box;
+  /* padding-bottom: env(safe-area-inset-top, 40rpx); */
+  /* background-color: #f00; */
+}
+.num {
+  font-size: 26rpx;
+  font-family: PingFang SC;
+  font-weight: bold;
+  color: #111111;
+}
+.item {
+  /* margin-bottom: 40rpx; */
+  position: relative;
+}
+.item1 {
+  /* margin: 25rpx 0; */
+  align-items: center;
+}
+.item2 {
+  padding-left: 25rpx;
+  margin: 30rpx 0;
+}
+.myAnswer {
+  background-color: #00acf9 !important;
+  color: #ffffff !important;
+}
+.chooseNum {
+  width: 40rpx;
+  height: 40rpx;
+  text-align: center;
+  line-height: 40rpx;
+  border-radius: 50%;
+  border: 1px solid #e2e2e2;
+  margin-right: 30rpx;
+  font-size: 26rpx;
+  font-family: PingFang SC;
+  font-weight: bold;
+  color: #111111;
+}
+.chooseName {
+  font-size: 24rpx;
+  font-family: PingFang SC;
+  font-weight: 500;
+  color: #111111;
+}
+</style>
\ No newline at end of file

src/pages/exam/examPaper.vue

@@ -27,9 +27,10 @@
       <view v-for="(item, index) in peaperDetail.Paper.GroupList" :key="index">
         <SingleChoice
           :paperData="item"
+          :sort="index"
           v-if="
-            item.QuestionTypeKey === 'single' ||
-            item.QuestionTypeKey === 'single-number'
+            item.GroupName === '单选题(数字)' ||
+            item.GroupName === 'single-number'
           "
         />
         <MultipleChoice
@@ -78,7 +79,7 @@ import {
 } from "vue";
 import { getSystemInfo } from "../../utils/index";
 import { getPaperDetail } from "../../api/exam";
-import SingleChoice from "../../components/subject/SingleChoice.vue";
+import SingleChoice from "../../components/subject/SingleChoice1.vue";
 import MultipleChoice from "../../components/subject/MultipleChoice.vue";
 import FillInTheBlanks from "../../components/subject/FillInTheBlanks";
 import Judge from "../../components/subject/judge.vue";
@@ -143,6 +144,6 @@ export default {
 <style scoped>
 .exam-con {
   box-sizing: border-box;
-  padding: 30rpx;
+  padding: 0 30rpx 30rpx;
 }
 </style>