5 changed files with 518 additions and 19 deletions
@ -0,0 +1,50 @@ |
|||||
|
namespace LTEMvcApp.Models |
||||
|
{ |
||||
|
/// <summary>
|
||||
|
/// 网络配置响应
|
||||
|
/// </summary>
|
||||
|
public class NetworkConfigResponse |
||||
|
{ |
||||
|
public List<NetworkConfig> Data { get; set; } = new(); |
||||
|
public bool IsSuccess { get; set; } |
||||
|
public string Message { get; set; } = string.Empty; |
||||
|
public string ErrorCode { get; set; } = string.Empty; |
||||
|
public int StatusCode { get; set; } |
||||
|
} |
||||
|
|
||||
|
/// <summary>
|
||||
|
/// 网络配置
|
||||
|
/// </summary>
|
||||
|
public class NetworkConfig |
||||
|
{ |
||||
|
/// <summary>
|
||||
|
/// 配置键
|
||||
|
/// </summary>
|
||||
|
public string ConfigKey { get; set; } = string.Empty; |
||||
|
|
||||
|
/// <summary>
|
||||
|
/// RAN配置路径
|
||||
|
/// </summary>
|
||||
|
public string RagConfig { get; set; } = string.Empty; |
||||
|
|
||||
|
/// <summary>
|
||||
|
/// 核心或IMS配置
|
||||
|
/// </summary>
|
||||
|
public List<object> CoreOrImsConfigs { get; set; } = new(); |
||||
|
|
||||
|
/// <summary>
|
||||
|
/// APN
|
||||
|
/// </summary>
|
||||
|
public string Apn { get; set; } = string.Empty; |
||||
|
|
||||
|
/// <summary>
|
||||
|
/// 频段列表
|
||||
|
/// </summary>
|
||||
|
public List<string> Band { get; set; } = new(); |
||||
|
|
||||
|
/// <summary>
|
||||
|
/// 注释
|
||||
|
/// </summary>
|
||||
|
public string Comment { get; set; } = string.Empty; |
||||
|
} |
||||
|
} |
@ -0,0 +1,160 @@ |
|||||
|
@{ |
||||
|
ViewData["Title"] = "网络配置管理"; |
||||
|
var ip = Context.Request.Query["ip"].ToString(); |
||||
|
var port = Context.Request.Query["port"].ToString(); |
||||
|
} |
||||
|
|
||||
|
<div class="container mt-4"> |
||||
|
<h2>网络配置管理 <span class="text-info">@ip:@port</span></h2> |
||||
|
<div class="row mb-3"> |
||||
|
<div class="col-md-4"> |
||||
|
<button class="btn btn-success" onclick="showAddConfigModal()"> |
||||
|
<i class="fas fa-plus"></i> 添加网络配置 |
||||
|
</button> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div id="configTableContainer"> |
||||
|
<!-- 配置表格将由JS动态填充 --> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<!-- 添加配置模态框 --> |
||||
|
<div class="modal fade" id="addConfigModal" tabindex="-1" role="dialog" aria-labelledby="addConfigModalLabel" aria-hidden="true"> |
||||
|
<div class="modal-dialog" role="document"> |
||||
|
<div class="modal-content"> |
||||
|
<div class="modal-header"> |
||||
|
<h5 class="modal-title" id="addConfigModalLabel">添加网络配置</h5> |
||||
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> |
||||
|
<span aria-hidden="true">×</span> |
||||
|
</button> |
||||
|
</div> |
||||
|
<div class="modal-body"> |
||||
|
<form id="addConfigForm"> |
||||
|
<div class="form-group"> |
||||
|
<label>Key</label> |
||||
|
<input type="text" class="form-control" name="configKey" required /> |
||||
|
</div> |
||||
|
<div class="form-group"> |
||||
|
<label>RagConfig</label> |
||||
|
<input type="text" class="form-control" name="ragConfig" /> |
||||
|
</div> |
||||
|
<div class="form-group"> |
||||
|
<label>APN</label> |
||||
|
<input type="text" class="form-control" name="apn" /> |
||||
|
</div> |
||||
|
<div class="form-group"> |
||||
|
<label>Band(逗号分隔)</label> |
||||
|
<input type="text" class="form-control" name="band" /> |
||||
|
</div> |
||||
|
<div class="form-group"> |
||||
|
<label>Comment</label> |
||||
|
<input type="text" class="form-control" name="comment" /> |
||||
|
</div> |
||||
|
<!-- coreOrImsConfigs 可扩展为复杂表单,这里先省略 --> |
||||
|
</form> |
||||
|
</div> |
||||
|
<div class="modal-footer"> |
||||
|
<button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button> |
||||
|
<button type="button" class="btn btn-primary" onclick="submitAddConfig()">添加</button> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
@section Scripts { |
||||
|
<script> |
||||
|
const ip = '@ip'; |
||||
|
const port = '@port'; |
||||
|
|
||||
|
$(function() { |
||||
|
loadNetworkConfigs(); |
||||
|
}); |
||||
|
|
||||
|
function loadNetworkConfigs() { |
||||
|
if (!ip || !port) { |
||||
|
$('#configTableContainer').html('<div class="alert alert-info">未指定Agent</div>'); |
||||
|
return; |
||||
|
} |
||||
|
$.ajax({ |
||||
|
url: '/api/ipgroup/network-config', |
||||
|
type: 'GET', |
||||
|
data: { ip, port }, |
||||
|
success: function(res) { |
||||
|
if (res.isSuccess && res.data) { |
||||
|
renderConfigTable(res.data); |
||||
|
} else { |
||||
|
$('#configTableContainer').html('<div class="alert alert-warning">加载失败</div>'); |
||||
|
} |
||||
|
}, |
||||
|
error: function() { |
||||
|
$('#configTableContainer').html('<div class="alert alert-danger">加载失败</div>'); |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
function renderConfigTable(data) { |
||||
|
let html = `<table class="table table-bordered"><thead><tr> |
||||
|
<th>Key</th><th>APN</th><th>Band</th><th>Comment</th><th>操作</th> |
||||
|
</tr></thead><tbody>`; |
||||
|
if (data.length === 0) { |
||||
|
html += '<tr><td colspan="5" class="text-center">暂无数据</td></tr>'; |
||||
|
} else { |
||||
|
data.forEach(item => { |
||||
|
html += `<tr> |
||||
|
<td>${item.configKey}</td> |
||||
|
<td>${item.apn || ''}</td> |
||||
|
<td>${item.band ? item.band.join(',') : ''}</td> |
||||
|
<td>${item.comment || ''}</td> |
||||
|
<td><button class="btn btn-danger btn-sm" onclick="deleteConfig('${item.configKey}')"><i class='fas fa-trash'></i> 删除</button></td> |
||||
|
</tr>`; |
||||
|
}); |
||||
|
} |
||||
|
html += '</tbody></table>'; |
||||
|
$('#configTableContainer').html(html); |
||||
|
} |
||||
|
|
||||
|
function showAddConfigModal() { |
||||
|
$('#addConfigForm')[0].reset(); |
||||
|
$('#addConfigModal').modal('show'); |
||||
|
} |
||||
|
|
||||
|
function submitAddConfig() { |
||||
|
const form = $('#addConfigForm'); |
||||
|
const data = { |
||||
|
configKey: form.find('[name="configKey"]').val(), |
||||
|
ragConfig: form.find('[name="ragConfig"]').val(), |
||||
|
apn: form.find('[name="apn"]').val(), |
||||
|
band: form.find('[name="band"]').val().split(',').map(x => x.trim()).filter(x => x), |
||||
|
comment: form.find('[name="comment"]').val(), |
||||
|
coreOrImsConfigs: [] // 可扩展 |
||||
|
}; |
||||
|
$.ajax({ |
||||
|
url: `/api/ipgroup/network-config?ip=${ip}&port=${port}`, |
||||
|
type: 'POST', |
||||
|
contentType: 'application/json', |
||||
|
data: JSON.stringify(data), |
||||
|
success: function(res) { |
||||
|
$('#addConfigModal').modal('hide'); |
||||
|
loadNetworkConfigs(); |
||||
|
}, |
||||
|
error: function() { |
||||
|
alert('添加失败'); |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
function deleteConfig(configKey) { |
||||
|
if (!confirm('确定要删除该配置吗?')) return; |
||||
|
$.ajax({ |
||||
|
url: `/api/ipgroup/network-config/${encodeURIComponent(configKey)}?ip=${ip}&port=${port}`, |
||||
|
type: 'DELETE', |
||||
|
success: function() { |
||||
|
loadNetworkConfigs(); |
||||
|
}, |
||||
|
error: function() { |
||||
|
alert('删除失败'); |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
</script> |
||||
|
} |
Loading…
Reference in new issue