新需求完善

This commit is contained in:
BianLzhaoMin 2025-06-11 14:49:16 +08:00
parent 9bc2e366d9
commit a41ec4fe33
8 changed files with 1415 additions and 644 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

View File

@ -0,0 +1,394 @@
let form, layer;
let objParams = {};
let map = null; // 地图实例
let intLng = 116.254; // 初始经度
let intLat = 39.965; // 初始纬度
let isMap = true; // 是否是地图模式
let markerCount = 0; // 标记点计数器
let markers = []; // 标记点数组
let polylineView = null;
function setParams(obj) {
objParams = JSON.parse(obj);
layui.use(["form", "layer"], function () {
form = layui.form;
layer = layui.layer;
table = layui.table;
initData();
});
}
// 地图配置项
const config = {
polyline: {
strokeWeight: 1, // 线条宽度
strokeOpacity: 0.9, // 透明度
strokeStyle: "dashed", // solid(实线)或dashed(虚线)
enableEditing: false, // 是否可编辑
enableClicking: true, // 是否可点击
},
};
// 加载工程杆塔数据
function initData() {
let url = dataUrl + "/backstage/digitalSignage/getTowersPosition";
let obj = {
id: objParams.id,
};
let params = {
encryptedData: encryptCBC(JSON.stringify(obj)),
};
ajaxRequest(
url,
"POST",
params,
true,
function () {},
function (result) {
if (result.status === 200) {
setData(result.data);
} else {
layer.msg(result.msg, { icon: 2 });
}
},
function (xhr) {
error(xhr);
}
);
function setData(list) {
if (list && list.length > 0) {
if (objParams.points) {
let points = JSON.parse(objParams.points);
intLng = points[0].lng;
intLat = points[0].lat;
} else {
intLng = list[0].proLon ? list[0].proLon : list[0].lon;
intLat = list[0].proLat ? list[0].proLat : list[0].lat;
}
}
initMap(list);
}
}
// 百度地图初始化
function initMap(list) {
if (map) {
map = null;
}
map = new BMapGL.Map("map-box");
// 以第一个点为中心初始化地图
map.centerAndZoom(new BMapGL.Point(intLng, intLat), 16);
map.setTilt(65); //设置地图的倾斜角度
map.enableScrollWheelZoom(true); // 启用滚轮缩放
// 设置显示3D建筑物
map.setDisplayOptions({
building: true, // 显示3D建筑物
indoor: false,
poi: true,
});
var navigationControl = new BMapGL.NavigationControl3D();
map.addControl(navigationControl);
// 每次初始化的时候清除所有标点以及线
map.clearOverlays();
var styleJson = [
// 隐藏道路
{
featureType: "highway",
elementType: "all",
stylers: { visibility: "off" },
},
{
featureType: "arterial",
elementType: "all",
stylers: { visibility: "off" },
},
{
featureType: "local",
elementType: "all",
stylers: { visibility: "off" },
},
{
featureType: "railway",
elementType: "all",
stylers: { visibility: "off" },
},
// 保留背景、水域、绿地等(避免地图变空白)
{
featureType: "background",
elementType: "all",
stylers: { visibility: "on" },
},
{
featureType: "water",
elementType: "all",
stylers: { visibility: "on" },
},
{
featureType: "green",
elementType: "all",
stylers: { visibility: "on" },
},
// 保留标点和文字(避免自定义点被隐藏)
{
featureType: "point",
elementType: "all",
stylers: { visibility: "on" },
},
{
featureType: "label",
elementType: "all",
stylers: { visibility: "on" },
},
];
if (isMap) {
// map.setMapType(BMAP_EARTH_MAP); // 地球模式
map.setMapType(BMAP_SATELLITE_MAP); // 地球模式
/*map.setDisplayOptions({
poiText: false, // 隐藏POI文字
poiIcon: false, // 隐藏POI图标
building: false, // 隐藏建筑物
});*/
} else {
map.setMapType(BMAP_NORMAL_MAP); // 普通模式
// 增加不是纯白的背景色
map.setMapStyleV2({
styleJson: [
{
featureType: "background",
elementType: "all",
stylers: { color: "#f5f5f5" },
},
],
});
}
if (isMap) {
map.setMapStyleV2({
styleJson,
});
}
initTowerLine(list);
if (objParams.points) {
let points = JSON.parse(objParams.points);
if (points.length > 0) {
$.each(points, function (i, item) {
addMarker(item.lng || item.lon, item.lat || item.lat);
});
viewPointLine();
map.addEventListener("click", function (e) {
addMarker(e.latlng.lng, e.latlng.lat);
});
}
} else {
// 点击地图添加标记
map.addEventListener("click", function (e) {
addMarker(e.latlng.lng, e.latlng.lat);
});
}
}
// 添加点坐标
function addMarker(lng, lat) {
console.log("markers标点集合", markers);
var point = new BMapGL.Point(lng, lat);
// 创建点标记
var marker = new BMapGL.Marker(point);
// 添加到地图
map.addOverlay(marker);
// 创建标签
// 2025-06-10 修改第一个标点名称为索道口
// let markerName = "";
// if (markers.length === 0) {
// markerName = "公路口";
// } else {
// markerName = "点" + (markerCount + 1);
// }
var label = new BMapGL.Label("杆塔" + (markerCount + 1), {
position: point,
offset: new BMapGL.Size(10, -30),
});
label.setStyle({
color: "#333",
fontSize: "12px",
fontWeight: "bold",
backgroundColor: "rgba(255,255,255,0.9)",
border: "1px solid #ddd",
borderRadius: "4px",
padding: "2px 6px",
});
map.addOverlay(label);
// 存储标记和标签
markers.push({
marker: marker,
label: label,
point: point,
});
console.log(markers);
// 更新计数器
markerCount++;
}
// 杆塔连线
function initTowerLine(points) {
// 存储所有点的坐标用于连线
var linePoints = [];
// 添加点覆盖物和标签
points.forEach(function (item, index) {
var point = new BMapGL.Point(item.lon, item.lat);
linePoints.push(point); // 添加到连线数组
// 创建点标记
var icon = new BMapGL.Icon(
"../../../../img/synthesisQuery/tower.png",
new BMapGL.Size(30, 66),
{
// 图标定位点
anchor: new BMapGL.Size(15, 66),
}
);
var marker = new BMapGL.Marker(point, { icon: icon });
map.addOverlay(marker);
// 创建标签
var label = new BMapGL.Label(item.towerName, {
position: point,
offset: new BMapGL.Size(20, -60),
});
label.setStyle({
color: "#333",
fontSize: "12px",
fontWeight: "bold",
backgroundColor: "rgba(255,255,255,0.9)",
border: "1px solid #ddd",
borderRadius: "4px",
padding: "2px 6px",
});
map.addOverlay(label);
});
// 创建连线
var polyline = new BMapGL.Polyline(linePoints, {
strokeColor: "#FF0305",
strokeWeight: 6,
strokeOpacity: 0.8,
});
map.addOverlay(polyline);
// 可选:自动调整视图以包含所有点
map.setViewport(linePoints);
// 2. 获取视口边界和中心点
var bounds = map.getBounds();
var center = bounds.getCenter();
// 3. 计算视口距离
var viewportDistance = Math.max(
BMapGL.Map.prototype.getDistance(
center,
new BMapGL.Point(bounds.getSouthWest().lng, center.lat)
),
BMapGL.Map.prototype.getDistance(
center,
new BMapGL.Point(center.lng, bounds.getSouthWest().lat)
)
);
// 4. 设置3D参数
var zoom = map.getZoom();
var newTilt = 65;
var newHeading = 30;
// 5. 应用3D视角
map.setTilt(newTilt);
map.setHeading(newHeading);
// 6. 稍微缩小以确保所有点在3D视角下可见
setTimeout(function () {
map.setZoom(zoom - 1);
}, 100);
}
// 清除所有标点
document.getElementById("clearMarkers").addEventListener("click", function () {
markers.forEach(function (item) {
map.removeOverlay(item.marker);
map.removeOverlay(item.label);
});
markers = [];
markerCount = 0;
if (polylineView) {
map.removeOverlay(polylineView); // 移除旧的折线
polylineView = null;
}
let frameId = parent.document
.getElementById("addDataRopeway")
.getElementsByTagName("iframe")[0];
frameId.contentWindow.clearPointData();
});
// 预览标点连线
document.getElementById("viewPoint").addEventListener("click", function () {
viewPointLine();
});
function viewPointLine() {
if (markers && markers.length === 0) {
return layer.msg("请先创建点位", { icon: 7 });
}
if (polylineView) {
map.removeOverlay(polylineView); // 移除旧的折线
polylineView = null;
}
let points = [];
$.each(markers, function (index, item) {
points.push(item.point);
});
// 2. 创建折线连接这些点位
var polyline = new BMapGL.Polyline(points, {
strokeColor: "#0C14CA", // 线颜色
strokeWeight: 4, // 线宽
strokeOpacity: 0.8, // 线透明度
});
polylineView = polyline;
map.addOverlay(polyline);
// 点击地图添加标记
// 2025-06-10 移除点击地图添加标记 解决连线之后 再次标点时标点展示异常问题
// map.addEventListener("click", function (e) {
// addMarker(e.latlng.lng, e.latlng.lat);
// });
}
// 保存点位数据
function saveData() {
if (markers && markers.length === 0) {
return layer.msg("请先创建点位", { icon: 7 });
}
if (markers && markers.length < 2) {
return layer.msg("至少创建两个点位", { icon: 7 });
}
let points = [];
$.each(markers, function (index, item) {
points.push({
lng: item.point.lng,
lat: item.point.lat,
sort: index + 1,
});
});
let frameId = parent.document
.getElementById("addDataThreeSpan")
.getElementsByTagName("iframe")[0];
frameId.contentWindow.savePointData(JSON.stringify(points));
parent.layer.msg("保存成功", { icon: 1 });
let index = parent.layer.getFrameIndex(window.name); //先得到当前 iframe层的索引
parent.layer.close(index); //再执行关闭
}
// 关闭页面
function closePage() {
let index = parent.layer.getFrameIndex(window.name); //先得到当前 iframe层的索引
parent.layer.close(index); //再执行关闭
}

View File

@ -1,61 +1,72 @@
let form, layer, table, tableIns,idParam; let form, layer, table, tableIns, idParam;
let pageNum = 1, limitSize = 10; // 默认第一页分页数量为10 let pageNum = 1,
limitSize = 10; // 默认第一页分页数量为10
function setParams(params) { function setParams(params) {
idParam = JSON.parse(params).id; idParam = JSON.parse(params).id;
layui.use(['form', 'layer', 'table', 'laydate'], function () { layui.use(["form", "layer", "table", "laydate"], function () {
form = layui.form; form = layui.form;
layer = layui.layer; layer = layui.layer;
table = layui.table; table = layui.table;
layui.form.render(); layui.form.render();
pages(1, 10, 1); pages(1, 10, 1);
}) });
} }
function pages(pageNum, pageSize, typeNum) { function pages(pageNum, pageSize, typeNum) {
let params = getReqParams(pageNum, pageSize, typeNum); let params = getReqParams(pageNum, pageSize, typeNum);
let url = dataUrl + "/tbThreeSpan/getTbThreeSpanList" let url = dataUrl + "/tbThreeSpan/getTbThreeSpanList";
ajaxRequest(url, "POST", params, true, function () { ajaxRequest(
}, function (result) { url,
console.log(result); "POST",
if (result.code === 200) { params,
if (result.data) { true,
initTable(result.data, result.limit, result.curr) function () {},
laypages(result.count, result.curr, result.limit) function (result) {
console.log(result);
if (result.code === 200) {
if (result.data) {
initTable(result.data, result.limit, result.curr);
laypages(result.count, result.curr, result.limit);
}
} else if (result.code === 500) {
layer.alert(result.msg, { icon: 2 });
} }
} else if (result.code === 500) { },
layer.alert(result.msg, {icon: 2}) function (xhr) {
error(xhr);
} }
}, function (xhr) { );
error(xhr)
});
} }
function laypages(total, page, limit) { function laypages(total, page, limit) {
layui.use(['laypage'], function () { layui.use(["laypage"], function () {
let laypage = layui.laypage; let laypage = layui.laypage;
laypage.render({ laypage.render({
elem: 'voi-page', elem: "voi-page",
count: total, count: total,
curr: page, curr: page,
limit: limit, limit: limit,
limits: [10, 20, 50, 100, 200, 500], limits: [10, 20, 50, 100, 200, 500],
layout: ['prev', 'page', 'next', 'skip', 'count', 'limit'], layout: ["prev", "page", "next", "skip", "count", "limit"],
groups: 5, groups: 5,
jump: function (obj, first) { jump: function (obj, first) {
if (!first) { if (!first) {
pageNum = obj.curr, limitSize = obj.limit; (pageNum = obj.curr), (limitSize = obj.limit);
pages(obj.curr, obj.limit, null); pages(obj.curr, obj.limit, null);
} }
} },
}); });
}) });
} }
/*初始化表格*/ /*初始化表格*/
function initTable(dataList, limit, page) { function initTable(dataList, limit, page) {
let loadingMsg = layer.msg("数据加载中,请稍候...", {icon: 16, scrollbar: false, time: 0,}); let loadingMsg = layer.msg("数据加载中,请稍候...", {
icon: 16,
scrollbar: false,
time: 0,
});
tableIns = table.render({ tableIns = table.render({
elem: "#table_data", elem: "#table_data",
height: "full-130", height: "full-130",
@ -65,106 +76,158 @@ function initTable(dataList, limit, page) {
[ [
//表头 //表头
{ {
title: "序号", width: 80, unresize: true, align: "center", title: "序号",
width: 80,
unresize: true,
align: "center",
templet: function (d) { templet: function (d) {
return (page - 1) * limit + d.LAY_INDEX; return (page - 1) * limit + d.LAY_INDEX;
} },
},
{field: "towerName", title: "杆塔号", unresize: true, align: "center",
templet: function (d) {
return d.towerName+"-"+d.nextTowerName;
}
},
{field: "", title: "跨越类型", unresize: true, align: "center",
templet: function (d) {
if(d.spanType == 1){
return '跨线路';
}else if(d.spanType == 2){
return '跨公路';
}else if(d.spanType == 3){
return '跨铁路';
}
}
},
{field: "", title: "跨越信息", unresize: true, align: "center",
templet: function (d) {
if(d.spanType == 1){
var html = '';
html+="上层线路:" + d.upperLine + "<br><br>";
html+="下层线路:" + d.lowerLine + "<br><br>";
html+="交叉角度:" + d.intersectionAngle + "<br><br>";
html+="垂直距离:" + d.verticalDistance + "(m)<br><br>";
html+="安全裕度:" + d.safetyMargin + "(°)<br><br>";
return html;
}else if(d.spanType == 2){
var html = '';
html+="垂直净距:" + d.verticalClearDistance + "(m)<br><br>";
html+="杆塔间距:" + d.towerSpacing + "(m)<br><br>";
html+="公路宽度:" + d.highwayWidth + "(m)<br><br>";
return html;
}else if(d.spanType == 3){
var html = '';
html+="垂直净距:" + d.verticalClearDistance + "(m)<br><br>";
html+="杆塔间距:" + d.towerSpacing + "(m)<br><br>";
html+="交叉角度:" + d.intersectionAngle + "(°)<br><br>";
return html;
}
}
}, },
{ {
title: "操作", unresize: true, width: 200, align: "center", field: "towerName",
title: "杆塔号",
unresize: true,
align: "center",
templet: function (d) { templet: function (d) {
let html = ''; return d.towerName + "-" + d.nextTowerName;
let encodedTowerList = encodeURIComponent(JSON.stringify(d.tbSpanTowerList)); },
let del = "<a class=\"layui-icon layui-icon-delete\" style='cursor:pointer;' title='删除' onclick=\"delData('" + d.id + "', '" + encodedTowerList + "')\">删除</a>"; },
let edit = "<a class=\"layui-icon layui-icon-edit\" style='cursor:pointer;' title='修改' onclick=\"addData('" + d.id + "')\">修改</a>"; {
field: "",
title: "跨越类型",
unresize: true,
align: "center",
templet: function (d) {
if (d.spanType == 1) {
return "跨线路";
} else if (d.spanType == 2) {
return "跨公路";
} else if (d.spanType == 3) {
return "跨铁路";
}
},
},
{
field: "",
title: "跨越信息",
unresize: true,
align: "center",
templet: function (d) {
if (d.spanType == 1) {
var html = "";
html += "上层线路:" + d.upperLine + "<br><br>";
html += "下层线路:" + d.lowerLine + "<br><br>";
html +=
"交叉角度:" + d.intersectionAngle + "<br><br>";
html +=
"垂直距离:" +
d.verticalDistance +
"(m)<br><br>";
html +=
"安全裕度:" + d.safetyMargin + "(°)<br><br>";
return html;
} else if (d.spanType == 2) {
var html = "";
html +=
"垂直净距:" +
d.verticalClearDistance +
"(m)<br><br>";
html +=
"杆塔间距:" + d.towerSpacing + "(m)<br><br>";
html +=
"公路宽度:" + d.highwayWidth + "(m)<br><br>";
return html;
} else if (d.spanType == 3) {
var html = "";
html +=
"垂直净距:" +
d.verticalClearDistance +
"(m)<br><br>";
html +=
"杆塔间距:" + d.towerSpacing + "(m)<br><br>";
html +=
"交叉角度:" +
d.intersectionAngle +
"(°)<br><br>";
return html;
}
},
},
{
title: "操作",
unresize: true,
width: 200,
align: "center",
templet: function (d) {
let html = "";
let encodedTowerList = encodeURIComponent(
JSON.stringify(d.tbSpanTowerList)
);
let del =
"<a class=\"layui-icon layui-icon-delete\" style='cursor:pointer;' title='删除' onclick=\"delData('" +
d.id +
"', '" +
encodedTowerList +
"')\">删除</a>";
let edit =
"<a class=\"layui-icon layui-icon-edit\" style='cursor:pointer;' title='修改' onclick=\"addData('" +
d.id +
"')\">修改</a>";
html = edit + del; html = edit + del;
if (d.delFlag == 1) { if (d.delFlag == 1) {
return ''; return "";
} }
return html; return html;
} },
}, },
], ],
], ],
done: function (res, curr, count) { done: function (res, curr, count) {
layer.close(loadingMsg); layer.close(loadingMsg);
table.resize("table_data"); table.resize("table_data");
count || this.elem.next(".layui-table-view").find(".layui-table-header").css("display", "inline-block"); count ||
count || this.elem.next(".layui-table-view").find(".layui-table-box").css("overflow", "auto"); this.elem
.next(".layui-table-view")
.find(".layui-table-header")
.css("display", "inline-block");
count ||
this.elem
.next(".layui-table-view")
.find(".layui-table-box")
.css("overflow", "auto");
}, },
}); });
} }
// 获取参数 // 获取参数
function getReqParams(page, limit, type) { function getReqParams(page, limit, type) {
let obj = {}; let obj = {};
if (type === 2) { if (type === 2) {
$('#keyWord').val('') $("#keyWord").val("");
layui.form.render(); layui.form.render();
} }
obj = { obj = {
page: page + "", page: page + "",
limit: limit + "", limit: limit + "",
proId: idParam, proId: idParam,
keyWord: $('#keyWord').val() keyWord: $("#keyWord").val(),
};
console.log("杆塔管理查询条件", obj);
obj = {
encryptedData: encryptCBC(JSON.stringify(obj)),
}; };
console.log("杆塔管理查询条件", obj)
obj={
encryptedData:encryptCBC(JSON.stringify(obj))
}
return obj; return obj;
} }
// 查询/重置 // 查询/重置
function query(type) { function query(type) {
pageNum = 1; pageNum = 1;
if(type === 2){ if (type === 2) {
$('#keyWord').val('') $("#keyWord").val("");
layui.form.render(); layui.form.render();
} }
pages(1, limitSize,type); pages(1, limitSize, type);
} }
function reloadData() { function reloadData() {
@ -173,21 +236,35 @@ function reloadData() {
// 修改用户 // 修改用户
function addData(id) { function addData(id) {
let title = '修改' let title = "修改";
let param = { let param = {
'id': id, id: id,
'proId':idParam proId: idParam,
} };
openIframe2("editPro", title, "threeSpanFormTemp.html", '1000px', '625px', param); openIframe2(
"addDataThreeSpan",
title,
"threeSpanFormTemp.html",
"1000px",
"625px",
param
);
} }
function addDataThreeSpan(id) { function addDataThreeSpan(id) {
let title = '新增' let title = "新增";
let param = { let param = {
'id': id, id: id,
'proId':idParam proId: idParam,
} };
openIframe2("addDataThreeSpan", title, "threeSpanFormTemp.html", '1000px', '625px', param); openIframe2(
"addDataThreeSpan",
title,
"threeSpanFormTemp.html",
"1000px",
"625px",
param
);
} }
/*删除用户*/ /*删除用户*/
@ -195,58 +272,82 @@ function delData(id, tbSpanTowerList) {
// 将字符串转回对象 // 将字符串转回对象
try { try {
// 处理可能的编码问题 // 处理可能的编码问题
tbSpanTowerList = tbSpanTowerList.replace(/[\u0000-\u0019]+/g,""); // 移除不可见字符 tbSpanTowerList = tbSpanTowerList.replace(/[\u0000-\u0019]+/g, ""); // 移除不可见字符
tbSpanTowerList = JSON.parse(tbSpanTowerList); tbSpanTowerList = JSON.parse(tbSpanTowerList);
} catch(e) { } catch (e) {
tbSpanTowerList = []; tbSpanTowerList = [];
} }
layer.confirm("确定删除吗?", { layer.confirm(
move: false "确定删除吗?",
}, function () { {
let loadingMsg = layer.msg('数据删除中,请稍候...', {icon: 16, scrollbar: false, time: 0}); move: false,
let url = dataUrl + "/tbThreeSpan/delTbThreeSpan"; },
let params = { function () {
'id': id, let loadingMsg = layer.msg("数据删除中,请稍候...", {
'tbSpanTowerList': tbSpanTowerList icon: 16,
scrollbar: false,
time: 0,
});
let url = dataUrl + "/tbThreeSpan/delTbThreeSpan";
let params = {
id: id,
tbSpanTowerList: tbSpanTowerList,
};
params = {
encryptedData: encryptCBC(JSON.stringify(params)),
};
ajaxRequest(
url,
"POST",
params,
true,
function () {},
function (result) {
layer.close(loadingMsg);
if (result.code === 200) {
layer.msg(result.msg, { icon: 1 });
setTimeout(function () {
parent.reloadData();
query();
}, 3000);
} else {
layer.alert(result.msg, { icon: 2 });
}
},
function (xhr) {
layer.close(loadingMsg);
error(xhr);
}
);
} }
params = { );
encryptedData: encryptCBC(JSON.stringify(params))
}
ajaxRequest(url, "POST", params, true, function () {
}, function (result) {
layer.close(loadingMsg);
if (result.code === 200) {
layer.msg(result.msg, {icon: 1});
setTimeout(function () {
parent.reloadData();
query();
}, 3000);
} else {
layer.alert(result.msg, {icon: 2});
}
}, function (xhr) {
layer.close(loadingMsg);
error(xhr);
});
});
} }
function exportThreeSpan(){ function exportThreeSpan() {
let obj = { let obj = {
keyWord: $('#keyWord').val(), keyWord: $("#keyWord").val(),
proId: idParam proId: idParam,
} };
let params = { let params = {
encryptedData: encryptCBC(JSON.stringify(obj)) encryptedData: encryptCBC(JSON.stringify(obj)),
} };
let loadingMsg = layer.msg("数据导出中,请稍候...", {icon: 16, scrollbar: false, time: 0,}); let loadingMsg = layer.msg("数据导出中,请稍候...", {
let url = dataUrl + "/tbThreeSpan/tbProjectExport?token=" + tokens + "&encryptedData=" + encodeURIComponent(encryptCBC(JSON.stringify(obj))); icon: 16,
scrollbar: false,
time: 0,
});
let url =
dataUrl +
"/tbThreeSpan/tbProjectExport?token=" +
tokens +
"&encryptedData=" +
encodeURIComponent(encryptCBC(JSON.stringify(obj)));
let xhr = new XMLHttpRequest(); let xhr = new XMLHttpRequest();
xhr.open("post", url, true); xhr.open("post", url, true);
xhr.responseType = "blob"; // 转换流 xhr.responseType = "blob"; // 转换流
xhr.setRequestHeader('Content-Type','application/json;charset=UTF-8') xhr.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
xhr.onload = function () { xhr.onload = function () {
layer.close(loadingMsg); layer.close(loadingMsg);
if (this.status === 200) { if (this.status === 200) {
@ -256,11 +357,15 @@ function exportThreeSpan(){
a.href = url; a.href = url;
a.download = "三跨管理" + ".xlsx"; // 文件名 a.download = "三跨管理" + ".xlsx"; // 文件名
} else { } else {
layer.msg("数据导出发生异常,请稍后重试", {icon: 16, scrollbar: false, time: 2000}); layer.msg("数据导出发生异常,请稍后重试", {
icon: 16,
scrollbar: false,
time: 2000,
});
} }
a.click(); a.click();
window.URL.revokeObjectURL(url); window.URL.revokeObjectURL(url);
}; };
// xhr.send(params); // xhr.send(params);
xhr.send(); xhr.send();
} }

View File

@ -59,7 +59,7 @@ const legendData = [
{ {
name: "架线施工", name: "架线施工",
value: 0, value: 0,
icon: "../../img/digitalSignage/line_yellow.png", icon: "../../img/digitalSignage/line_y.png",
}, },
// { // {
// name: "架线施工完成", // name: "架线施工完成",
@ -69,7 +69,7 @@ const legendData = [
{ {
name: "架线施工完成", name: "架线施工完成",
value: 0, value: 0,
icon: "../../img/digitalSignage/line_red.png", icon: "../../img/digitalSignage/line_r.png",
}, },
{ {
name: "附件安装完成", name: "附件安装完成",
@ -711,13 +711,17 @@ function addAllMapPoints() {
<span>${pointData.time7 || "/"}</span> <span>${pointData.time7 || "/"}</span>
</div> </div>
<div class="map-container-item"> <div class="map-container-item">
<span>架线施工完成</span> <span>架线施工</span>
<span>${pointData.time8 || "/"}</span> <span>${pointData.time8 || "/"}</span>
</div> </div>
<div class="map-container-item"> <div class="map-container-item">
<span>附件安装完成</span> <span>架线施工完成</span>
<span>${pointData.time9 || "/"}</span> <span>${pointData.time9 || "/"}</span>
</div> </div>
<div class="map-container-item">
<span>附件安装完成</span>
<span>${pointData.time10 || "/"}</span>
</div>
</div>`; </div>`;
const infoWindow = new BMapGL.InfoWindow(infoContent, { const infoWindow = new BMapGL.InfoWindow(infoContent, {
@ -858,19 +862,25 @@ function addAllMapPoints() {
<span> <span>
${pointData.towerInfoVo.time7 || "/"} ${pointData.towerInfoVo.time7 || "/"}
</span> </span>
</div> </div>
<div class="map-container-item"> <div class="map-container-item">
<span>架线施工完成</span> <span>架线施工</span>
<span> <span>
${pointData.towerInfoVo.time8 || "/"} ${pointData.towerInfoVo.time8 || "/"}
</span> </span>
</div> </div>
<div class="map-container-item"> <div class="map-container-item">
<span>附件安装完成</span> <span>架线施工完成</span>
<span> <span>
${pointData.towerInfoVo.time9 || "/"} ${pointData.towerInfoVo.time9 || "/"}
</span> </span>
</div> </div>
<div class="map-container-item">
<span>附件安装完成</span>
<span>
${pointData.towerInfoVo.time10 || "/"}
</span>
</div>
</div> </div>
<div class="map-container-2 map-container"> <div class="map-container-2 map-container">
<h4> <h4>

View File

@ -0,0 +1,57 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="../../../../js/layui-v2.9.14/layui/css/layui.css">
<link rel="stylesheet" href="../../../../css/font.css">
<link rel="stylesheet" href="../../../../css/synthesisQuery/setLonAndLat.css">
<script src="../../../../js/libs/jquery-3.7.0.min.js" charset="UTF-8" type="text/javascript"></script>
<script src="../../../../js/layui-v2.9.14/layui/layui.js" charset="UTF-8" type="text/javascript"></script>
<script src="../../../../js/publicJs.js"></script>
<script src="../../../../js/commonUtils.js"></script>
<script src="../../../../js/openIframe.js"></script>
<script src="../../../../js/my/aes.js"></script>
<script src="../../../../js/ajaxRequest.js"></script>
<script type="text/javascript" src="//api.map.baidu.com/api?type=webgl&v=3.0&ak=cClgLBaLgGUdQDilX9dGvieL"></script>
<title>配置公路口、中转口经纬度</title>
</head>
<style>
.custom-info-window {
background: rgba(0, 0, 0, 0.5);
color: white;
padding: 10px;
border-radius: 4px;
box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.3);
border: none;
min-width: 150px;
font-family: Arial, sans-serif;
}
.BMap_bubble_pop .BMap_bubble_arrow {
display: none !important;
}
</style>
<body>
<div id="main-box" class="layout">
<div id="map-box">
</div>
<div class="btn-box layout">
<p style="color: red;font-size: 16px;font-weight: bold;">提示:第一个点表示首个杆塔,至少需要两个杆塔,最后一个点表示最后一个杆塔</p>
<div>
<button class="layui-btn layui-btn-norma save" id="viewPoint">预览标点连线</button>
<button class="layui-btn layui-btn-norma save" onclick="saveData()">保存</button>
<button class="layui-btn layui-btn-primary cancel" id="clearMarkers">清空标点</button>
<button class="layui-btn layui-btn-primary cancel" onclick="closePage()">取消</button>
</div>
</div>
</div>
</div>
</body>
<script src="../../../../js/basic/lineManagement/child/setSpanTowerLonAndLat.js" charset="UTF-8"
type="text/javascript"></script>
</html>

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>
@ -19,16 +20,20 @@
.layui-form-item { .layui-form-item {
margin-bottom: 15px; margin-bottom: 15px;
} }
.layui-input-inline { .layui-input-inline {
width: 420px; width: 420px;
} }
.required-mark { .required-mark {
color: #FF5722; color: #FF5722;
} }
.span-type-options { .span-type-options {
display: flex; display: flex;
gap: 15px; gap: 15px;
} }
.span-type-option { .span-type-option {
padding: 8px 20px; padding: 8px 20px;
border: 1px solid #e6e6e6; border: 1px solid #e6e6e6;
@ -36,225 +41,224 @@
cursor: pointer; cursor: pointer;
background: #fff; background: #fff;
} }
.span-type-option.active { .span-type-option.active {
background: #ecf5ff; background: #ecf5ff;
border-color: #409eff; border-color: #409eff;
color: #409eff; color: #409eff;
} }
.layui-form-mid{
.layui-form-mid {
padding: 0px !important; padding: 0px !important;
} }
</style> </style>
</head> </head>
<body> <body>
<div id="main-box"> <div id="main-box">
<form class="layui-form" lay-filter="threeSpanForm" onsubmit="return false;"> <form class="layui-form" lay-filter="threeSpanForm" onsubmit="return false;">
<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-block span-type-options"> <div class="layui-input-block span-type-options">
<div class="span-type-option active" data-type="cross-line">跨线路</div> <div class="span-type-option active" data-type="cross-line">跨线路</div>
<div class="span-type-option" data-type="cross-public">跨公路</div> <div class="span-type-option" data-type="cross-public">跨公路</div>
<div class="span-type-option" data-type="cross-railway">跨铁路</div> <div class="span-type-option" data-type="cross-railway">跨铁路</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span class="required-mark">*</span>杆塔:</label>
<div class="layui-input-inline" style="width: 30%;">
<select id="towerId" name="towerId" lay-verify="required" lay-filter="towerSelect">
</select>
</div>
<div class="layui-form-mid layui-word-aux" >
<select id="nextTowerName" name="nextTowerName">
</select>
</div>
<input type="hidden" id="nextTowerId" name="nextTowerId">
<!-- <input type="text" id="nextTowerName" name="nextTowerName">-->
</div>
<!-- 跨线路字段 -->
<div id="crossLineFields" >
<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="upperLine" 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-inline" style="width: 30%;">
<input type="text" name="lowerLine" lay-verify="required" autocomplete="off" <select id="towerId" name="towerId" lay-verify="required" lay-filter="towerSelect">
placeholder="请输入下层线路" class="layui-input" maxlength="30">
</select>
</div> </div>
<div class="layui-form-mid layui-word-aux">
<select id="nextTowerName" name="nextTowerName">
</select>
</div>
<input type="hidden" id="nextTowerId" name="nextTowerId">
<!-- <input type="text" id="nextTowerName" name="nextTowerName">-->
</div> </div>
<div class="layui-form-item"> <!-- 跨线路字段 -->
<label class="layui-form-label"><span class="required-mark">*</span>交叉角度:</label> <div id="crossLineFields">
<div class="layui-input-inline"> <div class="layui-form-item">
<input type="text" name="intersectionAngle1" <label class="layui-form-label"><span class="required-mark">*</span>上层线路:</label>
lay-verify="required|number" <div class="layui-input-inline">
autocomplete="off" <input type="text" name="upperLine" lay-verify="required" autocomplete="off"
placeholder="请输入交叉角度" placeholder="请输入上层线路" class="layui-input" maxlength="30">
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>垂直距离(m):</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="verticalDistance" lay-verify="required|number" autocomplete="off" <input type="text" name="lowerLine" lay-verify="required" autocomplete="off"
placeholder="请输入垂直距离" class="layui-input" maxlength="30"> 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-inline">
<input type="text" name="safetyMargin" lay-verify="required|number" autocomplete="off" <input type="text" name="intersectionAngle1" lay-verify="required|number" autocomplete="off"
placeholder="请输入安全裕度" class="layui-input" maxlength="30"> 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>垂直距离(m):</label>
<label class="layui-form-label">跨越杆塔信息</label> <div class="layui-input-inline">
</div> <input type="text" name="verticalDistance" lay-verify="required|number" autocomplete="off"
placeholder="请输入垂直距离" class="layui-input" maxlength="30">
</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>
<input type="hidden" name="id1"> <div class="layui-input-inline">
<div class="layui-input-inline" style="width: 260px;"> <input type="text" name="safetyMargin" lay-verify="required|number" autocomplete="off"
<input type="text" name="crossTowerLongitude1" autocomplete="off" placeholder="请输入安全裕度" class="layui-input" maxlength="30">
placeholder="请输入经度大约73.55°E至135.08°E" </div>
class="layui-input" maxlength="10" lay-verify="required|longitude" >
</div> </div>
<div class="layui-input-inline" style="width: 260px; margin-right: 0;">
<input type="text" name="crossTowerLatitude1" autocomplete="off"
placeholder="请输入纬度大约4°N至53°N"
class="layui-input" maxlength="10" lay-verify="required|latitude">
</div>
<div class="layui-form-mid" style="padding: 10px 10px !important;">1</div>
</div>
<div class="layui-form-item"> <!-- 跨越杆塔经纬度信息 -->
<label class="layui-form-label"><span class="required-mark">*</span>跨越杆塔经纬度:</label> <div class="layui-form-item">
<input type="hidden" name="id2"> <label class="layui-form-label">跨越杆塔信息</label>
<div class="layui-input-inline" style="width: 260px;">
<input type="text" name="crossTowerLongitude2" autocomplete="off"
placeholder="请输入经度大约73.55°E至135.08°E"
class="layui-input" maxlength="10" lay-verify="required|longitude">
</div> </div>
<div class="layui-input-inline" style="width: 260px; margin-right: 0;">
<input type="text" name="crossTowerLatitude2" autocomplete="off"
placeholder="请输入纬度大约4°N至53°N"
class="layui-input" maxlength="10" lay-verify="required|latitude">
</div>
<div class="layui-form-mid" style="padding: 10px 10px !important;">2</div>
</div>
<div class="layui-form-item"> <div class="span-tower-info">
<label class="layui-form-label">跨越杆塔经纬度:</label>
<input type="hidden" name="id3">
<div class="layui-input-inline" style="width: 260px;">
<input type="text" name="crossTowerLongitude3" autocomplete="off"
placeholder="请输入经度大约73.55°E至135.08°E"
class="layui-input" maxlength="10" lay-verify="longitude">
</div>
<div class="layui-input-inline" style="width: 260px; margin-right: 0;">
<input type="text" name="crossTowerLatitude3" autocomplete="off"
placeholder="请输入纬度大约4°N至53°N"
class="layui-input" maxlength="10" lay-verify="latitude">
</div>
<div class="layui-form-mid" style="padding: 10px 10px !important;">3</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">跨越杆塔经纬度:</label>
<input type="hidden" name="id4">
<div class="layui-input-inline" style="width: 260px;">
<input type="text" name="crossTowerLongitude4" autocomplete="off"
placeholder="请输入经度大约73.55°E至135.08°E"
class="layui-input" maxlength="10" lay-verify="longitude">
</div> </div>
<div class="layui-input-inline" style="width: 260px; margin-right: 0;">
<input type="text" name="crossTowerLatitude4" autocomplete="off" <!-- <div class="layui-form-item">
placeholder="请输入纬度大约4°N至53°N" <label class="layui-form-label"><span class="required-mark">*</span>跨越杆塔经纬度:</label>
class="layui-input" maxlength="10" lay-verify="latitude"> <input type="hidden" name="id1">
<div class="layui-input-inline" style="width: 260px;">
<input type="text" name="crossTowerLongitude1" autocomplete="off" " class=" layui-input"
lay-verify="required|longitude" disabled>
</div>
<div class="layui-input-inline" style="width: 260px; margin-right: 0;">
<input type="text" name="crossTowerLatitude1" autocomplete="off" "
class=" layui-input" lay-verify="required|latitude" disabled>
</div>
<div class="layui-form-mid" style="padding: 10px 10px !important;">1</div>
</div> </div>
<div class="layui-form-mid" style="padding: 10px 10px !important;">4</div>
</div>
</div>
<!-- 跨公路字段 --> <div class="layui-form-item">
<div id="crossPublicFields" style="display: none;"> <label class="layui-form-label"><span class="required-mark">*</span>跨越杆塔经纬度:</label>
<div class="layui-form-item"> <input type="hidden" name="id2">
<label class="layui-form-label"><span class="required-mark">*</span>垂直净距(m):</label> <div class="layui-input-inline" style="width: 260px;">
<div class="layui-input-inline"> <input type="text" name="crossTowerLongitude2" autocomplete="off" " class=" layui-input"
<input type="text" name="verticalClearDistance2" autocomplete="off" lay-verify="required|longitude" disabled>
placeholder="请输入垂直净距" class="layui-input" lay-verify="required|number" maxlength="30"> </div>
<div class="layui-input-inline" style="width: 260px; margin-right: 0;">
<input type="text" name="crossTowerLatitude2" autocomplete="off" "
class=" layui-input" lay-verify="required|latitude" disabled>
</div>
<div class="layui-form-mid" style="padding: 10px 10px !important;">2</div>
</div> </div>
</div>
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label"><span class="required-mark">*</span>杆塔间距(m):</label> <label class="layui-form-label">跨越杆塔经纬度:</label>
<div class="layui-input-inline"> <input type="hidden" name="id3">
<input type="text" name="towerSpacing2" lay-verify="required|number" autocomplete="off" <div class="layui-input-inline" style="width: 260px;">
placeholder="请输入杆塔间距" class="layui-input" maxlength="30"> <input type="text" name="crossTowerLongitude3" autocomplete="off" " class=" layui-input"
lay-verify="longitude" disabled>
</div>
<div class="layui-input-inline" style="width: 260px; margin-right: 0;">
<input type="text" name="crossTowerLatitude3" autocomplete="off" "
class=" layui-input" lay-verify="latitude" disabled>
</div>
<div class="layui-form-mid" style="padding: 10px 10px !important;">3</div>
</div> </div>
</div>
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label"><span class="required-mark">*</span>公路宽度(m):</label> <label class="layui-form-label">跨越杆塔经纬度:</label>
<div class="layui-input-inline"> <input type="hidden" name="id4">
<input type="text" name="highwayWidth" lay-verify="required|number" autocomplete="off" <div class="layui-input-inline" style="width: 260px;">
placeholder="请输入公路宽度" class="layui-input" maxlength="30"> <input type="text" name="crossTowerLongitude4" autocomplete="off" " class=" layui-input"
lay-verify="longitude" disabled>
</div>
<div class="layui-input-inline" style="width: 260px; margin-right: 0;">
<input type="text" name="crossTowerLatitude4" autocomplete="off" "
class=" layui-input" lay-verify="latitude" disabled>
</div>
<div class="layui-form-mid" style="padding: 10px 10px !important;">4</div>
</div> </div>
</div> </div> -->
</div>
<!-- 跨铁路字段 --> <!-- 跨公路字段 -->
<div id="crossRailwayFields" style="display: none;"> <div id="crossPublicFields" style="display: none;">
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label"><span class="required-mark">*</span>垂直净距(m):</label> <label class="layui-form-label"><span class="required-mark">*</span>垂直净距(m):</label>
<div class="layui-input-inline"> <div class="layui-input-inline">
<input type="text" name="verticalClearDistance3" lay-verify="required|number" autocomplete="off" <input type="text" name="verticalClearDistance2" autocomplete="off" placeholder="请输入垂直净距"
placeholder="请输入垂直净距" class="layui-input" maxlength="30"> class="layui-input" lay-verify="required|number" maxlength="30">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span class="required-mark">*</span>杆塔间距(m):</label>
<div class="layui-input-inline">
<input type="text" name="towerSpacing2" 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>公路宽度(m):</label>
<div class="layui-input-inline">
<input type="text" name="highwayWidth" lay-verify="required|number" autocomplete="off"
placeholder="请输入公路宽度" class="layui-input" maxlength="30">
</div>
</div>
</div> </div>
</div>
<div class="layui-form-item"> <!-- 跨铁路字段 -->
<label class="layui-form-label"><span class="required-mark">*</span>杆塔间距(m):</label> <div id="crossRailwayFields" style="display: none;">
<div class="layui-input-inline"> <div class="layui-form-item">
<input type="text" name="towerSpacing3" lay-verify="required|number" autocomplete="off" <label class="layui-form-label"><span class="required-mark">*</span>垂直净距(m):</label>
placeholder="请输入杆塔间距" class="layui-input" maxlength="30"> <div class="layui-input-inline">
<input type="text" name="verticalClearDistance3" 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>杆塔间距(m):</label>
<div class="layui-input-inline">
<input type="text" name="towerSpacing3" 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="intersectionAngle3" lay-verify="required|number" autocomplete="off"
placeholder="请输入交叉角度" class="layui-input" maxlength="30">
</div>
</div>
</div> </div>
</div>
<div class="layui-form-item"> <button type="submit" id="formSubmit" class="layui-btn" lay-submit lay-filter="formData"
<label class="layui-form-label"><span class="required-mark">*</span>交叉角度(°):</label> style="display: none;"></button>
<div class="layui-input-inline"> </form>
<input type="text" name="intersectionAngle3" lay-verify="required|number" autocomplete="off" </div>
placeholder="请输入交叉角度" class="layui-input" maxlength="30">
</div>
</div>
</div>
<button type="submit" id="formSubmit" class="layui-btn" lay-submit lay-filter="formData" <div class="btn-box">
style="display: none;"></button> <button class="layui-btn layui-btn-normal save" onclick="setSpanTowerLonAndLatData()">配置跨越杆塔经纬度</button>
</form> <button class="layui-btn layui-btn-normal save" onclick="saveData2()">确定</button>
</div> <button class="layui-btn layui-btn-primary cancel" onclick="closePage()">取消</button>
</div>
<div class="btn-box">
<button class="layui-btn layui-btn-normal save" onclick="saveData2()">确定</button>
<button class="layui-btn layui-btn-primary cancel" onclick="closePage()">取消</button>
</div>
</body> </body>
<script src="../../../../js/openIframe.js"></script>
<script src="../../../../js/basic/lineManagement/child/threeSpanFormTemp.js"></script> <script src="../../../../js/basic/lineManagement/child/threeSpanFormTemp.js"></script>
</html> </html>