|
|
@@ -35,6 +35,7 @@ import type { InferResponseType, InferRequestType } from 'hono/client';
|
|
|
import { uploadFile } from '@/client/utils/minio';
|
|
|
import ReactQuill from 'react-quill-new';
|
|
|
import 'react-quill-new/dist/quill.snow.css';
|
|
|
+import FileSelector from '@/client/admin/components/FileSelector';
|
|
|
|
|
|
const { Search } = Input;
|
|
|
const { Option } = Select;
|
|
|
@@ -68,6 +69,8 @@ const PolicyNewsPage: React.FC = () => {
|
|
|
category: '',
|
|
|
isFeatured: undefined,
|
|
|
});
|
|
|
+ const [fileSelectorVisible, setFileSelectorVisible] = useState(false);
|
|
|
+ const [currentImageField, setCurrentImageField] = useState<string>('images');
|
|
|
|
|
|
const [form] = Form.useForm();
|
|
|
|
|
|
@@ -249,6 +252,19 @@ const PolicyNewsPage: React.FC = () => {
|
|
|
}
|
|
|
};
|
|
|
|
|
|
+ // 处理文件选择
|
|
|
+ const handleFileSelect = (file: any) => {
|
|
|
+ const currentImages = form.getFieldValue('images') || [];
|
|
|
+ const newImages = [...currentImages, file.fullUrl];
|
|
|
+ form.setFieldsValue({ images: newImages });
|
|
|
+ setFileSelectorVisible(false);
|
|
|
+ };
|
|
|
+
|
|
|
+ // 打开文件选择器
|
|
|
+ const openFileSelector = () => {
|
|
|
+ setFileSelectorVisible(true);
|
|
|
+ };
|
|
|
+
|
|
|
// 打开编辑模态框
|
|
|
const handleEdit = (record: PolicyNewsItem) => {
|
|
|
setEditingRecord(record);
|
|
|
@@ -651,30 +667,48 @@ const PolicyNewsPage: React.FC = () => {
|
|
|
valuePropName="fileList"
|
|
|
getValueFromEvent={normFile}
|
|
|
>
|
|
|
- <Upload
|
|
|
- name="file"
|
|
|
- multiple
|
|
|
- maxCount={5}
|
|
|
- accept="image/*"
|
|
|
- customRequest={async ({ file, onSuccess, onError }) => {
|
|
|
- try {
|
|
|
- const url = await handleImageUpload(file as File);
|
|
|
- if (url) {
|
|
|
- onSuccess?.(url);
|
|
|
- } else {
|
|
|
- onError?.(new Error('上传失败'));
|
|
|
- }
|
|
|
- } catch (error) {
|
|
|
- onError?.(error as Error);
|
|
|
- }
|
|
|
- }}
|
|
|
- listType="picture-card"
|
|
|
- >
|
|
|
+ <Space direction="vertical" style={{ width: '100%' }}>
|
|
|
<div>
|
|
|
- <PlusOutlined />
|
|
|
- <div style={{ marginTop: 8 }}>上传</div>
|
|
|
+ <Button
|
|
|
+ type="primary"
|
|
|
+ icon={<PlusOutlined />}
|
|
|
+ onClick={openFileSelector}
|
|
|
+ style={{ marginRight: 8 }}
|
|
|
+ >
|
|
|
+ 从文件库选择
|
|
|
+ </Button>
|
|
|
+ <Button
|
|
|
+ type="dashed"
|
|
|
+ onClick={() => form.setFieldsValue({ images: [] })}
|
|
|
+ >
|
|
|
+ 清空图片
|
|
|
+ </Button>
|
|
|
</div>
|
|
|
- </Upload>
|
|
|
+ <Upload
|
|
|
+ name="file"
|
|
|
+ multiple
|
|
|
+ maxCount={5}
|
|
|
+ accept="image/*"
|
|
|
+ customRequest={async ({ file, onSuccess, onError }) => {
|
|
|
+ try {
|
|
|
+ const url = await handleImageUpload(file as File);
|
|
|
+ if (url) {
|
|
|
+ onSuccess?.(url);
|
|
|
+ } else {
|
|
|
+ onError?.(new Error('上传失败'));
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ onError?.(error as Error);
|
|
|
+ }
|
|
|
+ }}
|
|
|
+ listType="picture-card"
|
|
|
+ >
|
|
|
+ <div>
|
|
|
+ <PlusOutlined />
|
|
|
+ <div style={{ marginTop: 8 }}>直接上传</div>
|
|
|
+ </div>
|
|
|
+ </Upload>
|
|
|
+ </Space>
|
|
|
</Form.Item>
|
|
|
|
|
|
<Form.Item label="资讯内容">
|
|
|
@@ -697,6 +731,17 @@ const PolicyNewsPage: React.FC = () => {
|
|
|
</Space>
|
|
|
</Form.Item>
|
|
|
</Form>
|
|
|
+
|
|
|
+ {/* 文件选择器模态框 */}
|
|
|
+ <FileSelector
|
|
|
+ visible={fileSelectorVisible}
|
|
|
+ onCancel={() => setFileSelectorVisible(false)}
|
|
|
+ onSelect={handleFileSelect}
|
|
|
+ accept="image/*"
|
|
|
+ maxSize={5}
|
|
|
+ uploadPath="/policy-news"
|
|
|
+ uploadButtonText="上传新图片"
|
|
|
+ />
|
|
|
</Modal>
|
|
|
</div>
|
|
|
);
|