简体中文（ZH-CN）English（EN）繁体中文（ZH-TW）日本語（JA）한국어（KO）Melayu（MS）Français（FR）Deutsch（DE）
Home
Article
Q&A
Course
Topic
Download
Game
Dictionary
Recent Updates

博客列表 >laravel--通用后台管理系统--用户的登录和退出--用户的增删改查

laravel--通用后台管理系统--用户的登录和退出--用户的增删改查

王娇
王娇原创
2020年06月14日 18:02:081731浏览

学习总结

1.用户的退出用到Auth::logout()方法

2.保存数据时用save方法，需要通过判断是否存在用户id值判断是增加还是修改用户数据

3.可以通过layer.open()中的btn和yes属性给弹窗添加按钮和按钮方法

1.admin控制器admin.php

  2. <?php
  4. namespace App\Http\Controllers\admins;
  6. use App\Http\Controllers\Controller;
  8. use Illuminate\Support\Facades\Hash;//哈希密码加密
  10. use Illuminate\Http\Request;
  11. //引入数据库查询构造器，链式调用
  12. use Illuminate\Support\Facades\DB;
  13. //后台账号管理控制器
  14. class Admin extends Controller
  15. {
  16.     //账号列表
  17.     public function index(){
  18.         $res['admins'] = DB::table('admin')->lists();
  19.         $res['admin_group']=DB::table('admin_group')->select('gid','title')->cate('gid');
  20.         return view('/admins/admin/index',$res);
  21.     }
  23.     //添加账号
  24.     public function add()
  25.     {
  26.         $res['groups']=DB::table('admin_group')->lists();
  27.         return view('/admins/admin/add',$res);
  28.     }
  29.     //修改账号
  30.     public function edit(Request $req)
  31.     {
  32.         $aid = $req->id;
  33.         $res['admin'] = DB::table('admin')->where('id',$aid)->item();
  34.         $res['groups']=DB::table('admin_group')->lists();
  35.         // echo '<pre>';
  36.         // print_r($res);
  37.         return view('/admins/admin/edit',$res);
  38.     }
  39.     //保存账号
  40.     public function save(Request $req)
  41.     {   
  42.         $aid =(int)$req->aid;
  43.         if($aid):
  44.             //如果aid不为0，则代表是修改管理员
  45.             if(trim($req->password)!=='')://如果修改管理员是密码框为空，代理不修改密码，就不用更新密码字段
  46.                 $data['password'] =Hash::make(trim($req->password));
  47.             endif;
  48.         else:
  49.             //如果aid为0，则代表是添加管理员
  50.             //判断用户名是否为空
  51.             if(trim($req->username)===''):
  52.                 return json_encode(['status'=>'1','msg'=>'用户名不能为空']);
  53.              endif;
  54.              $data['username'] = trim($req->username);
  56.              //判断用户是否存在
  57.              $res = DB::table('admin')->where('username',$data['username'])->item();
  58.              if($res):
  59.                 return json_encode(['status'=>'1','msg'=>'用户已存在']);
  60.              endif;
  62.              //判断密码是否为空
  63.             if(trim($req->password)===''):
  64.                 return json_encode(['status'=>'1','msg'=>'密码不能为空']);
  65.              endif;             
  66.              $data['password'] =Hash::make(trim($req->password));
  67.              //$data['password'] =password_hash(trim($req->password),PASSWORD_DEFAULT);与上一条语句功能一样
  68.         endif;
  71.         if(trim($req->gid)===''):
  72.             return json_encode(['status'=>'1','msg'=>'必须选择角色']);
  73.          endif;
  74.         $data['gid'] = $req->gid;
  76.         $data['real_name'] = $req->real_name;    
  77.         $data['status'] = $req->status?0:1;//0代表正常，1代表禁用
  78.         $data['add_time']=time();
  80.         if($aid):
  81.             $res = DB::table('admin')->where('id',$aid)->update($data);
  82.         else:
  83.             $res = DB::table('admin')->insert($data);
  84.         endif;
  85.         if($res):
  86.             return json_encode(['status'=>'0','msg'=>'保存成功']);
  87.         else:
  88.             return json_encode(['status'=>'1','msg'=>'保存失败']);
  89.         endif;
  90.         // echo '<pre>';
  91.         // print_r($data);
  92.     }
  94.     //删除账号
  95.     public function del(Request $req)
  96.     {
  97.         $aid = $req->id;
  98.         $res =DB::table('admin')->where('id',$aid)->delete();
  99.         if($res)
  100.         {
  101.             return json_encode(['status'=>'0','msg'=>'删除成功']);
  102.         }
  103.         else
  104.         {
  105.             return json_encode(['status'=>'1','msg'=>'删除失败']);
  106.         }
  107.     }
  108. }

2.用户列表显示页面index.blade.php

  2. <!DOCTYPE html>
  3. <html lang="en">
  5. <head>
  6.     <meta charset="UTF-8">
  7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8.     <link rel="stylesheet" href="/static/plugins/layui/css/layui.css">
  9.     <script src="/static/plugins/layui/layui.js"></script>
  10.     <title>账号管理</title>
  11. </head>
  12. <style>
  13. .addBtn {
  14.     margin-top: 10px;
  15.     width: 120px;
  16.     margin-left: auto;
  17.     margin-right: 50px;
  18. }
  20. .layui-table {
  21.     width: 95%;
  22.     margin: 20px;
  23. }
  24. </style>
  26. <body>
  27.     <div class="addBtn">
  28.         <button class="layui-btn" onclick="add()">添加管理员</button>
  29.     </div>
  30.     <table class="layui-table">
  31.         <thead>
  32.             <tr>
  33.                 <th>编号</th>
  34.                 <th>用户名</th>
  35.                 <th>角色</th>
  36.                 <th>真实姓名</th>
  37.                 <th>状态</th>
  38.                 <th>注册时间</th>
  39.                 <th>操作</th>
  40.             </tr>
  41.         </thead>
  42.         <tbody>
  44.             @foreach($admins as $admin)
  45.             <tr>
  46.                 <td>{{$admin['id']}}</td>
  47.                 <td>{{$admin['username']}}</td>
  48.                 <td>{{$admin_group[$admin['gid']]['title']}}</td>
  49.                 <td>{{$admin['real_name']}}</td>
  50.                 <td>{{$admin['status']?'禁用':'正常'}}</td>
  51.                 <td>{{$admin['add_time']?date('Y-m-d',$admin['add_time']):''}}</td>
  52.                 <td>
  53.                     <button class="layui-btn layui-btn-xs" onclick="edit({{$admin['id']}})">修改</button>
  54.                     <button class="layui-btn layui-btn-xs layui-btn-danger" onclick="del({{$admin['id']}})">删除</button>
  55.                 </td>
  56.             </tr>
  57.             @endforeach
  58.         </tbody>
  59.     </table>
  60. </body>
  61. <script>
  62. layui.use(['layer'], function() {
  63.     layer = layui.layer;
  64.     $ = layui.jquery;
  65. });
  67. //添加管理员
  68. function add() {
  69.     //iframe层
  70.     layer.open({
  71.         type: 2,
  72.         title: '添加管理员',
  73.         shadeClose: true,
  74.         shade: 0.8,
  75.         area: ['380px', '80%'],
  76.         content: '/admins/admin/add', //iframe的url
  77.         btn: ['保存'],
  78.         yes: function(index, layero) {
  79.             //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.子页面的方法名称();
  80.             var iframeWin = window[layero.find('iframe')[0]['name']];;
  81.             iframeWin.save();
  82.         }
  84.     });
  85. }
  87. //修改管理员
  88. function edit(id) {
  89.     //iframe层
  90.     layer.open({
  91.         type: 2,
  92.         title: '修改管理员',
  93.         shadeClose: true,
  94.         shade: 0.8,
  95.         area: ['380px', '80%'],
  96.         content: '/admins/admin/edit?id='+id, //iframe的url
  97.         btn: ['保存'],
  98.         yes: function(index, layero) {
  99.             //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.子页面的方法名称();
  100.             var iframeWin = window[layero.find('iframe')[0]['name']];;
  101.             iframeWin.save();
  102.         }
  104.     });
  105. }
  107. //删除管理员
  108. function del(id) {
  109.     layer.confirm('确认要删除管理员吗？', function() {
  110.         $.get('/admins/admin/del?id=' + id, function(res) {
  111.             if (res.status > 0) {
  112.                 layer.alert(res.msg, {
  113.                     icon: 2
  114.                 });
  115.             } else {
  116.                 layer.msg(res.msg, {
  117.                     time: 3000
  118.                 });
  119.                 window.location.reload();
  120.             }
  121.         }, 'json');
  122.     });
  125. }
  126. </script>
  128. </html>

用户列表显示

3.添加用户add.blade.php

  2. <!DOCTYPE html>
  3. <html lang="en">
  5. <head>
  6.     <meta charset="UTF-8">
  7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8.     <link rel="stylesheet" href="/static/plugins/layui/css/layui.css">
  9.     <script src="/static/plugins/layui/layui.js"></script>
  10.     <title>添加管理员</title>
  11.     <style>
  12.     .layui-form {
  13.         margin-top: 20px;
  14.         margin-right: 20px;
  15.     }
  16.     </style>
  17. </head>
  19. <body>
  20.     <form action="" class="layui-form">
  21.         @csrf
  22.         <div class="layui-form-item">
  23.             <label for="" class="layui-form-label">用户名</label>
  24.             <div class="layui-input-inline">
  25.                 <input type="text" class="layui-input" name="username">
  26.             </div>
  27.         </div>
  28.         <div class="layui-form-item">
  29.             <label for="" class="layui-form-label">密码</label>
  30.             <div class="layui-input-inline">
  31.                 <input type="password" class="layui-input" name="password">
  32.             </div>
  33.         </div>
  35.         <div class="layui-form-item">
  36.             <label for="" class="layui-form-label">角色</label>
  37.             <div class="layui-input-inline">
  38.                 <select name="gid">
  39.                     <option value=""></option>
  40.                     @foreach($groups as $group )
  41.                     <option value="{{$group['gid']}}">{{$group['title']}}</option>
  42.                     @endforeach
  43.                 </select>
  44.             </div>
  46.         </div>
  48.         <div class="layui-form-item">
  49.             <label for="" class="layui-form-label">真实姓名</label>
  50.             <div class="layui-input-inline">
  51.                 <input type="text" class="layui-input" name="real_name">
  52.             </div>
  53.         </div>
  55.         <div class="layui-form-item">
  56.             <label for="" class="layui-form-label">状态</label>
  57.             <div class="layui-input-inline">
  58.                 <input type="checkbox" name="status" lay-skin='switch' lay-text='正常|禁用' checked>
  59.             </div>
  60.         </div>
  61.     </form>
  62. </body>
  64. <script>
  65. layui.use(['form', 'layer'], function() {
  66.     var form = layui.form;
  67.     var layer = layui.layer;
  68.     $ = layui.jquery;
  69. });
  71. //在父窗口中调用了save方法
  72. function save() {
  74.     if ($('input[name="username"]').val().trim() === '') {
  75.         error('请输入用户名');
  76.         return false;
  77.     }
  78.     if ($('input[name="password"]').val().trim() === '') {
  79.         error('请输入密码');
  80.         return false;
  81.     }
  82.     if ($('select[name="gid"]').val().trim() === '') {
  83.         error('请选择角色');
  84.         return false;
  85.     }
  87.     //把form表单中的数据序列化后通过post提交
  88.     var form = $('form').serialize();
  90.     $.post('/admins/admin/save',
  91.         form,
  92.         function(res) {
  93.             if (res.status > 0) {
  94.                 error(res.msg);
  95.             } else {
  96.                 layer.msg(res.msg, {
  97.                     time: 3000
  98.                 });
  99.                 //假设这是iframe页
  100.                 var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
  101.                 //关闭当前窗口
  102.                 parent.layer.close(index); //再执行关闭  
  103.                 //刷新父窗口，重新显示账号管理员列表
  104.                 parent.window.location.reload();
  105.             }
  106.         }, 'json');
  108.     function error(msg) {
  109.         layer.alert(msg, {
  110.             icon: 2
  111.         });
  112.     }
  113. }
  114. </script>
  116. </html>

添加用户

4.修改用户edit.blade.php

  2. <!DOCTYPE html>
  3. <html lang="en">
  5. <head>
  6.     <meta charset="UTF-8">
  7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8.     <link rel="stylesheet" href="/static/plugins/layui/css/layui.css">
  9.     <script src="/static/plugins/layui/layui.js"></script>
  10.     <title>修改管理员</title>
  11.     <style>
  12.     .layui-form {
  13.         margin-top: 20px;
  14.         margin-right: 20px;
  15.     }
  16.     </style>
  17. </head>
  19. <body>
  20.     <form action="" class="layui-form">
  21.         @csrf
  22.         <div class="layui-form-item">
  23.             <input type="hidden" name="aid" value="{{$admin['id']}}">
  24.             <label for="" class="layui-form-label">用户名</label>
  25.             <div class="layui-input-inline">
  26.                 <input type="text" class="layui-input" name="username" disabled value="{{$admin['username']}}">
  27.             </div>
  28.         </div>
  29.         <div class="layui-form-item">
  30.             <label for="" class="layui-form-label">密码</label>
  31.             <div class="layui-input-inline">
  32.                 <input type="password" class="layui-input" name="password">
  33.             </div>
  34.         </div>
  36.         <div class="layui-form-item">
  37.             <label for="" class="layui-form-label">角色</label>
  38.             <div class="layui-input-inline">
  39.                 <select name="gid">
  40.                     <option value=""></option>
  41.                     @foreach($groups as $group )
  42.                     @if($group['gid']==$admin['gid'])
  43.                     <option value="{{$group['gid']}}" selected>{{$group['title']}}</option>
  44.                     @else
  45.                     <option value="{{$group['gid']}}">{{$group['title']}}</option>
  46.                     @endif
  48.                     @endforeach
  49.                 </select>
  50.             </div>
  52.         </div>
  54.         <div class="layui-form-item">
  55.             <label for="" class="layui-form-label">真实姓名</label>
  56.             <div class="layui-input-inline">
  57.                 <input type="text" class="layui-input" name="real_name" value="{{$admin['real_name']}}">
  58.             </div>
  59.         </div>
  61.         <div class="layui-form-item">
  62.             <label for="" class="layui-form-label">状态</label>
  63.             <div class="layui-input-inline">
  64.                 @if($admin['status'])
  65.                 <input type="checkbox" name="status" lay-skin='switch' lay-text='正常|禁用'>
  66.                 @else
  67.                 <input type="checkbox" name="status" lay-skin='switch' lay-text='正常|禁用' checked>
  68.                 @endif
  70.             </div>
  71.         </div>
  72.     </form>
  73. </body>
  75. <script>
  76. layui.use(['form', 'layer'], function() {
  77.     var form = layui.form;
  78.     var layer = layui.layer;
  79.     $ = layui.jquery;
  80. });
  82. //在父窗口中调用了save方法
  83. function save() {
  85.     if ($('select[name="gid"]').val().trim() === '') {
  86.         error('请选择角色');
  87.         return false;
  88.     }
  90.     //把form表单中的数据序列化后通过post提交
  91.     var form = $('form').serialize();
  93.     $.post('/admins/admin/save',
  94.         form,
  95.         function(res) {
  96.             if (res.status > 0) {
  97.                 error(res.msg);
  98.             } else {
  99.                 layer.msg(res.msg, {
  100.                     time: 3000
  101.                 });
  102.                 //假设这是iframe页
  103.                 var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
  104.                 //关闭当前窗口
  105.                 parent.layer.close(index); //再执行关闭  
  106.                 //刷新父窗口，重新显示账号管理员列表
  107.                 parent.window.location.reload();
  108.             }
  109.         }, 'json');
  111.     function error(msg) {
  112.         layer.alert(msg, {
  113.             icon: 2
  114.         });
  115.     }
  116. }
  117. </script>
  119. </html>

修改用户

5.home控制器home.php

  2. <?php
  4. namespace App\Http\Controllers\admins;
  6. use App\Http\Controllers\Controller;
  8. use Illuminate\Support\Facades\Auth;
  10. use Illuminate\Http\Request;
  11. //引入数据库查询构造器，链式调用
  12. use Illuminate\Support\Facades\DB;
  13. //后台主页
  14. class Home extends Controller
  15. {
  16.     public function index()
  17.     {
  19.         $menus = DB::table('admin_menu')->lists();
  20.         $res = [];
  21.         foreach($menus as $menu ):
  22.             //ishidden为0代表该显示该菜单
  23.             //pid等于0的并且的为顶级菜单存储在pmenus中
  24.             if($menu['pid']=='0' && $menu['ishidden']=='0'):
  25.                 $res['pmenus'][] = $menu;
  26.             endif;
  27.             //pid不等于0的为子菜单，按照pid进行分组存储在cmenus中
  28.             if(($menu['pid']!='0')&&($menu['ishidden']=='0')):
  29.                 $res['cmenus'][$menu['pid']][] = $menu;
  30.             endif;
  31.         endforeach;
  33.         $res['username'] = Auth::user()->username;
  34.         // echo '<pre>';
  35.         // print_r($res);
  36.         // exit;
  37.         return view('/admins/home/index',$res);
  38.     }
  40.     public function welcome()
  41.     {
  42.         return view('/admins/home/welcome');
  43.     }
  45.     public function logout()
  46.     {
  47.         Auth::logout();
  48.         return view('/admins/account/login');
  49.     }
  50. }
  52. ?>

6.后台首页index.blade.php,菜单自动加载，显示用户名称，实现用户退出功能

  2. <!DOCTYPE html>
  3. <html lang="en">
  5. <head>
  6.     <meta charset="UTF-8">
  7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8.     <link rel="stylesheet" href="/static/plugins/layui/css/layui.css">
  9.     <script src="/static/plugins/layui/layui.js"></script>
  10.     <title>后台首页</title>
  11.     <style>
  12.     body {
  13.         margin: 0px;
  14.         padding: 0px;
  15.         box-sizing: border-box;
  16.     }
  18.     /* 头部 */
  19.     .header {
  20.         width: 100%;
  21.         height: 50px;
  22.         line-height: 50px;
  23.         background-color: #01AAED;
  24.         color: #fff;
  25.         display: flex;
  26.         flex-flow: row nowrap;
  27.         justify-content: space-between;
  28.     }
  30.     .header h3 {
  31.         margin-left: 20px;
  32.     }
  34.     .header>div {
  35.         margin-right: 20px;
  36.     }
  38.     .header>div>a {
  39.         color: #fff;
  40.     }
  42.     .header>div>a:hover {
  43.         color: orange;
  44.     }
  46.     /* 侧边栏和主页面显示区 */
  47.     .container {
  48.         display: flex;
  49.         flex-flow: row nowrap;
  50.         justify-content: space-between;
  51.         align-items: center;
  52.     }
  54.     /* 侧边栏 */
  55.     .aside {
  56.         width: 200px;
  57.         background-color: #01AAED;
  58.     }
  60.     .aside>.layui-collapse {
  61.         width: 200px;
  62.     }
  64.     .aside .layui-colla-title {
  65.         background-color: #01AAED;
  66.         color: #fff;
  67.     }
  69.     .aside .layui-nav {
  70.         margin-left: -15px;
  71.         margin-top: -10px;
  72.         margin-bottom: -10px;
  73.         width: 197px;
  74.         background-color: #fff;
  75.     }
  77.     .aside .layui-nav .layui-nav-item {
  78.         border-bottom: 1px solid #e2e2e2;
  79.         border-right: 1px solid #e2e2e2;
  80.     }
  82.     .aside .layui-nav .layui-nav-item a {
  83.         color: #333;
  84.     }
  86.     .aside .layui-nav .layui-nav-item a:hover {
  87.         background-color: lightseagreen;
  88.     }
  90.     /* 主页面显示区 */
  91.     .main {
  92.         width: 100%;
  93.     }
  95.     .main>iframe {
  96.         width: 100%;
  97.     }
  98.     </style>
  99. </head>
  101. <body>
  102.     <!-- 头部 -->
  103.     <div class="header">
  104.         <h3>瑄然软件后台管理系统</h3>
  105.         <div>
  106.             <span class="layui-icon layui-icon-username">{{$username}}</span>
  107.             <a href="/admins/home/logout">退出</a>
  108.         </div>
  109.     </div>
  111.     <div class="container">
  112.         <!-- 侧边栏 -->
  113.         <div class="aside">
  114.             <div class="layui-collapse" lay-accordion>
  115.                 @foreach($pmenus as $key => $pmenu)
  116.                 <div class="layui-colla-item">
  117.                     <h2 class="layui-colla-title">{{$pmenu['title']}}</h2>
  118.                     <!-- 默认显示第一个菜单的子菜单 -->
  119.                     <div class="layui-colla-content {{$key?'':'layui-show'}}">
  120.                         <!-- <div class="layui-colla-content layui-show"> -->
  121.                         <ul class="layui-nav layui-nav-tree">
  122.                             <!-- 找到一级菜单所对应的子菜单 -->
  123.                             <?php $cmenu = $cmenus[$pmenu['mid']];?>
  124.                             @foreach($cmenu as $item)
  125.                             <li class="layui-nav-item">
  126.                                 <a href="/admins/{{$item['controller']}}/{{$item['action']}}"
  127.                                     target="showMain">{{$item['title']}}</a>
  128.                             </li>
  129.                             @endforeach
  130.                         </ul>
  131.                     </div>
  132.                 </div>
  133.                 @endforeach
  134.             </div>
  135.         </div>
  136.         <!-- 主页面显示区 -->
  137.         <div class="main">
  138.             <iframe src="/admins/home/welcome" frameborder="0" name="showMain"></iframe>
  139.         </div>
  140.     </div>
  142. </body>
  144. <script>
  145. layui.use(['element', 'layer'], function() {
  146.     var element = layui.element;
  147.     $ = layui.jquery;
  148.     var aside_height = document.documentElement.clientHeight - 50;
  150.     $('.aside').height(aside_height);
  151.     //主页面的高度和侧边栏高度相同
  152.     $('.main>iframe').height(aside_height);
  153. });
  154. </script>
  156. </html>

7.点击退出按钮，用户退出到登录页面

上一条：2020-06-14——1. 居中相关的布局下一条：导航栏的下拉菜单
声明：本文内容转载自脚本之家，由网友自发贡献，版权归原作者所有，如您发现涉嫌抄袭侵权，请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言，请遵守新闻评论服务协议

相关文章

查看更多