接收了来着main的vite.config.js的修改

src/router/authentication.js

@@ -2,11 +2,11 @@
 import Login from '../views/authentication/Login.vue'
 import Register from '../views/authentication/Register.vue'
 import ManageProfile from '../views/authentication/ManageProfile.vue'
-// import Profile from '../views/authentication/Profile.vue'
+import Profile from '../views/authentication/Profile.vue'
 
 export default [
     { path: '/login', component: Login },
     { path: '/register', component: Register },
     { path: '/manageProfile', component: ManageProfile },
-    // { path: '/profile', component: Profile }
+    { path: '/profile', component: Profile },
 ]

src/views/authentication/Profile.vue

@@ -0,0 +1,107 @@
+<script setup>
+import {ref} from 'vue';
+import 'element-plus/dist/index.css';
+
+const nickname = ref('admin');
+const phoneNumber = ref('15888888888');
+const email = ref('ry@163.com');
+const department = ref('研发部门 / 董事长');
+const role = ref('超级管理员');
+const createdAt = ref('2021-09-21 17:00:35');
+
+</script>
+
+<template>
+  <div class="profile-container">
+    <div class="profile-box">
+      <h2>个人信息</h2>
+      <div class="profile-image">
+        <img src="@assets/avatar.jpg" alt="Profile Image"/>
+      </div>
+      <div class="profile-info">
+        <div class="divider"></div>
+        <div class="info-item">
+          <span class="info-label">用户昵称：</span>
+          <span class="info-value">{{ nickname }}</span>
+        </div>
+        <div class="divider"></div>
+        <div class="info-item">
+          <span class="info-label">手机号码：</span>
+          <span class="info-value">{{ phoneNumber }}</span>
+        </div>
+        <div class="divider"></div>
+        <div class="info-item">
+          <span class="info-label">用户邮箱：</span>
+          <span class="info-value">{{ email }}</span>
+        </div>
+        <div class="divider"></div>
+        <div class="info-item">
+          <span class="info-label">所属部门：</span>
+          <span class="info-value">{{ department }}</span>
+        </div>
+        <div class="divider"></div>
+        <div class="info-item">
+          <span class="info-label">所属角色：</span>
+          <span class="info-value">{{ role }}</span>
+        </div>
+        <div class="divider"></div>
+        <div class="info-item">
+          <span class="info-label">创建日期：</span>
+          <span class="info-value">{{ createdAt }}</span>
+        </div>
+        <div class="divider"></div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.profile-container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100vh;
+  background: white;
+}
+
+.profile-box {
+  background: white;
+  padding: 2rem;
+  border-radius: 8px;
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+  width: 30%;
+  max-width: 300px;
+  text-align: center;
+}
+
+.profile-image img {
+  width: 100px;
+  height: 100px;
+  border-radius: 50%;
+  margin-bottom: 1rem;
+}
+
+.profile-info {
+  text-align: left;
+}
+
+.info-item {
+  display: flex;
+  justify-content: space-between;
+  margin-bottom: 0.5rem;
+}
+
+.info-label {
+  font-weight: bold;
+}
+
+.info-value {
+  color: #555;
+}
+
+.divider {
+  height: 1px;
+  background: #e0e0e0;
+  margin: 0.5rem 0;
+}
+</style>