diff --git a/src/main/java/com/bonus/digitalSignage/basic/controller/TbTowerController.java b/src/main/java/com/bonus/digitalSignage/basic/controller/TbTowerController.java index de0566f..f40f660 100644 --- a/src/main/java/com/bonus/digitalSignage/basic/controller/TbTowerController.java +++ b/src/main/java/com/bonus/digitalSignage/basic/controller/TbTowerController.java @@ -52,4 +52,17 @@ public class TbTowerController { public ServerResponse getTbTowerById(EncryptedReq dto) { return tbTowerService.getTbTowerById(dto.getData()); } + + /** + * 杆塔管理-新增 + * @param dto + * @return + */ + @PostMapping(value = "addTbTower") + @DecryptAndVerify(decryptedClass = TbTowerVo.class)//加解密统一管理 + @LogAnnotation(operModul = "杆塔管理-新增", operation = "新增", operDesc = "系统级事件",operType="查询") + public ServerResponse addTbTower(EncryptedReq dto) { + return tbTowerService.addTbTower(dto.getData()); + } + } diff --git a/src/main/java/com/bonus/digitalSignage/basic/dao/TbTowerMapper.java b/src/main/java/com/bonus/digitalSignage/basic/dao/TbTowerMapper.java index fa2eb89..6341108 100644 --- a/src/main/java/com/bonus/digitalSignage/basic/dao/TbTowerMapper.java +++ b/src/main/java/com/bonus/digitalSignage/basic/dao/TbTowerMapper.java @@ -8,4 +8,8 @@ public interface TbTowerMapper { List getTbProjectList(TbTowerVo data); TbTowerVo getTbTowerById(TbTowerVo data); + + void addTbTower(TbTowerVo data); + + TbTowerVo getTbTowerBySort(TbTowerVo data); } diff --git a/src/main/java/com/bonus/digitalSignage/basic/service/TbTowerService.java b/src/main/java/com/bonus/digitalSignage/basic/service/TbTowerService.java index 2a2e1aa..3093160 100644 --- a/src/main/java/com/bonus/digitalSignage/basic/service/TbTowerService.java +++ b/src/main/java/com/bonus/digitalSignage/basic/service/TbTowerService.java @@ -17,4 +17,11 @@ public interface TbTowerService { * @return */ ServerResponse getTbTowerById(TbTowerVo data); + + /** + * 杆塔管理-新增 + * @param data + * @return + */ + ServerResponse addTbTower(TbTowerVo data); } diff --git a/src/main/java/com/bonus/digitalSignage/basic/service/impl/TbTowerServiceImpl.java b/src/main/java/com/bonus/digitalSignage/basic/service/impl/TbTowerServiceImpl.java index 47deede..c621787 100644 --- a/src/main/java/com/bonus/digitalSignage/basic/service/impl/TbTowerServiceImpl.java +++ b/src/main/java/com/bonus/digitalSignage/basic/service/impl/TbTowerServiceImpl.java @@ -4,12 +4,17 @@ import com.bonus.digitalSignage.basic.dao.TbTowerMapper; import com.bonus.digitalSignage.basic.service.TbTowerService; import com.bonus.digitalSignage.basic.vo.TbProjectVo; import com.bonus.digitalSignage.basic.vo.TbTowerVo; +import com.bonus.digitalSignage.utils.CoordinateConverter; import com.bonus.digitalSignage.utils.ServerResponse; +import com.bonus.digitalSignage.utils.StrUtil; +import com.bonus.digitalSignage.utils.UserUtil; +import com.bonus.digitalSignage.webResult.StringUtils; import com.github.pagehelper.PageInfo; import lombok.extern.slf4j.Slf4j; import org.springframework.stereotype.Service; import javax.annotation.Resource; +import java.util.Date; import java.util.List; /** @@ -55,4 +60,41 @@ public class TbTowerServiceImpl implements TbTowerService { return ServerResponse.createErroe("杆塔管理-查询详情失败"); } } + + /** + * 杆塔管理-新增 + * @param data + * @return + */ + @Override + public ServerResponse addTbTower(TbTowerVo data) { + try { + //判断经纬度是否合法 + if(!StrUtil.isValidLongitude(Double.parseDouble(data.getLon())) || !StrUtil.isValidLatitude(Double.parseDouble(data.getLat()))){ + return ServerResponse.createErroe("请输入正确经纬度"); + } + TbTowerVo tbTower = tbTowerMapper.getTbTowerBySort(data); + if (StringUtils.isNotNull(tbTower)){ + return ServerResponse.createErroe("排序已存在"); + } + //判断新增塔杆的坐标系 1.WGS-84地心坐标系 2.2000国家大地坐标系 + if ("1".equals(data.getUploadType())){ + double[] bd09 =CoordinateConverter.wgs84ToBd09(Double.parseDouble(data.getLat()),Double.parseDouble(data.getLon())); + data.setBaiduLat(String.valueOf(bd09[0])); + data.setBaiduLon(String.valueOf(bd09[1])); + }else { + double[] bd09 =CoordinateConverter.cgcs2000ToBd09(Double.parseDouble(data.getLat()),Double.parseDouble(data.getLon())); + data.setBaiduLat(String.valueOf(bd09[0])); + data.setBaiduLon(String.valueOf(bd09[1])); + } + Long userId = UserUtil.getLoginUser().getId(); + data.setCreateUserId(userId); + data.setCreateTime(new Date()); + tbTowerMapper.addTbTower(data); + return ServerResponse.createSuccess("杆塔管理-新增成功"); + } catch (Exception e) { + log.error(e.toString(), e); + return ServerResponse.createErroe("杆塔管理-新增失败"); + } + } } diff --git a/src/main/java/com/bonus/digitalSignage/utils/CoordinateConverter.java b/src/main/java/com/bonus/digitalSignage/utils/CoordinateConverter.java new file mode 100644 index 0000000..3b595b1 --- /dev/null +++ b/src/main/java/com/bonus/digitalSignage/utils/CoordinateConverter.java @@ -0,0 +1,147 @@ +package com.bonus.digitalSignage.utils; + +/** + * @author 马三炮 + * @date 2025/4/25 + */ +public class CoordinateConverter { + private static final double PI = 3.14159265358979324; + private static final double X_PI = PI * 3000.0 / 180.0; + private static final double A = 6378245.0; + private static final double EE = 0.00669342162296594323; + + /** + * 判断是否在中国范围内 + * @param lat 纬度 + * @param lon 经度 + * @return 如果在中国范围内返回 true,否则返回 false + */ + private static boolean outOfChina(double lat, double lon) { + if (lon < 72.004 || lon > 137.8347) + return true; + if (lat < 0.8293 || lat > 55.8271) + return true; + return false; + } + + /** + * 转换纬度 + * @param x 经度 + * @param y 纬度 + * @return 转换后的纬度 + */ + private static double transformLat(double x, double y) { + double ret = -100.0 + 2.0 * x + 3.0 * y + 0.2 * y * y + 0.1 * x * y + 0.2 * Math.sqrt(Math.abs(x)); + ret += (20.0 * Math.sin(6.0 * x * PI) + 20.0 * Math.sin(2.0 * x * PI)) * 2.0 / 3.0; + ret += (20.0 * Math.sin(y * PI) + 40.0 * Math.sin(y / 3.0 * PI)) * 2.0 / 3.0; + ret += (160.0 * Math.sin(y / 12.0 * PI) + 320 * Math.sin(y * PI / 30.0)) * 2.0 / 3.0; + return ret; + } + + /** + * 转换经度 + * @param x 经度 + * @param y 纬度 + * @return 转换后的经度 + */ + private static double transformLon(double x, double y) { + double ret = 300.0 + x + 2.0 * y + 0.1 * x * x + 0.1 * x * y + 0.1 * Math.sqrt(Math.abs(x)); + ret += (20.0 * Math.sin(6.0 * x * PI) + 20.0 * Math.sin(2.0 * x * PI)) * 2.0 / 3.0; + ret += (20.0 * Math.sin(x * PI) + 40.0 * Math.sin(x / 3.0 * PI)) * 2.0 / 3.0; + ret += (150.0 * Math.sin(x / 12.0 * PI) + 300.0 * Math.sin(x / 30.0 * PI)) * 2.0 / 3.0; + return ret; + } + + /** + * WGS - 84 转换为 GCJ - 02 + * @param wgLat WGS - 84 纬度 + * @param wgLon WGS - 84 经度 + * @return 包含 GCJ - 02 纬度和经度的数组 + */ + public static double[] wgs84ToGcj02(double wgLat, double wgLon) { + /* if (outOfChina(wgLat, wgLon)) { + return new double[]{wgLat, wgLon}; + }*/ + double dLat = transformLat(wgLon - 105.0, wgLat - 35.0); + double dLon = transformLon(wgLon - 105.0, wgLat - 35.0); + double radLat = wgLat / 180.0 * PI; + double magic = Math.sin(radLat); + magic = 1 - EE * magic * magic; + double sqrtMagic = Math.sqrt(magic); + dLat = (dLat * 180.0) / ((A * (1 - EE)) / (magic * sqrtMagic) * PI); + dLon = (dLon * 180.0) / (A / sqrtMagic * Math.cos(radLat) * PI); + double mgLat = wgLat + dLat; + double mgLon = wgLon + dLon; + return new double[]{mgLat, mgLon}; + } + + /** + * GCJ - 02 转换为 BD - 09 + * @param ggLat GCJ - 02 纬度 + * @param ggLon GCJ - 02 经度 + * @return 包含 BD - 09 纬度和经度的数组 + */ + public static double[] gcj02ToBd09(double ggLat, double ggLon) { + double x = ggLon; + double y = ggLat; + double z = Math.sqrt(x * x + y * y) + 0.00002 * Math.sin(y * X_PI); + double theta = Math.atan2(y, x) + 0.000003 * Math.cos(x * X_PI); + double bdLon = z * Math.cos(theta) + 0.0065; + double bdLat = z * Math.sin(theta) + 0.006; + return new double[]{bdLat, bdLon}; + } + + /** + * WGS - 84 转换为 BD - 09 + * @param wgLat WGS - 84 纬度 + * @param wgLon WGS - 84 经度 + * @return 包含 BD - 09 纬度和经度的数组 + */ + public static double[] wgs84ToBd09(double wgLat, double wgLon) { + double[] gcj02 = wgs84ToGcj02(wgLat, wgLon); + return gcj02ToBd09(gcj02[0], gcj02[1]); + } + + + /** + * CGCS2000 转换为 GCJ - 02 + * @param cgLat CGCS2000 纬度 + * @param cgLon CGCS2000 经度 + * @return 包含 GCJ - 02 纬度和经度的数组 + */ + public static double[] cgcs2000ToGcj02(double cgLat, double cgLon) { + if (outOfChina(cgLat, cgLon)) { + return new double[]{cgLat, cgLon}; + } + double dLat = transformLat(cgLon - 105.0, cgLat - 35.0); + double dLon = transformLon(cgLon - 105.0, cgLat - 35.0); + double radLat = cgLat / 180.0 * PI; + double magic = Math.sin(radLat); + magic = 1 - EE * magic * magic; + double sqrtMagic = Math.sqrt(magic); + dLat = (dLat * 180.0) / ((A * (1 - EE)) / (magic * sqrtMagic) * PI); + dLon = (dLon * 180.0) / (A / sqrtMagic * Math.cos(radLat) * PI); + double mgLat = cgLat + dLat; + double mgLon = cgLon + dLon; + return new double[]{mgLat, mgLon}; + } + + /** + * CGCS2000 转换为 BD - 09 + * @param cgLat CGCS2000 纬度 + * @param cgLon CGCS2000 经度 + * @return 包含 BD - 09 纬度和经度的数组 + */ + public static double[] cgcs2000ToBd09(double cgLat, double cgLon) { + double[] gcj02 = cgcs2000ToGcj02(cgLat, cgLon); + return gcj02ToBd09(gcj02[0], gcj02[1]); + } + + public static void main(String[] args) { + double wgLat = 31.230416; + double wgLon = 121.473701; + double[] bd09 = wgs84ToBd09(wgLat, wgLon); + System.out.println("BD - 09 Latitude: " + bd09[0]); + System.out.println("BD - 09 Longitude: " + bd09[1]); + } +} diff --git a/src/main/java/com/bonus/digitalSignage/utils/StrUtil.java b/src/main/java/com/bonus/digitalSignage/utils/StrUtil.java index b4a58c9..35910b4 100644 --- a/src/main/java/com/bonus/digitalSignage/utils/StrUtil.java +++ b/src/main/java/com/bonus/digitalSignage/utils/StrUtil.java @@ -50,4 +50,21 @@ public class StrUtil { return buffer.toString(); } + /** + * 校验经度是否合法 + * @param longitude 经度值 + * @return 如果经度在合法范围内返回 true,否则返回 false + */ + public static boolean isValidLongitude(double longitude) { + return longitude >= -180 && longitude <= 180; + } + + /** + * 校验纬度是否合法 + * @param latitude 纬度值 + * @return 如果纬度在合法范围内返回 true,否则返回 false + */ + public static boolean isValidLatitude(double latitude) { + return latitude >= -90 && latitude <= 90; + } } diff --git a/src/main/resources/mappers/basic/TbTowerMapper.xml b/src/main/resources/mappers/basic/TbTowerMapper.xml index c3a5ad8..35ecbed 100644 --- a/src/main/resources/mappers/basic/TbTowerMapper.xml +++ b/src/main/resources/mappers/basic/TbTowerMapper.xml @@ -2,6 +2,37 @@ + + insert into tb_tower + + pro_id, + tower_name, + lon, + lat, + baidu_lon, + baidu_lat, + sort, + central_meridian, + upload_type, + create_time, + create_user, + is_actvice + + + #{proId}, + #{towerName}, + #{lon}, + #{lat}, + #{baiduLon}, + #{baiduLat}, + #{sort}, + #{centralMeridian}, + #{uploadType}, + #{createTime}, + #{createUser}, + 1 + + + diff --git a/src/main/resources/static/css/synthesisQuery/digitalSignage.css b/src/main/resources/static/css/synthesisQuery/digitalSignage.css index 2345732..bf9a5e7 100644 --- a/src/main/resources/static/css/synthesisQuery/digitalSignage.css +++ b/src/main/resources/static/css/synthesisQuery/digitalSignage.css @@ -54,8 +54,8 @@ body { .scroll-box { top: 15px; left: 15px; - width: 460px; - height: 180px; + width: 520px; + height: 200px; } .scroll-box-title, @@ -64,13 +64,13 @@ body { } .scroll-box-title { - height: 30px; - line-height: 30px; + height: 40px; + line-height: 40px; font-weight: bold; } .scroll-box-content { - height: 150px; + height: 160px; /* overflow-y: auto; */ overflow: hidden; } @@ -78,6 +78,7 @@ body { .flex-box { padding: 6px 0; display: flex; + align-items: center; box-sizing: border-box; } @@ -104,14 +105,31 @@ body { .content-item span { display: flex; - flex-direction: column; align-items: center; justify-content: center; } +.content-item span img { + width: 18px; + height: 18px; + margin-right: 4px; +} + +.content-item span:last-child { + display: flex; + flex-direction: column !important; + justify-content: center !important; + align-items: flex-start !important; +} + .content-item span i { padding: 1px 0; font-style: normal; + white-space: nowrap; /* 禁止换行 */ + overflow: hidden; /* 溢出隐藏 */ + text-overflow: ellipsis; /* 显示省略号 */ + display: inline-block; /* 必须设置宽度才能生效 */ + max-width: 100%; /* 限制最大宽度,防止撑开容器 */ } /* 左下角图例 */ @@ -163,6 +181,9 @@ body { font-size: 14px; } +.map-container-item-ropeway { + display: flex; +} .map-container-item span:first-child { width: 160px; } @@ -174,10 +195,15 @@ body { /* 索道信息窗口样式 */ .map-container-item-ropeway span:first-child { padding-left: 16px; + width: 100px; } .map-container-item-ropeway span:last-child { margin-left: 4px; - min-width: 120px; + width: 140px; + white-space: nowrap; /* 禁止换行 */ + overflow: hidden; /* 溢出隐藏 */ + text-overflow: ellipsis; /* 显示省略号 */ + display: inline-block; /* 必须设置宽度才能生效 */ } /* 交叉信息窗口样式 */ @@ -202,7 +228,7 @@ body { } .map-container-cross .map-container-2 h4 { - padding-left: 20px; + /* padding-left: 20px; */ } /* 右侧抽屉 */ @@ -272,3 +298,11 @@ body { .layui-tree-line .layui-tree-entry:hover .layui-tree-txt { color: #dfd8d8 !important; } + +.layui-tree-click { + background-color: #54b4e2 !important; /* 浅蓝色背景 */ + color: #1890ff !important; /* 蓝色文字 */ +} +.layui-icon { + color: #fff !important; +} diff --git a/src/main/resources/static/img/digitalSignage/project.png b/src/main/resources/static/img/digitalSignage/project.png new file mode 100644 index 0000000..6ec40af Binary files /dev/null and b/src/main/resources/static/img/digitalSignage/project.png differ diff --git a/src/main/resources/static/img/digitalSignage/warning.png b/src/main/resources/static/img/digitalSignage/warning.png new file mode 100644 index 0000000..f2dca3c Binary files /dev/null and b/src/main/resources/static/img/digitalSignage/warning.png differ diff --git a/src/main/resources/static/img/digitalSignage/zt_white.png b/src/main/resources/static/img/digitalSignage/zt_white.png new file mode 100644 index 0000000..251c58f Binary files /dev/null and b/src/main/resources/static/img/digitalSignage/zt_white.png differ diff --git a/src/main/resources/static/js/synthesisQuery/digitalSignage.js b/src/main/resources/static/js/synthesisQuery/digitalSignage.js index 8513b69..7a0f37f 100644 --- a/src/main/resources/static/js/synthesisQuery/digitalSignage.js +++ b/src/main/resources/static/js/synthesisQuery/digitalSignage.js @@ -1,4 +1,65 @@ -let map = null; +let map = null; // 地图实例 +let treeData = []; // 组织机构树数据 +let nodeId = ""; // 当前选中的节点ID +let cablewayList = []; // 索道列表 +let towerList = []; // 塔列表 +let crossingList = []; // 跨越列表 +let crossingListNew = []; // 跨越列表 +let intLng = 116.254; // 初始经度 +let intLat = 39.965; // 初始纬度 +// 图例数据 +const legendData = [ + { + name: "基础开挖", + value: 0, + icon: "../../img/digitalSignage/yellow.png", + }, + { + name: "开挖完成", + value: 0, + icon: "../../img/digitalSignage/green.png", + }, + { + name: "浇筑完成", + value: 0, + icon: "../../img/digitalSignage/blue.png", + }, + { + name: "铁塔组立", + value: 0, + icon: "../../img/digitalSignage/orange.png", + }, + { + name: "组塔完成", + value: 0, + icon: "../../img/digitalSignage/zt_red.png", + }, + { + name: "架线完成", + value: 0, + icon: "../../img/digitalSignage/zt_purple.png", + }, + { + name: "附件安装", + value: 0, + icon: "../../img/digitalSignage/zt_green.png", + }, + { + name: "未 开 始", + value: 0, + icon: "../../img/digitalSignage/white.png", + }, + { + name: "索道运输", + value: 0, + icon: "../../img/digitalSignage/sd.png", + }, + { + name: "项 目 部", + value: 0, + icon: "../../img/digitalSignage/project.png", + }, +]; // 地图配置项 const config = { @@ -69,59 +130,154 @@ const config = { }, ], polyline: { - strokeColor: "#3388ff", // 线条颜色 - strokeWeight: 3, // 线条宽度 - strokeOpacity: 0.8, // 透明度 + strokeWeight: 1, // 线条宽度 + strokeOpacity: 0.9, // 透明度 strokeStyle: "dashed", // solid(实线)或dashed(虚线) enableEditing: false, // 是否可编辑 enableClicking: true, // 是否可点击 }, }; +// 获取位置信息 +function getLocationInfo(id) { + const params = { + encryptedData: encryptCBC(JSON.stringify({ id })), + }; + ajaxRequest( + dataUrl + "/backstage/digitalSignage/getTowersInfo", + "POST", + params, + true, + function () {}, + function (result) { + console.log(result, "获取位置信息---"); + const { data } = result; + + if (data.cablewaTransVos.length > 0) { + cablewayList = data.cablewaTransVos; + } else { + cablewayList = []; + } + if (data.towerInfoVos.length > 0) { + towerList = data.towerInfoVos; + } else { + towerList = []; + } + if (data.spanInfoVos.length > 0) { + crossingList = data.spanInfoVos; + } else { + crossingList = []; + crossingListNew = []; + } + + // 处理一下交叉信息 + if (crossingList && crossingList.length > 0) { + crossingList.forEach((item) => { + const lonAndLatList = item.lonAndLat.split(","); + lonAndLatList.forEach((lonAndLat, index) => { + const lonAndLatItem = lonAndLat.split("@"); + crossingListNew.push({ + baiduLon: lonAndLatItem[0], + baiduLat: lonAndLatItem[1], + ...item, + }); + }); + }); + } + initMap(); + }, + function (xhr) { + error(xhr); + } + ); +} + // 百度地图初始化 function initMap() { + if (map) { + map = null; + } map = new BMapGL.Map("map-box"); // 以第一个点为中心初始化地图 - map.centerAndZoom( - new BMapGL.Point(config.points[0].lng, config.points[0].lat), - 11 - ); + map.centerAndZoom(new BMapGL.Point(intLng, intLat), 15); map.enableScrollWheelZoom(true); + 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" }, + }, - map.setMapStyleV2({ - // styleJson: [ - // { - // featureType: "background", - // elementType: "geometry", - // stylers: { - // color: "#f5f5f5", // 浅灰色背景 - // }, - // }, - // { - // featureType: "road", - // elementType: "geometry", - // 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" }, + }, + ]; + + map.setMapType(BMAP_EARTH_MAP); // 地球模式 + map.setDisplayOptions({ + poiText: false, // 隐藏POI文字 + poiIcon: false, // 隐藏POI图标 + building: false, // 隐藏建筑物 + }); + map.setMapStyleV2({ + styleJson, }); - // map.setMapType(BMAP_EARTH_MAP); // 地球模式 - // map.setDisplayOptions({ - // poiText: false, // 隐藏POI文字 - // poiIcon: false, // 隐藏POI图标 - // building: false, // 隐藏建筑物 - // }); // 添加地图控件(可选) // map.addControl(new BMapGL.NavigationControl()); // map.addControl(new BMapGL.ScaleControl()); // 地图加载完成后添加标点和折线 - map.addEventListener("tilesloaded", function () { + // map.addEventListener("tilesloaded", function () { + // addAllMapPoints(); + // addMapLine(); + // }); + + setTimeout(() => { addAllMapPoints(); addMapLine(); - }); + }, 500); } // 添加标点 @@ -129,7 +285,10 @@ function addAllMapPoints() { // 清除地图上所有现有的标记 map.clearOverlays(); + // const bounds = []; const bounds = []; + // 使用对象记录已添加的点,避免重复 + const addedPoints = {}; const iconTypeList = { 1: "/gzDigitalSignage/img/digitalSignage/yellow.png", 2: "/gzDigitalSignage/img/digitalSignage/green.png", @@ -140,239 +299,434 @@ function addAllMapPoints() { 7: "/gzDigitalSignage/img/digitalSignage/zt_green.png", 8: "/gzDigitalSignage/img/digitalSignage/white.png", 9: "/gzDigitalSignage/img/digitalSignage/sd.png", + 11: "/gzDigitalSignage/img/digitalSignage/zt_white.png", }; - // 使用对象记录已添加的点,避免重复 - const addedPoints = {}; + // 绘制索道标点 + if (cablewayList && cablewayList.length > 0) { + cablewayList.forEach((pointData, index) => { + const pointKey = `117.132663,31.877325`; + // const pointKey = `${pointData.baiduLon},${pointData.baiduLat}`; - config.points.forEach((pointData, index) => { - const pointKey = `${pointData.lng},${pointData.lat}`; + // 如果该坐标点已经添加过标记,则跳过 + if (addedPoints[pointKey]) { + console.warn(`重复的点坐标被跳过: ${pointKey}`); + return; + } - // 如果该坐标点已经添加过标记,则跳过 - if (addedPoints[pointKey]) { - console.warn(`重复的点坐标被跳过: ${pointKey}`); - return; - } + addedPoints[pointKey] = true; + // const point = new BMapGL.Point( + // pointData.baiduLon, + // pointData.baiduLat + // ); + const point = new BMapGL.Point(117.132663, 31.877325); + bounds.push(point); - addedPoints[pointKey] = true; - const point = new BMapGL.Point(pointData.lng, pointData.lat); - bounds.push(point); + // 检查图标是否存在,不存在则使用默认图标 + const iconUrl = iconTypeList[9]; // 默认使用第一个图标 + const myIcon = new BMapGL.Icon(iconUrl, new BMapGL.Size(40, 38), { + anchor: new BMapGL.Size(16, 20), // 修正锚点位置为中心底部 + imageSize: new BMapGL.Size(40, 38), // 与实际图片尺寸一致 + }); - // 检查图标是否存在,不存在则使用默认图标 - const iconUrl = iconTypeList[pointData.type] || iconTypeList[1]; // 默认使用第一个图标 - const myIcon = new BMapGL.Icon(iconUrl, new BMapGL.Size(30, 32), { - anchor: new BMapGL.Size(8, 35), // 修正锚点位置为中心底部 - imageSize: new BMapGL.Size(30, 32), // 与实际图片尺寸一致 - }); + const marker = new BMapGL.Marker(point, { icon: myIcon }); - const marker = new BMapGL.Marker(point, { icon: myIcon }); + // 添加信息窗口 - // 添加信息窗口 + let infoContent = ""; - let infoContent = ""; - - if (pointData.type === 9) { // 索道 infoContent = ` -
-

- 索道运输 -

-
- 索道位置 - 2025-04-24 -
-
- 索道长度 - 2025-04-24 -
-
- 最大载重 - 2025-04-24 -
-
- 安全距离 - 2025-04-24 -
-
- 最大坡度 - 2025-04-24 -
-
`; - } else if (pointData.isCrossing) { - // 交叉信息 +
+

+ 索道运输 +

+
+ 索道位置 + ${pointData.towerName} +
+
+ 索道长度 + ${pointData.cablewayLength} KM +
+
+ 最大载重 + ${pointData.maxHeight} kg +
+
+ 安全距离 + ${pointData.safetyDistance} m +
+
+ 最大坡度 + ${pointData.maxSlope} ° +
+
`; + + // 创建信息窗口,禁用默认样式 + const infoWindow = new BMapGL.InfoWindow(infoContent, { + width: 0, // 宽度设为0,让内容决定宽度 + height: 0, // 高度设为0,让内容决定高度 + offset: new BMapGL.Size(0, -20), // 调整偏移量 + enableAutoPan: true, // 自动平移地图 + enableCloseOnClick: true, // 点击地图不关闭 + }); + + marker.addEventListener("click", function () { + this.openInfoWindow(infoWindow); + + // 移除百度地图默认添加的三角箭头 + setTimeout(() => { + const infoWindowElements = + document.getElementsByClassName("BMap_bubble_pop"); + if (infoWindowElements.length > 0) { + const popup = infoWindowElements[0]; + // 移除箭头元素 + const arrows = + popup.getElementsByClassName("BMap_bubble_arrow"); + while (arrows[0]) { + arrows[0].parentNode.removeChild(arrows[0]); + } + // 移除百度地图添加的额外样式 + popup.style.background = "none"; + popup.style.border = "none"; + popup.style.boxShadow = "none"; + } + }, 50); + }); + + map.addOverlay(marker); + }); + } + + // 绘制杆塔 + if (towerList && towerList.length > 0) { + towerList.forEach((pointData, index) => { + const pointKey = `${pointData.baiduLon},${pointData.baiduLat}`; + // const pointKey = `116.254,39.965`; + // 如果该坐标点已经添加过标记,则跳过 + if (addedPoints[pointKey]) { + console.warn(`重复的点坐标被跳过: ${pointKey}`); + return; + } + + addedPoints[pointKey] = true; + const point = new BMapGL.Point( + pointData.baiduLon, + pointData.baiduLat + ); + bounds.push(point); + + // 检查图标是否存在,不存在则使用默认图标 + const iconUrl = iconTypeList[pointData.towerProgress]; // 默认使用第一个图标 + const myIcon = new BMapGL.Icon(iconUrl, new BMapGL.Size(40, 38), { + anchor: new BMapGL.Size(16, 20), // 修正锚点位置为中心底部 + imageSize: new BMapGL.Size(40, 38), // 与实际图片尺寸一致 + }); + + const marker = new BMapGL.Marker(point, { icon: myIcon }); + + // 添加信息窗口 + let infoContent = ""; + + // 索道 infoContent = ` -
-
-

- ${pointData.title} -

-
- 基础开挖 - 2025-04-24 -
-
- 基础开挖完成 - 2025-04-24 -
-
- 基础浇筑完成 - 2025-04-24 -
-
- 铁塔组立 - 2025-04-24 -
-
- 铁塔组立完成 - 2025-04-24 -
-
- 架线施工完成 - 2025-04-24 -
-
-
-

- 交叉跨越信息 ( ${pointData.title} ) -

-
- 上层线路 - 550V宁安线 -
-
- 下层线路 - 220V宁安线 -
-
- 交叉角度 - 78.5° -
-
- 垂直距离 - 12.8m -
-
- 安全裕度 - 4.8m -
-
-
`; - } else { - // 普通信息 - infoContent = ` -
+

- ${pointData.title} + ${pointData.towerName}

基础开挖 - 2025-04-24 + ${pointData.time1 || "/"}
基础开挖完成 - 2025-04-24 + ${pointData.time2 || "/"}
基础浇筑完成 - 2025-04-24 + ${pointData.time3 || "/"}
铁塔组立 - 2025-04-24 + ${pointData.time4 || "/"}
铁塔组立完成 - 2025-04-24 + ${pointData.time5 || "/"}
架线施工完成 - 2025-04-24 + ${pointData.time6 || "/"} +
+
`; + + // 创建信息窗口,禁用默认样式 + const infoWindow = new BMapGL.InfoWindow(infoContent, { + width: 0, // 宽度设为0,让内容决定宽度 + height: 0, // 高度设为0,让内容决定高度 + offset: new BMapGL.Size(0, -20), // 调整偏移量 + enableAutoPan: true, // 自动平移地图 + enableCloseOnClick: true, // 点击地图不关闭 + }); + + marker.addEventListener("click", function () { + this.openInfoWindow(infoWindow); + + // 移除百度地图默认添加的三角箭头 + setTimeout(() => { + const infoWindowElements = + document.getElementsByClassName("BMap_bubble_pop"); + if (infoWindowElements.length > 0) { + const popup = infoWindowElements[0]; + // 移除箭头元素 + const arrows = + popup.getElementsByClassName("BMap_bubble_arrow"); + while (arrows[0]) { + arrows[0].parentNode.removeChild(arrows[0]); + } + // 移除百度地图添加的额外样式 + popup.style.background = "none"; + popup.style.border = "none"; + popup.style.boxShadow = "none"; + } + }, 50); + }); + + map.addOverlay(marker); + }); + } + + // 绘制交叉跨越 + if (crossingListNew.length > 0) { + crossingListNew.forEach((pointData, index) => { + const pointKey = `${pointData.baiduLon},${pointData.baiduLat}`; + // const pointKey = `116.254,39.965`; + // 如果该坐标点已经添加过标记,则跳过 + if (addedPoints[pointKey]) { + console.warn(`重复的点坐标被跳过: ${pointKey}`); + return; + } + + addedPoints[pointKey] = true; + const point = new BMapGL.Point( + pointData.baiduLon, + pointData.baiduLat + ); + bounds.push(point); + + // 检查图标是否存在,不存在则使用默认图标 + const iconUrl = iconTypeList[11]; // 默认使用第一个图标 + const myIcon = new BMapGL.Icon(iconUrl, new BMapGL.Size(40, 38), { + anchor: new BMapGL.Size(16, 20), // 修正锚点位置为中心底部 + imageSize: new BMapGL.Size(40, 38), // 与实际图片尺寸一致 + }); + + const marker = new BMapGL.Marker(point, { icon: myIcon }); + + // 添加信息窗口 + let infoContent = ""; + + // 交叉信息 + infoContent = ` +
+
+

+ ${pointData.towerInfoVo.towerName} +

+
+ 基础开挖 + ${pointData.towerInfoVo.time1 || "/"} +
+
+ 基础开挖完成 + + ${pointData.towerInfoVo.time2 || "/"} + +
+
+ 基础浇筑完成 + + ${pointData.towerInfoVo.time3 || "/"} + +
+
+ 铁塔组立 + + ${pointData.towerInfoVo.time4 || "/"} + +
+
+ 铁塔组立完成 + + ${pointData.towerInfoVo.time5 || "/"} + +
+
+ 架线施工完成 + + ${pointData.towerInfoVo.time6 || "/"} + +
+
+
+

+ 交叉跨越信息 ( ${pointData.spanTowerName} ) +

+
+ 上层线路 + ${pointData.upperLine} +
+
+ 下层线路 + ${pointData.lowerLine} +
+
+ 交叉角度 + ${pointData.intersectionAngle} ° +
+
+ 垂直距离 + ${pointData.verticalDistance} m +
+
+ 安全裕度 + ${pointData.safetyMargin} ° +
`; - } - // 创建信息窗口,禁用默认样式 - const infoWindow = new BMapGL.InfoWindow(infoContent, { - width: 0, // 宽度设为0,让内容决定宽度 - height: 0, // 高度设为0,让内容决定高度 - offset: new BMapGL.Size(0, -20), // 调整偏移量 - enableAutoPan: true, // 自动平移地图 - enableCloseOnClick: true, // 点击地图不关闭 - }); + // 创建信息窗口,禁用默认样式 + const infoWindow = new BMapGL.InfoWindow(infoContent, { + width: 0, // 宽度设为0,让内容决定宽度 + height: 0, // 高度设为0,让内容决定高度 + offset: new BMapGL.Size(0, -20), // 调整偏移量 + enableAutoPan: true, // 自动平移地图 + enableCloseOnClick: true, // 点击地图不关闭 + }); - marker.addEventListener("click", function () { - this.openInfoWindow(infoWindow); + marker.addEventListener("click", function () { + this.openInfoWindow(infoWindow); - // 移除百度地图默认添加的三角箭头 - setTimeout(() => { - const infoWindowElements = - document.getElementsByClassName("BMap_bubble_pop"); - if (infoWindowElements.length > 0) { - const popup = infoWindowElements[0]; - // 移除箭头元素 - const arrows = - popup.getElementsByClassName("BMap_bubble_arrow"); - while (arrows[0]) { - arrows[0].parentNode.removeChild(arrows[0]); + // 移除百度地图默认添加的三角箭头 + setTimeout(() => { + const infoWindowElements = + document.getElementsByClassName("BMap_bubble_pop"); + if (infoWindowElements.length > 0) { + const popup = infoWindowElements[0]; + // 移除箭头元素 + const arrows = + popup.getElementsByClassName("BMap_bubble_arrow"); + while (arrows[0]) { + arrows[0].parentNode.removeChild(arrows[0]); + } + // 移除百度地图添加的额外样式 + popup.style.background = "none"; + popup.style.border = "none"; + popup.style.boxShadow = "none"; } - // 移除百度地图添加的额外样式 - popup.style.background = "none"; - popup.style.border = "none"; - popup.style.boxShadow = "none"; - } - }, 50); - }); + }, 50); + }); - map.addOverlay(marker); - }); + map.addOverlay(marker); + }); + } // 调整视野使所有点可见 + if (bounds.length > 0) { - map.setViewport(bounds); + map.setViewport(calculateBounds(bounds), { + zoomFactor: 0.5, // 可选:缩放系数(0-1,值越小视野越大) + }); } } +function calculateBounds(points) { + console.log(points, "points999"); + var lngs = points.map((p) => p.lng); + var lats = points.map((p) => p.lat); + var minLng = Math.min(...lngs); + var maxLng = Math.max(...lngs); + var minLat = Math.min(...lats); + var maxLat = Math.max(...lats); + return new BMapGL.Bounds( + new BMapGL.Point(minLng, minLat), + new BMapGL.Point(maxLng, maxLat) + ); +} + // 添加标点折线(智能绘制虚实线) function addMapLine() { - if (config.points.length < 2) return; - // 存储所有线段 const segments = []; + // 绘制杆塔线 + if (towerList.length > 0) { + for (let i = 0; i < towerList.length - 1; i++) { + const startPoint = towerList[i]; + const endPoint = towerList[i + 1]; - // 遍历点数组,创建线段 - for (let i = 0; i < config.points.length - 1; i++) { - const startPoint = config.points[i]; - const endPoint = config.points[i + 1]; + let lineColor = ""; + let lineStyle = ""; + if ( + startPoint.towerProgress === 7 && + endPoint.towerProgress === 7 + ) { + lineColor = "#5ad8a6"; + lineStyle = "solid"; + } else if (startPoint.existSpan === 1 && endPoint.existSpan === 1) { + lineColor = "#d81e06"; + lineStyle = "dashed"; + } else { + lineColor = "#fff"; + lineStyle = "dashed"; + } - // 判断两点是否都已完成 - const isSegmentCompleted = - startPoint.isCompleted && endPoint.isCompleted; + // 创建线段点数组 + const segmentPoints = [ + new BMapGL.Point(startPoint.baiduLon, startPoint.baiduLat), + new BMapGL.Point(endPoint.baiduLon, endPoint.baiduLat), + ]; - // 创建线段点数组 - const segmentPoints = [ - new BMapGL.Point(startPoint.lng, startPoint.lat), - new BMapGL.Point(endPoint.lng, endPoint.lat), - ]; + // 设置线段样式 + const segmentOptions = { + strokeColor: lineColor, // 根据类型获取颜色 + strokeWeight: config.polyline.strokeWeight, + strokeOpacity: config.polyline.strokeOpacity, + enableEditing: config.polyline.enableEditing, + enableClicking: config.polyline.enableClicking, + strokeStyle: lineStyle, + }; - // 设置线段样式 - const segmentOptions = { - strokeColor: getSegmentColor(startPoint, endPoint), // 根据类型获取颜色 - strokeWeight: config.polyline.strokeWeight, - strokeOpacity: config.polyline.strokeOpacity, - enableEditing: config.polyline.enableEditing, - enableClicking: config.polyline.enableClicking, - strokeStyle: isSegmentCompleted ? "solid" : "dashed", - }; - - // 如果是虚线,设置虚线样式 - if (!isSegmentCompleted) { - segmentOptions.strokeDashArray = [10, 5]; - segmentOptions.strokeOpacity = 0.6; // 虚线透明度降低 + // 创建线段并添加到数组 + segments.push(new BMapGL.Polyline(segmentPoints, segmentOptions)); } + } - // 创建线段并添加到数组 - segments.push(new BMapGL.Polyline(segmentPoints, segmentOptions)); + // 绘制交叉线路 + if (crossingListNew.length > 0) { + for (let i = 0; i < crossingListNew.length - 1; i++) { + const startPoint = crossingListNew[i]; + const endPoint = crossingListNew[i + 1]; + + // 创建线段点数组 + const segmentPoints = [ + new BMapGL.Point(startPoint.baiduLon, startPoint.baiduLat), + new BMapGL.Point(endPoint.baiduLon, endPoint.baiduLat), + ]; + + // 设置线段样式 + const segmentOptions = { + strokeColor: "#fff", // 根据类型获取颜色 + strokeWeight: config.polyline.strokeWeight, + strokeOpacity: config.polyline.strokeOpacity, + enableEditing: config.polyline.enableEditing, + enableClicking: config.polyline.enableClicking, + strokeStyle: "solid", + }; + + // 创建线段并添加到数组 + segments.push(new BMapGL.Polyline(segmentPoints, segmentOptions)); + } } // 将所有线段添加到地图 @@ -398,11 +752,66 @@ function getSegmentColor(startPoint, endPoint) { return config.polyline.strokeColor; } -// 初始化地图 -initMap(); +// 获取组织树数据 +function getOrgTreeData() { + ajaxRequest( + dataUrl + "/backstage/digitalSignage/getProTree", + "POST", + {}, + true, + function () {}, + function (result) { + console.log(result, "组织机构树数据获取成功---"); + const { data } = result; + + // 判断是否有工程 有的话取第一个 + if (data && data.length > 0) { + setSpreadToNodes(data); + treeData = data; + // 获取第一个工程 + if ( + data[0].children && + data[0].children.length > 0 && + data[0].children[0].children && + data[0].children[0].children.length > 0 + ) { + nodeId = data[0].children[0].children[0].id; + + if ( + data[0].children[0].children[0].lon && + data[0].children[0].children[0].lat + ) { + intLng = data[0].children[0].children[0].lon; + intLat = data[0].children[0].children[0].lat; + } + + getScrollData(nodeId); + getLegendData(nodeId); + getLocationInfo(nodeId); + } + } + }, + function (xhr) { + error(xhr); + } + ); +} +getOrgTreeData(); +// 递归 +function setSpreadToNodes(nodes, spreadValue = true) { + if (!nodes || !Array.isArray(nodes)) return; + + nodes.forEach((node) => { + node.spread = spreadValue; + + if (node.children && node.children.length > 0) { + setSpreadToNodes(node.children, spreadValue); + } + }); +} // 获取左上角滚动数据源 -function getScrollData() { +function getScrollData(id) { const scrollData = [ { name: "跨线路", @@ -477,29 +886,102 @@ function getScrollData() { ], }, ]; + const params = { + encryptedData: encryptCBC(JSON.stringify({ id })), + }; + ajaxRequest( + dataUrl + "/backstage/digitalSignage/getThreeSpans", + "POST", + params, + true, + function () {}, + function (result) { + // console.log(result, "左上角滚动数据获取成功---"); - let scrollBox = $(".content-wrapper"); - let innerHtml = ""; - scrollData.forEach((item, index) => { - // 跨域描述内容 - let describeHtml = ""; - if (item.content && item.content.length > 0) { - item.content.forEach((d, dIndex) => { - describeHtml += `${d.name}:${d.value}`; - }); + const { data } = result; + + let scrollBox = $(".content-wrapper"); + let innerHtml = ""; + if (data && data.length > 0) { + data.forEach((item) => { + let describeHtml = ""; + if (item.spanType === "跨线路") { + describeHtml += ` + 上层线路:${item.upperLine} + 下层线路: ${item.lowerLine} + 交叉角度: ${item.intersectionAngle} ° + 垂直距离: ${item.verticalDistance} m + 安全裕度: ${item.safetyMargin} ° + `; + } else { + describeHtml += ` + 垂直净距:${item.verticalClearDistance} m + 杆塔间距: ${item.towerSpacing} m + 公路宽度: ${item.highwayWidth} m + `; + } + + // 单行数据 + innerHtml += ` +
+ ${item.spanType} + + + ${item.towerName} - ${item.nextTowerName} + + ${describeHtml} +
+ `; + }); + } + + scrollBox.html(innerHtml); + }, + function (xhr) { + error(xhr); } - - // 单行数据 - innerHtml += `
- ${item.name} - ${item.location} - ${describeHtml} -
`; - }); - scrollBox.html(innerHtml); + ); } -getScrollData(); +// 获取左下角图例数据源 +function getLegendData(id) { + const params = { + encryptedData: encryptCBC(JSON.stringify({ id })), + }; + + ajaxRequest( + dataUrl + "/backstage/digitalSignage/getTowerProgressNum", + "POST", + params, + true, + function () {}, + function (result) { + const { data } = result; + + if (data) { + Object.values(data).forEach((value, index) => { + legendData[index].value = value; + }); + } + + const legendBox = $(".legend-box"); + let innerHtml = ""; + legendData.forEach((item, index) => { + innerHtml += ` +
+ + ${item.name} + ${item.value} +
+ `; + }); + legendBox.html(innerHtml); + }, + function (xhr) { + error(xhr); + } + ); +} document.addEventListener("DOMContentLoaded", function () { const scrollContent = document.getElementById("scrollContent"); @@ -567,57 +1049,49 @@ document.addEventListener("DOMContentLoaded", function () { tree.render({ elem: "#orgTree", // 绑定元素 id: "orgTree", // 自定义索引 - data: getTreeData(), // 获取数据 + data: treeData, // 获取数据 showCheckbox: false, // 是否显示复选框 isJump: false, // 是否允许点击节点时弹出新窗口 accordion: true, // 是否开启手风琴模式 edit: false, // 是否开启节点的操作图标 onlyIconControl: true, // 是否仅允许节点左侧图标控制展开收缩 click: function (obj) { - console.log(obj.data); // 点击节点时的回调 - // 这里可以添加点击节点后的处理逻辑 + console.log(obj.data); + // 判断是否是叶子节点(没有子节点或子节点数组为空) + if ( + !obj.data.children || + obj.data.children.length === 0 + ) { + setActiveNode(obj.elem); + nodeId = obj.data.id; + getScrollData(nodeId); + getLegendData(nodeId); + getLocationInfo(nodeId); + } else { + } + }, + done: function () { + console.log("树准备完毕"); + expandToNodeId(nodeId); }, }); } - // 模拟获取树形数据(实际项目中替换为AJAX请求) - function getTreeData() { - return [ - { - title: "总公司", - id: 1, - children: [ - { - title: "技术部", - id: 11, - children: [ - { title: "前端组", id: 111 }, - { title: "后端组", id: 112 }, - { title: "测试组", id: 113 }, - ], - }, - { - title: "市场部", - id: 12, - children: [ - { title: "销售组", id: 121 }, - { title: "推广组", id: 122 }, - ], - }, - { - title: "人事部", - id: 13, - children: [ - { title: "招聘组", id: 131 }, - { title: "培训组", id: 132 }, - ], - }, - ], - }, - ]; + initOrgTree(); + setActiveNodeNew(nodeId); + + function setActiveNode(elem) { + $("#orgTree") + .find(".layui-tree-click") + .removeClass("layui-tree-click"); + $(elem).addClass("layui-tree-click"); } - initOrgTree(); + function setActiveNodeNew(nodeId) { + $("#orgTree") + .find('[data-id="' + nodeId + '"]') + .addClass("layui-tree-click"); + } }); }); @@ -637,72 +1111,3 @@ document.addEventListener("DOMContentLoaded", function () { } }); }); - -// 获取左下角图例数据源 -function getLegendData() { - const legendData = [ - { - name: "基础开挖", - value: "6", - icon: "../../img/digitalSignage/yellow.png", - }, - { - name: "开挖完成", - value: "6", - icon: "../../img/digitalSignage/green.png", - }, - { - name: "浇筑完成", - value: "6", - icon: "../../img/digitalSignage/blue.png", - }, - { - name: "铁塔组立", - value: "6", - icon: "../../img/digitalSignage/orange.png", - }, - { - name: "组塔完成", - value: "6", - icon: "../../img/digitalSignage/zt_red.png", - }, - { - name: "架线完成", - value: "6", - icon: "../../img/digitalSignage/zt_purple.png", - }, - { - name: "附件安装", - value: "6", - icon: "../../img/digitalSignage/zt_green.png", - }, - { - name: "未 开 始", - value: "6", - icon: "../../img/digitalSignage/white.png", - }, - { - name: "索道运输", - value: "6", - icon: "../../img/digitalSignage/sd.png", - }, - { - name: "项 目 部", - value: "6", - icon: "../../img/digitalSignage/yellow.png", - }, - ]; - - const legendBox = $(".legend-box"); - let innerHtml = ""; - legendData.forEach((item, index) => { - innerHtml += `
- - ${item.name} - ${item.value} -
`; - }); - legendBox.html(innerHtml); -} - -getLegendData(); diff --git a/src/main/resources/static/pages/synthesisQuery/digitalSignage.html b/src/main/resources/static/pages/synthesisQuery/digitalSignage.html index afedb71..c01fdcf 100644 --- a/src/main/resources/static/pages/synthesisQuery/digitalSignage.html +++ b/src/main/resources/static/pages/synthesisQuery/digitalSignage.html @@ -14,7 +14,7 @@ - + 电子看板