167 lines
6.4 KiB
HTML
167 lines
6.4 KiB
HTML
{include file="Public:header3"/}
|
|
<div class="layui-fluid">
|
|
<div class="layui-card">
|
|
<div class="layui-card-header">悬浮球配置</div>
|
|
<div class="layui-card-body">
|
|
<div class="layui-form toolbar">
|
|
<div class="layui-form-item">
|
|
<div class="layui-inline">
|
|
<a class="layui-btn layui-btn-sm" id="btnAdd"><i class="layui-icon"></i>添加</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<table id="tableList" lay-filter="tableList"></table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 表格操作列 -->
|
|
<script type="text/html" id="tableBar">
|
|
<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>
|
|
{{# if(d.status == 0){ }}
|
|
<a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="enable">启用</a>
|
|
{{# }else{ }}
|
|
<a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="disable">禁用</a>
|
|
{{# } }}
|
|
</script>
|
|
|
|
<!-- 开关状态模板 -->
|
|
<script type="text/html" id="switchTpl">
|
|
{{# if(d.status == 1){ }}
|
|
<span class="layui-badge layui-bg-green">开启</span>
|
|
{{# }else{ }}
|
|
<span class="layui-badge">关闭</span>
|
|
{{# } }}
|
|
</script>
|
|
|
|
<!-- 类型模板 -->
|
|
<script type="text/html" id="typeTpl">
|
|
{{# if(d.type == 1){ }}
|
|
<span>展示图片</span>
|
|
{{# }else{ }}
|
|
<span>跳转页面</span>
|
|
{{# } }}
|
|
</script>
|
|
|
|
<!-- 特效模板 -->
|
|
<script type="text/html" id="effectTpl">
|
|
{{# if(d.effect == 0){ }}
|
|
<span>无</span>
|
|
{{# }else{ }}
|
|
<span>特效1</span>
|
|
{{# } }}
|
|
</script>
|
|
{include file="Public/footer3" /}
|
|
<script>
|
|
layui.use(['table', 'form', 'jquery', 'layer'], function () {
|
|
var $ = layui.jquery;
|
|
var table = layui.table;
|
|
var form = layui.form;
|
|
var layer = layui.layer;
|
|
|
|
// 渲染表格
|
|
table.render({
|
|
elem: '#tableList',
|
|
url: '{:url("/admin/float_ball")}',
|
|
page: true,
|
|
cols: [[
|
|
{type: 'numbers', title: '序号', width: 60},
|
|
{field: 'title', title: '标题'},
|
|
{field: 'image', title: '图片', templet: function (d) {
|
|
return '<img src="' + d.image + '" style="max-height: 50px;">';
|
|
}},
|
|
{field: 'image_bj', title: '背景图', templet: function (d) {
|
|
return d.image_bj ? '<img src="' + d.image_bj + '" style="max-height: 50px;">' : '';
|
|
}},
|
|
{field: 'image_details', title: '图片详情', templet: function (d) {
|
|
return d.image_details ? '<img src="' + d.image_details + '" style="max-height: 50px;">' : '';
|
|
}},
|
|
{field: 'type', title: '类型', templet: '#typeTpl'},
|
|
{field: 'link_url', title: '跳转链接'},
|
|
{field: 'position_x', title: 'X坐标'},
|
|
{field: 'position_y', title: 'Y坐标'},
|
|
{field: 'width', title: '宽度'},
|
|
{field: 'height', title: '高度'},
|
|
{field: 'image_details_x', title: '详情图X坐标'},
|
|
{field: 'image_details_y', title: '详情图Y坐标'},
|
|
{field: 'image_details_w', title: '详情图宽度'},
|
|
{field: 'image_details_h', title: '详情图高度'},
|
|
{field: 'effect', title: '特效', templet: '#effectTpl'},
|
|
{field: 'status', title: '状态', templet: '#switchTpl'},
|
|
{field: 'create_time', title: '创建时间', templet: function (d) {
|
|
return layui.util.toDateString(d.create_time * 1000);
|
|
}},
|
|
{title: '操作', toolbar: '#tableBar', width: 180}
|
|
]]
|
|
});
|
|
|
|
// 添加按钮点击事件
|
|
$('#btnAdd').click(function () {
|
|
layer.open({
|
|
type: 2,
|
|
title: '添加悬浮球配置',
|
|
area: ['1000px', '600px'],
|
|
shade: 0.4,
|
|
shadeClose: true,
|
|
// offset: 'c',
|
|
content: '{:url("/admin/float_ball_add")}'
|
|
});
|
|
});
|
|
|
|
// 表格工具条点击事件
|
|
table.on('tool(tableList)', function (obj) {
|
|
var data = obj.data;
|
|
var layEvent = obj.event;
|
|
|
|
if (layEvent === 'edit') {
|
|
layer.open({
|
|
type: 2,
|
|
title: '编辑悬浮球配置',
|
|
area: ['1000px', '600px'],
|
|
shade: 0.4,
|
|
shadeClose: true,
|
|
// offset: 'r',
|
|
content: '{:url("/admin/float_ball_edit")}?id=' + data.id
|
|
});
|
|
} else if (layEvent === 'del') {
|
|
layer.confirm('确定要删除吗？', function (i) {
|
|
layer.close(i);
|
|
layer.load(2);
|
|
$.post('{:url("/admin/float_ball_del")}', {id: data.id}, function (res) {
|
|
layer.closeAll('loading');
|
|
if (res.status) {
|
|
layer.msg(res.msg, {icon: 1});
|
|
table.reload('tableList');
|
|
} else {
|
|
layer.msg(res.msg, {icon: 2});
|
|
}
|
|
}, 'json');
|
|
});
|
|
} else if (layEvent === 'enable') {
|
|
layer.load(2);
|
|
$.post('{:url("/admin/float_ball_status")}', {id: data.id, status: 1}, function (res) {
|
|
layer.closeAll('loading');
|
|
if (res.status) {
|
|
layer.msg(res.msg, {icon: 1});
|
|
table.reload('tableList');
|
|
} else {
|
|
layer.msg(res.msg, {icon: 2});
|
|
}
|
|
}, 'json');
|
|
} else if (layEvent === 'disable') {
|
|
layer.load(2);
|
|
$.post('{:url("/admin/float_ball_status")}', {id: data.id, status: 0}, function (res) {
|
|
layer.closeAll('loading');
|
|
if (res.status) {
|
|
layer.msg(res.msg, {icon: 1});
|
|
table.reload('tableList');
|
|
} else {
|
|
layer.msg(res.msg, {icon: 2});
|
|
}
|
|
}, 'json');
|
|
}
|
|
});
|
|
});
|
|
</script>
|