diff --git a/src/views/examination/ExamPage.vue b/src/views/examination/ExamPage.vue
index 2bd90e4..d358a07 100644
--- a/src/views/examination/ExamPage.vue
+++ b/src/views/examination/ExamPage.vue
@@ -34,16 +34,81 @@
     <!-- 标题 -->
     <!-- 详细内容 -->
     <div class="bascinfo">
-      <div></div>
+      <!-- 中间盒子 -->
+      <div class="centercontent">
+        <div class="righttitle">
+          <img width="20px" height="20px" src="../../assets/image/yuan.png" />
+
+          <div class="text">考试测试</div>
+          <div class="box"></div>
+        </div>
+        <!-- 考试测试的盒子 -->
+        <div class="test clearfix">
+          <div class="detail">
+            <span style="margin-right: 43px">考试时间：30分钟</span>
+            <span>及格线：60</span>
+          </div>
+          <div class="testtime clearfix">
+            <div class="timedetail">
+              考试时间：2022-7-20 00:00 至 2022-8-29 23:59:59
+            </div>
+          </div>
+        </div>
+        <!-- 考试测试的盒子 -->
+
+        <!-- 开始考试按钮 -->
+        <button class="starttest">开始考试</button>
+        <!-- 开始考试按钮 -->
+        <div class="righttitle" style="padding-top: 80px">
+          <img width="20px" height="20px" src="../../assets/image/yuan.png" />
+
+          <div class="text">历史纪录</div>
+          <div class="box" style="top: 94px"></div>
+        </div>
+
+        <div class="history">
+          <div class="historytitle clearfix tongyi">
+            <div class="content1">提交时间</div>
+            <div class="content2">成绩</div>
+            <div class="content3">状态</div>
+            <div class="content4">操作</div>
+          </div>
+          <div class="historytitle2 clearfix tongyi">
+            <div class="content1">2022-7-20&nbsp;00:00</div>
+            <div class="content2">10分</div>
+            <div class="content3" style="left: 505px">已完成</div>
+            <button class="contentbtn">查看考卷</button>
+          </div>
+          <div class="fenge"></div>
+          <div class="historytitle2 clearfix tongyi">
+            <div class="content1">2022-7-18&nbsp;00:00</div>
+            <div class="content2">10分</div>
+            <div class="content3" style="left: 505px">已完成</div>
+            <button class="contentbtn">查看考卷</button>
+          </div>
+          <div class="fenge"></div>
+          <div
+            class="historytitle2 clearfix tongyi"
+            style="border-radius: 0px 0px 8px 8px"
+          >
+            <div class="content1">2022-7-14&nbsp;00:00</div>
+            <div class="content2">10分</div>
+            <div class="content3" style="left: 505px">已完成</div>
+            <button class="contentbtn">查看考卷</button>
+          </div>
+        </div>
+      </div>
     </div>
     <!-- 详细内容 -->
   </div>
 </template>
+
 <script>
 export default {
   name: "ExamPage",
 };
 </script>
+
 <style scoped lang="scss">
 .surveydetail {
   .crumb {
@@ -73,6 +138,7 @@ export default {
     margin-left: -11px;
   }
   .bascinfo {
+    min-height: 800px;
     width: 100%;
     background: #ffffff;
     border-radius: 8px;
@@ -80,6 +146,153 @@ export default {
     display: flex;
     flex-direction: column;
     align-items: center;
+    .clearfix:before,
+    .clearfix:after {
+      content: "";
+      display: table;
+      clear: both;
+    }
+    .centercontent {
+      position: relative;
+      .righttitle {
+        display: flex;
+        padding-top: 30px;
+        position: relative;
+        .text {
+          margin-left: 8px;
+          font-size: 16px;
+          color: rgba(51, 51, 51, 1);
+          font-weight: 800;
+        }
+        .box {
+          width: 75px;
+          height: 10px;
+          background-color: rgba(36, 120, 255, 0.15);
+          position: absolute;
+          left: 23px;
+          top: 44px;
+        }
+      }
+      .test {
+        margin-top: 16px;
+        margin-bottom: 26px;
+        width: 842px;
+        height: 158px;
+        background: #f2f5f7;
+        border-radius: 8px;
+        .detail {
+          margin-top: 29px;
+          margin-left: 44px;
+          height: 14px;
+          font-size: 14px;
+          font-family: PingFang SC;
+          font-weight: 500;
+          color: #56a3f9;
+        }
+        .testtime {
+          margin-top: 20px;
+          margin-left: 10px;
+          width: 823px;
+          height: 81px;
+          background: #ffffff;
+          border-radius: 0px 8px 0px 8px;
+          .timedetail {
+            font-size: 14px;
+            font-family: PingFang SC;
+            font-weight: 500;
+            color: #333330;
+            margin-top: 32px;
+            margin-left: 34px;
+          }
+        }
+      }
+      .starttest {
+        position: absolute;
+        width: 146px;
+        height: 46px;
+        background: #2478ff;
+        box-shadow: 0px 1px 8px 0px rgba(56, 125, 247, 0.7);
+        border-radius: 4px;
+        border: 0;
+        font-size: 14px;
+        font-family: PingFang SC;
+        font-weight: 800;
+        color: #ffffff;
+        left: calc(50% - 73px);
+      }
+      .history {
+        position: relative;
+        margin-top: 32px;
+        width: 842px;
+        height: 200px;
+        border: 1px solid #d7e5fd;
+        border-radius: 8px;
+        .clearfix:before,
+        .clearfix:after {
+          content: "";
+          display: table;
+          clear: both;
+        }
+        .fenge {
+          width: 841px;
+          border-top: 1px solid #d7e5fd;
+        }
+        .tongyi {
+          display: flex;
+        }
+        .content1 {
+          margin-top: 14px;
+          margin-left: 77px;
+        }
+        .content2 {
+          position: absolute;
+          margin-top: 14px;
+          left: 328px;
+        }
+        .content3 {
+          position: absolute;
+          margin-top: 14px;
+          left: 512px;
+        }
+        .content4 {
+          position: absolute;
+          margin-top: 14px;
+          left: 700px;
+        }
+        .contentbtn {
+          position: absolute;
+          margin-top: 14px;
+          left: 685px;
+          font-size: 15px;
+          // line-height: 14px;
+          font-family: Microsoft YaHei;
+          font-weight: 400;
+          color: #2478ff;
+          background-color: #fff;
+          border: 0;
+        }
+        .historycontent {
+          width: 59px;
+          height: 14px;
+          font-size: 14px;
+          font-family: Microsoft YaHei;
+          // font-weight: 400;
+          color: #333330;
+          line-height: 38px;
+        }
+        .historytitle {
+          width: 842px;
+          height: 50px;
+          background: #f2f5f7;
+          border-radius: 8px 8px 0px 0px;
+        }
+        .historytitle2 {
+          width: 842px;
+          height: 48px;
+          background: #fff;
+        }
+      }
+    }
   }
 }
 </style>