-
-
+
-
-
+
+
-
-
+
+
-
+
-
-
+
-
-
+
+
- 搜索
- 重置
+ 搜索
+ 重置
-
+
-
- 采集时间:
+
+ 采集时间:
{{ new Date(item.createdTime).toLocaleString() }} 起始桩号:
{{ item.stakeStart || "暂无数据" }} 终止桩号:
{{ item.stakeEnd || "暂无数据" }}
@@ -160,24 +81,14 @@
-
![Main Image]()
+
-
![]()
+
@@ -199,7 +110,7 @@ export default {
},
imageItem: {
type: Object,
- default: () => {},
+ default: () => { },
},
},
data() {
@@ -254,11 +165,16 @@ export default {
pageTip: 1,
// 图片病害位置红框信息
rectItem: [],
+ // 图片病害框的颜色
colorList: ["#FFFFFF", "#07E8E2", "#DD9F18", "#994EFF", "#08B4A6"],
};
},
computed: {
- // 当前展示的图片url
+ /**
+ * @description: 当前展示的图片url
+ * @param {*}
+ * @return {*}
+ */
currentImage() {
if (
this.defectData.length > 0 &&
@@ -269,7 +185,12 @@ export default {
return this.defectData[this.currentIndex].items[index].img;
}
},
- // 下方小列表数据
+
+ /**
+ * @description: 下方小列表数据
+ * @param {*}
+ * @return {*}
+ */
currentThumbnails() {
return this.defectData[this.currentIndex]?.items || [];
},
@@ -293,7 +214,11 @@ export default {
this.getDefectType();
},
methods: {
- /* 获取路段下拉数据 */
+ /**
+ * @description: 获取路段下拉数据
+ * @param {*}
+ * @return {*}
+ */
getSegmentList() {
getSegment().then(({ code, data }) => {
if (code === 200) {
@@ -302,7 +227,11 @@ export default {
});
},
- /* 获取病害类型下拉数据 */
+ /**
+ * @description: 获取病害类型下拉数据
+ * @param {*}
+ * @return {*}
+ */
getDefectType() {
getItemTypes({ classType: this.bottomTipClick }).then(
({ code, data }) => {
@@ -313,7 +242,11 @@ export default {
);
},
- /* 根据传回来的快照id查图片详细数据 */
+ /**
+ * @description: 根据传回来的快照id查图片详细数据
+ * @param {*}
+ * @return {*}
+ */
getMediaBySnapshotid() {
getMediaIndex({
classType: this.bottomTipClick,
@@ -330,7 +263,12 @@ export default {
});
},
- /* 切换维度事件 */
+
+ /**
+ * @description: 切换维度事件
+ * @param {*}
+ * @return {*}
+ */
changeImgType(type) {
if (this.labelCheck != type) {
this.labelCheck = type;
@@ -348,7 +286,12 @@ export default {
}
},
- /* 向下获取图片列表 */
+
+ /**
+ * @description: 向下获取图片列表
+ * @param {*}
+ * @return {*}
+ */
getList() {
this.loading = true;
const data = {
@@ -370,14 +313,17 @@ export default {
}
})
.finally(() => {
- // this.showImage(this.currentIndex);
- })
- .catch(() => {
+ this.showImage(this.currentIndex);
this.loading = false;
- });
+ })
+
},
- /* 向上获取列表数据 */
+ /**
+ * @description: 向上获取列表数据
+ * @param {*}
+ * @return {*}
+ */
getListTop() {
this.loading = true;
const data = {
@@ -403,7 +349,11 @@ export default {
});
},
- /* 点击搜索事件 */
+ /**
+ * @description: 点击搜索事件
+ * @param {*}
+ * @return {*}
+ */
handleQuery() {
const stakeReg = /^K\d{4}\+\d{3}$/;
if (this.imgForm.stakeStart) {
@@ -447,7 +397,11 @@ export default {
}
},
- /* 重置事件 */
+ /**
+ * @description: 重置事件
+ * @param {*}
+ * @return {*}
+ */
resetQuery() {
this.defectData = [];
this.ariaList = [];
@@ -467,7 +421,11 @@ export default {
this.showImage(0);
},
- /* 左侧点击图片事件 */
+ /**
+ * @description: 左侧点击图片事件
+ * @param {*}
+ * @return {*}
+ */
showImage(index) {
// if (this.currentIndex === this.defectData.length - 1) {
// this.loadMoreBottomImages();
@@ -482,13 +440,21 @@ export default {
});
},
- /* 点击下方小列表 */
+ /**
+ * @description: 点击下方小列表
+ * @param {*}
+ * @return {*}
+ */
showThumbnailImage(index) {
this.selectedThumbnail = index;
this.updateRects();
},
- /* 使图片展示在父级容器可视区域 */
+ /**
+ * @description: 使图片展示在父级容器可视区域
+ * @param {*}
+ * @return {*}
+ */
scrollToCurrentImage() {
if (this.$refs.sidebar) {
const sidebarImages = this.$refs.sidebar.querySelectorAll("img");
@@ -502,11 +468,17 @@ export default {
}
},
- /* 滚动触发事件 */
+ /**
+ * @description: 滚动触发事件
+ * @param {*}
+ * @return {*}
+ */
handleScroll(e) {
const sidebar = this.$refs.sidebar;
// 滚动到顶加载数据
- if (e.target.scrollTop < 1 && this.pageTip > 1 && !this.loading) {
+ console.log(e.target.scrollTop, 'dererere');
+
+ if (e.target.scrollTop < 20 && this.pageTip > 1 && !this.loading) {
this.loadMoreTopImages();
}
@@ -523,13 +495,21 @@ export default {
// }
},
- /* 向下加载更多图片方法 */
+ /**
+ * @description: 向下加载更多图片方法
+ * @param {*}
+ * @return {*}
+ */
loadMoreBottomImages() {
this.params.page += 1;
this.getList();
},
- /* 向上加载更多图片 */
+ /**
+ * @description: 向上加载更多图片
+ * @param {*}
+ * @return {*}
+ */
loadMoreTopImages() {
this.pageTip -= 1;
this.params.page -= 1;
@@ -537,7 +517,11 @@ export default {
this.getListTop();
},
- /* 点击目标详情/空间维度事件 */
+ /**
+ * @description: 点击目标详情/空间维度事件
+ * @param {*}
+ * @return {*}
+ */
clickImage(item) {
if (this.labelCheck === "aim") {
this.labelCheck = "aria";
@@ -552,7 +536,11 @@ export default {
}
},
- /* 键盘事件 */
+ /**
+ * @description: 键盘事件
+ * @param {*}
+ * @return {*}
+ */
handleKeydown(event) {
if (event.key === "ArrowUp") {
event.preventDefault();
@@ -618,7 +606,11 @@ export default {
}
},
- /* 图片红框位置 */
+ /**
+ * @description: 图片红框位置
+ * @param {*}
+ * @return {*}
+ */
getRectStyle([left, top, width, height], index) {
const image = this.$refs.mainImage;
const container = this.$refs.imageContainer;
@@ -697,6 +689,7 @@ export default {
.sidebar {
width: 15.5rem;
height: calc(100% - 2.5rem);
+ // height: 815px;
background-color: #1f292e;
padding: 10px;
overflow-y: auto;
@@ -771,12 +764,14 @@ export default {
.el-select-dropdown {
background-color: #102649;
border-color: #08204f;
+
.el-scrollbar {
.el-select-dropdown__wrap {
.el-scrollbar__view {
.el-select-dropdown__item {
color: #ffffff;
}
+
.el-select-dropdown__item:hover {
background-color: #2b4c7e;
}
@@ -819,7 +814,7 @@ export default {
width: 100%;
background-color: rgba(0, 0, 0, 0.5);
- .el-checkbox__input.is-checked + .el-checkbox__label {
+ .el-checkbox__input.is-checked+.el-checkbox__label {
color: inherit;
font-size: 1.1rem;
}
@@ -840,13 +835,14 @@ export default {
// 画框样式
.rect-overlay {
position: absolute;
+
// pointer-events: none;
// border: 2px solid red;
&:hover {
opacity: 0.7;
}
- > div {
+ >div {
cursor: pointer;
white-space: nowrap;
position: absolute;
diff --git a/src/views/big-screen/disease-components/traffic-log.vue b/src/views/big-screen/disease-components/traffic-log.vue
index b3ffcd8..d4d46e0 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-12-03 09:45:06
+ * @LastEditTime: 2024-12-04 17:33:58
* @FilePath: \znxjxt-ui\src\views\big-screen\disease-components\traffic-log.vue
* @Description: 病害巡检-病害日志
-->
@@ -10,138 +10,60 @@
-
+
-
-
+
+
-
-
+
+
+
+
+
+
+
+
-
+
-
-
-
+
-
+
+
-
-
+
+
-
-
+
+
- 搜索
- 重置
+ 搜索
+ 重置
-
+
-
+
@@ -150,28 +72,16 @@
- 详情
+ 详情
@@ -198,6 +108,8 @@ export default {
routeId: "",
// 路段名称
segmentId: "",
+ // 上下行
+ inspectDirection: "",
// 公里桩
stakeStart: "",
stakeEnd: "",
@@ -269,6 +181,7 @@ export default {
if (val) {
this.getSegmentList(val);
} else {
+ this.trafficForm.segmentId = "";
this.segmentList = [];
}
},
@@ -356,6 +269,8 @@ export default {
routeId: "",
// 路段名称
segmentId: "",
+ // 上下行
+ inspectDirection: "",
// 公里桩
stakeStart: "",
stakeEnd: "",
@@ -421,7 +336,7 @@ export default {
.traffic-form {
width: calc(100% - 0.5rem);
- height: 19rem;
+ height: 22rem;
padding: 0.5rem;
.form-item {
@@ -439,6 +354,13 @@ export default {
::v-deep .el-form-item__label {
color: #ffffff;
}
+
+ // 修改时间选择器样式
+ // 修改时间中间 至 颜色
+ ::v-deep .el-input__inner .el-range-separator {
+ color: #ffffff;
+ }
+
}
::v-deep .el-input__inner {
@@ -470,6 +392,7 @@ export default {
.el-select-dropdown {
background-color: #102649;
border-color: #08204f;
+
.el-scrollbar {
.el-select-dropdown__wrap {
.el-scrollbar__view {
@@ -539,7 +462,7 @@ export default {
::v-deep .traffic-table {
width: 100%;
- height: 50%;
+ height: 42%;
padding: 0.5rem 0;
overflow: hidden;
@@ -582,7 +505,7 @@ export default {
}
// 去除鼠标移动高亮
- &:hover > td {
+ &:hover>td {
background-color: transparent;
}
@@ -600,6 +523,7 @@ export default {
::v-deep .el-pagination {
color: #ffffff;
+
.btn-prev,
.btn-next {
background-color: #6481aa;
@@ -642,3 +566,37 @@ export default {
}
}
+
diff --git a/src/views/big-screen/overview-components/components/inspection-follow.vue b/src/views/big-screen/overview-components/components/inspection-follow.vue
index 346cb96..9bdab00 100644
--- a/src/views/big-screen/overview-components/components/inspection-follow.vue
+++ b/src/views/big-screen/overview-components/components/inspection-follow.vue
@@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com
* @Date: 2024-11-15 13:14:03
* @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2024-12-04 09:48:03
+ * @LastEditTime: 2024-12-04 16:22:36
* @FilePath: \znxjxt-ui\src\views\big-screen\overview-components\components\inspection-follow.vue
* @Description: 总览大屏-巡检车辆-跟车弹窗
-->
@@ -56,6 +56,7 @@ export default {
*/
handleMessage() {
this.$ws.on("message", (itemMessage) => {
+ console.log(itemMessage,'itemMessage');
if (itemMessage.type === "carPosition") {
if (this.carPointList.includes(itemMessage.data.entityId)) {
// 获取当前位置和目标位置
@@ -104,11 +105,11 @@ export default {
} else {
this.carPointList.push(itemMessage.data.entityId);
this.drawCarMapPoint(itemMessage.data);
- // 修改当前地图中心点
if (this.dialogItem.extId === itemMessage.data.entityId) {
this.$nextTick(() => {
const map = this.$refs.carMap.instance.get("map");
map.getView().setCenter(itemMessage.data.location);
+ map.getView().setZoom(17)
});
}
}
@@ -117,7 +118,7 @@ export default {
this.drawDefectMapPoint(itemMessage.data);
} else {
const feature = new Feature({
- geometry: new Point(itemMessage.geometry.coordinates),
+ geometry: new Point(itemMessage.data.geometry.coordinates),
data: itemMessage,
type: "defectPoint",
});
@@ -126,7 +127,7 @@ export default {
new Style({
image: new Icon({
crossOrigin: "anonymous",
- src: require(`@/assets/screen/index/${itemMessage.defecttype}.png`),
+ src: require(`@/assets/screen/index/${itemMessage.data.defecttype}.png`),
// 图标缩放比例
scale: 0.5,
}),
diff --git a/src/views/big-screen/overview-components/inspection-vehicles.vue b/src/views/big-screen/overview-components/inspection-vehicles.vue
index d0d03b7..4a0e12c 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-12-04 09:41:55
+ * @LastEditTime: 2024-12-04 16:20:31
* @FilePath: \znxjxt-ui\src\views\big-screen\overview-components\inspection-vehicles.vue
* @Description: 总览大屏-巡检车辆
-->
@@ -84,6 +84,7 @@
跟车
@@ -101,7 +101,7 @@
-
+
-
-
-
- {{ scope.row.warningFlag === 1 ? "是" : "否" }}
-
-
-