<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib uri = "http://java.sun.com/jsp/jstl/core" prefix = "c" %>
<!DOCTYPE html>
<html lang="${currentLang}">
<head>
<%@ include file="../common/head.jsp"%>
<style>
#addList{padding-right:0px !important;}
#editList{padding-right:0px !important;}
</style>
</head>
<body>
<%@ include file="../common/navbar.jsp"%>
<form class="full-page" id="actFrom">
<!-- Product Panels -->
<div class="container" style="min-height: 620px; padding-top: 40px;">
<input type="hidden" id="actId" name="actId" />
<div class="row">
<div class="col-xs-6" >
<h4 class="page-header" style="margin: 0;">活动分类</h4>
</div>
</div>
<div class="row m-t-10">
<div class="col-xs-6 btnTopGroup">
<input class="btn btn-main-outline" type="button" value="添 加" data-toggle="modal" id="addBtn" data-target="#addList"/>
<input class="btn btn-main-outline" type="button" value="编 辑" data-toggle="modal" id="editBtn" data-target="#editList"/>
<input class="btn btn-main-outline" type="button" value="删 除" data-toggle="modal" id="delBtn" />
</div>
</div>
<div class="row m-t-10">
<div class="col-xs-8 ">
<table class="table table-striped">
<thead>
<tr>
<th></th>
<th>序号</th>
<th>活动分类名称</th>
<th>活动分类描述</th>
</tr>
</thead>
<c:forEach items="${actLists}" var="cate" varStatus="idx">
<tr>
<td><input name="act_select" type="radio" value="${cate.id}"></td>
<td>${idx.count}</td>
<td>${cate.cateName}</td>
<td>${cate.cateDesc}</td>
</tr>
</c:forEach>

<!-- <tbody id="per_body" v-cloak> <tr v-for="(detail, i) in actLists"> <td><input name="act_select" type="radio" :value="detail.id"></td> <td>{{ i+1 }}</td> <td>{{detail.cateName}}</td> <td>{{detail.cateDesc}}</td> </tr> </tbody> --> </table> </div> </div> </div> <!--添加--> <div class="modal fade" id="addList" tabindex="-1" role="dialog" > <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> <h5 class="modal-title" >添加活动分类</h5> </div> <div class="modal-body"> <div class="row form-group"> <div class="control-label col-md-3 col-sm-3 text-left m-t-5"> 活动分类名称 <span class="red">*</span>: </div> <div class="col-md-8 col-sm-8"> <input type="text" class="form-control" maxlength="50" id="cate_name_add" name="cate_name_add" /> </div> </div> <div class="row form-group"> <div class="control-label col-md-3 col-sm-3 text-left m-t-5"> 活动分类描述 <span class="red">*</span>: </div> <div class="col-md-8 col-sm-8"> <textarea rows="3" class="form-control" maxlength="100" id="cate_desc_add" name="cate_desc_add"></textarea> </div> </div> </div> <div class="modal-footer"> <input type="button" class="btn btn-success" value="确 认" id="submitAdd" data-dismiss="modal"> <input type="button" class="btn btn-success" value="取 消" data-dismiss="modal"> </div> </div> <!--编辑--> <div class="modal fade" id="editList" tabindex="-1" role="dialog" > <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> <h5 class="modal-title" >编辑活动分类</h5> </div> <div class="modal-body"> <div class="row form-group"> <div class="control-label col-md-3 col-sm-3 text-left m-t-5"> 活动分类名 <span class="red">*</span>: </div> <div class="col-md-8 col-sm-8"> <input type="text" class="form-control" maxlength="50" id="cate_name_edit" name="cate_name_edit" /> </div> </div> <div class="row form-group"> <div class="control-label col-md-3 col-sm-3 text-left m-t-5"> 活动分类描述 <span class="red">*</span>: </div> <div class="col-md-8 col-sm-8"> <textarea rows="3" class="form-control" maxlength="100" id="cate_desc_edit" name="cate_desc_edit"></textarea> </div> </div> </div> <div class="modal-footer"> <input type="button" class="btn btn-success" value="确 认" id="submitEdit" data-dismiss="modal"> <input type="button" class="btn btn-success" value="取 消" data-dismiss="modal"> </div> </div></form><!-- /.container --><%@ include file="../common/footer.jsp"%></body>

<!-- <script type="text/javascript">
var vm = new Vue({
el: "#actFrom",
data: {
perLists: ${perLists}
}
});
</script> -->

<script type="text/javascript"> $(function(){ // 弹出编辑分类窗口 $("#editBtn").click(function(){ var id = $("[name='act_select']:checked").val(); if (id == '' || id == undefined) { alert("请选择要编辑的分类"); return false; } var cateName = $("[name='act_select']:checked").parents("tr").find("td:eq(2)").text(); var cateDesc = $("[name='act_select']:checked").parents("tr").find("td:eq(3)").text(); $("#cate_name_edit").val(cateName.trim()); $("#cate_desc_edit").val(cateDesc.trim()); $("#actId").val(id); }); // 增加分类 $("#submitAdd").click(function() { var _cateName = $("#cate_name_add").val(); var _cateDesc = $("#cate_desc_add").val(); if (!_cateName.trim()) { alert("请输入分类名称."); return false; } else if (!_cateDesc.trim()) { alert("请输入分类描述"); return false; } else { $.ajax({ url : "/activity/addCateory", type: "POST", data: $("#actFrom").serialize(), success: function(res) { if (res.success) { alert("操作成功.", function(){ window.location.reload(); }); } else { if(!res.msg){ alert("操作失败."); return false; } else { alert("操作失败. "+res.msg); return false; } } }, error: function(res){ alert("操作失败."); return false; } }); } }); // 编辑权限 $("#submitEdit").click(function() { var _cateName = $("#cate_name_edit").val(); var _cateDesc = $("#cate_desc_edit").val(); if (!_cateName.trim()) { alert("请输入分类名称."); return false; } else if (!_cateDesc) { alert("请输入分类描述"); return false; } else { $.ajax({ url : "/activity/updateCateory", type: "POST", data: $("#actFrom").serialize(), success: function(res) { if (res.success) { alert("操作成功.", function(){ window.location.reload(); }); } else { if(!res.msg){ alert("操作失败."); return false; } else { alert("操作失败. "+res.msg); return false; } } }, error: function(res){ alert("操作失败."); return false; } }); } }); // 删除权限 $("#delBtn").click(function() { var id = $("[name='act_select']:checked").val(); if (id == '' || id == undefined) { alert("请选择要删除的活动分类"); return false; } $("#actId").val(id); bs_confirm("确定删除选中的活动分类?", function(){ $.ajax({ url : "/activity/removeCateory", type: "POST", data: $("#actFrom").serialize(), success: function(res) { if (res.success) { alert("操作成功.", function(){ window.location.reload(); }); } else { if(!res.msg){ alert("操作失败."); return false; } else { alert("操作失败. "+res.msg); return false; } } }, error: function(res){ alert("操作失败."); return false; } }); }); }); });</script>

</html>