后台五角色管理

一、角色列表模块

1、创建角色列表视图模板

2、编辑角色列表视图模板

resources/views/admins/groups/index.blade.php

<!DOCTYPE html>
<html>
<head>
    <title>角色列表</title>
    <link rel="stylesheet" type="text/css" href="/static/layui/css/layui.css">
    <script type="text/javascript" src="/static/layui/layui.js"></script>
</head>
<body style="padding: 10px;">
<div style="text-align: right;">
    <button class="layui-btn layui-btn-sm" onclick="add()"><i class="layui-icon layui-icon-addition"></i>添加</button>
</div>
<table class="layui-table">
    <thead>
    <tr>
        <th>ID</th>
        <th>角色名称</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody>
    @foreach($list as $item)
        <tr>
            <td>{{$item['gid']}}</td>
            <td>{{$item['title']}}</td>
            <td>
                <button class="layui-btn layui-btn-xs" onclick="edit({{$item['gid']}})">修改</button>
            </td>
        </tr>
    @endforeach
    </tbody>
</table>
</body>
</html>
<script type="text/javascript">
    layui.use(['layer'],function(){
        $ = layui.jquery;
        layer = layui.layer;
    });
    // 添加管理员
    function add(){
        layer.open({
            type: 2,
            title: '添加角色',
            shade: 0.3,
            area: ['650px', '90%'],
            content: '/admins/groups/add'
        });
    }
    // 修改菜单
    function edit(gid){
        layer.open({
            type: 2,
            title: '修改角色',
            shade: 0.3,
            area: ['650px', '90%'],
            content: '/admins/groups/edit?gid='+gid
        });
    }
</script>

3、创建角色管理控制器

app/Http/Controllers/admins/Groups.php

<?php
namespace App\Http\Controllers\admins;
use App\Http\Controllers\Controller;
/**
 * 角色管理
 * @package App\Http\Controllers\admins
 */
class Groups extends Controller{
}

4、角色列表控制器处理

app/Http/Controllers/admins/Groups.php

use Illuminate\Support\Facades\DB;
// 角色列表
public function index() {
  $data['list'] = DB::table('admin_group')->lists();
  return view('admins/groups/index', $data);
}

5、角色列表注册路由

routes/web.php

use App\Http\Controllers\admins\Groups;
//显示角色管理列表
Route::get('/admins/Groups/index', [Groups::class, 'index']);

6、查看效果

二、添加与保存角色模块

1、创建添加与保存角色视图模板

2、编辑添加与保存角色视图模板

resources/views/admins/groups/add.blade.php

<!DOCTYPE html>
<html>
<head>
    <title>添加角色</title>
    <link rel="stylesheet" type="text/css" href="/static/layui/css/layui.css">
    <script type="text/javascript" src="/static/layui/layui.js"></script>
</head>
<body style="padding: 10px;">
<form class="layui-form">
    @csrf
    <div class="layui-form-item">
        <label class="layui-form-label">角色名称</label>
        <div class="layui-input-block">
            <input type="text" name="title" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">菜单</label>
        <div class="layui-input-block">
            @foreach($menus_list as $menu)
                <div>
                    <input type="checkbox" lay-skin="primary" name="menus[{{$menu['mid']}}]"
                           title="<span style='font-weight:bold'>{{$menu['title']}}</span>">
                </div>
                @foreach($menu['children'] as $chd)
                    <input type="checkbox" lay-skin="primary" name="menus[{{$chd['mid']}}]" title="{{$chd['title']}}">
                @endforeach
                <hr>
            @endforeach
        </div>
    </div>
</form>
<div class="layui-input-block">
    <button class="layui-btn" onclick="save()">保存</button>
</div>
</body>
</html>
<script type="text/javascript">
    layui.use(['form', 'layer'], function () {
        $ = layui.jquery;
        form = layui.form;
        layer = layui.layer;
    });
    // 保存
    function save() {
        var title = $('input[name="title"]').val();
        if (title == '') {
            return layer.alert('请填写角色名称', {icon: 2});
        }
        $.post('/admins/groups/save', $('form').serialize(), function (res) {
            if (res.code > 0) {
                return layer.alert(res.msg, {icon: 2});
            }
            layer.msg(res.msg);
            setTimeout(function () {
                parent.window.location.reload();
            }, 1000);
        }, 'json');
    }
</script>

3、添加与保存角色控制器处理

app/Http/Controllers/admins/Groups.php

 // 添加角色
    public function add() {
        // 查询数据库可用的菜单
        $data['menus_list'] = DB::table('admin_menu')->where('pid', 0)->where('isdel', 0)->where('status', 0)->lists();
        // 所有菜单
        $all_menus = DB::table('admin_menu')->where('isdel', 0)->where('status', 0)->lists();
        foreach ($data['menus_list'] as $key => $val) {
            $data['menus_list'][$key]['children'] = [];
            foreach ($all_menus as $k => $item) {
                if ($val['mid'] == $item['pid']) {
                    $data['menus_list'][$key]['children'][] = $item;
                }
            }
        }
        return view('admins/groups/add', $data);
    }
    // 保存角色
    public function save(Request $req) {
        $data['title'] = trim($req->title);
        $menus = $req->menus;
        $menu_ids = array_keys($menus);
        if ($data['title'] == '') {
            return json_encode(array('code' => 1, 'msg' => '角色名称不能为空'));
        }
        $data['rights'] = json_encode($menu_ids);
        DB::table('admin_group')->insert($data);
        return json_encode(array('code' => 0, 'msg' => '保存成功'));
    }

4、添加与保存角色注册路由

routes/web.php

//添加角色 处理
Route::get('/admins/groups/add', [Groups::class, 'add']);
//保存角色 处理
Route::post('/admins/groups/save', [Groups::class, 'save']);

5、查看效果

三、编辑与保存编辑角色模块

1、创建编辑与保存编辑角色视图模板

2、编辑编辑与保存编辑角色视图模板

resources/views/admins/groups/edit.blade.php

<!DOCTYPE html>
<html>
<head>
    <title>修改角色</title>
    <link rel="stylesheet" type="text/css" href="/static/layui/css/layui.css">
    <script type="text/javascript" src="/static/layui/layui.js"></script>
</head>
<body style="padding: 10px;">
<form class="layui-form">
    @csrf
    <input type="hidden" name="gid" value="{{$group['gid']}}">
    <div class="layui-form-item">
        <label class="layui-form-label">角色名称</label>
        <div class="layui-input-block">
            <input type="text" name="title" class="layui-input" value="{{$group['title']}}">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">菜单</label>
        <div class="layui-input-block">
            @foreach($menus_list as $menu)
                <div>
                    <input type="checkbox" lay-skin="primary" name="menus[{{$menu['mid']}}]"
                           {{in_array($menu['mid'],$group['rights'])?'checked':''}}
                           title="<span style='font-weight:bold'>{{$menu['title']}}</span>">
                </div>
                @foreach($menu['children'] as $chd)
                    <input type="checkbox" lay-skin="primary" name="menus[{{$chd['mid']}}]"
                          {{in_array($chd['mid'],$group['rights'])?'checked':''}} title="{{$chd['title']}}">
                @endforeach
                <hr>
            @endforeach
        </div>
    </div>
</form>
<div class="layui-input-block">
    <button class="layui-btn" onclick="save()">保存</button>
</div>
</body>
</html>
<script type="text/javascript">
    layui.use(['form', 'layer'], function () {
        $ = layui.jquery;
        form = layui.form;
        layer = layui.layer;
    });
    // 保存
    function save() {
        var title = $('input[name="title"]').val();
        if (title == '') {
            return layer.alert('请填写角色名称', {icon: 2});
        }
        $.post('/admins/groups/save_edit', $('form').serialize(), function (res) {
            if (res.code > 0) {
                return layer.alert(res.msg, {icon: 2});
            }
            layer.msg(res.msg);
            setTimeout(function () {
                parent.window.location.reload();
            }, 1000);
        }, 'json');
    }
</script>

3、编辑与编辑保存角色控制器处理

app/Http/Controllers/admins/Groups.php

// 修改
    public function edit(Request $req) {
        // 当前角色
        $gid = (int)$req->gid;
        $data['group'] = DB::table('admin_group')->where('gid', $gid)->item();
        if ($data['group']['rights']) {
            $data['group']['rights'] = json_decode($data['group']['rights'], true);
        }
        // 查询数据库可用的菜单
        $data['menus_list'] = DB::table('admin_menu')->where('pid', 0)->where('isdel', 0)->where('status', 0)->lists();
        // 所有菜单
        $all_menus = DB::table('admin_menu')->where('isdel', 0)->where('status', 0)->lists();
        foreach ($data['menus_list'] as $key => $val) {
            $data['menus_list'][$key]['children'] = [];
            foreach ($all_menus as $k => $item) {
                if ($val['mid'] == $item['pid']) {
                    $data['menus_list'][$key]['children'][] = $item;
                }
            }
        }
        return view('admins/groups/edit', $data);
    }
    // 保存修改
    public function save_edit(Request $req) {
        $gid = (int)$req->gid;
        $data['title'] = trim($req->title);
        $menus = $req->menus;
        $menu_ids = array_keys($menus);
        if ($data['title'] == '') {
            return json_encode(array('code' => 1, 'msg' => '角色名称不能为空'));
        }
        $data['rights'] = json_encode($menu_ids);
        DB::table('admin_group')->where('gid', $gid)->update($data);
        return json_encode(array('code' => 0, 'msg' => '保存成功'));
    }

4、编辑与编辑保存角色注册路由

//编辑角色 弹窗
Route::get('/admins/groups/edit', [Groups::class, 'edit']);
//保存编辑角色 处理
Route::post('/admins/groups/save_edit', [Groups::class, 'save_edit']);

后台五 角色管理

一、角色列表 模块

1、创建 角色列表 视图模板

2、编辑 角色列表 视图模板

3、创建 角色管理 控制器

4、角色列表 控制器处理

5、角色列表 注册路由

6、查看效果

二、添加与保存角色 模块

1、创建 添加与保存角色 视图模板

2、编辑 添加与保存角色 视图模板

3、添加与保存角色 控制器处理

4、添加与保存角色 注册路由

5、查看效果

三、编辑与保存编辑角色 模块

1、创建 编辑与保存编辑角色 视图模板

2、编辑 编辑与保存编辑角色 视图模板

3、编辑与编辑保存角色 控制器处理

4、编辑与编辑保存角色 注册路由

5、查看效果

相关文章

一、角色列表模块

1、创建角色列表视图模板

2、编辑角色列表视图模板

3、创建角色管理控制器

4、角色列表控制器处理

5、角色列表注册路由

二、添加与保存角色模块

1、创建添加与保存角色视图模板

2、编辑添加与保存角色视图模板

3、添加与保存角色控制器处理

4、添加与保存角色注册路由

三、编辑与保存编辑角色模块

1、创建编辑与保存编辑角色视图模板

2、编辑编辑与保存编辑角色视图模板

3、编辑与编辑保存角色控制器处理

4、编辑与编辑保存角色注册路由