117 lines
5.7 KiB
HTML
117 lines
5.7 KiB
HTML
![]() |
<body>
|
|||
|
|
|||
|
|
|||
|
<div class="layui-row">
|
|||
|
<div class="layui-col-md4">
|
|||
|
<button class="layui-btn layui-btn-danger layui-btn-sm" id="batchDeleteTransaction">批量删除</button>
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
|
|||
|
<table id="transactionLogTable" lay-filter="transactionLogTable"></table>
|
|||
|
<script type="text/html" id="barDemo">
|
|||
|
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete">删除</a>
|
|||
|
</script>
|
|||
|
|
|||
|
<script>
|
|||
|
layui.use(['table', 'layer'], function(){
|
|||
|
var table = layui.table;
|
|||
|
var layer = layui.layer;
|
|||
|
|
|||
|
// 渲染表格
|
|||
|
table.render({
|
|||
|
elem: '#transactionLogTable',
|
|||
|
url: '/admin/transaction-logs/', // 数据接口URL
|
|||
|
page: true, // 开启分页
|
|||
|
limit: 10, // 每页显示的条数
|
|||
|
method: 'post', // 使用POST请求
|
|||
|
where: { // 这里传入的是额外的请求参数,LayUI会将这些参数合并到请求数据中
|
|||
|
action: 'fetch', // 指定操作类型
|
|||
|
},
|
|||
|
contentType: 'application/json', // 设置发送请求的内容类型为JSON
|
|||
|
cols: [[
|
|||
|
|
|||
|
{type: 'checkbox', fixed: 'left'},
|
|||
|
{field: 'transaction_no', title: '交易编号', sort: true},
|
|||
|
{field: 'transaction_status', title: '交易状态', templet: function(d){
|
|||
|
return d.transaction_status === 'pending' ? '待处理' : (d.transaction_status === 'completed' ? '完成' : '失败');
|
|||
|
}},
|
|||
|
{field: 'user_openid', title: '用户OpenID'},
|
|||
|
{field: 'transaction_type', title: '交易类型',templet: function(d){
|
|||
|
return d.transaction_type === 'member' ? '开通会员' : '续费会员'
|
|||
|
}},
|
|||
|
{field: 'transaction_amount', title: '交易金额'},
|
|||
|
{field: 'remark', title: '备注', templet: function(d){
|
|||
|
var remarkMap = {
|
|||
|
'day': '一天会员充值',
|
|||
|
'week': '一周会员充值',
|
|||
|
'month': '一月会员充值',
|
|||
|
'season': '三月会员充值',
|
|||
|
'year': '一年会员充值'
|
|||
|
};
|
|||
|
return remarkMap[d.remark] || '未知';
|
|||
|
}},
|
|||
|
|
|||
|
{field: 'created_at', title: '创建时间', templet: function(d){
|
|||
|
return layui.util.toDateString(d.created_at, 'yyyy-MM-dd HH:mm:ss');
|
|||
|
}},
|
|||
|
{field: 'updated_at', title: '更新时间', templet: function(d){
|
|||
|
return layui.util.toDateString(d.updated_at, 'yyyy-MM-dd HH:mm:ss');
|
|||
|
}},
|
|||
|
{title: '操作', toolbar: '#barDemo'}
|
|||
|
]]
|
|||
|
});
|
|||
|
|
|||
|
// 监听工具条
|
|||
|
table.on('tool(transactionLogTable)', function(obj){
|
|||
|
var data = obj.data; // 获得当前行数据
|
|||
|
if(obj.event === 'delete'){
|
|||
|
// 删除操作
|
|||
|
layer.confirm('真的删除行么', function(index){
|
|||
|
axios.post('/admin/transaction-logs/', JSON.stringify({action: 'delete', id: data.id}), {
|
|||
|
headers: {'Content-Type': 'application/json'}
|
|||
|
}).then(function(response){
|
|||
|
if(response.data.status === 'success'){
|
|||
|
layer.msg('删除成功', {icon: 1});
|
|||
|
layui.table.reload('transactionLogTable'); // 重新加载表格
|
|||
|
} else {
|
|||
|
layer.msg('删除失败', {icon: 2});
|
|||
|
}
|
|||
|
}).catch(function(error){
|
|||
|
layer.msg('删除过程中出错', {icon: 2});
|
|||
|
console.error('删除失败', error);
|
|||
|
});
|
|||
|
layer.close(index); // 关闭确认弹窗
|
|||
|
// 向服务端发送删除指令的代码...
|
|||
|
});
|
|||
|
}
|
|||
|
});
|
|||
|
|
|||
|
// 监听批量删除按钮点击事件
|
|||
|
document.getElementById('batchDeleteTransaction').onclick = function() {
|
|||
|
var checkStatus = table.checkStatus('transactionLogTable');
|
|||
|
var selectedData = checkStatus.data;
|
|||
|
var ids = selectedData.map(function(item) {
|
|||
|
return item.id;
|
|||
|
});
|
|||
|
if (selectedData.length === 0) {
|
|||
|
layer.msg('请选择要删除的订单记录', {icon: 5});
|
|||
|
} else {
|
|||
|
layer.confirm('确认删除选中的订单记录么?', function(index) {
|
|||
|
axios.post('/admin/transaction-logs/', JSON.stringify({ids: ids,action:'batch_delete'}), {
|
|||
|
headers: {'Content-Type': 'application/json'}
|
|||
|
}).then(function(response){
|
|||
|
if(response.data.status === 'success'){
|
|||
|
layer.msg('批量删除成功', {icon: 1});
|
|||
|
layui.table.reload('transactionLogTable'); // 重新加载表格
|
|||
|
} else {
|
|||
|
layer.msg('批量删除失败', {icon: 2});
|
|||
|
}
|
|||
|
}).catch(function(error){
|
|||
|
console.error('批量删除失败', error);
|
|||
|
});
|
|||
|
});
|
|||
|
}
|
|||
|
};
|
|||
|
});
|
|||
|
</script>
|