最后

src/components/Header.vue

@@ -16,8 +16,8 @@
           </span>
           <template #dropdown>
             <el-dropdown-menu>
-              <el-dropdown-item>
+              <el-dropdown-item  @click="showUserInfoDialog">
-                <el-icon><UserFilled /></el-icon>个人信息
+                <el-icon><UserFilled/></el-icon>个人信息
               </el-dropdown-item>
               <el-dropdown-item>
                 <el-icon><Setting /></el-icon>设置
@@ -31,16 +31,98 @@
       </div>
     </div>
   </div>
+  <el-dialog title="个人信息" v-model="userInfoDialogVisible">
+    <div>
+      <p><strong>用户名：</strong>{{ userInfo.username }}</p>
+      <p><strong>邮箱：</strong>{{ userInfo.email }}</p>
+      <p><strong>年龄：</strong>{{ userInfo.age }}</p>
+      <p><strong>性别：</strong>{{ userInfo.gender }}</p>
+      <p><strong>权限：</strong>{{ userInfo.permission }}</p>
+    </div>
+    <button type="button" class="el-button el-button--primary" @click="doctorFormVisible = true" v-if="userInfo.permission === '医生管理员'">新增医生用户</button>
+    <el-dialog title="新增医生用户" v-model="doctorFormVisible" @close="resetDoctorForm">
+      <el-form ref="doctorForm" :model="doctorForm" :rules="doctorRules" label-width="80px" @submit.native.prevent="submitDoctorForm">
+        <el-form-item label="用户名" prop="username">
+          <el-input v-model="doctorForm.username"></el-input>
+        </el-form-item>
+        <el-form-item label="密码" prop="password">
+          <el-input type="password" v-model="doctorForm.pwd"></el-input>
+        </el-form-item>
+        <!-- 可以根据需要添加其他字段 -->
+        <el-form-item>
+          <el-button type="primary" @click="submitDoctorForm">提交</el-button>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
+  </el-dialog>
   <router-view />
 </template>
 
 <script setup>
-import { ref } from 'vue'
+import {computed, ref} from 'vue'
 import { User, CaretBottom, UserFilled, Setting, SwitchButton } from '@element-plus/icons-vue'
 import router from "@/router/index.js";
+import axiosInstance from "@/utils/axiosInstance.js";
+const userInfoDialogVisible = ref(false);
+const doctorFormVisible = ref(false);
+const showUserInfoDialog = () => {
+  userInfoDialogVisible.value = true;
+};
+const resetDoctorForm = () => {
+  doctorForm.value = {
+    username: '',
+    password: '' // 重置密码字段
+    // 重置其他字段
+  };
+};
+const doctorRules = {
+  username: [
+    { required: true, message: '请输入用户名', trigger: 'blur' }
+  ],
+  pwd: [
+    { required: true, message: '请输入密码', trigger: 'blur' },
+    { min: 6, message: '密码长度不能少于6位', trigger: 'blur' }
+  ]
+  // 可以根据需要添加其他验证规则
+};
+const doctorForm = ref({
+  username: '',
+  pwd: ''
+  // 可以根据需要添加其他字段
+});
+const submitDoctorForm = () => {
+  // 这里应该调用后端API来注册新医生用户
+  axiosInstance.post('/user/register', doctorForm.value)
+      .then(response => {
+        // 处理成功响应
+        console.log('医生用户注册成功', response);
+        // 可以在这里关闭对话框，清空表单等
+        doctorFormVisible.value = false; // 关闭对话框
+        resetDoctorForm(); // 清空表单
+      })
+      .catch(error => {
+        // 处理错误响应
+        console.error('医生用户注册失败', error);
+      });
+};
 
+
+const roleDisplay = computed(() => {
+  switch (sessionStorage.getItem('permission')) {
+    case '0':
+      return '医生管理员';
+    case '1':
+      return '医生';
+    default:
+      return '未登录';
+  }
+});
 const userInfo = ref({
   username: sessionStorage.getItem('username') || '未登录',
+  email: sessionStorage.getItem('email') || '未登录',
+  age: sessionStorage.getItem('age') || '未登录',
+  gender: sessionStorage.getItem('gender') || '未登录',
+  permission: roleDisplay.value
 })
 const logout = () => {
   // 清空 sessionStorage

src/views/login/Index.vue

@@ -50,12 +50,12 @@ export default {
         const { data } = response;
         if (data.code === 200) {
           alert('用户登录成功');
-          const token = data.data;
+          sessionStorage.setItem('token', data.data);
-          const username = data.username;
+          sessionStorage.setItem('username', data.username);
-          const permission = data.permission;
+          sessionStorage.setItem('permission', data.permission);
-          sessionStorage.setItem('token', token);
+          sessionStorage.setItem('age',data.age);
-          sessionStorage.setItem('username', username);
+          sessionStorage.setItem('gender',data.gender);
-          sessionStorage.setItem('permission', permission);
+          sessionStorage.setItem('email',data.email);
           await router.push('/home');
         } else {
           alert(data.message);
@@ -96,7 +96,8 @@ export default {
     border-radius: 10px;
     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
     text-align: center;
-
+    position: relative;
+    right: 320px;
     h1 {
       margin-bottom: 20px;
       color: #333;
@@ -139,6 +140,7 @@ export default {
           color: #333;
           pointer-events: none;
           transition: 0.5s;
+
         }
       }
     }

src/views/user/User.vue

@@ -330,15 +330,15 @@ const showTreatmentInfo = (info) => {
   <el-card class="page-container">
     <template #header>
       <div class="header">
-        <h2><span>用户信息管理表</span></h2>
+        <h2><span>患者信息管理表</span></h2>
       </div>
       <!--功能按钮-->
       <div class="box">
         <el-button type="primary" :icon="Share" @click="exportUser()">数据导出</el-button>
-        <el-button type="primary" :icon="Upload" @click="dialogVisibleAdd = true">新增用户</el-button>
+        <el-button type="primary" :icon="Upload" @click="dialogVisibleAdd = true">新增患者</el-button>
-        <el-button type="success" :icon="Search" @click="dialogVisibleSelect = true">查询用户</el-button>
+        <el-button type="success" :icon="Search" @click="dialogVisibleSelect = true">查询患者</el-button>
         <el-button type="danger" :icon="Delete" :disabled="tableChecked.length === 0"
-                   @click="deleteByIdsUser(tableChecked)">批量删除用户
+                   @click="deleteByIdsUser(tableChecked)">批量删除患者
         </el-button>
       </div>
     </template>
@@ -524,4 +524,8 @@ h2 {
   -ms-transform: translateX(65%);
   -webkit-transform: translateX(25%);
 }
+
+ .box > .el-button:not(:last-child) {
+   margin-right: 10px;
+ }
 </style>