# zhy-picture-frontend

**Repository Path**: zhyzyy2121/zhy-picture-frontend

## Basic Information

- **Project Name**: zhy-picture-frontend
- **Description**: 基于 Vue 3 + Spring Boot + COS + WebSocket 的 企业级智能协同云图库平台。
- **Primary Language**: Unknown
- **License**: MulanPSL-2.0
- **Default Branch**: master
- **Homepage**: https://zhydoc.com/picture/
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2025-09-10
- **Last Updated**: 2025-09-16

## Categories & Tags

**Categories**: Uncategorized

**Tags**: Vue, Axios, WebSocket, TypeScript

## README

<h1 align="center" style="margin: 30px 0 30px; font-weight: bold;">HY 映像</h1>
<h4 align="center">云图库系统</h4>
<p align="center">
<a href='https://gitee.com/zhyzyy2121/zhy-picture-frontend/stargazers'>
<img src='https://gitee.com/zhyzyy2121/zhy-picture-frontend/badge/star.svg?theme=dark' alt='star'>
</a>
<a href="#公众号"><img src="https://img.shields.io/badge/公众号-随缘而愈-orange.svg?style=plasticr"></a>
<a href="https://gitee.com/zhyzyy2121/zhy-picture-frontend">
<img src="https://img.shields.io/badge/version-v0.0.1-red.svg">
</a>
</p>

### ✨项目简介

HY 映像-云图库系统基于 Vue 3 + Spring Boot + COS + WebSocket 的 企业级智能协同云图库平台。
本平台提供一站式的智能图像管理解决方案，既能作为个人用户珍藏记忆、展示作品的私有云相册与网盘，实现图片的批量管理、智能检索和高效编辑；也能为团队赋能，通过创建共享空间实现成员的实时协同编辑与文件共享，极大提升工作效率；同时更支持企业级的商业服务应用，如打造专属的数字资产库、活动相册或内部素材中心，充分挖掘图像的商业价值。


在线体验地址：https://zhydoc.com/picture

文档地址：
https://zhy-picture.apifox.cn/

密码：520520

### 2、核心技术

| 基础框架：SpringBoot + Vue 3 + COS + WebSocket |
|-------------------------------------------|
| 数据缓存：Redis guava                          |
| 数据库：Mysql                                 |
| 查找引擎：ElasticSearch                        |
| OSS服务：minio/aliyun/七牛云                    |
| CICD工具：jenkins                            |
| 权限认证框架：Sa-Token                           |

### 🔥技术选型(简易版)
#### 后端 
* Java Spring Boot 框架
* MySQL 数据库 + MyBatis-Plus 框架 + MyBatis X
* Redis 分布式缓存 + Caffeine 本地缓存
* Jsoup 数据抓取
* ⭐️ COS 对象存储
* ⭐️ ShardingSphere 分库分表
* ⭐️ Sa-Token 权限控制
* ⭐️ DDD 领域驱动设计
* ⭐️ WebSocket 双向通信
* ⭐️ Disruptor 高性能无锁队列
* ⭐️ JUC 并发和异步编程
* ⭐️ AI 绘图大模型接入
* ⭐️ 多种设计模式的运用
* ⭐ 多角度项目优化：性能、成本、安全性等
#### 前端
* Vue 3 框架
* Vite 打包工具
* Ant Design Vue 组件库
* Axios 请求库
* Pinia 全局状态管理
* 其他组件：数据可视化、图片编辑等
* ⭐️ 前端工程化：ESLint + Prettier + TypeScript
* ⭐ OpenAPI 前端代码生成

### 功能模块
#### 用户登录/注册
* 本项目在此处借助了Sa-token进行辅助校验用户登录，注册加入注册码进行用户限制，目前项目仅个人使用。
<p>
<a href="/images/01.png"><img src="/images/01.png" alt="01.png" border="0" /></a>
</p>

<p>
<a href="/images/02.png"><img src="/images/02.png" alt="02.png" border="0" /></a>
</p>

#### 公共图片
* 在公共图片模块当中，可以预览一些全员可见的图片资源。

<img src="https://gitee.com/zhyzyy2121/zhy-picture-frontend/raw/master/images/03.gif" />

#### 图片下载
* 在图片信息的详情页面提供了图片下载的功能按钮供用户使用。

<img src="https://gitee.com/zhyzyy2121/zhy-picture-frontend/raw/master/images/04.gif" />

#### 图片管理
* 管理员可以通过这一界面对上传到服务器中的图片进行管理，只有通过审核的图片才会显示到页面中去。
<p>
<a href="/images/05.png"><img src="/images/05.png" alt="05.png" border="0" /></a>
</p>

#### 用户管理
* 管理员可以通过这一界面对所有用户进行管理。
<p>
<a href="/images/06.png"><img src="/images/06.png" alt="06.png" border="0" /></a>
</p>

#### 图片上传（AI扩图）
* 这部分处了正常的上传图片之外，还有AI绘图的功能。
<p>
<a href="/images/07.png"><img src="/images/07.png" alt="07.png" border="0" /></a>
</p>

#### 空间管理
* 空间管理可以对空间资源进行管理。
<p>
<a href="/images/08.png"><img src="/images/08.png" alt="08.png" border="0" /></a>
</p>

#### 分析模块
* 通过后台进行分析，将一些数据结果以图表返回前端页面。
<p>
<a href="/images/09.png"><img src="/images/09.png" alt="09.png" border="0" /></a>
</p>

#### 图片抓取
* 通过一些手段实现，批量搜索图片的功能。
<p>
<a href="/images/10.png"><img src="/images/10.png" alt="10.png" border="0" /></a>
</p>
<p>
<a href="/images/11.png"><img src="/images/11.png" alt="11.png" border="0" /></a>
</p>

#### ☀️添砖加瓦
欢迎大家提issue一起完善，以及提供各种宝贵建议，

## Find Me🤡
[![Blog](https://img.shields.io/badge/-blog（duktig.cn）-c14438?style=flat-square&logo=B&logoColor=white)](https://yuan-doc.inscode.cc/#/)
[![Github](https://img.shields.io/github/followers/duktig666?label=Github&style=social)](https://github.com/yyzhyds)
[![Gitee](https://img.shields.io/badge/-Gitee-EA4335?style=flat-square&logo=Gitee&logoColor=white)](https://gitee.com/zhyzyy2121)
[![CSDN](https://img.shields.io/badge/-CSDN-c14438?style=flat-square&logo=C&logoColor=white)](https://blog.csdn.net/m0_71566302?spm=1010.2135.3001.5343)
[![Email](https://img.shields.io/badge/gmail-zhao_hao_yu@qq.com-Green?style=flat-square&logo=Gmail&logoColor=white&link=mailto:zhao_hao_yu@qq.com)](mailto:1908721295@qq.com)


### 公众号
微信搜索 【随缘而愈】 关注我的公众号
<p>
<a href="/images/wei.png"><img src="/images/wei.png" alt="wei.png" border="0" /></a>
</p>