diff --git a/src/api/xj/screen/road-screen.js b/src/api/xj/screen/road-screen.js
index 8c397c6..c37cfc7 100644
--- a/src/api/xj/screen/road-screen.js
+++ b/src/api/xj/screen/road-screen.js
@@ -11,7 +11,7 @@ import request from "@/utils/request";
// 路面状况排名接口
export function roadRankStatistics(query) {
return request({
- url: "/bigscreen/getRoadStatistics",
+ url: "/bigscreen/v2/getRoadStatistics",
method: "get",
params: query,
});
@@ -21,7 +21,7 @@ export function roadRankStatistics(query) {
// 附属设施分布接口
export function ancillaryList(query) {
return request({
- url: "/bigscreen/getEquipmentScale",
+ url: "/bigscreen/v2/getEquipmentScale",
method: "get",
params: query,
});
@@ -30,7 +30,7 @@ export function ancillaryList(query) {
// 附属设施分布累计路产数
export function ancillaryCount(query) {
return request({
- url: "/bigscreen/getEquipmentCount",
+ url: "/bigscreen/v2/getEquipmentCount",
method: "get",
params: query,
});
@@ -40,7 +40,7 @@ export function ancillaryCount(query) {
// 附属设施异常统计接口
export function anomalyList(query) {
return request({
- url: "/bigscreen/getEquipmentAnomalyLog",
+ url: "/bigscreen/v2/getEquipmentAnomalyLog",
method: "get",
params: query,
});
@@ -49,7 +49,7 @@ export function anomalyList(query) {
// 路产统计信息接口
export function roadStatisticList(query) {
return request({
- url: "/bigscreen/getEquipmentStatistics",
+ url: "/bigscreen/v2/getEquipmentStatistics",
method: "get",
params: query,
});
diff --git a/src/assets/screen/road/ancillary-bottom-8.png b/src/assets/screen/road/ancillary-bottom-8.png
new file mode 100644
index 0000000..88ed544
Binary files /dev/null and b/src/assets/screen/road/ancillary-bottom-8.png differ
diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue
index 4003702..5bb23ee 100644
--- a/src/layout/components/Navbar.vue
+++ b/src/layout/components/Navbar.vue
@@ -19,6 +19,7 @@
+
@@ -95,8 +96,8 @@ export default {
},
methods: {
/* 点击跳转大屏页面 */
- goBigScreen(){
- this.$router.push("/screen")
+ goBigScreen() {
+ this.$router.push("/screen");
},
toggleSideBar() {
this.$store.dispatch("app/toggleSideBar");
@@ -163,7 +164,7 @@ export default {
outline: none;
}
- .menu-return {
+ .header-news {
height: 100%;
margin-right: 0.5rem;
@@ -171,7 +172,19 @@ export default {
cursor: pointer;
font-size: 1.4rem;
line-height: 3.1rem;
- font-weight: bold;
+ font-weight: 400;
+ }
+ }
+
+ .menu-return {
+ height: 100%;
+ margin-right: 1rem;
+
+ i {
+ cursor: pointer;
+ font-size: 1.4rem;
+ line-height: 3.1rem;
+ font-weight: 400;
}
}
diff --git a/src/views/big-screen/components/img-dialog.vue b/src/views/big-screen/components/img-dialog.vue
index 2a7a77d..61d4edc 100644
--- a/src/views/big-screen/components/img-dialog.vue
+++ b/src/views/big-screen/components/img-dialog.vue
@@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com
* @Date: 2024-10-22 15:30:25
* @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2024-11-14 16:44:42
+ * @LastEditTime: 2024-11-19 13:56:22
* @FilePath: \znxjxt-ui\src\views\big-screen\components\img-dialog.vue
* @Description: 大屏查看图片弹窗
-->
@@ -68,7 +68,7 @@
diff --git a/src/views/big-screen/disease-components/traffic-log.vue b/src/views/big-screen/disease-components/traffic-log.vue
index 2b4649b..cb1195f 100644
--- a/src/views/big-screen/disease-components/traffic-log.vue
+++ b/src/views/big-screen/disease-components/traffic-log.vue
@@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com
* @Date: 2024-11-08 11:56:02
* @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2024-11-14 13:12:32
+ * @LastEditTime: 2024-11-19 13:52:47
* @FilePath: \znxjxt-ui\src\views\big-screen\traffic-components\traffic-log.vue
* @Description: 病害巡检-病害日志
-->
@@ -37,25 +37,38 @@
-
-
-
+ -->
+
+
+
+
@@ -232,21 +232,6 @@ export default {
// 鼠标悬浮具体数据显示
show: false,
position: "center",
- formatter: (params) => {
- return `{a|${params.percent.toFixed()}%}\n{b|${params.name}}`;
- },
- rich: {
- a: {
- fontFamily: "DouYu",
- fontSize: 28,
- color: "rgba(255, 183, 89, 0.8)",
- },
- b: {
- fontFamily: "DinBm",
- fontSize: 12,
- color: "#ffffff",
- },
- },
},
emphasis: {
label: {
diff --git a/src/views/big-screen/index.vue b/src/views/big-screen/index.vue
index 3c7daf1..0549ecf 100644
--- a/src/views/big-screen/index.vue
+++ b/src/views/big-screen/index.vue
@@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com
* @Date: 2024-10-17 11:34:00
* @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2024-11-18 11:18:49
+ * @LastEditTime: 2024-11-19 14:16:56
* @FilePath: \znxjxt-ui\src\views\big-screen\index.vue
* @Description: 大屏首页
-->
@@ -20,6 +20,7 @@
>
@@ -702,13 +720,11 @@ export default {
classType: value ? value[0] : "",
type: value ? (value.length > 1 ? value[1] : "") : "",
};
- comppanyImg(data).then(
- ({ code, data }) => {
- if (code === 200) {
- this.mapCareList = data;
- }
+ comppanyImg(data).then(({ code, data }) => {
+ if (code === 200) {
+ this.mapCareList = data;
}
- );
+ });
},
/* 点击病害日志详情打开弹窗进行地图打点 */
@@ -716,6 +732,9 @@ export default {
this.imgTitle = "查看";
this.imageItem = item;
this.imgVisible = true;
+ // 地图右上角多选按钮显示
+ this.getIconType();
+ this.showIconList = true;
// 地图打点\改变地图层级
this.$nextTick(() => {
const map = this.$refs.roadMap.instance.get("map");
@@ -798,11 +817,7 @@ export default {
const point = new Point(element.geometry);
const feature = new Feature({
geometry: point,
- data: {
- iconType: element.iconType,
- imageUrl: element.imageUrl,
- rect: element.rect,
- },
+ data: element,
// 自己设置一个标识
type: "icon",
});
@@ -969,8 +984,17 @@ export default {
changeIconType(value) {
if (this.bottomTipClick !== value) {
this.bottomTipClick = value;
- this.getIconType();
- this.getCenterPiont();
+ this.$nextTick(() => {
+ const map = this.$refs.roadMap.instance.get("map");
+ map.removeLayer(this.clusters);
+ this.clusters = null;
+ // map.getView().setZoom(10);
+ // map.getView().setCenter([123.30297096718999, 41.87942945541742]);
+ });
+ // 地图右上角多选按钮隐藏
+ this.showIconList = false;
+ // this.getIconType();
+ // this.getCenterPiont();
}
},
@@ -1182,16 +1206,22 @@ export default {
class: "one",
},
];
+ // 地图右上角多选按钮隐藏
+ this.showIconList = false;
+ // 图层恢复
+ this.mapZoom = "";
this.$nextTick(() => {
const map = this.$refs.roadMap.instance.get("map");
+ map.removeLayer(this.clusters);
+ this.clusters = null;
map.getView().setZoom(10);
map.getView().setCenter([123.30297096718999, 41.87942945541742]);
});
// 地图右上角多选按钮显示
- this.getIconType();
- this.showIconList = true;
+ // this.getIconType();
+ // this.showIconList = true;
// 进行地图打点
- this.getCenterPiont();
+ // this.getCenterPiont();
this.getLinePoint();
}
}
@@ -1496,6 +1526,12 @@ export default {
align-items: flex-end;
}
+ .header-news {
+ cursor: pointer;
+ font-size: 1.5rem;
+ color:red;
+ }
+
.header-data {
font-size: 1.8rem;
}
@@ -1637,6 +1673,7 @@ export default {
width: 100%;
height: 80%;
display: flex;
+ flex-direction: column;
align-items: center;
justify-content: center;
overflow: hidden;
@@ -1655,6 +1692,15 @@ export default {
}
}
+// 图片信息
+.rect-image {
+ width: 80%;
+ position: absolute;
+ top: 0;
+ color: #ffffff;
+ background-color: rgba(0, 0, 0, 0.5);
+}
+
// 大屏下拉框样式
::v-deep .el-select {
width: 6.5rem;
diff --git a/src/views/big-screen/overview-components/inspection-vehicles.vue b/src/views/big-screen/overview-components/inspection-vehicles.vue
index 2972cbd..5940b97 100644
--- a/src/views/big-screen/overview-components/inspection-vehicles.vue
+++ b/src/views/big-screen/overview-components/inspection-vehicles.vue
@@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com
* @Date: 2024-11-08 09:40:18
* @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2024-11-15 15:29:10
+ * @LastEditTime: 2024-11-19 13:32:51
* @FilePath: \znxjxt-ui\src\views\big-screen\disease-components\inspection-vehicles.vue
* @Description: 总览大屏-巡检车辆
-->
@@ -40,7 +40,7 @@
header-row-class-name="headerRow"
row-class-name="bodayRow"
style="width: 100%; background: none"
- height="285"
+ height="85%"
>
@@ -65,13 +65,9 @@
车辆状态:
{{ scope.row.status }}
-
- 网络连接:
-
-
设备状态:
-
+ {{ scope.row.status }}
@@ -128,7 +128,7 @@ export default {
.ancillary-bottom-0 {
background-image: url("../../../assets/screen/road/ancillary-bottom-0.png");
background-repeat: no-repeat;
- background-size: 100% 100%;
+ background-size: 100%;
background-position: 50%;
span {
@@ -139,7 +139,7 @@ export default {
.ancillary-bottom-1 {
background-image: url("../../../assets/screen/road/ancillary-bottom-1.png");
background-repeat: no-repeat;
- background-size: 100% 100%;
+ background-size: 100%;
background-position: 50%;
span {
@@ -150,7 +150,7 @@ export default {
.ancillary-bottom-2 {
background-image: url("../../../assets/screen/road/ancillary-bottom-2.png");
background-repeat: no-repeat;
- background-size: 100% 100%;
+ background-size: 100%;
background-position: 50%;
span {
@@ -161,7 +161,7 @@ export default {
.ancillary-bottom-3 {
background-image: url("../../../assets/screen/road/ancillary-bottom-3.png");
background-repeat: no-repeat;
- background-size: 100% 100%;
+ background-size: 100%;
background-position: 50%;
span {
@@ -172,7 +172,7 @@ export default {
.ancillary-bottom-4 {
background-image: url("../../../assets/screen/road/ancillary-bottom-4.png");
background-repeat: no-repeat;
- background-size: 100% 100%;
+ background-size: 100%;
background-position: 50%;
span {
@@ -181,20 +181,21 @@ export default {
}
.ancillary-bottom-5 {
- background-image: url("../../../assets/screen/road/ancillary-bottom-5.png");
+ background-image: url("../../../assets/screen/road/ancillary-bottom-8.png");
background-repeat: no-repeat;
- background-size: 100% 100%;
+ background-size: 100%;
background-position: 50%;
span {
- color: #3f84e3;
+ // color: #3f84e3;
+ color: #08afa3;
}
}
.ancillary-bottom-6 {
background-image: url("../../../assets/screen/road/ancillary-bottom-6.png");
background-repeat: no-repeat;
- background-size: 100% 100%;
+ background-size: 100%;
background-position: 50%;
span {
@@ -205,7 +206,7 @@ export default {
.ancillary-bottom-7 {
background-image: url("../../../assets/screen/road/ancillary-bottom-7.png");
background-repeat: no-repeat;
- background-size: 100% 100%;
+ background-size: 100%;
background-position: 50%;
span {
diff --git a/src/views/big-screen/road-components/manage-maintain.vue b/src/views/big-screen/road-components/manage-maintain.vue
index ee34551..340d2cd 100644
--- a/src/views/big-screen/road-components/manage-maintain.vue
+++ b/src/views/big-screen/road-components/manage-maintain.vue
@@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com
* @Date: 2024-10-18 15:15:04
* @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2024-10-18 15:47:15
+ * @LastEditTime: 2024-11-19 09:54:43
* @FilePath: \znxjxt-ui\src\views\big-screen\road-components\manage-maintain.vue
* @Description: 道路资产大屏-管养道路统计
-->
@@ -60,9 +60,11 @@ export default {
width: 47%;
height: 100%;
padding-left: 3rem;
- line-height: 5rem;
+ // line-height: 5rem;
display: flex;
justify-content: center;
+ align-items: center;
+ padding-bottom: 1.5rem;
font-size: 1rem;
color: #aac6c7;
@@ -78,7 +80,7 @@ export default {
background-image: url("../../../assets/screen/road/maintain-left.png");
background-repeat: no-repeat;
background-position: 100%;
- background-size: 100% 65%;
+ background-size: 100%;
span {
background: linear-gradient(
@@ -95,7 +97,7 @@ export default {
background-image: url("../../../assets/screen/road/maintain-right.png");
background-repeat: no-repeat;
background-position: 100%;
- background-size: 100% 65%;
+ background-size: 100%;
span {
background: linear-gradient(