视图路径修改

schoolNewsWeb/src/views/user/profile/PersonalInfoView.vue

@@ -0,0 +1,130 @@
+<template>
+  <div class="personal-info">
+    <el-form :model="userForm" label-width="120px" class="info-form">
+      <el-form-item label="头像">
+        <div class="avatar-upload">
+          <img :src="userForm.avatar || defaultAvatar" alt="头像" class="avatar-preview" />
+          <el-button size="small" @click="handleAvatarUpload">更换头像</el-button>
+        </div>
+      </el-form-item>
+      
+      <el-form-item label="用户名">
+        <el-input v-model="userForm.username" disabled />
+      </el-form-item>
+      
+      <el-form-item label="姓名">
+        <el-input v-model="userForm.realName" />
+      </el-form-item>
+      
+      <el-form-item label="性别">
+        <el-radio-group v-model="userForm.gender">
+          <el-radio :label="1">男</el-radio>
+          <el-radio :label="2">女</el-radio>
+        </el-radio-group>
+      </el-form-item>
+      
+      <el-form-item label="手机号">
+        <el-input v-model="userForm.phone" />
+      </el-form-item>
+      
+      <el-form-item label="邮箱">
+        <el-input v-model="userForm.email" />
+      </el-form-item>
+      
+      <el-form-item label="部门">
+        <el-input v-model="userForm.deptName" disabled />
+      </el-form-item>
+      
+      <el-form-item label="个人简介">
+        <el-input 
+          v-model="userForm.bio" 
+          type="textarea" 
+          :rows="4"
+          placeholder="介绍一下自己吧..."
+        />
+      </el-form-item>
+      
+      <el-form-item>
+        <el-button type="primary" @click="handleSave">保存</el-button>
+        <el-button @click="handleCancel">取消</el-button>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted } from 'vue';
+import { ElForm, ElFormItem, ElInput, ElButton, ElRadio, ElRadioGroup, ElMessage } from 'element-plus';
+
+// 默认头像
+const defaultAvatar = new URL('@/assets/imgs/default-avatar.png', import.meta.url).href;
+
+const userForm = ref({
+  avatar: '',
+  username: '',
+  realName: '',
+  gender: 1,
+  phone: '',
+  email: '',
+  deptName: '',
+  bio: ''
+});
+
+onMounted(() => {
+  // TODO: 加载用户信息
+  loadUserInfo();
+});
+
+function loadUserInfo() {
+  // 模拟数据
+  userForm.value = {
+    avatar: '',
+    username: '平台用户bc7a1b',
+    realName: '张三',
+    gender: 1,
+    phone: '15268425987',
+    email: 'zhangsan@example.com',
+    deptName: '机械学院',
+    bio: ''
+  };
+}
+
+function handleAvatarUpload() {
+  // TODO: 上传头像
+  ElMessage.info('上传头像功能开发中');
+}
+
+function handleSave() {
+  // TODO: 保存用户信息
+  ElMessage.success('保存成功');
+}
+
+function handleCancel() {
+  // 重置表单
+  loadUserInfo();
+}
+</script>
+
+<style lang="scss" scoped>
+.personal-info {
+  max-width: 600px;
+}
+
+.info-form {
+  padding: 20px 0;
+}
+
+.avatar-upload {
+  display: flex;
+  align-items: center;
+  gap: 20px;
+}
+
+.avatar-preview {
+  width: 80px;
+  height: 80px;
+  border-radius: 50%;
+  object-fit: cover;
+  border: 2px solid #e0e0e0;
+}
+</style>