bonus
/
gz_digital_signage
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

电子看板完善

This commit is contained in:
BianLzhaoMin 2025-06-11 13:02:50 +08:00
parent fa968922c3
commit 9bc2e366d9
7 changed files with 206 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

80
src/main/resources/static/css/synthesisQuery/digitalSignage.css
View File

@ -45,7 +45,7 @@ body {
.legend-box,
.right-drawer-box {
position: absolute;
background: rgba(0, 0, 0, 0.5);
background: rgba(0, 0, 0, 0.6);
color: #fff;
z-index: 999;
}
@ -139,7 +139,7 @@ body {
top: 15px;
left: 15px;
width: 140px;
height: 252px;
height: 280px;
display: flex;
flex-direction: column;
justify-content: space-around;
@ -206,6 +206,75 @@ body {
text-align: right;
}
/* 左下角工程概况 */
.project-overview-box {
position: absolute;
bottom: 15px;
left: 15px;
width: 320px;
padding: 10px;
background: rgba(0, 0, 0, 0.6);
border-radius: 10px;
z-index: 999;
/* display: flex;
flex-direction: column;
justify-content: space-around; */
}
.project-overview-preview-box {
width: 320px;
background: rgba(0, 0, 0, 0.6);
position: absolute;
/* 定位使预览盒子在工程概况的右边 */
top: -85%;
right: -105%;
z-index: 1000;
display: none;
font-size: 12px;
color: #fff;
border-radius: 10px;
padding: 10px;
text-indent: 2em;
}
.project-overview-preview-box-arrow {
width: 20px;
height: 20px;
position: absolute;
bottom: 0;
left: -20px;
z-index: 1001;
background: url("../../img/digitalSignage/qp.png") no-repeat center center;
background-size: 100% 100%;
}
.project-overview-title {
padding-bottom: 10px 0;
font-size: 18px;
font-weight: bold;
text-align: center;
color: #fff;
}
.project-overview-content {
text-indent: 2em;
/* max-height: 220px; */
color: #fff;
font-size: 12px;
letter-spacing: 1px;
/* padding-bottom: 10px; */
/* 设置溢出隐藏显示... */
/* overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap; */
display: -webkit-box;
-webkit-line-clamp: 12; /* 限制显示的行数 */
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
/* 索道信息窗口样式 */
.map-container-item-ropeway span:first-child {
padding-left: 16px;
@ -373,8 +442,9 @@ body {
/* 中间标题 */
.center-title-box {
position: absolute;
top: 15px;
top: 0;
left: 50%;
padding: 0 12px;
transform: translateX(-50%);
z-index: 999;
font-size: 32px;
@ -382,4 +452,8 @@ body {
color: #fff;
letter-spacing: 6px;
font-family: "Alibaba PuHuiTi R";
/* 加一个浅蓝色渐变背景颜色 */
background: linear-gradient(to right, #c9d6ff, #e2e2e2);
color: #063268;
border-radius: 2px;
}

BIN
src/main/resources/static/img/digitalSignage/line_red.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
src/main/resources/static/img/digitalSignage/line_yellow.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
src/main/resources/static/img/digitalSignage/qp.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.8 KiB

118
src/main/resources/static/js/synthesisQuery/digitalSignage.js
View File

@ -6,9 +6,11 @@ let towerList = []; // 塔列表
let crossingList = []; // 跨越列表
let crossingListNew = []; // 跨越列表
let highwayList = []; // 公路列表
let aThousandFieldsList = []; // 千张场地
let intLng = 116.254; // 初始经度
let intLat = 39.965; // 初始纬度
let isMap = true; // 是否是地图模式
let projectOverview = ""; // 工程概况
let projectTitle = ""; // 项目名称
let centerTitle = ""; // 中间标题
// 图例数据
@ -57,12 +59,17 @@ const legendData = [
{
name: "架线施工",
value: 0,
icon: "../../img/digitalSignage/zt_red.png",
icon: "../../img/digitalSignage/line_yellow.png",
},
// {
// name: "架线施工完成",
// value: 0,
// icon: "../../img/digitalSignage/zt_purple.png",
// },
{
name: "架线施工完成",
value: 0,
icon: "../../img/digitalSignage/zt_purple.png",
icon: "../../img/digitalSignage/line_red.png",
},
{
name: "附件安装完成",
@ -140,6 +147,12 @@ function getLocationInfo(id) {
highwayList = [];
}
if (data.aThousandFieldsList.length > 0) {
aThousandFieldsList = data.aThousandFieldsList;
} else {
aThousandFieldsList = [];
}
// 处理一下交叉信息
if (crossingList && crossingList.length > 0) {
crossingList.forEach((item) => {
@ -272,6 +285,7 @@ function initMap() {
setTimeout(() => {
addAllMapPoints();
addMapLine();
addMapAThousandFields();
}, 1000);
}
@ -286,7 +300,8 @@ function addAllMapPoints() {
const iconTypeList = {
// 1: "../../img/digitalSignage/icon_three.png",
1: "../../img/digitalSignage/icon_three_new.png",
2: "../../img/digitalSignage/icon_two.png",
// 2: "../../img/digitalSignage/icon_two.png",
2: "../../img/digitalSignage/icon_two_new.png",
// 3: "../../img/digitalSignage/icon_five.png",
3: "../../img/digitalSignage/icon_five_new.png",
// 4: "../../img/digitalSignage/icon_seven.png",
@ -297,11 +312,11 @@ function addAllMapPoints() {
// 6: "../../img/digitalSignage/icon_six.png",
6: "../../img/digitalSignage/zt_orange.png",
7: "../../img/digitalSignage/zt_red.png",
8: "../../img/digitalSignage/zt_purple.png",
9: "../../img/digitalSignage/zt_green.png",
0: "../../img/digitalSignage/zt_green.png",
8: "../../img/digitalSignage/zt_red.png", // 新增的工序
9: "../../img/digitalSignage/zt_purple.png",
10: "../../img/digitalSignage/zt_green.png",
// 0: "../../img/digitalSignage/icon_one.png",
11: "../../img/digitalSignage/icon_one_new.png",
0: "../../img/digitalSignage/icon_one_new.png",
12: "../../img/digitalSignage/sd.png",
20: "../../img/digitalSignage/project.png",
// 21: "../../img/digitalSignage/zt_white.png",
@ -963,14 +978,22 @@ function addMapLine() {
let lineColor = "";
let lineStyle = "";
if (
startPoint.towerProgress === 8 &&
endPoint.towerProgress === 8
(startPoint.towerProgress === 8 &&
endPoint.towerProgress === 7) ||
(startPoint.towerProgress === 8 && endPoint.towerProgress === 8)
) {
lineColor = "#5ad8a6";
lineColor = "#FFFF00";
lineStyle = "solid";
} else if (endPoint.existSpan === 1) {
lineColor = "#d81e06";
lineStyle = "dashed";
} else if (
(startPoint.towerProgress === 8 &&
endPoint.towerProgress === 8) ||
(startPoint.towerProgress === 9 && endPoint.towerProgress === 8)
) {
lineColor = "#d81e06"; // 黄色
lineStyle = "solid";
} else {
lineColor = "#fff";
lineStyle = "dashed";
@ -1123,6 +1146,44 @@ function getSegmentColor(startPoint, endPoint) {
return config.polyline.strokeColor;
}
// 绘制千张场地区域图
function addMapAThousandFields() {
if (aThousandFieldsList.length > 0) {
aThousandFieldsList.forEach((item) => {
if (
item.cablewaTransPointVoList &&
item.cablewaTransPointVoList.length > 0
) {
let points = [];
// 根据sort字段排序 防止点位顺序不一致
item.cablewaTransPointVoList.forEach((j) => {
points.push(new BMapGL.Point(j.lng, j.lat));
});
if (points.length > 0) {
// // 2. 创建折线连接这些点位
var polyline = new BMapGL.Polyline(points, {
strokeColor: "#0C14CA", // 线颜色
strokeWeight: 4, // 线宽
strokeOpacity: 0.8, // 线透明度
});
map.addOverlay(polyline);
// 绘制区域
var polygon = new BMapGL.Polygon(points, {
strokeColor: "#00FFFF", // 线颜色
strokeWeight: 4, // 线宽
strokeOpacity: 0.8, // 线透明度
fillColor: "#00FFFF", // 填充颜色
fillOpacity: 0.3, // 填充透明度
});
// polygonView = polygon;
map.addOverlay(polygon);
}
}
});
}
}
// 获取组织树数据
function getOrgTreeData() {
ajaxRequest(
@ -1165,6 +1226,10 @@ function getOrgTreeData() {
}
// getScrollData(nodeId);
$(".project-overview-content").text(
treeData[0].children[0].children[0].projectOverview ||
"暂无"
);
getLegendData(nodeId);
getLocationInfo(nodeId);
} else {
@ -1459,6 +1524,9 @@ document.addEventListener("DOMContentLoaded", function () {
$(".center-title-box").text(
projectTitle + "作战图"
);
$(".project-overview-content").text(
obj.data.projectOverview || "暂无"
);
// getScrollData(nodeId);
getLegendData(nodeId);
getLocationInfo(nodeId);
@ -1555,6 +1623,10 @@ document.addEventListener("DOMContentLoaded", function () {
}
// getScrollData(nodeId);
$(".project-overview-content").text(
treeData[0].children[0].children[0].projectOverview ||
"暂无"
);
getLegendData(nodeId);
getLocationInfo(nodeId);
} else {
@ -1562,4 +1634,30 @@ document.addEventListener("DOMContentLoaded", function () {
}
}
});
// 设置当鼠标移入工程概况时，并且判断当前是否溢出，溢出时预览框显示
const projectOverviewBox = document.querySelector(".project-overview-box");
const projectOverviewContent = document.querySelector(
".project-overview-content"
);
const projectOverviewPreviewBox = document.querySelector(
".project-overview-preview-box"
);
projectOverviewBox.addEventListener("mouseenter", function () {
if (
projectOverviewContent.scrollHeight >
projectOverviewContent.clientHeight
) {
projectOverviewPreviewBox.style.display = "block";
projectOverviewPreviewBox.innerHTML =
projectOverviewContent.innerHTML;
} else {
projectOverviewPreviewBox.style.display = "none";
projectOverviewPreviewBox.innerHTML = "";
}
});
projectOverviewBox.addEventListener("mouseleave", function () {
projectOverviewPreviewBox.style.display = "none";
projectOverviewPreviewBox.innerHTML = "";
});
});

8
src/main/resources/static/pages/basic/lineManagement/child/lineFormTemp.html
View File

@ -162,8 +162,12 @@
<div class="form-item" style="width: 100%;">
<div class="form-label">工程概况：</div>
<div class="input-container">
<input class="layui-input" id="projectOverview" name="projectOverview" autocomplete="off"
placeholder="输入内容" maxlength="100">
<!-- <input class="layui-input" id="projectOverview" type="textarea" name="projectOverview"
autocomplete="off" placeholder="输入内容" maxlength="200"> -->
<textarea autocomplete="off" maxlength="500" placeholder="输入内容" class="layui-textarea"
id="projectOverview" name="projectOverview"></textarea>
</div>
</div>
</div>

15
src/main/resources/static/pages/synthesisQuery/digitalSignage.html
View File

@ -76,6 +76,21 @@
</div>
</div>
<!-- 左下角工程概况 -->
<div class="project-overview-box">
<div class="project-overview-title">
工程概况
</div>
<div class="project-overview-content">
</div>
<!-- 预览框 -->
<div class="project-overview-preview-box">
</div>
</div>
<!-- 右侧抽屉 -->
<div class="right-drawer-box">
<!-- 关闭按钮 -->