8000 GitHub - czsvn/laravel_template_with_vue at
[go: up one dir, main page]

Skip to content

laravel5.5和vue.js结合的前后端分离项目模板。作为程序的起点,可以直接以此为基础来进行业务扩展。模板内容包括基础的用户管理和权限管理、日志管理、集成第三方登录,整合laravel-echo-server 实现了websocket 做到了消息的实时推送,并在此基础上,实现了聊天室和客服功能。权限管理包括后端Token认证和前端vue.js的动态权限,解决了前后端完整分离的情况下,vue.js的认证与权限相关的痛点,已在本人的多个项目中集成使用。

License

Notifications You must be signed in to change notification settings

czsvn/laravel_template_with_vue

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

写在前面

2018年的春节假期,受朋友的鼓励和内心的指引,对近两年所学到的知识进行了系统的沉淀和总结。
从多个项目中提取关键点、抛弃了的业务部分,对底层的功能进行了各类优化和抽象,写成本项目。  

1、 当前版本介绍

< 8000 div class="markdown-heading" dir="auto">

1.1 版本说明

当前版本laravel_template_with_vue (2.1)

1.2 改进说明

后端:

  1. 调整xlsx文件的处理插件为fast-excel
  2. 数据表部分字段的调整,取消permissions中不常用的method和route_match字段,修改users表中的role字段为roles, roles表中的permission为permissions,使数据表更加规范化
  3. 代码层面,资源控制器的功能复用,让代码更简洁和实用,父类Controller中编写好了数据的增删改查和数据表的导入和导出功能,用户可以根据TempController的方式来编写相关代码,可以参考OrderController(订单控制),开箱即用,节省业务的编写时间
  4. 完善日志管理的API
  5. 利用showdoc完成文档构建
  6. 利用laravel-echo-server,集成websocket,当同一个用户多次登陆,前次登陆的页面,将自动退出。利用webasocket的消息推送来实现
  7. 利用laravel-echo-server,集成websocket,实现聊天室功能和客服功能

前端:

  1. 前端element ui 更新到了2.7.2版本,请参照开发
  2. 集成了同时打开多个页面的功能,多标签功能
  3. 集成了全屏操作的功能
  4. 增加了日志管理功能
  5. 增加了前端开发示列,商品订单管理,代码层面利用mixin功能优化书写
  6. 接收后端推送的消息,强制下线多次登陆的用户,保证同一个用户在什么时间与地点只能登陆一次。
  7. 增加了应用事例模块,把具有代表性的聊天室功能和客服功能集成到项目中

ToDo:

  1. 前端增加用户多角色动态切换功能
  2. 增加成员管理功能,实现微信登录、qq登录等第三方用户登录的功能
  3. 增加成员注册和使用功能

2、系统概述

项目依托laravel5.5与vue.js,采用了主流的前后端分离方式来构建,作为程序的起点,你可以在此基础上进行自身业务的扩展。
后端(backend目录)负责OAuth认证、用户授权、第三方用户登录验证和提供API,在此基础上集成了跨域和excel文件的操作等基础功能,使用者只需专注于业务api的开发即可。
后端(backend目录)整合了laravel-echo-server,实现了websocket。用于消息的实时推送、聊天室、客服等功能,是全网最好的laravel-echo-server教程。
前端(frontend目录)负责页面的显示和前端用户权限的控制。项目已经引入了element UI框架,并已经对用户登录认证、路由、权限等基础功能进行了处理。
前端用户的权限不但可以控制系统的导航菜单,而且可以控制到页面按钮、表格等内容的显示。使用者只需要专注于业务界面的开发即可。
本项目使用广泛,已经在本人的多个项目中商用。

第三方登录测试时,可以先进入系统创建一个用户,然后用github登录后绑定刚刚创建的新用户,之后就可以使用github来自动登录了(可以参考版本1,版本2因为项目调整的关系,之后才会增加)

3、项目演示与截图

演示网站(http://front.ynxpyz.cn)
管理员用户名和密码(871228582@qq.com/123456)
普通用户用户名和密码(786270744@qq.com/123456)

项目截图

文档

系统文档

聊天室

聊天室

客服(普通用户界面 1对1)

客服界面1

客服(客服界面 1对多)

客服界面2

管理员面板

管理员面板

普通用户面板[注意观察系统日志和左侧导航菜单]

普通用户面板

修改个人信息

修改个人信息

全屏幕操作

全屏幕操作

用户管理

用户管理

用户添加

用户添加

用户数据导出

用户数据导出

角色管理

角色管理

角色功能设置

角色功能设置

功能管理

功能管理

功能组管理

功能组管理

添加新功能

添加新功能

系统日志管理

系统日志
8000
理

管理日志的管理

工作日志的管理

管理员界面下的订单管理

管理员界面下的订单管理

普通用户下的订单管理

普通用户下的订单管理

4、技术文档

5、技术支持

欢迎大家来光临我的博客,主要专注于laravel与vue.js的应用 博客

如果对您有帮助,您可以点右上角 "Star" 支持一下 谢谢! ^_^

或者您可以 "follow" 一下,我会不断完善该项目

开发环境 windows 7 Chrome 63 PHP 7.1.7

如有问题请直接在 Issues 中提,或者您发现问题并有非常好的解决方案,欢迎 PR 👍

__部署和使用中如果有疑问,可以到项目交流群进行讨论:106822531(QQ)或者关注公众号(computer_life)学习相关基础知识

QQ群二维码

全栈开发公众号

6、打赏

如果我的付出能够帮助到你,我也乐于接受你的帮助,小小的赞赏是我们持续进步的动力。

支付宝支付 微信支付

7、致谢

站在巨人之上,我们才能走得更远。项目中使用和借鉴了以下开源框架的实现方法 一并致谢

License

MIT

About

laravel5.5和vue.js结合的前后端分离项目模板。作为程序的起点,可以直接以此为基础来进行业务扩展。模板内容包括基础的用户管理和权限管理、日志管理、集成第三方登录,整合laravel-echo-server 实现了websocket 做到了消息的实时推送,并在此基础上,实现了聊天室和客服功能。权限管理包括后端Token认证和前端vue.js的动态权限,解决了前后端完整分离的情况下,vue.js的认证与权限相关的痛点,已在本人的多个项目中集成使用。

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • PHP 70.3%
  • Vue 22.7%
  • JavaScript 5.7%
  • CSS 0.5%
  • Smarty 0.5%
  • HTML 0.3%
0