Initial commit
This commit is contained in:
易焱
@@ -0,0 +1,138 @@
|
||||
<!DOCTYPE html>
|
||||
<html xmlns:th="http://www.thymeleaf.org"
|
||||
>
|
||||
<head th:replace="/common/template :: header(~{::title},~{::link},~{::style})">
|
||||
<link rel="stylesheet" th:href="@{/lib/zTree_v3/css/zTreeStyle/zTreeStyle.css}" type="text/css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="layui-form timo-compile">
|
||||
<form th:action="@{/system/menu/save}">
|
||||
<input type="hidden" name="id" th:if="${menu}" th:value="${menu.id}"/>
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label required">标题</label>
|
||||
<div class="layui-input-inline">
|
||||
<input class="layui-input" type="text" name="title" placeholder="请输入标题" th:value="${menu?.title}">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label required">URL地址</label>
|
||||
<div class="layui-input-inline">
|
||||
<input class="layui-input url-input" type="text" name="url" placeholder="请输入URL地址" th:value="${menu?.url}">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label required">权限标识</label>
|
||||
<div class="layui-input-inline">
|
||||
<input class="layui-input perms-input" type="text" name="perms" placeholder="请输入权限标识" th:value="${menu?.perms}">
|
||||
</div>
|
||||
<button class="layui-btn layui-btn-primary layui-btn-xs perms-refresh" style="margin-top: 8px">
|
||||
<i class="layui-icon layui-icon-refresh" style="margin-right: 0"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label">菜单图标</label>
|
||||
<div class="layui-input-inline">
|
||||
<input class="layui-input icon-input" type="text" name="icon" placeholder="请输入菜单图标" th:value="${menu?.icon}">
|
||||
</div>
|
||||
<i th:class="'icon-show '+${menu?.icon}" style="line-height: 38px;"></i>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label required">父级菜单</label>
|
||||
<div class="layui-input-inline">
|
||||
<input class="layui-input select-tree" th:attr="data-url=@{/system/menu/list}, data-value=${pMenu?.id}" type="text" name="pid" placeholder="请输入父级菜单" th:value="${pMenu?.title}">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label required">菜单类型</label>
|
||||
<div class="layui-input-inline">
|
||||
<select name="type" mo:dict="MENU_TYPE" mo-selected="${menu?.type}" mo-empty="" lay-verify="type"></select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label">排序</label>
|
||||
<div class="layui-input-inline">
|
||||
<select class="select-sort" name="sort"
|
||||
th:attr="data-url=@{/system/menu/sortList}, data-id=${menu?.id}, data-sort=${menu?.sort}" lay-verify="sort"></select>
|
||||
</div>
|
||||
<div class="layui-input-info">（之后）</div>
|
||||
</div>
|
||||
<div class="layui-form-item layui-form-text">
|
||||
<label class="layui-form-label">备注</label>
|
||||
<div class="layui-input-block">
|
||||
<textarea placeholder="请输入内容" class="layui-textarea" name="remark">[[${menu?.remark}]]</textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item timo-finally">
|
||||
<button class="layui-btn ajax-submit"><i class="fa fa-check-circle"></i> 保存</button>
|
||||
<button class="layui-btn btn-secondary close-popup"><i class="fa fa-times-circle"></i> 关闭</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<script th:replace="/common/template :: script"></script>
|
||||
<script type="text/javascript" th:src="@{/js/plugins/jquery-3.3.1.min.js}"></script>
|
||||
<script type="text/javascript" th:src="@{/lib/zTree_v3/js/jquery.ztree.core.min.js}"></script>
|
||||
<script type="text/javascript" th:src="@{/js/timoTree.js}"></script>
|
||||
<script type="text/javascript">
|
||||
layui.use(['form'], function () {
|
||||
window.form = layui.form;
|
||||
// 初始化排序下拉选项
|
||||
var pid = $(".select-tree").data('value');
|
||||
if (pid !== undefined){
|
||||
sortRender({id: pid});
|
||||
}
|
||||
});
|
||||
|
||||
// 初始化下拉树
|
||||
$.fn.selectTree({
|
||||
rootTree: '顶级菜单',
|
||||
// 选中后事件
|
||||
onSelected: sortRender
|
||||
});
|
||||
|
||||
// 更新渲染排序下拉选项
|
||||
function sortRender(treeNode) {
|
||||
var pid = treeNode.id;
|
||||
var sort = $(".select-sort");
|
||||
var id = sort.data('id') ? sort.data('id') : 0;
|
||||
var url = sort.data('url') + "/" + pid + "/" + id;
|
||||
$.get(url, function (result) {
|
||||
var options = '';
|
||||
var sortNum = Object.keys(result).length;
|
||||
if(pid === $(".select-tree").data('value') && sort.data('sort')){
|
||||
sortNum = sort.data('sort') - 1;
|
||||
}
|
||||
result[0] = "首位";
|
||||
for(var key in result){
|
||||
var selected = sortNum == key ? "selected=''" : "";
|
||||
options += "<option value='"+ key +"' " + selected + ">"+ result[key] +"</option>";
|
||||
}
|
||||
sort.html(options);
|
||||
form.render('select');
|
||||
});
|
||||
}
|
||||
|
||||
// 监听变动图标
|
||||
$(".icon-input").on("input propertychange", function(){
|
||||
$(".icon-show").attr("class", "icon-show "+$(this).val());
|
||||
});
|
||||
|
||||
// 同步操作权限输入框
|
||||
var $perms = $(".perms-input").val();
|
||||
$(".url-input").on("input propertychange", function(){
|
||||
if($perms === ''){
|
||||
$(".perms-refresh").click();
|
||||
}
|
||||
});
|
||||
|
||||
// 更新权限标识
|
||||
$(".perms-refresh").on("click", function (e) {
|
||||
e.preventDefault();
|
||||
var $perms = $(".perms-input");
|
||||
var url = $(".url-input").val().substr(1);
|
||||
var perms = url.replace(new RegExp( '/' , "g" ), ':');
|
||||
$perms.val(perms);
|
||||
})
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,57 @@
|
||||
<!DOCTYPE html>
|
||||
<html xmlns:th="http://www.thymeleaf.org"
|
||||
>
|
||||
<head th:replace="/common/template :: header(~{::title},~{::link},~{::style})">
|
||||
</head>
|
||||
<body>
|
||||
<div class="timo-detail-page">
|
||||
<div class="timo-detail-title">基本信息</div>
|
||||
<table class="layui-table timo-detail-table">
|
||||
<tbody>
|
||||
<tr>
|
||||
<th width='100px'>菜单编号</th>
|
||||
<td th:text="${menu.id}"></td>
|
||||
<th width='100px'>菜单标题</th>
|
||||
<td th:text="${menu.title}"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th width='100px'>图标</th>
|
||||
<td th:text="${menu.icon}"></td>
|
||||
<th width='100px'>菜单父编号</th>
|
||||
<td th:text="${menu.pid}"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th width='100px'>URl地址</th>
|
||||
<td th:text="${menu.url}"></td>
|
||||
<th width='100px'>权限标识</th>
|
||||
<td th:text="${menu.perms}"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th width='100px'>菜单类型</th>
|
||||
<td th:text="${#dicts.keyValue('MENU_TYPE', menu.type)}"></td>
|
||||
<th width='100px'>本级排序</th>
|
||||
<td th:text="${menu.sort}"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>创建用户</th>
|
||||
<td th:text="${menu.createBy?.nickname}"></td>
|
||||
<th>更新用户</th>
|
||||
<td th:text="${menu.updateBy?.nickname}"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>创建时间</th>
|
||||
<td th:text="${#dates.format(menu.createDate, 'yyyy-MM-dd HH:mm:ss')}"></td>
|
||||
<th>最后修改</th>
|
||||
<td th:text="${#dates.format(menu.updateDate, 'yyyy-MM-dd HH:mm:ss')}"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>备注</th>
|
||||
<td th:text="${menu.remark}" colspan="4"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div th:replace="/common/fragment :: log(${menu})"></div>
|
||||
</div>
|
||||
<script th:replace="/common/template :: script"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,108 @@
|
||||
<!DOCTYPE html>
|
||||
<html xmlns:th="http://www.thymeleaf.org"
|
||||
>
|
||||
<head th:replace="/common/template :: header(~{::title},~{::link},~{::style})">
|
||||
<link rel="stylesheet" th:href="@{/lib/zTree_v3/css/zTreeStyle/zTreeStyle.css}" type="text/css">
|
||||
</head>
|
||||
<body class="timo-layout-page">
|
||||
<div class="layui-card timo-tree" th:attr="data-url=@{'/system/menu/list?'+${search}}">
|
||||
<div class="layui-card-header timo-card-header">
|
||||
<span><i class="fa fa-bars"></i> 菜单管理</span>
|
||||
<i class="layui-icon layui-icon-refresh refresh-btn"></i>
|
||||
</div>
|
||||
<div class="layui-card-body layui-row">
|
||||
<div class="layui-col-lg2 layui-col-sm3">
|
||||
<div class="layui-card timo-nav-tree">
|
||||
<div class="layui-card-header">菜单结构</div>
|
||||
<div class="layui-card-body">
|
||||
<ul class="ztree"></ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-col-lg10 layui-col-sm9">
|
||||
<div class="layui-row timo-card-screen">
|
||||
<div class="pull-left layui-form-pane timo-search-box">
|
||||
<div class="layui-inline">
|
||||
<label class="layui-form-label">状态</label>
|
||||
<div class="layui-input-block timo-search-status">
|
||||
<select class="timo-search-select" name="status" mo:dict="SEARCH_STATUS" mo-selected="${param.status}"></select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-inline">
|
||||
<label class="layui-form-label">名称</label>
|
||||
<div class="layui-input-block">
|
||||
<input type="text" name="title" th:value="${param.title}" placeholder="请输入菜单名称" autocomplete="off" class="layui-input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-inline">
|
||||
<label class="layui-form-label">URL地址</label>
|
||||
<div class="layui-input-block">
|
||||
<input type="text" name="url" th:value="${param.url}" placeholder="请输入菜单URL地址" autocomplete="off" class="layui-input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-inline">
|
||||
<button class="layui-btn timo-search-btn">
|
||||
<i class="fa fa-search"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pull-right screen-btn-group">
|
||||
<button class="layui-btn open-popup popup-add" data-title="添加菜单" th:attr="data-url=@{/system/menu/add}">
|
||||
<i class="fa fa-plus"></i> 添加</button>
|
||||
<div class="btn-group">
|
||||
<button class="layui-btn">操作<span class="caret"></span></button>
|
||||
<dl class="layui-nav-child layui-anim layui-anim-upbit">
|
||||
<dd><a class="ajax-status" th:href="@{/system/menu/status/ok}">启用</a></dd>
|
||||
<dd><a class="ajax-status" th:href="@{/system/menu/status/freezed}">冻结</a></dd>
|
||||
<dd><a class="ajax-status" th:href="@{/system/menu/status/delete}">删除</a></dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="timo-table-wrap">
|
||||
<table class="layui-table timo-table timo-tree-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="timo-table-checkbox">
|
||||
<label class="timo-checkbox"><input type="checkbox">
|
||||
<i class="layui-icon layui-icon-ok"></i></label>
|
||||
</th>
|
||||
<th>名称</th>
|
||||
<th>URL地址</th>
|
||||
<th>权限标识</th>
|
||||
<th>菜单类型</th>
|
||||
<th>状态</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="tree-hide">
|
||||
<tr class="{{$hide}}" tree-pid="{{pid}}" tree-id="{{id}}">
|
||||
<td><label class="timo-checkbox"><input type="checkbox" value="{{id}}">
|
||||
<i class="layui-icon layui-icon-ok"></i></label></td>
|
||||
<td>{{title}}</td>
|
||||
<td>{{url}}</td>
|
||||
<td>{{perms}}</td>
|
||||
<td>{{remark}}</td>
|
||||
<td>正常</td>
|
||||
<td>
|
||||
<a class="open-popup popup-edit" data-title="编辑菜单" th:attr="data-url=@{'/system/menu/edit/{{id}}'}" href="#">编辑</a>
|
||||
<a class="open-popup" data-title="详细信息" th:attr="data-url=@{'/system/menu/detail/{{id}}'}" data-size="800,600" href="#">详细</a>
|
||||
<a class="ajax-get popup-delete" th:attr="data-msg='您是否确定删除'" th:href="@{'/system/menu/status/delete?ids={{id}}'}">删除</a>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script th:replace="/common/template :: script"></script>
|
||||
<script type="text/javascript" th:src="@{/js/plugins/jquery-3.3.1.min.js}"></script>
|
||||
<script type="text/javascript" th:src="@{/lib/zTree_v3/js/jquery.ztree.core.min.js}"></script>
|
||||
<script type="text/javascript" th:src="@{/lib/zTree_v3/js/jquery.ztree.exedit.min.js}"></script>
|
||||
<script type="text/javascript" th:src="@{/js/timoTree.js}"></script>
|
||||
<script type="text/javascript">
|
||||
$.fn.timoTree();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user