<#assign base=request.contextPath />
<#import "../common/defaultLayout.ftl" as defaultLayout>
<@defaultLayout.layout>
<link rel="stylesheet" href="${base}/assets/css/amazeui.switch.css"/>
<div class="admin-content">
<div class="am-cf am-padding" style="padding:1rem 1.6rem 1.6rem 1rem;margin:0px;">
<!-- padding:1px 2px 3px 4px;上、右、下,和左 -->
<div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">系统管理</strong> /
<small>前端账号管理</small>
</div>
</div>
<div class="am-g">
<div class="am-u-sm-12">
<form class="am-form" id="listForm" action="${base}/manager/list" method="POST">
<input type="hidden" id="keywords" name="keywords" value='${keywords!""}'/>
<table class="am-table am-table-bordered am-table-radius table-main" style="padding:0;">
<tbody>
<tr>
<th class="am-text-middle">姓名</th>
<td>
<div class="am-u-sm-10">
<input type="text" id="name" class="am-form-field am-input-sm"
value="${name!}"/>
</div>
</td>
<th class="am-text-middle">账号角色</th>
<td>
<div class="am-u-sm-10">
<select data-am-selected id="roleId" name="roleId">
<option value="-1">全部</option>
<#list roleList as role>
<option value=${role.id!} <#if roleId! =="${role.id}" >
selected
</#if>>${role.roleName!}</option>
</#list>
</select>
</div>
</td>
</tr>
<tr>
<th class="am-text-middle">手机号</th>
<td>
<div class="am-u-sm-10">
<input type="text" id="phone" class="am-form-field am-input-sm"
value="${phone!}"/>
</div>
</td>
<th class="am-text-middle">所属区域</th>
<td>
<div class="am-u-sm-10">
<select id="regionId" name="regionId"
data-am-selected="{btnSize: 'sm',maxHeight: 200,searchBox: 1}">
<option value="-1">全部</option>
<#if regionList?exists>
<#list regionList as node>
<option value="${node.id!}" <#if regionId! == "${node.id}" >
selected </#if>>${node.name}</option>
</#list>
</#if>
</select>
</div>
</td>
</tr>
<tr>
<th class="am-text-middle">归属单位</th>
<td>
<div class="am-u-sm-10">
<input type="text" id="company" class="am-form-field am-input-sm"
value="${company!}"/>
</div>
</td>
<td colspan="4">
<div align='right'>
<button type="button" class="am-btn am-btn-default am-btn-sm am-text-secondary"
id="submit-btn">搜索
</button>
</div>
</td>
</tr>
</tbody>
</table>
</form>
</div>
<div class="am-u-sm-12 am-u-md-12" style="padding:0 1.6rem 1.6rem 1rem;margin:0;">
<div class="am-btn-toolbar" style="padding-left:.5rem;">
<div class="am-btn-group am-btn-group-xs">
<@shiro.hasPermission name="MANAGER_ADD">
<button type="button" class="am-btn am-btn-default"
onclick="location.href='${base}/manager/add'">
<span class="am-icon-plus"></span>
新增
</button>
</@shiro.hasPermission>
<@shiro.hasPermission name="MANAGER_DELETE">
<button type="button" id="deleteButton" disabled="disabled"
class="am-btn am-btn-default"
onclick="deleteAll('${base}/manager/delete')"><span
class="am-icon-trash-o"></span> 删除
</button>
</@shiro.hasPermission>
</div>
</div>
</div>
</div>
<div class="am-g">
<div class="am-u-sm-12 am-scrollable-horizontal">
<!-- padding:1px 2px 3px 4px;上、右、下,和左 -->
<table class="am-table am-table-striped am-table-hover table-main">
<thead>
<tr class="am-text-nowrap">
<th class="table-check">
<input type="checkbox" id="allCheck"></th>
<th class="table-title">姓名</th>
<th class="table-date">角色</th>
<th class="table-title">手机号码</th>
<th class="table-date">所属区域</th>
<th class="table-title">归属单位</th>
<th class="table-date">备注</th>
<th class="table-date">创建时间</th>
<th class="table-set am-text-center">操作</th>
</tr>
</thead>
<tbody>
<#if (pager.list)?exists>
<#list pager.list as list>
<tr>
<td>
<input type="checkbox" name="ids" value="${list.id}"/>
</td>
<td>${list.name!}</td>
<td>${list.roleName!}</td>
<td>${list.phone!}</td>
<td>${list.regionName!}</td>
<td>${list.company!}</td>
<td>${list.remark!}</td>
<td><#if list.createTime??>${list.createTime?datetime}</#if></td>
<td>
<div class="am-btn-toolbar">
<div class="am-btn-group am-btn-group-xs">
<@shiro.hasPermission name="MANAGER_EDIT">
<button type="button"
class="am-btn am-btn-default am-btn-xs am-text-secondary"
onclick="location.href='${base}/manager/edit?id=${list.id?c}'">
<span class="am-icon-pencil-square-o"></span>
编辑
</button>
</@shiro.hasPermission>
<@shiro.hasPermission name="MANAGER_RESET">
<button type="button"
class="am-btn am-btn-default am-btn-xs am-text-secondary"
onclick="resetPassword('${base}/manager/resetPassword?managerId=${list.id}')"><span
class="am-icon-pencil-square-o"></span>密码重置
</button>
</@shiro.hasPermission>
<@shiro.hasPermission name="MANAGER_BINDING">
<#if (list.roleName) = '工地巡查员'>
<button type="button"
class="am-btn am-btn-default am-btn-xs am-text-secondary"
onclick="location.href='${base}/binding/select?id=${list.id?c}&type=app'">
<span class="am-icon-pencil-square-o"></span>
绑定工地
</button>
</#if>
</@shiro.hasPermission>
<div class="am-btn-group am-btn-group-xs">
<div class="switch-button">
<#--是否启用：0禁用，1启用-->
<input id="${list.id}" type="checkbox" data-size='xs'
data-am-switch data-off-text="已禁用" data-on-text="已启用"
<#if list.enabled==1 >checked</#if>/>
</div>
</div>
</div>
</div>
</td>
</tr>
</#list>
</#if>
</tbody>
</table>
<div class="am-cf">
<!-- 分页 -->
<#if (pager.list)?exists && (pager.list?size>0) >
<div class="am-fr">
<#include "../common/common_pager.ftl">
</div>
<#else>
<div class="am-kai" align="center">
<h3>没有找到任何记录!</h3>
</div>
</#if>
</div>
</div>
</div>
</div>
</@defaultLayout.layout>
<script src="${base}/assets/js/amazeui.switch.js"></script>
<script type="text/javascript">
var urlBase = "${base}";
var url;
$(function () {
/*表单提交 start*/
var keywordsObj = {};
$("#submit-btn").on("click", function () {
if ($("#name").val())
keywordsObj.name = $("#name").val();
if ($("#roleId").val())
keywordsObj.roleId = parseInt($("#roleId").val());
if ($("#phone").val())
keywordsObj.phone = $("#phone").val();
if ($("#regionId").val())
keywordsObj.regionId = parseInt($("#regionId").val());
if ($("#company").val())
keywordsObj.company = $("#company").val();
var keywords = "";
if (!$.isEmptyObject(keywordsObj)) {
keywords = JSON.stringify(keywordsObj);
}
console.log("keywords = " + keywords);
$("#keywords").val(keywords);
$("#listForm").submit();
});
/*表单提交 end*/
/*复选框全选效果 start*/
$("body").on('click', '.list-item', function () {
$(".list-item").removeClass("tr-selected");
$(this).addClass('tr-selected');
});
$("#allCheck").click(function () {
$('input[name="ids"]').prop("checked", this.checked);
$("#deleteButton").prop("disabled", $("input[name='ids']:checked").length == 0 ? true : false);
});
var $citySubBox = $("input[name='ids']");
$citySubBox.click(function () {
$("#allCheckCity").prop("checked", $citySubBox.length == $("input[name='ids']:checked").length ? true : false);
$("#deleteButton").prop("disabled", $("input[name='ids']:checked").length == 0 ? true : false);
});
/*复选框全选效果 end*/
});
/*批量删除角色 start*/
var deleteAll = function (url) {
var $deleteButton = $("#deleteButton");// 删除按钮
var ids = "";
$("input[name='ids']:checked").each(function () {
ids += $(this).val() + "#%#";
});
var params = {ids: ids};
if (window.confirm('确定要删除吗？')) {
$.ajax({
url: url,
data: params,
dataType: "json",
async: false,
beforeSend: function (data) {
$deleteButton.prop("disabled", true)
},
success: function (data) {
$deleteButton.prop("disabled", false)
if (data.status == 0) {
layer.alert(data.msg);
window.location.href = window.location.href;
} else if (data.status == 1) {
layer.alert(data.msg);
}
}
});
}
}
/*批量删除角色 end*/
var resetPassword = function (url) {
var params = {};
if (window.confirm('确定要重置密码吗？')) {
$.ajax({
url: url,
data: params,
dataType: "json",
async: false,
beforeSend: function (data) {
},
success: function (data) {
if (data.status == 0) {
layer.alert("重置成功");
window.location.href = window.location.href;
} else if (data.status == 1) {
layer.alert("重置失败");
}
}
});
}
}
/**
* 为每个启用或禁用按钮增加事件
*/
$(function () {
var $mycheckbox = $('.switch-button').find("input[type='checkbox']");
$mycheckbox.each(function () {
var myid = $(this).attr("id");
var prop = $(this).attr("prop");
$(this).on({
'switchChange.bootstrapSwitch': function (event, state) {
toggle(myid, state ? 1 : 0);
}
});
});
});
//启用或者禁用
var toggle = function (id, status) {
$.ajax({
url: "${base}/manager/changeStatus",
data: {id: id, enabled: status},
type: "post",
dataType: "json",
async: false,
success: function (data) {
parent.layer.msg(data.msg);
}
});
};
</script>