Files
BuYuHouDuan/AdminSrc/AdminHost/wwwroot/admin/dist/views/user/assetchange/assetchangelog.html
T
2026-10-12 16:22:04 +08:00

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>