微信授权

src/api/index.ts

@@ -1,6 +1,66 @@
 import { http } from '@/utils/request';
 
 
+/**
+ * 获取微信授权 URL
+ * @param {string} baseUrl - 授权后跳转的 URL（需后端处理）
+ * @param {string} scope - 授权作用域（如 snsapi_userinfo）
+ * @returns {Promise<string>} 返回微信授权 URL
+ */
+export async function getCode(baseUrl = window.location.href, scope = 'snsapi_userinfo') {
+  try {
+    const response = await http.get('/h5/wechat/code', {
+      params: { baseUrl, scope } // 传递参数给后端
+    });
+    console.log(response)
+    // 处理可能的 redirect: 前缀（兼容后端直接返回 URL 或 redirect:URL）
+    let authUrl = response.result;
+    if (typeof authUrl === 'string' && authUrl.startsWith('redirect:')) {
+      authUrl = authUrl.substring('redirect:'.length).trim();
+    }
+
+    // 直接返回授权 URL，由前端控制跳转
+    return authUrl;
+   
+  } catch (error) {
+    console.error('获取微信授权 URL 失败:', error);
+    throw error;
+  }
+}
+export async function getUserInfo(code,state) {
+  try {
+    const response = await http.get('/h5/wechat/auth', {
+      params: { code,state } // 传递参数给后端
+    });
+    console.log(response)
+    // 处理可能的 redirect: 前缀（兼容后端直接返回 URL 或 redirect:URL）
+    //let authUrl = response.result;
+    //if (typeof authUrl === 'string' && authUrl.startsWith('redirect:')) {
+    //  authUrl = authUrl.substring('redirect:'.length).trim();
+    //}
+    return response;
+  } catch (error) {
+    console.error('获取微信授权 URL 失败:', error);
+    throw error;
+  }
+}
+export async function AutocheckUser(openId) {
+  try {
+    const response = await http.post('/h5/wechat/AutocheckUser', 
+      { openId }, // JSON 数据
+      {
+        headers: {
+          'Content-Type': 'application/json' // 明确指定 JSON 格式
+        }
+      }
+    );
+    return response.result;
+  } catch (error) {
+    console.error('用户检查失败:', error);
+    throw error;
+  }
+}
+
 // 获取访问时间段
 export async function getAccessTime() {
   const response = await http.get('/h5/cees/ceesUser/getH5Time');
@@ -109,5 +169,6 @@ export function waiTeacherSave(data) {
     userName: data.userName,
     phone: data.phone,
     userId: data.userId,
+    openId: data.openId,
   });
 }

src/router/index.ts

@@ -1,10 +1,9 @@
-import { createRouter, createWebHashHistory, Router } from 'vue-router';
+import { createRouter, createWebHistory, Router } from 'vue-router';
-import {getAccessTime} from '@/api/index';
 import routes from './routes';
-import {showDialog } from 'Vant';
+
 
 const router: Router = createRouter({
-  history: createWebHashHistory(import.meta.env.BASE_URL),
+  history: createWebHistory(import.meta.env.BASE_URL),
   routes: routes,
 });
 

src/router/routes.ts

@@ -66,6 +66,15 @@ export const routes = [
           border: false,
         },
       },
+      {
+        name: 'wx',
+        path: '/wx',
+        component: () => import('@/views/wechatOauth/index.vue'),
+        meta: {
+          title: '哈尔滨师范大学评卷报名系统',
+          border: false,
+        },
+      },
     ],
   },
   // 匹配不到重定向会主页

src/store/index.ts

@@ -18,8 +18,10 @@ interface UserState {
   user: User | null; // 用户信息
   userId: string; // 用户 ID
   openId: string; // 微信 OpenID
+  unionId:string;// 微信 unionId
   groupId: number; // 用户组 ID
   major: number; // 专业 ID
+  
 }
 
 // 定义并导出 useUserStore
@@ -30,6 +32,7 @@ export const useUserStore = defineStore('user', {
     user: null,
     userId: '',
     openId: '',
+    unionId:'',
     groupId: 0,
     major: 0,
   }),
@@ -42,6 +45,8 @@ export const useUserStore = defineStore('user', {
     LoginUser: (state) => state.user,
     // 获取 OpenID
     getOpenId: (state) => state.openId,
+    // 获取 OpenID
+    getunionId: (state) => state.unionId,
     // 获取用户 ID
     getUserId: (state) => state.userId,
     // 获取专业 ID
@@ -79,6 +84,13 @@ export const useUserStore = defineStore('user', {
     setOpenId(openId: string) {
       this.openId = openId;
     },
+    /**
+     * 设置 unionId
+     * @param unionId - 微信 unionId
+     */
+    setunionId(unionId: string) {
+      this.unionId = unionId;
+    },
 
     /**
      * 设置用户 ID

src/utils/request/index.ts

@@ -3,8 +3,8 @@ import { showToast } from 'vant';
 
 // 创建 axios 实例
 const service: AxiosInstance = axios.create({
-  //baseURL: 'http://62.234.217.137:10001/jeecg-boot', // 基础 URL
+  baseURL: 'http://62.234.217.137:10001/jeecg-boot', // 基础 URL
-  baseURL: 'http://localhost:10001/jeecg-boot', // 基础 URL
+  //baseURL: 'http://localhost:10001/jeecg-boot', // 基础 URL
   withCredentials: false, // 是否携带跨域凭证
   timeout: 10000, // 请求超时时间
 });

src/views/home/index.vue

@@ -1,20 +1,11 @@
 <template>
   <div class="main-page">
-    <div class="hrbun">
+        <img class="text1" src="@/assets/Ui/首页/评卷管理系统.svg" alt="" />
-      <img src="@/assets/orangeUi/hrbun.svg" alt="" />
+        <div class="code">
-    </div>
+          <img class="sbm" src="@/assets/Ui/首页/请输入身份识别码.svg" alt="" />
-
+          <input class="input-code" @wheel="isNotWheel" type="number" v-model="inputCode" />
-    <div class="code">
+          <img class="dl" @click="login" src="@/assets/Ui/首页/登入.svg" alt="" />
-      <img class="text1" src="@/assets/orangeUi/shouyewenzi.svg" alt="" />
+        </div>
-      <img class="sbm" src="@/assets/orangeUi/input.svg" alt="" />
-      <input class="input-code" @wheel="isNotWheel" type="number" v-model="inputCode" />
-      <img class="dl" @click="login" src="@/assets/orangeUi/button.svg" alt="" />
-    </div>
-
-    <div class="footer">
-      <img src="@/assets/orangeUi/footer_cg.svg" alt="" />
-    </div>
-
     <van-dialog
       v-model:show="myShowDialog"
       confirmButtonColor="#8D2328"
@@ -37,10 +28,10 @@
 </template>
 
 <script setup lang="ts">
-  import { onMounted, ref } from 'vue';
+  import { onMounted, ref, } from 'vue';
   import { useRouter } from 'vue-router';
-  import { showDialog,showNotify, showConfirmDialog } from 'vant';
+  import { showDialog,showNotify, showConfirmDialog,showFailToast } from 'vant';
-  import { getAccessTime,getMajor, checkUser } from '@/api';
+  import { getAccessTime,getMajor, checkUser,getCode, getUserInfo,AutocheckUser } from '@/api';
   import { useUserStore } from '@/store';
 
 
@@ -51,6 +42,19 @@
   const loading = ref(false); // 控制加载状态
   const show = ref(false); // 控制显示状态
   const myShowDialog = ref(false); // 控制提示对话框的显示
+  const code = ref(''); 
+  const state = ref('');
+  const userInfo = reactive({
+      city: '',
+      country: '',
+      headimgurl: '',
+      nickname: '',
+      openid: '',
+      privilege: [],
+      province: '',
+      sex: '',
+      unionid: ''
+  });
 
   /**
    * 阻止输入框的滚轮事件
@@ -66,6 +70,7 @@
   onMounted(() => {
     // 初始化逻辑，例如获取URL中的参数等
     myShowDialog.value = false; // 初始化时不显示提示对话框
+    handleAuth();
   });
 
   /**
@@ -79,7 +84,31 @@
 async function login() {
     loading.value = true;
     show.value = true;
+    const code = inputCode.value.toString();
+    // 验证顺序：先检查空值，再检查长度
+    if (!code) {
+      showConfirmDialog({
+        allowHtml: true,
+        confirmButtonColor: '#8D2328',
+        message: '身份码不能为空',
+      });
+      //showNotify({ type: 'danger', message: '身份码不能为空' });
+      //showFailToast('身份码不能为空');
+      loading.value = false;
+      return;
+    }
 
+    if (code.length !== 8) {
+      showConfirmDialog({
+        title: '请输入8位身份码',
+        allowHtml: true,
+        confirmButtonColor: '#8D2328',
+      });
+      //showNotify({ type: 'danger', message: '请输入8位身份码' });
+      //showToast({ type: 'fail', message: '身份码不能为空' });
+      loading.value = false;
+      return;
+    }
     if (!accessChecked) {
         try {
             const res = await getAccessTime();
@@ -137,30 +166,7 @@ async function login() {
 
     // 验证身份码长度
     const code = inputCode.value.toString();
-    // 验证顺序：先检查空值，再检查长度
-    if (!code) {
-      showConfirmDialog({
-        allowHtml: true,
-        confirmButtonColor: '#8D2328',
-        message: '身份码不能为空',
-      });
-      //showNotify({ type: 'danger', message: '身份码不能为空' });
-      //showFailToast('身份码不能为空');
-      loading.value = false;
-      return;
-    }
     
-    if (code.length !== 8) {
-      showConfirmDialog({
-        title: '请输入8位身份码',
-        allowHtml: true,
-        confirmButtonColor: '#8D2328',
-      });
-      //showNotify({ type: 'danger', message: '请输入8位身份码' });
-      //showToast({ type: 'fail', message: '身份码不能为空' });
-      loading.value = false;
-      return;
-    }
 
     // 模拟获取学科信息
     const majors = [
@@ -321,27 +327,121 @@ async function login() {
             .catch(() => {});
         }
       }
+   
     });
   }
+  //微信网页授权
+  async function handleAuth(){
+        try {
+          // 1. 获取微信授权URL
+            const response = await getCode().catch(err => {
+            throw new Error(`API请求失败: ${err.message}`);
+          });
+          // 2. 处理可能的URL格式问题
+          let authUrl = (response || '').toString().trim();
+          authUrl = authUrl.replace(/\s+/g, ''); // 删除所有空格
+          authUrl = authUrl.replace(/^redirect:/i, ''); // 去除redirect:前缀
+          // 3. 验证URL有效性
+          console.log(authUrl)
+          if (!authUrl || !/^https:\/\/open\.weixin\.qq\.com/.test(authUrl)) {
+            throw new Error(`无效的授权URL: ${authUrl}`);
+          }
+          const local = window.location.href;
+          console.log("local",local)
+          if(local.indexOf("?code") >= 0){
+            code.value = getUrlParams(new URL(local)).code;
+            state.value = getUrlParams(new URL(local)).state
+            console.log(code.value)
+            if (code.value) {
+              getUserData(code.value,state.value);
+            }
+          }else {
+            // 4. 执行重定向
+            window.location.assign(authUrl);
+          }
+        } catch (error) {
+          console.error('授权流程错误:', error);
+          // 5. 用户友好的错误提示
+          showFailToast(error.message || '微信授权失败');
+        } finally {
+
+        }
+
+    };
+      // 获取URL参数
+    function getUrlParams(url) {
+      const params = new URLSearchParams(url.search)
+      const map = {};
+      for (let param of params.entries()){
+        map[param[0]] = param[1];
+      }
+      console.log(map)
+      return map;
+    };
+
+    // 获取用户信息
+    async function getUserData(code,state) {
+      try {
+        // 这里调用后端接口获取用户信息
+        const response = await getUserInfo(code,state);
+        const userData = response.result.userInfo;
+        console.log(userData,"data")
+        userInfo.city = userData.city;
+        userInfo.country = userData.country;
+        userInfo.headimgurl = userData.headimgurl;
+        userInfo.nickname = userData.nickname;
+        userInfo.openid = userData.openid;
+        userInfo.privilege = userData.privilege;
+        userInfo.province = userData.province;
+        userInfo.sex = userData.sex;
+        userInfo.unionid = userData.unionid;
+        console.log("userInfo",userInfo)
+        store.setOpenId(userInfo.openid)
+        store.setunionId(userInfo.unionid)
+        console.log('store',store)
+        AutocheckUser(store.getOpenId)
+            .then(response => {
+              // 处理成功返回的数据
+              console.log('接口返回数据:', response);
+              console.log('OpenId',store.getOpenId)
+              if(response.message == ''){
+                const data = response.result;
+                console.log(data,'data')
+                store.login(data.user)
+                store.setUserId(data.user.userId)
+                router.push(data.router)
+              }else{
+                router.push(response.message)
+              }
+            })
+          .catch(error => {
+              // 处理错误
+              console.error('接口请求失败:', error);
+        });
+
+      } catch (error) {
+        showFailToast('获取用户信息失败');
+        console.error(error);
+      } finally {
+
+      }
+    };
 </script>
 
 <style scoped lang="scss">
   .main-page {
     height: 100vh;
     width: 100vw;
-    background: url('@/assets/orangeUi/bj5.svg') no-repeat;
+    background: url('@/assets/Ui/首页/背景.svg') no-repeat;
     background-size: cover;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center; // 垂直居中
+    background-position: center center; /* 图片顶部对齐 */
   }
-
   .hrbun {
     width: 90%;
-    //display: flex;
-    //justify-content: center;
-    //align-items: center;
 
     img {
       width: 100%;
@@ -354,43 +454,39 @@ async function login() {
     flex-direction: column;
     align-items: center;
     gap: 10px; // 减少组件之间的间距
-
+    margin-top: 200px;
-    .text1 {
-      width: 90%;
-    }
 
     .sbm {
-      width: 90%;
+      width: 70%;
+      margin-bottom: 20px;
     }
 
     .input-code {
       text-align: center;
       font-size: 35px;
-      height: 2.5rem;
+      height: 3.5rem;
-      width: 80%;
+      width: 100%;
       opacity: 1;
       color: rgba(237, 75, 54, 0.6);
-      font-weight: 600;
+      background-image: url('@/assets/Ui/首页/文本框.svg');
-      border-radius: 132px;
+      background-size: 100% 120%;
-      background: rgba(255, 255, 255, 1), rgba(255, 255, 255, 1);
+      background-repeat: no-repeat;
-      //border: 4px solid rgba(141, 35, 40, 0.6);
+      border: none;
-      border: 4px solid rgba(237, 75, 54, 0.6);
+      background-color: transparent;
-      box-shadow:
-        0px 0px 0px rgba(0, 0, 0, 0.1),
-        0px 3px 7px rgba(0, 0, 0, 0.1),
-        0px 12px 12px rgba(0, 0, 0, 0.09),
-        0px 27px 16px rgba(0, 0, 0, 0.05),
-        0px 47px 19px rgba(0, 0, 0, 0.01),
-        0px 74px 21px rgba(0, 0, 0, 0);
     }
 
     .dl {
       width: 50%;
-      margin-top: 2vh;
       cursor: pointer;
+      margin-right: 10px;
+
     }
   }
-
+  .text1 {
+      width: 90%;
+      margin-top: 160px;
+      margin-bottom: 230px;
+  }
   .footer {
     width: 90%;
     display: flex;
@@ -432,4 +528,7 @@ async function login() {
   input[type='number'] {
     -moz-appearance: textfield;
   }
+  .img{
+
+  }
 </style>

src/views/leaderShip.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="main-container">
     <div class="hsd-title">
-      <img src="@/assets/orangeUi/logo.svg" alt="" />
+      <img src="../assets/Ui/log.svg"  style="height: 40px;padding-top: 30px;"/>
     </div>
     <div class="main-text">
       <div class="main-page">
@@ -32,7 +32,11 @@
       <div class="main-item">
         <van-row>
           <van-col span="8">
-            <img @click="show1 = true" src="../assets/imgs/ditu.svg" alt="" />
+            <img @click="show1 = true"  src="../assets/Ui/信息界面/图标/评卷地图.svg" alt="" style="width: 43px;height: 43px; border: 2px solid rgba(255, 255, 255, 0.3); /* 白色半透明边框（0.7 透明度） */
+            border-radius: 12px; /* 圆角 */
+            padding: 8px; /* 内边距 */
+            background: rgba(255, 255, 255, 0.1); /* 透明背景 */
+            transition: all 0.2s; /* 悬停过渡效果 */"/>
             <div class="ditu-img" v-if="show1">
               <span @click="show1 = false"> 关闭&ensp;✕ </span>
               <div class="card-img">
@@ -43,7 +47,11 @@
           </van-col>
 
           <van-col span="8">
-            <img @click="show6 = true" src="@/assets/imgs/xysh.svg" alt="" />
+            <img @click="show6 = true" src="../assets/Ui/信息界面/图标/校园生活.svg" alt="" style="width: 43px;height: 43px; border: 2px solid rgba(255, 255, 255, 0.3); /* 白色半透明边框（0.7 透明度） */
+            border-radius: 12px; /* 圆角 */
+            padding: 8px; /* 内边距 */
+            background: rgba(255, 255, 255, 0.1); /* 透明背景 */
+            transition: all 0.2s; /* 悬停过渡效果 */"/>
             <div class="xysh-img" v-if="show6">
               <span @click="show6 = false"> 关闭&ensp;✕ </span>
             </div>
@@ -51,11 +59,15 @@
           </van-col>
 
           <van-col span="8">
-            <img @click="show7 = true" src="../assets/imgs/zhixie.svg" alt="" />
+            <img @click="show7 = true" src="../assets/Ui/信息界面/图标/致谢.svg" alt="" style="width: 43px;height: 43px; border: 2px solid rgba(255, 255, 255, 0.3); /* 白色半透明边框（0.7 透明度） */
+            border-radius: 12px; /* 圆角 */
+            padding: 8px; /* 内边距 */
+            background: rgba(255, 255, 255, 0.1); /* 透明背景 */
+            transition: all 0.2s; /* 悬停过渡效果 */"/>
             <div class="zhixie-img" v-if="show7">
               <span @click="show7 = false"> 关闭&ensp;✕ </span>
               <div class="card-img">
-                <img src="@/assets/orangeUi/zhixie.jpg" style="width: 100%; height: 100%" />
+                <img src="@/assets/Ui/致谢.png" style="width: 100%; height: 100%" />
               </div>
             </div>
             <p>致谢</p>
@@ -63,9 +75,9 @@
         </van-row>
       </div>
     </div>
-    <div class="footer">
+    <!--<div class="footer">
       <img class="bot-img" src="@/assets/orangeUi/index_footer.svg" />
-    </div>
+    </div>-->
   </div>
 </template>
 <script setup lang="ts">
@@ -140,10 +152,9 @@
   .main-container {
     height: 100vh;
     width: 100vw;
-    background: url('@/assets/orangeUi/bj5.svg') no-repeat;
+    background: url('@/assets/Ui/信息/个人信息/背景.svg') no-repeat;
     background-size: cover;
-    //display: flex;
+    background-position: center center; /* 图片顶部对齐 */
-    //flex-direction: column;
     align-items: center;
     justify-content: space-between;
     .hsd-title {
@@ -310,4 +321,16 @@
       }
     }
   }
+  .head-cg {
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+
+    img {
+      width: 50%;
+      margin-top: 5vh;
+      margin-bottom: 2vh;
+    }
+  }
 </style>

src/views/localStudent.vue

@@ -1,12 +1,15 @@
 <template>
   <div class="father">
-    <van-cell-group inset class="mar-auto15">
+    <!--<van-cell-group inset class="mar-auto15">
       <van-field class="van-field__label_rectangle" label-width="400px" label="哈尔滨师范大学评卷信息填报" type="hidden" />
-    </van-cell-group>
+    </van-cell-group>-->
 
     <van-form @submit="onSubmit">
+      <div class="head-cg">
+          <img src="@/assets/Ui/信息/个人信息/个人信息.svg" />
+        </div>
       <van-cell-group inset>
-        <van-field border class="van-field__label1——circle" label-width="400px" label="个人信息" type="hidden" />
+        <!--<van-field border class="van-field__label1——circle" label-width="400px" label="个人信息" type="hidden" />-->
         <van-field
           v-model="student.userName"
           name="userName"
@@ -14,7 +17,14 @@
           type="text"
           placeholder="请输入姓名"
           :rules="[{ validator: userName, message: '请正确输入姓名' }]"
-        />
+        >
+        <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/个人信息/图标/姓名.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
+      </van-field>
         <van-field
           v-model="student.studentId"
           name="studentId"
@@ -22,7 +32,14 @@
           type="text"
           placeholder="请输入学号"
           :rules="[{ validator: stuNum, message: '请输入正确学号' }]"
-        />
+        >
+        <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/个人信息/图标/工号.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
+      </van-field>
         <van-field
           v-model="student.phone"
           name="phone"
@@ -30,7 +47,14 @@
           type="number"
           placeholder="请输入手机号"
           :rules="[{ validator: phoneNum, message: '请正确输入手机号' }]"
-        />
+        >
+        <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/个人信息/图标/手机号.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
+      </van-field>
         <van-field label-width="150px" class="van-rad" name="status" label="是否第一次参加阅卷">
           <template #input>
             <van-radio-group checked-color="#8D2328" v-model="student.checked" direction="horizontal">
@@ -103,6 +127,9 @@
   .father {
     height: 100vh;
     background-color: #efefef;
+    background-image: url('@/assets/Ui/信息/个人信息/背景.svg');
+    background-repeat: no-repeat;
+    background-size: cover; /* 修改这里 */
   }
 
   .mar-auto15 {
@@ -143,4 +170,16 @@
     background-color: #8d2328;
     border-radius: 50%;
   }
+  .head-cg {
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+
+    img {
+      width: 50%;
+      margin-top: 5vh;
+      margin-bottom: 2vh;
+    }
+  }
 </style>

src/views/localTeacher.vue

@@ -1,11 +1,14 @@
 <template>
   <div class="father">
-    <van-cell-group inset class="mar-auto15">
+    <!--<van-cell-group inset class="mar-auto15">
       <van-field class="van-field__label_rectangle" label-width="400px" label="哈尔滨师范大学评卷信息填报" type="hidden" />
-    </van-cell-group>
+    </van-cell-group>-->
     <van-form @submit="onSubmit">
+      <div class="head-cg">
+          <img src="@/assets/Ui/信息/个人信息/个人信息.svg" />
+        </div>
       <van-cell-group inset>
-        <van-field class="van-field__label1——circle" label-width="400px" label="个人信息" type="hidden" />
+        <!--<van-field class="van-field__label1——circle" label-width="400px" label="个人信息" type="hidden" />-->
         <van-field
           v-model="teacher.userName"
           name="userName"
@@ -13,7 +16,14 @@
           type="text"
           placeholder="请输入姓名"
           :rules="[{ validator: userName, message: '请正确输入姓名' }]"
-        />
+        >
+        <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/个人信息/图标/姓名.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
+      </van-field>
         <van-field
           v-model="teacher.teacherId"
           name="studentId"
@@ -21,7 +31,12 @@
           type="text"
           placeholder="请输入工号"
           :rules="[{ required: true, message: '请输入工号' }]"
-        />
+        >
+        <template #left-icon>
+              <img src= "../assets/Ui/信息/个人信息/图标/工号.svg"
+                    style="width: 16px; height: 16px;"/>
+          </template>
+      </van-field>
         <van-field
           v-model="teacher.phone"
           name="phone"
@@ -29,7 +44,14 @@
           type="number"
           placeholder="请输入手机号"
           :rules="[{ validator: phoneNum, message: '请正确输入手机号' }]"
-        />
+        >
+        <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/个人信息/图标/手机号.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
+      </van-field>
         <van-field label-width="150px" class="van-rad" name="status" label="是否第一次参加阅卷">
           <template #input>
             <van-radio-group checked-color="#8D2328" v-model="teacher.checked" direction="horizontal">
@@ -103,6 +125,8 @@
   .father {
     height: 100vh;
     background-color: #efefef;
+    background: url('@/assets/Ui/信息/个人信息/背景.svg') no-repeat;
+    background-size: cover;
   }
 
   .mar-auto15 {
@@ -142,4 +166,16 @@
     background-color: #8d2328;
     border-radius: 50%;
   }
+  .head-cg {
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+
+    img {
+      width: 50%;
+      margin-top: 5vh;
+      margin-bottom: 2vh;
+    }
+  }
 </style>

src/views/mainPage.vue

@@ -1,17 +1,18 @@
 <template>
   <div class="main-container">
     <div class="hsd-title">
-      <img src="@/assets/orangeUi/logo.svg" />
+          <img src="../assets/Ui/log.svg"  style="height: 40px;padding-top: 30px;"/>
     </div>
+
     <div class="head-cg">
-      <img src="@/assets/orangeUi/cg.svg" />
+      <img src="@/assets/Ui/信息界面/报名成功.svg" style="margin-top: -20px; margin-bottom: 20px;"/>
     </div>
     <div class="main-content">
       <div class="main-text">
-        {{ userInfo.userName }}，您已成功报名！
+        {{ userInfo.userName }}，您已成功报名!
-        <p>
+        <p style="margin-top: 18px;">
           感谢您参与本次
-          <em style="font-style: normal; color: red; font-weight: 700">{{ getUserInfo(userInfo.majorId) }}</em> 学科评卷工作！
+          <em style="font-style: normal; color: white; font-weight: 700">{{ getUserInfo(userInfo.majorId) }}</em> 学科评卷工作!
         </p>
       </div>
     </div>
@@ -19,7 +20,14 @@
       <div class="main-item">
         <van-row wrap>
           <van-col span="6" v-if="showIcon.show0">
-            <img @click="show0 = true" src="../assets/imgs/my.svg" alt="" />
+            <img @click="show0 = true" src="../assets/Ui/信息界面/图标/个人信息.svg" alt="" 
+            style=" height: 43px; width: 43px;
+    border: 2px solid rgba(255, 255, 255, 0.3); /* 白色半透明边框（0.7 透明度） */
+    border-radius: 12px; /* 圆角 */
+    padding: 8px; /* 内边距 */
+    background: rgba(255, 255, 255, 0.1); /* 透明背景 */
+    transition: all 0.2s; /* 悬停过渡效果 */
+  "/>
             <van-dialog
               title="个人信息"
               :overlayStyle="{ background: 'rgba(0, 0, 0, 0.8)' }"
@@ -37,7 +45,12 @@
                       name="userName"
                       label="姓名"
                       type="text"
-                    />
+                    >
+                    <template #left-icon>
+                      <img src= "../assets/Ui/信息/个人信息/图标/姓名.svg"
+                      style="width: 16px; height: 16px;"/>
+                    </template>
+                  </van-field>
                     <van-field
                       readonly
                       style="height: 35px; line-height: 100%"
@@ -50,6 +63,11 @@
                     <template #right-icon>
                         <van-icon class="icon" :name="showIdentityId ? 'eye-o' : 'closed-eye'"  @click="toggleIdentityId"/>
                     </template>
+                    <template #left-icon>
+                      <img src= "../assets/Ui/信息/个人信息/图标/身份证号.svg"
+                      style="width: 16px; height: 16px;"/>
+                    </template>
+                 
                     </van-field>
                     <!--                   <van-field-->
                     <!--                       style="height: 35px; line-height: 100%"-->
@@ -80,6 +98,11 @@
                     <template #right-icon>
                         <van-icon class="icon" :name="showphone ? 'eye-o' : 'closed-eye'" @click="togglephone"/>
                     </template>
+                    <template #left-icon>
+                      <img src= "../assets/Ui/信息/个人信息/图标/手机号.svg"
+                      style="width: 16px; height: 16px;"/>
+                    </template>
+                 
                   </van-field>
                     <van-field
                       style="height: 35px; line-height: 100%"
@@ -88,7 +111,12 @@
                       readonly
                       name="picker"
                       label="职称"
-                    />
+                    >
+                    <template #left-icon>
+                      <img src= "../assets/Ui/信息/个人信息/图标/职称.svg"
+                      style="width: 16px; height: 16px;"/>
+                    </template>
+                  </van-field>
                     <van-field
                       style="height: 35px; line-height: 100%"
                       readonly
@@ -97,7 +125,12 @@
                       name="office"
                       label="职务"
                       type="text"
-                    />
+                    >
+                    <template #left-icon>
+                      <img src= "../assets/Ui/信息/个人信息/图标/职务.svg"
+                      style="width: 16px; height: 16px;"/>
+                    </template>
+                  </van-field>
                     <van-field
                       style="height: 35px; line-height: 100%"
                       readonly
@@ -106,7 +139,12 @@
                       name="workName"
                       label="单位名称"
                       type="text"
-                    />
+                    >
+                    <template #left-icon>
+                      <img src= "../assets/Ui/信息/个人信息/图标/单位名称.svg"
+                      style="width: 16px; height: 16px;"/>
+                    </template>
+                  </van-field>
                     <van-field
                       style="height: 35px; line-height: 100%"
                       readonly
@@ -115,7 +153,12 @@
                       name="workPhoen"
                       label="单位电话"
                       type="text"
-                    />
+                    >
+                    <template #left-icon>
+                      <img src= "../assets/Ui/信息/个人信息/图标/单位电话.svg"
+                      style="width: 16px; height: 16px;"/>
+                    </template>
+                  </van-field>
                     <van-field
                       style="height: 35px; line-height: 100%"
                       v-if="userInfo.pyCard"
@@ -128,6 +171,10 @@
                     <template #right-icon>
                         <van-icon class="icon" :name="showpyCard ? 'eye-o' : 'closed-eye'" @click="togglepyCard"/>
                     </template>
+                    <template #left-icon>
+                      <img src= "../assets/Ui/信息/劳务信息/图标/银行卡号.svg"
+                      style="width: 16px; height: 16px;"/>
+                    </template>
                   </van-field>
 
                     <van-field
@@ -138,7 +185,12 @@
                       name="bankAddress"
                       label="开户所在地"
                       type="text"
-                    />
+                    >
+                    <template #left-icon>
+                      <img src= "../assets/Ui/信息/劳务信息/图标/开户银行所在地.svg"
+                      style="width: 16px; height: 16px;"/>
+                    </template>
+                  </van-field>
                     <van-field
                       style="height: 35px; line-height: 100%"
                       readonly
@@ -147,7 +199,12 @@
                       name="bankName"
                       label="开户行"
                       type="text"
-                    />
+                    >
+                    <template #left-icon>
+                      <img src= "../assets/Ui/信息/劳务信息/图标/开户银行.svg"
+                      style="width: 16px; height: 16px;"/>
+                    </template>
+                  </van-field>
                     <van-field
                       style="height: 35px; line-height: 100%"
                       readonly
@@ -157,7 +214,12 @@
                       label="车牌号"
                       type="text"
                       height="40px"
-                    />
+                    >
+                    <template #left-icon>
+                      <img src= "../assets/Ui/信息/确认信息/图标/车牌.svg"
+                      style="width: 16px; height: 16px;"/>
+                    </template>
+                  </van-field>
                     <van-field
                       name="dormitoryStatus"
                       v-if="userInfo.dormitoryStatus === 1"
@@ -177,6 +239,11 @@
                           {{ userInfo.dormitoryStatus === 1 ? '是' : '否' }}
                         </van-radio-group>
                       </template>
+                      <template #left-icon>
+                      <img src= "../assets/Ui/信息/确认信息/图标/住宿.svg"
+                      style="width: 16px; height: 16px;"/>
+                    </template>
+                  
                     </van-field>
                     <van-field
                       v-if="userInfo.studentId"
@@ -187,7 +254,14 @@
                       label="学号"
                       type="text"
                       height="40px"
-                    />
+                    >
+                    <template #left-icon>
+                <img 
+                    src= "@/assets/Ui/信息/个人信息/图标/工号.svg"
+                    style="width: 16px; height: 16px;"
+                  />
+                  </template>
+                  </van-field>
                     <van-field
                       v-if="userInfo.teacherId"
                       style="height: 35px; line-height: 100%"
@@ -197,7 +271,12 @@
                       label="工号"
                       type="text"
                       height="40px"
-                    />
+                    >
+                    <template #left-icon>
+                      <img src= "../assets/Ui/信息/个人信息/图标/工号.svg"
+                      style="width: 16px; height: 16px;"/>
+                    </template>
+                  </van-field>
                     <van-field
                       v-if="userInfo.mealCard"
                       style="height: 35px; line-height: 100%"
@@ -214,33 +293,49 @@
 
               <span class="dialog-close-content" @click="show0 = false, showIdentityId = false, showphone = false , showpyCard =false ">×</span>
             </van-dialog>
-            <p>我的信息</p>
+            <p style="color: white;">个人信息</p>
           </van-col>
 
           <van-col span="6" v-if="showIcon.show1">
-            <img @click="show1 = true" src="../assets/imgs/ditu.svg" alt="" />
+            <img @click="show1 = true" src="../assets/Ui/信息界面/图标/师大地图.svg" alt=""  style="width: 43px;height: 43px;
+            border: 2px solid rgba(255, 255, 255, 0.3); /* 白色半透明边框（0.7 透明度） */
+            border-radius: 12px; /* 圆角 */
+            padding: 8px; /* 内边距 */
+            background: rgba(255, 255, 255, 0.1); /* 透明背景 */
+            transition: all 0.2s; /* 悬停过渡效果 */
+            "/>
             <div class="ditu-img" v-if="show1">
               <span @click="show1 = false"> 关闭&ensp;✕ </span>
               <div class="card-img">
                 <img src="@/assets/orangeUi/ditu.jpg" style="width: 100%; height: 100%" alt="师大地图" />
               </div>
             </div>
-            <p>师大地图</p>
+            <p style="color: white;">师大地图</p>
           </van-col>
 
-          <van-col span="6" v-if="showIcon.show2">
+          <!-- <van-col span="6" v-if="showIcon.show2">
-            <img @click="show2 = true" src="@/assets/imgs/txz.svg" alt="" />
+            <img @click="show2 = true" src="../assets/Ui/信息界面/图标/通行证.svg" alt="" style="height: 43px;width: 43px;border: 2px solid rgba(255, 255, 255, 0.3); /* 白色半透明边框（0.7 透明度） */
+            border-radius: 12px; /* 圆角 */
+            padding: 8px; /* 内边距 */
+            background: rgba(255, 255, 255, 0.1); /* 透明背景 */
+            transition: all 0.2s; /* 悬停过渡效果 */
+             "/>
             <div class="txz-img2" v-if="show2">
-              <span @click="show2 = false"> 关闭&ensp;✕ </span>
+              <span @click="show2 = false"> 关闭&ensp;✕ </span> -->
               <!--             <div class="card-pai">黑A·35648</div>-->
-              <div class="card-pai">{{ carNum() }}</div>
+              <!-- <div class="card-pai">{{ carNum() }}</div>
               <div class="card-tishi">该车辆为评卷教师车辆，已向学校报备，请放行！</div>
             </div>
-            <p>通行证</p>
+            <p style="color: white;">通行证</p>
-          </van-col>
+          </van-col> -->
 
           <van-col span="6" v-if="showIcon.show3">
-            <img @click="showGroup" src="@/assets/imgs/fenzu.svg" alt="" />
+            <img @click="showGroup" src="../assets/Ui/信息界面/图标/所属分组.svg" alt=""
+            style=" width: 43px; height: 43px; border: 2px solid rgba(255, 255, 255, 0.3); /* 白色半透明边框（0.7 透明度） */
+            border-radius: 12px; /* 圆角 */
+            padding: 8px; /* 内边距 */
+            background: rgba(255, 255, 255, 0.1); /* 透明背景 */
+            transition: all 0.2s; /* 悬停过渡效果 */" />
             <van-dialog
               :overlayStyle="{ background: 'rgba(0, 0, 0, 0.8)' }"
               :show-confirm-button="false"
@@ -254,10 +349,15 @@
                 <p v-else>{{ group }}</p>
               </div>
             </van-dialog>
-            <p>所属分组</p>
+            <p style="color: white;">所属分组</p>
           </van-col>
           <van-col span="6" v-if="showIcon.show4">
-            <img @click="showDormitory" src="@/assets/imgs/sushi.svg" alt="" />
+            <img @click="showDormitory" src="../assets/Ui/信息界面/图标/宿舍.svg" alt="" 
+            style="width: 43px;height: 43px; border: 2px solid rgba(255, 255, 255, 0.3); /* 白色半透明边框（0.7 透明度） */
+            border-radius: 12px; /* 圆角 */
+            padding: 8px; /* 内边距 */
+            background: rgba(255, 255, 255, 0.1); /* 透明背景 */
+            transition: all 0.2s; /* 悬停过渡效果 */"/>
             <van-dialog
               :overlayStyle="{ background: 'rgba(0, 0, 0, 0.8)' }"
               :show-confirm-button="false"
@@ -271,10 +371,15 @@
                 <p v-else>{{ dormitory }}</p>
               </div>
             </van-dialog>
-            <p>宿舍</p>
+            <p style="color: white;">宿舍</p>
           </van-col>
           <van-col span="6" v-if="showIcon.show5">
-            <img @click="show5 = true" src="@/assets/imgs/didian.svg" alt="" />
+            <img @click="show5 = true" src="../assets/Ui/信息界面/图标/评卷地图.svg" alt="" 
+            style="width: 43px;height: 43px; border: 2px solid rgba(255, 255, 255, 0.3); /* 白色半透明边框（0.7 透明度） */
+            border-radius: 12px; /* 圆角 */
+            padding: 8px; /* 内边距 */
+            background: rgba(255, 255, 255, 0.1); /* 透明背景 */
+            transition: all 0.2s; /* 悬停过渡效果 */"/>
             <van-dialog
               :overlayStyle="{ background: 'rgba(0, 0, 0, 0.8)' }"
               :show-confirm-button="false"
@@ -290,29 +395,41 @@
               <!--             <img src="@/assets/img/dt.jpg"/>-->
               <span class="dialog-close-content" @click="show5 = false">×</span>
             </van-dialog>
-            <p>评卷地点</p>
+            <p style="color: white;">评卷地点</p>
           </van-col>
 
-          <van-col span="6">
+          <!-- <van-col span="6">
-            <img @click="show6 = true" src="@/assets/imgs/xysh.svg" alt="" />
+            <img @click="show6 = true" src="../assets/Ui/信息界面/图标/校园生活.svg" alt="" 
+            style="width: 43px;height: 43px; border: 2px solid rgba(255, 255, 255, 0.3); /* 白色半透明边框（0.7 透明度） */
+            border-radius: 12px; /* 圆角 */
+            padding: 8px; /* 内边距 */
+            background: rgba(255, 255, 255, 0.1); /* 透明背景 */
+            transition: all 0.2s; /* 悬停过渡效果 */"/>
             <div class="xysh-img" :class="handoffValue" v-if="show6" @click="toggleShow">
-              <span @click="show6 = false"> 关闭&ensp;✕ </span>
+              <span @click="show6 = false"> 关闭&ensp;✕ </span> -->
               <!--              <em class="em-next"></em>-->
-            </div>
+            <!-- </div>
-            <p>校园生活</p>
+            <p style="color: white;">校园生活</p>
-          </van-col>
+          </van-col> -->
 
           <van-col span="6" v-if="showIcon.show7">
-            <img @click="show7 = true" src="../assets/imgs/zhixie.svg" alt="" />
+            <img @click="show7 = true" src="../assets/Ui/信息界面/图标/致谢.svg" alt="" style="width: 43px;height: 43px; border: 2px solid rgba(255, 255, 255, 0.3); /* 白色半透明边框（0.7 透明度） */
+            border-radius: 12px; /* 圆角 */
+            padding: 8px; /* 内边距 */
+            background: rgba(255, 255, 255, 0.1); /* 透明背景 */
+            transition: all 0.2s; /* 悬停过渡效果 */"/>
             <div class="zhixie-img" v-if="show7">
               <span @click="show7 = false"> 关闭&ensp;✕ </span>
               <div class="card-img">
-                <img src="@/assets/orangeUi/zhixie.jpg" style="width: 100%; height: 100%" />
+                <img src="@/assets/Ui/致谢.png" style="width: 100%; height: 100%" />
               </div>
             </div>
 
-            <p>致谢</p>
+            <p style="color: white;">致谢</p>
           </van-col>
+          <!-- <div class="hsd-title">
+            <img src="../assets/图层 1.svg"  />
+          </div> -->
 
           <!--        <van-col span="6" v-if="showIcon.show8">-->
           <!--          <img @click="show8 = true" src="@/assets/imgs/zz.svg" alt="">-->
@@ -329,17 +446,8 @@
           <!--          <p>证书</p>-->
           <!--        </van-col>-->
         </van-row>
-
-        <div class="main-bottom">
-          <!--        <img src="@/assets/img/bottom.png">-->
-          <!--        <img src="@/assets/img1/footer1.svg" >-->
-        </div>
       </div>
     </div>
-    <div class="footer">
-      <!--     <img class="bot-img" src="@/assets/img1/footer3.svg" >-->
-      <img class="bot-img" src="@/assets/orangeUi/footer_cg.svg" />
-    </div>
   </div>
 </template>
 <script setup lang="ts">
@@ -554,30 +662,29 @@
   .main-container {
     height: 100vh;
     width: 100vw;
-    background: url('@/assets/orangeUi/bj5.svg') no-repeat;
+    background: url('@/assets/Ui/信息/个人信息/背景.svg') no-repeat;
     background-size: cover;
-    display: flex;
+    background-position: center center; /* 图片顶部对齐 */
-    flex-direction: column;
-    align-items: center;
-    justify-content: space-between;
   }
 
   .hsd-title {
+    // height: 5px;
     width: 100%;
     display: flex;
     justify-content: center;
     align-items: center;
     padding-top: 20px; // 调整顶部间距
 
-    img {
+    // img {
-      width: 65%;
+    //   width: 65%;
-      margin-top: 8vh;
+    //   margin-top: 8vh;
-    }
+    // }
   }
 
   .head-cg {
     width: 100%;
     display: flex;
+    margin-top: 100px;
     justify-content: center;
     align-items: center;
 
@@ -588,21 +695,22 @@
   }
 
   .main-content {
-    //margin-top: 10vh;
+    margin-top: 30px;
     width: 100vw;
     height: 10vh;
     text-align: center;
     //border: 1px solid orange;
-    color: black;
+    color: white;
     font-weight: 600;
+    font-size: 40px;
   }
 
   .main-icon {
     width: 97vw;
     height: 20vh;
     text-align: center;
+    margin-top: 120px;
   
-    //margin-top: 5vh;
 
     .main-item {
       img {
@@ -735,20 +843,12 @@
       max-height: 90%;
     }
   }
-
-  /* 校园生活弹窗样式 */
-  .xysh-img1 {
-    background: url('@/assets/orangeUi/xysh1.jpg') no-repeat center center;
-    background-size: cover;
-  }
-
-  .xysh-img2 {
-    background: url('@/assets/orangeUi/xysh2.jpg') no-repeat center center;
-    background-size: cover;
-  }
   .icon {
     font-size: 24px; 
     color: #666; 
     margin-right: -20px;
   }
+  .icon_background{
+
+  }
 </style>

src/views/waiTeacher.vue

@@ -1,12 +1,13 @@
 <template>
   <div class="father">
-    <van-cell-group inset class="mar-auto15">
+    <!--<van-cell-group inset class="mar-auto15">
       <van-field class="van-field__label_rectangle" label-width="400px" label="哈尔滨师范大学评卷信息填报" type="hidden" />
-    </van-cell-group>
+    </van-cell-group>-->
-
     <van-form @submit="onSubmit">
-      <van-cell-group inset>
+      <div class="head-cg">
-        <van-field class="van-field__label1——circle" label-width="400px" label="个人信息" type="hidden" />
+          <img src="@/assets/Ui/信息/个人信息/个人信息.svg" />
+        </div>
+      <van-cell-group inset style="background-color: transparent;">
         <van-field
           v-model="notLocalTeacher.userName"
           name="userName"
@@ -14,7 +15,14 @@
           type="text"
           placeholder="请输入姓名"
           :rules="[{ validator: userName, message: '请正确输入姓名' }]"
-        />
+        >
+          <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/个人信息/图标/姓名.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
+      </van-field>
         <van-field
           v-model="notLocalTeacher.identityId"
           name="userCardId"
@@ -22,9 +30,34 @@
           type="text"
           placeholder="请输入身份证号"
           :rules="[{ validator: userCardId, message: '请输入身份证号' }]"
-        />
+        >
-        <van-field v-model="notLocalTeacher.sex" readonly name="picker" label="性别" />
+        <template #left-icon>
-        <van-field readonly v-model="notLocalTeacher.age" name="age" label="年龄" type="text" />
+            <img 
+            src= "@/assets/Ui/信息/个人信息/图标/身份证号.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
+      </van-field>
+        <van-field v-model="notLocalTeacher.sex" readonly name="picker" label="性别">
+
+          <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/个人信息/图标/性别.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
+
+        </van-field>
+        <van-field readonly v-model="notLocalTeacher.age" name="age" label="年龄" type="text">
+          <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/个人信息/图标/年龄.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
+
+        </van-field>
+
 
         <!--        <van-field-->
         <!--            v-model="notLocalTeacher.identityId"-->
@@ -41,7 +74,15 @@
           type="number"
           placeholder="请输入手机号"
           :rules="[{ validator: phoneNum, message: '请输入手机号' }]"
-        />
+        >
+        <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/个人信息/图标/手机号.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
+      
+      </van-field>
 
         <van-field
           v-model="notLocalTeacher.jobTitle"
@@ -52,7 +93,15 @@
           placeholder="点击选择职称"
           @click="showPicker = true"
           :rules="[{ required: true, message: '请选择职称' }]"
-        />
+        >
+        <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/个人信息/图标/职称.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
+
+      </van-field>
         <van-popup v-model:show="showPicker" position="bottom">
           <van-picker :columns="columns" @confirm="onConfirm" @cancel="showPicker = false" />
         </van-popup>
@@ -64,10 +113,21 @@
           type="text"
           placeholder="请输入职务（如教师，教务主任）"
           :rules="[{ required: true, message: '请输入职务' }]"
-        />
+        >
+        <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/个人信息/图标/职务.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
+
+      </van-field>
       </van-cell-group>
-      <van-cell-group inset class="mar-auto15">
+      <div class="head-cg">
-        <van-field class="van-field__label1——circle" label-width="400px" label="工作单位" type="hidden" />
+          <img src="@/assets/Ui/信息/个人信息/工作单位.svg" />
+        </div>
+      <van-cell-group inset class="mar-auto15" style="background-color: transparent;">
+        <!--<van-field class="van-field__label1——circle" label-width="400px" label="工作单位" type="hidden" />-->
         <van-field
           v-model="notLocalTeacher.workName"
           name="workName"
@@ -75,14 +135,36 @@
           type="text"
           placeholder="请输入单位名称"
           :rules="[{ required: true, message: '请输入单位名称' }]"
-        />
+        >
-        <van-field v-model="notLocalTeacher.workPhone" name="workPhoen" label="单位电话" type="text" placeholder="电话/固定电话(选填)" />
+
+        <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/个人信息/图标/单位名称.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
+      </van-field>
+        <van-field v-model="notLocalTeacher.workPhone" name="workPhoen" label="单位电话" type="text" placeholder="电话/固定电话(选填)" >
+          <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/个人信息/图标/单位电话.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
+        </van-field>
+
       </van-cell-group>
 
       <div style="margin: 16px">
-        <van-button style="background-color: #8d2328; border: none; font-weight: 600" round block type="primary" native-type="submit">
+        <!--<van-button style="background-color: #8d2328; border: none; font-weight: 600" round block type="primary" native-type="submit">-->
-          下一步
+          <!--下一步
-        </van-button>
+        </van-button>-->
+        <button style="background-color: transparent; width: 100%; border: none; display: flex; justify-content: flex-end;" native-type="submit">
+          <img 
+            src="@/assets/Ui/信息/个人信息/下一页.svg" 
+            style="width: 35%; "
+            alt="下一步">
+        </button>
       </div>
     </van-form>
   </div>
@@ -349,14 +431,18 @@
   });
 </script>
 <style scoped lang="scss">
+
   .father {
     height: 100vh;
     background-color: #efefef;
     padding-top: 20px;
+    background-image: url('@/assets/Ui/信息/个人信息/背景.svg');
+    background-repeat: no-repeat;
+    background-size: cover; /* 修改这里 */
   }
 
   .mar-auto15 {
-    margin: 15px 15px;
+    margin: 15px 30px;
   }
 
   .van-field__label_rectangle {
@@ -392,4 +478,16 @@
     background-color: #8d2328;
     border-radius: 50%;
   }
+  .head-cg {
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+
+    img {
+      width: 50%;
+      margin-top: 5vh;
+      margin-bottom: 2vh;
+    }
+  }
 </style>

src/views/waiTeacherTwo.vue

@@ -8,11 +8,12 @@
       <!--        <p class="xxxxx"></p>-->
       <!--      </div>-->
       <van-form @submit="onSubmit">
+        <div class="head-cg">
+          <img src="@/assets/Ui/信息/劳务信息/劳务信息.svg" />
+        </div>
         <van-cell-group inset>
-          <van-field class="van-field__label1——circle" label-width="400px" label="劳务信息" type="hidden" />
+          <!--<van-field class="van-field__label1——circle" label-width="400px" label="劳务信息" type="hidden" />-->
           <div class="title-tishi">
-            <!--            <span>温馨提示</span>-->
-
             <div class="wxts">
               请填写本人名下
               <em>借记卡（储蓄卡）</em>
@@ -28,7 +29,14 @@
             type="text"
             placeholder="请输入姓名"
             :rules="[{ required: true, message: '请输入学号' }]"
-          />
+          >
+          <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/劳务信息/图标/姓名.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
+        </van-field>
           <van-field
             readonly
             v-model="tid"
@@ -37,7 +45,15 @@
             type="text"
             placeholder="请输入身份证号"
             :rules="[{ required: true, message: '请输入身份证号' }]"
-          />
+          >
+          <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/劳务信息/图标/身份证号.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
+        
+        </van-field>
           <van-field
             readonly
             v-model="tphone"
@@ -46,7 +62,14 @@
             type="text"
             placeholder="请输入手机号"
             :rules="[{ required: true, message: '请输入手机号' }]"
-          />
+          >
+          <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/劳务信息/图标/手机号.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
+        </van-field>
           <div class="field-container">
             <van-field
             v-model="notLocalTeacherTwo.pyCardMasked"
@@ -59,7 +82,12 @@
             @blur="onBlur"
             ref="cardInput"
           >
-          
+          <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/劳务信息/图标/银行卡号.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
         </van-field>
           <!-- 修改按钮放在输入框右侧 -->
           <van-button 
@@ -90,7 +118,15 @@
             type="text"
             placeholder="请输入开户所在地(北京，哈尔滨)"
             :rules="[{ validator: bankAddr }]"
-          />
+          >
+          <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/劳务信息/图标/开户银行所在地.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
+        
+        </van-field>
           <!--          :rules="[{ required: true, message: '请输入开户所在地' }]"-->
           <van-field
             v-model="notLocalTeacherTwo.bankName"
@@ -99,12 +135,30 @@
             type="text"
             placeholder="请输入开户行名称"
             :rules="[{ validator: bankName }]"
-          />
+          >
+          <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/劳务信息/图标/开户银行.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
+        
+        </van-field>
+
           <!--          :rules="[{ required: true, message: '请输入开户行名称' }]"-->
         </van-cell-group>
+        <div class="head-cg">
+          <img src="@/assets/Ui/信息/劳务信息/入校信息.svg" />
+        </div>
         <div class="border-rad">
-          <van-field class="van-field__label1——circle" label-width="400px" label="入校信息" type="hidden" />
+          <!--<van-field class="van-field__label1——circle" label-width="400px" label="入校信息" type="hidden" />-->
           <van-field name="carStatus" label-width="150px" label="车辆是否入校">
+            <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/劳务信息/图标/是否开车.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
             <template #input>
               <van-radio-group checked-color="#8D2328" v-model="notLocalTeacherTwo.carStatus" direction="horizontal">
                 <van-radio name="1">是</van-radio>
@@ -120,8 +174,21 @@
             type="text"
             placeholder="例如：黑A39233"
             :rules="[{ required: true, message: '请输入车牌号' }]"
-          />
+          >
+          <!--<template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/劳务信息/图标/是否开车.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>-->
+        </van-field>
           <van-field name="dormitoryStatus" label-width="150px" label="是否住宿">
+            <template #left-icon>
+            <img 
+            src= "@/assets/Ui/信息/劳务信息/图标/是否住宿.svg"
+            style="width: 16px; height: 16px;"
+            />
+          </template>
             <template #input>
               <van-radio-group checked-color="#8D2328" v-model="notLocalTeacherTwo.dormitoryStatus" direction="horizontal">
                 <van-radio name="1">是</van-radio>
@@ -130,8 +197,8 @@
             </template>
           </van-field>
         </div>
-        <div style="margin: 16px">
+        <div style="margin: 16px; display: flex;">
-          <van-button
+          <!--<van-button
             round
             style="background-color: #8d2328; border: none; font-weight: 600"
             class="van-button--primary"
@@ -139,8 +206,14 @@
             @click="Previous"
           >
             上一步
-          </van-button>
+          </van-button>-->
-          <van-button
+          <button @click="Previous" style="background-color: transparent; width: 100%; border: none; display: flex; justify-content: flex-start;">
+          <img 
+            src="@/assets/Ui/信息/劳务信息/上一页 按钮.svg" 
+            style="width: 70%; "
+            alt="下一步">
+        </button>
+          <!--<van-button
             round
             style="background-color: #8d2328; border: none; font-weight: 600"
             class="van-button--primary"
@@ -148,13 +221,19 @@
             native-type="submit"
           >
             提交
-          </van-button>
+          </van-button>-->
+          <button style="background-color: transparent; width: 100%; border: none; display: flex; justify-content: flex-end;">
+          <img 
+            src="@/assets/Ui/信息/劳务信息/下一页按键.svg" 
+            style="width: 70%; "
+            alt="下一步">
+        </button>
         </div>
       </van-form>
 
       <van-dialog
         v-model:show="myShowDialog"
-        confirmButtonColor="#8D2328"
+        confirmButtonColor="#f8cdba"
         cancelButtonColor="#939393"
         title="确认信息"
         confirm-button-text="确认"
@@ -173,15 +252,37 @@
                 name="userName"
                 label="姓名"
                 type="text"
-              />
+              >
+              <template #left-icon>
+                <img 
+                  src= "@/assets/Ui/信息/确认信息/图标/姓名.svg"
+                  style="width: 16px; height: 16px;"
+                />
+              </template>
+            </van-field>
               <van-field
                 readonly
                 style="height: 35px; line-height: 100%"
                 v-model="notLocalTeacherTwo.identityId"
                 name="userCardId"
                 label="身份证号"
-              />
+              >
-              <van-field style="height: 35px; line-height: 100%" v-model="notLocalTeacherTwo.sex" readonly name="picker" label="性别" />
+              <template #left-icon>
+                <img 
+                  src= "@/assets/Ui/信息/确认信息/图标/身份证.svg"
+                  style="width: 16px; height: 16px;"
+                />
+              </template>
+            </van-field>
+              <van-field style="height: 35px; line-height: 100%" v-model="notLocalTeacherTwo.sex" readonly name="picker" label="性别" >
+
+                <template #left-icon>
+                <img 
+                  src= "@/assets/Ui/信息/确认信息/图标/性别.svg"
+                  style="width: 16px; height: 16px;"
+                />
+              </template>
+              </van-field>
               <van-field
                 style="height: 35px; line-height: 100%"
                 readonly
@@ -189,7 +290,14 @@
                 name="age"
                 label="年龄"
                 type="text"
-              />
+              >
+              <template #left-icon>
+                <img 
+                  src= "@/assets/Ui/信息/确认信息/图标/年龄.svg"
+                  style="width: 16px; height: 16px;"
+                />
+              </template>
+            </van-field>
               <van-field
                 style="height: 35px; line-height: 100%"
                 readonly
@@ -197,14 +305,28 @@
                 name="phone"
                 label="手机号"
                 type="number"
-              />
+              >
+              <template #left-icon>
+                <img 
+                  src= "@/assets/Ui/信息/确认信息/图标/手机号.svg"
+                  style="width: 16px; height: 16px;"
+                />
+              </template>
+            </van-field>
               <van-field
                 style="height: 35px; line-height: 100%"
                 v-model="notLocalTeacherTwo.jobTitle"
                 readonly
                 name="picker"
                 label="职称"
-              />
+              >
+              <template #left-icon>
+                <img 
+                  src= "@/assets/Ui/信息/确认信息/图标/职称.svg"
+                  style="width: 16px; height: 16px;"
+                />
+              </template>
+            </van-field>
               <van-field
                 style="height: 35px; line-height: 100%"
                 readonly
@@ -212,7 +334,14 @@
                 name="office"
                 label="职务"
                 type="text"
-              />
+              >
+              <template #left-icon>
+                <img 
+                  src= "@/assets/Ui/信息/确认信息/图标/职务.svg"
+                  style="width: 16px; height: 16px;"
+                />
+              </template>
+            </van-field>
               <van-field
                 style="height: 35px; line-height: 100%"
                 readonly
@@ -220,7 +349,14 @@
                 name="workName"
                 label="单位名称"
                 type="text"
-              />
+              >
+              <template #left-icon>
+                <img 
+                  src= "@/assets/Ui/信息/确认信息/图标/单位名称.svg"
+                  style="width: 16px; height: 16px;"
+                />
+              </template>
+            </van-field>
               <van-field
                 style="height: 35px; line-height: 100%"
                 readonly
@@ -228,7 +364,14 @@
                 name="workPhoen"
                 label="单位电话"
                 type="text"
-              />
+              >
+              <template #left-icon>
+                <img 
+                  src= "@/assets/Ui/信息/确认信息/图标/单位电话.svg"
+                  style="width: 16px; height: 16px;"
+                />
+              </template>
+            </van-field>
               <van-field
                 style="height: 35px; line-height: 100%"
                 readonly
@@ -236,7 +379,14 @@
                 name="pyCard"
                 label="银行卡号"
                 type="number"
-              />
+              >
+              <template #left-icon>
+                <img 
+                  src= "@/assets/Ui/信息/确认信息/图标/银行卡号.svg"
+                  style="width: 16px; height: 16px;"
+                />
+              </template>
+            </van-field>
 
               <van-field
                 style="height: 35px; line-height: 100%"
@@ -245,7 +395,14 @@
                 name="bankAddress"
                 label="开户所在地"
                 type="text"
-              />
+              >
+              <template #left-icon>
+                <img 
+                  src= "@/assets/Ui/信息/确认信息/图标/开户银行所在地.svg"
+                  style="width: 16px; height: 16px;"
+                />
+              </template>
+            </van-field>
               <van-field
                 style="height: 35px; line-height: 100%"
                 readonly
@@ -253,7 +410,15 @@
                 name="bankName"
                 label="开户行"
                 type="text"
-              />
+              >
+              <template #left-icon>
+                <img 
+                  src= "@/assets/Ui/信息/确认信息/图标/开户银行.svg"
+                  style="width: 16px; height: 16px;"
+                />
+              </template>
+            
+            </van-field>
               <van-field
                 style="height: 35px; line-height: 100%"
                 readonly
@@ -263,8 +428,22 @@
                 label="车牌号"
                 type="text"
                 height="40px"
-              />
+              >
+              <template #left-icon>
+                <img 
+                  src= "@/assets/Ui/信息/确认信息/图标/车牌.svg"
+                  style="width: 16px; height: 16px;"
+                />
+              </template>
+            </van-field>
               <van-field name="dormitoryStatus" :readonly="true" style="height: 35px; line-height: 50%" label="是否住宿">
+
+                <template #left-icon>
+                <img 
+                  src= "@/assets/Ui/信息/确认信息/图标/住宿.svg"
+                  style="width: 16px; height: 16px;"
+                />
+              </template>
                 <template #input>
                   <van-radio-group
                     checked-color="#8D2328"
@@ -304,6 +483,7 @@
     bankAddress: '',
     bankName: '',
     carNumber: '',
+    openId: '',
   });
 
   const tname = ref('');
@@ -471,9 +651,11 @@
     // console.log('submit', {...values,...storedData});
     // alert({...values,...storedData}.toString())
     myShowDialog.value = true;
+    console.log("storedData",storedData)
     myObj = { ...values, ...storedData };
     //存在加密--直接修改要提交后端的值
     myObj.pyCard = notLocalTeacherTwo.pyCard;
+    console.log("myObj", myObj)
     return;
     // waiTApi.save({...values,...storedData}).then(res => {
     //   console.log(res)
@@ -516,11 +698,13 @@
 </script>
 <style scoped lang="scss">
   .father {
-    padding-top: 20px;
     height: 100vh;
     background-color: #efefef;
+    padding-top: 20px;
+    background-image: url('@/assets/Ui/信息/劳务信息/背景.svg');
+    background-repeat: no-repeat;
+    background-size: cover; /* 修改这里 */
   }
-
   .mar-auto15 {
     margin: 15px 15px;
   }
@@ -564,7 +748,6 @@
     height: 100vh;
     margin: 0 auto;
     border-radius: 8px;
-    //background-color: #42b983;
     padding: 0;
   }
 
@@ -655,4 +838,16 @@
   width: 150px;
   cursor: pointer; /* 鼠标悬停时显示为手型，表示可点击 */
 }
+
+.head-cg {
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    img {
+      width: 50%;
+      margin-top: 2vh;
+      margin-bottom: 2vh;
+    }
+  }
 </style>

src/views/wechatOauth/index.vue

@@ -0,0 +1,166 @@
+<template>
+        <van-button 
+          round 
+          type="primary" 
+          block 
+          @click="handleAuth"
+          :loading="loading"
+        >
+          微信授权登录
+        </van-button>
+</template>
+
+<script>
+import { ref, onMounted } from 'vue';
+import { showFailToast  } from 'vant';
+import { getCode,getUserInfo } from '@/api';
+
+
+export default {
+  data() {
+    return {
+      code: '',
+      state: '',
+      loading: false,
+      userInfo: {
+        city:'',
+        country: '',
+        headimgurl: '',
+        nickname: '' ,
+        openid: '',
+        privilege: [],
+        province: '',
+        sex: '',
+        unionid: '',
+      }
+    }
+  },
+  mounted() {
+      this.handleAuth();
+  },
+  methods: {
+  
+    async handleAuth(){
+        this.loading = true;
+        try {
+          // 1. 获取微信授权URL
+            const response = await getCode().catch(err => {
+            throw new Error(`API请求失败: ${err.message}`);
+          });
+          // 2. 处理可能的URL格式问题
+          let authUrl = (response || '').toString().trim();
+          authUrl = authUrl.replace(/\s+/g, ''); // 删除所有空格
+          authUrl = authUrl.replace(/^redirect:/i, ''); // 去除redirect:前缀
+          // 3. 验证URL有效性
+          console.log(authUrl)
+          if (!authUrl || !/^https:\/\/open\.weixin\.qq\.com/.test(authUrl)) {
+            throw new Error(`无效的授权URL: ${authUrl}`);
+          }
+          const local = window.location.href;
+          console.log("local",local)
+          if(local.indexOf("?code") >= 0){
+            this.code = this.getUrlParams(new URL(local)).code;
+            this.state = this.getUrlParams(new URL(local)).state
+            console.log(this.code)
+            if (this.code) {
+              this.getUserInfo(this.code,this.state);
+              this.handleComplete();
+            }
+          }else {
+            // 4. 执行重定向
+            window.location.assign(authUrl);
+          }
+        } catch (error) {
+          console.error('授权流程错误:', error);
+          // 5. 用户友好的错误提示
+          showFailToast(error.message || '微信授权失败');
+        } finally {
+          this.loading = false;
+        }
+
+    },
+      // 获取URL参数
+    getUrlParams(url) {
+      const params = new URLSearchParams(url.search)
+      const map = {};
+      for (let param of params.entries()){
+        map[param[0]] = param[1];
+      }
+      console.log(map)
+      return map;
+    },
+
+    // 获取用户信息
+    async getUserInfo(code,state) {
+      try {
+        this.loading = true;
+        // 这里调用后端接口获取用户信息
+        const response = await getUserInfo(code,state);
+        const userData = response.result.userInfo;
+        //console.log(userData,"data")
+        this.userInfo.city = userData.city;
+        this.userInfo.country = userData.country;
+        this.userInfo.headimgurl = userData.headimgurl;
+        this.userInfo.nickname = userData.nickname;
+        this.userInfo.openid = userData.openid;
+        this.userInfo.privilege = userData.privilege;
+        this.userInfo.province = userData.province;
+        this.userInfo.sex = userData.sex;
+        this.userInfo.unionid = userData.unionid;
+        console.log("userInfo",this.userInfo)
+        
+      } catch (error) {
+        showFailToast('获取用户信息失败');
+        console.error(error);
+      } finally {
+        this.loading = false;
+      }
+    },
+    // 完成登录
+    handleComplete()  {
+      // 这里处理登录完成后的逻辑，比如跳转到首页
+      showFailToast('登录成功');
+      // 假设跳转到首页
+      window.location.href = '/home';
+    },
+  }
+}
+</script>
+
+<style scoped>
+.auth-container {
+  height: 100vh;
+  background-color: #f7f8fa;
+}
+
+.auth-content {
+  padding: 20px;
+  box-sizing: border-box;
+}
+
+.auth-tip {
+  text-align: center;
+  margin: 40px 0;
+}
+
+.tip-text {
+  font-size: 18px;
+  font-weight: bold;
+  margin: 15px 0 5px;
+}
+
+.sub-tip {
+  font-size: 14px;
+  color: #969799;
+}
+
+.user-info {
+  text-align: center;
+}
+
+.nickname {
+  font-size: 18px;
+  font-weight: bold;
+  margin: 10px 0 20px;
+}
+</style>