|
|
|
@ -1,79 +1,128 @@
|
|
|
|
<%@ page contentType="text/html;charset=UTF-8" %>
|
|
|
|
<%@ page contentType="text/html;charset=UTF-8" %>
|
|
|
|
|
|
|
|
<!-- JSP页面指令,设置页面内容类型为text/html(即HTML格式页面),并指定字符编码为UTF-8,
|
|
|
|
|
|
|
|
保证页面能正确显示各类字符,避免出现乱码情况 -->
|
|
|
|
<html>
|
|
|
|
<html>
|
|
|
|
|
|
|
|
|
|
|
|
<head>
|
|
|
|
<head>
|
|
|
|
|
|
|
|
<!-- 设置HTML页面的字符编码为utf-8,再次明确页面字符编码规范,有助于浏览器准确解析页面内容 -->
|
|
|
|
<meta charset="utf-8">
|
|
|
|
<meta charset="utf-8">
|
|
|
|
|
|
|
|
<!-- 设置页面的标题为“酒店管理系统”,该标题会显示在浏览器的标题栏中,让用户明确当前页面所属的系统或功能 -->
|
|
|
|
<title>酒店管理系统</title>
|
|
|
|
<title>酒店管理系统</title>
|
|
|
|
|
|
|
|
<!-- 引入Layui框架的样式文件(layui.css),href属性指定了文件的相对路径(当前目录下的js/layui/css/layui.css),
|
|
|
|
|
|
|
|
media="all"表示该样式适用于所有的媒体类型,也就是在各种设备上都应用此样式 -->
|
|
|
|
<link rel="stylesheet" href="./js/layui/css/layui.css" media="all">
|
|
|
|
<link rel="stylesheet" href="./js/layui/css/layui.css" media="all">
|
|
|
|
|
|
|
|
<!-- 引入Font Awesome字体图标库的样式文件(font-awesome.min.css),用于在页面中使用各种图标,
|
|
|
|
|
|
|
|
路径为当前目录下的MAIN/component/font-awesome-4.7.0/css/font-awesome.min.css -->
|
|
|
|
<link rel="stylesheet" href="./MAIN/component/font-awesome-4.7.0/css/font-awesome.min.css">
|
|
|
|
<link rel="stylesheet" href="./MAIN/component/font-awesome-4.7.0/css/font-awesome.min.css">
|
|
|
|
|
|
|
|
<!-- 引入Layui框架的JavaScript脚本文件(layui.js),该文件包含了Layui框架的各种功能实现,
|
|
|
|
|
|
|
|
是后续使用Layui组件和功能的基础,路径为当前目录下的js/layui/layui.js -->
|
|
|
|
<script src="./js/layui/layui.js"></script>
|
|
|
|
<script src="./js/layui/layui.js"></script>
|
|
|
|
|
|
|
|
<!-- 引入jQuery库的JavaScript脚本文件(jquery.js),jQuery常用于操作DOM元素、处理事件、进行AJAX交互等,
|
|
|
|
|
|
|
|
方便简化JavaScript编程,这里的路径指向当前目录下的js/jquery.js -->
|
|
|
|
<script src="./js/jquery.js"></script>
|
|
|
|
<script src="./js/jquery.js"></script>
|
|
|
|
|
|
|
|
<!-- 引入自定义的全局JavaScript脚本文件(global.js),里面可能包含了项目中通用的函数、变量或者其他自定义逻辑,
|
|
|
|
|
|
|
|
路径为当前目录下的js/global.js -->
|
|
|
|
<script src="./js/global.js"></script>
|
|
|
|
<script src="./js/global.js"></script>
|
|
|
|
|
|
|
|
<!-- 引入自定义的Cookie操作相关的JavaScript脚本文件(Cookie.js),用于处理浏览器Cookie的设置、获取、删除等操作,
|
|
|
|
|
|
|
|
路径为当前目录下的js/Cookie.js -->
|
|
|
|
<script src="./js/Cookie.js"></script>
|
|
|
|
<script src="./js/Cookie.js"></script>
|
|
|
|
<style>
|
|
|
|
<style>
|
|
|
|
body {
|
|
|
|
body {
|
|
|
|
margin: 10px;
|
|
|
|
// 设置页面主体(body)元素的外边距为10px,用于控制页面内容与浏览器窗口边缘的距离,使页面布局更美观
|
|
|
|
|
|
|
|
margin: 10px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.layui-elem-field legend {
|
|
|
|
.layui-elem-field legend {
|
|
|
|
font-size: 14px;
|
|
|
|
// 设置Layui框架中<fieldset>元素内<legend>元素(通常用于显示字段集标题)的字体大小为14px
|
|
|
|
|
|
|
|
font-size: 14px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.layui-field-title {
|
|
|
|
.layui-field-title {
|
|
|
|
margin: 25px 0 15px;
|
|
|
|
// 设置Layui框架中具有layui-field-title类的元素的外边距,上外边距为25px,下外边距为15px,左右外边距为0,
|
|
|
|
|
|
|
|
// 用于调整这类元素在页面中的布局间距
|
|
|
|
|
|
|
|
margin: 25px 0 15px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</style>
|
|
|
|
</style>
|
|
|
|
</head>
|
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
|
|
<body>
|
|
|
|
<body>
|
|
|
|
|
|
|
|
<!-- 创建一个<fieldset>元素,应用Layui的样式类(layui-elem-field layui-field-title),并设置顶部外边距为30px,
|
|
|
|
|
|
|
|
用于对页面中的一组相关功能按钮等元素进行分组显示,使其在页面布局上更清晰 -->
|
|
|
|
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
|
|
|
|
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
|
|
|
|
<legend>
|
|
|
|
<legend>
|
|
|
|
<div>
|
|
|
|
<div>
|
|
|
|
<div class="layui-inline">
|
|
|
|
<div class="layui-inline">
|
|
|
|
|
|
|
|
<!-- 创建一个Layui风格的按钮(layui-btn),样式为默认的主要按钮样式(layui-btn-primary),
|
|
|
|
|
|
|
|
同时应用Font Awesome字体图标库的图标类(fa fa-pencil-square-o)来显示一个铅笔图标,按钮id为"insertButton",文字为“新增”,
|
|
|
|
|
|
|
|
点击该按钮可触发新增相关的功能操作 -->
|
|
|
|
<button class="layui-btn layui-btn-primary fa fa-pencil-square-o " id="insertButton"> 新增</button>
|
|
|
|
<button class="layui-btn layui-btn-primary fa fa-pencil-square-o " id="insertButton"> 新增</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="layui-inline">
|
|
|
|
<div class="layui-inline">
|
|
|
|
|
|
|
|
<!-- 类似地,创建另一个Layui按钮,样式为默认按钮样式,应用Font Awesome的下载图标类(fa fa-cloud-download),
|
|
|
|
|
|
|
|
id为"toXlsButton",文字为“导出”,用于触发导出相关功能 -->
|
|
|
|
<button class="layui-btn layui-btn-primary fa fa-cloud-download" id="toXlsButton"> 导出</button>
|
|
|
|
<button class="layui-btn layui-btn-primary fa fa-cloud-download" id="toXlsButton"> 导出</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="layui-inline">
|
|
|
|
<div class="layui-inline">
|
|
|
|
|
|
|
|
<!-- 创建一个普通按钮(type="button"),应用Layui默认按钮样式,Font Awesome的上传图标类(fa fa-cloud-upload),
|
|
|
|
|
|
|
|
id为"upload",文字为“导入”,用于触发导入相关功能 -->
|
|
|
|
<button type="button" class="layui-btn layui-btn-primary fa fa-cloud-upload" id="upload"> 导入</button>
|
|
|
|
<button type="button" class="layui-btn layui-btn-primary fa fa-cloud-upload" id="upload"> 导入</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</legend>
|
|
|
|
</legend>
|
|
|
|
</fieldset>
|
|
|
|
</fieldset>
|
|
|
|
|
|
|
|
<!-- 创建一个空的HTML表格元素,id为"tableID",后续会通过JavaScript(使用Layui的表格组件)动态填充表格内容 -->
|
|
|
|
<table id="tableID"></table>
|
|
|
|
<table id="tableID"></table>
|
|
|
|
<script type="text/html" id="barAuth">
|
|
|
|
<script type="text/html" id="barAuth">
|
|
|
|
|
|
|
|
<!-- 定义一段HTML模板代码,id为"barAuth",用于在Layui表格的某一列中显示操作按钮,这里定义了两个超链接(a标签),
|
|
|
|
|
|
|
|
应用Layui按钮的样式类(layui-btn layui-btn-xs),并通过lay-event属性分别定义了点击事件的名称("edit"表示改密,"del"表示删除),
|
|
|
|
|
|
|
|
用于在表格中针对每一行数据提供相应的操作按钮 -->
|
|
|
|
<a class="layui-btn layui-btn-xs" lay-event="edit">改密</a>
|
|
|
|
<a class="layui-btn layui-btn-xs" lay-event="edit">改密</a>
|
|
|
|
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
|
|
|
|
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
|
|
|
|
</script>
|
|
|
|
</script>
|
|
|
|
<script>
|
|
|
|
<script>
|
|
|
|
|
|
|
|
// 使用Layui框架的模块加载机制,加载['util', 'layer', 'table', 'upload']这几个模块,
|
|
|
|
layui.use(['util', 'layer', 'table','upload'], function () {
|
|
|
|
// 并在加载完成后执行回调函数,在回调函数内可以使用这些模块提供的功能,
|
|
|
|
|
|
|
|
// 比如操作表格、弹出提示框、处理文件上传等功能
|
|
|
|
|
|
|
|
layui.use(['util', 'layer', 'table', 'upload'], function () {
|
|
|
|
$(document).ready(function () {
|
|
|
|
$(document).ready(function () {
|
|
|
|
var table = layui.table,
|
|
|
|
var table = layui.table,
|
|
|
|
layer = layui.layer,
|
|
|
|
layer = layui.layer,
|
|
|
|
upload = layui.upload,
|
|
|
|
upload = layui.upload,
|
|
|
|
util = layui.util;
|
|
|
|
util = layui.util;
|
|
|
|
|
|
|
|
|
|
|
|
upload.render({ //允许上传的文件后缀
|
|
|
|
// 使用Layui的上传组件(upload)进行相关配置,用于实现文件上传功能
|
|
|
|
|
|
|
|
upload.render({
|
|
|
|
|
|
|
|
// 通过elem属性指定触发文件上传的DOM元素选择器,这里绑定到id为"upload"的元素(即前面的导入按钮)
|
|
|
|
elem: '#upload'
|
|
|
|
elem: '#upload'
|
|
|
|
,url: baseUrl + '/UploadFileServlet'
|
|
|
|
// 设置上传文件的请求地址,baseUrl可能是在全局变量中定义的基础地址,UploadFileServlet应该是服务器端用于处理文件上传的Servlet等程序
|
|
|
|
,accept: 'file' //普通文件
|
|
|
|
, url: baseUrl + '/UploadFileServlet'
|
|
|
|
,exts: 'xlsx' //只允许上传excel文件
|
|
|
|
// 设置允许上传的文件类型为普通文件(file表示任意类型的普通文件,与一些特殊类型如图片、视频等区分开)
|
|
|
|
,before: function(){
|
|
|
|
, accept: 'file'
|
|
|
|
|
|
|
|
// 进一步限制只允许上传扩展名为.xlsx的Excel文件,用于对上传文件的格式进行筛选控制
|
|
|
|
|
|
|
|
, exts: 'xlsx'
|
|
|
|
|
|
|
|
// 在文件上传前执行的回调函数,这里通过layer.msg方法弹出提示框显示“文件上传中”,告知用户文件正在上传的状态
|
|
|
|
|
|
|
|
, before: function () {
|
|
|
|
layer.msg('文件上传中');
|
|
|
|
layer.msg('文件上传中');
|
|
|
|
}
|
|
|
|
}
|
|
|
|
,success: function(res){
|
|
|
|
// 文件上传成功后的回调函数,参数res包含了服务器返回的响应数据,这里简单地通过alert弹出响应数据中的msg属性值,
|
|
|
|
|
|
|
|
// 实际应用中可能需要根据具体的返回数据结构进行更合理的处理,比如判断上传结果并给用户相应提示等
|
|
|
|
|
|
|
|
, success: function (res) {
|
|
|
|
alert(res.msg);
|
|
|
|
alert(res.msg);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
var countNum;
|
|
|
|
var countNum;
|
|
|
|
|
|
|
|
// 使用Layui的表格组件(table)创建并渲染一个表格,配置相关参数来定义表格的各种属性和行为
|
|
|
|
var tableIns = table.render({
|
|
|
|
var tableIns = table.render({
|
|
|
|
elem: '#tableID',
|
|
|
|
// 通过elem属性指定表格对应的DOM元素选择器,这里绑定到id为"tableID"的空表格元素
|
|
|
|
id: 'tableID',
|
|
|
|
elem: '#tableID'
|
|
|
|
url: baseUrl + '/LoginTableServlet',
|
|
|
|
// 为表格设置一个唯一的标识id,这里同样设置为"tableID",方便后续对表格进行操作,比如重新加载数据等
|
|
|
|
cols: [
|
|
|
|
, id: 'tableID'
|
|
|
|
|
|
|
|
// 设置表格数据的请求地址,向服务器端的baseUrl + '/LoginTableServlet'地址获取表格数据,
|
|
|
|
|
|
|
|
// LoginTableServlet应该是用于处理表格数据查询等相关逻辑的后端程序
|
|
|
|
|
|
|
|
, url: baseUrl + '/LoginTableServlet'
|
|
|
|
|
|
|
|
// 定义表格的列信息,是一个二维数组,每个子数组表示一行的列配置,这里配置了多列的字段名、标题、宽度、排序、固定列等属性
|
|
|
|
|
|
|
|
, cols: [
|
|
|
|
[{
|
|
|
|
[{
|
|
|
|
field: 'loginId',
|
|
|
|
field: 'loginId',
|
|
|
|
title: '用户ID',
|
|
|
|
title: '用户ID',
|
|
|
|
@ -93,17 +142,23 @@
|
|
|
|
toolbar: '#barAuth',
|
|
|
|
toolbar: '#barAuth',
|
|
|
|
width: 150
|
|
|
|
width: 150
|
|
|
|
}]
|
|
|
|
}]
|
|
|
|
],
|
|
|
|
]
|
|
|
|
page: true,
|
|
|
|
// 设置表格支持分页功能,Layui会根据后端返回的数据自动进行分页显示等相关处理
|
|
|
|
where: {
|
|
|
|
, page: true
|
|
|
|
|
|
|
|
// 可以向服务器传递额外的查询参数,这里设置make参数为0,具体含义取决于后端服务器对该参数的处理逻辑,
|
|
|
|
|
|
|
|
// 可能用于区分不同的查询条件或数据筛选情况等
|
|
|
|
|
|
|
|
, where: {
|
|
|
|
make: 0
|
|
|
|
make: 0
|
|
|
|
},
|
|
|
|
}
|
|
|
|
done: function (res, curr, count) {
|
|
|
|
// 表格数据加载完成后的回调函数,参数res表示服务器返回的数据,curr表示当前页码,count表示总数据条数,
|
|
|
|
|
|
|
|
// 这里将总数据条数存储在countNum变量中,可能用于后续其他相关的逻辑处理(如显示数据总数等)
|
|
|
|
|
|
|
|
, done: function (res, curr, count) {
|
|
|
|
countNum = count;
|
|
|
|
countNum = count;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
//监听工具条
|
|
|
|
// 监听Layui表格的工具条事件,当点击表格中具有lay-event属性定义的操作按钮(如前面定义的"edit"或"del"按钮)时,
|
|
|
|
|
|
|
|
// 会触发这个回调函数,obj参数包含了与该操作相关的数据、事件等信息
|
|
|
|
table.on('tool', function (obj) {
|
|
|
|
table.on('tool', function (obj) {
|
|
|
|
var data = obj.data,
|
|
|
|
var data = obj.data,
|
|
|
|
layEvent = obj.event;
|
|
|
|
layEvent = obj.event;
|
|
|
|
@ -111,32 +166,46 @@
|
|
|
|
var loginName = data.loginName;
|
|
|
|
var loginName = data.loginName;
|
|
|
|
var loginNameNow = getCookie("loginName");
|
|
|
|
var loginNameNow = getCookie("loginName");
|
|
|
|
if (layEvent === 'del') {
|
|
|
|
if (layEvent === 'del') {
|
|
|
|
if (loginName != loginNameNow) {
|
|
|
|
// 判断要删除的数据对应的用户名(loginName)与当前登录的用户名(loginNameNow)是否不相等,
|
|
|
|
|
|
|
|
// 如果不相等,说明不是当前登录账号的数据,允许进行删除操作
|
|
|
|
|
|
|
|
if (loginName!= loginNameNow) {
|
|
|
|
|
|
|
|
// 通过layer.confirm方法弹出一个确认框,询问用户是否确定要删除该条数据,设置了确认框的垂直偏移量为180px,
|
|
|
|
|
|
|
|
// 并定义了两个按钮的文字(['是滴', '手滑']),点击不同按钮会执行对应的回调函数
|
|
|
|
layer.confirm('您确定要删除该条数据吗?', {
|
|
|
|
layer.confirm('您确定要删除该条数据吗?', {
|
|
|
|
offset: '180px',
|
|
|
|
offset: '180px',
|
|
|
|
btn: ['是滴', '手滑']
|
|
|
|
btn: ['是滴', '手滑']
|
|
|
|
}, function () {
|
|
|
|
}, function () {
|
|
|
|
|
|
|
|
// 通过Layui的表格组件(table)重新加载表格数据,向服务器传递新的查询参数,
|
|
|
|
|
|
|
|
// 这里设置make参数为4,loginId参数为要删除的数据对应的用户ID(loginId),
|
|
|
|
|
|
|
|
// 具体的参数含义和服务器端的处理逻辑相关,可能用于告知服务器执行删除操作并更新表格数据显示等
|
|
|
|
table.reload('tableID', {
|
|
|
|
table.reload('tableID', {
|
|
|
|
where: {
|
|
|
|
where: {
|
|
|
|
make: 4,
|
|
|
|
make: 4,
|
|
|
|
loginId: loginId
|
|
|
|
loginId: loginId
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
// 通过layer.msg方法弹出提示框,显示“删除结果如下”,设置垂直偏移量为250px,图标为1(可能表示某种提示图标样式),
|
|
|
|
|
|
|
|
// 告知用户删除操作已执行,可查看相应结果
|
|
|
|
layer.msg('删除结果如下', {
|
|
|
|
layer.msg('删除结果如下', {
|
|
|
|
offset: '250px',
|
|
|
|
offset: '250px',
|
|
|
|
icon: 1
|
|
|
|
icon: 1
|
|
|
|
});
|
|
|
|
});
|
|
|
|
}, function () {
|
|
|
|
}, function () {
|
|
|
|
|
|
|
|
// 如果用户点击了“手滑”(取消)按钮,通过layer.msg方法弹出提示框,显示“删除操作已取消”,
|
|
|
|
|
|
|
|
// 设置垂直偏移量为250px,告知用户删除操作已取消,不进行实际的删除行为
|
|
|
|
layer.msg('删除操作已取消', {
|
|
|
|
layer.msg('删除操作已取消', {
|
|
|
|
offset: '250px'
|
|
|
|
offset: '250px'
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
} else {
|
|
|
|
} else {
|
|
|
|
|
|
|
|
// 如果要删除的数据对应的用户名与当前登录用户名相等,说明是当前登录账号,不允许删除,
|
|
|
|
|
|
|
|
// 通过layer.msg方法弹出提示框,显示“当前登陆账号禁止删除”,设置垂直偏移量为250px,告知用户不能删除该账号数据
|
|
|
|
layer.msg('当前登陆账号禁止删除', {
|
|
|
|
layer.msg('当前登陆账号禁止删除', {
|
|
|
|
offset: '250px'
|
|
|
|
offset: '250px'
|
|
|
|
});
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
} else if (layEvent === 'edit') {
|
|
|
|
} else if (layEvent === 'edit') {
|
|
|
|
|
|
|
|
// 当点击表格中的“改密”(edit)按钮时,执行以下逻辑,弹出一个密码输入框,提示用户输入旧密码
|
|
|
|
layer.prompt({
|
|
|
|
layer.prompt({
|
|
|
|
title: '请输入旧密码',
|
|
|
|
title: '请输入旧密码',
|
|
|
|
formType: 1,
|
|
|
|
formType: 1,
|
|
|
|
@ -144,9 +213,13 @@
|
|
|
|
maxlength: 18
|
|
|
|
maxlength: 18
|
|
|
|
}, function (value, index) {
|
|
|
|
}, function (value, index) {
|
|
|
|
var params = "loginName=" + loginName + "&loginPwd=" + value;
|
|
|
|
var params = "loginName=" + loginName + "&loginPwd=" + value;
|
|
|
|
|
|
|
|
// 使用jQuery的$.post方法发起一个异步POST请求,向服务器端的baseUrl + '/QueryLoginNameServlet'地址发送数据,
|
|
|
|
|
|
|
|
// QueryLoginNameServlet应该是用于验证密码是否正确的后端程序,在请求成功的回调函数(updateCheck)中根据服务器返回的数据进行后续处理
|
|
|
|
$.post(baseUrl + '/QueryLoginNameServlet', params, function updateCheck(data) {
|
|
|
|
$.post(baseUrl + '/QueryLoginNameServlet', params, function updateCheck(data) {
|
|
|
|
layer.close(index);
|
|
|
|
layer.close(index);
|
|
|
|
if (data === "0") {
|
|
|
|
if (data === "0") {
|
|
|
|
|
|
|
|
// 如果服务器返回的数据为"0",表示密码不正确,通过layer.alert方法弹出一个警告提示框,
|
|
|
|
|
|
|
|
// 设置标题为“警告”,图标为2(表示警告的图标样式),动画效果为6,垂直偏移量为220px,告知用户密码输入有误
|
|
|
|
layer.alert('密码不正确!', {
|
|
|
|
layer.alert('密码不正确!', {
|
|
|
|
title: '警告',
|
|
|
|
title: '警告',
|
|
|
|
icon: 2,
|
|
|
|
icon: 2,
|
|
|
|
@ -154,6 +227,7 @@
|
|
|
|
offset: '220px'
|
|
|
|
offset: '220px'
|
|
|
|
});
|
|
|
|
});
|
|
|
|
} else {
|
|
|
|
} else {
|
|
|
|
|
|
|
|
// 如果密码验证通过(服务器返回的数据不是"0"),再次弹出一个密码输入框,提示用户输入新密码
|
|
|
|
layer.prompt({
|
|
|
|
layer.prompt({
|
|
|
|
title: '请输入新密码',
|
|
|
|
title: '请输入新密码',
|
|
|
|
formType: 1,
|
|
|
|
formType: 1,
|
|
|
|
@ -161,6 +235,7 @@
|
|
|
|
maxlength: 18
|
|
|
|
maxlength: 18
|
|
|
|
}, function (value1, index1) {
|
|
|
|
}, function (value1, index1) {
|
|
|
|
var pwd1 = value1;
|
|
|
|
var pwd1 = value1;
|
|
|
|
|
|
|
|
// 接着又弹出一个密码输入框,提示用户再次输入新密码,用于确认密码输入一致
|
|
|
|
layer.prompt({
|
|
|
|
layer.prompt({
|
|
|
|
title: '请再次输入新密码',
|
|
|
|
title: '请再次输入新密码',
|
|
|
|
formType: 1,
|
|
|
|
formType: 1,
|
|
|
|
@ -168,8 +243,10 @@
|
|
|
|
maxlength: 18
|
|
|
|
maxlength: 18
|
|
|
|
}, function (value2, index2) {
|
|
|
|
}, function (value2, index2) {
|
|
|
|
var pwd2 = value2;
|
|
|
|
var pwd2 = value2;
|
|
|
|
if (pwd2 != pwd1) {
|
|
|
|
if (pwd2!= pwd1) {
|
|
|
|
layer.close(index2);
|
|
|
|
layer.close(index2);
|
|
|
|
|
|
|
|
// 如果两次输入的新密码不一致,通过layer.alert方法弹出警告提示框,显示“两次输入的值不一致!”,
|
|
|
|
|
|
|
|
// 设置相关提示框属性,告知用户密码输入不一致,需要重新输入
|
|
|
|
layer.alert('两次输入的值不一致!', {
|
|
|
|
layer.alert('两次输入的值不一致!', {
|
|
|
|
title: '警告',
|
|
|
|
title: '警告',
|
|
|
|
icon: 2,
|
|
|
|
icon: 2,
|
|
|
|
@ -180,8 +257,12 @@
|
|
|
|
layer.close(index1);
|
|
|
|
layer.close(index1);
|
|
|
|
layer.close(index2);
|
|
|
|
layer.close(index2);
|
|
|
|
params = "loginName=" + loginName + "&loginPwd=" + value2;
|
|
|
|
params = "loginName=" + loginName + "&loginPwd=" + value2;
|
|
|
|
|
|
|
|
// 当两次新密码输入一致后,发起一个异步POST请求,向服务器端的baseUrl + '/UpdatePwdServlet'地址发送数据,
|
|
|
|
|
|
|
|
// UpdatePwdServlet应该是用于更新密码的后端程序,在请求成功的回调函数中根据服务器返回的数据判断密码修改是否成功
|
|
|
|
$.post(baseUrl + '/UpdatePwdServlet', params, function updateCheck(data) {
|
|
|
|
$.post(baseUrl + '/UpdatePwdServlet', params, function updateCheck(data) {
|
|
|
|
if (data === '1') {
|
|
|
|
if (data === '1') {
|
|
|
|
|
|
|
|
// 如果服务器返回的数据为'1',表示密码修改成功,通过layer.alert方法弹出成功提示框,
|
|
|
|
|
|
|
|
// 设置标题为“成功”,图标为6(表示成功的图标样式),动画效果为1,垂直偏移量为220px,告知用户密码修改成功
|
|
|
|
layer.alert('修改成功!', {
|
|
|
|
layer.alert('修改成功!', {
|
|
|
|
title: '成功',
|
|
|
|
title: '成功',
|
|
|
|
icon: 6,
|
|
|
|
icon: 6,
|
|
|
|
@ -189,75 +270,5 @@
|
|
|
|
offset: '220px'
|
|
|
|
offset: '220px'
|
|
|
|
});
|
|
|
|
});
|
|
|
|
} else {
|
|
|
|
} else {
|
|
|
|
layer.alert('修改失败!', {
|
|
|
|
// 如果服务器返回的数据不是'1',表示密码修改失败,同样弹出提示框,设置标题为“失败”,图标为2(表示失败的图标样式),
|
|
|
|
title: '失败',
|
|
|
|
// 动画效果为6,垂直偏移量为220
|
|
|
|
icon: 2,
|
|
|
|
|
|
|
|
anim: 6,
|
|
|
|
|
|
|
|
offset: '220px'
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//新增
|
|
|
|
|
|
|
|
$('#insertButton').click(function () {
|
|
|
|
|
|
|
|
layer.open({
|
|
|
|
|
|
|
|
title: "新增",
|
|
|
|
|
|
|
|
btn: ['关闭'],
|
|
|
|
|
|
|
|
yes: function (index) {
|
|
|
|
|
|
|
|
tableIns.reload({
|
|
|
|
|
|
|
|
where: {
|
|
|
|
|
|
|
|
make: 0
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
layer.close(index); //关闭弹窗
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
type: 2,
|
|
|
|
|
|
|
|
area: ['450px', '500px'],
|
|
|
|
|
|
|
|
fixed: false,
|
|
|
|
|
|
|
|
maxmin: true,
|
|
|
|
|
|
|
|
content: '/hb/insertLogin.jsp',
|
|
|
|
|
|
|
|
cancel: function () {
|
|
|
|
|
|
|
|
tableIns.reload({
|
|
|
|
|
|
|
|
where: {
|
|
|
|
|
|
|
|
make: 0
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//导出
|
|
|
|
|
|
|
|
$('#toXlsButton').click(function () {
|
|
|
|
|
|
|
|
location.href = baseUrl + '/LoginExcelServlet';
|
|
|
|
|
|
|
|
layer.alert('Excel文件生成完成!', {
|
|
|
|
|
|
|
|
title: '成功',
|
|
|
|
|
|
|
|
icon: 6,
|
|
|
|
|
|
|
|
anim: 1,
|
|
|
|
|
|
|
|
offset: '250px'
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//回到顶端
|
|
|
|
|
|
|
|
util.fixbar({
|
|
|
|
|
|
|
|
showHeight: 2,
|
|
|
|
|
|
|
|
click: function (type) {
|
|
|
|
|
|
|
|
console.log(type);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
</body>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</html>
|
|
|
|
|