249 lines
11 KiB
HTML
249 lines
11 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>参数配置 - 车主信息查询系统</title>
|
|
<!-- 引入Layui CSS -->
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/layui.css') }}">
|
|
<!-- 引入Font Awesome -->
|
|
<link href="{{ url_for('static', filename='css/font-awesome.min.css') }}" rel="stylesheet">
|
|
<!-- 引入自定义CSS -->
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/custom.css') }}">
|
|
|
|
<!-- 引入Layui JS -->
|
|
<script src="{{ url_for('static', filename='layui.js') }}"></script>
|
|
</head>
|
|
<body>
|
|
{% include 'header.html' %}
|
|
|
|
<!-- 主要内容区域 -->
|
|
<div class="content-container">
|
|
<div class="content-wrapper">
|
|
<!-- 参数配置卡片 -->
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<i class="fa fa-cog"></i> 参数配置
|
|
<a href="{{ url_for('query') }}" class="layui-btn layui-btn-xs layui-btn-primary" style="float: right;">
|
|
<i class="fa fa-arrow-left"></i> 返回主页面
|
|
</a>
|
|
</div>
|
|
<div class="card-body">
|
|
<!-- 消息提示区域 -->
|
|
{% if error %}
|
|
<div class="layui-bg-red message-box">
|
|
<i class="fa fa-exclamation-circle"></i> {{ error }}
|
|
</div>
|
|
{% endif %}
|
|
{% if success %}
|
|
<div class="layui-bg-green message-box">
|
|
<i class="fa fa-check-circle"></i> {{ success }}
|
|
</div>
|
|
{% endif %}
|
|
|
|
<div class="layui-text" style="text-align: center; margin-bottom: 20px;">
|
|
<div style="width: 80px; height: 80px; background-color: #f2f2f2; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; margin-bottom: 15px;">
|
|
<i class="fa fa-cogs" style="font-size: 40px; color: #009688;"></i>
|
|
</div>
|
|
<p style="color: #666;">请设置和管理系统参数配置</p>
|
|
</div>
|
|
|
|
<!-- 表单区域 -->
|
|
<div class="layui-form" id="parameterForm" style="max-width: 600px; margin: 0 auto;">
|
|
<div class="message-box" id="updateTimeAlert" style="display: none; justify-content: center; margin-bottom: 15px;">
|
|
<i class="fa fa-info-circle"></i>
|
|
<span id="updateTimeContent"></span>
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">参数1 <span class="layui-form-must">*</span></label>
|
|
<div class="layui-input-block">
|
|
<input type="text" id="param1" name="param1" required lay-verify="required" placeholder="请输入参数1的值" autocomplete="off" class="layui-input">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">参数2</label>
|
|
<div class="layui-input-block">
|
|
<input type="text" id="param2" name="param2" placeholder="请输入参数2的值" autocomplete="off" class="layui-input">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">参数3</label>
|
|
<div class="layui-input-block">
|
|
<input type="text" id="param3" name="param3" placeholder="请输入参数3的值" autocomplete="off" class="layui-input">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">参数4</label>
|
|
<div class="layui-input-block">
|
|
<input type="text" id="param4" name="param4" placeholder="请输入参数4的值" autocomplete="off" class="layui-input">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">参数5</label>
|
|
<div class="layui-input-block">
|
|
<input type="text" id="param5" name="param5" placeholder="请输入参数5的值" autocomplete="off" class="layui-input">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
<div class="layui-input-block">
|
|
<button class="layui-btn layui-btn-primary" id="reloadButton">
|
|
<i class="fa fa-refresh mr-1"></i> 重新加载
|
|
</button>
|
|
<button class="layui-btn layui-btn-normal" id="saveButton" lay-submit lay-filter="saveConfig">
|
|
<i class="fa fa-save mr-1"></i> 保存配置
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
layui.use(['form', 'layer'], function(){
|
|
var form = layui.form;
|
|
var layer = layui.layer;
|
|
|
|
// 页面加载时获取参数配置
|
|
loadParameterConfig();
|
|
|
|
// 重新加载按钮点击事件
|
|
document.getElementById('reloadButton').addEventListener('click', function() {
|
|
loadParameterConfig();
|
|
});
|
|
|
|
// 表单提交
|
|
form.on('submit(saveConfig)', function() {
|
|
// 添加加载状态
|
|
var saveButton = document.getElementById('saveButton');
|
|
var originalText = saveButton.innerHTML;
|
|
|
|
saveButton.disabled = true;
|
|
saveButton.innerHTML = '<i class="fa fa-spinner fa-spin mr-1"></i> 保存中...';
|
|
|
|
// 表单验证
|
|
if (!document.getElementById('param1').value.trim()) {
|
|
showErrorMessage('参数1不能为空');
|
|
saveButton.disabled = false;
|
|
saveButton.innerHTML = originalText;
|
|
return false;
|
|
}
|
|
|
|
const formData = {
|
|
param1: document.getElementById('param1').value.trim(),
|
|
param2: document.getElementById('param2').value.trim(),
|
|
param3: document.getElementById('param3').value.trim(),
|
|
param4: document.getElementById('param4').value.trim(),
|
|
param5: document.getElementById('param5').value.trim()
|
|
};
|
|
|
|
fetch('/save_parameter_config', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json'
|
|
},
|
|
body: JSON.stringify(formData)
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
// 恢复按钮状态
|
|
saveButton.disabled = false;
|
|
saveButton.innerHTML = originalText;
|
|
|
|
if (data.success) {
|
|
showSuccessMessage('参数配置保存成功');
|
|
// 重新加载参数配置
|
|
loadParameterConfig();
|
|
} else {
|
|
showErrorMessage('保存参数配置失败：' + (data.error || ''));
|
|
}
|
|
})
|
|
.catch(error => {
|
|
// 恢复按钮状态
|
|
saveButton.disabled = false;
|
|
saveButton.innerHTML = originalText;
|
|
|
|
let errorMessage = '保存参数配置失败，请稍后重试';
|
|
if (error.responseJSON && error.responseJSON.error) {
|
|
errorMessage = error.responseJSON.error;
|
|
}
|
|
showErrorMessage(errorMessage);
|
|
console.error('保存参数配置失败', error);
|
|
});
|
|
|
|
return false; // 阻止表单默认提交
|
|
});
|
|
|
|
// 加载参数配置
|
|
function loadParameterConfig() {
|
|
// 添加加载状态
|
|
var reloadButton = document.getElementById('reloadButton');
|
|
var originalText = reloadButton.innerHTML;
|
|
|
|
reloadButton.disabled = true;
|
|
reloadButton.innerHTML = '<i class="fa fa-spinner fa-spin mr-1"></i> 加载中...';
|
|
|
|
fetch('/get_parameter_config')
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
// 恢复按钮状态
|
|
reloadButton.disabled = false;
|
|
reloadButton.innerHTML = originalText;
|
|
|
|
if (data.success && data.parameters) {
|
|
const parameters = data.parameters;
|
|
document.getElementById('param1').value = parameters.param1 || '';
|
|
document.getElementById('param2').value = parameters.param2 || '';
|
|
document.getElementById('param3').value = parameters.param3 || '';
|
|
document.getElementById('param4').value = parameters.param4 || '';
|
|
document.getElementById('param5').value = parameters.param5 || '';
|
|
|
|
// 显示更新时间
|
|
if (parameters.update_time) {
|
|
document.getElementById('updateTimeContent').textContent = '最后更新时间：' + parameters.update_time;
|
|
document.getElementById('updateTimeAlert').style.display = 'flex';
|
|
} else {
|
|
document.getElementById('updateTimeAlert').style.display = 'none';
|
|
}
|
|
} else {
|
|
showErrorMessage('获取参数配置失败：' + (data.error || ''));
|
|
}
|
|
})
|
|
.catch(error => {
|
|
// 恢复按钮状态
|
|
reloadButton.disabled = false;
|
|
reloadButton.innerHTML = originalText;
|
|
|
|
showErrorMessage('获取参数配置失败，请稍后重试');
|
|
console.error('获取参数配置失败', error);
|
|
});
|
|
}
|
|
|
|
// 显示错误消息
|
|
function showErrorMessage(message) {
|
|
layer.msg(message, {
|
|
icon: 5,
|
|
time: 3000
|
|
});
|
|
}
|
|
|
|
// 显示成功消息
|
|
function showSuccessMessage(message) {
|
|
layer.msg(message, {
|
|
icon: 1,
|
|
time: 3000
|
|
});
|
|
}
|
|
});
|
|
</script>
|
|
|
|
{% include 'footer.html' %}
|
|
</body>
|
|
</html> |