<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1">
    <!-- Google Chrome Frame也可以让IE用上Chrome的引擎: -->
    <meta name="renderer" content="webkit">
    <!--国产浏览器高速模式-->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 作者 -->
    <meta name="author" content="silos"/>
    <meta name="revised" content="Silos-Admin-v-2.0.0"/>
    <!-- 定义页面的最新版本 -->
    <meta name="description" content="网站简介"/>
    <!-- 网站简介 -->
    <meta name="keywords" content="搜索关键字，以半角英文逗号隔开"/>
    <title>Index</title>
    <!-- 公共样式 开始 -->
    <link rel="shortcut icon" href="../../../static/assets/silos/img/favicon.png"
          th:href="@{/assets/silos/img/favicon.png}"/>
    <link rel="bookmark" href="../../../static/assets/silos/img/favicon.png"
          th:href="@{/assets/silos/img/favicon.png}"/>
    <link rel="stylesheet" href="../../../static/assets/library/layui/css/layui.css"
          th:href="@{/assets/library/layui/css/layui.css}"/>
    <link rel="stylesheet" href="../../../static/assets/library/fonts/fontawesome/css/all.css"
          th:href="@{/assets/library/fonts/fontawesome/css/all.css}"/>
    <link rel="stylesheet" href="../../../static/business/upms/role/css/list.css" th:href="@{/business/upms/role/css/list.css}"/>
</head>
<body>
<div class="container">
    <div class="dashboard-cards">
        <div class="card card-total">
            <div class="card-icon">
                <i class="fas fa-tags"></i>
            </div>
            <div class="card-title">总角色数</div>
            <div class="card-value">48</div>
            <div class="card-trend trend-up">
                <i class="fas fa-arrow-up"></i> 3.2% 较上月
            </div>
        </div>
        <div class="card card-active">
            <div class="card-icon">
                <i class="fas fa-toggle-on"></i>
            </div>
            <div class="card-title">启用角色</div>
            <div class="card-value">42</div>
            <div class="card-trend trend-up">
                <i class="fas fa-arrow-up"></i> 1.8% 较上月
            </div>
        </div>
        <div class="card card-admin">
            <div class="card-icon">
                <i class="fas fa-user-shield"></i>
            </div>
            <div class="card-title">管理员角色</div>
            <div class="card-value">12</div>
            <div class="card-trend trend-up">
                <i class="fas fa-arrow-up"></i> 0.5% 较上月
            </div>
        </div>
        <div class="card card-system">
            <div class="card-icon">
                <i class="fas fa-cogs"></i>
            </div>
            <div class="card-title">系统角色</div>
            <div class="card-value">6</div>
            <div class="card-trend trend-down">
                <i class="fas fa-arrow-down"></i> 0.2% 较上月
            </div>
        </div>
    </div>

    <div class="search-section">
        <div class="search-row">
            <div class="form-group">
                <label for="roleName">角色名称</label>
                <input type="text" id="roleName" class="form-control" placeholder="输入角色名称">
            </div>
            <div class="form-group">
                <label for="roleType">角色类型</label>
                <select id="roleType" class="form-control">
                    <option value="">全部</option>
                    <option value="0">普通角色</option>
                    <option value="1">普通管理员</option>
                    <option value="2">区域管理员</option>
                    <option value="3">平台管理员</option>
                    <option value="5">系统管理员</option>
                    <option value="9">超级管理员</option>
                </select>
            </div>
            <div class="form-group">
                <label for="enabled">启用状态</label>
                <select id="enabled" class="form-control">
                    <option value="">全部</option>
                    <option value="1">启用</option>
                    <option value="0">禁用</option>
                </select>
            </div>
        </div>
        <div class="search-actions">
            <div>
                <button class="btn btn-light reset_btn">
                    <i class="fas fa-redo"></i> 重置
                </button>
                <button class="btn btn-info refresh">
                    <i class="fas fa-redo"></i> 刷新
                </button>
                <button class="btn btn-success add_btn">
                    <i class="fa-solid fa-person-circle-plus"></i> 添加角色
                </button>
                <button class="btn btn-warning allot_btn">
                    <i class="fa-solid fa-person-circle-plus"></i> 分配权限
                </button>
                <button class="btn btn-danger delAll_btn">
                    <i class="fa-regular fa-trash-can"></i> 批量删除
                </button>
            </div>
            <div>
                <button class="btn btn-primary search_btn">
                    <i class="fas fa-search"></i> 搜索
                </button>
            </div>
        </div>
    </div>
    <table id="list" lay-filter="list"></table>
    <!--操作-->
    <script type="text/html" id="listBar">
        <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
        <a class="layui-btn layui-btn-xs layui-btn-warm" lay-event="usable">已启用</a>
        <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del">删除</a>
    </script>
</div>
<script src="../../../static/assets/library/jquery/jquery.js" th:src="@{/assets/library/jquery/jquery.js}"></script>
<script src="../../../static/assets/library/layui/layui.js" th:src="@{/assets/library/layui/layui.js}"></script>
<script src="../../../static/business/upms/role/js/list.js" th:src="@{/business/upms/role/js/list.js}"></script>
</body>
</html>