dnsmgr/app/view/domain/category.html

{extend name="common/layout" /}
{block name="title"}域名分类管理{/block}
{block name="main"}
<div class="modal" id="modal-store" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static">
	<div class="modal-dialog">
		<div class="modal-content animated flipInX">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
				<h4 class="modal-title" id="modal-title">添加分类</h4>
			</div>
			<div class="modal-body">
				<form class="form-horizontal" id="form-store">
					<input type="hidden" name="id"/>
					<div class="form-group">
						<label class="col-sm-3 control-label">分类名称</label>
						<div class="col-sm-8">
							<input type="text" class="form-control" name="name" placeholder="输入分类名称" required>
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-3 control-label">排序</label>
						<div class="col-sm-8">
							<input type="number" class="form-control" name="sort" value="0" placeholder="数字越小越靠前">
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-3 control-label">备注</label>
						<div class="col-sm-8">
							<input type="text" class="form-control" name="remark" placeholder="可选">
						</div>
					</div>
				</form>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
				<button type="button" class="btn btn-primary" id="store" onclick="save()">保存</button>
			</div>
		</div>
	</div>
</div>

<div class="row">
	<div class="col-xs-12 center-block" style="float: none;">
		<div class="panel panel-default">
			<div class="panel-heading">
				<h3 class="panel-title">域名分类管理</h3>
			</div>
			<div class="panel-body">
				<form onsubmit="return searchSubmit()" method="GET" class="form-inline" id="searchToolbar">
					<a href="javascript:addframe()" class="btn btn-success"><i class="fa fa-plus"></i> 添加分类</a>
					<a href="javascript:searchClear()" class="btn btn-default" title="刷新列表"><i class="fa fa-refresh"></i> 刷新</a>
				</form>
				<table id="listTable"></table>
			</div>
		</div>
	</div>
</div>
{/block}
{block name="script"}
<script src="/static/js/layer/layer.js"></script>
<script src="/static/js/bootstrap-table-1.21.4.min.js"></script>
<script src="/static/js/bootstrap-table-page-jump-to-1.21.4.min.js"></script>
<script src="/static/js/bootstrapValidator.min.js"></script>
<script src="/static/js/custom.js?v=1003"></script>
<script>
$(document).ready(function(){
	updateToolbar();
	let defaultPageSize = getCookie('category_pagesize') ? getCookie('category_pagesize') : 10;
	const pageNumber = typeof window.$_GET['pageNumber'] != 'undefined' ? parseInt(window.$_GET['pageNumber']) : 1;
	const pageSize = typeof window.$_GET['pageSize'] != 'undefined' ? parseInt(window.$_GET['pageSize']) : defaultPageSize;

	$("#listTable").bootstrapTable({
		url: '/domain/category/data',
		pageNumber: pageNumber,
		pageSize: pageSize,
		classes: 'table table-striped table-hover table-bordered',
		uniqueId: 'id',
		columns: [
			{
				field: 'id',
				title: 'ID'
			},
			{
				field: 'name',
				title: '分类名称'
			},
			{
				field: 'remark',
				title: '备注',
				formatter: function(value, row, index) {
					return value ? value : '-';
				}
			},
			{
				field: 'sort',
				title: '排序'
			},
			{
				field: 'domain_count',
				title: '域名数量',
				formatter: function(value, row, index) {
					return '<span class="label label-info">' + value + '</span>';
				}
			},
			{
				field: 'addtime',
				title: '添加时间'
			},
			{
				field: 'action',
				title: '操作',
				formatter: function(value, row, index) {
					var html = '<a href="javascript:editframe(\''+row.id+'\')" class="btn btn-primary btn-xs">修改</a>&nbsp;&nbsp;';
					html += '<a href="javascript:delItem(\''+row.id+'\')" class="btn btn-danger btn-xs">删除</a>&nbsp;&nbsp;';
					html += '<a href="/domain?cid='+row.id+'" class="btn btn-default btn-xs">域名</a>';
					return html;
				}
			},
		],
		onPageChange: function(number, size){
			if(size != defaultPageSize){
				setCookie('category_pagesize', size, 24 * 3600 * 30);
			}
		},
	});

	$("#form-store").bootstrapValidator();
});

function addframe(){
	$("#modal-store").modal('show');
	$("#modal-title").html("添加分类");
	$("#form-store input[name=id]").val('');
	$("#form-store input[name=name]").val('');
	$("#form-store input[name=sort]").val('0');
	$("#form-store input[name=remark]").val('');
	$("#form-store").data("bootstrapValidator").resetForm();
}

function editframe(id){
	var row = $("#listTable").bootstrapTable('getRowByUniqueId', id);
	$("#modal-store").modal('show');
	$("#modal-title").html("修改分类");
	$("#form-store input[name=id]").val(id);
	$("#form-store input[name=name]").val(row.name);
	$("#form-store input[name=sort]").val(row.sort);
	$("#form-store input[name=remark]").val(row.remark);
	$("#form-store").data("bootstrapValidator").resetForm();
}

function save(){
	$("#form-store").data("bootstrapValidator").validate();
	if(!$("#form-store").data("bootstrapValidator").isValid()){
		return;
	}
	var id = $("#form-store input[name=id]").val();
	var action = id ? 'edit' : 'add';
	var ii = layer.load(2);
	$.ajax({
		type : 'POST',
		url : '/domain/category/' + action,
		data : $("#form-store").serialize(),
		dataType : 'json',
		success : function(data) {
			layer.close(ii);
			if(data.code == 0){
				layer.alert(data.msg, {
					icon: 1,
					closeBtn: false
				}, function(){
					layer.closeAll();
					$("#modal-store").modal('hide');
					searchRefresh();
				});
			}else{
				layer.alert(data.msg, {icon: 2});
			}
		}
	});
}

function delItem(id) {
	layer.confirm('确定要删除此分类吗？', {title: '提示', icon: 0}, function(){
		var ii = layer.load(2);
		$.ajax({
			type : 'POST',
			url : '/domain/category/del',
			data : {id: id},
			dataType : 'json',
			success : function(data) {
				layer.close(ii);
				if(data.code == 0){
					layer.closeAll();
					layer.msg('删除成功', {icon: 1, time:800});
					searchRefresh();
				}else{
					layer.alert(data.msg, {icon: 2});
				}
			}
		});
	});
}
</script>
{/block}