zjwno1/EBoard
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

完善功能

Browse Source
This commit is contained in:
大师兄法号随缘
2025-09-22 14:30:54 +08:00
parent fde5919d99
commit 365cd2397a
31 changed files with 1849 additions and 467 deletions
Download Patch File Download Diff File Expand all files Collapse all files

540
电子展板/Assets/Views/Index.html Normal file
View File

@@ -0,0 +1,540 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>展板数据配置</title>
<link href="layui/css/layui.css" rel="stylesheet">
<style>
.container {
display: flex;
justify-content: center;
align-items: center;
height: 15vh;
}
</style>
</head>
<body>
<div class="container">
<h2>展板数据配置</h2>
</div>
<form class="layui-form" action="">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">时间</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" id="time" name="time" placeholder="HH:mm:ss" lay-verify="required">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">字体大小</label>
<div class="layui-input-inline">
<input type="number" id="timeSize" name="timeSize" lay-verify="required" placeholder="字体大小" lay-verify="required" autocomplete="off" class="layui-input" min="15" max="60" step="1" lay-affix="number">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">负责人</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" id="charger" name="charger" placeholder="负责人" lay-verify="required">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">字体大小</label>
<div class="layui-input-inline">
<input type="number" name="chargerSize" id="chargerSize" lay-verify="required" placeholder="字体大小" autocomplete="off" class="layui-input" min="15" max="60" step="1" lay-affix="number">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">风险等级</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" id="riskLevel" name="riskLevel" placeholder="风险等级" lay-verify="required">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">字体大小</label>
<div class="layui-input-inline">
<input type="number" name="riskLevelSize" id="riskLevelSize" placeholder="字体大小" autocomplete="off" class="layui-input" min="15" max="60" step="1" lay-affix="number">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">工作内容</label>
<div class="layui-input-inline">
<textarea name="content" id="content" class="layui-textarea"></textarea>
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">字体大小</label>
<div class="layui-input-inline">
<input type="number" name="contentSize" id="contentSize" placeholder="字体大小" autocomplete="off" class="layui-input" min="15" max="60" step="1" lay-affix="number">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">危险点</label>
<div class="layui-input-inline">
<textarea name="dangerPoint" id="dangerPoint" class="layui-textarea"></textarea>
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">字体大小</label>
<div class="layui-input-inline">
<input type="number" name="dangerPointSize" id="dangerPointSize" placeholder="字体大小" autocomplete="off" class="layui-input" min="15" max="60" step="1" lay-affix="number">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">重点管控措施</label>
<div class="layui-input-inline">
<textarea name="measures" id="measures" class="layui-textarea"></textarea>
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">字体大小</label>
<div class="layui-input-inline">
<input type="number" name="measuresSize" id="measuresSize" placeholder="字体大小" autocomplete="off" class="layui-input" min="15" max="60" step="1" lay-affix="number">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">党员1姓名</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" id="cpcMember1Name" name="cpcMember1Name" placeholder="党员1姓名" lay-verify="required">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<div class="layui-upload">
<button type="button" class="layui-btn" id="upload1" style="margin-left:30px">
<i class="layui-icon layui-icon-upload"></i> 党员1上传
</button>
<button type="button" class="layui-btn" id="delete1" style="margin-left:30px">
<i class="layui-icon layui-icon-close"></i> 党员1删除
</button>
</div>
</div>
<div style="width: 132px;margin-left:100px">
<div class="layui-upload-list">
<img class="layui-upload-img" id="image1" style="width: 100%; height: 92px;" />
<div id="upload-text1"></div>
</div>
<!--<div class="layui-progress layui-progress-big" lay-showPercent="yes" lay-filter="filter-progress1">
<div class="layui-progress-bar" lay-percent=""></div>
</div>-->
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">党员2姓名</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" id="cpcMember2Name" name="cpcMember2Name" placeholder="党员2姓名" lay-verify="required">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<div class="layui-upload">
<button type="button" class="layui-btn" id="upload2" style="margin-left:30px">
<i class="layui-icon layui-icon-upload"></i> 党员2上传
</button>
<button type="button" class="layui-btn" id="delete2" style="margin-left:30px">
<i class="layui-icon layui-icon-close"></i> 党员2删除
</button>
</div>
</div>
<div style="width: 132px;margin-left:100px">
<div class="layui-upload-list">
<img class="layui-upload-img" id="image2" style="width: 100%; height: 92px;" />
<div id="upload-text2"></div>
</div>
<!--<div class="layui-progress layui-progress-big" lay-showPercent="yes" lay-filter="filter-progress2">
<div class="layui-progress-bar" lay-percent=""></div>
</div>-->
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">党员3姓名</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" id="cpcMember3Name" name="cpcMember3Name" placeholder="党员3姓名" lay-verify="required">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<div class="layui-upload">
<button type="button" class="layui-btn" id="upload3" style="margin-left:30px">
<i class="layui-icon layui-icon-upload"></i> 党员3上传
</button>
<button type="button" class="layui-btn" id="delete3" style="margin-left:30px">
<i class="layui-icon layui-icon-close"></i> 党员3删除
</button>
</div>
</div>
<div style="width: 132px;margin-left:100px">
<div class="layui-upload-list">
<img class="layui-upload-img" id="image3" style="width: 100%; height: 92px;" />
<div id="upload-text3"></div>
</div>
<!--<div class="layui-progress layui-progress-big" lay-showPercent="yes" lay-filter="filter-progress3">
<div class="layui-progress-bar" lay-percent=""></div>
</div>-->
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">党员4姓名</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" id="cpcMember4Name" name="cpcMember4Name" placeholder="党员4姓名" lay-verify="required">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<div class="layui-upload">
<button type="button" class="layui-btn" id="upload4" style="margin-left:30px">
<i class="layui-icon layui-icon-upload"></i> 党员4上传
</button>
<button type="button" class="layui-btn" id="delete4" style="margin-left:30px">
<i class="layui-icon layui-icon-close"></i> 党员4删除
</button>
</div>
</div>
<div style="width: 132px;margin-left:100px">
<div class="layui-upload-list">
<img class="layui-upload-img" id="image4" style="width: 100%; height: 92px;" />
<div id="upload-text4"></div>
</div>
<!--<div class="layui-progress layui-progress-big" lay-showPercent="yes" lay-filter="filter-progress4">
<div class="layui-progress-bar" lay-percent=""></div>
</div>-->
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">字体大小</label>
<div class="layui-input-inline">
<input type="number" name="cpcMemberSize" id="cpcMemberSize" placeholder="字体大小" autocomplete="off" class="layui-input" min="15" max="60" step="1" lay-affix="number">
</div>
</div>
</div>
<div style="margin-left:100px">
<button type="button" id="saveconfig" class="layui-btn" style="margin-left:30px">
<i class="layui-icon layui-icon-set-fill"></i> 保存配置
</button>
</div>
</form>
<!-- 请勿在项目正式环境中引用该 layui.js 地址 -->
<script src="layui/layui.js"></script>
<script src="jquery/jquery-1.9.1.min.js"></script>
<script>
layui.use(['form', 'laydate', 'util'], function () {
var form = layui.form;
var layer = layui.layer;
var laydate = layui.laydate;
var upload = layui.upload;
var util = layui.util;
// 时间选择器
laydate.render({
elem: '#time',
type: 'time'
});
// 单图片上传
var uploadInst1 = upload.render({
elem: '#upload1',
url: '/uploadImage', // 实际使用时改成您自己的上传接口即可。
before: function (obj) {
// 预读本地文件示例，不支持ie8
//obj.preview(function (index, file, result) {
// $('#image1').attr('src', result); // 图片链接（base64）
//});
//element.progress('filter-progress1', '0%'); // 进度条复位
//layer.msg('上传中', { icon: 16, time: 0 });
},
done: function (res) {
// 若上传失败
if (res.state != 1) {
layer.msg('上传失败', { icon: 2 });
return;
}
// 上传成功的一些操作
$('#image1').attr('src', res.data); // 置空上传失败的状态
$('#upload-text1').html(''); // 置空上传失败的状态
layer.msg('上传成功', { icon: 1 });
},
error: function () {
var demoText = $('#upload-text1');
demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs" id="reload1">重试</a>');
demoText.find('#reload1').on('click', function () {
uploadInst.upload();
});
},
// 进度条
//progress: function (n, elem, e) {
// element.progress('filter-progress1', n + '%'); // 可配合 layui 进度条元素使用
// if (n == 100) {
// layer.msg('上传完毕', { icon: 1 });
// }
//}
});
var uploadInst2 = upload.render({
elem: '#upload2',
url: '/uploadImage', // 实际使用时改成您自己的上传接口即可。
before: function (obj) {
// 预读本地文件示例，不支持ie8
//obj.preview(function (index, file, result) {
// $('#image2').attr('src', result); // 图片链接（base64）
//});
//element.progress('filter-progress2', '0%'); // 进度条复位
//layer.msg('上传中', { icon: 16, time: 0 });
},
done: function (res) {
// 若上传失败
if (res.state != 1) {
layer.msg('上传失败', { icon: 2 });
return;
}
// 上传成功的一些操作
$('#image2').attr('src', res.data); // 置空上传失败的状态
$('#upload-text2').html(''); // 置空上传失败的状态
layer.msg('上传成功', { icon: 1 });
},
error: function () {
// 演示失败状态，并实现重传
var demoText = $('#upload-text2');
demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs" id="reload2">重试</a>');
demoText.find('#reload2').on('click', function () {
uploadInst.upload();
});
},
// 进度条
//progress: function (n, elem, e) {
// element.progress('filter-progress2', n + '%'); // 可配合 layui 进度条元素使用
// if (n == 100) {
// layer.msg('上传完毕', { icon: 1 });
// }
//}
});
var uploadInst3 = upload.render({
elem: '#upload3',
url: '/uploadImage', // 实际使用时改成您自己的上传接口即可。
before: function (obj) {
// 预读本地文件示例，不支持ie8
//obj.preview(function (index, file, result) {
// $('#image3').attr('src', result); // 图片链接（base64）
//});
//element.progress('filter-progress3', '0%'); // 进度条复位
//layer.msg('上传中', { icon: 16, time: 0 });
},
done: function (res) {
// 若上传失败
if (res.state != 1) {
layer.msg('上传失败', { icon: 2 });
return;
}
// 上传成功的一些操作
$('#image3').attr('src', res.data); // 置空上传失败的状态
$('#upload-text3').html(''); // 置空上传失败的状态
layer.msg('上传成功', { icon: 1 });
},
error: function () {
// 演示失败状态，并实现重传
var demoText = $('#upload-text3');
demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs" id="reload3">重试</a>');
demoText.find('#reload3').on('click', function () {
uploadInst.upload();
});
},
// 进度条
//progress: function (n, elem, e) {
// element.progress('filter-progress3', n + '%'); // 可配合 layui 进度条元素使用
// if (n == 100) {
// layer.msg('上传完毕', { icon: 1 });
// }
//}
});
var uploadInst4 = upload.render({
elem: '#upload4',
url: '/uploadImage', // 实际使用时改成您自己的上传接口即可。
before: function (obj) {
// 预读本地文件示例，不支持ie8
//obj.preview(function (index, file, result) {
// $('#image4').attr('src', result); // 图片链接（base64）
//});
//element.progress('filter-progress4', '0%'); // 进度条复位
//layer.msg('上传中', { icon: 16, time: 0 });
},
done: function (res) {
// 若上传失败
if (res.state != 1) {
layer.msg('上传失败', { icon: 2 });
return;
}
// 上传成功的一些操作
$('#image4').attr('src', res.data); // 置空上传失败的状态
$('#upload-text4').html(''); // 置空上传失败的状态
layer.msg('上传成功', { icon: 1 });
},
error: function () {
// 演示失败状态，并实现重传
var demoText = $('#upload-text4');
demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs" id="reload4">重试</a>');
demoText.find('#reload4').on('click', function () {
uploadInst.upload();
});
},
// 进度条
//progress: function (n, elem, e) {
// element.progress('filter-progress4', n + '%'); // 可配合 layui 进度条元素使用
// if (n == 100) {
// layer.msg('上传完毕', { icon: 1 });
// }
//}
});
init();
$("#delete1").click(function () {
$("#image1").attr("src", "");
});
$("#delete2").click(function () {
$("#image2").attr("src", "");
});
$("#delete3").click(function () {
$("#image3").attr("src", "");
});
$("#delete4").click(function () {
$("#image4").attr("src", "");
});
$("#saveconfig").click(function () {
save();
});
});
function init() {
$.ajax({
url: '/getConfig',
method: 'GET',
dataType: 'json',
success: function (response) {
// 成功处理响应数据
$("#time").val(response.Time);
$("#timeSize").val(response.TimeSize);
$("#charger").val(response.Charger);
$("#chargerSize").val(response.ChargerSize);
$("#riskLevel").val(response.RiskLevel);
$("#riskLevelSize").val(response.RiskLevelSize);
$("#content").text(response.Content);
$("#contentSize").val(response.ContentSize);
$("#dangerPoint").text(response.DangerPoint);
$("#dangerPointSize").val(response.DangerPointSize);
$("#measures").text(response.Measures);
$("#measuresSize").val(response.MeasuresSize);
$("#cpcMember1Name").val(response.CPCMember1Name);
$("#cpcMember2Name").val(response.CPCMember2Name);
$("#cpcMember3Name").val(response.CPCMember3Name);
$("#cpcMember4Name").val(response.CPCMember4Name);
$("#image1").attr("src", response.CPCMember1Path);
$("#image2").attr("src", response.CPCMember2Path);
$("#image3").attr("src", response.CPCMember3Path);
$("#image4").attr("src", response.CPCMember4Path);
$("#cpcMemberSize").val(response.CPCMemberSize);
},
error: function (xhr, status, error) {
// 处理错误
//layer.msg('');
}
});
}
function save() {
var json = {
Time: $("#time").val(),
TimeSize: $("#timeSize").val(),
Charger: $("#charger").val(),
ChargerSize: $("#chargerSize").val(),
RiskLevel: $("#riskLevel").val(),
RiskLevelSize: $("#riskLevelSize").val(),
Content: $("#content").text(),
ContentSize: $("#contentSize").val(),
DangerPoint: $("#dangerPoint").text(),
DangerPointSize: $("#dangerPointSize").val(),
Measures: $("#measures").text(),
MeasuresSize: $("#measuresSize").val(),
CPCMember1Name: $("#cpcMember1Name").val(),
CPCMember2Name: $("#cpcMember2Name").val(),
CPCMember3Name: $("#cpcMember3Name").val(),
CPCMember4Name: $("#cpcMember4Name").val(),
CPCMember1Path: $("#image1").attr("src"),
CPCMember2Path: $("#image2").attr("src"),
CPCMember3Path: $("#image3").attr("src"),
CPCMember4Path: $("#image4").attr("src"),
CPCMemberSize: $("#cpcMemberSize").val(),
};
$.ajax({
url: '/save',
method: 'POST',
dataType: 'json',
data: json,
success: function (response) {
if (response.state == 1) {
layer.msg('保存成功', { icon: 1 });
} else {
layer.msg('保存失败', { icon: 2 });
}
},
error: function (xhr, status, error) {
layer.msg('保存失败', { icon: 2 });
}
});
}
</script>
</body>
</html>