分享一个前后端分离的基于 Laravel + Vue 的管理后台模板项目

简介

就是一个后台模板项目,基于 Laravel 和 Vue,UI 库用的 Element,功能都是参考自其他开源产品,代码少部分参考。自认为体验很棒,毕竟都是完全按我个人的意愿做出来的,虽然功能都是参考自其他地方的,但都是我认为很棒的功能,,,前端封装了很多东西,方便开发,统一管理后台的风格、布局和操作,,,

DEMO

admin-demo.largezhou.com/admin/vue-...

账号:admin

密码:000000

可以随意体验,搞坏了,登录不了,可点 重置,,,,修改了路由配置,要刷新浏览器页面才能生效。

Vue Router 和菜单配置,拖拽排序和调整层次结构

Vue Router 和菜单配置

添加角色

添加角色

添加权限Laravel-admin 同款(照搬))

添加权限

上面是管理后台最最基础功能,下面附带两个甜点,,

这两个功能都是参考自 crmeb 这个开源的商城系统,,,当时公司有人在用这个系统二开,我觉得这两个功能挺好的,,,还有个 组合数据 的功能,,,以后可能会加进去吧,,

文件上传管理器,所有需要上传文件的地方,只需使用 FilePicker 组件,就可以从这个文件管理器之中进行文件的上传、筛选、删除和选择,统一管理后台文件上传。

分享一个前后端分离的管理后台模板项目,基于 Laravel 和 Vue,带有权限、文件管理器和系统设置

配置管理,分类配置,添加,按分类获取、更新,,支持多种类型的

分享一个前后端分离的管理后台模板项目,基于 Laravel 和 Vue,带有权限、文件管理器和系统设置

最后来一个自认为小亮点的功能,,,但是我说不清楚是啥功能,,所以就发张图吧,注意看浏览器地址,面包屑,和侧边栏菜单,,
分享一个前后端分离的管理后台模板项目,基于 Laravel 和 Vue,带有权限、文件管理器和系统设置

github.com/largezhou/admin

顺便推荐下 微信公众号菜单管理插件

本作品采用《CC 协议》,转载必须注明作者和本文链接
附言 1  ·  4年前
本帖由系统于 4年前 自动加精
《L01 基础入门》
我们将带你从零开发一个项目并部署到线上,本课程教授 Web 开发中专业、实用的技能,如 Git 工作流、Laravel Mix 前端工作流等。
《L04 微信小程序从零到发布》
从小程序个人账户申请开始,带你一步步进行开发一个微信小程序,直到提交微信控制台上线发布。
讨论数量: 138

很赞 正准备使用这个功能

4年前 评论

老司机带带我

4年前 评论

这跟后端返回左侧菜单栏不是一样的吗?只要是没catch到的页面统统进404呀

4年前 评论
largezhou (楼主) 4年前
legendary_jesse (作者) 4年前

代码质量很高 :100:

4年前 评论
largezhou (楼主) 4年前
jsonMark 3年前

我们公司后端只配置接口路径,然后前段根据接口去匹配哪些页面要显示,哪个按钮要显示。不需要配置路由列表,因为你配置了列表,结果他没有这个接口权限,也很麻烦。相当于要去匹配2遍

4年前 评论
largezhou (楼主) 4年前
全场我最姜姜姜丶 (作者) 4年前

不错,自己想了很久都没有行动,值得学习 :+1:

4年前 评论

期待分享一下思路: 后端添加的路由是怎么注册到vue的路由里面的

4年前 评论
largezhou (楼主) 4年前
michealzh (作者) 4年前
largezhou (楼主) 4年前

克隆下来 compsoer update env都配置了。进不了后台页面。404

4年前 评论
largezhou (楼主) 4年前
redline (作者) 4年前
redline (作者) 4年前
largezhou (楼主) 4年前
redline (作者) 4年前

我们是通过在前端router的meta字段里面存储这个页面所需要用到的接口的数组,登录后后端返回这个用户所拥有的所有接口数组,然后与路由里面的meta字段数组取交集来判断这个路由显不显示,页面的按钮通过自定义指令判断是否在当前路由的meta字段里面来决定是否显示

4年前 评论

@zjwshisb 菜单根据路由配置生成的吗?

你们这样不能通过后端来随意修改路由的嵌套层级和顺序吧?不过这并不是什么很必要的功能,,,只是我个人喜好了,,,

后端返回用户拥有权限的所有接口,,,会不会一大坨?我这个页面上如果要单独控制某个按钮显不显示,是用权限的 slug 来判断的,不过我还没弄,,,

我也来搞个自定义指令做这个可以,,

用自定义指令做这个,是不是也就只比用 v-if="can('edit-post')" 来说,语义化强一点?

4年前 评论

@largezhou 是的呀,菜单就根据路由来
一大坨也没啥关系,就长度几百的一个数组嘛
主要我们还整合rbac的权限控制,permission表字段就存接口的名称(users.index)这样的,配合laravel的api路由,这样就一整套就配合起来了

4年前 评论

期待你的 readme ~ 404中

4年前 评论
largezhou (楼主) 4年前

添加了新的路由然后访问新的路由404是因为没有对应的组件的原因吗?

4年前 评论

@SamCCC

是啊,,,这路由的添加基本上算是开发用的功能了吧,,,不是随便添加就有页面的,,只是如果你权限要更细分一点,可能可以给特定用户调整路由的层级和顺序,这还是有点点用处的,而且这个路由和菜单的权限,可以通过管理后台随意调整,不用重新打包前端资源。

不过评论里也有其他方案,,,

4年前 评论

很牛 :+1:

4年前 评论

权限这块没看懂 具体是把路由直接分配给角色吗 还是没增加一个路由就要分配到一个权限组里。

4年前 评论
largezhou (楼主) 4年前

在后台,刷新浏览器 ,出现404

file

4年前 评论
largezhou (楼主) 4年前

file

报这个错呢 执行到php artisan admin:init 这步的时候

4年前 评论
largezhou (楼主) 4年前
james23 (作者) 4年前

很棒的项目,加油!

4年前 评论

很棒 :+1:的项目,fork下来学习学习

4年前 评论

1、laravel new tousu
2、拷贝代码到tousu目录,替换文件
3、php artisan jwt:secret,报错误:
In ProviderRepository.php line 208:
Class 'Overtrue\LaravelLang\TranslationServiceProvider' not found

4年前 评论
largezhou (楼主) 4年前
kapokiss (作者) 4年前
largezhou (楼主) 4年前

请问安装好了 .env.example里面的很多配置都是干什么的,都需要填吗

4年前 评论
largezhou (楼主) 4年前
绝缘体菜狗

star 为敬

4年前 评论
largezhou (楼主) 4年前
绝缘体菜狗 (作者) 4年前

大佬有没有用 React 和 Material

4年前 评论
largezhou (楼主) 4年前

好东西 :+1: 有一点疑问 那个菜单怎么根据不同角色权限来显示不同的菜单栏目呢

4年前 评论
largezhou (楼主) 4年前

哇哦,厉害,像大佬学习,慢慢的自己也撸一套出来,哈哈哈哈

4年前 评论
largezhou (楼主) 4年前

非常棒,已经使用在公司开发的项目当中了,用着非常舒服!!

4年前 评论
largezhou (楼主) 4年前
qq876149799 (作者) 4年前
largezhou (楼主) 4年前
Jennie

想请问下,上传文件是怎么操作才能上传?弹窗下面的按钮都是禁用的 :sweat_smile:

4年前 评论
largezhou (楼主) 4年前

请教各位大佬,新增后台路由,在routes/admin.php,增加一条路由,访问显示404了,应该怎么操作。

4年前 评论
largezhou (楼主) 4年前
社会主义接班人 (作者) 4年前

部署以后 提示页面不存在 什么原因呢

4年前 评论

请问下文件上传又拍云怎么配置呢?怎么无缝切换。

4年前 评论
largezhou (楼主) 4年前

老哥,前端学习路线资料可以分享一波吗 :joy:

4年前 评论
largezhou (楼主) 4年前
温故知新 (作者) 4年前

想问下,前后端完全分离的后台,使用的是session 验证,那提交时的csrf是如何做的呢?

4年前 评论
largezhou (楼主) 4年前
Va1ora_Yan (作者) 4年前
largezhou (楼主) 4年前

问一下,你这个前端开发的时候怎么跑啊. 前端运行调接口会跨域

3年前 评论
小李世界 3年前
小李世界 3年前
dowsonzhao (作者) 3年前
小李世界 3年前
largezhou (楼主) 3年前

小白,请问一下 cd resources/admin && yarn && yarn build 不编译的话会出现500错误 .编译后再去修改.vue文件,刷新页面不会及时更新我修改了的文件. 我用做开发的话,需要修改哪里才能做到实时同步

3年前 评论
largezhou (楼主) 3年前
boolhai (作者) 3年前

很赞,短小精悍,功能测试起来挺带感。

3年前 评论
largezhou (楼主) 3年前

你这个数据结构和laravel-admin是一样的吗???我想把这个项目迁移过来

3年前 评论
largezhou (楼主) 3年前
jsonMark (作者) 3年前

file 兄弟我想在ok返回值里边添加状态码 code 或者 msg 应该怎么改一下RestfulResponse这个里边的ok方法呢

3年前 评论
largezhou (楼主) 3年前

本地测试刷新就变成404,不知道本地需要设置什么吗?请告知下,因为已经开始用这个框架开发项目了

file

3年前 评论
largezhou (楼主) 3年前
largezhou (楼主) 3年前
manage (作者) 3年前

代码质量很高 :100: 大佬 怎么也没有一天个新闻cms得扩展插件

3年前 评论
largezhou (楼主) 3年前
pszhao (作者) 3年前
pszhao (作者) 3年前
largezhou (楼主) 3年前
largezhou (楼主) 3年前
pszhao (作者) 3年前
largezhou (楼主) 3年前

执行yarn后,再执行yarn build报错:(百度过,但总是得不到解决 :joy:)

file

3年前 评论
largezhou (楼主) 3年前
largezhou (楼主) 3年前

我也有个同类型的开源项目LaravelAdmin www.laraveladmin.cn/

3年前 评论
largezhou (楼主) 3年前
醉小楼 2年前

有联系方式吗 老哥

3年前 评论
largezhou (楼主) 3年前
huangzz6666

大佬,您好,好像找不到git下载地址呀

2年前 评论
huangzz6666 (作者) 2年前
largezhou (楼主) 2年前

大佬,你好。
能否分享下业务逻辑都写在Model里的原因:smiley:?有没有考虑过写在Service层?
这个问题我想了很久,没有答案 :sob:。。。

2年前 评论

@Hong_Tao_Liu 这没区别,,,看你们公司的规定,,,

你想想,原本你把逻辑封装在模型里,然后公司规定必须放到 service 里,然后你就把模型里的逻辑,剪切到 service 里,,,这有区别吗?

但是,如果你某个业务有多种实现方式,通过统一的方式来调用,可以任意切换,那这种可能不能放到模型中,,

或者逻辑比较复杂,比如要封装很多小方法,还有很多无关模型的属性什么的,,还是放到其他类中更好,,,

2年前 评论

@largezhou 如果有个 service 层,即c-s-m 分层,调用时,在 Controller 层能否出现 Model 类?

如果Controller层不能出现Model类, 只能在service层使用Model,则service里面的functionreturn,是不是不能返回Model

2年前 评论

@Hong_Tao_Liu 别纠结这个了,赶紧写吧,,, :scream:

2年前 评论
Hong_Tao_Liu 2年前

大佬 登录没反应 是什么情况 接口也没报错,没跳转到主页面

1年前 评论

前端Vue文件在哪里,怎么没看到

3个月前 评论
largezhou (楼主) 3个月前

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!