This commit is contained in:
BianLzhaoMin 2025-06-12 16:41:16 +08:00
parent 900da8d662
commit b1ef4db7c6
2 changed files with 226 additions and 170 deletions

View File

@ -1,14 +1,15 @@
let form, layer, util,laydate, idParam, phoneParam,proId; let form, layer, util, laydate, idParam, phoneParam, proId;
let arr = ['background', 'web', 'mobile', 'wx']; let arr = ["background", "web", "mobile", "wx"];
let background, web, mobile, wx; let background, web, mobile, wx;
let data = [], appResList = []; let data = [],
appResList = [];
let startDate, endDate; let startDate, endDate;
function setParams(params) { function setParams(params) {
console.log(params) console.log(params);
idParam = JSON.parse(params).id; idParam = JSON.parse(params).id;
proId = JSON.parse(params).proId; proId = JSON.parse(params).proId;
layui.use(['form', 'layer', 'util', 'laydate'], function () { layui.use(["form", "layer", "util", "laydate"], function () {
form = layui.form; form = layui.form;
layer = layui.layer; layer = layui.layer;
util = layui.util; util = layui.util;
@ -17,17 +18,17 @@ function setParams(params) {
// 默认选择WGS-84 // 默认选择WGS-84
// $('.coordinate-option[data-system="WGS-84"]').addClass('active').trigger('click'); // $('.coordinate-option[data-system="WGS-84"]').addClass('active').trigger('click');
$('#wgs84Fields').show(); $("#wgs84Fields").show();
$('#2000Fields').hide(); $("#2000Fields").hide();
$('input[name="centralMeridian"]').removeAttr('lay-verify'); $('input[name="centralMeridian"]').removeAttr("lay-verify");
$('input[name="longitude2000"]').removeAttr('lay-verify'); $('input[name="longitude2000"]').removeAttr("lay-verify");
$('input[name="latitude2000"]').removeAttr('lay-verify'); $('input[name="latitude2000"]').removeAttr("lay-verify");
// 设置验证规则 // 设置验证规则
/* $('input[name^="longitude2000"], input[name^="latitude2000"], input[name="centralMeridian"]').removeAttr('lay-verify'); /* $('input[name^="longitude2000"], input[name^="latitude2000"], input[name="centralMeridian"]').removeAttr('lay-verify');
$('input[name="longitude"]').attr('lay-verify', 'required|longitude'); $('input[name="longitude"]').attr('lay-verify', 'required|longitude');
$('input[name="latitude"]').attr('lay-verify', 'required|latitude'); $('input[name="latitude"]').attr('lay-verify', 'required|latitude');
*/ */
console.log(idParam + "idParam") console.log(idParam + "idParam");
if (idParam) { if (idParam) {
getTowerById(); getTowerById();
} }
@ -35,49 +36,72 @@ function setParams(params) {
form.render(); form.render();
// 坐标系切换 // 坐标系切换
$('.coordinate-option').click(function() { $(".coordinate-option").click(function () {
let system = $(this).data('system'); let system = $(this).data("system");
$('.coordinate-option').removeClass('active'); $(".coordinate-option").removeClass("active");
$(this).addClass('active'); $(this).addClass("active");
if(system === 'WGS-84') { if (system === "WGS-84") {
$('#wgs84Fields').show(); $("#wgs84Fields").show();
$('#2000Fields').hide(); $("#2000Fields").hide();
// 设置验证规则 // 设置验证规则
$('input[name^="longitude2000"], input[name^="latitude2000"], input[name="centralMeridian"]').removeAttr('lay-verify'); $(
$('input[name="longitude"]').attr('lay-verify', 'required|longitude'); 'input[name^="longitude2000"], input[name^="latitude2000"], input[name="centralMeridian"]'
$('input[name="latitude"]').attr('lay-verify', 'required|latitude'); ).removeAttr("lay-verify");
$('input[name="longitude"]').attr(
"lay-verify",
"required|longitude"
);
$('input[name="latitude"]').attr(
"lay-verify",
"required|latitude"
);
// $('input[name="longitude"], input[name="latitude"]').attr('lay-verify', 'required|number'); // $('input[name="longitude"], input[name="latitude"]').attr('lay-verify', 'required|number');
$('input[name="centralMeridian"]').removeAttr('lay-verify'); $('input[name="centralMeridian"]').removeAttr("lay-verify");
} else { } else {
$('#wgs84Fields').hide(); $("#wgs84Fields").hide();
$('#2000Fields').show(); $("#2000Fields").show();
// 设置验证规则 // 设置验证规则
$('input[name="longitude"], input[name="latitude"]').removeAttr('lay-verify'); $('input[name="longitude"], input[name="latitude"]').removeAttr(
"lay-verify"
);
// $('input[name^="longitude2000"], input[name^="latitude2000"], input[name="centralMeridian"]').attr('lay-verify', 'required|number'); // $('input[name^="longitude2000"], input[name^="latitude2000"], input[name="centralMeridian"]').attr('lay-verify', 'required|number');
$('input[name="longitude2000"]').attr('lay-verify', 'required|longitude'); $('input[name="longitude2000"]').attr(
$('input[name="latitude2000"]').attr('lay-verify', 'required|latitude'); "lay-verify",
$('input[name="centralMeridian"]').attr('lay-verify', 'required'); "required|longitude"
);
$('input[name="latitude2000"]').attr(
"lay-verify",
"required|latitude"
);
$('input[name="centralMeridian"]').attr(
"lay-verify",
"required|number"
);
} }
}); });
// 表单验证 // 表单验证
form.verify({ form.verify({
required: function(value, item) { required: function (value, item) {
if(!value) { if (!value) {
return '必填项不能为空'; return "必填项不能为空";
}
},
number: function (value, item) {
const strictPositiveNumberRegex =
/^([1-9]\d*(\.\d+)?|0\.\d*[1-9]\d*)$/;
if (!strictPositiveNumberRegex.test(value)) {
return "请输入有效的数字";
} }
}, },
number: [
/^-?\d+\.?\d*$/,
'请输入有效的数字'
],
customSortNumber: function (value) { customSortNumber: function (value) {
if (value < 1) { // 验证是否小于1 if (value < 1) {
return '排序号不能小于1'; // 验证是否小于1
return "排序号不能小于1";
} }
}, },
// 经度验证 // 经度验证
/* longitude: function (value, item) { /* longitude: function (value, item) {
if (value) { if (value) {
// if (!/^[\-\+]?((180(\.0{1,6})?)|((\d{1,2}|1[0-7]\d)(\.\d{1,6})?))$/.test(value)) { // if (!/^[\-\+]?((180(\.0{1,6})?)|((\d{1,2}|1[0-7]\d)(\.\d{1,6})?))$/.test(value)) {
// return '请输入正确的经度(-180.0+180.0'; // return '请输入正确的经度(-180.0+180.0';
@ -116,12 +140,12 @@ function setParams(params) {
}); });
// 表单提交 // 表单提交
form.on('submit(formData)', function(data) { form.on("submit(formData)", function (data) {
let formData = data.field; let formData = data.field;
let currentSystem = $('.coordinate-option.active').data('system'); let currentSystem = $(".coordinate-option.active").data("system");
formData.coordinateSystem = currentSystem; formData.coordinateSystem = currentSystem;
// 处理提交数据 // 处理提交数据
if(currentSystem === 'WGS-84') { if (currentSystem === "WGS-84") {
delete formData.longitude2000; delete formData.longitude2000;
delete formData.latitude2000; delete formData.latitude2000;
delete formData.centralMeridian; delete formData.centralMeridian;
@ -135,70 +159,83 @@ function setParams(params) {
formData.lon = formData.longitude2000; formData.lon = formData.longitude2000;
formData.lat = formData.latitude2000; formData.lat = formData.latitude2000;
} }
if(formData.sort<1){ if (formData.sort < 1) {
layer.msg('排序号不能小于1', {icon: 2}); layer.msg("排序号不能小于1", { icon: 2 });
return false; return false;
} }
formData.proId=proId; formData.proId = proId;
saveData(formData); saveData(formData);
return false; return false;
}); });
}); });
} }
// 根据id获取杆塔信息 // 根据id获取杆塔信息
function getTowerById() { function getTowerById() {
let loadingMsg = layer.msg("数据加载中,请稍候...", {icon: 16, time: 0}); let loadingMsg = layer.msg("数据加载中,请稍候...", { icon: 16, time: 0 });
let url = dataUrl + "/tbTower/getTbTowerById"; let url = dataUrl + "/tbTower/getTbTowerById";
let params = { let params = {
id: idParam, id: idParam,
encryptedData: encryptCBC(JSON.stringify({id: idParam})) encryptedData: encryptCBC(JSON.stringify({ id: idParam })),
}; };
ajaxRequest(url, "POST", params, true, null, function(result) { ajaxRequest(
layer.close(loadingMsg); url,
if (result.code === 200) { "POST",
setFormData(result.data); params,
} else { true,
layer.alert(result.msg, {icon: 2}); null,
function (result) {
layer.close(loadingMsg);
if (result.code === 200) {
setFormData(result.data);
} else {
layer.alert(result.msg, { icon: 2 });
}
},
function (xhr) {
layer.close(loadingMsg);
error(xhr);
} }
}, function(xhr) { );
layer.close(loadingMsg);
error(xhr);
});
} }
// 设置表单数据 // 设置表单数据
function setFormData(data) { function setFormData(data) {
if(data) { if (data) {
// 先设置基本表单数据 // 先设置基本表单数据
form.val("towerForm", data); form.val("towerForm", data);
// 根据 uploadType 设置坐标系选择 // 根据 uploadType 设置坐标系选择
if(data.uploadType) { if (data.uploadType) {
$('.coordinate-option').removeClass('active'); $(".coordinate-option").removeClass("active");
switch(data.uploadType) { switch (data.uploadType) {
case "1": case "1":
// WGS-84地心坐标系 // WGS-84地心坐标系
$('.coordinate-option[data-system="WGS-84"]').addClass('active').trigger('click'); $('.coordinate-option[data-system="WGS-84"]')
.addClass("active")
.trigger("click");
break; break;
case "2": case "2":
// 2000国家大地坐标系 // 2000国家大地坐标系
$('.coordinate-option[data-system="2000"]').addClass('active').trigger('click'); $('.coordinate-option[data-system="2000"]')
.addClass("active")
.trigger("click");
break; break;
default: default:
// 默认选择WGS-84 // 默认选择WGS-84
$('.coordinate-option[data-system="WGS-84"]').addClass('active').trigger('click'); $('.coordinate-option[data-system="WGS-84"]')
.addClass("active")
.trigger("click");
} }
} }
// 根据坐标系类型设置值 // 根据坐标系类型设置值
if(data.uploadType == "1"){ if (data.uploadType == "1") {
// 设置WGS-84的经纬度值 // 设置WGS-84的经纬度值
$('input[name="longitude"]').val(data.lon); $('input[name="longitude"]').val(data.lon);
$('input[name="latitude"]').val(data.lat); $('input[name="latitude"]').val(data.lat);
} else if(data.uploadType == "2"){ } else if (data.uploadType == "2") {
// 设置2000坐标系的经纬度和中央子午线 // 设置2000坐标系的经纬度和中央子午线
$('input[name="longitude2000"]').val(data.lon); $('input[name="longitude2000"]').val(data.lon);
$('input[name="latitude2000"]').val(data.lat); $('input[name="latitude2000"]').val(data.lat);
@ -211,57 +248,73 @@ function setFormData(data) {
} }
function saveData2() { function saveData2() {
$('#formSubmit').trigger('click') $("#formSubmit").trigger("click");
} }
// 保存数据 // 保存数据
function saveData(data) { function saveData(data) {
console.log("保存数据", data) console.log("保存数据", data);
let loadingMsg = layer.msg('数据上传中,请稍候...', {icon: 16, scrollbar: false, time: 0}); let loadingMsg = layer.msg("数据上传中,请稍候...", {
icon: 16,
scrollbar: false,
time: 0,
});
let url = dataUrl + "/tbTower/addTbTower"; let url = dataUrl + "/tbTower/addTbTower";
let params = data; // 修改这里因为data已经是处理好的数据 let params = data; // 修改这里因为data已经是处理好的数据
if (params.id) { if (params.id) {
url = dataUrl + "/tbTower/updateTbTower"; url = dataUrl + "/tbTower/updateTbTower";
} }
console.log("杆塔管理的新增修改", params); console.log("杆塔管理的新增修改", params);
params = { params = {
encryptedData: encryptCBC(JSON.stringify(params)) encryptedData: encryptCBC(JSON.stringify(params)),
} };
// 禁用所有输入框和按钮 // 禁用所有输入框和按钮
function disableForm() { function disableForm() {
$('input').attr('disabled', true); $("input").attr("disabled", true);
$('.coordinate-option').css('pointer-events', 'none'); $(".coordinate-option").css("pointer-events", "none");
$('.save, .cancel').addClass("layui-btn-disabled").attr("disabled", true); $(".save, .cancel")
.addClass("layui-btn-disabled")
.attr("disabled", true);
} }
// 启用所有输入框和按钮 // 启用所有输入框和按钮
function enableForm() { function enableForm() {
$('input').attr('disabled', false); $("input").attr("disabled", false);
$('.coordinate-option').css('pointer-events', 'auto'); $(".coordinate-option").css("pointer-events", "auto");
$('.save, .cancel').removeClass("layui-btn-disabled").attr("disabled", false); $(".save, .cancel")
.removeClass("layui-btn-disabled")
.attr("disabled", false);
} }
ajaxRequest(url, "POST", params, true, function () { ajaxRequest(
disableForm(); // 请求开始时禁用表单 url,
}, function (result) { "POST",
layer.close(loadingMsg); params,
if (result.code === 200) { true,
layer.msg(result.msg, {icon: 1}); function () {
setTimeout(function () { disableForm(); // 请求开始时禁用表单
closePage(1); },
},3000) function (result) {
} else { layer.close(loadingMsg);
layer.alert(result.msg, {icon: 2}) if (result.code === 200) {
setTimeout(function () { layer.msg(result.msg, { icon: 1 });
enableForm(); setTimeout(function () {
},3000) closePage(1);
}, 3000);
} else {
layer.alert(result.msg, { icon: 2 });
setTimeout(function () {
enableForm();
}, 3000);
}
},
function (xhr) {
layer.close(loadingMsg);
enableForm(); // 发生错误时启用表单
error(xhr);
} }
}, function (xhr) { );
layer.close(loadingMsg);
enableForm(); // 发生错误时启用表单
error(xhr)
});
} }
// 关闭页面 // 关闭页面
@ -269,7 +322,7 @@ function closePage(type) {
let index = parent.layer.getFrameIndex(window.name); //先得到当前 iframe层的索引 let index = parent.layer.getFrameIndex(window.name); //先得到当前 iframe层的索引
parent.layer.close(index); //再执行关闭 parent.layer.close(index); //再执行关闭
if (type === 1) { if (type === 1) {
parent.reloadData() parent.reloadData();
parent.parent.reloadData() parent.parent.reloadData();
} }
} }

View File

@ -1,10 +1,11 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<link rel="stylesheet" href="../../../../js/layui-v2.6.8/css/layui.css" media="all"> <link rel="stylesheet" href="../../../../js/layui-v2.6.8/css/layui.css" media="all">
<link rel="stylesheet" href="../../../../js/layui-v2.6.8/dtree/dtree.css"> <link rel="stylesheet" href="../../../../js/layui-v2.6.8/dtree/dtree.css">
<link href="../../../../js/layui-v2.6.8/formSelects-v4.css" rel="stylesheet" type="text/css"/> <link href="../../../../js/layui-v2.6.8/formSelects-v4.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="../../../../js/layui-v2.6.8/dtree/font/dtreefont.css"> <link rel="stylesheet" href="../../../../js/layui-v2.6.8/dtree/font/dtreefont.css">
<link rel="stylesheet" href="../../../../css/dataForm.css"> <link rel="stylesheet" href="../../../../css/dataForm.css">
<script src="../../../../js/libs/jquery-3.7.0.min.js" charset="UTF-8" type="text/javascript"></script> <script src="../../../../js/libs/jquery-3.7.0.min.js" charset="UTF-8" type="text/javascript"></script>
@ -50,94 +51,96 @@
} }
</style> </style>
</head> </head>
<body> <body>
<div id="main-box"> <div id="main-box">
<form class="layui-form" lay-filter="towerForm"> <form class="layui-form" lay-filter="towerForm">
<input type="hidden" name="id" id="id"> <input type="hidden" name="id" id="id">
<div class="layui-form-item" style="margin-top: 2%;"> <div class="layui-form-item" style="margin-top: 2%;">
<label class="layui-form-label"><span class="required-mark">*</span>杆塔:</label> <label class="layui-form-label"><span class="required-mark">*</span>杆塔:</label>
<div class="layui-input-inline">
<input type="text" name="towerName" lay-verify="required" autocomplete="off"
placeholder="请输入杆塔名称" class="layui-input" maxlength="30">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span class="required-mark">*</span>排序号:</label>
<div class="layui-input-inline">
<input type="text" name="sort" lay-verify="required|number|customSortNumber" autocomplete="off"
placeholder="请输入排序号" class="layui-input" maxlength="5">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span class="required-mark">*</span>坐标系:</label>
<div class="layui-input-block coordinate-options">
<div class="coordinate-option active" data-system="WGS-84">
<span>WGS-84地心坐标系</span>
</div>
<div class="coordinate-option" data-system="2000">
<span>2000国家大地坐标系</span>
</div>
</div>
</div>
<!-- WGS-84坐标系输入框 -->
<div id="wgs84Fields">
<div class="layui-form-item">
<label class="layui-form-label"><span class="required-mark">*</span>经度:</label>
<div class="layui-input-inline"> <div class="layui-input-inline">
<input type="text" name="longitude" lay-verify="required|longitude" autocomplete="off" <input type="text" name="towerName" lay-verify="required" autocomplete="off" placeholder="请输入杆塔名称"
placeholder="请输入经度大约73.55°E至135.08°E" maxlength="10" class="layui-input"> class="layui-input" maxlength="30">
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label"><span class="required-mark">*</span>纬度:</label> <label class="layui-form-label"><span class="required-mark">*</span>排序号:</label>
<div class="layui-input-inline"> <div class="layui-input-inline">
<input type="text" name="latitude" lay-verify="required|latitude" autocomplete="off" <input type="text" name="sort" lay-verify="required|number|customSortNumber" autocomplete="off"
placeholder="请输入纬度大约4°N至53°N" maxlength="10" class="layui-input"> placeholder="请输入排序号" class="layui-input" maxlength="5">
</div>
</div>
</div>
<!-- 2000坐标系输入框 -->
<div id="2000Fields" style="display: none;">
<div class="layui-form-item">
<label class="layui-form-label"><span class="required-mark">*</span>中央子午线:</label>
<div class="layui-input-inline">
<input type="text" name="centralMeridian" lay-verify="required" autocomplete="off"
placeholder="请输入中央子午线" class="layui-input" maxlength="30">
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label"><span class="required-mark">*</span>经度:</label> <label class="layui-form-label"><span class="required-mark">*</span>坐标系:</label>
<div class="layui-input-inline"> <div class="layui-input-block coordinate-options">
<input type="text" name="longitude2000" lay-verify="required|longitude" autocomplete="off" <div class="coordinate-option active" data-system="WGS-84">
placeholder="请输入经度大约73.55°E至135.08°E---" maxlength="10" class="layui-input"> <span>WGS-84地心坐标系</span>
</div>
<div class="coordinate-option" data-system="2000">
<span>2000国家大地坐标系</span>
</div>
</div> </div>
</div> </div>
<div class="layui-form-item"> <!-- WGS-84坐标系输入框 -->
<label class="layui-form-label"><span class="required-mark">*</span>纬度:</label> <div id="wgs84Fields">
<div class="layui-input-inline"> <div class="layui-form-item">
<input type="text" name="latitude2000" lay-verify="required|latitude" autocomplete="off" <label class="layui-form-label"><span class="required-mark">*</span>经度:</label>
placeholder="请输入纬度大约4°N至53°N---" maxlength="10" class="layui-input"> <div class="layui-input-inline">
<input type="text" name="longitude" lay-verify="required|longitude" autocomplete="off"
placeholder="请输入经度大约73.55°E至135.08°E" maxlength="10" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span class="required-mark">*</span>纬度:</label>
<div class="layui-input-inline">
<input type="text" name="latitude" lay-verify="required|latitude" autocomplete="off"
placeholder="请输入纬度大约4°N至53°N" maxlength="10" class="layui-input">
</div>
</div> </div>
</div> </div>
</div>
<button type="submit" id="formSubmit" class="layui-btn" lay-submit lay-filter="formData" <!-- 2000坐标系输入框 -->
<div id="2000Fields" style="display: none;">
<div class="layui-form-item">
<label class="layui-form-label"><span class="required-mark">*</span>中央子午线:</label>
<div class="layui-input-inline">
<input type="text" name="centralMeridian" lay-verify="required|number" autocomplete="off"
placeholder="请输入中央子午线" class="layui-input" maxlength="30">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span class="required-mark">*</span>经度:</label>
<div class="layui-input-inline">
<input type="text" name="longitude2000" lay-verify="required|longitude" autocomplete="off"
placeholder="请输入经度大约73.55°E至135.08°E---" maxlength="10" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span class="required-mark">*</span>纬度:</label>
<div class="layui-input-inline">
<input type="text" name="latitude2000" lay-verify="required|latitude" autocomplete="off"
placeholder="请输入纬度大约4°N至53°N---" maxlength="10" class="layui-input">
</div>
</div>
</div>
<button type="submit" id="formSubmit" class="layui-btn" lay-submit lay-filter="formData"
style="display: none;"></button> style="display: none;"></button>
</form> </form>
</div> </div>
<div class="btn-box"> <div class="btn-box">
<button class="layui-btn layui-btn-normal save" onclick="saveData2()">确定</button> <button class="layui-btn layui-btn-normal save" onclick="saveData2()">确定</button>
<button class="layui-btn layui-btn-primary cancel" onclick="closePage()">取消</button> <button class="layui-btn layui-btn-primary cancel" onclick="closePage()">取消</button>
</div> </div>
</body> </body>
<script src="../../../../js/basic/lineManagement/child/towerFormTemp.js"></script> <script src="../../../../js/basic/lineManagement/child/towerFormTemp.js"></script>
</html> </html>