<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:sptg="http://www.thymeleaf.org">
    <head>
        <script th:replace="common/head"></script>
        <!-- 样式 -->
        <style>
            html,body{
                height: 100%;
                padding: 0;
                margin: 0;
                overflow: hidden;
            }
            .layui-fluid {
                height: calc(100% - 30px);
                padding: 15px;
            }
            /*.layui-fluid .layui-row{*/
                /*height: calc(100% - 68px);*/
            /*}*/
            .dict_tree{
                width: 100%;
                min-height: 200px;
                height: calc(100% - 68px);
                overflow-y: scroll;
            }
            .dict_form {
                width: 350px;
                position: absolute;
                top: 68px;
                right: 50px;
                border: 1px solid #ebeef5;
            }
            #entity_delete_btn{
                display: none;
            }
        </style>
    </head>
    <body>
        <div class="layui-fluid">
            <div class="layui-card-body">
                <div class="layui-btn-container">
                    <button class="layui-btn" id="entity_add_btn" sptg:security="dict:add">添加字典</button>
                </div>
            </div>

            <ul class="dict_tree" id="dictTree"></ul>


            <div class="layui-card dict_form">
                <div class="layui-card-header">字典详情</div>
                <form class="layui-form" lay-filter="entity_form">
                    <div class="layui-card-body layui-row layui-col-space10">
                        <input type="hidden" name="id" />
                        <!-- 父节点 -->
                        <div class="layui-col-md12">
                            <select id="entity_pid_select" lay-filter="entity_pid_select" name="pid" lay-search="">
                                <option value="">请选择</option>
                            </select>
                            <div class="layui-form-select">
                                <div class="layui-select-title">
                                    <input type="text" placeholder="" value="" class="layui-input">
                                    <i class="layui-edge"></i>
                                </div>
                                <dl class="layui-anim layui-anim-upbit"></dl>
                            </div>
                        </div>
                        <!-- code -->
                        <div class="layui-col-md12">
                            <input type="text" name="code" placeholder="字典编码" lay-verify="required" autocomplete="off" class="layui-input">
                        </div>
                        <!-- 字典名称 -->
                        <div class="layui-col-md12">
                            <input type="text" name="dictValue" lay-verify="required|specialCharacters" placeholder="字典名称" autocomplete="off" class="layui-input">
                        </div>
                        <!-- 字典键值 -->
                        <div class="layui-col-md12">
                            <input type="text" name="dictKey" placeholder="字典键值" autocomplete="off" class="layui-input">
                        </div>
                        <!--
                            类型： { 1：菜单，2：按钮，3：文件夹 }
                            选中菜单时：Token，路径 必填
                            选中按钮时：Token 必填，路径 禁用
                            选中文件夹时：Token，路径 禁用
                        -->

                        <!-- 路径 -->
                        <div class="layui-col-md12">
                            <input type="text" name="remark" placeholder="备注" autocomplete="off" class="layui-input">
                        </div>
                        <!-- 提交按钮 -->
                        <div class="layui-col-md12">
                            <button class="layui-btn" id="entity_submit_btn" lay-submit sptg:security="dict:add">提交</button>
                            <div class="layui-btn layui-btn-danger" id="entity_delete_btn" sptg:security="dict:delete">
                                <i class="layui-icon">&#xe640;</i>
                                <span>删除</span>
                            </div>
                        </div>
                    </div>
                </form>
            </div>

            <!--<div class="layui-row">
                &lt;!&ndash; 菜单树形预览 &ndash;&gt;
                <div class="layui-col-xs6">
                    &lt;!&ndash;<ul class="menu_tree" id="menuTree"></ul>&ndash;&gt;
                </div>
                &lt;!&ndash; 表单 &ndash;&gt;
                <div class="layui-col-xs6">
                    <div class="layui-card menu_form">
                        <div class="layui-card-header">菜单详情</div>
                        <form class="layui-form" lay-filter="entity_form">
                            <div class="layui-card-body layui-row layui-col-space10">
                                <input type="hidden" name="id" />
                                &lt;!&ndash; 菜单名称 &ndash;&gt;
                                <div class="layui-col-md12">
                                    <input type="text" name="name" lay-verify="required" placeholder="菜单名称" autocomplete="off" class="layui-input">
                                </div>
                                &lt;!&ndash; 父节点 &ndash;&gt;
                                <div class="layui-col-md12">
                                    <select id="entity_pid_select" name="pid" lay-verify="required" lay-search=""></select>
                                    <div class="layui-form-select">
                                        <div class="layui-select-title">
                                            <input type="text" placeholder="" value="" class="layui-input">
                                            <i class="layui-edge"></i>
                                        </div>
                                        <dl class="layui-anim layui-anim-upbit"></dl>
                                    </div>
                                </div>
                                &lt;!&ndash; 图标 &ndash;&gt;
                                <div class="layui-col-md12">
                                    <input type="text" name="icon" placeholder="图标" autocomplete="off" class="layui-input">
                                </div>
                                &lt;!&ndash;
                                    类型： { 1：菜单，2：按钮，3：文件夹 }
                                    选中菜单时：Token，路径 必填
                                    选中按钮时：Token 必填，路径 禁用
                                    选中文件夹时：Token，路径 禁用
                                &ndash;&gt;
                                <div class="layui-col-md12">
                                    <input type="radio" name="type" value="1" title="菜单" checked />
                                    <input type="radio" name="type" value="2" title="按钮" />
                                    <input type="radio" name="type" value="3" title="文件夹" />
                                </div>
                                &lt;!&ndash; Token &ndash;&gt;
                                <div class="layui-col-md12">
                                    <input type="text" name="token" placeholder="Token" lay-verify="required" autocomplete="off" class="layui-input">
                                </div>
                                &lt;!&ndash; 路径 &ndash;&gt;
                                <div class="layui-col-md12">
                                    <input type="text" name="path" placeholder="路径" lay-verify="required" autocomplete="off" class="layui-input">
                                </div>
                                &lt;!&ndash; 提交按钮 &ndash;&gt;
                                <div class="layui-col-md12">
                                    <button class="layui-btn" id="entity_submit_btn" lay-submit>提交</button>
                                    <div class="layui-btn layui-btn-danger" id="entity_delete_btn">
                                        <i class="layui-icon">&#xe640;</i>
                                        <span>删除</span>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>-->

        </div>

    </body>
    <!-- javascript -->
    <script th:src="@{'/layui/layui.js'}"></script>
    <script>
        layui.config({
            base: '/' //静态资源所在路径
        });
    </script>
    <script th:src="@{'/js/permissions/dict-manage.js'}"></script>

</html>