docs: update images

This commit is contained in:
三刀
2021-04-12 10:05:55 +08:00
parent 89505d63c3
commit 1891c2053b
9 changed files with 20 additions and 20 deletions

View File

@@ -1,6 +1,6 @@
`hyperf-admin`是前后端分离的后台管理系统, 前端基于`vue``vue-admin-template`, 针对后台业务`列表`, `表单`等场景封装了大量业务组件, 后端基于`hyperf`实现, 整体思路是后端定义页面渲染规则, 前端页面渲染时首先拉取配置, 然后组件根据具体配置完成页面渲染, 方便开发者仅做少量的配置工作就能完成常见的`CRUD`工作, 同时支持自定义组件和自定义页面, 以开发更为复杂的页面. `hyperf-admin`是前后端分离的后台管理系统, 前端基于`vue``vue-admin-template`, 针对后台业务`列表`, `表单`等场景封装了大量业务组件, 后端基于`hyperf`实现, 整体思路是后端定义页面渲染规则, 前端页面渲染时首先拉取配置, 然后组件根据具体配置完成页面渲染, 方便开发者仅做少量的配置工作就能完成常见的`CRUD`工作, 同时支持自定义组件和自定义页面, 以开发更为复杂的页面.
![hyperf-admin架构](https://cdn.jsdelivr.net/gh/daodao97/FigureBed@master/uPic/sJaJti.png) ![hyperf-admin架构](https://gitee.com/daodao97/asset/raw/master/uPic/sJaJti.png)
前端为`vue multiple page`多页模式, 可以按模块打包, 默认包含两个模块`default` 默认模块, `system`系统管理模块, 绝大部分业务组件在`src/components`目录, 前端文档详见 [这里](/frontend/form) 前端为`vue multiple page`多页模式, 可以按模块打包, 默认包含两个模块`default` 默认模块, `system`系统管理模块, 绝大部分业务组件在`src/components`目录, 前端文档详见 [这里](/frontend/form)
@@ -22,7 +22,7 @@
后端的详细文档见[这里](/backend/scaffold) 后端的详细文档见[这里](/backend/scaffold)
### UI预览 ### UI预览
![样式预览](https://cdn.jsdelivr.net/gh/daodao97/FigureBed@master/uPic/FW2cCN.png) ![样式预览](https://gitee.com/daodao97/asset/raw/master/uPic/FW2cCN.png)
## 依赖 & 参考 ## 依赖 & 参考

View File

@@ -60,7 +60,7 @@ php bin/hyperf.php
可以查看到相关安装命令 可以查看到相关安装命令
![qIKtC8](https://cdn.jsdelivr.net/gh/daodao97/FigureBed@master/uPic/qIKtC8.png) ![qIKtC8](https://gitee.com/daodao97/asset/raw/master/uPic/qIKtC8.png)
开发环境执行相应命令, 安装依赖的`db`结构即可, 在此之前请先确认`.env` 中已配置好相应连接信息. 开发环境执行相应命令, 安装依赖的`db`结构即可, 在此之前请先确认`.env` 中已配置好相应连接信息.

View File

@@ -2,7 +2,7 @@
针对 数据库, `Model`, `Controller` 通用模型, 可以使用后台提供的`代码生成工具`来初始化大部分代码. 针对 数据库, `Model`, `Controller` 通用模型, 可以使用后台提供的`代码生成工具`来初始化大部分代码.
![9fnAUL(1)](https://cdn.jsdelivr.net/gh/daodao97/FigureBed@master/uPic/9fnAUL%20%281%29.png) ![9fnAUL(1)](https://gitee.com/daodao97/asset/raw/master/uPic/9fnAUL%20%281%29.png)
连接池对应`config.autoload.databases` 中配置的可用链接, 选择好`连接池`, `数据库`, `表` 后下方表单会根据表结构字段渲染, 完成具体字段的配置, 点击提交. 连接池对应`config.autoload.databases` 中配置的可用链接, 选择好`连接池`, `数据库`, `表` 后下方表单会根据表结构字段渲染, 完成具体字段的配置, 点击提交.

View File

@@ -36,7 +36,7 @@ CREATE TABLE `config_center` (
#### 2. 创建 `Controller`, `Model` #### 2. 创建 `Controller`, `Model`
![wlXctg](https://cdn.jsdelivr.net/gh/daodao97/FigureBed@master/uPic/wlXctg.png) ![wlXctg](https://gitee.com/daodao97/asset/raw/master/uPic/wlXctg.png)
此时基础文件已经生成在`lib/` 下, 作为一个`composer`包模式开发, 我们将其转移至 `/opt/hyperf-admin/config-center`目录 此时基础文件已经生成在`lib/` 下, 作为一个`composer`包模式开发, 我们将其转移至 `/opt/hyperf-admin/config-center`目录
@@ -73,7 +73,7 @@ CREATE TABLE `config_center` (
#### 3. 添加菜单 注册路由 #### 3. 添加菜单 注册路由
![uAR5lj](https://cdn.jsdelivr.net/gh/daodao97/FigureBed@master/uPic/uAR5lj.png) ![uAR5lj](https://gitee.com/daodao97/asset/raw/master/uPic/uAR5lj.png)
```php ```php
<?php <?php
@@ -87,7 +87,7 @@ register_route('/config_center', ConfigCenterController::class);
?> 若配置有不生效的情况, 执行 `rm vendor/hyperf-admin/config-center && composer require hyperf-admin/config-center` 重新安装即可 ?> 若配置有不生效的情况, 执行 `rm vendor/hyperf-admin/config-center && composer require hyperf-admin/config-center` 重新安装即可
![EFvajy](https://cdn.jsdelivr.net/gh/daodao97/FigureBed@master/uPic/EFvajy.png) ![EFvajy](https://gitee.com/daodao97/asset/raw/master/uPic/EFvajy.png)
至此已经完成了, 配置的`CRUD`. 至此已经完成了, 配置的`CRUD`.

View File

@@ -8,16 +8,16 @@
所以我们的服务一步步的变得膨胀, 变得不稳定, 是时候做出改变了 所以我们的服务一步步的变得膨胀, 变得不稳定, 是时候做出改变了
![Biv9dV](https://cdn.jsdelivr.net/gh/daodao97/FigureBed@master/uPic/Biv9dV.png) ![Biv9dV](https://gitee.com/daodao97/asset/raw/master/uPic/Biv9dV.png)
我们将一些业务边界比较明显, 比较独立的功能, 以微服务的方式拆分出去, 然后注册到主项目上去, 这样我们就可以达到, 既使用一套ui, 又进行服务拆分的目的啦. 我们将一些业务边界比较明显, 比较独立的功能, 以微服务的方式拆分出去, 然后注册到主项目上去, 这样我们就可以达到, 既使用一套ui, 又进行服务拆分的目的啦.
`remote_module`的注册也十分简单, `http://localhost:9528/system/#/cconf/cconf_website_config` 在站点管理中增加相应模块的配置即可 `remote_module`的注册也十分简单, `http://localhost:9528/system/#/cconf/cconf_website_config` 在站点管理中增加相应模块的配置即可
![1DIbj0](https://cdn.jsdelivr.net/gh/daodao97/FigureBed@master/uPic/1DIbj0.png) ![1DIbj0](https://gitee.com/daodao97/asset/raw/master/uPic/1DIbj0.png)
然后在`菜单管理`中, 增加相应的模块菜单即可使用啦. 然后在`菜单管理`中, 增加相应的模块菜单即可使用啦.
?> 注意 `remote_module` 必须基于`hyperf-admin/admin` 组件构建哦 ?> 注意 `remote_module` 必须基于`hyperf-admin/admin` 组件构建哦
?> 另外, 主的`HyperfAdmin`项目, 默认包含两个本地模块, `default`, `system` ?> 另外, 主的`HyperfAdmin`项目, 默认包含两个本地模块, `default`, `system`

View File

@@ -3,9 +3,9 @@
我们以 `用户管理` 这个页面功能为例, 讲解如何使用此功能. 我们以 `用户管理` 这个页面功能为例, 讲解如何使用此功能.
先上效果图 先上效果图
![MXURtd](https://cdn.jsdelivr.net/gh/daodao97/FigureBed@master/uPic/MXURtd.png) ![MXURtd](https://gitee.com/daodao97/asset/raw/master/uPic/MXURtd.png)
![rs0BhV](https://cdn.jsdelivr.net/gh/daodao97/FigureBed@master/uPic/rs0BhV.png) ![rs0BhV](https://gitee.com/daodao97/asset/raw/master/uPic/rs0BhV.png)
此时我们只用配置好脚手架配置,即可为第三方服务提供后台页面的管理功能 此时我们只用配置好脚手架配置,即可为第三方服务提供后台页面的管理功能
```json ```json

View File

@@ -1,4 +1,4 @@
我们使用微信群进行交流, 由于群二维码经常过期, 请添加下方个人微信, 拉你进群. 我们使用微信群进行交流, 由于群二维码经常过期, 请添加下方个人微信, 拉你进群.
![WechatIMG7](https://cdn.jsdelivr.net/gh/daodao97/FigureBed@master/uPic/WechatIMG7.jpeg ':size=50%') ![WechatIMG7](https://gitee.com/daodao97/asset/raw/master/uPic/WechatIMG7.jpeg ':size=50%')

View File

@@ -2,7 +2,7 @@
### 架构 ### 架构
![hyperf-admin架构](https://cdn.jsdelivr.net/gh/daodao97/FigureBed@master/uPic/sJaJti.png) ![hyperf-admin架构](https://gitee.com/daodao97/asset/raw/master/uPic/sJaJti.png)
前端为`vue multiple page`多页模式, 可以按模块打包, 默认包含两个模块`default` 默认模块, `system`系统管理模块, 绝大部分业务组件在`src/components`目录, 前端文档详见 [这里](/frontend/form) 前端为`vue multiple page`多页模式, 可以按模块打包, 默认包含两个模块`default` 默认模块, `system`系统管理模块, 绝大部分业务组件在`src/components`目录, 前端文档详见 [这里](/frontend/form)
@@ -24,7 +24,7 @@
后端的详细文档见[这里](/backend/scaffold) 后端的详细文档见[这里](/backend/scaffold)
### UI预览 ### UI预览
![样式预览](https://cdn.jsdelivr.net/gh/daodao97/FigureBed@master/uPic/FW2cCN.png) ![样式预览](https://gitee.com/daodao97/asset/raw/master/uPic/FW2cCN.png)
### 依赖 & 参考 ### 依赖 & 参考

View File

@@ -48,13 +48,13 @@ CREATE TABLE `student_score` (
2. 通过`DevTools`开发者工具创建 `student_score` 相关的 `Model`, `Controller` 2. 通过`DevTools`开发者工具创建 `student_score` 相关的 `Model`, `Controller`
![YPdEli](https://cdn.jsdelivr.net/gh/daodao97/FigureBed@master/uPic/YPdEli.png) ![YPdEli](https://gitee.com/daodao97/asset/raw/master/uPic/YPdEli.png)
选择好相应的表后, 点击提交, 此时工具已经帮我们创建好相应的`app/Controller/StudentScoreController.php`和`app/Model/Test/StudentScore.php` 选择好相应的表后, 点击提交, 此时工具已经帮我们创建好相应的`app/Controller/StudentScoreController.php`和`app/Model/Test/StudentScore.php`
3. 添加目录和菜单 3. 添加目录和菜单
![cs0SYX](https://cdn.jsdelivr.net/gh/daodao97/FigureBed@master/uPic/cs0SYX.png) ![cs0SYX](https://gitee.com/daodao97/asset/raw/master/uPic/cs0SYX.png)
注册路由 注册路由
@@ -65,7 +65,7 @@ CREATE TABLE `student_score` (
此时我们也已经完成了基础的`CRUD`开发 此时我们也已经完成了基础的`CRUD`开发
![MEoM4p](https://cdn.jsdelivr.net/gh/daodao97/FigureBed@master/uPic/MEoM4p.png) ![MEoM4p](https://gitee.com/daodao97/asset/raw/master/uPic/MEoM4p.png)
哦对了, 还有各种筛选条件呢? 也很简单, 在 `scaffoldOptions` 中增加 `filter`配置即可 哦对了, 还有各种筛选条件呢? 也很简单, 在 `scaffoldOptions` 中增加 `filter`配置即可
@@ -84,7 +84,7 @@ CREATE TABLE `student_score` (
} }
``` ```
![u68v1D](https://cdn.jsdelivr.net/gh/daodao97/FigureBed@master/uPic/u68v1D.png) ![u68v1D](https://gitee.com/daodao97/asset/raw/master/uPic/u68v1D.png)
还有, 大家别忘了, 需求中还要去可以按页签显示, 改怎么办呢, 这个ui可有点复杂啊, 不过在`hyperf-admin`里也同样简单 还有, 大家别忘了, 需求中还要去可以按页签显示, 改怎么办呢, 这个ui可有点复杂啊, 不过在`hyperf-admin`里也同样简单
@@ -112,7 +112,7 @@ CREATE TABLE `student_score` (
} }
``` ```
![Ax0WWD](https://cdn.jsdelivr.net/gh/daodao97/FigureBed@master/uPic/Ax0WWD.png) ![Ax0WWD](https://gitee.com/daodao97/asset/raw/master/uPic/Ax0WWD.png)
至此我们已经完成了绝大部分的功能开发, 如果使用熟练, 我们应该能在十分钟内完成整个功能的前后端开发, 而且还支持复杂的前端效果. 至此我们已经完成了绝大部分的功能开发, 如果使用熟练, 我们应该能在十分钟内完成整个功能的前后端开发, 而且还支持复杂的前端效果.