379 lines
17 KiB
HTML
379 lines
17 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-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="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" lay-filter="add-sign">添加</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('SignConfigs')"><i class="layui-icon layui-icon-export"></i> 保存到初始化文件</button>
|
||
|
|
</div>
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<script type="text/html" id="table-operate">
|
||
|
|
<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-xs" lay-event="preview"><i class="layui-icon layui-icon-search"></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; }
|
||
|
|
</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;
|
||
|
|
|
||
|
|
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 loadConfig() {
|
||
|
|
admin.req({
|
||
|
|
method: "get",
|
||
|
|
url: setter.baseurl + "adminapi/ActivityConfig/Get",
|
||
|
|
done: function (res) {
|
||
|
|
if (res.code === 0 && res.data) {
|
||
|
|
activityConfig = res.data;
|
||
|
|
renderTable();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
function renderTable() {
|
||
|
|
table.render({
|
||
|
|
elem: '#table-sign',
|
||
|
|
data: activityConfig ? activityConfig.signConfigs || [] : [],
|
||
|
|
cols: [[
|
||
|
|
{ type: 'checkbox', fixed: 'left' },
|
||
|
|
{ field: "order", title: "排序", width: 70, edit: 'text' },
|
||
|
|
{ field: "name", title: "名称", width: 100, edit: 'text' },
|
||
|
|
{ field: "gold", title: "金币", width: 100, edit: 'text' },
|
||
|
|
{ field: "probability", title: "概率", width: 100, edit: 'text' },
|
||
|
|
{ field: "icon", title: "图标", width: 100, templet: '#tpl-icon' },
|
||
|
|
{ title: "操作", width: 180, fixed: 'right', toolbar: '#table-operate' }
|
||
|
|
]],
|
||
|
|
toolbar: '#toolbar-sign',
|
||
|
|
defaultToolbar: ['filter', 'exports', 'print']
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
function initConfig() {
|
||
|
|
layer.confirm('确定要从配置文件还原签到配置吗？', function(idx) {
|
||
|
|
layer.close(idx);
|
||
|
|
admin.req({
|
||
|
|
method: "get",
|
||
|
|
url: setter.baseurl + "adminapi/GameConfig/InitActivitySection/SignConfigs",
|
||
|
|
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 || '初始化失败');
|
||
|
|
}
|
||
|
|
});
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
$(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();
|
||
|
|
}
|
||
|
|
initConfig();
|
||
|
|
});
|
||
|
|
|
||
|
|
$(document).on('click', '[lay-filter="reload-sign"]', function() {
|
||
|
|
loadConfig();
|
||
|
|
layer.msg('刷新成功');
|
||
|
|
});
|
||
|
|
|
||
|
|
$(document).on('click', '[lay-filter="save-sign"]', function() {
|
||
|
|
if (window.parent && window.parent.$ && window.parent.layer) {
|
||
|
|
window.parent.$('.layui-layer-shade').remove();
|
||
|
|
window.parent.layer.closeAll();
|
||
|
|
}
|
||
|
|
admin.req({
|
||
|
|
method: "post",
|
||
|
|
contentType: "application/json;charset=UTF-8",
|
||
|
|
url: setter.baseurl + "adminapi/ActivityConfig/UpdateSign",
|
||
|
|
data: JSON.stringify(activityConfig.signConfigs || []),
|
||
|
|
done: function (res) {
|
||
|
|
if (res.code === 0 || res.code === 200) {
|
||
|
|
layer.msg('保存成功');
|
||
|
|
loadConfig();
|
||
|
|
} else {
|
||
|
|
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>'
|
||
|
|
});
|
||
|
|
};
|
||
|
|
|
||
|
|
function updateDataByTable(obj) {
|
||
|
|
var field = obj.field;
|
||
|
|
var value = obj.value;
|
||
|
|
var data = obj.data;
|
||
|
|
|
||
|
|
if (field === 'gold') {
|
||
|
|
data[field] = parseInt(value) || 0;
|
||
|
|
} else if (field === 'probability') {
|
||
|
|
data[field] = parseFloat(value) || 0;
|
||
|
|
} else {
|
||
|
|
data[field] = value;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
table.on('edit(table-sign)', function(obj){
|
||
|
|
updateDataByTable(obj);
|
||
|
|
});
|
||
|
|
|
||
|
|
table.on('tool(table-sign)', function(obj) {
|
||
|
|
var data = obj.data;
|
||
|
|
var trIndex = activityConfig && activityConfig.signConfigs
|
||
|
|
? activityConfig.signConfigs.findIndex(function(x) { return x.order === data.order; }) : -1;
|
||
|
|
|
||
|
|
if (obj.event === 'edit') {
|
||
|
|
showEditDialog(trIndex > -1 ? activityConfig.signConfigs[trIndex] : data, false, trIndex);
|
||
|
|
} else if (obj.event === 'del') {
|
||
|
|
layer.confirm('确定删除该配置吗？', function(idx) {
|
||
|
|
if (trIndex >= 0 && activityConfig && activityConfig.signConfigs) {
|
||
|
|
activityConfig.signConfigs.splice(trIndex, 1);
|
||
|
|
}
|
||
|
|
obj.del();
|
||
|
|
layer.close(idx);
|
||
|
|
});
|
||
|
|
} else if (obj.event === 'preview') {
|
||
|
|
if (data.icon) {
|
||
|
|
previewImage(data.icon);
|
||
|
|
} else {
|
||
|
|
layer.msg('暂无图片');
|
||
|
|
}
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
function showAddDialog() {
|
||
|
|
var newData = {
|
||
|
|
order: 0,
|
||
|
|
name: '',
|
||
|
|
gold: 0,
|
||
|
|
probability: 0,
|
||
|
|
icon: ''
|
||
|
|
};
|
||
|
|
showEditDialog(newData, true);
|
||
|
|
}
|
||
|
|
|
||
|
|
$(document).on('click', '[lay-filter="add-sign"]', function() {
|
||
|
|
showAddDialog();
|
||
|
|
});
|
||
|
|
|
||
|
|
function showEditDialog(data, isAdd, rowIndex) {
|
||
|
|
var dialogTitle = isAdd ? '添加签到配置' : '编辑签到配置';
|
||
|
|
var imagePreviewHtml = data.icon
|
||
|
|
? '<img src="' + data.icon + '" style="max-width:100%;max-height:100%;">'
|
||
|
|
: '<div class="placeholder">点击上传</div>';
|
||
|
|
|
||
|
|
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="order" value="' + (data.order || 0) + '" class="layui-input">' +
|
||
|
|
'</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">' +
|
||
|
|
'<input type="number" name="gold" value="' + (data.gold || 0) + '" class="layui-input">' +
|
||
|
|
'</div>' +
|
||
|
|
'</div>' +
|
||
|
|
'<div class="layui-form-item">' +
|
||
|
|
'<label class="layui-form-label">概率</label>' +
|
||
|
|
'<div class="layui-input-block">' +
|
||
|
|
'<input type="number" name="probability" value="' + (data.probability || 0) + '" 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/png" id="iconUpload">' +
|
||
|
|
'</div>' +
|
||
|
|
'<input type="hidden" name="icon" id="iconInput" value="' + (data.icon || '') + '">' +
|
||
|
|
'<div style="margin-top:8px;color:#999;font-size:12px;">点击图片可预览，仅支持 PNG 格式</div>' +
|
||
|
|
'</div>' +
|
||
|
|
'</div>' +
|
||
|
|
'</form>' +
|
||
|
|
'</div>';
|
||
|
|
|
||
|
|
layer.open({
|
||
|
|
type: 1,
|
||
|
|
title: dialogTitle,
|
||
|
|
area: ['600px', '500px'],
|
||
|
|
content: html,
|
||
|
|
btn: ['保存', '取消'],
|
||
|
|
shadeClose: true,
|
||
|
|
success: function(layero) {
|
||
|
|
var $preview = layero.find('#iconPreview');
|
||
|
|
var $input = layero.find('#iconInput');
|
||
|
|
var $fileInput = layero.find('#iconUpload');
|
||
|
|
|
||
|
|
$preview.on('click', function() {
|
||
|
|
var url = $input.val();
|
||
|
|
if (url) {
|
||
|
|
previewImage(url);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
$fileInput.on('change', function() {
|
||
|
|
var file = this.files[0];
|
||
|
|
if (file) {
|
||
|
|
var order = layero.find('input[name="order"]').val();
|
||
|
|
if (!order && isAdd) {
|
||
|
|
layer.msg('请先填写排序编号');
|
||
|
|
$(this).val('');
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
var formData = new FormData();
|
||
|
|
formData.append('file', file);
|
||
|
|
formData.append('number', order);
|
||
|
|
|
||
|
|
$.ajax({
|
||
|
|
url: setter.baseurl + 'adminapi/ImageUpload/upload/config',
|
||
|
|
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) {
|
||
|
|
if (isAdd) {
|
||
|
|
var newItem = {
|
||
|
|
order: parseInt(layero.find('input[name="order"]').val()) || 0,
|
||
|
|
name: layero.find('input[name="name"]').val(),
|
||
|
|
gold: parseInt(layero.find('input[name="gold"]').val()) || 0,
|
||
|
|
probability: parseFloat(layero.find('input[name="probability"]').val()) || 0,
|
||
|
|
icon: layero.find('input[name="icon"]').val()
|
||
|
|
};
|
||
|
|
if (!activityConfig.signConfigs) activityConfig.signConfigs = [];
|
||
|
|
activityConfig.signConfigs.unshift(newItem);
|
||
|
|
} else if (rowIndex > -1) {
|
||
|
|
var original = activityConfig.signConfigs[rowIndex];
|
||
|
|
original.order = parseInt(layero.find('input[name="order"]').val()) || 0;
|
||
|
|
original.name = layero.find('input[name="name"]').val();
|
||
|
|
original.gold = parseInt(layero.find('input[name="gold"]').val()) || 0;
|
||
|
|
original.probability = parseFloat(layero.find('input[name="probability"]').val()) || 0;
|
||
|
|
original.icon = layero.find('input[name="icon"]').val();
|
||
|
|
}
|
||
|
|
layer.close(index);
|
||
|
|
table.reload('table-sign', {
|
||
|
|
data: activityConfig.signConfigs || []
|
||
|
|
});
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
$(document).on('click', '[lay-filter="batchdel-sign"]', function() {
|
||
|
|
var checkStatus = table.checkStatus('table-sign');
|
||
|
|
var checkData = checkStatus.data;
|
||
|
|
if (checkData.length === 0) {
|
||
|
|
return layer.msg('请选择要删除的数据');
|
||
|
|
}
|
||
|
|
layer.confirm('确定删除选中 ' + checkData.length + ' 条数据吗？', function(idx) {
|
||
|
|
var orders = checkData.map(function(item) { return item.order; });
|
||
|
|
if (activityConfig && activityConfig.signConfigs) {
|
||
|
|
activityConfig.signConfigs = activityConfig.signConfigs.filter(function(item) {
|
||
|
|
return !orders.includes(item.order);
|
||
|
|
});
|
||
|
|
}
|
||
|
|
renderTable();
|
||
|
|
layer.close(idx);
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
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>
|