光明图片管理系统:基于Koa2+Vue3。博客,当然,在写博客的时候,会涉及到在博文中插入图片,所以常用来管理图片资源。市面上比较流行的图床是PicGo,它是一款使用electron-vue开发的桌面应用,所以每次都要下载、安装、配置图床,比较麻烦。因此开发了这个轻快的影像管理系统,它基于vue3.x+typescript+vite+koa+mysql将影像床系统前后端分离。使用该系统不需要每次都配置像床。前端使用Vue3.x+Vite3.x+typescript+Element-plus,后端使用Koa2+typescript+mysql进行开发,使用Jwt+koa-ts-controllers进行登录验证和权限验证。内置图片上传功能
支持多图上传、拖拽上传、粘贴上传、一键复制多种格式的图片外链。图片管理
管理上传的图片,支持文件重命名、移动到指定相册、删除图片、预览图片等桶管理
支持多桶存储,可同时添加多个对象存储桶管理的时间,没有上限,例如:七牛云对象存储、阿里云对象存储、腾讯云对象存储等,系统会统计每个桶中的图片数量和使用的存储量。还支持控制是否在上传区显示bucket。相册管理
支持相册管理,可以对图片进行分组分类管理,方便用户对不同图片进行分类管理,也支持直接上传图片到相册。操作日志管理
完善的可视化日志功能,记录所有用户操作,方便事件追溯。普通用户只能查看自己的操作记录,管理员可以查看所有人员的操作记录。同时,数据统计中贡献图的数据来源也从操作记录中提取出来。个人信息维护
用户可以对自己的头像(系统有4组不同尺寸的头像供选择)、昵称、职业、性别、个人资料、个人登录密码等信息进行维护管理。数据统计
系统提供数据统计功能,统计用户的图片数、存储桶数、总占用存储量、相册数和系统贡献数据。使用习惯配置
考虑到每个用户不同的使用习惯,系统提供了一个使用习惯配置中心,可以配置默认复制图片链接格式、自定义链接格式、常用快捷键配置、是否启用上传成功提示,复制链接成功提示等配置。用户管理
多用户管理,可以根据不同的角色管理不同的数据,可以通过自助注册或管理员在管理页面直接创建用户。桶源管理
桶管理是管理员用来管理桶源的相关配置,比如七牛云对象存储,需要用户在界面上感知哪些数据需要填写哪些数据是requiredItems和smartreminders实际配置了什么数据来配置bucket有什么metadata。同时还提供了是否启用或禁用的功能。例如,如果一个对象存储已经退出市场,管理员可以配置禁用该操作,这样用户就不能创建该类型的桶。词典管理
维护了系统中经常使用的一些相对固定的数据,如个人中心职业、用户性别、存储桶页面等。不同的存储桶显示不同的图标和其他数据维护。系统设置
维护系统中一些常用的数据,包括系统名称、系统标志、记录信息、更新日志,以及配置系统使用的图标来源。权限控制
完善的权限控制功能,不同的角色可以分配不同的操作权限,并控制相应的删除和查看。在线体验在线演示地址:http://picture.itchenliang.club/#/
帐号:guest@163.com
密码:000000环境节点版本>=14.17.6Mysql版本>=5.7typescript版本>=4.8.4安装安装步骤1.安装node到node官网下载node.exe安装或者使用nrm安装。2.安装git去Git官网下载安装git,这一步可以忽略。3.安装typescript、nodemon和ts-node,使用以下命令全局安装typescript:npminstalltypescript-gnpminstallnodemon-gnpminstallts-node-g4。克隆代码使用gitclone命令将代码克隆到本地,或者直接下载压缩包到本地解压5.依赖安装#前端依赖安装cdclientnpminstall#服务端依赖安装cdservernpminstall6.项目启动#前端项目启动cdclientnpmrundev#服务器启动cdservernpmrunstart控制台出现如下图,表示启动成功
7.项目打包部署koa项目可以不打包部署,直接将server目录下的所有内容复制到服务器上,然后执行上面的安装步骤。#前端项目打包部署cdclientnpmrunbuild将打包后生成的dist目录下的所有内容复制到web服务器。预览登录注册忘记密码上传专区图片管理桶管理相册管理操作日志个人中心使用习惯配置数据统计用户管理桶源管理字典管理系统设置更新日志
