diff --git a/WebRoot/html/dangjian/.vscode/settings.json b/WebRoot/html/dangjian/.vscode/settings.json
new file mode 100644
index 0000000..4798424
--- /dev/null
+++ b/WebRoot/html/dangjian/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5501
+}
\ No newline at end of file
diff --git a/WebRoot/html/dangjian/view/exam.html b/WebRoot/html/dangjian/view/exam.html
index 6b94054..c85f090 100644
--- a/WebRoot/html/dangjian/view/exam.html
+++ b/WebRoot/html/dangjian/view/exam.html
@@ -39,6 +39,29 @@
             background-clip: padding-box;
         }
 
+        .legend {
+            display: flex;
+            justify-content: space-around;
+            align-items: center;
+        }
+
+        .legend a {
+            margin: 10px;
+            width: 20px;
+            height: 20px;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            background-color: #fff;
+            border: 1px solid #ddd;
+            border-radius: 25px;
+            background-clip: padding-box;            
+        }
+
+        .legend span {
+            font-size: 14px;
+        }
+
         .mui-content-padded a .mui-icon {
             margin-top: 12px;
         }
@@ -76,29 +99,25 @@
                     <div class="mui-content">
                         <div class="mui-content-padded">
                             <p style="text-align: center;">答题卡</p>
-                            <div class="flex-container">
-                                <a class="already">1</a>
-                                <a class="already">2</a>
-                                <a class="already">3</a>
-                                <a class="already">4</a>
-                                <a class="already">5</a>
-                                <a>6</a>
-                                <a>7</a>
-                                <a>8</a>
-                                <a>9</a>
-                                <a class="already">10</a>
-                            </div>
+                            <div class="flex-container" id="answers"></div>
+                            <script id="answersTemplate" type="text/x-jsrender">
+                                {{if flag == 1}}
+                                    <a class="already">{{:order_id}}</a>
+                                {{else}}
+                                    <a>{{:order_id}}</a>
+                                {{/if}}
+                            </script>
+                        </div>
+                        <div class="legend">
+                            <div class="legend"><a class="already"></a><span>已做</span></div>
+                            <div class="legend"><a></a><span>未做</span></div>
                         </div>
-                        <!-- <div class="mui-content-padded">
-                            <div class="flex-container"><a class="already"></a>已做</div>
-                            <div class="flex-container"><a></a>未做</div>
-                        </div> -->
                     </div>
 
 
                     <!-- 菜单具体展示内容 -->
                     <button id="closeMenu" type="button" class="mui-btn mui-btn-danger mui-btn-block"
-                        style="padding: 5px 20px;">关闭侧滑菜单</button>
+                        style="padding: 5px 20px;margin-top: 10px;">关闭</button>
                 </div>
             </div>
         </aside>
@@ -176,10 +195,6 @@
 
         $(function () {
 
-
-            
-
-
             var orderId = 1;
             if ($.cookie('order_id')) {
                 orderId = $.cookie('order_id');
@@ -190,8 +205,12 @@
             // 获取一共有多少道题
             var queCount = getExamInfo();
 
+            //获取题的信息
             getQuestionInfo(orderId);
 
+            //获取答题卡信息
+            getAnswerSheet();
+
             // 右上角增加提交按钮
             var header = document.getElementById("header");
             var submitBtn = document.createElement('button');
@@ -200,11 +219,14 @@
             header.appendChild(submitBtn);
             submitBtn.addEventListener('tap', function () {
                 //提交的事件
+                console.log("!23123");
             });
 
             // 侧边栏对象
             var offCanvasWrapper = mui('#offCanvasWrapper');
             document.getElementById("showMenu").addEventListener("tap", function () {
+                //获取答题卡信息
+                getAnswerSheet();
                 offCanvasWrapper.offCanvas('show');
             });
             document.getElementById("closeMenu").addEventListener("tap", function () {
@@ -233,7 +255,8 @@
             });
 
 
-            mui(".mui-content").on("tap", "a", function () {                
+            mui(".mui-content").on("tap", "a", function () {
+                orderId = this.textContent;
                 getQuestionInfo(this.textContent);
                 offCanvasWrapper.offCanvas('close');
             })
@@ -278,6 +301,21 @@
                 });
             };
 
+            // 获取答题卡信息
+            function getAnswerSheet() {
+                $.ajax({
+                    url: "/FengHuang/exam/getPersonAllInfo",
+                    async: false,
+                    type: 'GET',
+                    success: function (res) {
+                        var template = $.templates('#answersTemplate');
+                        var htmlOutput = template.render(res);
+                        $('#answers').html(htmlOutput);
+                    }
+                });
+            }
+
+
             function getExamInfo() {
                 var queCount = 0;
                 $.ajax({
diff --git a/WebRoot/html/dangjian/view/exam_copy.html b/WebRoot/html/dangjian/view/exam_copy.html
index 6df9a6c..6ff564b 100644
--- a/WebRoot/html/dangjian/view/exam_copy.html
+++ b/WebRoot/html/dangjian/view/exam_copy.html
@@ -1,59 +1,31 @@
-<!DOCTYPE html>
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
 <html>
 
 <head>
-    <meta charset="utf-8"> 
-    
+    <title>Untitled</title>
 </head>
+<style>
+    .parent {
+        width: 500px;
+        height: 500px;
+        border: 1px solid red;
+        display: flex;
+        justify-content: space-between;
+    }
+
+    .child {
+        width: 100px;
+        height: 100px;
+        border: 1px solid red;
+    }
+</style>
 
 <body>
-
-
-    <label>AAAA</label>
-                               
-                                    a<input name="options" value="A" type="checkbox">
-                               
-                                    b<input name="options" value="B" type="checkbox">
-                                    c<input name="options" value="C" type="checkbox">
-                               
-
-
-
-    <script src="../js/jquery.min.js"></script>
-    
-    <script>
-
-
-        $(function () {
-
-            
-
-            $('input[type="checkbox"]').change(function () {
-                console.log("123123");
-                // $('input[type="checkbox"]').each(function () {
-                //     if (this.checked) {                        
-                //         console.log(this.value);
-                //     }
-                // });
-                // if ($(this).is(':checked')) {
-                //     console.log("123123");
-                //     // 如果复选框被选中，则获取它的值并处理
-                //     var value = $(this).val();
-                //     // 处理复选框选中的值
-                // }
-            });
-
-          
-        });
-
-
-
-
-
-
-
-
-    </script>
+    <div class="parent">
+        <div class="child">1</div>
+        <div class="child">2</div>
+        <div class="child">3</div>
+    </div>
 </body>
 
 </html>
\ No newline at end of file