apeblog/app/admin/view/poster/index.html

242 lines
10 KiB
HTML

<!DOCTYPE html>
<html lang="zh">
<head>
<title>广告管理 - {:system_config('title')}后台管理系统</title>
{include file="public/header" /}
</head>
<body>
<div class="container-fluid p-t-15">
<div class="row">
<div class="col-lg-12">
<div class="card">
<div class="card-header"><h4>搜索</h4></div>
<div class="card-body">
<form class="form-inline searchForm" onsubmit="return false;">
<div class="form-group">
<label for="title">广告名称</label>
<div class="input-group">
<div class="input-group">
<input type="text" class="form-control" id="title" name="title"
placeholder="请输入广告名称">
</div>
</div>
</div>
<div class="form-group">
<label for="start_time">操作时间</label>
<div class="input-group">
<input class="form-control js-datetimepicker" type="text" id="start_time"
name="start_time" autocomplete="off" data-side-by-side="true" data-locale="zh-cn"
data-format="YYYY-MM-DD" placeholder="开始时间">
<span class="input-group-addon">~</span>
<input class="form-control js-datetimepicker" type="text" id="end_time" name="end_time"
autocomplete="off" data-side-by-side="true" data-locale="zh-cn"
data-format="YYYY-MM-DD" placeholder="结束时间">
</div>
</div>
<button type="submit" class="btn btn-success" style="margin: -10px 0 0 10px;" id="search">搜索
</button>
</form>
</div>
</div>
</div>
<div class="col-lg-12">
<div class="card">
<div class="card-toolbar clearfix">
<div id="toolbar" class="toolbar-btn-action">
<button id="btn_add" type="button" class="btn btn-primary m-r-5"
onclick="iframe.createIframe('添加广告','/admin/poster/add')">
<span class="mdi mdi-plus" aria-hidden="true"></span>新增
</button>
<a class="btn btn-warning" href="#!" onclick="delSelect()"><i class="mdi mdi-window-close"></i>
删除</a>
</div>
</div>
<div class="card-body">
<table id="tb_departments"></table>
</div>
</div>
</div>
</div>
</div>
{include file="public/footer"/}
<script type="text/javascript">
$('#tb_departments').bootstrapTable({
classes: 'table table-bordered table-hover table-striped',
url: '/admin/poster/Lst',
method: 'post',
dataType: 'json', // 因为本示例中是跨域的调用,所以涉及到ajax都采用jsonp,
uniqueId: 'id',
idField: 'id', // 每行的唯一标识字段
toolbar: '#toolbar', // 工具按钮容器
showColumns: false, // 是否显示所有的列
showRefresh: false, // 是否显示刷新按钮
responseHandler: function (res) {
return {
"total": res.count,
"rows": res.data,
};
},
pagination: true,
queryParams: function (params) {
let temp = toArrayList($(".searchForm").serializeArray());
temp['limit'] = params.limit;
temp['page'] = (params.offset / params.limit) + 1;
return temp;
},
sidePagination: "server",
pageNumber: 1,
pageSize: 10,
pageList: [10, 20, 50, 100],
columns: [{
checkbox: true, // 是否显示复选框
}, {
field: 'id',
title: 'ID'
}, {
field: 'title',
title: '广告名称'
}, {
field: 'image',
title: '广告图片',
formatter: function (value, row, index) {
let html = '<img src="' + value + '" alt="" width="50px;">';
return html;
}
}, {
field: 'position',
title: '广告图片',
formatter: function (value, row, index) {
switch (value) {
case 1:
return '顶部页签';
case 2:
return '右侧广告位';
case 3:
return '文章页面';
default:
return '顶部页签';
}
}
}, {
field: 'url',
title: '链接地址',
}, {
field: 'create_time',
title: '添加时间',
}, {
field: 'operate',
title: '操作',
formatter: operateFormatter,
events: {
'click .btn-edit': function (event, value, row, index) {
iframe.createIframe('修改广告', '/admin/poster/edit?id=' + row.id)
},
'click .btn-del': function (event, value, row, index) {
$.alert({
title: '系统提示',
content: '删除提醒',
buttons: {
confirm: {
text: '确认',
btnClass: 'btn-primary',
action: function () {
$.post(url = "/admin/poster/del", data = {"id": row.id}, function (res) {
if (res.status == 200) {
parent.lightyear.notify('删除成功', 'success', 3000, 'mdi mdi-emoticon-happy', 'top', 'center');
$("#tb_departments").bootstrapTable('refresh');
} else parent.lightyear.notify('删除失败', 'danger', 3000, 'mdi mdi-emoticon-happy', 'top', 'center');
});
}
},
cancel: {
text: '取消'
}
}
});
}
}
}],
onLoadSuccess: function (data) {
$("[data-toggle='tooltip']").tooltip();
}
});
//搜索
$("#search").click(function () {
let start_time = $('#start_time').val();
let end_time = $('#end_time').val();
if (start_time && end_time && start_time > end_time) {
alert('开始时间不能大于结束时间');
return false;
}
$("#tb_departments").bootstrapTable('refresh', {query: {page: 1}, pageNumber: 1});
});
// 操作按钮
function operateFormatter(value, row, index) {
return [
'<a type="button" class="btn-edit btn btn-xs btn-default m-r-5" title="修改" data-toggle="tooltip"><i class="mdi mdi-pencil"></i></a>',
'<a type="button" class="btn-del btn btn-xs btn-default" title="删除" data-toggle="tooltip"><i class="mdi mdi-delete"></i></a>'
].join('');
}
function delOne(id) {
$.confirm({
title: '重要提醒!',
content: '删除后将不可恢复,请谨慎操作!',
backgroundDismiss: true,
buttons: {
ok: {
text: '确认',
btnClass: 'btn-danger',
action: function () {
$.post("/admin/poster/del", data = {id: id}, function (res) {
if (res.status == 200 || res.code == 200) lightyear.notify(res.msg, 'success', 3000, 'mdi mdi-emoticon-happy', 'top', 'center');
else lightyear.notify(res.msg, 'danger', 3000, 'mdi mdi-emoticon-neutral', 'top', 'center');
location.reload();
})
}
},
cancel: {
text: '取消',
btnClass: 'btn-primary'
}
}
});
}
function delSelect() {
var checkID = "";
var selectedItem = $('#tb_departments').bootstrapTable('getSelections');
if (selectedItem == "") return lightyear.notify("没有选中项", 'danger', 3000, 'mdi mdi-emoticon-neutral', 'top', 'center');
for (var i = 0; i < selectedItem.length; i++) {
checkID += selectedItem[i]['id'] + ",";
}
if (checkID == "") return lightyear.notify("没有选中项", 'danger', 3000, 'mdi mdi-emoticon-neutral', 'top', 'center');
$.confirm({
title: '重要提醒!',
content: '选中项删除后将不可恢复,请谨慎操作!',
backgroundDismiss: true,
buttons: {
ok: {
text: '确认',
btnClass: 'btn-danger',
action: function () {
$.post("/admin/poster/del", data = {id: checkID}, function (res) {
if (res.status == 200 || res.code == 200) {
lightyear.notify(res.msg, 'success', 3000, 'mdi mdi-emoticon-happy', 'top', 'center');
location.reload();
} else lightyear.notify(res.msg, 'danger', 3000, 'mdi mdi-emoticon-neutral', 'top', 'center');
})
}
},
cancel: {
text: '取消',
btnClass: 'btn-primary'
}
}
});
}
</script>
</body>
</html>