From b2c97b7c701fd3c5d2cd49da25bdc13b5f4f6010 Mon Sep 17 00:00:00 2001
From: lanzhihui <503792708@qq.com>
Date: Tue, 31 Mar 2026 17:01:05 +0800
Subject: [PATCH] =?UTF-8?q?=E9=80=82=E9=85=8D=E5=85=B6=E4=BB=96=E6=B5=8F?=
 =?UTF-8?q?=E8=A7=88=E5=99=A8=EF=BC=8C=E6=A0=B7=E5=BC=8F=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 index.html                                |    1 +
 src/components/pc/exam/examGuide.vue      | 1113 ++++++++++----------
 src/components/pc/exam/examHeader.vue     |  715 +++++++------
 src/components/pc/exam/examHome.vue       |  473 +++++----
 src/components/pc/exam/examHomeReport.vue |  554 +++++-----
 src/components/pc/exam/onlineTest.vue     | 1005 ++++++++++--------
 src/components/pc/exam/reportCard.vue     | 1141 ++++++++++-----------
 src/components/upload/imageUpload.vue     |    2 +-
 src/utils/request.js                      |    2 +-
 9 files changed, 2612 insertions(+), 2394 deletions(-)

diff --git a/index.html b/index.html
index b6ca5d2..06c7bc7 100644
--- a/index.html
+++ b/index.html
@@ -11,6 +11,7 @@
     <title><%= VITE_APP_TITLE %></title>
     <meta name="keywords" content="友福同享,智能健康服务,定制化健康管理方案,睡眠检测,ai健康,DMA人体驾照,人体驾照,健康监测,健康管理app,健康管理,智能手环,心率检测,血压检测,运动手环,健康检测,ai婚恋,婚恋配对,婚恋平台推荐,ai相亲,婚恋平台,相亲平台" />
     <meta name="description" content="友福同享（深圳）智能科技有限公司是一家以人工智能为核心的高科技公司，致力于提升人类生命质量，成为健康生活方式的引领者。拥有多项自主知识产與發明專利，公司持续推出其围绕AI核心服务的健康饮食及智能系列产品。" />
+    <meta name="renderer" content="webkit">
     <script type="text/javascript">window.HOST_TYPE='2'</script>
     <script
       type="text/javascript"
diff --git a/src/components/pc/exam/examGuide.vue b/src/components/pc/exam/examGuide.vue
index 2a1e2fe..b6b256f 100644
--- a/src/components/pc/exam/examGuide.vue
+++ b/src/components/pc/exam/examGuide.vue
@@ -34,7 +34,7 @@ const list = [
   {
     title:'二、考试环境',
     list: [
-      '考试有效时间：2025-05-26 14:00-15:30，超过90分钟系统将强制收卷，请在有效时间内参加', // 这部分时间也需要调整
+      '考试有效时间：2025-05-26 14:00-15:30，超过90分钟系统将强制收卷，请在有效时间内参加',
       '开考前5分钟才能进入考场系统，准点系统开放试卷',
       '开考15分钟之后，无法进入考试系统',
       '考试卷面满分为100分，及格分数线：60分',
@@ -64,20 +64,6 @@ const handleSubmit = () => {
   console.log('执行提交操作')
   showToast('提交成功')
   window.onbeforeunload = null
-  // 这里添加实际提交逻辑
-  // let radioKey = radioList.map(item => {
-  //   return item.value
-  // })
-  // let checkKey = checkList.map(item => {
-  //   return item.value
-  // })
-  // let data = {
-  //
-  // }
-  // request.post(``)
-  //   .then(res => {
-  //
-  //   })
 }
 const toastMessage = ref('')
 const toastVisible = ref(false)
@@ -107,11 +93,9 @@ const getCode = () => {
       type: 'warning',
       duration: 3 * 1000
     })
-    // showToast('请输入有效的手机号','warning')
     return
   }
 
-  // 这里添加实际获取验证码逻辑
   console.log('发送验证码到:', mobile.value)
   let data = {
     mobile: mobile.value,
@@ -119,7 +103,6 @@ const getCode = () => {
   }
   request.post(`go/api/h5/v2/user/smscode`,data)
     .then(res => {
-      // 开始倒计时
       countdown.value = 60
       showCountdown.value = true
       timer.value = setInterval(() => {
@@ -142,7 +125,6 @@ const handleLogin = () => {
       type: 'warning',
       duration: 3 * 1000
     })
-    // showToast('请填写完整信息','warning')
     return
   }
   let data = {
@@ -153,22 +135,17 @@ const handleLogin = () => {
   isEnterStart.value = true
   request.post(`go/api/app/v2/account/code/login`,data)
     .then(res => {
-      // 登录成功处理
-
       localStorage.setItem('answerToken',res.data.api_token)
       ElMessage({
         message:  '登录成功',
         type: 'success',
         duration: 1200
       })
-      // showToast('登录成功')
       getIsJoin()
       getUserDetail()
       setTimeout(() => {
         dialogTableVisible.value = false
         isEnterStart.value = false
-
-        // router.push({ name: 'onlineTest',query:{id:id.value} })
       },1200)
     }).finally(() => {
     isEnterStart.value =  false
@@ -178,7 +155,7 @@ const isComposing = ref(false)
 const answer_user_mobile = ref('')
 const answer_user_name = ref('')
 const showLogout = ref(false)
-const showLogoutModal = ref(false) // 退出登录弹窗
+const showLogoutModal = ref(false)
 const isLogoutLoading = ref(false)
 const successLogout = () => {
   isLogoutLoading.value = true
@@ -198,10 +175,7 @@ const successLogout = () => {
 const startTest = () => {
   console.log(endTime.value < new Date(),'333')
   if (endTime.value < new Date()){
-    //   console.log('111')
     showTimeEnd.value = true
-    //   return
-    // }
   }else if (localStorage.getItem('answerToken')){
     isStart.value = true
     setTimeout(() => {
@@ -210,7 +184,6 @@ const startTest = () => {
     },800)
   }else {
     dialogTableVisible.value = true
-
   }
 }
 
@@ -222,12 +195,7 @@ const getUserDetail = () => {
       localStorage.setItem('answer_user_mobile', res.data.mobile)
       localStorage.setItem('answer_user_id', res.data.user_id)
       localStorage.setItem('answer_user_name', res.data.name)
-      // dialogTableVisible.value = true
-      console.log(answer_user_name.value,'23423')
-      console.log(answer_user_mobile.value,'23423')
-    }).finally(() => {
-
-  })
+    })
 }
 const checkTest = () => {
   if (localStorage.getItem('answerToken')){
@@ -246,14 +214,12 @@ const getIsJoin = () => {
       }else {
         isJoin.value = false
       }
-      console.log(res,'r===')
     })
 }
 // 切换登录方式
 const rightClick = () => {
   if (isAccountLogin.value){
     isResetCode.value = false
-    // 清除现有轮询
     if (pollingTimer.value) {
       clearInterval(pollingTimer.value)
       pollingTimer.value = null
@@ -261,7 +227,6 @@ const rightClick = () => {
     getQRCode()
   }else {
     isAccountLogin.value = !isAccountLogin.value
-    // 切换时清除轮询
     if (pollingTimer.value) {
       clearInterval(pollingTimer.value)
       pollingTimer.value = null
@@ -278,17 +243,15 @@ const getQRCode = (reset) => {
       let result = res.data
       qrcodeDetail.value.text = result.data
       qrcodeDetail.value.id = result.id
-      // 添加5分钟（300000毫秒）后自动刷新
       qrcodeDetail.value.timeoutTimer = setTimeout(() => {
         handleQRCodeTimeout()
-      }, 3 * 60000) // 60000毫秒 = 1分钟
-      console.log(result,'ggg')
+      }, 3 * 60000)
       if (reset != 'reset'){
         isAccountLogin.value = !isAccountLogin.value
       }
       pollingTimer.value = setInterval(() => {
         getQRCodeStatus()
-      }, 5000) // 每5秒轮询一次
+      }, 5000)
     })
 }
 const getQRCodeStatus = () => {
@@ -310,36 +273,22 @@ const getQRCodeStatus = () => {
       })
       getIsJoin()
       getUserDetail()
-      // startTest()
     }
   })
 }
 const handleQRCodeTimeout = () => {
-  clearTimeout(qrcodeDetail.value.timeoutTimer) // 清除定时器
+  clearTimeout(qrcodeDetail.value.timeoutTimer)
   clearInterval(pollingTimer.value)
   pollingTimer.value = null
   isScanSucess.value = false
   isResetCode.value = true
-  // ElMessage({
-  //   message:  '二维码已过期，请点击刷新',
-  //   type: 'warning',
-  //   duration: 1200
-  // })
-  // showToast('二维码已过期，请点击刷新', 'warning')
-  // getQRCode() // 直接调用获取新二维码
 }
 const toResetCode = () => {
   isResetCode.value = false
-  getQRCode('reset') // 直接调用获取新二维码
+  getQRCode('reset')
 }
 onMounted(() => {
-
   id.value = router.currentRoute.value.query.id || '1'
-  // if (endTime.value < new Date()){
-  //   console.log('111')
-  //   showTimeEnd.value = true
-  //   return
-  // }
   if (!localStorage.getItem('answerToken')){
     dialogTableVisible.value = true
   }else {
@@ -358,9 +307,6 @@ onBeforeUnmount(() => {
 <template>
   <div class="ui-examGuide" @click='showTimeEnd = false'>
     <img src="https://images.health.ufutx.com/202504/18/d864245ef906c01b8553a70d029669c4.png" alt="">
-    <!--  <div class='ui-joinUs-bg'>-->
-    <!--&lt;!&ndash;    <img src='https://image.fulllinkai.com/202309/05/eef666a9377322e9a9356a931d5cfc01.png' alt=''>&ndash;&gt;-->
-    <!--  </div>-->
     <div class="ui-examGuide-box">
       <div class=" " style='position: relative'>
         <div class="testTitle text-center  bold">{{textTitle}}</div>
@@ -373,7 +319,6 @@ onBeforeUnmount(() => {
             <div class="ui-list-suttitle ui-mb-6 font18">{{indexV2 + 1 + '、' +itemV2}}</div>
           </div>
         </div>
-<!--        <div class="ui-list-suttitle">本次考试试题属于机密内容，不得对外泄露。如发现有通过摄屏、拍照并在互联网传播等渠道泄露试题的行为，将取消考生本次考试成绩并依法追究相关法律责任</div>-->
         <div class='ui-btns'>
           <div  class="ui-btn font20 bold text-center" @click.stop="startTest" :class="{disabled: isStart || endTime < new Date(),'ui-search-btn':  endTime < new Date()}">
             <div class="loading-spinner" v-if="isStart"></div>
@@ -399,7 +344,6 @@ onBeforeUnmount(() => {
         <div v-if='isAccountLogin'>
           <div class="dialog-title">请登录</div>
           <div class="dialog-content">
-            <!-- 新增文字标签 -->
             <div class="input-label">手机号</div>
             <div class="login-input">
               <input v-model="mobile" type="tel" placeholder="请输入手机号" maxlength="11">
@@ -433,7 +377,6 @@ onBeforeUnmount(() => {
                 {{ showCountdown ? `${countdown}s` : '获取验证码' }}
               </button>
             </div>
-            <!--        <div class="error-tip" v-if="errorVisible">{{ errorMessage }}</div>-->
           </div>
           <div class="dialog-btns">
             <div class="dialog-btn confirm text-center" @click="handleLogin" :class="{disabled: isEnterStart}">
@@ -481,13 +424,6 @@ onBeforeUnmount(() => {
         <div class="dialog-success-content">
           考试时间已结束
         </div>
-<!--        <div class="dialog-success-btns">-->
-<!--          &lt;!&ndash;          <div class="dialog-btn cancel" @click="dialogTableVisible = false">继续答题</div>&ndash;&gt;-->
-<!--          <div class="dialog-success-btn confirm" @click="successSubmit" :class="{disabled: isSuccessSubmitting}">-->
-<!--            <div class="loading-spinner" v-if="isSuccessSubmitting"></div>-->
-<!--            {{ isSuccessSubmitting ? '正在退出...' : '好的' }}-->
-<!--          </div>-->
-<!--        </div>-->
       </div>
     </div>
     <div class="dialog-mask" v-if="showLogoutModal">
@@ -510,6 +446,12 @@ onBeforeUnmount(() => {
 </template>
 
 <style scoped>
+/* 全局兼容样式 */
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
 .ui-examGuide{
   position: relative;
   padding: 0;
@@ -518,475 +460,566 @@ onBeforeUnmount(() => {
   max-height: 100vh;
   font-weight: 400;
   line-height: normal;
-  /* 新增容器最小高度 */
-//min-height: 100vh;
-//width: 100vw;
-//height: 100vh;
-  img{
-    width: 100vw;
-    height: auto;
-    max-height: 100vh;
-    object-fit: cover;
-    /* 设置宽高比保持图片比例 */
-    aspect-ratio: 16/9;
-  }
-  .ui-joinUs-bg{
-    width: 100%;
-    height: 120px;
-    margin-bottom: 96px;
-    object-fit: contain;
-    background: #d4d4d4;
-  }
-  .ui-examGuide-box{
-    position: absolute;
-    top: 50%;
-    right: 160px;
-    transform: translateY(-50%);
-    width: 840px;
-    height: auto;
-    padding: 38px 40px;
-    border-radius: 36px;
-    background: #FFF;
-    box-shadow: -4px 15px 100px 0px rgba(2, 115, 181, 0.25);
-    .testTitle{
-      color:#0E0E0E;
-      font-size: 18px;
-    }
-    .testTime{
-      margin: 6px 0 20px;
-      color: #0E0E0E;
-    }
-    .testTitle{
-      font-size: 18px;
-      color: #0E0E0E;
-      font-weight: 600;
-    }
-    .testSubtitle{
-      color: #0E0E0E;
-      font-size: 16px;
-    }
-
-  }
-
-  .ui-user-box{
-    position: absolute;
-    top:38px;
-    right:38px;
-    height: 80px;
-    .ui-user-content{
-      display:flex;
-      align-items: center;
-      position: relative;
-      cursor: pointer;
-    }
-    .ui-user-box-icon{
-      width: 24px;
-      height: 24px;
-      margin-right: 6px;
-      border-radius:50%;
-      object-fit: cover;
-    }
-    .ui-user-box-title{
-      color: #0E0E0E;
-      font-size: 14px;
-      font-style: normal;
-      font-weight: 600;
-      line-height: normal;
-    }
-    .ui-user-logout{
-      position: absolute;
-      top: 30px;
-      left: -30px;
-      display: inline-flex;
-      white-space: nowrap;
-      padding: 10px 16px;
-      flex-direction: column;
-      justify-content: center;
-      align-items: center;
-      color: #0E0E0E;
-      font-size: 14px;
-      font-style: normal;
-      font-weight: 400;
-      line-height: normal;
-      border-radius: 6px;
-      background:  #FFF;
-      box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.10);
-      cursor: pointer;
-    }
-
-  }
-
-  .ui-mb-6{
-    margin-bottom: 6px;
-  }
-  .ui-list-title{
-    font-size: 16px;
-    color: #0E0E0E;
-    line-height: 1.5;
-  }
-  .ui-list-suttitle{
-    font-size: 16px;
-    color: #0E0E0E;
-  //line-height: 27px;
-    line-height: 1.5;
-  }
-  .ui-btns{
-    margin: 30px auto 10px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-  }
-  .ui-btn{
-    margin-right: 30px;
-    width: 172px;
-    height: 57px;
-    border-radius: 10px;
-    background:  #409EFF;
-    line-height: 57px;
-    color: #fff;
-    cursor: pointer;
-  }
-  .ui-search-btn{
-    width: 172px;
-    height: 57px;
-    border-radius: 10px;
-    background: #ffffff;
-    border: 0.5px solid #409EFF;
-    line-height: 57px;
-    color: #409EFF;
-    cursor: pointer;
-  }
-  .ui-btn-v2{
-    margin-right: 30px;
-    width: 172px;
-    height: 57px;
-    border-radius: 10px;
-    background:  #409EFF;
-    line-height: 57px;
-    color: #fff;
-    cursor: pointer;
-  }
-  .dialog-success-box{
-    display: flex;
-    width: 480px;
-    padding: 50px;
-    flex-direction: column;
-    align-items: center;
-    border-radius: 20px;
-    background: #FFF;
-    .dialog-success-img{
-      width: 130px;
-      height: 116px;
-    }
-    .dialog-success-title{
-      margin: 50px auto 30px;
-      color: #0E0E0E;
-      font-size: 22px;
-      font-weight: 600;
-    }
-    .dialog-success-content{
-      margin-bottom: 50px;
-      color:#0E0E0E;
-      font-size: 18px;
-    }
-    .dialog-success-btns{
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      width: 100%;
-    }
-    .dialog-success-btn{
-      padding: 16px 0;
-      border-radius: 10px;
-      cursor: pointer;
-      width: 172px;
-    }
-  }
-  .dialog-mask {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background: rgba(0, 0, 0, 0.5);
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    z-index: 999;
-  }
-
-  .dialog-box {
-    position: relative;
-    width: 475px;
-    background: #fff;
-    border-radius: 20px;
-    padding: 50px;
-  }
-
-  .dialog-title {
-    font-size: 22px;
-    font-weight: bold;
-    margin-bottom: 30px;
-    text-align: center;
-  }
-
-  .dialog-content {
-    margin-bottom: 50px;
-    font-size: 18px;
-    color:#0E0E0E;
-    font-weight: 400;
-  }
-
-  .dialog-btns {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-
-  }
-
-  .dialog-btn {
-    padding: 16px 0;
-    border-radius: 10px;
-    cursor: pointer;
-    width: 172px;
-  }
-  .dialog-btn, .ui-btn,.ui-search-btn,.dialog-success-btn{
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    &.disabled {
-      opacity: 0.7;
-      pointer-events: none;
-    }
-  }
-  .loading-spinner {
-    width: 16px;
-    height: 16px;
-    margin-right: 8px;
-    border: 2px solid #fff;
-    border-top-color: transparent;
-    border-radius: 50%;
-    animation: spin 0.8s linear infinite;
-  }
-
-  .loading-spinner-v2{
-    width: 16px;
-    height: 16px;
-    margin-right: 8px;
-    border: 2px solid #409EFF;
-    border-top-color: transparent;
-    border-radius: 50%;
-    animation: spin 0.8s linear infinite;
-  }
-  @keyframes spin {
-    to {
-      transform: rotate(360deg);
-    }
-  }
-  .cancel {
-    border: 1px solid #409EFF;
-    color: #409EFF;
-    background: #fff;
-    font-size: 18px;
-  }
-
-  .confirm {
-    background: #409eff;
-    color: #fff;
-    border: 1px solid #409eff;
-    font-size: 18px;
-  }
-  .toast-mask {
-    position: fixed;
-    top: 100px;
-    left: 50%;
-    transform: translateX(-50%);
-    z-index: 1000;
-
-    .toast-box {
-      padding: 12px 24px;
-      background: rgba(231, 245, 224, 0.7);
-      color: #6bc340;
-      border-radius: 4px;
-      font-size: 14px;
-      border: 1px solid #6bc340;
-      animation: fadeInOut 2s;
-    }
-    .toast-warning-box{
-      background: #fdf6ec;
-      color:#e7a746;
-      border: 1px solid #e7a746;
-    }
-  }
-
-  @keyframes fadeInOut {
-    0%,100% { opacity: 0; }
-    20%,80% { opacity: 1; }
-  }
-  .input-label {
-    font-size: 14px;
-    color: #0e0e0e;
-    margin-bottom: 8px;
-  }
-  .login-input {
-    margin: 0 0 15px;
-    input {
-      width: 100%;
-      height: 56px;
-      padding: 0 15px;
-      border: 1px solid #B2B3B5; /* 默认黑色边框 */
-      border-radius: 10px;
-      font-size: 14px;
-      /* 去除输入框默认样式 */
-      -webkit-appearance: none;
-      outline: none;
-      /* 隐藏数字输入框箭头 */
-      &[type="number"] {
-        -moz-appearance: textfield;
-        &::-webkit-outer-spin-button,
-        &::-webkit-inner-spin-button {
-          -webkit-appearance: none;
-          margin: 0;
-        }
-      }
-      &:focus {
-        border-color: #79BBFF; /* 输入时边框颜色 */
-      }
-    }
-
-    &.code-input {
-      position: relative;
-
-      .get-code-btn {
-        position: absolute;
-        right: 10px;
-        top: 50%;
-        transform: translateY(-50%);
-        background: none;
-        border: none;
-        color: #79BBFF; /* 按钮文字颜色 */
-        padding: 0;
-
-      }
-    }
-  }
-
-  .dialog-content {
-    margin-bottom: 30px;
-    font-size: 14px;
-  }
-  .ui-qrcode-card{
-
-    .ui-qrcode-title{
-      color: #0E0E0E;
-      font-size: 22px;
-      font-weight: 600;
-    }
-    .ui-qrcode-subtitle{
-      margin: 10px 0 10px;
-      color: #66676C;
-      text-align: center;
-      font-size: 14px;
-      font-style: normal;
-      font-weight: 400;
-      line-height: normal;
-    }
-    .ui-qrcode-box{
-      position: relative;
-      margin: 0 auto;
-      width: 280px;
-      height: 280px;
-      .ui-qrcode-mask{
-        position: absolute;
-        top: 0;
-        left: 0;
-        width: 100%;
-        height: 100%;
-        background: rgba(0,0,0,0.5);
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        justify-content: center;
-        z-index: 1001;
-        cursor: pointer;
-        .ui-qrcode-mask-icon{
-          width: 40px;
-          height: 38px;
-        }
-        .ui-qrcode-mask-title{
-          margin-top: 10px;
-          color: #FFF;
-          text-align: center;
-          font-size: 16px;
-          font-style: normal;
-          font-weight: 400;
-          line-height: normal;
-        }
-      }
-    }
-  }
-  .dialog-right-top{
-    position: absolute;
-    top: 0;
-    right: 0;
-  }
-  .dialog-right-top-box{
-    position: relative;
-    width: 70px;
-    height: 70px;
-    border-radius: 0 20px 0 0;
-    cursor: pointer;
-    img{
-      width: 100%;
-      height: 100%;
-      border-radius: 0 20px 0 0;
-    }
-    .ui-dialog-right-tip{
-      position: absolute;
-      top: 20px;
-      left: -72px;
-      display: flex;
-      padding: 10px;
-      justify-content: center;
-      align-items: center;
-      font-size: 16px;
-      color: #fff;
-      border-radius: 10px;
-      background:  #409EFF;
-      z-index: 1000;
-      &::after {
-        content: '';
-        position: absolute;
-        right: -14px;
-        top: 50%;
-        transform: translateY(-50%);
-        border-width: 8px;
-        border-style: solid;
-        border-color: transparent transparent transparent #409EFF;
-      }
-    }
-  }
-  .dialog-scan-success{
-    margin: 34px 0 0;
-
-    .dialog-scan-success-title{
-      margin-bottom: 10px;
-      color: #0E0E0E;
-      text-align: center;
-      font-size: 22px;
-      font-style: normal;
-      font-weight: 600;
-      line-height: normal;
-    }
-    .dialog-scan-success-subtitle{
-      color: #66676C;
-      text-align: center;
-      font-size: 14px;
-      font-style: normal;
-      font-weight: 400;
-      line-height: normal;
-    }
-  }
+}
+.ui-examGuide img{
+  width: 100vw;
+  height: auto;
+  max-height: 100vh;
+  object-fit: cover;
+  aspect-ratio: 16/9;
+  display: block;
 }
 
+/* 核心兼容：全部改用 -webkit-box 系列布局 */
+.ui-examGuide-box{
+  position: absolute;
+  top: 50%;
+  right: 160px;
+  -webkit-transform: translateY(-50%);
+  transform: translateY(-50%);
+  width: 840px;
+  height: auto;
+  padding: 38px 40px;
+  border-radius: 36px;
+  background: #FFF;
+  box-shadow: -4px 15px 100px 0px rgba(2, 115, 181, 0.25);
+}
+.ui-examGuide-box .testTitle{
+  color:#0E0E0E;
+  font-size: 18px;
+  text-align: center;
+  font-weight: 600;
+}
+.ui-examGuide-box .testTime{
+  margin: 6px 0 20px;
+  color: #0E0E0E;
+  text-align: center;
+  font-size: 14px;
+}
+.ui-examGuide-box .testSubtitle{
+  color: #0E0E0E;
+  font-size: 16px;
+}
+
+/* 用户信息兼容布局 */
+.ui-user-box{
+  position: absolute;
+  top: 38px;
+  right:38px;
+  height: 80px;
+}
+.ui-user-content{
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  cursor: pointer;
+}
+.ui-user-content .ui-user-box-icon{
+  width: 24px;
+  height: 24px;
+  margin-right: 6px;
+  border-radius:50%;
+  object-fit: cover;
+  display: block;
+}
+.ui-user-box-title{
+  color: #0E0E0E;
+  font-size: 14px;
+  font-weight: 600;
+}
+.ui-user-logout{
+  position: absolute;
+  top: 30px;
+  left: -30px;
+  white-space: nowrap;
+  padding: 10px 16px;
+  color: #0E0E0E;
+  font-size: 14px;
+  border-radius: 6px;
+  background:  #FFF;
+  box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.10);
+  cursor: pointer;
+}
+
+.ui-mb-6{
+  margin-bottom: 6px;
+}
+.ui-list-title{
+  font-size: 16px;
+  color: #0E0E0E;
+  line-height: 1.5;
+}
+.ui-list-suttitle{
+  font-size: 16px;
+  color: #0E0E0E;
+  line-height: 1.5;
+}
+
+/* 按钮布局兼容 */
+.ui-btns{
+  margin: 30px auto 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+}
+.ui-btn{
+  margin-right: 30px;
+  width: 172px;
+  height: 57px;
+  border-radius: 10px;
+  background:  #409EFF;
+  line-height: 57px;
+  color: #fff;
+  cursor: pointer;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+}
+.ui-search-btn{
+  width: 172px;
+  height: 57px;
+  border-radius: 10px;
+  background: #ffffff;
+  border: 0.5px solid #409EFF;
+  line-height: 57px;
+  color: #409EFF;
+  cursor: pointer;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+}
+.ui-btn-v2{
+  margin-right: 30px;
+  width: 172px;
+  height: 57px;
+  border-radius: 10px;
+  background:  #409EFF;
+  line-height: 57px;
+  color: #fff;
+  cursor: pointer;
+}
+
+/* 弹窗遮罩兼容 */
+.dialog-mask {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.5);
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  z-index: 999;
+}
+.dialog-box {
+  position: relative;
+  width: 475px;
+  background: #fff;
+  border-radius: 20px;
+  padding: 50px;
+}
+.dialog-title {
+  font-size: 22px;
+  font-weight: bold;
+  margin-bottom: 30px;
+  text-align: center;
+}
+.dialog-content {
+  margin-bottom: 30px;
+  font-size: 14px;
+  color:#0E0E0E;
+}
+
+/* 按钮组兼容 */
+.dialog-btns {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+}
+.dialog-btn {
+  padding: 16px 0;
+  border-radius: 10px;
+  cursor: pointer;
+  width: 172px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+}
+.dialog-btn.disabled,
+.ui-btn.disabled,
+.ui-search-btn.disabled{
+  opacity: 0.7;
+  pointer-events: none;
+}
+
+/* 加载动画 */
+.loading-spinner {
+  width: 16px;
+  height: 16px;
+  margin-right: 8px;
+  border: 2px solid #fff;
+  border-top-color: transparent;
+  border-radius: 50%;
+  -webkit-animation: spin 0.8s linear infinite;
+  animation: spin 0.8s linear infinite;
+}
+.loading-spinner-v2{
+  width: 16px;
+  height: 16px;
+  margin-right: 8px;
+  border: 2px solid #409EFF;
+  border-top-color: transparent;
+  border-radius: 50%;
+  -webkit-animation: spin 0.8s linear infinite;
+  animation: spin 0.8s linear infinite;
+}
+@-webkit-keyframes spin {
+  to { -webkit-transform: rotate(360deg); }
+}
+@keyframes spin {
+  to { transform: rotate(360deg); }
+}
+
+/* 按钮样式 */
+.cancel {
+  border: 1px solid #409EFF;
+  color: #409EFF;
+  background: #fff;
+  font-size: 18px;
+}
+.confirm {
+  background: #409eff;
+  color: #fff;
+  border: 1px solid #409eff;
+  font-size: 18px;
+}
+
+/* Toast提示 */
+.toast-mask {
+  position: fixed;
+  top: 100px;
+  left: 50%;
+  -webkit-transform: translateX(-50%);
+  transform: translateX(-50%);
+  z-index: 1000;
+}
+.toast-box {
+  padding: 12px 24px;
+  background: rgba(231, 245, 224, 0.7);
+  color: #6bc340;
+  border-radius: 4px;
+  font-size: 14px;
+  border: 1px solid #6bc340;
+  -webkit-animation: fadeInOut 2s;
+  animation: fadeInOut 2s;
+}
+.toast-warning-box{
+  background: #fdf6ec;
+  color:#e7a746;
+  border: 1px solid #e7a746;
+}
+@-webkit-keyframes fadeInOut {
+  0%,100% { opacity: 0; }
+  20%,80% { opacity: 1; }
+}
+@keyframes fadeInOut {
+  0%,100% { opacity: 0; }
+  20%,80% { opacity: 1; }
+}
+
+/* 输入框样式 */
+.input-label {
+  font-size: 14px;
+  color: #0e0e0e;
+  margin-bottom: 8px;
+}
+.login-input {
+  margin: 0 0 15px;
+}
+.login-input input {
+  width: 100%;
+  height: 56px;
+  padding: 0 15px;
+  border: 1px solid #B2B3B5;
+  border-radius: 10px;
+  font-size: 14px;
+  outline: none;
+  -webkit-appearance: none;
+}
+.login-input input:focus {
+  border-color: #79BBFF;
+}
+.login-input input[type="number"] {
+  -moz-appearance: textfield;
+}
+.login-input input[type="number"]::-webkit-outer-spin-button,
+.login-input input[type="number"]::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+.code-input {
+  position: relative;
+}
+.get-code-btn {
+  position: absolute;
+  right: 10px;
+  top: 50%;
+  -webkit-transform: translateY(-50%);
+  transform: translateY(-50%);
+  background: none;
+  border: none;
+  color: #79BBFF;
+  padding: 0;
+}
+
+/* 二维码登录 */
+.ui-qrcode-card .ui-qrcode-title{
+  color: #0E0E0E;
+  font-size: 22px;
+  font-weight: 600;
+  text-align: center;
+}
+.ui-qrcode-card .ui-qrcode-subtitle{
+  margin: 10px 0 10px;
+  color: #66676C;
+  text-align: center;
+  font-size: 14px;
+}
+.ui-qrcode-box{
+  position: relative;
+  margin: 0 auto;
+  width: 280px;
+  height: 280px;
+}
+.ui-qrcode-mask{
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0,0,0,0.5);
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  z-index: 1001;
+  cursor: pointer;
+}
+.ui-qrcode-mask-icon{
+  width: 40px;
+  height: 38px;
+}
+.ui-qrcode-mask-title{
+  margin-top: 10px;
+  color: #FFF;
+  text-align: center;
+  font-size: 16px;
+}
+
+/* 右上角切换 */
+.dialog-right-top{
+  position: absolute;
+  top: 0;
+  right: 0;
+}
+.dialog-right-top-box{
+  position: relative;
+  width: 70px;
+  height: 70px;
+  border-radius: 0 20px 0 0;
+  cursor: pointer;
+}
+.dialog-right-top-box img{
+  width: 100%;
+  height: 100%;
+  border-radius: 0 20px 0 0;
+  display: block;
+}
+.ui-dialog-right-tip{
+  position: absolute;
+  top: 20px;
+  left: -72px;
+  padding: 10px;
+  font-size: 16px;
+  color: #fff;
+  border-radius: 10px;
+  background:  #409EFF;
+  z-index: 1000;
+}
+.ui-dialog-right-tip::after {
+  content: '';
+  position: absolute;
+  right: -14px;
+  top: 50%;
+  -webkit-transform: translateY(-50%);
+  transform: translateY(-50%);
+  border-width: 8px;
+  border-style: solid;
+  border-color: transparent transparent transparent #409EFF;
+}
+
+/* 扫码成功 */
+.dialog-scan-success{
+  margin: 34px 0 0;
+  text-align: center;
+}
+.dialog-scan-success-title{
+  margin-bottom: 10px;
+  color: #0E0E0E;
+  font-size: 22px;
+  font-weight: 600;
+}
+.dialog-scan-success-subtitle{
+  color: #66676C;
+  font-size: 14px;
+}
+
+/* 成功弹窗 */
+.dialog-success-box{
+  width: 480px;
+  padding: 50px;
+  border-radius: 20px;
+  background: #FFF;
+  text-align: center;
+}
+.dialog-success-box .dialog-success-img{
+  width: 130px;
+  height: 116px;
+  display: block;
+  margin: 0 auto;
+}
+.dialog-success-title{
+  margin: 50px auto 30px;
+  color: #0E0E0E;
+  font-size: 22px;
+  font-weight: 600;
+}
+.dialog-success-content{
+  margin-bottom: 50px;
+  color:#0E0E0E;
+  font-size: 18px;
+}
+.dialog-success-btns{
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  width: 100%;
+  gap: 20px;
+}
+.dialog-success-btn{
+  padding: 16px 0;
+  border-radius: 10px;
+  cursor: pointer;
+  width: 172px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+}
+.text-center{
+  text-align: center;
+}
+.bold{
+  font-weight: bold;
+}
+.font14{
+  font-size: 14px;
+}
+.font18{
+  font-size: 18px;
+}
+.font20{
+  font-size: 20px;
+}
 </style>
diff --git a/src/components/pc/exam/examHeader.vue b/src/components/pc/exam/examHeader.vue
index 95b07a9..0bb661b 100644
--- a/src/components/pc/exam/examHeader.vue
+++ b/src/components/pc/exam/examHeader.vue
@@ -44,20 +44,19 @@
             <path d="M9.24647 16.3758C13.4372 16.3758 16.8345 12.9785 16.8345 8.78773C16.8345 4.59698 13.4372 1.19971 9.24647 1.19971C5.05572 1.19971 1.65845 4.59698 1.65845 8.78773C1.65845 12.9785 5.05572 16.3758 9.24647 16.3758Z" stroke="#66676C" stroke-width="1.625" stroke-linecap="round" stroke-linejoin="round"/>
             <path d="M14.6084 14.1499L17.7895 17.331" stroke="#66676C" stroke-width="1.625" stroke-linecap="round" stroke-linejoin="round"/>
           </svg>
-<!--          <img src="https://images.health.ufutx.com/202505/14/07ba29b4372524f89bd3b060ad8b129f.png" class="" />-->
           <input  v-model="searchValue"
                   @keyup.enter="handleSearch" placeholder="搜索" />
         </div>
         <div v-if='!loginStatus' class='exam-header-right-login-btn' @click='toLogin'>登录</div>
-        <div v-else class=''>
-        <div class='ui-user-box'  @mouseover='showLogout = true' @mouseleave='showLogout = false'>
-          <div class='ui-user-content' >
-            <img class='ui-user-box-icon' src='https://images.health.ufutx.com/202504/28/d2b5ca33bd970f64a6301fa75ae2eb22.png' alt='' />
-            <div class='ui-user-box-title'>{{answer_user_name || answer_user_mobile}}</div>
-            <div class='ui-user-logout' v-if='showLogout' @click='showLogoutModal = true'>退出登录</div>
+        <div v-else class='exam-user-wrapper'>
+          <div class='ui-user-box'  @mouseover='showLogout = true' @mouseleave='showLogout = false'>
+            <div class='ui-user-content' >
+              <img class='ui-user-box-icon' src='https://images.health.ufutx.com/202504/28/d2b5ca33bd970f64a6301fa75ae2eb22.png' alt='' />
+              <div class='ui-user-box-title'>{{answer_user_name || answer_user_mobile}}</div>
+              <div class='ui-user-logout' v-if='showLogout' @click='showLogoutModal = true'>退出登录</div>
+            </div>
           </div>
         </div>
-        </div>
       </div>
     </div>
     <div class="dialog-mask" v-if="dialogTableVisible" >
@@ -65,7 +64,6 @@
         <div v-if='isAccountLogin'>
           <div class="dialog-title">请登录</div>
           <div class="dialog-content">
-            <!-- 新增文字标签 -->
             <div class="input-label">手机号</div>
             <div class="login-input">
               <input v-model="mobile" type="tel" placeholder="请输入手机号" maxlength="11">
@@ -99,7 +97,6 @@
                 {{ showCountdown ? `${countdown}s` : '获取验证码' }}
               </button>
             </div>
-            <!--        <div class="error-tip" v-if="errorVisible">{{ errorMessage }}</div>-->
           </div>
           <div class="dialog-btns">
             <div class="dialog-btn confirm text-center" @click="handleLogin" :class="{disabled: isEnterStart}">
@@ -137,12 +134,10 @@
           <path fill-rule="evenodd" clip-rule="evenodd" d="M10.0006 9.95806C10.2271 9.74375 10.5827 9.74741 10.8048 9.96633L24.1111 23.0836C24.3235 23.2929 24.3259 23.6348 24.1166 23.8471C24.1122 23.8515 24.1077 23.8559 24.1032 23.8603C23.8766 24.0746 23.521 24.0709 23.299 23.852L9.99262 10.7347C9.7803 10.5254 9.77785 10.1836 9.98716 9.97123C9.99157 9.96676 9.99605 9.96237 10.0006 9.95806Z" fill="white" stroke="white" stroke-width="0.85"/>
           <path fill-rule="evenodd" clip-rule="evenodd" d="M24.0015 9.95806C23.7749 9.74375 23.4194 9.74741 23.1973 9.96633L9.89093 23.0836C9.67861 23.2929 9.67616 23.6348 9.88547 23.8471C9.88987 23.8515 9.89436 23.8559 9.89892 23.8603C10.1254 24.0746 10.481 24.0709 10.7031 23.852L24.0095 10.7347C24.2218 10.5254 24.2242 10.1836 24.0149 9.97123C24.0105 9.96676 24.006 9.96237 24.0015 9.95806Z" fill="white" stroke="white" stroke-width="0.85"/>
         </svg>
-
       </div>
     </div>
     <div class="dialog-mask" v-if="showLogoutModal">
       <div class="dialog-success-box text-center">
-<!--        <img src="https://images.health.ufutx.com/202504/17/2ee13769aa745d646d4951179ade3419.png" alt="" class="dialog-success-img" />-->
         <div class="dialog-success-title">温馨提示</div>
         <div class="dialog-success-content">
           是否退出登录
@@ -165,7 +160,7 @@
         </div>
         <div class="dialog-success-btns">
           <div class="dialog-success-btn confirm" @click="showReport = false" >
-           确定
+            确定
           </div>
         </div>
       </div>
@@ -201,7 +196,7 @@ const searchValue = ref('')
 watch(() => props.searchKeyword,(newVal) => {
   searchValue.value = newVal
 })
-const showReport = ref(false) // 是否参加考试
+const showReport = ref(false)
 const qrcodeDetail = ref({
   text:'',
   status:''
@@ -239,17 +234,17 @@ const toDetail = (path,index) => {
   }
 
 }
-const isResetCode = ref(false) // 刷新二维码
+const isResetCode = ref(false)
 
-const isJoin = ref(false) // 是否参与了考试
+const isJoin = ref(false)
 const isEnterStart = ref(false)
 
 
 const dialogTableVisible = ref(false)
-const isAccountLogin = ref(true) // 验证码登录
-const showAccountTip = ref(false) // 图标提示
-const isScanSucess = ref(false) // 图标提示
-const pollingTimer = ref(null) // 新增轮询定时器
+const isAccountLogin = ref(true)
+const showAccountTip = ref(false)
+const isScanSucess = ref(false)
+const pollingTimer = ref(null)
 const mobile = ref('')
 const code = ref('')
 const countdown = ref(0)
@@ -259,7 +254,6 @@ const showCountdown = ref(false)
 const toLogin = () => {
   dialogTableVisible.value = true
 }
-// 获取验证码方法
 const getCode = () => {
   if (!/^1[3-9]\d{9}$/.test(mobile.value)) {
     ElMessage({
@@ -267,19 +261,15 @@ const getCode = () => {
       type: 'warning',
       duration: 3 * 1000
     })
-    // showToast('请输入有效的手机号','warning')
     return
   }
 
-  // 这里添加实际获取验证码逻辑
-  console.log('发送验证码到:', mobile.value)
   let data = {
     mobile: mobile.value,
     area_code:86
   }
   request.post(`go/api/h5/v2/user/smscode`,data)
     .then(res => {
-      // 开始倒计时
       countdown.value = 60
       showCountdown.value = true
       timer.value = setInterval(() => {
@@ -294,7 +284,6 @@ const getCode = () => {
 
 }
 
-// 登录验证方法
 const handleLogin = () => {
   if (!mobile.value || !code.value) {
     ElMessage({
@@ -302,7 +291,6 @@ const handleLogin = () => {
       type: 'warning',
       duration: 3 * 1000
     })
-    // showToast('请填写完整信息','warning')
     return
   }
   let data = {
@@ -313,21 +301,16 @@ const handleLogin = () => {
   isEnterStart.value = true
   request.post(`go/api/app/v2/account/code/login`,data)
     .then(res => {
-      // 登录成功处理
       localStorage.setItem('answerToken',res.data.api_token)
       ElMessage({
         message:  '登录成功',
         type: 'success',
         duration: 1200
       })
-      // showToast('登录成功')
-      // getIsJoin()
       getUserDetail()
       setTimeout(() => {
         dialogTableVisible.value = false
         isEnterStart.value = false
-
-        // router.push({ name: 'onlineTest',query:{id:id.value} })
       },800)
     }).finally(() => {
     isEnterStart.value =  false
@@ -337,7 +320,7 @@ const isComposing = ref(false)
 const answer_user_mobile = ref('')
 const answer_user_name = ref('')
 const showLogout = ref(false)
-const showLogoutModal = ref(false) // 退出登录弹窗
+const showLogoutModal = ref(false)
 const isLogoutLoading = ref(false)
 const successLogout = () => {
   isLogoutLoading.value = true
@@ -371,7 +354,6 @@ const getIsJoin = () => {
       }else {
         showReport.value = true
       }
-      console.log(res,'r===')
     })
 }
 
@@ -383,18 +365,12 @@ const getUserDetail = () => {
       localStorage.setItem('answer_user_mobile', res.data.mobile)
       localStorage.setItem('answer_user_id', res.data.user_id)
       localStorage.setItem('answer_user_name', res.data.name)
-        loginStatus.value = true
-      console.log(answer_user_name.value,'23423')
-      console.log(answer_user_mobile.value,'23423')
-    }).finally(() => {
-
-  })
+      loginStatus.value = true
+    })
 }
-// 切换登录方式
 const rightClick = () => {
   if (isAccountLogin.value){
     isResetCode.value = false
-    // 清除现有轮询
     if (pollingTimer.value) {
       clearInterval(pollingTimer.value)
       pollingTimer.value = null
@@ -402,14 +378,12 @@ const rightClick = () => {
     getQRCode()
   }else {
     isAccountLogin.value = !isAccountLogin.value
-    // 切换时清除轮询
     if (pollingTimer.value) {
       clearInterval(pollingTimer.value)
       pollingTimer.value = null
     }
   }
 }
-// 获取二维码
 const getQRCode = (reset) => {
   if (qrcodeDetail.value.timeoutTimer) {
     clearTimeout(qrcodeDetail.value.timeoutTimer)
@@ -419,17 +393,15 @@ const getQRCode = (reset) => {
       let result = res.data
       qrcodeDetail.value.text = result.data
       qrcodeDetail.value.id = result.id
-      // 添加5分钟（300000毫秒）后自动刷新
       qrcodeDetail.value.timeoutTimer = setTimeout(() => {
         handleQRCodeTimeout()
-      }, 3 * 60000) // 60000毫秒 = 1分钟
-      console.log(result,'ggg')
+      }, 3 * 60000)
       if (reset != 'reset'){
         isAccountLogin.value = !isAccountLogin.value
       }
       pollingTimer.value = setInterval(() => {
         getQRCodeStatus()
-      }, 5000) // 每5秒轮询一次
+      }, 5000)
     })
 }
 const getQRCodeStatus = () => {
@@ -451,29 +423,21 @@ const getQRCodeStatus = () => {
       })
       getIsJoin()
       getUserDetail()
-      // startTest()
     }
   })
 }
 const handleQRCodeTimeout = () => {
-  clearTimeout(qrcodeDetail.value.timeoutTimer) // 清除定时器
+  clearTimeout(qrcodeDetail.value.timeoutTimer)
   clearInterval(pollingTimer.value)
   pollingTimer.value = null
   isScanSucess.value = false
   isResetCode.value = true
-  // ElMessage({
-  //   message:  '二维码已过期，请点击刷新',
-  //   type: 'warning',
-  //   duration: 1200
-  // })
-  // showToast('二维码已过期，请点击刷新', 'warning')
-  // getQRCode() // 直接调用获取新二维码
 }
 const toResetCode = () => {
   isResetCode.value = false
-  getQRCode('reset') // 直接调用获取新二维码
+  getQRCode('reset')
 }
-const loginStatus = ref(false) // 登录状态
+const loginStatus = ref(false)
 onMounted(() => {
   if (localStorage.getItem('answerToken')){
     loginStatus.value = true
@@ -496,49 +460,60 @@ const navList = computed(() => {
       name:'考生入口',
       path: 'examGuide',
       routerName:'health',
-      children: [
-
-      ]
+      children: []
     },
     {
       name:'成绩查询/证书申请',
       path: 'examHomeReport',
       routerName:'health',
-      children: [
-
-      ]
+      children: []
     },
   ]
 })
 
-
 const router = useRouter()
 
 </script>
 
 <style scoped>
+/* 基础兼容 */
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
 .exam-header-box{
   position: fixed;
   top:0;
-  z-index: 110;
+  z-index: 9999;
   width: 100%;
   background: #ffffff;
   padding: 28px 100px;
-
 }
 .exam-header-message{
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
   display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
   justify-content: space-between;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
   align-items: center;
 }
 .exam-header-message-left{
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
   display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
   align-items: center;
 }
-.exam-header-left-icon{
-  width: 157px;
-  height: 29px;
-}
 .exam-header-left-line{
   margin: 0 10px;
   width: 2px;
@@ -547,25 +522,27 @@ const router = useRouter()
 .exam-header-left-title{
   color: #409EFF;
   font-size: 20px;
-  font-style: normal;
   font-weight: 600;
-  line-height: normal;
   letter-spacing: 0.4px;
 }
 .exam-menu-box{
   margin-left: 120px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
   display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
   align-items: center;
 }
 .exam-menu-item{
   position: relative;
   margin-right: 100px;
-  color:  #0E0E0E;
+  color: #0E0E0E;
   font-size: 16px;
-  font-style: normal;
-  font-weight: 400;
-  line-height: normal;
   cursor: pointer;
+  white-space: nowrap;
 }
 .exam-entrance{
   position: absolute;
@@ -574,68 +551,63 @@ const router = useRouter()
   width: 56px;
   height: 22px;
 }
-
-
 .exam-menu-line{
   display: block;
   position: absolute;
   bottom: -10px;
   left: 50%;
+  -webkit-transform: translateX(-50%);
   transform: translateX(-50%);
   width: 0;
   height: 4px;
   opacity: 0;
+  -webkit-transition: all 0.6s ease;
   transition: all 0.6s ease;
   background-color: #409eff;
   border-radius: 10px;
-
 }
-.exam-menu-active i{
-  display: block;
-  position: absolute;
-  bottom: -10px;
-  left: 50%;
-  transform: translateX(-50%);
-    width: 100%;
-  height: 4px;
-  background-color: #409eff;
+.exam-menu-active .exam-menu-line{
+  width: 100%;
   opacity: 1;
-  border-radius: 10px;
-
 }
 .exam-menu-active div{
-  color:  #409EFF;
+  color: #409EFF;
   font-weight: 600;
 }
-
 .exam-menu-item:hover .exam-menu-line{
   opacity: 1;
   width: 100%;
 }
 .exam-header-message-right{
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
   display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
   align-items: center;
+  position: relative;
+  z-index: 100;
 }
 .exam-header-right-search-box {
-  margin-right: 280px;
+  margin-right: 220px;
   position: relative;
-  width: 248px;
-  height: 26px;
+  width: 320px;
+  //height: 26px;
   padding: 12px 26px;
   background-color: #F5F5F5;
-  box-sizing: content-box;
   border-radius: 120px;
 }
-
 .search-icon {
   position: absolute;
   left: 20px;
   top: 50%;
+  -webkit-transform: translateY(-50%);
   transform: translateY(-50%);
   width: 16px;
   height: 16px;
 }
-
 .exam-header-right-search-box input {
   width: 100%;
   height: 100%;
@@ -645,20 +617,77 @@ const router = useRouter()
   outline: none;
 }
 .exam-header-right-login-btn{
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
   display: flex;
   padding: 12px 26px;
-  flex-direction: column;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
   justify-content: center;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
   align-items: center;
   border-radius: 37px;
   background: #409EFF;
-  color:  #FFF;
+  color: #FFF;
   font-size: 16px;
-  font-style: normal;
-  font-weight: 400;
-  line-height: normal;
   cursor: pointer;
+  white-space: nowrap;
 }
+
+/* 登录用户下拉菜单 —— 核心修复 */
+.exam-user-wrapper {
+  position: relative;
+  z-index: 9999;
+}
+.ui-user-box{
+  position: relative;
+  z-index: 9999;
+}
+.ui-user-content{
+  display:-webkit-box;
+  display:-webkit-flex;
+  display:-ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  cursor: pointer;
+  z-index: 9999;
+}
+.ui-user-box-icon{
+  width: 46px;
+  height: 46px;
+  margin-right: 10px;
+  border-radius:50%;
+  object-fit: cover;
+}
+.ui-user-box-title{
+  color: #0E0E0E;
+  font-size: 18px;
+  line-height: 1;
+}
+.ui-user-logout{
+  position: absolute;
+  top: 55px;
+  left: 0;
+  white-space: nowrap;
+  padding: 14px 30px;
+  color: #0E0E0E;
+  font-size: 16px;
+  border-radius: 6px;
+  background: #FFF;
+  box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.1);
+  cursor: pointer;
+  z-index: 99999;
+}
+
+/* 弹框 */
 .dialog-mask {
   position: fixed;
   top: 0;
@@ -666,55 +695,74 @@ const router = useRouter()
   width: 100%;
   height: 100%;
   background: rgba(0, 0, 0, 0.5);
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
   display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
   align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
   justify-content: center;
-  z-index: 999;
+  z-index: 9999;
 }
-
 .dialog-box {
   position: relative;
   width: 475px;
   background: #fff;
   border-radius: 20px;
   padding: 50px;
+  z-index: 10000;
 }
-
 .dialog-title {
   font-size: 22px;
   font-weight: bold;
   margin-bottom: 30px;
   text-align: center;
 }
-
 .dialog-content {
-  margin-bottom: 50px;
+  margin-bottom: 30px;
   font-size: 18px;
   color:#0E0E0E;
-  font-weight: 400;
 }
-
 .dialog-btns {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
   display: flex;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
   justify-content: center;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
   align-items: center;
-
 }
-
 .dialog-btn {
   padding: 16px 0;
   border-radius: 10px;
   cursor: pointer;
   width: 172px;
-}
-.dialog-btn, .ui-btn,.ui-search-btn,.dialog-success-btn{
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
   display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
   align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
   justify-content: center;
-  &.disabled {
-    opacity: 0.7;
-    pointer-events: none;
-  }
+}
+.dialog-btn.disabled {
+  opacity: 0.7;
+  pointer-events: none;
 }
 .loading-spinner {
   width: 16px;
@@ -723,30 +771,18 @@ const router = useRouter()
   border: 2px solid #fff;
   border-top-color: transparent;
   border-radius: 50%;
+  -webkit-animation: spin 0.8s linear infinite;
   animation: spin 0.8s linear infinite;
 }
+@-webkit-keyframes spin { to { -webkit-transform: rotate(360deg); } }
+@keyframes spin { to { transform: rotate(360deg); } }
 
-.loading-spinner-v2{
-  width: 16px;
-  height: 16px;
-  margin-right: 8px;
-  border: 2px solid #409EFF;
-  border-top-color: transparent;
-  border-radius: 50%;
-  animation: spin 0.8s linear infinite;
-}
-@keyframes spin {
-  to {
-    transform: rotate(360deg);
-  }
-}
 .cancel {
   border: 1px solid #409EFF;
   color: #409EFF;
   background: #fff;
   font-size: 18px;
 }
-
 .confirm {
   background: #409eff;
   color: #fff;
@@ -754,107 +790,95 @@ const router = useRouter()
   font-size: 18px;
 }
 .input-label {
-
-font-size: 14px;
-color: #0e0e0e;
-margin-bottom: 8px;
+  font-size: 14px;
+  color: #0e0e0e;
+  margin-bottom: 8px;
 }
 .login-input {
   margin: 0 0 15px;
-  input {
-    width: 100%;
-    height: 56px;
-    padding: 0 15px;
-    border: 1px solid #B2B3B5; /* 默认黑色边框 */
-    border-radius: 10px;
-    font-size: 14px;
-    /* 去除输入框默认样式 */
-    -webkit-appearance: none;
-    outline: none;
-    /* 隐藏数字输入框箭头 */
-    &[type="number"] {
-      -moz-appearance: textfield;
-      &::-webkit-outer-spin-button,
-      &::-webkit-inner-spin-button {
-        -webkit-appearance: none;
-        margin: 0;
-      }
-    }
-    &:focus {
-      border-color: #79BBFF; /* 输入时边框颜色 */
-    }
-  }
-
-  &.code-input {
-    position: relative;
-
-    .get-code-btn {
-      position: absolute;
-      right: 10px;
-      top: 50%;
-      transform: translateY(-50%);
-      background: none;
-      border: none;
-      color: #79BBFF; /* 按钮文字颜色 */
-      padding: 0;
-
-    }
-  }
+}
+.login-input input {
+  width: 100%;
+  height: 56px;
+  padding: 0 15px;
+  border: 1px solid #B2B3B5;
+  border-radius: 10px;
+  font-size: 14px;
+  outline: none;
+}
+.login-input input:focus {
+  border-color: #79BBFF;
+}
+.code-input {
+  position: relative;
+}
+.get-code-btn {
+  position: absolute;
+  right: 10px;
+  top: 50%;
+  -webkit-transform: translateY(-50%);
+  transform: translateY(-50%);
+  background: none;
+  border: none;
+  color: #79BBFF;
+  padding: 0;
+  cursor: pointer;
 }
 
-.dialog-content {
-  margin-bottom: 30px;
+/* 二维码登录 */
+.ui-qrcode-card .ui-qrcode-title{
+  color: #0E0E0E;
+  font-size: 22px;
+  font-weight: 600;
+  text-align: center;
+}
+.ui-qrcode-card .ui-qrcode-subtitle{
+  margin: 10px 0;
+  color: #66676C;
+  text-align: center;
   font-size: 14px;
 }
-.ui-qrcode-card{
-
-  .ui-qrcode-title{
-    color: #0E0E0E;
-    font-size: 22px;
-    font-weight: 600;
-  }
-  .ui-qrcode-subtitle{
-    margin: 10px 0 10px;
-    color: #66676C;
-    text-align: center;
-    font-size: 14px;
-    font-style: normal;
-    font-weight: 400;
-    line-height: normal;
-  }
-  .ui-qrcode-box{
-    position: relative;
-    margin: 0 auto;
-    width: 280px;
-    height: 280px;
-    .ui-qrcode-mask{
-      position: absolute;
-      top: 0;
-      left: 0;
-      width: 100%;
-      height: 100%;
-      background: rgba(0,0,0,0.5);
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      justify-content: center;
-      z-index: 1001;
-      cursor: pointer;
-      .ui-qrcode-mask-icon{
-        width: 40px;
-        height: 38px;
-      }
-      .ui-qrcode-mask-title{
-        margin-top: 10px;
-        color: #FFF;
-        text-align: center;
-        font-size: 16px;
-        font-style: normal;
-        font-weight: 400;
-        line-height: normal;
-      }
-    }
-  }
+.ui-qrcode-box{
+  position: relative;
+  margin: 0 auto;
+  width: 280px;
+  height: 280px;
+}
+.ui-qrcode-mask{
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0,0,0,0.5);
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  cursor: pointer;
+  z-index: 1001;
+}
+.ui-qrcode-mask-icon{
+  width: 40px;
+  height: 38px;
+}
+.ui-qrcode-mask-title{
+  margin-top: 10px;
+  color: #FFF;
+  font-size: 16px;
 }
 .dialog-right-top{
   position: absolute;
@@ -867,153 +891,120 @@ margin-bottom: 8px;
   height: 70px;
   border-radius: 0 20px 0 0;
   cursor: pointer;
-  img{
-    width: 100%;
-    height: 100%;
-    border-radius: 0 20px 0 0;
-  }
-  .ui-dialog-right-tip{
-    position: absolute;
-    top: 20px;
-    left: -72px;
-    display: flex;
-    padding: 10px;
-    justify-content: center;
-    align-items: center;
-    font-size: 16px;
-    color: #fff;
-    border-radius: 10px;
-    background:  #409EFF;
-    z-index: 1000;
-    &::after {
-      content: '';
-      position: absolute;
-      right: -14px;
-      top: 50%;
-      transform: translateY(-50%);
-      border-width: 8px;
-      border-style: solid;
-      border-color: transparent transparent transparent #409EFF;
-    }
-  }
+}
+.dialog-right-top-box img{
+  width: 100%;
+  height: 100%;
+  border-radius: 0 20px 0 0;
+}
+.ui-dialog-right-tip{
+  position: absolute;
+  top: 20px;
+  left: -72px;
+  padding: 10px;
+  font-size: 16px;
+  color: #fff;
+  border-radius: 10px;
+  background: #409EFF;
+  z-index: 1000;
+}
+.ui-dialog-right-tip::after {
+  content: '';
+  position: absolute;
+  right: -14px;
+  top: 50%;
+  -webkit-transform: translateY(-50%);
+  transform: translateY(-50%);
+  border-width: 8px;
+  border-style: solid;
+  border-color: transparent transparent transparent #409EFF;
 }
 .dialog-scan-success{
   margin: 34px 0 0;
-
-  .dialog-scan-success-title{
-    margin-bottom: 10px;
-    color: #0E0E0E;
-    text-align: center;
-    font-size: 22px;
-    font-style: normal;
-    font-weight: 600;
-    line-height: normal;
-  }
-  .dialog-scan-success-subtitle{
-    color: #66676C;
-    text-align: center;
-    font-size: 14px;
-    font-style: normal;
-    font-weight: 400;
-    line-height: normal;
-  }
+  text-align: center;
+}
+.dialog-scan-success-title{
+  margin-bottom: 10px;
+  color: #0E0E0E;
+  font-size: 22px;
+  font-weight: 600;
+}
+.dialog-scan-success-subtitle{
+  color: #66676C;
+  font-size: 14px;
 }
 .ui-dialog-contact-cancel{
   position: absolute;
   bottom:-64px;
   left: 50%;
+  -webkit-transform: translateX(-50%);
   transform: translateX(-50%);
   width:34px;
   height: 34px;
   cursor: pointer;
 }
+
+/* 成功弹窗 */
 .dialog-success-box{
-    display: flex;
-    width: 574px;
-    padding: 50px;
-    flex-direction: column;
-    align-items: center;
-    border-radius: 20px;
-    background: #FFF;
-    .dialog-success-img{
-        width: 130px;
-        height: 116px;
-    }
-    .dialog-success-title{
-        margin: 50px auto 30px;
-        color: #0E0E0E;
-        font-size: 22px;
-        font-weight: 600;
-    }
-    .dialog-success-content{
-        margin-bottom: 50px;
-        color:#0E0E0E;
-        font-size: 18px;
-    }
-    .dialog-success-btns{
-        display: flex;
-        justify-content: center;
-        align-items: center;
-    }
-    .dialog-success-btns-V1{
-        justify-content: space-between;
-        width: 400px;
-    }
-
-    .dialog-success-btn{
-        padding: 16px 0;
-        border-radius: 10px;
-        cursor: pointer;
-        width: 172px;
-    }
+  width: 574px;
+  padding: 50px;
+  border-radius: 20px;
+  background: #FFF;
+  text-align: center;
 }
-
-.ui-user-box{
-    position: absolute;
-    top:38px;
-    right:100px;
-    height: 70px;
-    .ui-user-content{
-        display:flex;
-        align-items: center;
-        position: relative;
-        cursor: pointer;
-    }
-    .ui-user-box-icon{
-        width: 46px;
-        height: 46px;
-        margin-right: 10px;
-        border-radius:50%;
-        object-fit: cover;
-    }
-    .ui-user-box-title{
-        color: #0E0E0E;
-        font-size: 18px;
-        font-style: normal;
-        line-height: normal;
-    }
-    .ui-user-logout{
-        position: absolute;
-        top: 55px;
-        left: -20px;
-        display: inline-flex;
-        white-space: nowrap;
-        padding: 14px 30px;
-        flex-direction: column;
-        justify-content: center;
-        align-items: center;
-        color: #0E0E0E;
-        font-size: 16px;
-        font-style: normal;
-        font-weight: 400;
-        line-height: normal;
-        border-radius: 6px;
-        background:  #FFF;
-        box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.10);
-        cursor: pointer;
-    }
-
+.dialog-success-img{
+  width: 130px;
+  height: 116px;
+}
+.dialog-success-title{
+  margin: 50px auto 30px;
+  color: #0E0E0E;
+  font-size: 22px;
+  font-weight: 600;
+}
+.dialog-success-content{
+  margin-bottom: 50px;
+  color:#0E0E0E;
+  font-size: 18px;
+}
+.dialog-success-btns{
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+.dialog-success-btns-V1{
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  width: 400px;
+  margin: 0 auto;
+}
+.dialog-success-btn{
+  padding: 16px 0;
+  border-radius: 10px;
+  cursor: pointer;
+  width: 172px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
 }
-
-
 </style>
diff --git a/src/components/pc/exam/examHome.vue b/src/components/pc/exam/examHome.vue
index a4c008d..dd31eeb 100644
--- a/src/components/pc/exam/examHome.vue
+++ b/src/components/pc/exam/examHome.vue
@@ -12,348 +12,373 @@ import 'swiper/css/scrollbar'
 import 'swiper/css/lazy'
 import 'swiper/css/autoplay'
 
-
 const router = useRouter()
 
-const modules = [Navigation, Pagination, Scrollbar, A11y, Lazy, Autoplay]
-const onSwiper = (swiper) => {
-};
+const modules = [Navigation, Pagination, Scrollbar, A11y, Autoplay, Lazy]
+const onSwiper = (swiper) => {};
 
-const swiperList = ref( [
-
-  ])
-//类型
+const swiperList = ref([])
 const typeIndex = ref(0)
 const typeList = ref([
-  {
-    id:'all',
-    name:'全部课程'
-  },
+  { id:'all', name:'全部课程' },
 ])
-const examList = ref([
-])
-// 展示联系二维码
+const examList = ref([])
 const flag = ref(false)
+const searchKeyword = ref('')
 
-const changeType =(item,index) => {
+const changeType = (item, index) => {
   typeIndex.value = index
   getList()
 }
-const goToBannerPath = (path,index) => {
-  console.log(path,'ppp')
-  if (path){
-    location.href = path
-  }
+
+const goToBannerPath = (path, index) => {
+  if (path) location.href = path
 }
-const goToPath = (path,row) => {
-   localStorage.setItem('examType',typeIndex.value)
-    router.push({
-      name: path,
-      query:{id:row.id}
-    })
+
+const goToPath = (path, row) => {
+  localStorage.setItem('examType', typeIndex.value)
+  router.push({ name: path, query:{id:row.id} })
 }
+
 const getTypeList = () => {
   request.get(`/go/api/app/v2/exam/home`)
     .then(res => {
       let result = res.data
-      // examList.value = res.data
-      swiperList.value =result.carousel_list
-      typeList.value = [...typeList.value,...result.paper_cate_list]
-      if (localStorage.getItem('searchHome')){
+      swiperList.value = result.carousel_list
+      typeList.value = [...typeList.value, ...result.paper_cate_list]
+
+      if (localStorage.getItem('searchHome')) {
         searchKeyword.value = localStorage.getItem('searchHome')
-        console.log(searchKeyword.value,'searchKeyword')
         localStorage.removeItem('searchHome')
       }
-      if (localStorage.getItem('examType')){
-        typeIndex.value = localStorage.getItem('examType') * 1
-        console.log(searchKeyword.value,'searchKeyword')
+      if (localStorage.getItem('examType')) {
+        typeIndex.value = Number(localStorage.getItem('examType'))
         localStorage.removeItem('examType')
-      }else {
+      } else {
         typeIndex.value = 0
       }
       getList()
-
     })
 }
-const searchKeyword = ref('')
+
 const changeSearch = (e) => {
   searchKeyword.value = e
   getList()
 }
+
 const getList = () => {
-  request.get(`/go/api/app/v2/exam/paper/list?category_id=${typeIndex.value == 0 ? '' : typeList.value[typeIndex.value].id}&keyword=${searchKeyword.value}`)
+  let cid = typeIndex.value === 0 ? '' : typeList.value[typeIndex.value].id
+  request.get(`/go/api/app/v2/exam/paper/list?category_id=${cid}&keyword=${searchKeyword.value}`)
     .then(res => {
-      let result = res.data
       examList.value = res.data
-      // swiperList.value =result.carousel_list
-      // typeList.value = [...typeList.value,...result.paper_cate_list]
     })
 }
-// 新增时间格式化函数
-// 优化后的时间格式化函数
+
 const formatExamTime = (start, end) => {
   if (!start || !end) return null;
-
   const startDate = new Date(start);
   const endDate = new Date(end);
-
-  // 日期格式化为两位数
   const format = n => n.toString().padStart(2, '0');
 
-  // 分解日期组件
   const s = {
     y: startDate.getFullYear(),
     m: format(startDate.getMonth() + 1),
     d: format(startDate.getDate()),
-    t: startDate.toTimeString().substr(0,5)
+    t: startDate.toTimeString().slice(0,5)
   };
-
   const e = {
     y: endDate.getFullYear(),
     m: format(endDate.getMonth() + 1),
     d: format(endDate.getDate()),
-    t: endDate.toTimeString().substr(0,5)
+    t: endDate.toTimeString().slice(0,5)
   };
 
-  // 构建日期部分
   let datePart = '';
   if (s.y !== e.y) {
     datePart = `${s.y}-${s.m}-${s.d} ${s.t} 至 ${e.y}-${e.m}-${e.d} ${e.t}`;
-  } else if (s.m !== e.m) {
-    datePart = `${s.y}-${s.m}-${s.d} ${s.t} 至 ${e.m}-${e.d} ${e.t}`;
-  } else if (s.d !== e.d) {
+  } else if (s.m !== e.m || s.d !== e.d) {
     datePart = `${s.y}-${s.m}-${s.d} ${s.t} 至 ${e.m}-${e.d} ${e.t}`;
   } else {
     datePart = `${s.y}-${s.m}-${s.d}  ${s.t}-${e.t}`;
   }
-
-  return `${datePart}`;
+  return datePart;
 }
+
 onMounted(() => {
   window.addEventListener("scroll", () => {
-    // 获取滚动元素的滚动距离
-    let scrollTop =
-      window.pageYOffset || document.documentElement.scrollTop ||document.body.scrollTop;
-    // 判断回到顶部按钮的显示条件,如果滚动距离大于1000就显示
-    scrollTop > 300 ? (flag.value= true) : (flag.value = false);
+    let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
+    flag.value = scrollTop > 300;
   }, true);
-  typeIndex.value = -1
+  typeIndex.value = 0
   getTypeList()
 })
 </script>
 
 <template>
-<div class='exam-home'>
-  <exam-header @search='changeSearch' :searchKeyword='searchKeyword'></exam-header>
-  <div>
-    <swiper
-      id="swiper"
-      :modules="modules"
-      :slides-per-view="1"
-      :space-between="0"
-      lazy
-      loop
-      :autoplay="true"
-      @swiper="onSwiper"
-      :pagination="{
-        clickable: true
-      }"
-    >
-      <swiper-slide
-        class="banner-swiper"
-        v-for="(item, index) in swiperList"
-        :key="index"
+  <div class='exam-home'>
+    <exam-header @search='changeSearch' :searchKeyword='searchKeyword'></exam-header>
+    <div>
+      <swiper
+        id="banner-swiper"
+        :modules="modules"
+        :slides-per-view="1"
+        :space-between="0"
+        lazy
+        loop
+        :autoplay="{ delay: 3000, disableOnInteraction: false }"
+        :pagination="{ clickable: true }"
       >
-        <img class="swiper-lazy" :src="item.pic"  alt="轮播图"  @click.stop='goToBannerPath(item.path,index)' />
-      </swiper-slide>
-    </swiper>
-    <div class='exam-home-type-box'>
-      <div class='exam-home-type-list'>
-        <div class='exam-home-type-item' @click.stop='changeType(item,index)' :class='typeIndex == index ?"exam-home-type-item-active" : ""' v-for='(item,index) in typeList' :key='index'>{{item.name}}</div>
-      </div>
-    </div>
-    <div class='exam-home-list-box'>
-      <div v-if='examList && examList.length > 0' class='exam-home-list-style'>
-        <div class='exam-home-list-item' v-for='(item,index) in examList' :key='index' @click='goToPath("examDetail",item)'>
-          <img :src='item.pic' alt='' class='exam-home-list-item-pic'>
-          <div class='exam-home-list-message-box'>
-            <div class='exam-home-list-message'>
-              <div class='exam-home-list-message-title'>{{item.title || ''}}</div>
-              <div class='exam-home-list-message-exam-time'>考试时间：{{formatExamTime(item.start_time_str, item.end_time_str) || '--'}}</div>
-              <div class='exam-home-list-message-exam-time'>补考时间：{{formatExamTime(item.resit_start_time_str, item.resit_end_time_str) || '--'}}</div>
-            </div>
+        <swiper-slide class="banner-swiper" v-for="(item, index) in swiperList" :key="index">
+          <img class="swiper-lazy" :src="item.pic" alt="轮播图" @click.stop="goToBannerPath(item.path,index)" />
+        </swiper-slide>
+      </swiper>
+
+      <div class='exam-home-type-box'>
+        <div class='exam-home-type-list'>
+          <div
+            class='exam-home-type-item'
+            @click.stop='changeType(item,index)'
+            :class='typeIndex === index ? "exam-home-type-item-active" : ""'
+            v-for='(item,index) in typeList'
+            :key='index'
+          >
+            {{item.name}}
           </div>
         </div>
       </div>
-      <div v-else class='exam-empty-box'>
-        <img src='https://images.health.ufutx.com/202505/19/5c1dbfea480f286b0208395f90a2cac3.png' alt='' class='exam-empty-icon'>
-        <div class='exam-empty-title'>敬请期待</div>
+
+      <div class='exam-home-list-box'>
+        <div v-if='examList && examList.length > 0' class='exam-home-list-style'>
+          <div class='exam-home-list-item' v-for='(item,index) in examList' :key='index' @click='goToPath("examDetail",item)'>
+            <img :src='item.pic' alt='' class='exam-home-list-item-pic'>
+            <div class='exam-home-list-message-box'>
+              <div class='exam-home-list-message'>
+                <div class='exam-home-list-message-title'>{{item.title || ''}}</div>
+                <div class='exam-home-list-message-exam-time'>考试时间：{{formatExamTime(item.start_time_str, item.end_time_str) || '--'}}</div>
+                <div class='exam-home-list-message-exam-time'>补考时间：{{formatExamTime(item.resit_start_time_str, item.resit_end_time_str) || '--'}}</div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div v-else class='exam-empty-box'>
+          <img src='https://images.health.ufutx.com/202505/19/5c1dbfea480f286b0208395f90a2cac3.png' alt='' class='exam-empty-icon'>
+          <div class='exam-empty-title'>敬请期待</div>
+        </div>
+      </div>
+
+      <div class="exam-home-wechat-icon" >
+        <img src="https://images.health.ufutx.com/202505/14/5b720a7d07e87354b96c2094d948bb9a.png" alt="客服二维码">
       </div>
     </div>
-    <div class='exam-home-wechat-icon' >
-      <img src='https://images.health.ufutx.com/202505/14/5b720a7d07e87354b96c2094d948bb9a.png' alt=''>
-    </div>
   </div>
-</div>
 </template>
 
 <style scoped>
+/* 基础兼容，不影响任何外部样式 */
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
 .exam-home{
   background: #f5f5f5;
   height: 100vh;
   overflow-y: auto;
-  scrollbar-width: none; /* Firefox */
-  -ms-overflow-style: none; /* IE/Edge */
-  &::-webkit-scrollbar {
-    display: none; /* Chrome/Safari/Opera */
-  }
+  scrollbar-width: none;
+  -ms-overflow-style: none;
 }
-/* 顶部轮播图 */
-#swiper {
+.exam-home::-webkit-scrollbar {
+  display: none;
+}
+
+/* 轮播 */
+#banner-swiper {
   padding-top: 100px;
   width: 100%;
   height: 708px;
+  position: relative;
+  z-index: 10;
 }
-
-#swiper .banner-swiper {
+.banner-swiper {
   width: 100%;
   height: 100%;
-  position: relative;
-  z-index: 1200;
 }
-
-#swiper .banner-swiper img {
+.banner-swiper img {
   width: 100%;
   height: 100%;
   object-fit: cover;
+  display: block;
 }
-.exam-home-type-box{
-    display: flex;
-    padding: 20px 0 20px 360px ;
-    align-items: center;
-    background: #FFF;
-    //backdrop-filter: blur(15px);
-    flex-shrink: 0;  /* 防止容器收缩 */
 
+/* 分类导航 */
+.exam-home-type-box{
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  padding: 20px 0 20px 360px;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  background: #FFF;
+  position: relative;
+  z-index: 1;
 }
 .exam-home-type-list{
-    padding-bottom: 10px;
-    display: flex;
-    align-items: center;
-    flex-wrap: nowrap;
-    width: 100%;
-    overflow-x: auto;
-
+  padding-bottom: 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  flex-wrap: nowrap;
+  width: 100%;
+  overflow-x: auto;
 }
 .exam-home-type-item{
-    margin-right: 20px;
-    display: flex;
-    padding: 12px 20px;
-    justify-content: center;
-    align-items: center;
-    border-radius: 100px;
-    border: 1px solid  #DDD;
-    color: #0E0E0E;
-    font-size: 16px;
-    font-style: normal;
-    font-weight: 400;
-    line-height: normal;
-    cursor: pointer;
-    flex-shrink: 0;  /* 防止单个项被压缩 */
+  margin-right: 20px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  padding: 12px 20px;
+  border-radius: 100px;
+  border: 1px solid #DDD;
+  color: #0E0E0E;
+  font-size: 16px;
+  cursor: pointer;
+  white-space: nowrap;
 }
 .exam-home-type-item-active{
-    background:  #409EFF;
-    color: #FFF;
-    border: 1px solid  #409EFF;
+  background: #409EFF;
+  color: #FFF;
+  border-color: #409EFF;
 }
+
+/* 课程列表 */
 .exam-home-list-box{
-    padding: 20px 360px 120px;
-    width: 100%;
-    display: flex;
-    flex-wrap: wrap;
-    background: #F5F5F5;
+  padding: 20px 360px 120px;
+  width: 100%;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  background: #F5F5F5;
+  position: relative;
+  z-index: 1;
 }
 .exam-home-list-style{
-  display:flex;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
   flex-wrap: wrap;
 }
 .exam-home-list-item{
-    margin-right: 20px;
-    border-radius: 10px;
-    margin-bottom: 20px;
-    cursor: pointer;
-}
-.exam-home-list-item:nth-child(3n){
-    margin-right: 0;
-}
-.exam-home-list-item-pic{
-    width: 386px;
-    height: 240px;
-    border-radius: 10px 10px 0 0;
-    object-fit: cover;
-}
-.exam-empty-box{
-  margin: 60px auto;
-  .exam-empty-icon{
-    margin-bottom: 20px;
-    width: 147px;
-    height: 121px;
-  }
-  .exam-empty-title{
-    color: #0E0E0E;
-    text-align: center;
-    font-size: 20px;
-    font-style: normal;
-    font-weight: 400;
-    line-height: normal;
-  }
-}
-.exam-home-list-message-box{
-    background: #ffffff;
-    border-radius: 10px;
-}
-.exam-home-list-message{
-    padding: 20px;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: flex-start;
-    margin-top: -20px;
-    border-radius: 10px;
-    background: rgba(255, 255, 255, 0.30);
-    backdrop-filter: blur(12.5px);
+  margin-right: 20px;
+  margin-bottom: 20px;
+  border-radius: 10px;
+  cursor: pointer;
+  width: 386px;
   overflow: hidden;
 }
+.exam-home-list-item:nth-child(3n){
+  margin-right: 0;
+}
+.exam-home-list-item-pic{
+  width: 386px;
+  height: 240px;
+  border-radius: 10px 10px 0 0;
+  object-fit: cover;
+  display: block;
+}
+
+/* 空状态 */
+.exam-empty-box{
+  margin: 60px auto;
+  text-align: center;
+}
+.exam-empty-icon{
+  margin-bottom: 20px;
+  width: 147px;
+  height: 121px;
+  display: block;
+  margin: 0 auto 20px;
+}
+.exam-empty-title{
+  color: #0E0E0E;
+  font-size: 20px;
+}
+
+/* 卡片内容 */
+.exam-home-list-message-box{
+  background: #fff;
+  border-radius: 0 0 10px 10px;
+}
+.exam-home-list-message{
+  padding: 20px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  gap: 10px;
+  margin-top: -20px;
+  border-radius: 10px;
+  background: rgba(255, 255, 255, 0.3);
+  -webkit-backdrop-filter: blur(12.5px);
+  backdrop-filter: blur(12.5px);
+  position: relative;
+  z-index: 2;
+}
 .exam-home-list-message-title{
-    height: 18px;
-    color: #0E0E0E;
-    font-size: 18px;
-    font-weight: 600;
-    line-height: 18px;
+  color: #0E0E0E;
+  font-size: 18px;
+  font-weight: 600;
   max-width: 340px;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
 .exam-home-list-message-exam-time{
-    margin-top: 10px;
-    color:  #66676C;
-    font-size: 16px;
-    font-style: normal;
-    font-weight: 400;
-    line-height: 16px;
+  color: #66676C;
+  font-size: 16px;
 }
+
+/* ====================== 只在这里加最小限度的权重保证显示 ====================== */
 .exam-home-wechat-icon{
-    position: fixed;
-    right: 20px;
-    bottom: 120px;
-    width: 190px;
-    height: 220px;
-    z-index: 101;
-    img{
-        width: 100%;
-        height: 100%;
-        object-fit: cover;
-    }
+  position: fixed;
+  right: 20px;
+  bottom: 120px;
+  width: 190px;
+  height: 220px;
+  z-index: 999;
+}
+.exam-home-wechat-icon img{
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  display: block;
 }
 </style>
diff --git a/src/components/pc/exam/examHomeReport.vue b/src/components/pc/exam/examHomeReport.vue
index e460f65..caf04c1 100644
--- a/src/components/pc/exam/examHomeReport.vue
+++ b/src/components/pc/exam/examHomeReport.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { onMounted, ref } from 'vue'
+import { onMounted, ref, onUnmounted } from 'vue'
 import ExamHeader from '@/components/pc/exam/examHeader.vue'
 import request from '@/utils/request.js'
 import { useRouter } from 'vue-router'
@@ -12,229 +12,295 @@ import 'swiper/css/scrollbar'
 import 'swiper/css/lazy'
 import 'swiper/css/autoplay'
 
-
 const router = useRouter()
 
+// id 固定为 1，不修改
 const id = ref('1')
-const detail = ref(
-  {
-    id:'',
-    title:'',
-    score_time_str:'' // 考试出成绩时间
-  }
-)
-
+const detail = ref({
+  id: '',
+  title: '',
+  score_time_str: '',
+  start_time_str: '',
+  end_time_str: ''
+})
 
 const modules = [Navigation, Pagination, Scrollbar, A11y, Lazy, Autoplay]
-const onSwiper = (swiper) => {
-};
+const swiperList = ref([])
+const onSwiper = (swiper) => {}
 
-const swiperList = ref( [
-
-])
-const showReport = ref(false) // 是否参加考试
-
-//类型
 const typeIndex = ref(0)
-const typeList = ref([
-  {
-    id:'all',
-    name:'全部课程'
-  },
-])
-const examList = ref([
-])
-// 展示联系二维码
+const typeList = ref([{ id: 'all', name: '全部课程' }])
+const examList = ref([])
+const searchKeyword = ref('')
+
+const showReport = ref(false)
+const reportStatus = ref(false)
+const showTime = ref(0)
 const flag = ref(false)
 
-const changeType =(item,index) => {
+let scrollListener = null
+
+const goToBannerPath = (path) => {
+  location.href = path
+}
+
+const goToPath = (path, row) => {
+  router.push({ name: path, query: { id: row.id } })
+}
+
+const changeType = (item, index) => {
   typeIndex.value = index
   getList()
 }
-const goToBannerPath = (path,index) => {
-  console.log(path,'ppp')
-  location.href = path
-}
-const goToPath = (path,row) => {
-  router.push({
-    name: path,
-    query:{id:row.id}
-  })
-}
-const getTypeList = () => {
-  request.get(`/go/api/app/v2/exam/home`)
-    .then(res => {
-      let result = res.data
-      // examList.value = res.data
-      swiperList.value =result.carousel_list
-      typeList.value = [...typeList.value,...result.paper_cate_list]
-      getList()
 
-    })
-}
-const searchKeyword = ref('')
-const changeSearch = (e) => {
-  searchKeyword.value = e
+const changeSearch = (val) => {
+  searchKeyword.value = val
   getList()
 }
-const getList = () => {
-  request.get(`/go/api/app/v2/exam/paper/list?category_id=${typeIndex.value == 0 ? '' : typeList.value[typeIndex.value].id}&keyword=${searchKeyword.value}`)
+
+const getTypeList = () => {
+  request.get('/go/api/app/v2/exam/home')
     .then(res => {
-      let result = res.data
-      examList.value = res.data
-      // swiperList.value =result.carousel_list
-      // typeList.value = [...typeList.value,...result.paper_cate_list]
+      const result = res.data || {}
+      swiperList.value = result.carousel_list || []
+      typeList.value = [...typeList.value, ...(result.paper_cate_list || [])]
+      getList()
     })
+    .catch(err => console.error('首页数据请求失败', err))
 }
-// 新增时间格式化函数
+
+const getList = () => {
+  const categoryId = typeIndex.value === 0 ? '' : typeList.value[typeIndex.value].id
+  request.get(`/go/api/app/v2/exam/paper/list?category_id=${categoryId}&keyword=${searchKeyword.value}`)
+    .then(res => {
+      examList.value = res.data || []
+    })
+    .catch(err => console.error('试卷列表请求失败', err))
+}
+
 const formatExamTime = (start, end) => {
-  if (!start || !end) return null;
+  if (!start || !end) return '--'
+  const startDate = new Date(start)
+  const endDate = new Date(end)
+  if (isNaN(startDate) || isNaN(endDate)) return '--'
 
-  const startDate = new Date(start);
-  const endDate = new Date(end);
+  const year = startDate.getFullYear()
+  const month = String(startDate.getMonth() + 1).padStart(2, '0')
+  const day = String(startDate.getDate()).padStart(2, '0')
+  const startTime = startDate.toTimeString().substring(0, 5)
+  const endTime = endDate.toTimeString().substring(0, 5)
 
-  const year = startDate.getFullYear();
-  const month = startDate.getMonth() + 1;
-  const day = startDate.getDate();
-
-  const startTime = startDate.toTimeString().substring(0, 5);
-  const endTime = endDate.toTimeString().substring(0, 5);
-
-  return `${year}年${month}月${day}日 ${startTime}-${endTime}`;
+  return `${year}年${month}月${day}日 ${startTime}-${endTime}`
 }
-const reportStatus = ref(false) // 是否参加了考试
-const showTime = ref() // 距离出成绩时间
-const safeDateParse = (dateString) => { //日期校验
-  console.log(dateString,'dateString==')
-  const date = new Date(dateString);
-  return isNaN(date) ? null : date;
-};
-const getIsJoin = (id) => {
-  const scoreDate = safeDateParse(detail.value.score_time_str);
-  console.log(scoreDate,scoreDate > new Date(),'33')
-  if (!scoreDate || scoreDate > new Date()){
-    const timeDiff = Math.ceil((scoreDate - new Date()) / (1000 * 60 * 60 * 24));
-    showTime.value = timeDiff > 0 ? timeDiff : 0;
+
+const safeDateParse = (dateString) => {
+  const date = new Date(dateString)
+  return isNaN(date) ? null : date
+}
+
+// 查询成绩，固定使用 id.value = '1'
+const getIsJoin = () => {
+  const scoreDate = safeDateParse(detail.value.score_time_str)
+  const now = new Date()
+
+  if (!scoreDate || scoreDate > now) {
+    const timeDiff = Math.ceil((scoreDate - now) / (1000 * 60 * 60 * 24))
+    showTime.value = Math.max(timeDiff, 0)
+    reportStatus.value = false
     showReport.value = true
     return
   }
-  request.get(`go/api/app/v2/exam/paper/${id}/answer`)
+
+  request.get(`/go/api/app/v2/exam/paper/${id.value}/answer`)
     .then(res => {
-      if (res.data.id != 0 && res.data.score && res.data.score.length >1){
-        router.push({
-          name:'reportCard'
-        })
-      }else {
-        if (res.data.id == 0){
-          reportStatus.value = true
-        }else {
-          reportStatus.value = false
-        }
+      const data = res.data || {}
+      if (data.id !== 0 && data.score && data.score.toString().length > 1) {
+        router.push({ name: 'reportCard' })
+      } else {
+        reportStatus.value = data.id === 0
         showReport.value = true
       }
-      console.log(res,'r===')
+    })
+    .catch(err => {
+      console.error('成绩查询失败', err)
     })
 }
+
 const getDetail = () => {
   request.get(`/go/api/app/v2/exam/paper/${id.value}/detail`)
     .then(res => {
-      let result = res.data
-      detail.value = res.data
-      // detail.value.score_time_str = '2025-05-31 09:00:00'
-      console.log(detail.value,'rrr')
+      detail.value = res.data || {}
     })
+    .catch(err => console.error('试卷详情请求失败', err))
 }
 
 onMounted(() => {
-  window.addEventListener("scroll", () => {
-    // 获取滚动元素的滚动距离
-    let scrollTop =
-      window.pageYOffset || document.documentElement.scrollTop ||document.body.scrollTop;
-    // 判断回到顶部按钮的显示条件,如果滚动距离大于1000就显示
-    scrollTop > 300 ? (flag.value= true) : (flag.value = false);
-  }, true);
+  scrollListener = () => {
+    const scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
+    flag.value = scrollTop > 300
+  }
+  window.addEventListener('scroll', scrollListener, true)
+
   getTypeList()
   getDetail()
+})
 
+onUnmounted(() => {
+  if (scrollListener) {
+    window.removeEventListener('scroll', scrollListener, true)
+  }
 })
 </script>
 
 <template>
-  <div class='exam-home'>
-    <exam-header :menu-index="'2'" @search='changeSearch'></exam-header>
-    <div>
-      <swiper
-        id="swiper"
-        :modules="modules"
-        :slides-per-view="1"
-        :space-between="0"
-        lazy
-        loop
-        :autoplay="true"
-        @swiper="onSwiper"
-        :pagination="{
-        clickable: true
-      }"
-      >
-        <swiper-slide
-          class="banner-swiper"
-          v-for="(item, index) in swiperList"
-          :key="index"
-        >
-          <img class="swiper-lazy" :src="item.pic"  alt="轮播图"  @click.stop='goToBannerPath(item.path,index)' />
-          <!--        <div class="swiper-lazy-preloader"></div>-->
-          <!--        <div class="swiper-slide-title">-->
-          <!--          <h1>{{ item.title }}</h1>-->
-          <!--          <div class='swiper-slide-more' v-if='index != 0'>-->
-          <!--            <p >{{ item.content }}</p>-->
-          <!--            <img src='https://image.fulllinkai.com/202406/26/2518a5c6cc6f91cd901ee273dbd07429.png' alt=''>-->
-          <!--          </div>-->
+  <div class="exam-home">
+    <exam-header :menu-index="'2'" @search="changeSearch"></exam-header>
 
-          <!--        </div>-->
-          <!--        <div class='ui-swiper-line'></div>-->
-          <!--        <div class='ui-swiper-bottom-mask'></div>-->
-        </swiper-slide>
-      </swiper>
-      <div class='check-box'>
-        <div class='check-title'>{{detail.title}}</div>
-        <div class='check-subtitle'>考试时间：{{ formatExamTime(detail.start_time_str,detail.end_time_str) || '--' }}</div>
-        <div class='check-btn' @click='getIsJoin(1)'>
-          <div>查询成绩</div>
-          <svg class='check-btn-icon' xmlns="http://www.w3.org/2000/svg" width="24" height="23" viewBox="0 0 24 23" fill="none">
-            <path d="M13.131 4.71216L19.9192 11.5004M19.9192 11.5004L13.131 18.2886M19.9192 11.5004H4.34277" stroke="white" stroke-width="0.8" stroke-linecap="round" stroke-linejoin="round"/>
-          </svg>
-        </div>
+    <swiper
+      id="swiper"
+      :modules="modules"
+      :slides-per-view="1"
+      :space-between="0"
+      lazy
+      loop
+      :autoplay="{ delay: 3000, disableOnInteraction: false }"
+      @swiper="onSwiper"
+      :pagination="{ clickable: true }"
+    >
+      <swiper-slide
+        class="banner-swiper"
+        v-for="(item, index) in swiperList"
+        :key="index"
+      >
+        <img
+          class="swiper-lazy"
+          :src="item.pic"
+          alt="轮播图"
+          @click.stop="goToBannerPath(item.path)"
+        />
+      </swiper-slide>
+    </swiper>
+
+    <div class="check-box">
+      <div class="check-title">{{ detail.title || '暂无考试名称' }}</div>
+      <div class="check-subtitle">
+        考试时间：{{ formatExamTime(detail.start_time_str, detail.end_time_str) }}
+      </div>
+      <div class="check-btn" @click="getIsJoin">
+        <div>查询成绩</div>
+        <svg
+          class="check-btn-icon"
+          xmlns="http://www.w3.org/2000/svg"
+          width="24"
+          height="23"
+          viewBox="0 0 24 23"
+          fill="none"
+        >
+          <path
+            d="M13.131 4.71216L19.9192 11.5004M19.9192 11.5004L13.131 18.2886M19.9192 11.5004H4.34277"
+            stroke="white"
+            stroke-width="0.8"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+          />
+        </svg>
       </div>
     </div>
-    <div class="dialog-mask" v-if="showReport">
+
+    <div class="dialog-mask" v-if="showReport" @click.self="showReport = false">
       <div class="dialog-success-box text-center">
-        <svg xmlns="http://www.w3.org/2000/svg" width="90" height="100" viewBox="0 0 90 100" fill="none" class="dialog-success-img">
-          <path fill-rule="evenodd" clip-rule="evenodd" d="M0 29.9959C0 24.4841 4.46197 20.0221 9.97381 20.0221H69.9667C75.4785 20.0221 79.978 24.4841 79.978 29.9959V89.9888C79.978 95.5006 75.4785 100 69.9667 100H9.97381C4.46197 100 0 95.5006 0 89.9888V29.9959Z" fill="url(#paint0_linear_571_2865)"/>
-          <path d="M13.7358 64.0142H30.7358" stroke="white" stroke-width="8" stroke-linecap="round"/>
-          <path d="M13.7358 80.0142H38.7358" stroke="white" stroke-width="8" stroke-linecap="round"/>
-          <path d="M10.0107 20.0224H70.0036C70.0036 14.4731 65.5042 10.0111 59.9923 10.0111H20.0221C14.4727 10.0111 10.0107 14.4731 10.0107 20.0224Z" fill="url(#paint1_linear_571_2865)"/>
-          <foreignObject x="14.883" y="-29.3386" width="104.706" height="104.706"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(15.29px);clip-path:url(#bgblur_0_571_2865_clip_path);height:100%;width:100%"></div></foreignObject><circle data-figma-bg-blur-radius="30.5882" cx="67.2358" cy="23.0143" r="20" fill="#FF2946" stroke="white" stroke-width="3.52941"/>
-          <path d="M66.9977 34.8117C65.6137 34.8117 64.4917 33.6898 64.4917 32.3058C64.4917 30.9217 65.6137 29.7998 66.9977 29.7998C68.3817 29.7998 69.5036 30.9217 69.5036 32.3058C69.5036 33.6898 68.3817 34.8117 66.9977 34.8117Z" fill="white"/>
-          <path d="M66.9974 27.5441C65.8094 27.5441 64.8464 26.581 64.8464 25.393V15.3692C64.8464 14.1812 65.8094 13.2181 66.9974 13.2181C68.1854 13.2181 69.1485 14.1812 69.1485 15.3692V25.393C69.1485 26.581 68.1854 27.5441 66.9974 27.5441Z" fill="white"/>
+        <svg
+          xmlns="http://www.w3.org/2000/svg"
+          width="90"
+          height="100"
+          viewBox="0 0 90 100"
+          fill="none"
+          class="dialog-success-img"
+        >
+          <path
+            fill-rule="evenodd"
+            clip-rule="evenodd"
+            d="M0 29.9959C0 24.4841 4.46197 20.0221 9.97381 20.0221H69.9667C75.4785 20.0221 79.978 24.4841 79.978 29.9959V89.9888C79.978 95.5006 75.4785 100 69.9667 100H9.97381C4.46197 100 0 95.5006 0 89.9888V29.9959Z"
+            fill="url(#paint0_linear_571_2865)"
+          />
+          <path
+            d="M13.7358 64.0142H30.7358"
+            stroke="white"
+            stroke-width="8"
+            stroke-linecap="round"
+          />
+          <path
+            d="M13.7358 80.0142H38.7358"
+            stroke="white"
+            stroke-width="8"
+            stroke-linecap="round"
+          />
+          <path
+            d="M10.0107 20.0224H70.0036C70.0036 14.4731 65.5042 10.0111 59.9923 10.0111H20.0221C14.4727 10.0111 10.0107 14.4731 10.0107 20.0224Z"
+            fill="url(#paint1_linear_571_2865)"
+          />
+          <foreignObject
+            x="14.883"
+            y="-29.3386"
+            width="104.706"
+            height="104.706"
+          >
+            <div
+              xmlns="http://www.w3.org/1999/xhtml"
+              style="backdrop-filter:blur(15.29px);clip-path:url(#bgblur_0_571_2865_clip_path);height:100%;width:100%"
+            ></div>
+          </foreignObject>
+          <circle
+            data-figma-bg-blur-radius="30.5882"
+            cx="67.2358"
+            cy="23.0143"
+            r="20"
+            fill="#FF2946"
+            stroke="white"
+            stroke-width="3.52941"
+          />
+          <path
+            d="M66.9977 34.8117C65.6137 34.8117 64.4917 33.6898 64.4917 32.3058C64.4917 30.9217 65.6137 29.7998 66.9977 29.7998C68.3817 29.7998 69.5036 30.9217 69.5036 32.3058C69.5036 33.6898 68.3817 34.8117 66.9977 34.8117Z"
+            fill="white"
+          />
+          <path
+            d="M66.9974 27.5441C65.8094 27.5441 64.8464 26.581 64.8464 25.393V15.3692C64.8464 14.1812 65.8094 13.2181 66.9974 13.2181C68.1854 13.2181 69.1485 14.1812 69.1485 15.3692V25.393C69.1485 26.581 68.1854 27.5441 66.9974 27.5441Z"
+            fill="white"
+          />
           <defs>
-            <clipPath id="bgblur_0_571_2865_clip_path" transform="translate(-14.883 29.3386)"><circle cx="67.2358" cy="23.0143" r="20"/>
-            </clipPath><linearGradient id="paint0_linear_571_2865" x1="39.989" y1="34.0049" x2="39.989" y2="100" gradientUnits="userSpaceOnUse">
-            <stop stop-color="#409EFF"/>
-            <stop offset="1" stop-color="#409EFF" stop-opacity="0.3"/>
-          </linearGradient>
-            <linearGradient id="paint1_linear_571_2865" x1="40.0072" y1="11.7614" x2="40.0072" y2="20.0224" gradientUnits="userSpaceOnUse">
-              <stop stop-color="#409EFF"/>
-              <stop offset="1" stop-color="#409EFF" stop-opacity="0.3"/>
+            <clipPath id="bgblur_0_571_2865_clip_path" transform="translate(-14.883 29.3386)">
+              <circle cx="67.2358" cy="23.0143" r="20" />
+            </clipPath>
+            <linearGradient
+              id="paint0_linear_571_2865"
+              x1="39.989"
+              y1="34.0049"
+              x2="39.989"
+              y2="100"
+              gradientUnits="userSpaceOnUse"
+            >
+              <stop stop-color="#409EFF" />
+              <stop offset="1" stop-color="#409EFF" stop-opacity="0.3" />
+            </linearGradient>
+            <linearGradient
+              id="paint1_linear_571_2865"
+              x1="40.0072"
+              y1="11.7614"
+              x2="40.0072"
+              y2="20.0224"
+              gradientUnits="userSpaceOnUse"
+            >
+              <stop stop-color="#409EFF" />
+              <stop offset="1" stop-color="#409EFF" stop-opacity="0.3" />
             </linearGradient>
           </defs>
         </svg>
-<!--        <img src="https://images.health.ufutx.com/202504/17/2ee13769aa745d646d4951179ade3419.png" alt="" class="dialog-success-img" />-->
         <div class="dialog-success-title">温馨提示</div>
         <div class="dialog-success-content">
-          {{ reportStatus ? '未参加考试' : '距离出成绩时间还有' + showTime +'天，请耐心等待' }}
+          {{ reportStatus ? '未参加考试' : `距离出成绩时间还有 ${showTime} 天，请耐心等待` }}
         </div>
         <div class="dialog-success-btns">
-          <div class="dialog-success-btn confirm" @click="showReport = false" >
+          <div class="dialog-success-btn confirm" @click="showReport = false">
             确定
           </div>
         </div>
@@ -244,70 +310,72 @@ onMounted(() => {
 </template>
 
 <style scoped>
-.exam-home{
+.exam-home {
   background: #ffffff;
-  height: 100vh;
-
+  min-height: 100vh;
 }
-/* 顶部轮播图 */
+
 #swiper {
   padding-top: 100px;
   width: 100%;
   height: 708px;
 }
 
-#swiper .banner-swiper {
+.banner-swiper {
   width: 100%;
   height: 100%;
   position: relative;
-  z-index: 1200;
 }
 
-#swiper .banner-swiper img {
+.banner-swiper img {
   width: 100%;
   height: 100%;
+  object-fit: cover;
 }
-.check-box{
-  margin : 90px auto;
+
+.check-box {
+  margin: 90px auto;
   display: flex;
   flex-direction: column;
   align-items: center;
-  .check-title{
-    color: #0E0E0E;
-    font-size: 28px;
-    font-style: normal;
-    font-weight: 600;
-    line-height: normal;
-  }
-  .check-subtitle{
-    margin: 26px 0;
-    color: #66676C;
-    font-size: 18px;
-    font-style: normal;
-    font-weight: 400;
-    line-height: normal;
-  }
-  .check-btn{
-    margin-bottom: 150px;
-    display: flex;
-    padding: 16px 32px;
-    align-items: center;
-    gap: 6px;
-    border-radius: 10px;
-    background:  #409EFF;
-    color: #FFF;
-    font-size: 18px;
-    font-style: normal;
-    font-weight: 500;
-    line-height: normal;
-    cursor: pointer;
-    .check-btn-icon{
-      margin-left: 6px;
-      width: 24px;
-      height: 23px;
-    }
-  }
 }
+
+.check-title {
+  color: #0e0e0e;
+  font-size: 28px;
+  font-weight: 600;
+}
+
+.check-subtitle {
+  margin: 26px 0;
+  color: #66676c;
+  font-size: 18px;
+}
+
+.check-btn {
+  margin-bottom: 150px;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 16px 32px;
+  border-radius: 10px;
+  background: #409eff;
+  color: #fff;
+  font-size: 18px;
+  font-weight: 500;
+  cursor: pointer;
+  transition: opacity 0.3s;
+}
+
+.check-btn:hover {
+  opacity: 0.9;
+}
+
+.check-btn-icon {
+  width: 24px;
+  height: 23px;
+}
+
 .dialog-mask {
   position: fixed;
   top: 0;
@@ -320,46 +388,48 @@ onMounted(() => {
   justify-content: center;
   z-index: 999;
 }
-.dialog-success-box{
-  display: flex;
+
+.dialog-success-box {
   width: 574px;
   padding: 50px;
+  display: flex;
   flex-direction: column;
   align-items: center;
   border-radius: 20px;
-  background: #FFF;
-  .dialog-success-img{
-    width: 130px;
-    height: 116px;
-  }
-  .dialog-success-title{
-    margin: 50px auto 30px;
-    color: #0E0E0E;
-    font-size: 22px;
-    font-weight: 600;
-  }
-  .dialog-success-content{
-    margin-bottom: 50px;
-    color:#0E0E0E;
-    font-size: 18px;
-  }
-  .dialog-success-btns{
-    display: flex;
-    justify-content: center;
-    align-items: center;
-  }
-  .dialog-success-btn{
-    padding: 16px 0;
-    border-radius: 10px;
-    cursor: pointer;
-    width: 172px;
-  }
+  background: #fff;
+}
+
+.dialog-success-img {
+  width: 130px;
+  height: 116px;
+}
+
+.dialog-success-title {
+  margin: 50px 0 30px;
+  color: #0e0e0e;
+  font-size: 22px;
+  font-weight: 600;
+}
+
+.dialog-success-content {
+  margin-bottom: 50px;
+  color: #0e0e0e;
+  font-size: 18px;
+  text-align: center;
+}
+
+.dialog-success-btn {
+  padding: 16px 0;
+  border-radius: 10px;
+  width: 172px;
+  cursor: pointer;
+  text-align: center;
+  font-size: 18px;
 }
 
 .confirm {
   background: #409eff;
   color: #fff;
   border: 1px solid #409eff;
-  font-size: 18px;
 }
 </style>
diff --git a/src/components/pc/exam/onlineTest.vue b/src/components/pc/exam/onlineTest.vue
index 29c2729..0415e33 100644
--- a/src/components/pc/exam/onlineTest.vue
+++ b/src/components/pc/exam/onlineTest.vue
@@ -527,454 +527,589 @@ onBeforeUnmount(() => {
 </template>
 
 <style scoped>
-.onlineTest{
+/* 全局重置与基础设置 */
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+.onlineTest {
   background: #F5F5F5;
   width: 100vw;
   height: 100vh;
   font-weight: 400;
   line-height: normal;
-  .ui-joinUs-bg{
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    width: 100%;
-    padding: 20px 30px;
-    margin-bottom: 96px;
-    background: #ffffff;
-    .ui-JoinUs-left-title{
-      color:  #0E0E0E;
-      font-size: 18px;
-      font-style: normal;
-      font-weight: 600;
-      line-height: normal;
-    }
-    .ui-right-user{
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      width: 262px;
-      color: #0E0E0E;
-      .user{
-        font-size: 14px;
-        font-weight: 600;
-        max-width: 100px;
-      }
-      .test-out{
-        display: flex;
-        padding: 8px 16px;
-        justify-content: center;
-        align-items: center;
-        border-radius: 6px;
-        border: 0.5px solid #B2B3B5;
-        background:  #FFF;
-        font-weight: 400;
-        cursor: pointer;
-      }
-    }
-  }
-  .answer-card{
-    position: fixed;
-    left: 336px;
-    top: 85px;
-    width: 183px;
-    height: 840px;
-    padding: 12px;
-    background: #ffffff;
-    .a-c-title{
-      padding: 10px 10px;
-      background: #f5f5f5;
-    }
-    .a-c-default{
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      padding: 0 10px 10px;
-      background: #f5f5f5;
-      margin-bottom: 20px;
-      .default-box{
-        display: flex;
-        align-items: center;
-        .default-box-border{
-          margin-right: 6px;
-          width: 14px;
-          height: 14px;
-          border-radius: 4px;
-          border: 1px solid #DDD;
-        }
-        .default-box-title{
-          font-size: 12px;
-          color: #0E0E0E;
-        }
-        .default-box-border-v2{
-          border-radius: 4px;
-          border: 1px solid var(--3578-f-2, #409EFF);
-          background: var(--color-primary-light-9, #ECF5FF);
-        }
-      }
-    }
-    .a-c-list-title{
-      color: #0E0E0E;
-    }
-    .a-c-list-box{
-      margin-top: 10px;
-      display: flex;
-      align-items: center;
-      flex-wrap: wrap;
-      .a-c-list-box-item{
-        margin-right: 10px;
-        margin-bottom: 10px;
-        width: 23px;
-        height: 23px;
-        border-radius: 3px;
-        border: 0.5px solid #B2B3B5;
-        color: #B2B3B5;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        cursor: pointer;
-        &:nth-child(5n){
-          margin-right: 0;
-        }
-      }
-
-      .a-c-list-box-select{
-        border: 0.5px solid #409EFF;
-        color: #409EFF;
-        background: #ECF5FF;
-      }
-    }
-
-  }
-  .time-card{
-    position: fixed;
-    left: 1432px;
-    top: 85px;
-    width: 183px;
-    height: 840px;
-    padding: 12px;
-    background: #ffffff;
-    text-align: center;
-    .time-card-sub-title{
-      margin: 8px 0;
-      color: #66676C;
-    }
-    .time-card-time {
-      margin-top: 8px;
-      display: flex;
-      align-items: flex-end;
-      justify-content: center;
-      gap: 2px;
-
-      .number {
-        font-size: 24px;
-        color: #FF2946;
-        line-height: 1;
-      }
-      .unit {
-        font-size: 12px;
-        color: #0E0E0E;
-        position: relative;
-        top: -2px;
-      }
-    }
-    .time-card-time-all{
-      margin-top: 8px;
-      color:  #66676C;
-      font-size: 14px;
-      font-style: normal;
-      font-weight: 400;
-      line-height: normal;
-    }
-    .time-card-line{
-      margin: 30px 0;
-      width: 156px;
-      height: 1px;
-      background: rgba(221, 221, 221,.5);
-
-    }
-    .time-card-process{
-      width:156px;
-      height: 4px;
-      border-radius: 10px;
-      background: #EBEBEB;
-    }
-    .time-card-process-v2{
-      width:156px;
-      height: 4px;
-      border-radius: 10px;
-      background: #409EFF;
-    }
-    .time-btn{
-      margin: 30px auto;
-      padding: 16px 30px;
-      width: fit-content;
-      color:#fff;
-      font-size: 18px;
-      border-radius: 6px;
-      border: 0.5px solid #409EFF;
-      background:  #409EFF;
-      cursor: pointer;
-    }
-    .font-size-selector{
-      margin-bottom: 60px;
-      .font-size-line-box{
-        margin-top: 26px;
-        position: relative;
-        .font-size-line{
-          width: 150px;
-          height: 2px;
-          background: #EBEBEB;
-        }
-        .font-size-box{
-          position: absolute;
-          top: -5px;
-          display: flex;
-          justify-content: space-between;
-          width: 100%;
-
-          .font-size-item{
-            display: flex;
-            flex-direction: column;
-            align-items: center;
-            cursor: pointer;
-            .font-size-item-icon{
-              margin-bottom: 6px;
-              width: 12px;
-              height: 12px;
-              background: #ffffff;
-            }
-          }
-        }
-      }
-    }
-  }
-  .answer-box{
-    position: fixed;
-    left: 529px;
-    top: 85px;
-    width: 892px;
-    height: 840px;
-    padding: 12px;
-    background: #ffffff;
-    .answer-scroll{
-      height: 790px;
-      padding-bottom: 30px;
-      overflow-y: auto;
-      scrollbar-width: none; /* Firefox 64+ */
-      -ms-overflow-style: none; /* IE 和 Edge */
-      font-size: 14px;
-    }
-    .answer-scroll::-webkit-scrollbar {
-      display: none;
-    }
-    .answer-box-title{
-      padding: 6px 10px;
-      background: #f5f5f5;
-    }
-  }
-  .ui-title{
-    margin-top: 30px;
-
-  }
-  .ui-answer-list{
-    border-radius: 10px;
-    .ui-answer-list-box{
-      margin-top: 10px ;
-      cursor: pointer;
-      .ui-answer-item{
-        display: flex;
-        align-items: center;
-
-        .ui-check-box{
-          margin-right: 10px;
-          width: 16px;
-          height: 16px;
-          vertical-align: center;
-        }
-        div{
-          display: flex;
-          align-items: center;
-          justify-content: center;
-        }
-      }
-
-    }
-    .ui-answer-list-box:last-child{
-      border-bottom:none;
-    }
-  }
-  .font12{
-    font-size: 12px;
-  }
-  .font14{
-    font-size: 14px;
-  }
-  .dialog-mask {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background: rgba(0, 0, 0, 0.5);
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    z-index: 999;
-  }
-
-  .dialog-box {
-    width: 500px;
-    background: #fff;
-    border-radius: 20px;
-    padding: 50px;
-  }
-
-  .dialog-title {
-    font-size: 22px;
-    font-weight: bold;
-    margin-bottom: 30px;
-  }
-
-  .dialog-content {
-    margin-bottom: 50px;
-    font-size: 18px;
-    color:#0E0E0E;
-  }
-
-  .dialog-btns {
-    display: flex;
-    justify-content: space-between;
-  }
-
-  .dialog-btn {
-    padding: 16px 50px;
-    border-radius: 10px;
-    cursor: pointer;
-  }
-
-  .cancel {
-    border: 1px solid #409EFF;
-    color: #409EFF;
-    background: #fff;
-    font-size: 18px;
-  }
-
-  .confirm {
-    background: #409eff;
-    color: #fff;
-    border: 1px solid #409eff;
-    font-size: 18px;
-  }
-  .dialog-success-box{
-    display: flex;
-    width: 574px;
-    padding: 50px;
-    flex-direction: column;
-    align-items: center;
-    border-radius: 20px;
-    background: #FFF;
-    .dialog-success-img{
-      width: 130px;
-      height: 116px;
-    }
-    .dialog-success-title{
-      margin: 50px auto 30px;
-      color: #0E0E0E;
-      font-size: 22px;
-      font-weight: 600;
-    }
-    .dialog-success-content{
-      margin-bottom: 50px;
-      color:#0E0E0E;
-      font-size: 18px;
-    }
-    .dialog-success-btns{
-      display: flex;
-      justify-content: center;
-      align-items: center;
-    }
-    .dialog-success-btn{
-      padding: 16px 0;
-      border-radius: 10px;
-      cursor: pointer;
-      width: 172px;
-    }
-  }
-  .toast-mask {
-    position: fixed;
-    top: 100px;
-    left: 50%;
-    transform: translateX(-50%);
-    z-index: 1000;
-
-    .toast-box {
-      padding: 12px 24px;
-      background: rgba(231, 245, 224, 0.7);
-      color: #6bc340;
-      border-radius: 4px;
-      font-size: 14px;
-      border: 1px solid #6bc340;
-      animation: fadeInOut 2s;
-    }
-  }
-  .time-warning {
-    position: fixed;
-    top: 0;
-    left: 0;
-    right: 0;
-    padding: 12px;
-    background: #FF2946;
-    color: white;
-    text-align: center;
-    font-size: 16px;
-    font-weight: bold;
-    z-index: 1000;
-    animation: blink 1s infinite alternate;
-  }
-  .loading-spinner {
-    width: 16px;
-    height: 16px;
-    margin-right: 8px;
-    border: 2px solid #fff;
-    border-top-color: transparent;
-    border-radius: 50%;
-    animation: spin 0.8s linear infinite;
-  }
-
-  .dialog-btn, .dialog-success-btn {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-
-    &.disabled {
-      opacity: 0.7;
-      pointer-events: none;
-    }
-  }
-
-  .unselectable {
-    -moz-user-select: -moz-none;
-    -khtml-user-select: none;
-    -webkit-user-select: none;
-    -o-user-select: none;
-    user-select: none;
-  }
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
 }
 
-@keyframes spin {
-  to {
-    transform: rotate(360deg);
-  }
+/* 头部样式 */
+.ui-joinUs-bg {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  width: 100%;
+  padding: 20px 30px;
+  margin-bottom: 96px;
+  background: #ffffff;
+  border-bottom: 1px solid #eee; /* 增加视觉边界 */
 }
+.ui-JoinUs-left-title {
+  color: #0E0E0E;
+  font-size: 18px;
+  font-weight: 600;
+}
+.ui-right-user {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  width: 262px;
+  color: #0E0E0E;
+  gap: 10px;
+}
+.user {
+  font-size: 14px;
+  font-weight: 600;
+  max-width: 100px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.test-out {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  padding: 8px 16px;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  border-radius: 6px;
+  border: 0.5px solid #B2B3B5;
+  background: #FFF;
+  font-weight: 400;
+  cursor: pointer;
+  font-size: 14px;
+}
+
+/* 答题卡面板 */
+.answer-card {
+  position: fixed;
+  left: 336px;
+  top: 85px;
+  width: 183px;
+  height: 840px;
+  padding: 12px;
+  background: #ffffff;
+  border: 1px solid #eee;
+}
+.a-c-title {
+  padding: 10px;
+  background: #f5f5f5;
+  font-weight: bold;
+  font-size: 14px;
+}
+.a-c-default {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding: 0 10px 10px;
+  background: #f5f5f5;
+  margin-bottom: 20px;
+  font-size: 12px;
+  gap:10px;
+}
+.default-box {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  align-items: center;
+  //margin-right: 10px;
+}
+.default-box-border {
+  margin-right: 6px;
+  width: 14px;
+  height: 14px;
+  border-radius: 4px;
+  border: 1px solid #DDD;
+}
+.default-box-title {
+  font-size: 12px;
+  color: #0E0E0E;
+}
+.default-box-border-v2 {
+  border-radius: 4px;
+  border: 1px solid #409EFF; /* 修复：去掉了var */
+  background: #ECF5FF; /* 修复：去掉了var */
+}
+
+/* 题目列表 */
+.a-c-list-title {
+  color: #0E0E0E;
+  font-size: 14px;
+  margin-top: 10px;
+}
+.a-c-list-box {
+  margin-top: 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+
+}
+.a-c-list-box-item {
+  margin-right: 10px;
+  margin-bottom: 10px;
+  width: 23px;
+  height: 23px;
+  border-radius: 3px;
+  border: 0.5px solid #B2B3B5;
+  color: #B2B3B5;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  cursor: pointer;
+  font-size: 12px;
+}
+.a-c-list-box-item:nth-child(5n){
+  margin-right: 0;
+}
+.a-c-list-box-select {
+  border: 0.5px solid #409EFF; /* 修复：去掉了var */
+  color: #409EFF; /* 修复：去掉了var */
+  background: #ECF5FF; /* 修复：去掉了var */
+}
+
+/* 时间卡片面板 */
+.time-card {
+  position: fixed;
+  left: 1432px;
+  top: 85px;
+  width: 183px;
+  height: 840px;
+  padding: 12px;
+  background: #ffffff;
+  text-align: center;
+  border: 1px solid #eee;
+}
+.time-card-sub-title {
+  margin: 8px 0;
+  color: #66676C;
+  font-size: 12px;
+}
+.time-card-time {
+  margin-top: 8px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: end;
+  -webkit-align-items: flex-end;
+  -ms-flex-align: end;
+  align-items: flex-end;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  gap: 2px;
+}
+.number {
+  font-size: 24px;
+  color: #FF2946;
+  line-height: 1;
+}
+.unit {
+  font-size: 12px;
+  color: #0E0E0E;
+  position: relative;
+  top: -2px;
+}
+.time-card-time-all {
+  margin-top: 8px;
+  color: #66676C;
+  font-size: 14px;
+}
+.time-card-line {
+  margin: 30px 0;
+  width: 156px;
+  height: 1px;
+  background: rgba(221, 221, 221, 0.5);
+}
+.time-card-process {
+  width: 156px;
+  height: 4px;
+  border-radius: 10px;
+  background: #EBEBEB;
+  overflow: hidden;
+}
+.time-card-process-v2 {
+  width: 0; /* 默认0，由JS控制 */
+  height: 4px;
+  border-radius: 10px;
+  background: #409EFF; /* 修复：去掉了var */
+  transition: width 0.3s;
+}
+.time-btn {
+  margin: 30px auto;
+  padding: 16px 30px;
+  width: fit-content;
+  color: #fff;
+  font-size: 18px;
+  border-radius: 6px;
+  border: 0.5px solid #409EFF; /* 修复：去掉了var */
+  background: #409EFF; /* 修复：去掉了var */
+  cursor: pointer;
+}
+.font-size-selector {
+  margin: 20px auto;
+  width: 150px;
+}
+.font-size-line-box {
+  margin-top: 26px;
+  position: relative;
+  width: 100%;
+  text-align: center;
+}
+.font-size-line {
+  width: 150px;
+  height: 2px;
+  background: #EBEBEB;
+  margin: 0 auto;
+}
+.font-size-box {
+  position: absolute;
+  top: -5px;
+  left: 0;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  width: 100%;
+}
+.font-size-item {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  cursor: pointer;
+}
+.font-size-item-icon {
+  margin-bottom: 6px;
+  width: 12px;
+  height: 12px;
+  background: #ffffff;
+  border: 1px solid #ddd;
+}
+
+/* 答题区 */
+.answer-box {
+  position: fixed;
+  left: 529px;
+  top: 85px;
+  width: 892px;
+  height: 840px;
+  padding: 12px;
+  background: #ffffff;
+  border: 1px solid #eee;
+}
+.answer-box-title {
+  padding: 6px 10px;
+  background: #f5f5f5;
+  font-weight: bold;
+}
+.answer-scroll {
+  height: 790px;
+  padding-bottom: 30px;
+  overflow-y: auto;
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+  font-size: 14px;
+  border: 1px solid #eee;
+  border-radius: 8px;
+  background: #fff;
+}
+.answer-scroll::-webkit-scrollbar {
+  display: none;
+}
+
+/* 题目样式 */
+.ui-title {
+  margin: 30px 10px 10px;
+  padding: 0 10px;
+  font-size: 16px;
+  color: #333;
+  line-height: 1.5;
+}
+.ui-answer-list {
+  margin: 0 10px;
+  border-radius: 10px;
+}
+.ui-answer-list-box {
+  margin-top: 10px;
+  cursor: pointer;
+}
+.ui-answer-item {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding: 8px 0;
+  border-bottom: 1px dashed #eee;
+}
+.ui-check-box {
+  margin-right: 10px;
+  width: 16px;
+  height: 16px;
+  vertical-align: center;
+}
+
+/* 弹窗样式 (修复了原代码中的语法错误) */
+.dialog-mask {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.5);
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  z-index: 9999;
+}
+.dialog-box {
+  width: 500px;
+  background: #fff;
+  border-radius: 20px;
+  padding: 50px;
+  -webkit-box-shadow: 0 4px 20px rgba(0,0,0,0.1);
+  box-shadow: 0 4px 20px rgba(0,0,0,0.1);
+}
+.dialog-title {
+  font-size: 22px;
+  font-weight: bold;
+  margin-bottom: 30px;
+  color: #333;
+}
+.dialog-content {
+  margin-bottom: 50px;
+  font-size: 18px;
+  color: #0E0E0E;
+  line-height: 1.6;
+}
+.dialog-btns {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+}
+.dialog-btn {
+  padding: 16px 50px;
+  border-radius: 10px;
+  cursor: pointer;
+  border: none;
+  font-size: 18px;
+  font-weight: 500;
+  transition: all 0.2s;
+}
+.cancel {
+  border: 1px solid #409EFF;
+  color: #409EFF;
+  background: #fff;
+}
+.confirm {
+  background: #409EFF; /* 修复：去掉了var */
+  color: #fff;
+  border: 1px solid #409EFF; /* 修复：去掉了var */
+}
+.confirm:hover {
+  background: #337ecc;
+  border-color: #337ecc;
+}
+
+/* Toast 提示 */
+.toast-mask {
+  position: fixed;
+  top: 100px;
+  left: 50%;
+  transform: translateX(-50%);
+  z-index: 10000;
+}
+.toast-box {
+  padding: 12px 24px;
+  background: rgba(231, 245,224, 0.9);
+  color: #6bc340;
+  border-radius: 4px;
+  font-size: 14px;
+  border: 1px solid #6bc340;
+  box-shadow: 0 2px 10px rgba(0,0,0,0.1);
+}
+
+/* 时间警告 */
+.time-warning {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  padding: 12px;
+  background: #FF2946;
+  color: white;
+  text-align: center;
+  font-size: 16px;
+  font-weight: bold;
+  z-index: 10000;
+  animation: blink 1s infinite alternate;
+}
+
+/* 加载动画 (保留关键帧) */
 @keyframes blink {
   from { opacity: 1; }
   to { opacity: 0.8; }
 }
-
-@keyframes fadeInOut {
-  0%,100% { opacity: 0; }
-  20%,80% { opacity: 1; }
+@keyframes spin {
+  to { transform: rotate(360deg); }
 }
 
+/* 修复：将 user-select 单独提取，避免语法错误 */
+.unselectable {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
 
+/* 按钮禁用状态 */
+.dialog-btn.disabled {
+  opacity: 0.6;
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+/* 提交成功弹窗样式 */
+.dialog-success-box {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  width: 574px;
+  padding: 50px;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  border-radius: 20px;
+  background: #FFF;
+  -webkit-box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
+  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
+  text-align: center;
+}
+.dialog-success-img {
+  width: 130px;
+  height: 116px;
+}
+.dialog-success-title {
+  margin: 50px auto 30px;
+  color: #0E0E0E;
+  font-size: 22px;
+  font-weight: 600;
+}
+.dialog-success-content {
+  margin-bottom: 50px;
+  color: #0E0E0E;
+  font-size: 18px;
+  line-height: 1.5;
+}
+.dialog-success-btns {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  width: 100%;
+}
+.dialog-success-btn {
+  padding: 16px 0;
+  border-radius: 10px;
+  cursor: pointer;
+  width: 172px;
+  font-size: 18px;
+  border: none;
+  background: #409EFF;
+  color: #fff;
+  font-weight: 500;
+}
+.dialog-success-btn:hover {
+  background: #337ecc;
+}
 </style>
diff --git a/src/components/pc/exam/reportCard.vue b/src/components/pc/exam/reportCard.vue
index ea29d3f..189f5eb 100644
--- a/src/components/pc/exam/reportCard.vue
+++ b/src/components/pc/exam/reportCard.vue
@@ -1,5 +1,4 @@
 <script setup>
-
 import { onMounted, ref } from 'vue'
 import CustomSelect from '../../CustomSelect.vue'
 import ImageUploader from '../../upload/imageUpload.vue'
@@ -7,20 +6,24 @@ import ImageCropperUpload from '../../upload/ImageCropperUpload.vue'
 import { useRouter } from 'vue-router'
 import request from '@/utils/request.js'
 import { ElMessage } from 'element-plus'
+
 const router = useRouter()
 
-const id = ref('')
+// 强制固定 ID = 1，不修改
+const id = ref('1')
 const loadingStatus = ref(false)
+
 // 用户信息
 const userDetail = ref({
-  user:{}
+  user: {}
 })
 const applyDetail = ref({
-  certificatePhoto:''
+  certificatePhoto: ''
 })
-const showApply = ref(false) // 提交弹窗
+const showApply = ref(false)
 const showErrorMessage = ref('')
 const applyLoading = ref(false)
+
 const cardType = ref([
   { value: '1', label: '居民身份证' },
   { value: '2', label: '台湾居民来往内地通行证' },
@@ -29,10 +32,11 @@ const cardType = ref([
 
 // 联系客服
 const showContact = ref(false)
-const contactLoading = ref(false)
-//提交成功弹窗
+// 提交成功弹窗
 const successModal = ref(false)
 const isSuccessSubmitting = ref(false)
+// 查看证书
+const showCertificate = ref(false)
 
 const successSubmit = () => {
   isSuccessSubmitting.value = true
@@ -46,267 +50,300 @@ const toShowApply = () => {
   showErrorMessage.value = ''
   getUserPhone()
 }
-const getUserPhone = () => {
-  request.get(`go/api/app/user/info/exam/card/photo`)
-    .then(res => {
-      let result = res.data
 
-      applyDetail.value ={
+// 获取证件信息
+const getUserPhone = () => {
+  request.get(`/go/api/app/user/info/exam/card/photo`)
+    .then(res => {
+      const result = res.data || {}
+      applyDetail.value = {
         id: result.id,
-        name: result.name,
+        name: result.name || '',
         idType: '1',
-        idPhoto: result.face,
-        badgePhoto: result.emblem,
-        certificatePhoto: result.cert_photo||'',
+        idPhoto: result.face || '',
+        badgePhoto: result.emblem || '',
+        certificatePhoto: result.cert_photo || '',
       }
-      console.log(applyDetail.value,'applyDetail.value')
       showApply.value = true
     })
-}
-const handApply = () => {
-
-  if (!applyDetail.value.name) {
-    ElMessage({
-      message:  '请输入姓名',
-      type: 'warning',
-      duration: 3 * 1000
+    .catch(() => {
+      ElMessage.warning('获取信息失败')
     })
-    return;
+}
+
+// 提交申请
+const handApply = () => {
+  if (!applyDetail.value.name) {
+    ElMessage.warning('请输入姓名')
+    return
   }
   if (!applyDetail.value.idType) {
-    ElMessage({
-      message:  '请选择证件类型',
-      type: 'warning',
-      duration: 3 * 1000
-    })
-    return;
+    ElMessage.warning('请选择证件类型')
+    return
   }
   if (!applyDetail.value.idPhoto) {
-    ElMessage({
-      message:  '请上传人像照片',
-      type: 'warning',
-      duration: 3 * 1000
-    })
-    return;
+    ElMessage.warning('请上传人像照片')
+    return
   }
   if (!applyDetail.value.badgePhoto) {
-    ElMessage({
-      message:  '请上传徽章面照片',
-      type: 'warning',
-      duration: 3 * 1000
-    })
-    return;
+    ElMessage.warning('请上传徽章面照片')
+    return
   }
   if (!applyDetail.value.certificatePhoto) {
-    ElMessage({
-      message:  '请上传证书照片',
-      type: 'warning',
-      duration: 3 * 1000
-    })
-    return;
+    ElMessage.warning('请上传证书照片')
+    return
   }
-  applyLoading.value = true
 
-  let data = {
-    paper_id: id.value - 0,
-    answer_id: userDetail.value.id - 0,
-    face:applyDetail.value.idPhoto,
-    emblem:applyDetail.value.badgePhoto,
-    card_type:applyDetail.value.idType - 0,
-    nickname:applyDetail.value.name,
-    cert_photo:applyDetail.value.certificatePhoto,
+  applyLoading.value = true
+  const data = {
+    paper_id: 1,
+    answer_id: userDetail.value.id || 0,
+    face: applyDetail.value.idPhoto,
+    emblem: applyDetail.value.badgePhoto,
+    card_type: Number(applyDetail.value.idType),
+    nickname: applyDetail.value.name,
+    cert_photo: applyDetail.value.certificatePhoto,
   }
-  request.post(`go/api/app/user/info/upload/exam/card/photo`,data)
+
+  request.post(`/go/api/app/user/info/upload/exam/card/photo`, data)
     .then(res => {
-      if (res.code == 0){
-        console.log('222')
+      if (res.code === 0) {
         showApply.value = false
         successModal.value = true
+      } else {
+        ElMessage.warning(res.message || '提交失败')
       }
-    }).catch((res) => {
-    showErrorMessage.value = res.message
-  }).finally(() => {
-    applyLoading.value = false
-  })
+    })
+    .catch(res => {
+      showErrorMessage.value = res.message || '提交失败，请重试'
+    })
+    .finally(() => {
+      applyLoading.value = false
+    })
 }
 
-const showCertificate = ref(false)
 const toShowCertificate = () => {
   showCertificate.value = true
 }
+
+// 下载证书（修复跨域）
 const toUpload = (pic) => {
-  let image = new Image()
-  console.log(image,'image---')
-  // 解决跨域 Canvas 污染问题
-  image.setAttribute('crossOrigin', 'anonymous')
-  image.src = pic + '?time=' + new Date().valueOf() //解决跨域
-  console.log('--1--')
+  if (!pic) return
+  const image = new Image()
+  image.crossOrigin = 'anonymous'
+  image.src = pic + '?time=' + new Date().getTime()
+
   image.onload = function () {
-    let canvas = document.createElement('canvas')
+    const canvas = document.createElement('canvas')
     canvas.width = image.width
     canvas.height = image.height
-    let context = canvas.getContext('2d')
-    context.drawImage(image, 0, 0, image.width, image.height)
-    let url = canvas.toDataURL('image/png') //得到图片的base64编码数据
-    let a = document.createElement('a') // 生成一个a元素
-    let event = new MouseEvent('click') // 创建一个单击事件
-    a.download = name || '岗位能力培训证书' // 设置图片名称
-    a.href = url // 将生成的URL设置为a.href属性
-    a.dispatchEvent(event) // 触发a的单击事件
+    const ctx = canvas.getContext('2d')
+    ctx.drawImage(image, 0, 0)
+    const url = canvas.toDataURL('image/png')
+
+    const a = document.createElement('a')
+    a.download = '岗位能力培训证书.png'
+    a.href = url
+    a.click()
   }
 }
+
+// 获取成绩详情
 const getDetail = () => {
-  //
-  request.get(`go/api/app/v2/exam/paper/${id.value}/answer`)
+  request.get(`/go/api/app/v2/exam/paper/${id.value}/answer`)
     .then(res => {
-      let result = res.data
+      const result = res.data || {}
       userDetail.value = result
-      userDetail.value.scoreNum = JSON.parse(result.score).reduce((sum, value) => sum + Number(value), 0);
-      userDetail.value.questionNum = JSON.parse(result.question_id).length;
-      userDetail.value.rightNum = JSON.parse(result.score).filter(item => {
-        return item > 0
-      }).length ;
+
+      // 安全解析分数
+      try {
+        const scoreArr = result.score ? JSON.parse(result.score) : []
+        userDetail.value.scoreNum = scoreArr.reduce((sum, n) => sum + Number(n || 0), 0)
+
+        const questionArr = result.question_id ? JSON.parse(result.question_id) : []
+        userDetail.value.questionNum = questionArr.length
+        userDetail.value.rightNum = scoreArr.filter(i => i > 0).length
+      } catch (e) {
+        userDetail.value.scoreNum = 0
+        userDetail.value.questionNum = 0
+        userDetail.value.rightNum = 0
+      }
+
+      loadingStatus.value = true
+    })
+    .catch(() => {
+      ElMessage.warning('获取成绩失败')
       loadingStatus.value = true
-      console.log(userDetail.value.rightNum,'userDetail.value.rightNum ')
     })
 }
+
 onMounted(() => {
-  id.value = router.currentRoute.value.query.id || '1'
-  if (!localStorage.getItem('answerToken')){
-    router.replace({name:'examGuide'})
+  if (!localStorage.getItem('answerToken')) {
+    router.replace({ name: 'examGuide' })
+    return
   }
   getDetail()
 })
 </script>
 
 <template>
-<div class='ui-report-card' v-if='loadingStatus'>
-  <div class='ui-report-card-box'>
-    <img class='ui-report-card-icon' :src='"https://images.health.ufutx.com/202504/22/449c3253ca2bbed9314d39977a486d0e.png"' alt=''/>
-    <div class='ui-report-card-name'>{{ userDetail.user.name }}</div>
-    <div class='ui-report-card-subTitle'>完成考试《友福身心健康管理师》</div>
-    <div class='ui-report-card-score-box'>
-      <div class='ui-report-card-score'>{{ userDetail.scoreNum }}</div>
-      <div class='ui-report-card-score-sub'>分</div>
-    </div>
-    <div class='ui-report-card-tip'>总得分</div>
-    <div class='ui-report-card-tag' :class='{"ui-report-card-error-tag":userDetail.scoreNum < 60 }'>{{userDetail.scoreNum < 60 ? '考试未通过' : '考试已通过'}}</div>
-    <div class='ui-report-card-list'>
-      <div class='ui-report-card-list-box'>
-        <div class='ui-report-card-list-title'>{{ userDetail.questionNum }}</div>
-        <div class='ui-report-card-list-sub'>考试总题量</div>
+  <div class='ui-report-card' v-if='loadingStatus'>
+    <div class='ui-report-card-box'>
+      <img class='ui-report-card-icon' src="https://images.health.ufutx.com/202504/22/449c3253ca2bbed9314d39977a486d0e.png" alt=""/>
+      <div class='ui-report-card-name'>{{ userDetail.user?.name || '考生' }}</div>
+      <div class='ui-report-card-subTitle'>完成考试《友福身心健康管理师》</div>
+
+      <div class='ui-report-card-score-box'>
+        <div class='ui-report-card-score'>{{ userDetail.scoreNum || 0 }}</div>
+        <div class='ui-report-card-score-sub'>分</div>
       </div>
-      <div class='ui-report-card-list-line'></div>
-      <div class='ui-report-card-list-box'>
-        <div class='ui-report-card-list-title'>{{ userDetail.rightNum }}</div>
-        <div class='ui-report-card-list-sub'>答对题数</div>
+      <div class='ui-report-card-tip'>总得分</div>
+
+      <div class='ui-report-card-tag' :class='{"ui-report-card-error-tag": userDetail.scoreNum < 60 }'>
+        {{ userDetail.scoreNum < 60 ? '考试未通过' : '考试已通过' }}
       </div>
-      <div class='ui-report-card-list-line'></div>
-      <div class='ui-report-card-list-box'>
-        <div class='ui-report-card-list-title'>{{ userDetail.during }}</div>
-        <div class='ui-report-card-list-sub'>用时（分钟）</div>
-      </div>
-    </div>
-    <div class='ui-report-card-btn-box'>
-      <div class='ui-report-card-btn ui-report-card-btn-v1' v-if='userDetail.scoreNum >= 60 && !userDetail.cert_pic ' @click='toShowApply' >申请证书</div>
-      <div class='ui-report-card-btn ui-report-card-btn-v1' v-else-if='userDetail.scoreNum >= 60 ' @click='toShowCertificate' >查看证书</div>
-      <div class='ui-report-card-btn ui-report-card-btn-v2' v-else @click='showContact = true' >重新补考</div>
-    </div>
-  </div>
-  <div class="dialog-mask" v-if="showApply">
-    <div class="dialog-box-apply dialog-box text-center">
-      <div class='ui-dialog-title'>申请证书</div>
-      <div class='ui-dialog-form'>
-        <div class='ui-dialog-item'>
-          <div class='ui-dialog-item-title'>姓名</div>
-          <div class='ui-dialog-input'>
-            <input v-model="applyDetail.name" placeholder="请输入">
-          </div>
+
+      <div class='ui-report-card-list'>
+        <div class='ui-report-card-list-box'>
+          <div class='ui-report-card-list-title'>{{ userDetail.questionNum || 0 }}</div>
+          <div class='ui-report-card-list-sub'>考试总题量</div>
         </div>
-        <div class='ui-dialog-item'>
-          <div class='ui-dialog-item-title'>证件类型</div>
-          <div class='ui-dialog-input'>
-            <CustomSelect
-              v-model="applyDetail.idType"
-              :options="cardType"
+        <div class='ui-report-card-list-line'></div>
+        <div class='ui-report-card-list-box'>
+          <div class='ui-report-card-list-title'>{{ userDetail.rightNum || 0 }}</div>
+          <div class='ui-report-card-list-sub'>答对题数</div>
+        </div>
+        <div class='ui-report-card-list-line'></div>
+        <div class='ui-report-card-list-box'>
+          <div class='ui-report-card-list-title'>{{ userDetail.during || 0 }}</div>
+          <div class='ui-report-card-list-sub'>用时（分钟）</div>
+        </div>
+      </div>
+
+      <div class='ui-report-card-btn-box'>
+        <div
+          class='ui-report-card-btn ui-report-card-btn-v1'
+          v-if='userDetail.scoreNum >= 60 && !userDetail.cert_pic'
+          @click='toShowApply'
+        >
+          申请证书
+        </div>
+        <div
+          class='ui-report-card-btn ui-report-card-btn-v1'
+          v-else-if='userDetail.scoreNum >= 60'
+          @click='toShowCertificate'
+        >
+          查看证书
+        </div>
+        <div
+          class='ui-report-card-btn ui-report-card-btn-v2'
+          v-else
+          @click='showContact = true'
+        >
+          重新补考
+        </div>
+      </div>
+    </div>
+
+    <!-- 申请证书弹窗 -->
+    <div class="dialog-mask" v-if="showApply">
+      <div class="dialog-box dialog-box-apply text-center">
+        <div class='ui-dialog-title'>申请证书</div>
+        <div class='ui-dialog-form'>
+          <div class='ui-dialog-item'>
+            <div class='ui-dialog-item-title'>姓名</div>
+            <div class='ui-dialog-input'>
+              <input v-model="applyDetail.name" placeholder="请输入">
+            </div>
+          </div>
+          <div class='ui-dialog-item'>
+            <div class='ui-dialog-item-title'>证件类型</div>
+            <div class='ui-dialog-input'>
+              <CustomSelect v-model="applyDetail.idType" :options="cardType"/>
+            </div>
+          </div>
+          <div class='ui-dialog-item'>
+            <div class='ui-dialog-item-title'>上传证件照</div>
+            <ImageUploader
+              v-model="applyDetail.idPhoto"
+              background-image="https://images.health.ufutx.com/202504/23/5baaefcd47d0023d2fedf72ce0d33703.png"
             />
+            <div class='ui-dialog-upload-tip'>上传人像照</div>
+          </div>
+          <div class='ui-dialog-item'>
+            <div class='ui-dialog-item-title'></div>
+            <ImageUploader
+              v-model="applyDetail.badgePhoto"
+              background-image="https://images.health.ufutx.com/202504/23/e4294660d559b4e6db6466946df4dcd0.png"
+            />
+            <div class='ui-dialog-upload-tip'>上传徽章面</div>
+          </div>
+          <div class='ui-dialog-item'>
+            <div class='ui-dialog-item-title'>上传证书照</div>
+            <ImageCropperUpload
+              v-model="applyDetail.certificatePhoto"
+              :dimension="{ width: '230px', height: '144px' }"
+            />
+            <div class='ui-dialog-upload-tip'>二寸蓝底或白底，用于证书制作</div>
           </div>
         </div>
-        <div class='ui-dialog-item'>
-          <div class='ui-dialog-item-title'>上传证件照</div>
-          <ImageUploader v-model="applyDetail.idPhoto"  background-image="https://images.health.ufutx.com/202504/23/5baaefcd47d0023d2fedf72ce0d33703.png" />
-          <div class='ui-dialog-upload-tip'>上传人像照</div>
-        </div>
-        <div class='ui-dialog-item'>
-          <div class='ui-dialog-item-title'></div>
-          <ImageUploader v-model="applyDetail.badgePhoto"  background-image="https://images.health.ufutx.com/202504/23/e4294660d559b4e6db6466946df4dcd0.png" />
-          <div class='ui-dialog-upload-tip'>上传徽章面</div>
-        </div>
-        <div class='ui-dialog-item'>
-          <div class='ui-dialog-item-title'>上传证书照</div>
-          <ImageCropperUpload
-            v-model="applyDetail.certificatePhoto"
-            :dimension="{ width: '230px', height: '144px' }"
-          />
-          <div class='ui-dialog-upload-tip'>二寸蓝底或是白底，用于证书制作</div>
-        </div>
-      </div>
-<!--      <div class='ui-error-message' v-if='showErrorMessage'>{{showErrorMessage}}</div>-->
-      <div class="dialog-btns">
-        <div class="dialog-btn cancel" @click="showApply = false">取消</div>
-        <div class="dialog-btn confirm" @click="handApply" :class="{disabled: applyLoading}">
-          <div class="loading-spinner" v-if="applyLoading"></div>
-          {{ applyLoading ? '提交中...' : '确认申请' }}
+
+        <div class='ui-error-message' v-if='showErrorMessage'>{{ showErrorMessage }}</div>
+        <div class="dialog-btns">
+          <div class="dialog-btn cancel" @click="showApply = false">取消</div>
+          <div class="dialog-btn confirm" @click="handApply" :class="{disabled: applyLoading}">
+            <div class="loading-spinner" v-if="applyLoading"></div>
+            {{ applyLoading ? '提交中...' : '确认申请' }}
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div class="dialog-mask" v-if="showContact">
-    <div class="dialog-box-contact dialog-box text-center">
-      <div class='ui-dialog-contact-title'>重新补考</div>
-      <div class='ui-dialog--subtitle'>请联系客户 咨询重新补考</div>
-      <div class='ui-dialog-contact-box'>
-        <img class='ui-dialog-contact-icon' src='https://images.health.ufutx.com/202504/23/d2da9ca501b8e0fdcd68113bc5dec2f8.png' alt='' />
-        <div class='ui-dialog-contact-sub'>微信扫码&nbsp;添加客服</div>
+
+    <!-- 联系客服 -->
+    <div class="dialog-mask" v-if="showContact">
+      <div class="dialog-box dialog-box-contact text-center">
+        <div class='ui-dialog-contact-title'>重新补考</div>
+        <div class='ui-dialog--subtitle'>请联系客服咨询重新补考</div>
+        <div class='ui-dialog-contact-box'>
+          <img class='ui-dialog-contact-icon' src='https://images.health.ufutx.com/202504/23/d2da9ca501b8e0fdcd68113bc5dec2f8.png' alt=''/>
+          <div class='ui-dialog-contact-sub'>微信扫码 添加客服</div>
+        </div>
+        <svg @click='showContact = false' class='ui-dialog-contact-cancel' xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" fill="none">
+          <path opacity="0.3" d="M17 34C26.3888 34 34 26.3888 34 17C34 7.61116 26.3888 0 17 0C7.61116 0 0 7.61116 0 17C0 26.3888 7.61116 34 17 34Z" fill="black"/>
+          <path d="M10.0006 9.95806C10.2271 9.74375 10.5827 9.74741 10.8048 9.96633L24.1111 23.0836C24.3235 23.2929 24.3259 23.6348 24.1166 23.8471C24.1122 23.8515 24.1077 23.8559 24.1032 23.8603C23.8766 24.0746 23.521 24.0709 23.299 23.852L9.99262 10.7347C9.7803 10.5254 9.77785 10.1836 9.98716 9.97123C9.99157 9.96676 9.99605 9.96237 10.0006 9.95806Z" fill="white" stroke-width="0.85"/>
+          <path d="M24.0016 9.95806C23.7751 9.74375 23.4195 9.74741 23.1974 9.96633L9.89105 23.0836C9.67873 23.2929 9.67628 23.6348 9.88559 23.8471C9.89 23.8515 9.89448 23.8559 9.89904 23.8603C10.1256 24.0746 10.4811 24.0709 10.7032 23.852L24.0096 10.7347C24.2219 10.5254 24.2243 10.1836 24.015 9.97123C24.0106 9.96676 24.0061 9.96237 24.0016 9.95806Z" fill="white" stroke-width="0.85"/>
+        </svg>
       </div>
-      <svg @click='showContact = false' class='ui-dialog-contact-cancel' xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" fill="none">
-        <path opacity="0.3" d="M17 34C26.3888 34 34 26.3888 34 17C34 7.61116 26.3888 0 17 0C7.61116 0 0 7.61116 0 17C0 26.3888 7.61116 34 17 34Z" fill="black"/>
-        <path fill-rule="evenodd" clip-rule="evenodd" d="M10.0006 9.95806C10.2271 9.74375 10.5827 9.74741 10.8048 9.96633L24.1111 23.0836C24.3235 23.2929 24.3259 23.6348 24.1166 23.8471C24.1122 23.8515 24.1077 23.8559 24.1032 23.8603C23.8766 24.0746 23.521 24.0709 23.299 23.852L9.99262 10.7347C9.7803 10.5254 9.77785 10.1836 9.98716 9.97123C9.99157 9.96676 9.99605 9.96237 10.0006 9.95806Z" fill="white" stroke="white" stroke-width="0.85"/>
-        <path fill-rule="evenodd" clip-rule="evenodd" d="M24.0016 9.95806C23.7751 9.74375 23.4195 9.74741 23.1974 9.96633L9.89105 23.0836C9.67873 23.2929 9.67628 23.6348 9.88559 23.8471C9.89 23.8515 9.89448 23.8559 9.89904 23.8603C10.1256 24.0746 10.4811 24.0709 10.7032 23.852L24.0096 10.7347C24.2219 10.5254 24.2243 10.1836 24.015 9.97123C24.0106 9.96676 24.0061 9.96237 24.0016 9.95806Z" fill="white" stroke="white" stroke-width="0.85"/>
-      </svg>
     </div>
-  </div>
-  <div class="dialog-mask" v-if="successModal">
-    <div class="dialog-success-box text-center">
-      <img src="https://images.health.ufutx.com/202504/17/2ee13769aa745d646d4951179ade3419.png" alt="" class="dialog-success-img" />
-      <div class="dialog-success-title">温馨提示</div>
-      <div class="dialog-success-content">
-        证书申请已提交，预计等待20个工作日
-      </div>
-      <div class="dialog-success-btns">
-        <!--          <div class="dialog-btn cancel" @click="dialogTableVisible = false">继续答题</div>-->
-        <div class="dialog-success-btn confirm" @click="successSubmit" :class="{disabled: isSuccessSubmitting}">
-          <div class="loading-spinner" v-if="isSuccessSubmitting"></div>
-          {{ isSuccessSubmitting ? '正在退出...' : '好的' }}
+
+    <!-- 提交成功 -->
+    <div class="dialog-mask" v-if="successModal">
+      <div class="dialog-success-box text-center">
+        <img src="https://images.health.ufutx.com/202504/17/2ee13769aa745d646d4951179ade3419.png" alt="" class="dialog-success-img"/>
+        <div class="dialog-success-title">温馨提示</div>
+        <div class="dialog-success-content">证书申请已提交，预计等待20个工作日</div>
+        <div class="dialog-success-btns">
+          <div class="dialog-success-btn confirm" @click="successSubmit" :class="{disabled: isSuccessSubmitting}">
+            <div class="loading-spinner" v-if="isSuccessSubmitting"></div>
+            {{ isSuccessSubmitting ? '正在退出...' : '好的' }}
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div class='dialog-mask' v-if='showCertificate' @click='showCertificate=false'>
-    <div class='dialog-img-box'>
-      <img class='img-style' :src='userDetail.cert_pic' alt=''>
-<!--      <svg xmlns="http://www.w3.org/2000/svg" width="140" height="42" viewBox="0 0 140 42" fill="none" class='img-upload'>-->
-<!--        <path d="M10.714 12.7152C13.292 5.66848 19.9709 0.960233 27.4742 0.900207L140 0V42H0L10.714 12.7152Z" fill="black" fill-opacity="0.8"/>-->
-<!--      </svg>-->
-      <img @click.stop='toUpload(userDetail.cert_pic)' src='https://images.health.ufutx.com/202505/27/6121f956eb6b839f12a2be7586506da2.png' class='img-upload' alt='' />
-      <svg  @click='showCertificate = false' class='ui-dialog-contact-cancel' xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" fill="none">
-        <path opacity="0.3" d="M17 34C26.3888 34 34 26.3888 34 17C34 7.61116 26.3888 0 17 0C7.61116 0 0 7.61116 0 17C0 26.3888 7.61116 34 17 34Z" fill="black"/>
-        <path fill-rule="evenodd" clip-rule="evenodd" d="M10.0006 9.95806C10.2271 9.74375 10.5827 9.74741 10.8048 9.96633L24.1111 23.0836C24.3235 23.2929 24.3259 23.6348 24.1166 23.8471C24.1122 23.8515 24.1077 23.8559 24.1032 23.8603C23.8766 24.0746 23.521 24.0709 23.299 23.852L9.99262 10.7347C9.7803 10.5254 9.77785 10.1836 9.98716 9.97123C9.99157 9.96676 9.99605 9.96237 10.0006 9.95806Z" fill="white" stroke="white" stroke-width="0.85"/>
-        <path fill-rule="evenodd" clip-rule="evenodd" d="M24.0015 9.95806C23.7749 9.74375 23.4194 9.74741 23.1973 9.96633L9.89093 23.0836C9.67861 23.2929 9.67616 23.6348 9.88547 23.8471C9.88987 23.8515 9.89436 23.8559 9.89892 23.8603C10.1254 24.0746 10.481 24.0709 10.7031 23.852L24.0095 10.7347C24.2218 10.5254 24.2242 10.1836 24.0149 9.97123C24.0105 9.96676 24.006 9.96237 24.0015 9.95806Z" fill="white" stroke="white" stroke-width="0.85"/>
-      </svg>
+
+    <!-- 查看证书 -->
+    <div class='dialog-mask' v-if='showCertificate' @click.self='showCertificate=false'>
+      <div class='dialog-img-box'>
+        <img class='img-style' :src='userDetail.cert_pic' alt="证书">
+        <img @click.stop='toUpload(userDetail.cert_pic)' src='https://images.health.ufutx.com/202505/27/6121f956eb6b839f12a2be7586506da2.png' class='img-upload' alt="下载"/>
+        <svg @click='showCertificate = false' class='ui-dialog-contact-cancel' xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" fill="none">
+          <path opacity="0.3" d="M17 34C26.3888 34 34 26.3888 34 17C34 7.61116 26.3888 0 17 0C7.61116 0 0 7.61116 0 17C0 26.3888 7.61116 34 17 34Z" fill="black"/>
+          <path d="M10.0006 9.95806C10.2271 9.74375 10.5827 9.74741 10.8048 9.96633L24.1111 23.0836C24.3235 23.2929 24.3259 23.6348 24.1166 23.8471C24.1122 23.8515 24.1077 23.8559 24.1032 23.8603C23.8766 24.0746 23.521 24.0709 23.299 23.852L9.99262 10.7347C9.7803 10.5254 9.77785 10.1836 9.98716 9.97123C9.99157 9.96676 9.99605 9.96237 10.0006 9.95806Z" fill="white" stroke-width="0.85"/>
+          <path d="M24.0015 9.95806C23.7749 9.74375 23.4194 9.74741 23.1973 9.96633L9.89093 23.0836C9.67861 23.2929 9.67616 23.6348 9.88547 23.8471C9.88987 23.8515 9.89436 23.8559 9.89892 23.8603C10.1254 24.0746 10.481 24.0709 10.7031 23.852L24.0095 10.7347C24.2218 10.5254 24.2242 10.1836 24.0149 9.97123C24.0105 9.96676 24.006 9.96237 24.0015 9.95806Z" fill="white" stroke-width="0.85"/>
+        </svg>
+      </div>
     </div>
   </div>
-</div>
 </template>
 
 <style scoped>
@@ -318,390 +355,316 @@ onMounted(() => {
   justify-content: center;
   font-weight: 400;
   line-height: normal;
-
-  .ui-report-card-box{
-    width: 852px;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    .ui-report-card-icon{
-      width: 100px;
-      height: 100px;
-      border-radius: 50%;
-    }
-    .ui-report-card-name{
-      margin: 10px 0;
-      font-size: 18px;
-      font-weight: 600;
-      color:#0E0E0E;
-    }
-    .ui-report-card-subTitle{
-      font-size: 16px;
-      color:#66676C;
-    }
-    .ui-report-card-score-box{
-      display: flex;
-      align-items: flex-end;
-      margin: 60px 0 0;
-      font-size: 30px;
-      font-weight: 600;
-      color:#0E0E0E;
-      .ui-report-card-score{
-        font-size: 80px;
-        line-height: 80px;
-      }
-    }
-    .ui-report-card-tip{
-      margin: 10px 0;
-      color:#66676C;
-      font-size: 16px;
-    }
-    .ui-report-card-tag{
-      display: flex;
-      width: 343px;
-      padding: 10px 0px;
-      justify-content: center;
-      align-items: center;
-      font-size: 16px;
-      font-weight: 500;
-      color: #18CA6E;
-      background: linear-gradient(90deg, rgba(24, 202, 110, 0.00) 0%, rgba(24, 202, 110, 0.10) 50%, rgba(24, 202, 110, 0.00) 100%);
-    }
-    .ui-report-card-error-tag{
-      color: #FF2946;
-      background: linear-gradient(90deg, rgba(255, 41, 70, 0.00) 0%, rgba(255, 41, 70, 0.10) 50%, rgba(255, 41, 70, 0.00) 100%);;
-    }
-    .ui-report-card-list{
-      margin: 60px;
-      width: 488px;
-      display: flex;
-      padding: 20px 80px;
-      justify-content: space-between;
-      align-items: center;
-      background: #FAFAFA;
-
-      .ui-report-card-list-box{
-        display: flex;
-        flex-direction: column;
-        justify-content: center;
-        align-items: center;
-        color:#66676C;
-        font-size: 16px;
-        .ui-report-card-list-title{
-          color:  #0E0E0E;
-          font-size: 40px;
-          font-style: normal;
-          font-weight: 600;
-          line-height: normal;
-        }
-      }
-      .ui-report-card-list-line{
-        width: 1px;
-        height: 28.5px;
-        background:  #DDD;
-      }
-    }
-    .ui-report-card-btn-box{
-      margin-bottom: 100px;
-    }
-    .ui-report-card-btn{
-      margin-bottom: 20px;
-      display: flex;
-      height: 57px;
-      padding: 16px 50px;
-      flex-direction: column;
-      align-items: center;
-      border-radius: 10px;
-      font-size: 18px;
-      cursor: pointer;
-    }
-    .ui-report-card-btn-v1{
-      letter-spacing: 1px;
-      background:  #409EFF;
-      color: #ffffff
-    }
-    .ui-report-card-btn-v2{
-      color: #409EFF;
-      border: 0.5px solid  #409EFF;
-    }
-  }
-  .dialog-mask {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background: rgba(0, 0, 0, 0.7);
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    z-index: 999;
-  }
-
-  .dialog-box {
-    width: 500px;
-    background: #fff;
-    border-radius: 20px;
-    padding: 50px 70px;
-    box-sizing: content-box;
-  }
-  .dialog-box-apply{
-    width: 480px;
-  }
-  .dialog-box-contact {
-    position: relative;
-    width: 288px;
-    padding: 50px 80px;
-    .ui-dialog-contact-title{
-      color:  #0E0E0E;
-      text-align: center;
-      font-size: 22px;
-      font-style: normal;
-      font-weight: 600;
-      line-height: normal;
-    }
-    .ui-dialog--subtitle{
-      margin: 10px  0 20px;
-      color: #66676C;
-      text-align: center;
-      font-size: 14px;
-      font-style: normal;
-      line-height: normal;
-    }
-    .ui-dialog-contact-box{
-      display: flex;
-      padding: 20px;
-      flex-direction: column;
-      align-items: center;
-      border-radius: 20px;
-      background: #F5F5F5;
-      .ui-dialog-contact-icon{
-        width: 236px;
-        height: 236px;
-        flex-shrink: 0;
-        aspect-ratio: 1/1;
-      }
-      .ui-dialog-contact-sub{
-        margin-top: 20px;
-        color:  #0E0E0E;
-        text-align: center;
-        font-size: 14px;
-        font-style: normal;
-        font-weight: 400;
-        line-height: normal;
-      }
-    }
-    .ui-dialog-contact-cancel{
-      position: absolute;
-      bottom:-64px;
-      left: 50%;
-      transform: translateX(-50%);
-      width:34px;
-      height: 34px;
-      cursor: pointer;
-    }
-  }
-  .ui-dialog-title{
-    margin-bottom: 50px;
-    color: #0E0E0E;
-    text-align: center;
-    font-size: 22px;
-    font-style: normal;
-    font-weight: 600;
-    line-height: normal;
-    height:22px;
-  }
-  .ui-dialog-form{
-    display: flex;
-    flex-wrap: wrap;
-    .ui-dialog-item{
-      margin-right: 20px;
-      margin-bottom: 30px;
-      display: flex;
-      flex-direction: column;
-      align-items: flex-start;
-      &:nth-child(2n){
-        margin-right:0;
-      }
-      .ui-dialog-item-title{
-        margin-bottom: 12px;
-        font-size: 14px;
-        font-weight: bold;
-        color: #0e0e0e;
-        height: 14px;
-      }
-      .ui-dialog-input{
-      //margin-top: 6px;
-        width: 230px;
-
-        input {
-          width: 100%;
-          height: 56px;
-          padding: 0 15px;
-          border: 1px solid #B2B3B5; /* 默认黑色边框 */
-          border-radius: 10px;
-          font-size: 14px;
-          /* 去除输入框默认样式 */
-          -webkit-appearance: none;
-          outline: none;
-          /* 隐藏数字输入框箭头 */
-          &[type="number"] {
-            -moz-appearance: textfield;
-            &::-webkit-outer-spin-button,
-            &::-webkit-inner-spin-button {
-              -webkit-appearance: none;
-              margin: 0;
-            }
-          }
-          &:focus {
-            border-color: #79BBFF; /* 输入时边框颜色 */
-          }
-        }
-      }
-      .ui-dialog-upload-tip{
-        margin-top: 6px;
-        font-size: 14px;
-        color: #66676C;
-      }
-      /* 新增聚焦状态 */
-      .ui-dialog-input select:focus {
-        border-color: #79BBFF;
-        outline: none;
-      }
-
-      /* 新增选项样式 */
-      .ui-dialog-input option {
-        padding: 20px;
-        font-size: 14px;
-      }
-    }
-
-  }
-  .ui-error-message{
-    margin-bottom: 6px;
-    font-size: 14px;
-    font-weight: bold;
-    color: #FF2946;
-    height: 14px;
-  }
-  .dialog-btns {
-    display: flex;
-    justify-content: center;
-  }
-
-  .dialog-btn {
-    padding: 16px 50px;
-    border-radius: 10px;
-    cursor: pointer;
-    min-width: 72px;
-    box-sizing: content-box;
-  }
-
-  .cancel {
-    margin-right: 30px;
-    border: 1px solid #409EFF;
-    color: #409EFF;
-    background: #fff;
-    font-size: 18px;
-  }
-
-  .confirm {
-    background: #409eff;
-    color: #fff;
-    border: 1px solid #409eff;
-    font-size: 18px;
-  }
-  .dialog-btn, .dialog-success-btn {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-
-    &.disabled {
-      opacity: 0.7;
-      pointer-events: none;
-    }
-  }
-  .loading-spinner {
-    width: 16px;
-    height: 16px;
-    margin-right: 8px;
-    border: 2px solid #fff;
-    border-top-color: transparent;
-    border-radius: 50%;
-    animation: spin 0.8s linear infinite;
-  }
-  .dialog-success-box{
-    display: flex;
-    width: 574px;
-    padding: 50px;
-    flex-direction: column;
-    align-items: center;
-    border-radius: 20px;
-    background: #FFF;
-    .dialog-success-img{
-      width: 130px;
-      height: 116px;
-    }
-    .dialog-success-title{
-      margin: 50px auto 30px;
-      color: #0E0E0E;
-      font-size: 22px;
-      font-weight: 600;
-    }
-    .dialog-success-content{
-      margin-bottom: 50px;
-      color:#0E0E0E;
-      font-size: 18px;
-    }
-    .dialog-success-btns{
-      display: flex;
-      justify-content: center;
-      align-items: center;
-    }
-    .dialog-success-btn{
-      padding: 16px 0;
-      border-radius: 10px;
-      cursor: pointer;
-      width: 172px;
-    }
-  }
-  .dialog-img-box{
-    position: relative;
-    width: fit-content;
-
-    .img-style{
-      width: 100%;
-      height: 860px;
-      object-fit: cover;
-      //border-radius: 16px;
-    }
-    .img-upload{
-      position: absolute;
-      right: 0px;
-      bottom: 0;
-      width: 140px;
-      height: 42px;
-      flex-shrink: 0;
-      cursor: pointer;
-      //border-radius: 0 0 16px 0;
-    }
-  }
-  .ui-dialog-contact-cancel{
-    position: absolute;
-    top:0;
-    right: -64px;
-    width:34px;
-    height: 34px;
-    cursor: pointer;
-  }
-
-  @keyframes spin {
-    to {
-      transform: rotate(360deg);
-    }
-  }
+}
+.ui-report-card-box{
+  width: 852px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+.ui-report-card-icon{
+  width: 100px;
+  height: 100px;
+  border-radius: 50%;
+}
+.ui-report-card-name{
+  margin: 10px 0;
+  font-size: 18px;
+  font-weight: 600;
+  color:#0E0E0E;
+}
+.ui-report-card-subTitle{
+  font-size: 16px;
+  color:#66676C;
+}
+.ui-report-card-score-box{
+  display: flex;
+  align-items: flex-end;
+  margin: 60px 0 0;
+  font-size: 30px;
+  font-weight: 600;
+  color:#0E0E0E;
+}
+.ui-report-card-score{
+  font-size: 80px;
+  line-height: 80px;
+}
+.ui-report-card-tip{
+  margin: 10px 0;
+  color:#66676C;
+  font-size: 16px;
+}
+.ui-report-card-tag{
+  display: flex;
+  width: 343px;
+  padding: 10px 0;
+  justify-content: center;
+  align-items: center;
+  font-size: 16px;
+  font-weight: 500;
+  color: #18CA6E;
+  background: linear-gradient(90deg, rgba(24,202,110,0) 0%, rgba(24,202,110,0.1) 50%, rgba(24,202,110,0) 100%);
+}
+.ui-report-card-error-tag{
+  color: #FF2946;
+  background: linear-gradient(90deg, rgba(255,41,70,0) 0%, rgba(255,41,70,0.1) 50%, rgba(255,41,70,0) 100%);
+}
+.ui-report-card-list{
+  margin: 60px;
+  width: 488px;
+  display: flex;
+  padding: 20px 80px;
+  justify-content: space-between;
+  align-items: center;
+  background: #FAFAFA;
+}
+.ui-report-card-list-box{
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  color:#66676C;
+  font-size: 16px;
+}
+.ui-report-card-list-title{
+  color: #0E0E0E;
+  font-size: 40px;
+  font-weight: 600;
+}
+.ui-report-card-list-line{
+  width: 1px;
+  height: 28.5px;
+  background: #DDD;
+}
+.ui-report-card-btn-box{
+  margin-bottom: 100px;
+}
+.ui-report-card-btn{
+  margin-bottom: 20px;
+  display: flex;
+  height: 57px;
+  padding: 16px 50px;
+  flex-direction: column;
+  align-items: center;
+  border-radius: 10px;
+  font-size: 18px;
+  cursor: pointer;
+}
+.ui-report-card-btn-v1{
+  background: #409EFF;
+  color: #fff;
+}
+.ui-report-card-btn-v2{
+  color: #409EFF;
+  border: 0.5px solid #409EFF;
+}
+.dialog-mask {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0,0,0,0.7);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 999;
+}
+.dialog-box {
+  position: relative; /* 确保内部绝对定位基于此 */
+  background: #fff;
+  border-radius: 20px;
+  padding: 50px; /* 统一内边距，不要用70px */
+  box-sizing: border-box; /* 关键：防止padding撑开宽度 */
+}
+.dialog-box-apply{
+  width: 720px;
+}
+.dialog-box-contact {
+  //width: 288px; /* 固定宽度 */
+  padding: 50px 50px; /* 左右留白更美观 */
+  text-align: center;
+}
+.ui-dialog-contact-title {
+  color: #0E0E0E;
+  font-size: 22px;
+  font-weight: 600;
+  margin-bottom: 10px;
 }
 
+.ui-dialog--subtitle {
+  color: #66676C;
+  font-size: 14px;
+  margin-bottom: 20px;
+}
 
+.ui-dialog-contact-box {
+  display: inline-block; /* 改为行内块，让宽度自适应内容 */
+  padding: 20px 50px;
+  border-radius: 20px;
+  background: #F5F5F5;
+}
+
+.ui-dialog-contact-icon {
+  width: 236px;
+  height: 236px;
+  display: block; /* 去除默认空隙 */
+}
+
+.ui-dialog-contact-sub {
+  margin-top: 20px;
+  color: #0E0E0E;
+  font-size: 14px;
+}
+.ui-dialog-contact-cancel{
+  position: absolute;
+  bottom: -48px; /* 调整到合理位置 */
+  left: 50%;
+  transform: translateX(-50%);
+  width: 34px;
+  height: 34px;
+  cursor: pointer;
+  background: rgba(0, 0, 0, 0.3); /* 增加背景方便点击 */
+  border-radius: 50%;
+  padding: 5px;
+}
+.ui-dialog-title{
+  margin-bottom: 50px;
+  font-size: 22px;
+  font-weight: 600;
+  color: #0E0E0E;
+  text-align: center;
+}
+.ui-dialog-form{
+  display: flex;
+  flex-wrap: wrap;
+}
+.ui-dialog-item{
+  margin-right: 20px;
+  margin-bottom: 30px;
+}
+.ui-dialog-item:nth-child(2n){
+  margin-right: 0;
+}
+.ui-dialog-item-title{
+  margin-bottom: 12px;
+  font-size: 14px;
+  font-weight: bold;
+  color: #0e0e0e;
+  height: 14px;
+  text-align: left;
+}
+.ui-dialog-input{
+  width: 230px;
+}
+.ui-dialog-input input{
+  width: 100%;
+  height: 56px;
+  padding: 0 15px;
+  border: 1px solid #B2B3B5;
+  border-radius: 10px;
+  font-size: 14px;
+  outline: none;
+}
+.ui-dialog-input input:focus{
+  border-color: #79BBFF;
+}
+.ui-dialog-upload-tip{
+  margin-top: 6px;
+  font-size: 14px;
+  color: #66676C;
+  text-align: left;
+}
+.ui-error-message{
+  margin-bottom: 6px;
+  font-size: 14px;
+  color: #FF2946;
+  text-align: center;
+}
+.dialog-btns {
+  display: flex;
+  justify-content: center;
+}
+.dialog-btn {
+  padding: 16px 50px;
+  border-radius: 10px;
+  cursor: pointer;
+}
+.cancel {
+  margin-right: 30px;
+  border: 1px solid #409EFF;
+  color: #409EFF;
+  background: #fff;
+}
+.confirm {
+  background: #409eff;
+  color: #fff;
+}
+.dialog-btn.disabled {
+  opacity: 0.7;
+  pointer-events: none;
+}
+.loading-spinner {
+  width: 16px;
+  height: 16px;
+  margin-right: 8px;
+  border: 2px solid #fff;
+  border-top-color: transparent;
+  border-radius: 50%;
+  animation: spin 0.8s linear infinite;
+}
+.dialog-success-box{
+  width: 574px;
+  padding: 50px;
+  background: #fff;
+  border-radius: 20px;
+  text-align: center;
+}
+.dialog-success-img{
+  width: 130px;
+  height: 116px;
+}
+.dialog-success-title{
+  margin: 50px 0 30px;
+  font-size: 22px;
+  font-weight: 600;
+  color: #0E0E0E;
+}
+.dialog-success-content{
+  margin-bottom: 50px;
+  font-size: 18px;
+  color: #0E0E0E;
+}
+.dialog-success-btn{
+  padding: 16px 0;
+  border-radius: 10px;
+  width: 172px;
+  cursor: pointer;
+  background: #409eff;
+  color: #fff;
+}
+.dialog-img-box{
+  position: relative;
+}
+.img-style{
+  height: 860px;
+  object-fit: cover;
+}
+.img-upload{
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  width: 140px;
+  height: 42px;
+  cursor: pointer;
+}
+.dialog-img-box .ui-dialog-contact-cancel{
+  top: 0;
+  right: -64px;
+  bottom: auto;
+  left: auto;
+  transform: none;
+}
+@keyframes spin {
+  to { transform: rotate(360deg) }
+}
 </style>
diff --git a/src/components/upload/imageUpload.vue b/src/components/upload/imageUpload.vue
index 64aaa51..d9b7be1 100644
--- a/src/components/upload/imageUpload.vue
+++ b/src/components/upload/imageUpload.vue
@@ -149,7 +149,7 @@ const triggerUpload = () => {
 .upload-btn {
   position: relative;
   width: 230px;
-  height: 144px;
+  height: 154px;
   background-size: contain;  /* 新增背景图适配 */
   background-repeat: no-repeat;
 }
diff --git a/src/utils/request.js b/src/utils/request.js
index edbb3c2..c872914 100644
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -16,7 +16,7 @@ const openFullScreen2 = () => {
 }
 
 const service = axios.create({
-  baseURL: window.location.href.includes('//www.ufutx.com') ? 'https://health.ufutx.com/' :'http://health.ufutx.net/',
+  baseURL: window.location.href.includes('//www.ufutx.com') ? 'https://health.ufutx.com/' :'https://health.ufutx.com/',
   timeout: 8000,
   withCredentials: false,
   headers: {