313 lines
12 KiB
HTML
313 lines
12 KiB
HTML
<title>金币变动记录</title>
|
|
<script src="/admin/layui/xm-select.js"></script>
|
|
|
|
<div class="layui-card layadmin-header">
|
|
<div class="layui-breadcrumb" lay-filter="breadcrumb">
|
|
<a lay-href="">主页</a>
|
|
<a><cite>用户管理</cite></a>
|
|
<a><cite>金币变动记录</cite></a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-fluid">
|
|
<div class="layui-form layui-card-header layuiadmin-card-header-auto" lay-filter="layadmin-assetchange-formlist">
|
|
<div class="layui-form-item">
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">用户ID</label>
|
|
<div class="layui-input-block">
|
|
<input type="text" name="userId" placeholder="请输入用户ID" autocomplete="off" class="layui-input">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">关键词</label>
|
|
<div class="layui-input-block">
|
|
<input type="text" name="keyWord" placeholder="用户编号/昵称" autocomplete="off" class="layui-input">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">货币类型</label>
|
|
<div class="layui-input-block">
|
|
<div id="currencyTypes-select"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">变动类型</label>
|
|
<div class="layui-input-block">
|
|
<select name="changeTypes" multiple>
|
|
<option value="1">增加</option>
|
|
<option value="2">减少</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">事件来源</label>
|
|
<div class="layui-input-block">
|
|
<select name="sources" multiple>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">时间范围</label>
|
|
<div class="layui-input-block">
|
|
<input type="text" name="timeRange" id="timeRange" placeholder="选择时间范围" autocomplete="off" class="layui-input">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-inline">
|
|
<button class="layui-btn layuiadmin-btn-list" lay-submit lay-filter="LAY-assetchange-search">
|
|
<i class="layui-icon layui-icon-search layuiadmin-button-btn"></i> 搜索
|
|
</button>
|
|
<button class="layui-btn layui-btn-primary" lay-filter="LAY-assetchange-reset">
|
|
<i class="layui-icon layui-icon-refresh layuiadmin-button-btn"></i> 重置
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-card">
|
|
<div class="layui-card-body">
|
|
<table id="LAY-assetchange-manage" lay-filter="LAY-assetchange-manage"></table>
|
|
|
|
<script type="text/html" id="table-assetchange-toolbar">
|
|
<div class="layui-btn-container">
|
|
<button class="layui-btn layui-btn-sm layui-btn-primary" lay-event="refresh">
|
|
<i class="layui-icon layui-icon-refresh"></i> 刷新
|
|
</button>
|
|
</div>
|
|
</script>
|
|
|
|
<script type="text/html" id="changeTypeTpl">
|
|
{{# if(d.type === 1){ }}
|
|
<span class="layui-badge layui-bg-green">增加</span>
|
|
{{# } else { }}
|
|
<span class="layui-badge layui-bg-red">减少</span>
|
|
{{# } }}
|
|
</script>
|
|
|
|
<script type="text/html" id="currencyTypeTpl">
|
|
{{# if(d.currencyType === 1){ }}
|
|
<span class="layui-badge layui-bg-orange">金币</span>
|
|
{{# } else if(d.currencyType === 2){ }}
|
|
<span class="layui-badge layui-bg-blue">保险箱金币</span>
|
|
{{# } else { }}
|
|
<span class="layui-badge layui-bg-purple">钻石</span>
|
|
{{# } }}
|
|
</script>
|
|
|
|
<script type="text/html" id="countTpl">
|
|
<div>
|
|
<div>变动前: {{d.beforeCount}}</div>
|
|
<div style="color: {{d.type === 1 ? '#5FB878' : '#FF5722'}};">
|
|
{{d.type === 1 ? '+' : '-'}}{{d.changeCount}}
|
|
</div>
|
|
<div>变动后: {{d.afterCount}}</div>
|
|
</div>
|
|
</script>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
layui.use(['admin', 'table', 'form', 'laydate'], function () {
|
|
var $ = layui.$,
|
|
admin = layui.admin,
|
|
table = layui.table,
|
|
setter = layui.setter,
|
|
form = layui.form,
|
|
laydate = layui.laydate;
|
|
|
|
// 时间范围选择器
|
|
laydate.render({
|
|
elem: '#timeRange',
|
|
type: 'datetime',
|
|
range: '~'
|
|
});
|
|
|
|
// 加载事件来源列表
|
|
function loadSources() {
|
|
admin.req({
|
|
url: setter.baseurl + 'adminapi/UserAssetChange/sources',
|
|
done: function (res) {
|
|
var html = '';
|
|
layui.each(res.data, function (index, item) {
|
|
html += '<option value="' + item.value + '">' + item.label + '</option>';
|
|
});
|
|
$('[name="sources"]').append(html);
|
|
form.render('select');
|
|
}
|
|
});
|
|
}
|
|
|
|
loadSources();
|
|
|
|
// 初始化货币类型 xm-select
|
|
console.log('[资金变动] 开始初始化货币类型 xm-select');
|
|
console.log('[资金变动] #currencyTypes-select 元素:', $('#currencyTypes-select').length);
|
|
|
|
var currencyTypesSelect = xmSelect.render({
|
|
el: '#currencyTypes-select',
|
|
data: [
|
|
{name: '金币', value: 1},
|
|
{name: '保险箱金币', value: 2},
|
|
{name: '钻石', value: 3}
|
|
],
|
|
tips: '请选择货币类型',
|
|
filterable: true,
|
|
model: { label: { type: 'block', block: { showIcon: false } } },
|
|
on: function(data) {
|
|
console.log('[资金变动] 货币类型选择变化:', data.arr);
|
|
}
|
|
});
|
|
|
|
console.log('[资金变动] 货币类型 xm-select 初始化完成:', currencyTypesSelect);
|
|
|
|
form.render(null, 'layadmin-assetchange-formlist');
|
|
|
|
// 从URL获取userId参数(从用户列表跳转时带入)
|
|
var urlParams = new URLSearchParams(window.location.hash.split('?')[1] || '');
|
|
var initUserId = urlParams.get('userId') || '';
|
|
var initNickName = urlParams.get('nickName') || '';
|
|
if (initUserId) {
|
|
$('input[name="userId"]').val(initUserId);
|
|
if (initNickName) {
|
|
$('.layui-breadcrumb a:last').text('金币变动记录 - ' + initNickName);
|
|
}
|
|
}
|
|
|
|
// 监听搜索
|
|
form.on('submit(LAY-assetchange-search)', function (data) {
|
|
var field = data.field;
|
|
|
|
console.log('[资金变动] 搜索参数:', field);
|
|
|
|
// 处理时间范围
|
|
if (field.timeRange) {
|
|
var times = field.timeRange.split('~');
|
|
field.timeStart = Math.floor(new Date(times[0].trim()).getTime() / 1000);
|
|
field.timeEnd = Math.floor(new Date(times[1].trim()).getTime() / 1000);
|
|
}
|
|
delete field.timeRange;
|
|
|
|
// 处理多选:layui 原生 select multiple(问题3修复:确保currencyTypes是数组)
|
|
field.currencyTypes = currencyTypesSelect.getValue('value');
|
|
console.log('[资金变动] 货币类型选择:', field.currencyTypes);
|
|
|
|
if (field.currencyTypes.length === 0) {
|
|
delete field.currencyTypes;
|
|
}
|
|
|
|
if (field.changeTypes) {
|
|
field.changeTypes = Array.isArray(field.changeTypes) ? field.changeTypes : [field.changeTypes];
|
|
} else {
|
|
delete field.changeTypes;
|
|
}
|
|
|
|
if (field.sources) {
|
|
field.sources = Array.isArray(field.sources) ? field.sources : [field.sources];
|
|
} else {
|
|
delete field.sources;
|
|
}
|
|
|
|
// 排除击杀鱼和开炮事件
|
|
field.excludeSources = ['开炮', '击杀鱼'];
|
|
console.log('[资金变动] 完整请求参数:', field);
|
|
|
|
table.reload('LAY-assetchange-manage', {
|
|
where: field,
|
|
page: { curr: 1 }
|
|
});
|
|
});
|
|
});
|
|
|
|
// 监听重置
|
|
form.on('submit(LAY-assetchange-reset)', function (data) {
|
|
$('input[name="userId"]').val('');
|
|
$('input[name="keyWord"]').val('');
|
|
$('[name="currencyTypes"]').val('');
|
|
$('[name="changeTypes"]').val('');
|
|
$('[name="sources"]').val('');
|
|
$('#timeRange').val('');
|
|
form.render('select');
|
|
table.reload('LAY-assetchange-manage', {
|
|
where: {},
|
|
page: { curr: 1 }
|
|
});
|
|
});
|
|
|
|
// 刷新按钮
|
|
$('.layui-btn-container').on('click', '[lay-event="refresh"]', function () {
|
|
table.reload('LAY-assetchange-manage');
|
|
});
|
|
|
|
table.render({
|
|
elem: "#LAY-assetchange-manage",
|
|
url: setter.baseurl + "adminapi/UserAssetChange/list",
|
|
method: "post",
|
|
contentType: "application/json",
|
|
headers: {
|
|
'token': layui.data(setter.tableName)[setter.request.tokenName]
|
|
},
|
|
page: true,
|
|
toolbar: '#table-assetchange-toolbar',
|
|
defaultToolbar: ['filter', 'exports', 'print'],
|
|
where: {
|
|
userId: initUserId
|
|
},
|
|
request: {
|
|
pageName: 'pageIndex',
|
|
limitName: 'pageSize'
|
|
},
|
|
limit: 10,
|
|
cols: [[
|
|
{ type: 'numbers', title: '序号', width: 60 },
|
|
{ field: "userId", title: "用户ID", width: 120 },
|
|
{ field: "userName", title: "用户名", width: 120 },
|
|
{ field: "currencyType", title: "货币类型", width: 120, templet: '#currencyTypeTpl' },
|
|
{ field: "type", title: "变动类型", width: 100, templet: '#changeTypeTpl' },
|
|
{ field: "source", title: "事件来源", width: 150 },
|
|
{ field: "beforeCount", title: "变动前", width: 120 },
|
|
{ field: "changeCount", title: "变动值", width: 120, templet: function(d) {
|
|
return '<span style="color: ' + (d.type === 1 ? '#5FB878' : '#FF5722') + ';">' +
|
|
(d.type === 1 ? '+' : '-') + d.changeCount + '</span>';
|
|
}},
|
|
{ field: "afterCount", title: "变动后", width: 120 },
|
|
{ field: "remark", title: "备注", minWidth: 200 },
|
|
{ field: "createTime", title: "变动时间", width: 160, templet: function(d) {
|
|
return formatDateTime(d.createTime);
|
|
}}
|
|
]],
|
|
text: "对不起,加载出现异常!",
|
|
response: {
|
|
statusName: 'code',
|
|
statusCode: 0,
|
|
msgName: 'info',
|
|
countName: 'count',
|
|
dataName: 'data'
|
|
},
|
|
done: function(res) {
|
|
console.log('[资金变动] 表格数据加载完成:', res);
|
|
if (res.data && res.data.length > 0) {
|
|
console.log('[资金变动] 第一条数据示例:', res.data[0]);
|
|
}
|
|
}
|
|
});
|
|
|
|
function formatDateTime(date) {
|
|
if (!date) return '-';
|
|
var d = new Date(date);
|
|
var year = d.getFullYear();
|
|
var month = ('0' + (d.getMonth() + 1)).slice(-2);
|
|
var day = ('0' + d.getDate()).slice(-2);
|
|
var hour = ('0' + d.getHours()).slice(-2);
|
|
var minute = ('0' + d.getMinutes()).slice(-2);
|
|
var second = ('0' + d.getSeconds()).slice(-2);
|
|
return year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + second;
|
|
}
|
|
});
|
|
</script>
|