diff --git a/README.md b/README.md index 07d8d788..3dbf5d55 100644 --- a/README.md +++ b/README.md @@ -1,30 +1,62 @@ -## 总览 +#### 总览 +

+ go-view +

-![logo](readme/logo-t-y.png) +

开源、精美、便捷的「数据可视化」低代码开发平台

-GoView 是一个高效的拖拽式低代码数据可视化开发平台,将图表或页面元素封装为基础组件,无需编写代码即可制作数据大屏,减少心智负担。 +#### 长期赞助商 +
+
+ + go-view + +   + + go-view + +
+
-### 😶 纯 **前端** 分支: **`master`** +#### 😶 **纯前端** 分支: **`master`** -### 👻 携带 **后端** 请求分支: **`master-fetch`** +#### 👻 携带 **后端** 请求分支: **`master-fetch`** -### 📚 GoView **文档** 地址:[http://www.mtruning.club:81/](http://www.mtruning.club:81/) +#### 📚 GoView **文档** 地址:[https://www.mtruning.club/](https://www.mtruning.club/) -项目纯前端-Demo 地址:[https://www.mtruning.club](https://www.mtruning.club) +项目纯前端-Demo 地址:[https://vue.mtruning.club/](https://vue.mtruning.club/) -项目带后端-Demo 地址:[后端 Demo 地址](http://1.117.240.165:8080/goview/#/login) +项目带后端-Demo 地址:[https://demo.mtruning.club/](https://demo.mtruning.club/) -文档-在线地址:[http://www.mtruning.club:81/](http://www.mtruning.club:81/) +Cloud IDE 代码在线预览地址:[https://idegitee.com/dromara/go-view](https://idegitee.com/dromara/go-view) -文档-源码地址:[https://gitee.com/MTrun/go-view-doc](https://gitee.com/MTrun/go-view-doc) +#### 🤯 后端项目看这里! -### 🤯 后端项目 +后端项目 gitee 地址:[https://gitee.com/MTrun/go-view-serve](https://gitee.com/MTrun/go-view-serve) -后端项目gitee地址:[https://gitee.com/MTrun/go-view-serve](https://gitee.com/MTrun/go-view-serve) +接口说明地址:[https://docs.apipost.cn/...](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](https://docs.apipost.cn/preview/5aa85d10a59d66ce/ddb813732007ad2b?target_id=84dbc5b0-158f-4bcb-8f74-793ac604ada3#3e053622-1e76-43f9-a039-756aee822dbb) +其它后端方案地址: -技术点: +- 【.NET】[https://gitee.com/sun_xiang_yu/go-view-dotnet](https://gitee.com/sun_xiang_yu/go-view-dotnet) + +#### 整体介绍 - 框架:基于 `Vue3` 框架编写,使用 `hooks` 写法抽离部分逻辑,使代码结构更加清晰; @@ -36,17 +68,34 @@ GoView 是一个高效的拖拽式低代码数据可视化开发平台,将图 - 封装:项目进行了详细的工具类封装如:路由、存储、加/解密、文件处理、主题、NaiveUI 全局方法、组件等 +- 入选 NaiveUI 社区精选资源推荐:[查看 NaiveUI 推荐列表](https://www.naiveui.com/zh-CN/light/docs/community) + +说明文档: +![说明文档](readme/go-view-doc.png) + 工作台: -![项目截图](readme/go-view-canvas.png) +![工作台](readme/go-view-canvas.png) 请求配置: -![项目截图](readme/go-view-fetch.png) +![请求配置](readme/go-view-fetch.png) 数据过滤: -![项目截图](readme/go-view-filter.png) +![数据过滤](readme/go-view-filter.png) + +高级事件编辑: +![高级事件编辑](readme/go-view-event.png) + +自定义组件颜色: +![高级事件编辑](readme/go-view-echarts-color.png) + +快捷主页: +![快捷主页](readme/go-view-indexpage.png) 主题色: -![项目截图](readme/go-view-color.png) +![主题色](readme/go-view-color.png) + +亮白主题: +![亮白主题](readme/go-view-theme.png) 主要技术栈为: @@ -66,14 +115,17 @@ GoView 是一个高效的拖拽式低代码数据可视化开发平台,将图 已完成图表: -| 分类 | 名称 | 名称 | 名称 | -| ------ | ---------------- | ---------------- | -------- | -| 图表 | 柱状图 | 横向柱状图 | 折线图 | -| \* | 单/多 折线面积图 | 饼图 | 水球图 | -| \* | 环形图 | NaiveUI 多种进度 | 🤠 | -| 信息 | 文字 | 图片 | 😶 | -| 列表 | 滚动排名列表 | 滚动表格 | 🤓 | -| 小组件 | 边框-01~13 | 装饰-01~05 | 数字翻牌 | +| 分类 | 名称 | 名称 | 名称 | 名称 | +| ------ | ---------------- | ---------- | -------------- | ------------------------ | +| 图表 | 柱状图 | 横向柱状图 | 折线图 | 单/多 折线面积图(渐变色) | +| \* | 饼图 | 环形图 | 水球图 | 雷达图 | +| \* | NaiveUI 多种进度 | 散点图 | 对数回归散点图 | 热力图 | +| \* | 漏斗图 | 中国地图 | 高德地图 | 🦊 | +| 信息 | 文字 | 渐变文字 | 词云 | 嵌套网页 | +| \* | 图片 | 视频 | 😺 | 🐯 | +| 列表 | 滚动排名列表 | 滚动表格 | 🐮 | 🐐 | +| 小组件 | 边框-01~13 | 装饰-01~05 | 数字翻牌 | 通用时间 | +| \* | 数字计数 | 倒计时 | 时钟 | 🦁 | ## 浏览器支持 @@ -81,52 +133,7 @@ GoView 是一个高效的拖拽式低代码数据可视化开发平台,将图 ## 安装 -本项目采用` pnpm` 进行包管理 - -```shell -#建议使用 nrm 切换到淘宝源 https://registry.npmmirror.com/ -#pnpm -pnpm install - -#yarn -yarn install - -#npm -npm install -``` - -## 启动 - -```shell -#pnpm -pnpm dev - -# npm -npm run dev - -#yarn -yarn dev - -#Makefile -make dev -``` - -## 编译 - -```shell -#pnpm -pnpm run build - -# npm -npm run build - -#yarn -yarn run build - -#Makefile -make dist - -``` +请查看文档:[https://www.mtruning.club/](https://www.mtruning.club/) ## 代码提交 @@ -142,10 +149,9 @@ make dist - style: 不影响程序逻辑的代码修改 - chore: 不属于以上类型的其他类型(日常事务) -## 交流 +## 交流群 -QQ 群:1030129384 - -![QQ群](readme/go-view-qq.png) +QQ 群:663629294 +QQ群 ![渲染海报](readme/logo-poster.png) diff --git a/package.json b/package.json index 323b8a53..4cea7dbb 100644 --- a/package.json +++ b/package.json @@ -1,8 +1,8 @@ { "name": "go-view", - "version": "1.1.11", + "version": "1.2.3", "engines": { - "node": ">=16.14 <18.0.0" + "node": ">=12.0" }, "scripts": { "dev": "vite --host", diff --git a/preview.yml b/preview.yml new file mode 100644 index 00000000..1a26db2c --- /dev/null +++ b/preview.yml @@ -0,0 +1,10 @@ +# preview.yml +autoOpen: true # 打开工作空间时是否自动开启所有应用的预览 +apps: + - port: 3000 # 应用的端口 + run: npm i --registry=https://registry.npmmirror.com && npm run dev # 应用的启动命令 + command: # 使用此命令启动服务,且不执行run + root: ./ # 应用的启动目录 + name: GoView # 应用名称 + description: 开源、精美、便捷的「数据可视化」低代码开发平台 # 应用描述 + autoOpen: true # 打开工作空间时是否自动开启预览(优先级高于根级 autoOpen) \ No newline at end of file diff --git a/readme/go-view-doc.png b/readme/go-view-doc.png new file mode 100644 index 00000000..0e5187c5 Binary files /dev/null and b/readme/go-view-doc.png differ diff --git a/readme/go-view-echarts-color.png b/readme/go-view-echarts-color.png new file mode 100644 index 00000000..73eb2125 Binary files /dev/null and b/readme/go-view-echarts-color.png differ diff --git a/readme/go-view-event.png b/readme/go-view-event.png new file mode 100644 index 00000000..8752bce3 Binary files /dev/null and b/readme/go-view-event.png differ diff --git a/readme/go-view-indexpage.png b/readme/go-view-indexpage.png new file mode 100644 index 00000000..ba0dc202 Binary files /dev/null and b/readme/go-view-indexpage.png differ diff --git a/readme/go-view-qq.png b/readme/go-view-qq.png index daeed712..2bfd4b59 100644 Binary files a/readme/go-view-qq.png and b/readme/go-view-qq.png differ diff --git a/readme/go-view-theme.png b/readme/go-view-theme.png new file mode 100644 index 00000000..0f21f1a4 Binary files /dev/null and b/readme/go-view-theme.png differ diff --git a/readme/sponsors/ccflow-banner.png b/readme/sponsors/ccflow-banner.png new file mode 100644 index 00000000..7f537a70 Binary files /dev/null and b/readme/sponsors/ccflow-banner.png differ diff --git a/readme/sponsors/qyy-banner.png b/readme/sponsors/qyy-banner.png new file mode 100644 index 00000000..04e4fefe Binary files /dev/null and b/readme/sponsors/qyy-banner.png differ diff --git a/src/layout/components/LayoutMain/index.vue b/src/layout/components/LayoutMain/index.vue index 9c9d9a2a..62737471 100644 --- a/src/layout/components/LayoutMain/index.vue +++ b/src/layout/components/LayoutMain/index.vue @@ -2,12 +2,12 @@ diff --git a/src/packages/components/Informations/Mores/Carousel/config.ts b/src/packages/components/Informations/Mores/Carousel/config.ts new file mode 100644 index 00000000..78a6f284 --- /dev/null +++ b/src/packages/components/Informations/Mores/Carousel/config.ts @@ -0,0 +1,47 @@ +import { PublicConfigClass } from '@/packages/public' +import { CreateComponentType } from '@/packages/index.d' +import { CarouselConfig } from './index' +import cloneDeep from 'lodash/cloneDeep' +import logo from '@/assets/logo.png' + +// 示例图片资源 +const modules = import.meta.globEager("./images/*"); +const dataset = [logo] +for (var item in modules) { + dataset.push(modules[item].default) +} + +export const option = { + // 图片资源列表 + dataset: dataset, + // 自动播放 + autoplay: true, + // 自动播放的间隔(ms) + interval: 5000, + // 每页显示的图片数量 + slidesPerview: 1, + // 轮播方向 + direction: "horizontal", + // 拖曳切换 + draggable: true, + // 居中显示 + centeredSlides: false, + // 过渡效果 + effect: "slide", + // 是否显示指示点 + showDots: true, + // 指示器样式 + dotType: "dot", + // 指示器位置 + dotPlacement: "bottom", + // 显示箭头 + showArrow: false, + // 图片样式 + fit: "contain", +} + +export default class Config extends PublicConfigClass implements CreateComponentType { + public key = CarouselConfig.key + public chartConfig = cloneDeep(CarouselConfig) + public option = cloneDeep(option) +} diff --git a/src/packages/components/Informations/Mores/Carousel/config.vue b/src/packages/components/Informations/Mores/Carousel/config.vue new file mode 100644 index 00000000..da3f7492 --- /dev/null +++ b/src/packages/components/Informations/Mores/Carousel/config.vue @@ -0,0 +1,176 @@ + + + diff --git a/src/packages/components/Informations/Mores/Carousel/images/carousel.png b/src/packages/components/Informations/Mores/Carousel/images/carousel.png new file mode 100644 index 00000000..95f366b1 Binary files /dev/null and b/src/packages/components/Informations/Mores/Carousel/images/carousel.png differ diff --git a/src/packages/components/Informations/Mores/Carousel/images/carousel2.png b/src/packages/components/Informations/Mores/Carousel/images/carousel2.png new file mode 100644 index 00000000..d8a6859f Binary files /dev/null and b/src/packages/components/Informations/Mores/Carousel/images/carousel2.png differ diff --git a/src/packages/components/Informations/Mores/Carousel/index.ts b/src/packages/components/Informations/Mores/Carousel/index.ts new file mode 100644 index 00000000..fbb8d35c --- /dev/null +++ b/src/packages/components/Informations/Mores/Carousel/index.ts @@ -0,0 +1,14 @@ +import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d' +import { ChatCategoryEnum,ChatCategoryEnumName } from '../../index.d' + +export const CarouselConfig: ConfigType = { + key: 'Carousel', + chartKey: 'VCarousel', + conKey: 'VCCarousel', + title: '轮播图', + category: ChatCategoryEnum.MORE, + categoryName: ChatCategoryEnumName.MORE, + package: PackagesCategoryEnum.INFORMATIONS, + chartFrame: ChartFrameEnum.NAIVE_UI, + image: 'photo.png' +} diff --git a/src/packages/components/Informations/Mores/Carousel/index.vue b/src/packages/components/Informations/Mores/Carousel/index.vue new file mode 100644 index 00000000..3018fbc2 --- /dev/null +++ b/src/packages/components/Informations/Mores/Carousel/index.vue @@ -0,0 +1,47 @@ + + diff --git a/src/packages/components/Informations/Mores/index.ts b/src/packages/components/Informations/Mores/index.ts index 572ab9e0..778f89a9 100644 --- a/src/packages/components/Informations/Mores/index.ts +++ b/src/packages/components/Informations/Mores/index.ts @@ -3,5 +3,6 @@ import { ImageCarouselConfig } from './ImageCarousel/index' import { IframeConfig } from './Iframe/index' import { VideoConfig } from './Video/index' import { WordCloudConfig } from './WordCloud/index' +import { CarouselConfig } from './Carousel/index' export default [ImageConfig, ImageCarouselConfig, VideoConfig, IframeConfig, WordCloudConfig] diff --git a/src/router/modules/project.router.ts b/src/router/modules/project.router.ts index 45f51f15..5d0b8e0b 100644 --- a/src/router/modules/project.router.ts +++ b/src/router/modules/project.router.ts @@ -46,4 +46,11 @@ const projectRoutes: RouteRecordRaw = { ] } +projectRoutes.children?.forEach(child => { + child.meta = { + ...child.meta, + key: 'reuse-project' + } +}) + export default projectRoutes diff --git a/src/views/chart/ContentHeader/headerRightBtn/index.vue b/src/views/chart/ContentHeader/headerRightBtn/index.vue index 18369413..cc6df2d3 100644 --- a/src/views/chart/ContentHeader/headerRightBtn/index.vue +++ b/src/views/chart/ContentHeader/headerRightBtn/index.vue @@ -58,7 +58,7 @@ const previewHandle = () => { // 发布 const sendHandle = () => { goDialog({ - message: '想体验发布功能,请前往 master-fetch 分支查看: https://gitee.com/MTrun/go-view/tree/master-fetch', + message: '想体验发布功能,请前往 master-fetch 分支查看: https://demo.mtruning.club/#/login', positiveText: '了然', closeNegativeText: true, onPositiveCallback: () => {} diff --git a/src/views/project/layout/components/ProjectLayoutSider/index.vue b/src/views/project/layout/components/ProjectLayoutSider/index.vue index c7b963e0..e84a00f8 100644 --- a/src/views/project/layout/components/ProjectLayoutSider/index.vue +++ b/src/views/project/layout/components/ProjectLayoutSider/index.vue @@ -45,8 +45,7 @@ const collapsed = ref(false) const { getAsideCollapsedWidth } = toRefs(useSettingStore()) const route = useRoute() -const routeRame = computed(() => route.name) -const menuValue = ref(routeRame) +const menuValue = computed(() => route.name) const menuOptions = menuOptionsInit()