128 lines
6.8 KiB
HTML
128 lines
6.8 KiB
HTML
{include file="Public:header2"/}
|
|
|
|
<body>
|
|
<div class="layui-fluid">
|
|
<div class="layui-row layui-col-space15">
|
|
<div class="layui-col-md12">
|
|
<div class="layui-card">
|
|
<div class="layui-card-header">系统设置</div>
|
|
<div class="layui-card-body">
|
|
<form class="layui-form" action="" lay-filter="component-form-element">
|
|
<input type="hidden" name="key" value="{$key}">
|
|
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">盒子同步地址</label>
|
|
<div class="layui-input-block">
|
|
<div id="sync-addresses">
|
|
{if isset($data.sync_address) && is_array($data.sync_address)}
|
|
{foreach $data.sync_address as $index => $address}
|
|
<div class="sync-address-item">
|
|
<div class="layui-input-inline" style="width: 200px; margin-right: 10px;">
|
|
<input type="text" name="sync_address_names[]" value="{$address.name|default=''}" autocomplete="off" class="layui-input" placeholder="地址名称">
|
|
</div>
|
|
<div class="layui-input-inline" style="width: 450px; margin-right: 10px;">
|
|
<input type="text" name="sync_address_urls[]" value="{$address.sync_address|default=''}" autocomplete="off" class="layui-input" placeholder="请输入同步地址URL">
|
|
</div>
|
|
<button type="button" class="layui-btn layui-btn-danger remove-address">删除</button>
|
|
</div>
|
|
{/foreach}
|
|
{else}
|
|
<div class="sync-address-item">
|
|
<div class="layui-input-inline" style="width: 200px; margin-right: 10px;">
|
|
<input type="text" name="sync_address_names[]" value="" autocomplete="off" class="layui-input" placeholder="地址名称">
|
|
</div>
|
|
<div class="layui-input-inline" style="width: 450px; margin-right: 10px;">
|
|
<input type="text" name="sync_address_urls[]" value="" autocomplete="off" class="layui-input" placeholder="请输入同步地址URL">
|
|
</div>
|
|
<button type="button" class="layui-btn layui-btn-danger remove-address">删除</button>
|
|
</div>
|
|
{/if}
|
|
</div>
|
|
<div style="margin-top: 10px;">
|
|
<button type="button" class="layui-btn layui-btn-normal" id="add-address">添加地址</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
<div class="layui-input-block">
|
|
<button class="layui-btn" lay-submit lay-filter="component-form-element">提交</button>
|
|
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{include file="Public:footer"/}
|
|
|
|
<script>
|
|
layui.use(['form', 'layer'], function(){
|
|
var form = layui.form;
|
|
var layer = layui.layer;
|
|
|
|
// 添加地址按钮点击事件
|
|
$('#add-address').on('click', function(){
|
|
var newItem = '<div class="sync-address-item">' +
|
|
'<div class="layui-input-inline" style="width: 200px; margin-right: 10px;">' +
|
|
'<input type="text" name="sync_address_names[]" value="" autocomplete="off" class="layui-input" placeholder="地址名称">' +
|
|
'</div>' +
|
|
'<div class="layui-input-inline" style="width: 450px; margin-right: 10px;">' +
|
|
'<input type="text" name="sync_address_urls[]" value="" autocomplete="off" class="layui-input" placeholder="请输入同步地址URL">' +
|
|
'</div>' +
|
|
'<button type="button" class="layui-btn layui-btn-danger remove-address">删除</button>' +
|
|
'</div>';
|
|
$('#sync-addresses').append(newItem);
|
|
});
|
|
|
|
// 删除地址按钮点击事件（使用事件委托）
|
|
$(document).on('click', '.remove-address', function(){
|
|
// 如果只有一个地址项，则清空而不是删除
|
|
if($('.sync-address-item').length <= 1) {
|
|
$(this).closest('.sync-address-item').find('input').val('');
|
|
} else {
|
|
$(this).closest('.sync-address-item').remove();
|
|
}
|
|
return false; // 阻止表单提交
|
|
});
|
|
|
|
// 表单提交 - 不再在前端处理数据转换，交给后端处理
|
|
form.on('submit(component-form-element)', function(data){
|
|
var field = data.field;
|
|
|
|
// 提交到后台
|
|
$.ajax({
|
|
url: '{:url("/admin/update")}',
|
|
type: 'post',
|
|
data: field,
|
|
success: function(res){
|
|
if(res.status){
|
|
layer.msg(res.msg, {icon: 1});
|
|
}else{
|
|
layer.msg(res.msg, {icon: 2});
|
|
}
|
|
}
|
|
});
|
|
return false;
|
|
});
|
|
});
|
|
</script>
|
|
|
|
<style>
|
|
.sync-address-item {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: 10px;
|
|
}
|
|
.layui-form-label {
|
|
width: 120px;
|
|
}
|
|
.layui-input-block {
|
|
margin-left: 150px;
|
|
}
|
|
</style>
|
|
</body>
|
|
</html> |