mirror of
				https://github.com/kongyuebin1/dongfeng-pay.git
				synced 2025-11-04 21:17:32 +08:00 
			
		
		
		
	
		
			
				
	
	
		
			288 lines
		
	
	
		
			8.4 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			288 lines
		
	
	
		
			8.4 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
<!doctype html>
 | 
						|
<!DOCTYPE html>
 | 
						|
<html>
 | 
						|
<head>
 | 
						|
	<meta charset="utf-8">
 | 
						|
	<title>管理后台</title>
 | 
						|
	<link rel="stylesheet" type="text/css" href="../static/css/basic.css">
 | 
						|
	<script src="../static/js/jquery.min.js"></script>
 | 
						|
	<script src="../static/js/filter.js"></script>
 | 
						|
	<script src="../static/js/basic.js"></script>
 | 
						|
	<style>
 | 
						|
		.first-input-group .basic-url {
 | 
						|
			width: 300px;
 | 
						|
		}
 | 
						|
	</style>
 | 
						|
</head>
 | 
						|
<body>
 | 
						|
	<!-- 添加菜单的模态框 -->
 | 
						|
	<div class="modal fade" id="addMenuModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" data-keyboard="false" data-backdrop="static">
 | 
						|
	  <div class="modal-dialog" role="document">
 | 
						|
	    <div class="modal-content">
 | 
						|
	      <div class="modal-header">
 | 
						|
	        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
 | 
						|
	        <h4 class="modal-title" id="myModalLabel">添加一级菜单</h4>
 | 
						|
	      </div>
 | 
						|
	      <div class="modal-body modal-body-menu">
 | 
						|
	      	<div class="input-group first-input-group">
 | 
						|
			  <span class="input-group-addon basic-addon3">一级菜单</span>
 | 
						|
			  <input type="text" class="form-control basic-url">
 | 
						|
			  <span class="first-menu-error"></span>
 | 
						|
			</div>
 | 
						|
	      
 | 
						|
	      </div>
 | 
						|
	      <div class="modal-footer">
 | 
						|
	        <button type="button" class="btn btn-default cancel-menu" data-dismiss="modal">取消</button>
 | 
						|
	        <button type="button" class="btn btn-primary save-menu">保存</button>
 | 
						|
	      </div>
 | 
						|
	    </div>
 | 
						|
	  </div>
 | 
						|
	</div>
 | 
						|
	<div class="search">
 | 
						|
		<div>
 | 
						|
			<span>一级菜单</span>
 | 
						|
			<input type="text" class="first-menu-serach" placeholder="模糊匹配" value="">
 | 
						|
		</div>
 | 
						|
		<div>
 | 
						|
			<button type="button" class="btn btn-default first-menu-search">搜索</button>
 | 
						|
		</div>
 | 
						|
	</div>
 | 
						|
	<div class="add-menu">
 | 
						|
		<button type="button" class="btn btn-default btn-xs glyphicon glyphicon-plus add-button" data-toggle="modal" data-target="#addMenuModal">添加一级菜单</button>
 | 
						|
		<strong>提示:创建导航菜单栏,一般由技术开发人员进行配置!</strong>
 | 
						|
		
 | 
						|
	</div>
 | 
						|
	<div class="menu-table">
 | 
						|
		<table>
 | 
						|
			<thead class="thead-dark">
 | 
						|
				<tr>
 | 
						|
					<th>序列号</th>
 | 
						|
					<th>菜单识别号</th>
 | 
						|
					<th>一级菜单</th>
 | 
						|
					<th>菜单顺序号</th>
 | 
						|
					<th>二级菜单</th>
 | 
						|
					<th>创建者</th>
 | 
						|
					<th>操作</th>
 | 
						|
				</tr>
 | 
						|
			</thead>
 | 
						|
			<tbody id="menu_table_body">
 | 
						|
				
 | 
						|
			</tbody>
 | 
						|
		</table>
 | 
						|
	</div>
 | 
						|
	<!-- 分页插件 -->
 | 
						|
	<div class="cut_page">
 | 
						|
		<li>
 | 
						|
			每页显示
 | 
						|
			<select id="display_count">
 | 
						|
				<option value="20">20</option>
 | 
						|
				<option value="30">30</option>
 | 
						|
				<option value="50">50</option>
 | 
						|
				<option value="100">100</option>
 | 
						|
			</select>
 | 
						|
		</li>
 | 
						|
		
 | 
						|
		<li class="current_total_page">第<span class="current_page">1</span>/<span class="total_page">2</span>页</li>
 | 
						|
		<li class="pre_page">上一页</li>
 | 
						|
		<li class="next_page">下一页</li>
 | 
						|
		<li class="jump_page">跳转 <input type="text" name="jump_page" value=""> <button type="button" class="btn btn-default">Go</button></li>
 | 
						|
	</div>
 | 
						|
 | 
						|
 | 
						|
	<script>
 | 
						|
		$(".search div button").click(function() {
 | 
						|
			let firstMenuSearch = $(".first-menu-serach").val();
 | 
						|
			let dataJSON = getCutPageData();
 | 
						|
			dataJSON["firstMenuSearch"] = firstMenuSearch;
 | 
						|
			showMenuList(dataJSON);
 | 
						|
		});
 | 
						|
		//获取分页的基础数据
 | 
						|
		function getCutPageData() {
 | 
						|
			let displayCount = $("#display_count").val();
 | 
						|
			let currentPage = $(".current_page").html();
 | 
						|
			let totalPage = $(".total_page").html();
 | 
						|
			let jumpPage = $(".jump_page input").val();
 | 
						|
 | 
						|
			return {"displayCount":displayCount, "currentPage":currentPage, "totalPage":totalPage, "jumpPage": jumpPage};
 | 
						|
		}
 | 
						|
		$(".first-menu-search").click(function() {
 | 
						|
			showMenuList(getCutPageData());
 | 
						|
		});
 | 
						|
		//刚开始加载页面的时候,执行的一系列操作
 | 
						|
		$(document).ready(function() {
 | 
						|
			showMenuList(getCutPageData());
 | 
						|
		});
 | 
						|
		//获取数据
 | 
						|
		//当每页显示数更改后,执行的操作
 | 
						|
		$("#display_count").change(function() {
 | 
						|
			showMenuList(getCutPageData());
 | 
						|
		});
 | 
						|
 | 
						|
		//点击上一页的按钮
 | 
						|
		$(".pre_page").click(function() {
 | 
						|
			let dataJSON = getCutPageData();
 | 
						|
 | 
						|
			if (dataJSON["currentPage"] == 1) {
 | 
						|
				return;
 | 
						|
			}
 | 
						|
			dataJSON["currentPage"] = parseInt(dataJSON["currentPage"]) - 1;
 | 
						|
			showMenuList(dataJSON);
 | 
						|
		});
 | 
						|
	    //点击下一页的按钮时
 | 
						|
	    $(".next_page").click(function() {
 | 
						|
	 		let dataJSON = getCutPageData();
 | 
						|
 | 
						|
			if (dataJSON["currentPage"] == dataJSON["totalPage"]) {
 | 
						|
				return;
 | 
						|
			}
 | 
						|
 | 
						|
			dataJSON["currentPage"] = parseInt(dataJSON["currentPage"]) + 1;
 | 
						|
			
 | 
						|
			showMenuList(dataJSON);
 | 
						|
	    });
 | 
						|
	    //点击跳转那一页的按钮
 | 
						|
	    $(".jump_page button").click(function() {
 | 
						|
	  		let dataJSON = getCutPageData();
 | 
						|
 | 
						|
			if (dataJSON["jumpPage"].length <= 0) {
 | 
						|
				return;
 | 
						|
			}
 | 
						|
 | 
						|
			showMenuList(dataJSON);
 | 
						|
	    });
 | 
						|
 | 
						|
		function Ajax(menuUid, hostUrl) {
 | 
						|
			$.ajax({
 | 
						|
				url: hostUrl,
 | 
						|
				data: {
 | 
						|
					"menuUid": menuUid
 | 
						|
				},
 | 
						|
 | 
						|
				success: function(res) {
 | 
						|
				
 | 
						|
					if (res.Code == 404) {
 | 
						|
						window.parent.location = "/login.html";
 | 
						|
					} else if (res.Code == 200){
 | 
						|
						showMenuList(getCutPageData());
 | 
						|
						$(".table-caption").html("");
 | 
						|
						
 | 
						|
					} else {
 | 
						|
					}
 | 
						|
				},
 | 
						|
 | 
						|
				error: function() {
 | 
						|
					alert("系统异常,请稍后重试");
 | 
						|
				}
 | 
						|
 | 
						|
			});
 | 
						|
		}
 | 
						|
		
 | 
						|
		//提升菜单的顺序
 | 
						|
		function menuUp(menuUid) {
 | 
						|
			Ajax(menuUid, "/up/menu");
 | 
						|
		}
 | 
						|
		//降低菜单的顺序
 | 
						|
		function menuDown(menuUid) {
 | 
						|
			Ajax(menuUid, "/down/menu");
 | 
						|
		}
 | 
						|
		//删除菜单
 | 
						|
		function menuDelete(menuUid) {
 | 
						|
			if (!window.confirm("是否确定删除该项?")) {
 | 
						|
				return;
 | 
						|
			}
 | 
						|
			Ajax(menuUid,"/delete/menu");
 | 
						|
		}
 | 
						|
		//此函数的作用,是在每行的最后一格,加入可操作的按钮图标
 | 
						|
		function showMenuList(dataJSON) {
 | 
						|
			$.ajax({
 | 
						|
				url: "/get/menu",
 | 
						|
				data: dataJSON,
 | 
						|
 | 
						|
				success: function(res) {
 | 
						|
					
 | 
						|
					$(".current_page").html(res.CurrentPage);
 | 
						|
					$(".total_page").html(res.TotalPage);
 | 
						|
					$("#display_count option").each(function() {
 | 
						|
						if ($(this).text() == res.DisplayCount) {
 | 
						|
							$(this).attr('selected', true);
 | 
						|
						}
 | 
						|
					});
 | 
						|
					$(".jump_page input").val("");
 | 
						|
				
 | 
						|
 | 
						|
					if (res.Code == -1) {
 | 
						|
						alert(res.Msg);	
 | 
						|
						return;
 | 
						|
					} else if (res.Code == 404) {
 | 
						|
						window.parent.location = "/login.html";
 | 
						|
					} else {
 | 
						|
						//将先前的内容清空
 | 
						|
						$("#menu_table_body").html("");
 | 
						|
						let str = "";
 | 
						|
						for(let i = 0; i < res.MenuList.length; i ++) {
 | 
						|
							let v = res.MenuList[i];
 | 
						|
 | 
						|
							// let secondMenus = v.SecondMenu.split("|");
 | 
						|
 | 
						|
							let tmp = "<tr>" + "<th>" + (res.StartIndex+i+1) + "</th>" + 
 | 
						|
									"<th>" + v.MenuUid + "</th>" + "<th>" + v.FirstMenu + "</th>" + "<th>" + v.MenuOrder + "</th>" +
 | 
						|
									"<th>" + v.SecondMenu + "</th>" + "<th>" + v.Creater + "</th>";
 | 
						|
							tmp = tmp + "<th>" + '<div class="btn-group" role="group" aria-label="...">' + 
 | 
						|
							'<button type="button" value="' + v.MenuUid +'" class="btn btn-default" onclick="menuUp(this.value);"><span class="glyphicon glyphicon-arrow-up"></span></button>' +
 | 
						|
							'<button type="button" value="' + v.MenuUid +'" class="btn btn-default" onclick="menuDown(this.value);"><span class="glyphicon glyphicon-arrow-down"></span></button>' +
 | 
						|
							'<button type="button" value="' + v.MenuUid +'" class="btn btn-default" onclick="menuDelete(this.value);"><span class="glyphicon glyphicon-trash"></span></button>' + 
 | 
						|
							'</div>' + "</th>" + "</tr>";
 | 
						|
							str = str + tmp;
 | 
						|
						}
 | 
						|
						$("#menu_table_body").append(str);
 | 
						|
					}
 | 
						|
				},
 | 
						|
 | 
						|
				error: function() {
 | 
						|
					alert("系统异常,请稍后重试");
 | 
						|
				}
 | 
						|
			});
 | 
						|
		}
 | 
						|
 | 
						|
		$(".save-menu").click(function() {
 | 
						|
			let oneMenu = $(".basic-url").val();
 | 
						|
		
 | 
						|
 | 
						|
			if (oneMenu.length <= 0) {
 | 
						|
				$(".first-menu-error").text(" * 一级菜单不能为空");
 | 
						|
				return;
 | 
						|
			}
 | 
						|
 | 
						|
			$(".first-menu-error").text("");
 | 
						|
			$.ajax({
 | 
						|
				url: "/add/menu",
 | 
						|
				data:{
 | 
						|
					oneMenu: oneMenu
 | 
						|
				},
 | 
						|
 | 
						|
				success: function(res) {
 | 
						|
					if (res.Code == 200) {
 | 
						|
						$(".cancel-menu").trigger('click');
 | 
						|
						showMenuList();
 | 
						|
						
 | 
						|
					} else if (res.Code == 404) {
 | 
						|
						window.parent.location = "/login.html";
 | 
						|
					} else {
 | 
						|
						$(".first-menu-error").text(res.Msg);
 | 
						|
					}
 | 
						|
				},
 | 
						|
				error: function() {
 | 
						|
					alert("系统异常,请稍后重试");
 | 
						|
				}
 | 
						|
			});
 | 
						|
		});
 | 
						|
		
 | 
						|
		$(".add-button").click(function() {
 | 
						|
			$(".basic-url").val("");
 | 
						|
			$(".basic-url-4").val("");
 | 
						|
			$(".first-menu-error").text("");
 | 
						|
			
 | 
						|
		});
 | 
						|
	</script>
 | 
						|
</body>
 | 
						|
</html> |