1 Star 0 Fork 27

啊牛哥 / RuoYi-App-Geek

forked from Geek-XD / RuoYi-Geek-App 
加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
贡献代码
同步代码
取消
提示: 由于 Git 不支持空文件夾,创建文件夹后会生成空的 .keep 文件
Loading...
README
MIT

RuoYi-App-Geek

本人的其他两个推荐搭配的项目

  1. Ruoyi-SpringBoot3-Geek: 这是若依极客生态的后端Springboot3版本 (gitee.com)
  2. RuoYi-Vue3-Geek: 这是若依极客生态的Vue3版本 (gitee.com)

与本项目同为一个作者开发,兼容性最好,学习成本最低

介绍

  • 本框架基于RuoYi-App框架二次修改,使用Uniapp+Vue3。
  • 同时支持js或者ts。
  • 同时支持css、scss、less
  • 已经做了初步分包
  • 已经引入uview-plus(好看的ui)
  • 已经引入ucharts(方便的图表)
  • 分别提供了uview-plus和ucharts的模板(可以直接使用或者用于学习)
  • 里面还提供了作者自己封装的一些常用组件供大家选择

安装

一下三种方式均可,感觉速度 pnpm > yarn > cnpm > npm

Vue3/Vite版要求 node 版本^14.18.0 || >=16.0.0

npm install
cnpm install
yarn
pnpm install

启动

详见package.json的“scripts”,以下是案例:

:: 微信小程序编译运行
npm run dev:mp-weixin

成功后使用微信小程序打开:dist\dev\mp-weixin

代码压缩

默认是启动代码压缩的,

如果需要关闭代码压缩,可以将vite.config.js中的build.minify赋值为false。

如果需要打开代码压缩,可以将vite.config.js中的build.minify赋值为true。

内置组件(geek-xd)

  1. 颜色选择器组件
  2. 二维码组件
  3. 圆形菜单组件
  4. 常用的订单组件
  5. 信息展示组件

插件的使用

tab - 页面插件

可以通过设置参数中的config.data来实现页面传参

方法 作用 参数
getData 可以拿到上个页面通过tab传递的参数
reLaunch 关闭所有页面,打开到应用内的某个页面 url、config
switchTab 跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面 url、config
redirectTo 关闭当前页面,跳转到应用内的某个页面 url、config
navigateTo 保留当前页面,跳转到应用内的某个页面 url、config
navigateBack 关闭当前页面,返回上一页面或多级页面 config

auth - 鉴权插件

下面所有方法返回值都是布尔值,permission代表权限字符串,role代表角色字符串,复数形式代表数组。

方法 作用 参数
hasPermi 验证用户是否具备某权限 permission
hasPermiOr 验证用户是否含有指定权限,只需包含其中一个 permissions
hasPermiAnd 验证用户是否含有指定权限,必须全部拥有 permissions
hasRole 验证用户是否具备某角色 role
hasRoleOr 验证用户是否含有指定角色,只需包含其中一个 roles
hasRoleAnd roles roles

modal - 弹窗插件

content是消息内容,option是详细配置。

方法 作用 参数
msg 消息提示 content
msgError 错误消息 content
msgSuccess 成功消息 content
hideMsg 隐藏消息
alert 弹出提示 content
confirm 确认窗体 content
showToast 提示信息 option
loading 打开遮罩层,需要手动关闭遮罩层 content
closeLoading 关闭遮罩层

bus - 事件插件

eventName是事件名称,eventFun是事件处理函数,请尽量避免事件插件的使用,请在组件销毁是解绑素有该组件有关的事件,避免产生bug。

方法 作用 参数
$on 绑定一个事件 eventName、eventFun
$off 解绑一个事件 eventName
$emit 触发一个事件 eventName、...args

socket

设置项enableUUID,是否启用基于uuid的消息处理机制,要求当发送的消息携带uuid字段时,返回的消息也要携带uuid字段。

设置项enableEvent,是否启用基于事件的消息处理机制,要求当希望被事件处理函数处理的消息需要携带event字段。

方法 作用 参数
connect 连接websocke,当连接成功后触发回调函数 最简单的用法就是传入{url:"ws://demo"}
send 发送信息,当uuid不为空且不为false时,当收到携带相同uuid的消息时触发回调函数,只触发一次。否则由默认处理函数处理。 msg消息内容,会被处理成json字符串uuid唯一标识符,可以手动传入,也可以设置为true当为true时会自动生成一个uuid并添加到msg中。
close 关闭连接,会触发回调函数的内容,不会触发默认关闭事件的处理函数,也不会修改默认关闭事件的处理函数。
on 监听事件,当收到携带event的消息时会调用回调函数。 event事件的名称
off 取消监听事件
onMessage 定义默认监听事件 callback 默认监听事件的处理函数
onError 定义异常事件 callback 默认异常事件的处理函数
onClose 定义关闭事件 callback 默认关闭事件的处理函数

作者建议

对于选项式

this.$tab // 建议使用this.$tab进行页面跳转,理由:便于在跳转前处理其他事务
this.$auth // 建议使用this.$auth进行鉴权操作
this.$modal // 建议使用this.$modal打开弹窗,理由:便于以后想要使用自定义弹窗

对于组合式

import tab from '@/plugins/tab' // 建议使用tab进行页面跳转,理由:便于在跳转前处理其他事务
import auth from '@/plugins/auth' // 建议使用auth进行鉴权操作
import modal from '@/plugins/modal' // 建议使用modal打开弹窗,理由:便于以后想要使用自定义弹窗

// 也可以使用下面的方式
import { tab, auth, modal} from '@/plugins'

对于ucharts

建议即便暂时不使用图表也不要删除它,以后可能会用到。

压缩内存

(主包最低809kb左右)

删除geek组件

  1. 删除pages_geek和components/geek-xd文件夹
  2. 删除pages.json中subPackages的root值为“pages_geek/pages”的配置
  3. 删除pages/template.config.js中geek组件

去除模板

(占用主包582kb左右)

  1. 删除pages_template、pages_qiun两个文件夹
  2. 删除pages.json中subPackages的root值为“pages_qiun/pages”、“pages_template/pages”的两个配置
  3. 删除pages/template.config.js和pages/template.vue
  4. 删除pages.json中subPackages的“tabBar”中的模板一项和“pages”中模板的一项
  5. 删除static中的uview,里面都是示例图片。
  6. 删除plugins中的config.js和common.js,并在plugins/index.js中删除相关配置

删除uchart

(占用主包175kb左右,不建议删除,以防以后会用)

  1. 删除components/qiun-data-charts文件夹
  2. 删除pages.json中的easycom下的custom中的"qiun-(.*)"的那一行
  3. 删除pages/index中使用 “qiun-data-charts” 的部分

删除uview

(按需引入,没必要删除)

  1. main.js或者main.ts中删除
import uviewPlus from 'uview-plus'
// ......
app.use(uviewPlus)
  1. uni.scss中删除 @import 'uview-plus/theme.scss';
  2. App.vue中删除 @import '@/static/scss/index.scss';
  3. package.json中删除 "clipboard": "^2.0.11","dayjs": "^1.11.9","uview-plus": "^3.1.36",

附录

Vue3官网uniapp官网uView-plus官网uCharts官网RuoYi官网

MIT License Copyright (c) 2023 哦NO Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

简介

若依极客生态App版本是 RuoYi-App 框架的基础上进行了二次开发,采用了 Uniapp 结合 Vue3 的技术栈。它同时支持 JavaScript 和 TypeScript 开发,并且兼容 CSS、SCSS 以及 Less 样式语言。为了优化性能,我们已经对代码进行了初步的分包处理。此外,我们集成了 uview-plus、uchart和相关的模板供大家参考和使用。 展开 收起
JavaScript
MIT
取消

发行版

暂无发行版

贡献者

全部

近期动态

加载更多
不能加载更多了
JavaScript
1
https://gitee.com/jinniu/geek-uniapp-vue3-uview-plus-uchart.git
git@gitee.com:jinniu/geek-uniapp-vue3-uview-plus-uchart.git
jinniu
geek-uniapp-vue3-uview-plus-uchart
RuoYi-App-Geek
master

搜索帮助

53164aa7 5694891 3bd8fe86 5694891