简介
结合百度网盘和阿里网盘创作使用,技术栈为:vue+vite+ts+antd。
主要功能有文件列表、文件上传、回收站、分享等等

传输列表(难点)
上传使用分片上传,具体功能有暂停上传,断点续传,取消上传,批量上传时实现异步上传
大致流程:
- 定义切片大小,异步时一次性可上传数量
- 使用FileReader进行文件切片
- 使用异步进行上传,方便后面进行异步控制,每上传一次切片内容就修改一次传输列表进度,全部上传成功后刷新列表(节流处理)

权限设置
新增公共文件区域,可单独设置权限

文件列表
文件列表分为列表模式和大图模式


选择框和文件详情
点击选择框选择后上方会出现可批量操作方式,选择一个内容是,右侧文件详情会显示文件信息,选择多个时重命名选项会去除

分享
分享分为两步:
- 设置公开链接和私密链接,同时可以设置链接过期时间

- 生成链接,如果是私密链接的话会生成提取码,这时仍可修改过期时间

下载
下载使用链接的形式去下载,这样的好处是可以使用浏览器自带的下载进度

删除
重命名
复制
点击复制图标弹出窗口,可在此选择文件路径,复制一份到该位置

移动
同复制,不同处在于会直接修改文件的所在路径,不会再生成一份
回收站
回收站有列表,还原,批量还原,清空,删除等功能;
还原,批量还原,清空,删除会有二次确认框,在回收站删除后会永久删除
文件分享列表
分享列表
显示已分享列表,有复制口令,取消分享,批量取消分享等功能;

分享详情
点击列表会出现对应的分享详情,可查看分享的具体详情,点击查看分享列表可跳转至对应接收分享的页面,

分享接收页面
私密分享
私密分享需要输入提取码,同时如果分享时间过期会停留在下图页面,只显示文件已过期

具体分享内容
功能有分享列表,转存,下载,批量下载,保存到我的云盘等功能

该系统采用Vue、Vite和TypeScript技术栈,实现了文件列表、上传(支持分片上传、断点续传)、权限设置、文件分享(公开和私密)、下载、删除、重命名、复制和移动功能。此外,还包括回收站管理和分享链接的详细控制,如设置过期时间、提取码等。
1138





