feat(web): 添加 MediaPicker 组件并集成到 ArticleEditor 封面图选择

apps/web/src/pages/health/ArticleEditor.tsx

@@ -1,7 +1,7 @@
 import { useEffect, useState, useCallback, useMemo } from 'react';
 import { useParams, useNavigate } from 'react-router-dom';
 import { Button, Input, Select, Space, message, Spin, Upload } from 'antd';
-import { ArrowLeftOutlined, SaveOutlined, SendOutlined, UploadOutlined } from '@ant-design/icons';
+import { ArrowLeftOutlined, SaveOutlined, SendOutlined, UploadOutlined, PictureOutlined } from '@ant-design/icons';
 import { Editor, Toolbar } from '@wangeditor/editor-for-react';
 import type { IDomEditor, IEditorConfig, IToolbarConfig } from '@wangeditor/editor';
 import {
@@ -13,7 +13,8 @@ import {
 } from '../../api/health/articles';
 import { useThemeMode } from '../../hooks/useThemeMode';
 import { AuthButton } from '../../components/AuthButton';
-import client, { handleApiError } from '../../api/client';
+import MediaPicker from '../../components/MediaPicker';
+import { handleApiError } from '../../api/client';
 import { uploadFile } from '../../api/upload';
 import '@wangeditor/editor/dist/css/style.css';
 
@@ -42,6 +43,7 @@ export default function ArticleEditor() {
   const [loading, setLoading] = useState(false);
   const [saving, setSaving] = useState(false);
   const [editor, setEditor] = useState<IDomEditor | null>(null);
+  const [mediaPickerOpen, setMediaPickerOpen] = useState(false);
 
   // 加载分类和标签
   useEffect(() => {
@@ -458,6 +460,9 @@ export default function ArticleEditor() {
                 placeholder="请输入封面图片 URL 或上传文件"
                 style={{ flex: 1 }}
               />
+              <Button icon={<PictureOutlined />} onClick={() => setMediaPickerOpen(true)}>
+                媒体库
+              </Button>
               <Upload
                 accept="image/*"
                 showUploadList={false}
@@ -538,6 +543,15 @@ export default function ArticleEditor() {
           </div>
         </div>
       </div>
+
+      <MediaPicker
+        open={mediaPickerOpen}
+        onClose={() => setMediaPickerOpen(false)}
+        onSelect={(url) => {
+          setCoverImage(url);
+          message.success('已选择封面图');
+        }}
+      />
     </div>
   );
 }