[BD] 自定义Admin

1.生成菜单和CURD代码

CURD生成代码, 选择ba_admin表, 菜单名: 用户管理
规则和路由都填:adminUser, 选好icon, 高级选项那里, 简单选一下

2.添加自定义的新增按钮, 隐藏掉原来的

web\src\views\backend\adminUser\index.vue

3.删除原本的编辑,添加

4.将角色列表的角色ID显示出来

web\src\views\backend\auth\group\index.vue

5.添加弹窗的代码

web\src\views\backend\adminUser\addUser.vue

<template>
    <div>
        <el-dialog v-model="isOpen" title="添加用户">
            <el-form :model="form" :rules="rules">
                <el-form-item label="登录名" prop="username">
                    <el-input v-model="form.username" autocomplete="off" placeholder="由英文和数字组成,不可输入中文" />
                </el-form-item>
                <el-form-item label="昵称" prop="nickname">
                    <el-input v-model="form.nickname" autocomplete="off" />
                </el-form-item>
                <el-form-item label="密码"  prop="password">
                    <el-input v-model="form.password"  type="password" autocomplete="off" />
                </el-form-item>
                <el-form-item label="用户组"  prop="group_id">
                    <el-select v-model="form.group_id" placeholder="请选择用户组">
                        <el-option :label="item.title" :value="item.id" :key="item.id" v-for="item in group" />
                    </el-select>
                </el-form-item>
                <el-form-item label="上级用户" prop="pid" v-show="userLiserShow">
                    <el-select v-model="form.pid" placeholder="上级用户">
                        <el-option :label="item.title" :value="item.id" :key="item.id" v-for="item in pidList" />
                    </el-select>
                </el-form-item>
            </el-form>
            <template #footer>
                <span class="dialog-footer">
                    <el-button @click="isOpen = false">取消</el-button>
                    <el-button type="primary" @click="onSubmit"> 确认</el-button>
                </span>
            </template>
        </el-dialog>
    </div>
</template>

<script setup lang='ts'>
    import { useAdminInfo } from '/@/stores/adminInfo'
    import { reactive, ref, watchEffect, inject } from 'vue'
    import { ElMessage, FormRules } from 'element-plus'
    import { CreateUser, getUserGroup, getPidUser } from '/@/api/backend/adminapi'

    // el-upload中的属性data, 用来传值, 这里名称要对应
    const form = reactive({
        username: '',
        nickname:'',
        password:'',
        group_id:'',
        pid:'',
    })

    const isOpen = inject('isOpen')
    // const adminInfo = useAdminInfo()

    // 表单验证
    const rules = reactive<FormRules>({
        username: [
            { required: true, message: '请输入用户名', trigger: 'blur' },
            { min: 4, max: 12, message: '请输入4-12个字符', trigger: 'blur' },
        ],
        nickname: [
            { required: true, message: '请输入昵称', trigger: 'blur' },
            { min: 2, max: 12, message: '请输入2-12个字符', trigger: 'blur' },
        ],
        password: [
            { required: true, message: '请输入密码', trigger: 'blur' },
            { min: 6, max: 12, message: '请输入6-12个字符', trigger: 'blur' },
        ],
        group_id: [
            { required: true, message: '请选择用户组', trigger: 'blur' }
        ]
    })

    // 获取下拉用户列表
    const group = reactive([]);
    getUserGroup().then((res)=> {
       group.push(...res.data)
    })

    // 获取上级用户列表
    const pidList = reactive([]);
    let userLiserShow = ref(false);
    getPidUser().then((res)=> {
       console.log(res);
       pidList.push(...res.data)
       if (res.data.length > 0) {
         userLiserShow.value = true;
       }
    })

    // 表单提交
    const onSubmit = () => {
        console.log('submit!', form)
        CreateUser(form).then((res)=> {
            console.log(res);
            if (res.code === 1) {
                  ElMessage({message: '添加成功',type: 'success', onClose: () => {
                        isOpen.value = false
                  }})
            } else {
                ElMessage({message: '添加失败',type: 'warning'})
            }
        })
    }

    
</script>

6.封装api

web\src\api\backend\adminapi.ts

import { getUrl} from '/@/utils/axios'
import { useAdminInfo } from '/@/stores/adminInfo'
import createAxios from '/@/utils/axios'


// 获取导入的URL, 记得调用时要写()
// 引用: import { getUserTree } from '/@/api/backend/adminapi'
// 使用: getUserTree()

export function getUserTree() {
    let url = getUrl() + '/admin/api/getUserTree' + '?server=1'
    return createAxios({
        url:url,
        method: 'get',
    })
}


// 添加用户
export function CreateUser(data: anyObj) {
    let url = getUrl() + '/admin/AdminUser/CreateUser' + '?server=1'
    return createAxios(
        {
            url: url,
            method: 'post',
            data: data,
        }
    )
}

// 获取可选用户组
export function getUserGroup() {
    let url = getUrl() + '/admin/AdminUser/getUserGroup' + '?server=1'
    return createAxios({
        url:url,
        method: 'get',
    })
}

// 获取用户列表(用于选择上级用户)
export function getPidUser() {
    let url = getUrl() + '/admin/AdminUser/getPidUser' + '?server=1'
    return createAxios({
        url:url,
        method: 'get',
    })
}

7.控制器

app\admin\controller\AdminUser.php

<?php

namespace app\admin\controller;

use app\common\controller\Backend;
use ba\Random;
use think\db\exception\PDOException;
use think\exception\ValidateException;
use Exception;
use think\facade\Config;
use think\facade\Db;
use app\admin\model\AdminUser as AdminUserModel;
/**
 * 
 * 用户管理
 *
 */
class AdminUser extends Backend
{
    /**
     * AdminUser模型对象
     * @var \app\admin\model\AdminUser
     */
    protected $model = null;
    
    protected $preExcludeFields = ['id', 'username', 'avatar', 'createtime', 'status', 'pid'];

    protected $quickSearchField = ['id', 'username', 'nickname'];

    public function initialize()
    {
        parent::initialize();
        $this->model = new \app\admin\model\AdminUser;
    }


    /**
     * 若需重写查看、编辑、删除等方法，请复制 @see \app\admin\library\traits\Backend 中对应的方法至此进行重写
     */

    // 列表
    public function index()
    {
        $this->request->filter(['strip_tags', 'trim']);
        if ($this->request->param('select')) {
            $this->select();
        }

        $field = ['id', 'username', 'nickname', 'avatar', 'mobile', 'createtime', 'status', 'pid'];
        list($where, $alias, $limit, $order) = $this->queryBuilder();
        $query = $this->model
            ->field($field)
            ->withJoin($this->withJoinTable, $this->withJoinType)
            ->alias($alias)
            ->where($where);
        if (! $this->auth->isSuperAdmin()) {
            $uidArr = $this->model->getChildArr($this->auth->getAdmin()->id);
            $query->whereIn('id', $uidArr);
        }
        $res = $query->order($order)->paginate($limit);
        $list = $res->items();
        
        foreach ($list as &$user) {
            $user['pid'] = $this->model->getNickname($user['pid']);
        }

        $this->success('', [
            'list'   => $list,
            'total'  => $res->total(),
            'remark' => get_route_remark(),
        ]);
    }

    /**
     * 添加用户
     */
    public function CreateUser()
    {
        if ($this->request->isPost()) {
            $data = $this->request->post();

            if (!$data) {
                $this->error(__('Parameter %s can not be empty', ['']));
            }

            /**
             * 由于有密码字段-对方法进行重写
             * 数据验证
             */
            if ($this->modelValidate) {
                try {
                    $validate = str_replace("\\model\\", "\\validate\\", get_class($this->model));
                    $validate = new $validate;
                    $validate->scene('add')->check($data);
                } catch (ValidateException $e) {
                    $this->error($e->getMessage());
                }
            }

            $salt   = Random::build('alnum', 16);
            $passwd = encrypt_password($data['password'], $salt);

            // 上级用户
            if ($this->auth->isSuperAdmin()) {
                $pid = trim($data['pid']);
            } else {
                $pid = $this->auth->getAdmin()->id; // 上级用户
            }

            $username = trim($data['username']);
            $data   = $this->excludeFields($data);
            $result = false;

            Db::startTrans();
            try {
                $data['salt']     = $salt;
                $data['password'] = $passwd;
                $data['group_arr'] = [$data['group_id']]; // 格式化成权限需要的模式
                $data['username'] = $username;
                $data['createtime'] = time();
                $data['pid'] = $pid;
                /**
                 * array:7 [
                 *  "status" => "1"
                 *  "username" => "zhangsan"
                 *  "nickname" => "张三"
                 *  "group_arr" => array:1 [
                 *      0 => "3"
                 *   ]
                 *   "mobile" => "13800138000"
                 *   "salt" => "RpUoGcwnvTl68myO"
                 *   "password" => "32488ff98fcdae4d3a125490d1c81146"
                 *  ]
                 */
                $result  = $this->model->save($data); // 1.添加用户
                if ($data['group_arr']) {
                    $groupAccess = [];
                    foreach ($data['group_arr'] as $datum) {
                        $groupAccess[] = [
                            'uid'      => $this->model->id,
                            'group_id' => $datum,
                        ];
                    }
                    /**
                     * array:1 [
                     *    0 => array:2 ["uid" => 6, "group_id" => "3"]
                     *  ]
                     */
                    Db::name('admin_group_access')->insertAll($groupAccess); // 2.添加用户权限关联
                }
                Db::commit();
            } catch (ValidateException|PDOException|Exception $e) {
                Db::rollback();
                $this->error($e->getMessage());
            }
            if ($result !== false) {
                $this->success("添加用户成功");
            } else {
                $this->error("添加失败");
            }

        } else {
            $this->error("ERROR");
        }
    }


    /**
     * 根据登录用户的角色, 展示添加列表时的可选角色
     */
   public function getUserGroup()
   {
        $group_id = $this->auth->getAdminGroupId(); //获取用户组ID
        $group = $this->model->getGroupSelect($group_id);
        return $this->success('', $group);
   }

   /**
    * 获取上级用户列表
    */
   public function getPidUser()
   {
        $isSuper = $this->auth->isSuperAdmin();
        if ($isSuper) {
            $list = $this->model->getPidUser();
        } else {
            $list = [];
        }
        $this->success('', $list);
   }

}

8.用户模型

app\admin\model\AdminUser.php

<?php

namespace app\admin\model;

use think\Model;
use app\admin\library\Auth;

/**
 * AdminUser
 */
class AdminUser extends Model
{
    // 表名
    protected $name = 'admin';

    // 自动写入时间戳字段
    protected $autoWriteTimestamp = false;

    const GROUP_SUPER = 1;
    const GROUP_LEVEL1 = 2;
    const GROUP_LEVEL2 = 3;
    const GROUP_LEVEL3 = 4;
    public $group = [
        self::GROUP_SUPER => '超级管理员',
        self::GROUP_LEVEL1 => '1级管理员',
        self::GROUP_LEVEL2 => '2级管理员',
        self::GROUP_LEVEL3 => '3级管理员',
    ];
    
    // 超管可选的用户组, 但是如果不是选择的L1, 需要指定上级
    public $group_super = [
        self::GROUP_LEVEL1,
        self::GROUP_LEVEL2,
        self::GROUP_LEVEL3,
    ];

    // 总监可选的用户组
    public $group_level1 = [
        self::GROUP_LEVEL2,
        self::GROUP_LEVEL3,
    ];

    // 组长可选的用户组
    public $group_level2 = [
        self::GROUP_LEVEL2,
        self::GROUP_LEVEL3,
    ];

    /**
     * 获取用户组
     */
    public function getGroupSelect($group_id)
    {
        switch($group_id) {
            case self::GROUP_SUPER:
                $group = $this->group_super;
                break;
            case self::GROUP_LEVEL1:
                $group = $this->group_level1;
                break;
            case self::GROUP_LEVEL2:
                $group = $this->group_level2;
                break;
            default:
                $group = []; 
                break;
        }

        $result = [];
        foreach ($group as $gid) {
           $result[] = [
                'id'    => $gid,
                'title' => $this->group[$gid]
           ]; 
        }
        return $result;
    }

    
    /**
     * 获取上级用户列表
     */
    public function getPidUser() 
    {
        $auth = new Auth();
        $uidArr = $auth->getGroupAdmins([self::GROUP_LEVEL1, self::GROUP_LEVEL2]);
        
        $list = $this->field(['id','nickname as title'])->whereIn('id', $uidArr)->select()->toArray();
        return $list;
    }
    
    // 获取用户名
    public function getNickname($uid)
    {
        return $this->where("id", $uid)->value('nickname');
    }

}

9.验证器

app\admin\validate\AdminUser.php

<?php

namespace app\admin\validate;

use think\Validate;

class AdminUser extends Validate
{
    protected $failException = true;

    protected $rule = [
        'username'  => 'require|regex:^[a-zA-Z][a-zA-Z0-9_]{2,15}$|unique:admin',
        'nickname'  => 'require',
        'password'  => 'require|regex:^(?!.*[&<>"\'\n\r]).{6,32}$',
        'group_id' => 'require',
    ];
    protected $message = [];
    protected $field = [
    ];

    // 验证场景
    protected $scene = [
        'add' => ['username', 'nickname', 'password', 'group_id'],
    ];

    public function __construct()
    {
        $this->field   = [
            'username'  => __('Username'),
            'nickname'  => __('Nickname'),
            'password'  => __('Password'),
            'group_id' => __('Group Name Arr'),
        ];
        $this->message = array_merge($this->message, [
            'username.regex' => __('Please input correct username'),
            'password.regex' => __('Please input correct password'),
        ]);
        parent::__construct();
    }
}

10.Auth文件

app\admin\library\Auth.php

    /**************************** 自定义方法 *******************************/
    /**
     * 获取管理员组ID(角色ID)
     */
    public function getAdminGroupId()
    {
        $groupId = $this->getAdmin()->group_arr;
        if ($groupId && count($groupId) == 1) {
            return $groupId[0];
        } else {
            return 0;
        }
    }

     /**
     * 获取管理员UID
     */
    public function getUid()
    {
        return $this->getAdmin()->id;
    }