198 lines
9.0 KiB
HTML
198 lines
9.0 KiB
HTML
|
|
<title>鱼雷配置</title>
|
|
|
|
<style>
|
|
.torpedo-item { border: 1px solid #ddd; padding: 15px; margin: 15px 0; border-radius: 4px; background: #fafafa; }
|
|
.torpedo-item .item-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
|
|
.torpedo-item .item-header .item-title { font-weight: bold; font-size: 14px; }
|
|
.torpedo-item table { width: 100%; border-collapse: collapse; margin-top: 10px; }
|
|
.torpedo-item table th, .torpedo-item table td { border: 1px solid #ddd; padding: 8px; text-align: center; }
|
|
.torpedo-item table th { background: #e6e6e6; font-weight: bold; }
|
|
.torpedo-item .param-row input { width: 100px; text-align: center; }
|
|
</style>
|
|
|
|
<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 class="layui-btn-container">
|
|
<button class="layui-btn layui-btn-sm layui-btn-normal" lay-filter="init-torpedo"><i class="layui-icon layui-icon-refresh"></i> 初始化配置</button>
|
|
<button class="layui-btn layui-btn-sm" lay-filter="save-torpedo"><i class="layui-icon layui-icon-ok"></i> 保存配置</button>
|
|
<button class="layui-btn layui-btn-sm layui-btn-warm" lay-filter="add-torpedo"><i class="layui-icon layui-icon-addition"></i> 添加鱼雷</button>
|
|
</div>
|
|
</div>
|
|
<div class="layui-card-body">
|
|
<div id="torpedo-list"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
layui.use(['admin', 'form'], function() {
|
|
var $ = layui.$;
|
|
var admin = layui.admin;
|
|
var form = layui.form;
|
|
var layer = layui.layer;
|
|
var setter = layui.setter;
|
|
var gameConfig = {};
|
|
var torpedoListCache = [];
|
|
var propList = [];
|
|
|
|
function escapeHtml(value) {
|
|
return $('<div>').text(value == null ? '' : String(value)).html();
|
|
}
|
|
|
|
function loadConfig() {
|
|
admin.req({
|
|
method: 'get',
|
|
url: setter.baseurl + 'adminapi/GameConfig',
|
|
done: function(res) {
|
|
if ((res.code !== 0 && res.code !== 200) || !res.data) {
|
|
layer.msg(res.info || '鱼雷配置加载失败');
|
|
return;
|
|
}
|
|
gameConfig = res.data;
|
|
torpedoListCache = gameConfig.torpedoConfigs || [];
|
|
propList = (gameConfig.propConfig || []).filter(function(prop) {
|
|
return Number(prop.type) === 13;
|
|
});
|
|
renderTorpedoList();
|
|
}
|
|
});
|
|
}
|
|
|
|
function renderTorpedoList() {
|
|
var html = '';
|
|
torpedoListCache.forEach(function(item, index) {
|
|
item.rewardRanges = item.rewardRanges || [];
|
|
var options = '<option value="">请选择鱼雷道具</option>';
|
|
var found = false;
|
|
propList.forEach(function(prop) {
|
|
var selected = String(prop.number) === String(item.number);
|
|
if (selected) found = true;
|
|
options += '<option value="' + escapeHtml(prop.number) + '"' + (selected ? ' selected' : '') + '>' +
|
|
escapeHtml(prop.number + ' - ' + prop.name) + '</option>';
|
|
});
|
|
if (item.number && !found) {
|
|
options += '<option value="' + escapeHtml(item.number) + '" selected>' +
|
|
escapeHtml(item.number + ' - ' + (item.name || '道具表未找到')) + '</option>';
|
|
}
|
|
|
|
html += '<div class="torpedo-item" data-index="' + index + '">';
|
|
html += '<div class="item-header">';
|
|
html += '<span class="item-title">' + escapeHtml(item.name || '未选择鱼雷') + ' (' + escapeHtml(item.number || '') + ')</span>';
|
|
html += '<button type="button" class="layui-btn layui-btn-xs layui-btn-danger js-remove-torpedo" data-index="' + index + '"><i class="layui-icon layui-icon-delete"></i> 删除</button>';
|
|
html += '</div>';
|
|
html += '<div class="layui-form" style="margin-bottom:10px;max-width:460px">';
|
|
html += '<label style="display:inline-block;margin-right:10px">鱼雷道具:</label>';
|
|
html += '<div style="display:inline-block;width:320px;vertical-align:middle"><select class="js-torpedo-prop" data-index="' + index + '" lay-search>' + options + '</select></div>';
|
|
html += '</div>';
|
|
html += '<table><thead><tr><th>最小金币</th><th>最大金币</th><th>权重</th><th>操作</th></tr></thead><tbody>';
|
|
item.rewardRanges.forEach(function(range, ri) {
|
|
html += '<tr>';
|
|
html += '<td><input type="number" class="layui-input param-row js-reward-field" value="' + (range.minGold || 0) + '" data-index="' + index + '" data-ri="' + ri + '" data-field="minGold" /></td>';
|
|
html += '<td><input type="number" class="layui-input param-row js-reward-field" value="' + (range.maxGold || 0) + '" data-index="' + index + '" data-ri="' + ri + '" data-field="maxGold" /></td>';
|
|
html += '<td><input type="number" class="layui-input param-row js-reward-field" value="' + (range.weight || 0) + '" data-index="' + index + '" data-ri="' + ri + '" data-field="weight" /></td>';
|
|
html += '<td><button type="button" class="layui-btn layui-btn-xs layui-btn-danger js-remove-reward" data-index="' + index + '" data-ri="' + ri + '">删除</button></td>';
|
|
html += '</tr>';
|
|
});
|
|
html += '</tbody></table>';
|
|
html += '<button type="button" class="layui-btn layui-btn-xs layui-btn-warm js-add-reward" data-index="' + index + '" style="margin-top:8px"><i class="layui-icon layui-icon-addition"></i> 添加奖励区间</button>';
|
|
html += '</div>';
|
|
});
|
|
if (torpedoListCache.length === 0) {
|
|
html = '<div style="text-align:center;color:#999;padding:40px">暂无鱼雷配置，点击“添加鱼雷”开始配置</div>';
|
|
}
|
|
$('#torpedo-list').html(html);
|
|
form.render('select');
|
|
}
|
|
|
|
$(document).off('.torpedoConfig');
|
|
|
|
$(document).on('change.torpedoConfig', '.js-torpedo-prop', function() {
|
|
var index = Number($(this).data('index'));
|
|
var number = String($(this).val() || '');
|
|
var prop = propList.find(function(p) { return String(p.number) === number; });
|
|
torpedoListCache[index].number = number;
|
|
torpedoListCache[index].name = prop ? prop.name : '';
|
|
renderTorpedoList();
|
|
});
|
|
|
|
$(document).on('change.torpedoConfig', '.js-reward-field', function() {
|
|
var index = Number($(this).data('index'));
|
|
var rewardIndex = Number($(this).data('ri'));
|
|
var field = $(this).data('field');
|
|
torpedoListCache[index].rewardRanges[rewardIndex][field] = parseInt($(this).val(), 10) || 0;
|
|
});
|
|
|
|
$(document).on('click.torpedoConfig', '.js-add-reward', function() {
|
|
var index = Number($(this).data('index'));
|
|
torpedoListCache[index].rewardRanges.push({ minGold: 0, maxGold: 0, weight: 1 });
|
|
renderTorpedoList();
|
|
});
|
|
|
|
$(document).on('click.torpedoConfig', '.js-remove-reward', function() {
|
|
var index = Number($(this).data('index'));
|
|
var rewardIndex = Number($(this).data('ri'));
|
|
torpedoListCache[index].rewardRanges.splice(rewardIndex, 1);
|
|
renderTorpedoList();
|
|
});
|
|
|
|
$(document).on('click.torpedoConfig', '.js-remove-torpedo', function() {
|
|
torpedoListCache.splice(Number($(this).data('index')), 1);
|
|
renderTorpedoList();
|
|
});
|
|
|
|
loadConfig();
|
|
|
|
$(document).on('click.torpedoConfig', '[lay-filter="init-torpedo"]', function() {
|
|
admin.req({
|
|
method: "get",
|
|
url: setter.baseurl + "adminapi/GameConfig/InitSection/TorpedoConfigs",
|
|
done: function(res) {
|
|
layer.msg(res.info || '初始化成功');
|
|
loadConfig();
|
|
}
|
|
});
|
|
});
|
|
|
|
$(document).on('click.torpedoConfig', '[lay-filter="save-torpedo"]', function() {
|
|
gameConfig.torpedoConfigs = torpedoListCache;
|
|
admin.req({
|
|
method: "post",
|
|
contentType: "application/json;charset=UTF-8",
|
|
url: setter.baseurl + "adminapi/GameConfig/Update",
|
|
data: JSON.stringify(gameConfig),
|
|
done: function(res) {
|
|
if (res.code === 0 || res.code === 200) {
|
|
layer.msg('保存成功');
|
|
loadConfig();
|
|
} else {
|
|
layer.msg(res.info || '保存失败');
|
|
}
|
|
}
|
|
});
|
|
});
|
|
|
|
$(document).on('click.torpedoConfig', '[lay-filter="add-torpedo"]', function() {
|
|
torpedoListCache.push({
|
|
number: '',
|
|
name: '',
|
|
color: '',
|
|
rewardRanges: [
|
|
{ minGold: 10000, maxGold: 30000, weight: 100 },
|
|
{ minGold: 30001, maxGold: 100000, weight: 20 }
|
|
]
|
|
});
|
|
renderTorpedoList();
|
|
});
|
|
});
|
|
</script>
|