```

feat(FileUploader): 新增头像上传模式支持

添加 isUploadAvatar 属性来支持头像上传的特殊样式和功能，
包括圆形头像展示、无边框上传按钮等定制化需求。

fix(LearnNote): 修复封面图片加载问题

修改 LearnNote 组件中的图片渲染逻辑，将 img 标签包裹在 div
中以确保图片正确显示，避免在图片地址为空时出现错误。

refactor(PersonalCenter): 优化个人信息页面表单布局

调整个人中心页面的表单位置，将头像上传区域提前并重新排列
各表单项的布局结构，移除多余的 el-row 元素。
```

src/components/FileUploader.vue

@@ -1,5 +1,6 @@
 <template>
-  <div class="file-uploader-container" :class="{'hide-upload-btn': !(!limit || fileList.length < limit)}">
+  <div class="file-uploader-container" 
+  :class="{'hide-upload-btn': !(!limit || fileList.length < limit), 'is-upload-avatar': isUploadAvatar}">
     <el-upload
       ref="uploadRef"
       :action="uploadUrl"
@@ -38,7 +39,15 @@
       <template v-else-if="listType === 'picture-card'">
         <!-- 只有当文件数量小于limit且limit大于0时才显示加号按钮 -->
         <!--  v-if="!limit || fileList.length < limit" -->
-        <el-icon v-if="!limit || fileList.length < limit" ><Plus /></el-icon>
+        <el-avatar :size="150" :src="fileList[0]?.url || appStore.avatarDefault" v-if="isUploadAvatar" />
+        <el-icon v-else-if="!limit || fileList.length < limit" ><Plus /></el-icon>
+      </template>
+      <template v-else-if="listType === 'picture-user-card'">
+        <!-- 只有当文件数量小于limit且limit大于0时才显示加号按钮 -->
+        <!--  v-if="!limit || fileList.length < limit" -->
+        <!-- <el-icon v-if="!limit || fileList.length < limit" ><Plus /></el-icon> -->
+        
+  
       </template>
 
       
@@ -167,6 +176,8 @@ import DGTMessage from '@/utils/message'
 import { downloadFile } from '@/utils/util'
 import { useI18n } from 'vue-i18n' 
 const { t } = useI18n() 
+import { useAppStore } from '@/pinia/appStore'
+const appStore = useAppStore();
 // import { 
 //   UploadFilled, 
 //   ZoomIn, 
@@ -277,6 +288,11 @@ const props = defineProps({
   showProgress: {
     type: Boolean,
     default: true
+  },
+  // 是否为头像上传模式（只显示头像预览，不显示上传按钮）
+  isUploadAvatar: {
+    type: Boolean,
+    default: false
   }
 })
 
@@ -563,7 +579,7 @@ defineExpose({
     }
     return fileList.value
   }
-})
+});
 </script>
 
 <style lang="scss">
@@ -573,6 +589,17 @@ defineExpose({
       display: none;
     }
   }
+  &.is-upload-avatar{
+    .el-upload--picture-card{
+      border: none;
+    }
+    .el-upload-list__item{
+      border-radius: 50%;
+    }
+    .el-upload-list__item-thumbnail{
+      object-fit: fill
+    }
+  }
 };
 </style>
 

src/pages/LearnNote/LearnNote.vue

@@ -12,7 +12,9 @@
           @click="selectedItem = item"
           :class="{'active': item.courseId === selectedItem.courseId}"
           v-for="item in list" :key="item.courseId">
-            <img :src="item.coverImageUrl" alt="" class="coverImageUrl border_radius_8 bg_color_f5">
+            <div  class="coverImageUrl border_radius_8 bg_color_f5">
+              <img :src="item.coverImageUrl" alt="" v-if="item.coverImageUrl" class="coverImageUrl border_radius_8">
+            </div>
             <div class="flex_1 ml20">
               <div class="font_size18 bold">{{ item.courseTitle }}</div>
               <div class="font_size14 line2 gray mt10">{{ item.courseIntro }}</div>
@@ -77,7 +79,7 @@ const getList = async () => {
         {
           courseId:'-1',
           courseTitle:'个人笔记',
-          coverImageUrl:appStore.userInfo?.userAvatar || '',
+          coverImageUrl:appStore.userInfo?.userAvatar  || '',
           courseIntro:''
         },
         ...res.rows

src/pages/PersonalCenter.vue

@@ -216,6 +216,18 @@
     <el-dialog v-model="dialogVisible" :title="$t('personalCenter.editProfile')" width="784" :destroy-on-close="true">
       <el-form ref="userFormRef" :model="userInfo" label-width="auto" label-position="top" :rules="rules">
         <el-row :gutter="16">
+          <el-col :span="24">
+            <div class="flex-center">
+
+              <el-form-item label="">
+                <!-- $t('personalCenter.uploadAvatar') -->
+                <!-- 图片类型 -->
+                <FileUploader ref="fileUploader" accept="image/*" :multiple="false" :limit="1" :auto-upload="true"
+                  :isUploadAvatar="true"
+                  list-type="picture-card" :data="{ directory: 'workflow' }" buttonText="" v-model="coverImage" tip="" />
+              </el-form-item>
+            </div>
+          </el-col>
           
            <el-col :span="12">
             <el-form-item :label="$t('personalCenter.nickName')" prop="nickName">
@@ -225,15 +237,7 @@
                 }" maxlength="15" />
             </el-form-item>
           </el-col>
-          <el-col :span="12">
-            <el-form-item :label="$t('personalCenter.uploadAvatar')">
-              <!-- 图片类型 -->
-              <FileUploader ref="fileUploader" accept="image/*" :multiple="false" :limit="1" :auto-upload="true"
-                list-type="picture-card" :data="{ directory: 'workflow' }" buttonText="" v-model="coverImage" tip="" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row :gutter="16">
+         
           <el-col :span="12">
             <el-form-item :label="$t('personalCenter.loginPhone')">
               <el-input :disabled="appStore?.userInfo?.userPhone ? true : false" v-model="userInfo.userPhone"
@@ -257,8 +261,6 @@
               </el-input>
             </el-form-item>
           </el-col>
-        </el-row>
-        <el-row :gutter="16">
           <el-col :span="12">
             <el-form-item :label="$t('personalCenter.loginEmail')">
               <el-input v-model="userInfo.email" :placeholder="$t('workflowTradeAdd.placeholderEmail')"
@@ -283,8 +285,6 @@
               </el-input>
             </el-form-item>
           </el-col>
-        </el-row>
-        <el-row :gutter="16">
           <el-col :span="12">
             <el-form-item :label="$t('personalCenter.n8nAccout')">
               <el-input disabled v-model="userInfo.n8nAccount" :placeholder="$t(!appStore?.userInfo?.email ? 'personalCenter.bdyxjcjzh' : 'personalCenter.createN8n')"
@@ -307,9 +307,6 @@
                 }" readonly type="password" show-password />
             </el-form-item>
           </el-col>
-
-        </el-row>
-        <el-row :gutter="16">
           <el-col :span="12">
             <el-form-item :label="$t('personalCenter.cozeAccout')">
               <el-input disabled v-model="userInfo.cozeAccount" :placeholder="$t(!appStore?.userInfo?.email ? 'personalCenter.bdyxjcjzh' :'personalCenter.createCoze')"
@@ -334,8 +331,6 @@
                 }" readonly type="password" show-password />
             </el-form-item>
           </el-col>
-        </el-row>
-        <el-row :gutter="16">
           <el-col :span="12">
             <el-form-item :label="$t('personalCenter.difyAccout')">
               <el-input disabled v-model="userInfo.difyAccount" :placeholder="$t(!appStore?.userInfo?.email ? 'personalCenter.bdyxjcjzh' :'personalCenter.createDify')"
@@ -359,9 +354,6 @@
                 }" readonly type="password" show-password />
             </el-form-item>
           </el-col>
-        </el-row>
-        <el-row :gutter="16">
-
           <el-col :span="12">
             <el-form-item :label="$t('personalCenter.fastGptAccout')">
               <el-input disabled v-model="userInfo.fastGptAccount" :placeholder="$t(!appStore?.userInfo?.email ? 'personalCenter.bdyxjcjzh' :'personalCenter.createFastGpt')"
@@ -1162,4 +1154,8 @@ div {
 :deep(.el-collapse-item__content) {
   padding: 0 16px 16px;
 }
+
+.w-20 {
+  width: 200px;
+}
 </style>