From 88f34925441f99d80b5820345ead073292898566 Mon Sep 17 00:00:00 2001
From: dsh <15569653818@163.com>
Date: Wed, 10 Apr 2024 08:57:38 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8F=90=E4=BA=A4=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../resources/templates/system/exam/exam.html | 162 ++++++++++++++++--
 1 file changed, 148 insertions(+), 14 deletions(-)
diff --git a/ruoyi-admin/src/main/resources/templates/system/exam/exam.html b/ruoyi-admin/src/main/resources/templates/system/exam/exam.html
index cb7f49a..4b167c9 100644
--- a/ruoyi-admin/src/main/resources/templates/system/exam/exam.html
+++ b/ruoyi-admin/src/main/resources/templates/system/exam/exam.html
@@ -1,9 +1,16 @@
 <!DOCTYPE html>
-<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
+<html lang="zh" xmlns:th="http://www.thymeleaf.org">
 <head>
     <th:block th:include="include :: header('保密考试')" />
 </head>
+<style>
+    .table-striped {
+        min-height: 89%;
+        overflow: auto;
+    }
+</style>
 <body class="gray-bg">
+
 <div class="container-div">
     <div class="row">
         <div class="col-sm-12 search-collapse">
@@ -25,31 +32,158 @@
                 </div>
             </form>
         </div>
-
-        <div class="col-sm-12 select-table table-striped">
-            <table id="bootstrap-table"></table>
+        <div id="question-container" class="col-sm-12 select-table table-striped">
+            <h1 id="question-number"></h1>
+            <p id="question-content"></p>
+            <form id="answer-form">
+                <div id="options"></div>
+                <button type="submit">提交答案</button>
+            </form>
+            <p id="result"></p>
+            <button id="next-question">下一题</button>
         </div>
+        <!--        <div class="col-sm-12 select-table table-striped">-->
+        <!--            <table id="bootstrap-table"></table>-->
+        <!--        </div>-->
     </div>
 </div>
 <th:block th:include="include :: footer" />
+<script src="../static/ajax/libs/layer/layer.min.js" th:src="@{/ajax/libs/layer/layer.min.js}"></script>
 <script th:inline="javascript">
-    debugger;
     var editFlag = [[${@permission.hasPermi('system:question:edit')}]];
     var removeFlag = [[${@permission.hasPermi('system:question:remove')}]];
     var TYPEIDDatas = [[${@dict.getType('td_question_type')}]];
     var prefix = ctx + "system/question";
 
-    $(function() {
-        var options = {
-            url: prefix + "/list",
-            createUrl: prefix + "/add",
-            updateUrl: prefix + "/edit/{id}",
-            removeUrl: prefix + "/remove",
-            exportUrl: prefix + "/export",
-            modalName: "保密考试",
+    // $(function() {
+    //     var options = {
+    //         url: prefix + "/list",
+    //         createUrl: prefix + "/add",
+    //         updateUrl: prefix + "/edit/{id}",
+    //         removeUrl: prefix + "/remove",
+    //         exportUrl: prefix + "/export",
+    //         modalName: "保密考试",
+    //     };
+    //     $.table.init(options);
+    // });
+    $(document).ready(function() {
+        const obj = {
+            pageSize: 10,
+            pageNum: 1,
+            isAsc: 'asc',
+            TYPEID: ''
         };
-        $.table.init(options);
+        $.ajax({
+            url: prefix + "/list",
+            type: "POST",
+            data: obj,
+            success: function(data) {
+                // 请求成功时，初始化答题系统
+                var questions = data.rows;
+                initQuestionSystem(questions);
+            },
+            error: function() {
+                // 请求失败时显示错误消息
+
+            }
+        });
     });
+
+    function initQuestionSystem(questions) {
+        let currentQuestionIndex = 0;
+        // const result = [];
+        let result1 = []
+        let result2 = []
+        // 实现显示第一题的函数
+        function showQuestion(question) {
+            // 显示题目和选项等信息
+            const questionNumberElement = document.getElementById('question-number');
+            const questionContentElement = document.getElementById('question-content');
+            const optionsElement = document.getElementById('options');
+
+            questionNumberElement.textContent = `题目 ${question.id}`;
+            questionContentElement.textContent = question.qSubject;
+            question.options = [
+                'A、' + question.optiona,
+                'B、' + question.optionb,
+                'C、' + question.optionc,
+                'D、' + question.optiond
+            ]
+            optionsElement.innerHTML = '';
+            for (let index = 0; index < question.options.length; index++) {
+                const option = question.options[index];
+                const optionElement = document.createElement('input');
+                optionElement.type = 'radio';
+                optionElement.name = 'answer';
+                optionElement.value = option;
+                optionElement.id = `option-${index}`;
+                const labelElement = document.createElement('label');
+                labelElement.htmlFor = `option-${index}`;
+                labelElement.textContent = option;
+                optionsElement.appendChild(optionElement);
+                optionsElement.appendChild(labelElement);
+                optionsElement.appendChild(document.createElement('br'));
+            }
+        }
+
+        // 检查答案的函数
+        function checkAnswer(answer) {
+            // 检查用户答案，更新result数组
+            const question = questions[currentQuestionIndex];
+            if (answer.indexOf(question.note) !== -1) {
+                // 答案正确
+                result1.push({ number: question.id, answer: answer,note:question.note,});
+                console.log('正确',result1)
+            } else {
+                result2.push({ number: question.id, answer: answer,note:question.note,});
+                console.log('错误',result2)
+            }
+        }
+
+        // 显示结果的函数
+        function showResult() {
+            // 显示用户的答题结果
+            const resultElement = document.getElementById('result');
+            resultElement.textContent = `已答题数：${result.length}`;
+        }
+
+        // 显示下一题的函数
+        function nextQuestion(event) {
+            event.preventDefault();
+            const selectedOption = document.querySelector('input[name="answer"]:checked');
+            if (selectedOption) {
+                const selectedAnswer = selectedOption.value;
+                checkAnswer(selectedAnswer);
+                // showResult();
+                // 清除选择
+                selectedOption.checked = false;
+                // 更新currentQuestionIndex，显示下一题
+                currentQuestionIndex++;
+                if (currentQuestionIndex < questions.length) {
+                    showQuestion(questions[currentQuestionIndex]);
+                } else {
+                    alert('所有题目已答完！');
+                    // 如果需要在所有题目答完后进行额外操作，可以在这里添加代码
+                }
+            } else {
+                alert('请选择一个答案！');
+            }
+
+        }
+        //提交
+        document.getElementById('answer-form').addEventListener('submit', function(event) {
+            event.preventDefault();
+            if (result1.length){
+                let int = result1.length * 2
+                console.log(int)
+            }
+        });
+        document.getElementById('next-question').addEventListener('click', nextQuestion);
+        // 初始加载第一题
+        if (questions.length > 0) {
+            showQuestion(questions[currentQuestionIndex]);
+        }
+    }
 </script>
 </body>
 </html>
\ No newline at end of file
