first commit

public/assets/image-uploader-CGZ_xy8d.js

@@ -0,0 +1 @@
+import{Or as e,Tr as t,t as n}from"./jsx-runtime-NwRKtVrk.js";import{t as r}from"./button-CM-rzMOH.js";import{t as i}from"./space-Dvitgohy.js";import{t as a}from"./card-D7XvzVif.js";import{C as o,h as s}from"./index-B7MUL4ct.js";import{t as c}from"./ImageUploader-CHryWmjJ.js";var l=e(t(),1),u=n(),{Title:d,Paragraph:f}=s,p=()=>{let[e]=o.useForm(),[t,n]=(0,l.useState)(null),[p,m]=(0,l.useState)([]);return(0,u.jsxs)(`div`,{children:[(0,u.jsxs)(s,{style:{margin:`12px 0 24px 0`},children:[(0,u.jsx)(d,{level:2,children:`图片上传组件示例`}),(0,u.jsx)(f,{children:`基于 Ant Design Upload 封装的图片上传组件，支持图片剪裁、多张图片上传、尺寸限制、禁用状态等。`})]}),(0,u.jsx)(a,{title:`基础用法`,style:{marginBottom:24},children:(0,u.jsxs)(o,{form:e,layout:`vertical`,children:[(0,u.jsx)(o.Item,{label:`单张图片上传`,name:`avatar`,extra:`支持单张图片上传，最大 5MB，尺寸不超过 1920x1080`,children:(0,u.jsx)(c,{action:`/sys/file/list/upload/image`,mode:`single`,value:t,onChange:e=>n(e)})}),(0,u.jsx)(o.Item,{label:`多张图片上传`,name:`gallery`,extra:`支持最多 5 张图片上传`,children:(0,u.jsx)(c,{action:`/sys/file/list/upload/image`,mode:`multiple`,maxCount:5,value:p,onChange:e=>m(e)})}),(0,u.jsx)(o.Item,{children:(0,u.jsxs)(i,{children:[(0,u.jsx)(r,{type:`primary`,onClick:async()=>{try{let n=await e.validateFields();console.log(`Form values:`,n),console.log(`Single image:`,t),console.log(`Multiple images:`,p)}catch(e){console.error(`Validation failed:`,e)}},children:`提交`}),(0,u.jsx)(r,{onClick:()=>{e.resetFields(),n(null),m([])},children:`重置`})]})})]})}),(0,u.jsx)(a,{title:`高级配置`,style:{marginBottom:24},children:(0,u.jsxs)(o,{layout:`vertical`,children:[(0,u.jsx)(o.Item,{label:`自定义尺寸限制`,extra:`限制图片尺寸为 800x600，大小不超过 2MB`,children:(0,u.jsx)(c,{action:`/sys/file/list/upload/image`,mode:`single`,maxWidth:800,maxHeight:600,maxSize:2})}),(0,u.jsx)(o.Item,{label:`裁剪功能 - 自由裁剪`,extra:`启用裁剪功能，可自由调整裁剪区域`,children:(0,u.jsx)(c,{action:`/sys/file/list/upload/image`,mode:`single`,croppable:!0})}),(0,u.jsx)(o.Item,{label:`裁剪功能 - 1:1 正方形`,extra:`固定 1:1 比例裁剪，适合头像上传`,children:(0,u.jsx)(c,{action:`/sys/file/list/upload/image`,mode:`single`,croppable:!0,cropperOptions:{aspect:1}})}),(0,u.jsx)(o.Item,{label:`裁剪功能 - 圆形裁剪`,extra:`圆形裁剪模式，适合头像上传`,children:(0,u.jsx)(c,{action:`/sys/file/list/upload/image`,mode:`single`,croppable:!0,cropperOptions:{cropShape:`round`,aspect:1}})}),(0,u.jsx)(o.Item,{label:`裁剪功能 - 16:9 宽屏`,extra:`固定 16:9 比例裁剪，适合横幅图片`,children:(0,u.jsx)(c,{action:`/sys/file/list/upload/image`,mode:`single`,croppable:!0,cropperOptions:{aspect:16/9}})}),(0,u.jsx)(o.Item,{label:`禁用状态`,children:(0,u.jsx)(c,{action:`/sys/file/list/upload/image`,mode:`single`,disabled:!0})})]})})]})};export{p as default};