feat: 统一管理端弹窗与内容区交互样式

- 收敛管理端公共 Modal 链路，新增表单弹窗与普通内容弹窗包装\n- 迁移 Bot、知识库、插件、工作流、资源、MCP、数据中枢与系统管理页面级弹窗\n- 统一内容区工具栏、列表容器、导航与顶部按钮的视觉密度和交互节奏

easyflow-ui-admin/app/src/components/upload/UploadAvatar.vue

@@ -25,6 +25,18 @@ const props = defineProps({
     default: () => ['image/gif', 'image/jpeg', 'image/png', 'image/webp'],
   },
   modelValue: { type: String, default: '' },
+  shape: {
+    type: String,
+    default: 'circle',
+  },
+  size: {
+    type: Number,
+    default: 100,
+  },
+  theme: {
+    type: String,
+    default: 'default',
+  },
 });
 
 const emit = defineEmits(['success', 'update:modelValue']);
@@ -77,6 +89,11 @@ const beforeAvatarUpload: UploadProps['beforeUpload'] = (rawFile) => {
 <template>
   <ElUpload
     class="avatar-uploader"
+    :class="[
+      `avatar-uploader--${props.theme}`,
+      { 'avatar-uploader--rounded': props.shape === 'rounded' },
+    ]"
+    :style="{ '--avatar-size': `${props.size}px` }"
     :action="`${apiURL}${props.action}`"
     :headers="headers"
     :show-file-list="false"
@@ -96,30 +113,65 @@ const beforeAvatarUpload: UploadProps['beforeUpload'] = (rawFile) => {
 <style scoped>
 .avatar-uploader .avatar {
   display: block;
-  width: 100px;
-  height: 100px;
+  width: var(--avatar-size);
+  height: var(--avatar-size);
 }
 </style>
 
 <style>
 .avatar-uploader .el-upload {
+  width: var(--avatar-size);
+  height: var(--avatar-size);
+  display: flex;
+  align-items: center;
+  justify-content: center;
   position: relative;
   overflow: hidden;
   cursor: pointer;
-  border: 1px solid #e6e9ee;
+  border: 1px solid hsl(var(--input) / 0.92);
   border-radius: 50%;
-  transition: var(--el-transition-duration-fast);
+  background: hsl(var(--modal-surface-strong) / 0.92);
+  box-shadow:
+    inset 0 1px 0 hsl(0 0% 100% / 0.72),
+    0 16px 28px -24px hsl(var(--foreground) / 0.24);
+  transition:
+    transform var(--el-transition-duration-fast),
+    border-color var(--el-transition-duration-fast),
+    box-shadow var(--el-transition-duration-fast);
 }
 
 .avatar-uploader .el-upload:hover {
-  border-color: var(--el-color-primary);
+  border-color: hsl(var(--primary) / 0.52);
+  transform: translateY(-1px);
+  box-shadow:
+    inset 0 1px 0 hsl(0 0% 100% / 0.76),
+    0 20px 36px -26px hsl(var(--modal-preview-glow) / 0.3);
+}
+
+.avatar-uploader--soft-panel .el-upload {
+  background:
+    radial-gradient(
+      circle at top,
+      hsl(var(--modal-preview-glow) / 0.14),
+      transparent 60%
+    ),
+    linear-gradient(
+      145deg,
+      hsl(var(--modal-preview-surface) / 0.98),
+      hsl(var(--modal-preview-surface-strong) / 0.9)
+    );
+  border-color: hsl(var(--modal-preview-border) / 0.9);
+}
+
+.avatar-uploader--rounded .el-upload {
+  border-radius: 26px;
 }
 
 .el-icon.avatar-uploader-icon {
-  width: 100px;
-  height: 100px;
+  width: var(--avatar-size);
+  height: var(--avatar-size);
   font-size: 28px;
-  color: var(--el-text-color-secondary);
+  color: hsl(var(--text-muted));
   text-align: center;
 }
 </style>