mirror of
https://gitee.com/dromara/go-view.git
synced 2025-02-24 00:02:51 +08:00
fix: 整理文档
This commit is contained in:
金建
parent
6858f5bd39
commit
0eb75fbba4
173
README.md
173
README.md
@ -4,124 +4,71 @@
|
||||
|
||||
**`master-fetch` 分支是带有后端接口请求的分支**
|
||||
|
||||
**后端项目地址：[https://gitee.com/MTrun/go-view-serve](https://gitee.com/MTrun/go-view-serve)**
|
||||
|
||||
**接口说明地址：[https://docs.apipost.cn/preview/5aa85d10a59d66ce/ddb813732007ad2b?target_id=84dbc5b0-158f-4bcb-8f74-793ac604ada3#3e053622-1e76-43f9-a039-756aee822dbb](https://docs.apipost.cn/preview/5aa85d10a59d66ce/ddb813732007ad2b?target_id=84dbc5b0-158f-4bcb-8f74-793ac604ada3#3e053622-1e76-43f9-a039-756aee822dbb)**
|
||||
### feat-unify-test 分支目标
|
||||
+ 实现 backend 后端工厂
|
||||
将后端业务逻辑集中到 backend 了，控制 BackEndFactory 就可以适配不同的后端。
|
||||
伪代码如下：
|
||||
export const BackEndFactory = ():IBackend=>{
|
||||
switch(项目后端配置){
|
||||
case "无数据库":
|
||||
return new MockBackend() // 等同： -master ，没有存储
|
||||
case "indexdb":
|
||||
return new IndexDbBackend() // 这次开发的，用 indexdb 做测试
|
||||
case "java":
|
||||
return new JavaBackend() // 等同： -fetch， 没 java 环境，还没做
|
||||
case "python":
|
||||
return new PythonBackend() // 自定义开发的后端
|
||||
。。。 其他 oss 、云平台的后端 。。。
|
||||
}}
|
||||
意义：
|
||||
1 unify 统一 -fetch 和 master 分支，消除分支之间的差异。
|
||||
2 方便接入不同的自定义后端平台。
|
||||
3 前端存储功能让测试工作更加方便
|
||||
|
||||
## 使用
|
||||
+ 完善事件处理机制
|
||||
在事件中修改图表配置
|
||||
在事件中修改图表数据
|
||||
在事件中调用图表 exposed 函数
|
||||
数据驱动界面
|
||||
|
||||
所有的接口地址位置：`src\api\path\*`
|
||||
### 试验功能1：Backend 后端工厂
|
||||
+ 对比 -fetch 分支，梳理后端逻辑到 backend 目录的 ibackend 接口
|
||||
+ 登录 - login
|
||||
+ 登出 - logout
|
||||
+ 预览，token 注入或单点登陆 - checkToken
|
||||
+ 显示项目列表和分页 - projectList
|
||||
+ 保存、发布、修改名称 - updateProject
|
||||
+ 复制项目 - copyProject
|
||||
+ 图表内的图片上传 - uploadFile
|
||||
+ 上传图片显示处理 - getFileUrl
|
||||
+ IndexDbBackend 用indexdb浏览器数据库实现了 project 相关所有功能。
|
||||
+ Todo: 统一后端错误处理
|
||||
+ Todo：开发 javabackend，适配现有的后端
|
||||
|
||||
接口地址修改：`.env`
|
||||
### 试验功能2：事件处理机制
|
||||
+ 实现最常用的互动：找到图表元素、显示或隐藏、修改数据
|
||||
+ 核心代码：useLifeHandler.hook.ts
|
||||
+ 在事件代码中通过 runtime 实现运行时刻的图表管理，提供基础函数：
|
||||
+ selectComponents 选择多个图表
|
||||
+ selectOneComponent 选择一个图表
|
||||
+ getChartConfig 读取图表
|
||||
+ setChartConfig 设置图表
|
||||
+ callExposed 调用图表 exposed 的函数
|
||||
+ 以下例子可以在点击事件中加入代码并预览，测试效果。
|
||||
|
||||
### 🤯 后端项目
|
||||
+ 例子1 切换显示名称为 饼图 和 柱状图 的图表：
|
||||
const range = runtime.fn.selectComponents("饼图 柱状图")
|
||||
const h = runtime.fn.getChartConfig(range, "hide")
|
||||
runtime.fn.setChartConfig(range, "hide", !h)
|
||||
|
||||
后端项目gitee地址：[https://gitee.com/MTrun/go-view-serve](https://gitee.com/MTrun/go-view-serve)
|
||||
+ 例子2 修改一个名称 柱状图001 组件id 2wolqibrx3c000 的图表数据，以下两句等效
|
||||
runtime.fn.setChartConfig("柱状图001", "dataset", {"dimensions":["product","data1","data2"],"source":[{"product":"Mon","data1":120,"data2":130}]})
|
||||
runtime.fn.setChartConfig("#2wolqibrx3c000", "dataset", {"dimensions":["product","data1","data2"],"source":[{"product":"Mon","data1":120,"data2":230}]})
|
||||
|
||||
接口说明地址：[https://docs.apipost.cn/preview/5aa85d10a59d66ce/ddb813732007ad2b?target_id=84dbc5b0-158f-4bcb-8f74-793ac604ada3#3e053622-1e76-43f9-a039-756aee822dbb](https://docs.apipost.cn/preview/5aa85d10a59d66ce/ddb813732007ad2b?target_id=84dbc5b0-158f-4bcb-8f74-793ac604ada3#3e053622-1e76-43f9-a039-756aee822dbb)
|
||||
|
||||
```shell
|
||||
# port
|
||||
VITE_DEV_PORT = '8080'
|
||||
|
||||
# development path
|
||||
VITE_DEV_PATH = 'http://127.0.0.1:8080'
|
||||
|
||||
# production path
|
||||
VITE_PRO_PATH = 'http://127.0.0.1:8080'
|
||||
```
|
||||
|
||||
公共前缀修改：`src\settings\httpSetting.ts`
|
||||
|
||||
```shell
|
||||
// 请求前缀
|
||||
export const axiosPre = '/api/goview'
|
||||
```
|
||||
|
||||
接口封装：`src\api\http.ts`
|
||||
|
||||
```ts
|
||||
import axiosInstance from './axios'
|
||||
import { RequestHttpEnum, ContentTypeEnum } from '@/enums/httpEnum'
|
||||
|
||||
export const get = (url: string, params?: object) => {
|
||||
return axiosInstance({
|
||||
url: url,
|
||||
method: RequestHttpEnum.GET,
|
||||
params: params,
|
||||
})
|
||||
+ 例子3 找到一个组并隐藏
|
||||
const c = runtime.fn.selectOneComponent("分组")
|
||||
if(c){
|
||||
console.log(runtime.fn.getChartConfig(c, "isGroup" ))
|
||||
runtime.fn.setChartConfig(c, "hide", true)
|
||||
}
|
||||
|
||||
export const post = (url: string, data?: object, headersType?: string) => {
|
||||
return axiosInstance({
|
||||
url: url,
|
||||
method: RequestHttpEnum.POST,
|
||||
data: data,
|
||||
headers: {
|
||||
'Content-Type': headersType || ContentTypeEnum.JSON
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
export const put = (url: string, data?: object, headersType?: string) => {
|
||||
return axiosInstance({
|
||||
url: url,
|
||||
method: RequestHttpEnum.PUT,
|
||||
data: data,
|
||||
headers: {
|
||||
'Content-Type': headersType || ContentTypeEnum.JSON
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
export const del = (url: string, params?: object) => {
|
||||
return axiosInstance({
|
||||
url: url,
|
||||
method: RequestHttpEnum.DELETE,
|
||||
params
|
||||
})
|
||||
}
|
||||
|
||||
// 获取请求函数，默认get
|
||||
export const http = (type?: RequestHttpEnum) => {
|
||||
switch (type) {
|
||||
case RequestHttpEnum.GET:
|
||||
return get
|
||||
|
||||
case RequestHttpEnum.POST:
|
||||
return post
|
||||
|
||||
case RequestHttpEnum.PUT:
|
||||
return put
|
||||
|
||||
case RequestHttpEnum.DELETE:
|
||||
return del
|
||||
|
||||
default:
|
||||
return get
|
||||
}
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
## 代码提交
|
||||
|
||||
* feat: 新功能
|
||||
* fix: 修复 Bug
|
||||
* docs: 文档修改
|
||||
* perf: 性能优化
|
||||
* revert: 版本回退
|
||||
* ci: CICD集成相关
|
||||
* test: 添加测试代码
|
||||
* refactor: 代码重构
|
||||
* build: 影响项目构建或依赖修改
|
||||
* style: 不影响程序逻辑的代码修改
|
||||
* chore: 不属于以上类型的其他类型(日常事务)
|
||||
|
||||
## 交流
|
||||
|
||||
QQ 群：1030129384
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@ -1,23 +0,0 @@
|
||||
import { useSystemStore } from '@/store/modules/systemStore/systemStore'
|
||||
import { SystemStoreEnum } from '@/store/modules/systemStore/systemStore.d'
|
||||
import { ResultEnum } from '@/enums/httpEnum'
|
||||
import { ossUrlApi } from '@/api/path/'
|
||||
|
||||
|
||||
// * 初始化
|
||||
export const useSystemInit = async () => {
|
||||
const systemStore = useSystemStore()
|
||||
|
||||
// 获取 OSS 信息
|
||||
const getOssUrl = async () => {
|
||||
const res = await ossUrlApi({}) as unknown as MyResponseType
|
||||
if (res.code === ResultEnum.SUCCESS) {
|
||||
systemStore.setItem(SystemStoreEnum.FETCH_INFO, {
|
||||
OSSUrl: res.data?.bucketURL
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// 执行
|
||||
getOssUrl()
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user