feat:合并

src/views/examination/ReadyExamination.vue

@@ -14,7 +14,18 @@
           <div class="questiontype clearfix">
             <div class="type">判断题</div>
           </div>
-          <div class="questions">
+          <!-- 循环遍历生成判断题的问题和选项 -->
+          <div class="questions" v-for="(q, index) in j_questions" :key="index">
+            <div class="questiontitle">
+              {{ q.text }}
+            </div>
+            <div class="btnswitch" v-for="(j, index) in j_options" :key="index">
+              <div class="checkoutbtn"></div>
+              <div class="select">{{ j.text }}</div>
+            </div>
+          </div>
+
+          <!-- <div class="questions">
             <div class="questiontitle">1、控制计划是由工艺部门完成 （4分）</div>
             <div class="btnswitch">
               <div class="checkoutbtn"></div>
@@ -50,11 +61,45 @@
               <div class="checkoutbtn"></div>
               <div class="select">错误</div>
             </div>
-          </div>
+          </div> -->
+
           <div class="questiontype clearfix">
             <div class="type">选择题</div>
           </div>
-          <div class="questions">
+          <!-- 循环遍历生成选择题的问题和选项 -->
+          <div class="questions" v-for="(q, index) in s_questions" :key="index">
+            <div class="questiontitle">
+              {{ q.text }}
+            </div>
+            <div
+              class="btnswitch"
+              v-for="(s, index) in s_options"
+              :key="index"
+              @click="selectBtn(s)"
+            >
+              <!-- <img
+                :src="
+                  s.selected === true
+                    ? require('../../assets/image/checkbox.png')
+                    : require('../../assets/image/checkbox2.png')
+                "
+                style="width: 13.6px; height: 13.6px"
+              /> -->
+              <div
+                class="checkoutbtn"
+                :style="{
+                  'background-image':
+                    s.selected === true
+                      ? 'url(' + select + ')'
+                      : 'url(' + noselect + ')',
+                }"
+                style="background-size: 100%"
+              ></div>
+              <div class="select">{{ s.text }}</div>
+            </div>
+          </div>
+
+          <!-- <div class="questions">
             <div class="questiontitle">4、.FMEA 是一种（ ）工具（4分）</div>
             <div class="btnswitch">
               <div class="checkoutbtn"></div>
@@ -72,7 +117,7 @@
               <div class="checkoutbtn"></div>
               <div class="select">风险分析</div>
             </div>
-          </div>
+          </div> -->
           <div class="btnbox">
             <div class="submitbtn">提交试卷</div>
           </div>
@@ -81,16 +126,94 @@
     </div>
   </div>
 </template>
-
 <script>
-// import { reactive, toRefs } from "vue";
+import { reactive, toRefs } from "vue";
 import TitleHead from "@/components/TitleHead.vue";
 export default {
   name: "ReadyExamination",
   components: {
     TitleHead,
   },
-  setup() {},
+  setup() {
+    const state = reactive({
+      select: require("../../assets/image/checkbox.png"),
+      noselect: require("../../assets/image/checkbox2.png"),
+      j_questions: [
+        {
+          type: "judge",
+          id: 1,
+          text: "1、控制计划是由工艺部门完成 （4分）",
+        },
+        {
+          type: "judge",
+          id: 2,
+          text: "2、.PFMEA假定所设计的产品能满足设计要求",
+        },
+        {
+          type: "judge",
+          id: 3,
+          text: "3、PFMEA假定所设计的产品能满足设计要求 （4分）",
+        },
+      ],
+      s_questions: [
+        {
+          type: "choice",
+          id: 1,
+          text: "4、.FMEA 是一种（ ）工具（4分）",
+        },
+      ],
+      j_options: [
+        {
+          id: 1,
+          text: "正确",
+          selected: false,
+        },
+        {
+          id: 2,
+          text: "错误",
+          selected: false,
+        },
+      ],
+      s_options: [
+        {
+          id: 1,
+          text: "问题解决",
+          selected: false,
+        },
+        {
+          id: 2,
+          text: "项目策划",
+          selected: false,
+        },
+        {
+          id: 3,
+          text: "过程分析",
+          selected: false,
+        },
+        {
+          id: 4,
+          text: "风险分析",
+          selected: false,
+        },
+      ],
+    });
+    const selectBtn = (value) => {
+      let arr = state.s_options;
+      arr.map((i) => {
+        i.selected = false;
+        if (i.id === value.id) {
+          i.selected = !i.selected;
+        }
+        // console.log("iii", i);
+      });
+      state.s_options = arr;
+      console.log("iii", state.s_options);
+    };
+    return {
+      ...toRefs(state),
+      selectBtn,
+    };
+  },
 };
 </script>
 <style lang="scss" scoped>
@@ -100,12 +223,9 @@ export default {
   display: table;
   clear: both;
 }
-
 .readyexamination {
   width: 100%;
-  padding-bottom: 20px;
 }
-
 .notice {
   width: 100%;
   display: flex;
@@ -159,7 +279,7 @@ export default {
         width: 100%;
         margin-left: 9.5px;
         .questiontitle {
-          margin-bottom: 20px;
+          margin-bottom: 18px;
         }
         .btnswitch {
           display: flex;
@@ -170,7 +290,7 @@ export default {
           .checkoutbtn {
             width: 13.6px;
             height: 13.6px;
-            background-image: url(../../assets/image/checkbox2.png);
+            // background-image: url(../../assets/image/checkbox2.png);
             background-size: 100% 100%;
             margin-right: 6.5px;
           }

src/views/investigat/InvestigatPage.vue

@@ -57,7 +57,7 @@
               @click="selectPeople(value)"
             >
               <img
-                style="width: 14px; height: 13px; cursor: pointer"
+                style="width: 14px; height: 13px;"
                 :src="
                   value.select
                     ? require('../../assets/image/investigat/checkbox.png')
@@ -284,7 +284,6 @@ export default {
                   align-items: center;
                   justify-content: center;
                   // margin-left: 10px;
-                  cursor: pointer;
                 }
               }
             }
@@ -323,7 +322,6 @@ export default {
           display: flex;
           align-items: center;
           justify-content: center;
-          cursor: pointer;
           margin-top: 10.5px;
           margin-bottom: 30px;
         }