417 lines
20 KiB
HTML
417 lines
20 KiB
HTML
|
||
<title>签到配置</title>
|
||
|
||
<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-card">
|
||
<div class="layui-card-header">基础配置</div>
|
||
<div class="layui-card-body">
|
||
<form class="layui-form" lay-filter="sign-form">
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">是否开启</label>
|
||
<div class="layui-input-inline">
|
||
<input type="checkbox" name="isOpen" lay-skin="switch" lay-text="开启|关闭">
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">不可中断</label>
|
||
<div class="layui-input-inline" style="line-height:38px;">
|
||
<input type="checkbox" name="cannotInterrupt" lay-skin="switch" lay-text="勾选|未勾选">
|
||
</div>
|
||
<div class="layui-form-mid layui-word-aux">勾选=漏签不回退(按累计次数循环1~7)；未勾选=漏签重置回第1天</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<div class="layui-input-block">
|
||
<button class="layui-btn" lay-submit lay-filter="save-base">保存基础配置</button>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-card">
|
||
<div class="layui-card-header">7 日签到奖励</div>
|
||
<div class="layui-card-body">
|
||
<table id="table-sign" lay-filter="table-sign"></table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script type="text/html" id="toolbar-sign">
|
||
<div class="layui-btn-container">
|
||
<button class="layui-btn layui-btn-sm layui-btn-normal" lay-filter="init-sign"><i class="layui-icon layui-icon-refresh"></i> 初始化配置</button>
|
||
<button class="layui-btn layui-btn-sm" lay-filter="add-sign"><i class="layui-icon layui-icon-add-1"></i> 添加天数</button>
|
||
<button class="layui-btn layui-btn-sm" lay-filter="save-sign"><i class="layui-icon layui-icon-ok"></i> 保存配置</button>
|
||
<button class="layui-btn layui-btn-sm layui-btn-warm" lay-filter="reload-sign"><i class="layui-icon layui-icon-refresh"></i> 刷新</button>
|
||
<button class="layui-btn layui-btn-sm layui-btn-danger" lay-filter="batchdel-sign">批量删除</button>
|
||
<button class="layui-btn layui-btn-sm layui-btn-normal" onclick="saveAct('SignActivityConfig')"><i class="layui-icon layui-icon-export"></i> 保存到初始化文件</button>
|
||
</div>
|
||
</script>
|
||
|
||
<script type="text/html" id="bar-sign">
|
||
<a class="layui-btn layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
|
||
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
|
||
</script>
|
||
|
||
<script type="text/html" id="tpl-icon">
|
||
{{# if(d.icon){ }}
|
||
<img src="{{d.icon}}" style="width:40px;height:40px;object-fit:cover;cursor:pointer;border-radius:4px;" onclick="previewImage('{{d.icon}}')" alt="图标">
|
||
{{# } else { }}
|
||
<span style="color:#999;">无图标</span>
|
||
{{# } }}
|
||
</script>
|
||
|
||
<style>
|
||
.icon-upload-box { position: relative; display: inline-block; }
|
||
.icon-upload-box .upload-btn { position: absolute; top: 0; left: 0; width: 80px; height: 80px; opacity: 0; cursor: pointer; }
|
||
.icon-upload-preview { width: 80px; height: 80px; border: 1px dashed #ddd; border-radius: 4px; display: flex; align-items: center; justify-content: center; background: #fafafa; cursor: pointer; }
|
||
.icon-upload-preview:hover { border-color: #009688; }
|
||
.icon-upload-preview img { max-width: 100%; max-height: 100%; }
|
||
.icon-upload-preview .placeholder { color: #999; font-size: 12px; text-align: center; }
|
||
.gift-row { display: flex; align-items: center; margin-bottom: 6px; }
|
||
.gift-row .layui-input, .gift-row select { height: 32px; }
|
||
.gift-row .gr-count { width: 110px; margin: 0 6px; }
|
||
.gift-row .gr-oid { width: 150px; margin-right: 6px; }
|
||
</style>
|
||
|
||
<script>
|
||
layui.use(['admin', 'table', 'form', 'layer'], function () {
|
||
var $ = layui.$,
|
||
admin = layui.admin,
|
||
table = layui.table,
|
||
form = layui.form,
|
||
layer = layui.layer,
|
||
setter = layui.setter;
|
||
|
||
var activityConfig = null;
|
||
var typeMap = { 1: '金币', 2: '钻石', 3: '道具' };
|
||
|
||
setTimeout(function() {
|
||
if (window.parent && window.parent.$ && window.parent.layer) {
|
||
window.parent.$('.layui-layer-shade').remove();
|
||
window.parent.layer.closeAll();
|
||
}
|
||
$('.layui-layer-shade').remove();
|
||
layer.closeAll();
|
||
}, 100);
|
||
|
||
function sign() {
|
||
if (!activityConfig) activityConfig = {};
|
||
if (!activityConfig.signActivityConfig) activityConfig.signActivityConfig = { isOpen: true, cannotInterrupt: false, days: [] };
|
||
if (!activityConfig.signActivityConfig.days) activityConfig.signActivityConfig.days = [];
|
||
return activityConfig.signActivityConfig;
|
||
}
|
||
|
||
function loadConfig() {
|
||
admin.req({
|
||
method: "get",
|
||
url: setter.baseurl + "adminapi/ActivityConfig/Get",
|
||
done: function (res) {
|
||
activityConfig = (res.code === 0 && res.data) ? res.data : { signActivityConfig: {} };
|
||
initForm();
|
||
}
|
||
});
|
||
}
|
||
|
||
function initForm() {
|
||
var s = sign();
|
||
$('input[name="isOpen"]').prop('checked', !!s.isOpen);
|
||
$('input[name="cannotInterrupt"]').prop('checked', !!s.cannotInterrupt);
|
||
form.render();
|
||
renderTable();
|
||
}
|
||
|
||
function save(msg) {
|
||
var s = sign();
|
||
s.isOpen = $('input[name="isOpen"]')[0].checked;
|
||
s.cannotInterrupt = $('input[name="cannotInterrupt"]')[0].checked;
|
||
admin.req({
|
||
method: "post",
|
||
contentType: "application/json;charset=UTF-8",
|
||
url: setter.baseurl + "adminapi/ActivityConfig/UpdateSign",
|
||
data: JSON.stringify(s),
|
||
done: function (res) {
|
||
if (res.code === 0 || res.code === 200) {
|
||
layer.msg(msg || '保存成功');
|
||
loadConfig();
|
||
} else {
|
||
layer.msg(res.info || '保存失败');
|
||
}
|
||
}
|
||
});
|
||
}
|
||
|
||
function giftText(list) {
|
||
if (!list || !list.length) return '<span style="color:#999;">未配置</span>';
|
||
return list.map(function (g) {
|
||
var t = typeMap[g.type] || '金币';
|
||
var oid = (g.type === 3 && g.otherId) ? ('(' + g.otherId + ')') : '';
|
||
return t + '×' + (g.count || 0) + oid;
|
||
}).join('、');
|
||
}
|
||
|
||
function renderTable() {
|
||
table.render({
|
||
elem: '#table-sign',
|
||
data: sign().days || [],
|
||
page: false,
|
||
cols: [[
|
||
{ type: 'checkbox', fixed: 'left' },
|
||
{ field: "day", title: "第几天", width: 80, sort: true },
|
||
{ field: "name", title: "名称", width: 140 },
|
||
{ field: "icon", title: "图标", width: 90, templet: '#tpl-icon' },
|
||
{ title: "奖励", templet: function (d) { return giftText(d.giftList); } },
|
||
{ title: "操作", width: 160, fixed: 'right', toolbar: '#bar-sign' }
|
||
]],
|
||
toolbar: '#toolbar-sign',
|
||
defaultToolbar: ['filter', 'exports', 'print']
|
||
});
|
||
}
|
||
|
||
form.on('submit(save-base)', function () { save('保存成功'); return false; });
|
||
|
||
$(document).on('click', '[lay-filter="reload-sign"]', function () {
|
||
loadConfig();
|
||
layer.msg('刷新成功');
|
||
});
|
||
|
||
$(document).on('click', '[lay-filter="save-sign"]', function () { save('保存成功'); });
|
||
|
||
$(document).on('click', '[lay-filter="add-sign"]', function () {
|
||
var days = sign().days || [];
|
||
var max = days.length ? Math.max.apply(null, days.map(function (d) { return d.day || 0; })) : 0;
|
||
showDayEdit({ day: max + 1, name: '第' + (max + 1) + '天', icon: '', giftList: [] }, true, -1);
|
||
});
|
||
|
||
$(document).on('click', '[lay-filter="init-sign"]', function () {
|
||
if (window.parent && window.parent.$ && window.parent.layer) {
|
||
window.parent.$('.layui-layer-shade').remove();
|
||
window.parent.layer.closeAll();
|
||
}
|
||
layer.confirm('确定要从配置文件还原签到配置吗？', function (idx) {
|
||
layer.close(idx);
|
||
admin.req({
|
||
method: "get",
|
||
url: setter.baseurl + "adminapi/GameConfig/InitActivitySection/SignActivityConfig",
|
||
done: function (res) {
|
||
if (res.code === 0 || res.code === 200) {
|
||
layer.msg('初始化成功');
|
||
loadConfig();
|
||
} else {
|
||
layer.msg(res.info || '初始化失败');
|
||
}
|
||
},
|
||
fail: function (res) {
|
||
layer.msg(res.info || '初始化失败');
|
||
}
|
||
});
|
||
});
|
||
});
|
||
|
||
window.previewImage = function (url) {
|
||
layer.open({
|
||
type: 1,
|
||
title: '图片预览',
|
||
area: ['auto', 'auto'],
|
||
shadeClose: true,
|
||
content: '<div style="padding:20px;text-align:center;"><img src="' + url + '" style="max-width:400px;max-height:400px;border-radius:8px;"></div>'
|
||
});
|
||
};
|
||
|
||
table.on('tool(table-sign)', function (obj) {
|
||
var data = obj.data;
|
||
var days = sign().days || [];
|
||
var idx = days.findIndex(function (x) { return x.day === data.day; });
|
||
if (idx < 0) return;
|
||
|
||
if (obj.event === 'edit') {
|
||
showDayEdit(days[idx], false, idx);
|
||
} else if (obj.event === 'del') {
|
||
layer.confirm('确定删除第' + data.day + '天配置吗？', function (i) {
|
||
days.splice(idx, 1);
|
||
layer.close(i);
|
||
save('删除成功');
|
||
});
|
||
}
|
||
});
|
||
|
||
$(document).on('click', '[lay-filter="batchdel-sign"]', function () {
|
||
var checkData = table.checkStatus('table-sign').data;
|
||
if (checkData.length === 0) return layer.msg('请选择要删除的数据');
|
||
layer.confirm('确定删除选中 ' + checkData.length + ' 条数据吗？', function (idx) {
|
||
var daySet = checkData.map(function (item) { return item.day; });
|
||
var s = sign();
|
||
s.days = (s.days || []).filter(function (item) { return daySet.indexOf(item.day) < 0; });
|
||
layer.close(idx);
|
||
save('删除成功');
|
||
});
|
||
});
|
||
|
||
// ==================== 天数编辑弹窗（含奖励编辑） ====================
|
||
function giftRowHtml(g) {
|
||
g = g || { type: 1, count: 0, otherId: '' };
|
||
var oidStyle = g.type === 3 ? '' : 'display:none;';
|
||
return '<div class="gift-row">' +
|
||
'<select class="gr-type" style="width:90px;">' +
|
||
'<option value="1">金币</option><option value="2">钻石</option><option value="3">道具</option>' +
|
||
'</select>' +
|
||
'<input type="number" class="layui-input gr-count" placeholder="数量" value="' + (g.count || 0) + '">' +
|
||
'<input type="text" class="layui-input gr-oid" style="' + oidStyle + '" placeholder="道具编号" value="' + (g.otherId || '') + '">' +
|
||
'<button type="button" class="layui-btn layui-btn-sm layui-btn-danger gr-del">删除</button>' +
|
||
'</div>';
|
||
}
|
||
|
||
function bindGiftRows(container) {
|
||
container.off('change', '.gr-type').on('change', '.gr-type', function () {
|
||
var isProp = $(this).val() === '3';
|
||
$(this).closest('.gift-row').find('.gr-oid').toggle(isProp);
|
||
});
|
||
container.off('click', '.gr-del').on('click', '.gr-del', function () {
|
||
$(this).closest('.gift-row').remove();
|
||
});
|
||
container.off('click', '.gr-add').on('click', '.gr-add', function () {
|
||
container.find('#giftRows').append(giftRowHtml({ type: 1, count: 0, otherId: '' }));
|
||
});
|
||
}
|
||
|
||
function collectGiftRows(container) {
|
||
var list = [];
|
||
container.find('.gift-row').each(function () {
|
||
var t = parseInt($(this).find('.gr-type').val()) || 1;
|
||
var c = parseInt($(this).find('.gr-count').val()) || 0;
|
||
var oid = t === 3 ? ($(this).find('.gr-oid').val() || '') : '';
|
||
list.push({ type: t, count: c, otherId: oid });
|
||
});
|
||
return list;
|
||
}
|
||
|
||
function showDayEdit(data, isAdd, rowIndex) {
|
||
var imagePreviewHtml = data.icon
|
||
? '<img src="' + data.icon + '" style="max-width:100%;max-height:100%;">'
|
||
: '<div class="placeholder">点击上传</div>';
|
||
|
||
var rowsHtml = '';
|
||
(data.giftList || []).forEach(function (g) { rowsHtml += giftRowHtml(g); });
|
||
|
||
var html = '<div style="padding:20px;">' +
|
||
'<form class="layui-form">' +
|
||
'<div class="layui-form-item">' +
|
||
'<label class="layui-form-label">第几天</label>' +
|
||
'<div class="layui-input-block">' +
|
||
'<input type="number" name="day" value="' + (data.day || 1) + '" class="layui-input" ' + (isAdd ? '' : 'readonly') + '>' +
|
||
'</div>' +
|
||
'</div>' +
|
||
'<div class="layui-form-item">' +
|
||
'<label class="layui-form-label">名称</label>' +
|
||
'<div class="layui-input-block">' +
|
||
'<input type="text" name="name" value="' + (data.name || '') + '" class="layui-input">' +
|
||
'</div>' +
|
||
'</div>' +
|
||
'<div class="layui-form-item">' +
|
||
'<label class="layui-form-label">图标</label>' +
|
||
'<div class="layui-input-block">' +
|
||
'<div class="icon-upload-box">' +
|
||
'<div class="icon-upload-preview" id="iconPreview">' + imagePreviewHtml + '</div>' +
|
||
'<input type="file" class="upload-btn" accept="image/*" id="iconUpload">' +
|
||
'</div>' +
|
||
'<input type="hidden" name="icon" id="iconInput" value="' + (data.icon || '') + '">' +
|
||
'<div style="margin-top:8px;color:#999;font-size:12px;">点击图片可预览</div>' +
|
||
'</div>' +
|
||
'</div>' +
|
||
'<div class="layui-form-item">' +
|
||
'<label class="layui-form-label">奖励</label>' +
|
||
'<div class="layui-input-block">' +
|
||
'<div id="giftRows">' + rowsHtml + '</div>' +
|
||
'<button type="button" class="layui-btn layui-btn-sm layui-btn-normal gr-add" style="margin-top:6px;"><i class="layui-icon layui-icon-add-1"></i> 新增奖励</button>' +
|
||
'<div style="color:#999;font-size:12px;margin-top:4px;">类型选“道具”时需填写道具编号</div>' +
|
||
'</div>' +
|
||
'</div>' +
|
||
'</form>' +
|
||
'</div>';
|
||
|
||
layer.open({
|
||
type: 1,
|
||
title: isAdd ? '添加天数配置' : '编辑天数配置',
|
||
area: ['620px', '560px'],
|
||
content: html,
|
||
btn: ['保存', '取消'],
|
||
shadeClose: true,
|
||
success: function (layero) {
|
||
// 初始化每个奖励行的类型下拉
|
||
(data.giftList || []).forEach(function (g, i) {
|
||
var row = layero.find('.gift-row').eq(i);
|
||
row.find('.gr-type').val(g.type || 1);
|
||
row.find('.gr-oid').toggle((g.type || 1) === 3);
|
||
});
|
||
bindGiftRows(layero);
|
||
|
||
var $preview = layero.find('#iconPreview');
|
||
var $input = layero.find('#iconInput');
|
||
|
||
$preview.on('click', function () {
|
||
var url = $input.val();
|
||
if (url) previewImage(url);
|
||
});
|
||
|
||
layero.find('#iconUpload').on('change', function () {
|
||
var file = this.files[0];
|
||
if (!file) return;
|
||
var formData = new FormData();
|
||
formData.append('file', file);
|
||
$.ajax({
|
||
url: setter.baseurl + 'adminapi/ImageUpload/upload/temp',
|
||
type: 'POST',
|
||
data: formData,
|
||
processData: false,
|
||
contentType: false,
|
||
headers: { 'token': layui.data(setter.tableName)[setter.request.tokenName] },
|
||
success: function (res) {
|
||
if (res.code === 0 || res.code === 200) {
|
||
var path = res.data.path;
|
||
$input.val(path);
|
||
$preview.html('<img src="' + path + '" style="max-width:100%;max-height:100%;">');
|
||
layer.msg('上传成功');
|
||
} else {
|
||
layer.msg(res.info || '上传失败');
|
||
}
|
||
},
|
||
error: function () { layer.msg('上传失败'); }
|
||
});
|
||
});
|
||
},
|
||
yes: function (index, layero) {
|
||
var day = parseInt(layero.find('input[name="day"]').val()) || data.day;
|
||
if (day <= 0) { layer.msg('请填写正确的天数'); return; }
|
||
var item = {
|
||
day: day,
|
||
name: layero.find('input[name="name"]').val() || ('第' + day + '天'),
|
||
icon: layero.find('input[name="icon"]').val(),
|
||
giftList: collectGiftRows(layero)
|
||
};
|
||
var s = sign();
|
||
if (!s.days) s.days = [];
|
||
if (isAdd) {
|
||
if (s.days.some(function (x) { return x.day === item.day; })) { layer.msg('该天数已存在'); return; }
|
||
s.days.push(item);
|
||
} else if (rowIndex > -1) {
|
||
s.days[rowIndex] = item;
|
||
}
|
||
layer.close(index);
|
||
save(isAdd ? '添加成功' : '保存成功');
|
||
}
|
||
});
|
||
}
|
||
|
||
window.saveAct = function (n) { layui.admin.req({ method: 'get', url: (layui.setter.baseurl || '/') + 'adminapi/ActivityConfig/SaveSection/' + n, done: function (r) { layui.layer.msg(r.info || (r.code === 0 ? '保存成功' : '保存失败')) } }) }
|
||
|
||
loadConfig();
|
||
});
|
||
</script>
|