diff --git a/src/api/xj/screen/disease-screen.js b/src/api/xj/screen/disease-screen.js index 3f06b8b..d3d10d2 100644 --- a/src/api/xj/screen/disease-screen.js +++ b/src/api/xj/screen/disease-screen.js @@ -27,11 +27,11 @@ export function roadTrends(query) { // params: query, // }); // } -export function roadToday(query) { +export function roadToday(params) { return request({ url: "/bigscreen/v2/getInspectionInfo", method: "get", - params: query, + params, }); } diff --git a/src/views/big-screen/disease-components/traffic-log.vue b/src/views/big-screen/disease-components/traffic-log.vue index 714f76f..017540a 100644 --- a/src/views/big-screen/disease-components/traffic-log.vue +++ b/src/views/big-screen/disease-components/traffic-log.vue @@ -22,10 +22,10 @@ @@ -114,7 +115,7 @@ diff --git a/src/views/big-screen/disease-components/traffic-statistic.vue b/src/views/big-screen/disease-components/traffic-statistic.vue index 08bec4f..42b3d11 100644 --- a/src/views/big-screen/disease-components/traffic-statistic.vue +++ b/src/views/big-screen/disease-components/traffic-statistic.vue @@ -10,9 +10,9 @@
@@ -11,9 +11,9 @@
@@ -107,6 +107,7 @@ :select="item.select" :is="item.component" :bottomTipClick="bottomTipClick" + :companyId="companyId" > @@ -171,15 +173,30 @@ v-if="elementDiv === 'OverviewScreen' && !showMap" >
- 本周 - 本月 +
- 本年 +
+ 本年 +
-
+
≥{{ mapLegendList.s5 }} ≥{{ mapLegendList.s4 }} ≥{{ mapLegendList.s3 }} @@ -311,7 +328,7 @@
-->
- {{ + {{ item.name }} @@ -556,6 +573,8 @@ export default { { name: "未完成工单数", value: 562254 }, { name: "已完成工单数", value: 562254 }, ], + // 工单时间选择绑定 + workOrderType: 1, // 图片背景下打点坐标数据 mapCareList: [], // 图例循环数据 @@ -578,6 +597,8 @@ export default { showMap: false, // 图片背景下popover弹窗病害名称 screenMapPopoverName: "", + // 图片背景下点击得公司id + companyId: null, // 图标类别切换标识 bottomTipClick: "1", @@ -633,6 +654,7 @@ export default { carPointList: [], // 小车地图点位features数组 mapPointFeatures: [], + // websocket监听事件id indexListenerId: Symbol("index-listener"), }; }, @@ -702,29 +724,6 @@ export default { this.noticeNum = total; } }); - // this.messageList = [ - // { - // title: "成功", - // status: "SUCCESS", - // time: "2024/45/62", - // car: "辽jskdn", - // content: "骄傲的是否哈德half绝对符合卡的法拉第", - // }, - // { - // title: "告警", - // status: "WARNING", - // time: "2024/45/62", - // car: "辽jskdn", - // content: "骄傲的是否哈德half绝对符合卡的法拉第", - // }, - // { - // title: "提醒", - // status: "REMIND", - // time: "2024/45/62", - // car: "辽jskdn", - // content: "骄傲的是否哈德half绝对符合卡的法拉第", - // }, - // ]; }, /** @@ -778,6 +777,7 @@ export default { const [node] = this.$refs.screenCascader.getCheckedNodes(); this.screenMapPopoverName = node?.label; this.getMapCare(value); + this.getLinePoint(); }, /** @@ -785,15 +785,19 @@ export default { * @return {void} */ changeOrder(val) { - this.workOrderList = [ - { name: "生成工单数", value: 54 }, - { name: "未完成工单数", value: 5254 }, - { name: "已完成工单数", value: 554 }, - ]; + if (this.workOrderType != val) { + this.workOrderType = val; + this.companyId; + this.workOrderList = [ + { name: "生成工单数", value: 54 }, + { name: "未完成工单数", value: 5254 }, + { name: "已完成工单数", value: 554 }, + ]; + } }, /** - * @description: 获取图片背景下坐标数据 + * @description: 获取图片背景下坐标数据以及图例数据 * @return {void} */ getMapCare(value) { @@ -803,6 +807,13 @@ export default { }; comppanyImg(data).then(({ code, data }) => { if (code === 200) { + this.mapLegendList = { + s1: "0", + s2: "20", + s3: "40", + s4: "60", + s5: "80", + }; this.mapCareList = data; } }); @@ -812,7 +823,8 @@ export default { * @description: 点击图片背景下公司名称切换地图 * @return {void} */ - showMapByCompany() { + showMapByCompany(val) { + this.companyId = val.id; this.showMap = true; this.getLinePoint(); }, @@ -824,6 +836,7 @@ export default { disabledMapCompany() { this.showMap = false; this.markLayerLines = null; + this.companyId = null; }, /** @@ -1021,28 +1034,39 @@ export default { * @return {void} */ getLinePoint() { - if (!this.markLayerLines) { - mapPciList().then(({ code, data }) => { - // if (code === 200 && data) { - // this.lineString = data.filter((item) => item.coordinates !== null); - // this.drawLine(); - // } - if (code === 200) { - this.lineString = [ - [123.09835060586187, 41.95723497452143], - [122.96926125039312, 41.8459984022558], - [123.14366920937749, 41.8185325819433], - [123.10384376992437, 41.71141588272455], - [122.91982277383062, 41.67708360733393], - [123.10109718789312, 41.6207786756933], - [123.37300880898687, 41.63039171280268], - [123.31121071328374, 41.8240257460058], - [123.21782692422124, 41.98195421280268], - ]; - this.drawLine(); + if (this.markLayerLines) { + // 清除线段图层 + this.$nextTick(() => { + let map = null; + if (this.$refs.roadMap) { + map = this.$refs.roadMap.instance.get("map"); + } else { + map = this.$refs.overViewMap.instance.get("map"); } + map.removeLayer(this.markLayerLines); + this.markLayerLines = null; }); } + mapPciList().then(({ code, data }) => { + // if (code === 200 && data) { + // this.lineString = data.filter((item) => item.coordinates !== null); + // this.drawLine(); + // } + if (code === 200) { + this.lineString = [ + [123.09835060586187, 41.95723497452143], + [122.96926125039312, 41.8459984022558], + [123.14366920937749, 41.8185325819433], + [123.10384376992437, 41.71141588272455], + [122.91982277383062, 41.67708360733393], + [123.10109718789312, 41.6207786756933], + [123.37300880898687, 41.63039171280268], + [123.31121071328374, 41.8240257460058], + [123.21782692422124, 41.98195421280268], + ]; + this.drawLine(); + } + }); }, /** @@ -1358,7 +1382,17 @@ export default { this.showIconList = true; // 进行地图打点 this.getCenterPiont(); - this.getLinePoint(); + // 清除线段图层 + this.$nextTick(() => { + let map = null; + if (this.$refs.roadMap) { + map = this.$refs.roadMap.instance.get("map"); + } else { + map = this.$refs.overViewMap.instance.get("map"); + } + map.removeLayer(this.markLayerLines); + this.markLayerLines = null; + }); } else if (item.component === "DiseaseScreen") { this.leftModuleList = [ { @@ -1696,14 +1730,18 @@ export default { align-items: flex-end; .btn-time { + cursor: pointer; width: 7rem; height: 2rem; + display: flex; + justify-content: center; + align-items: center; margin: 0; background: url("~@/assets/screen/index/btn-time.png") no-repeat; background-size: 100% 100%; border-color: transparent; color: #ffffff; - font-size: 0.8rem; + font-size: 0.7rem; font-family: "DouYu"; &:hover { @@ -1711,12 +1749,12 @@ export default { no-repeat; background-size: 100% 100%; } + } - &:focus { - background: url("~@/assets/screen/index/btn-time-click.png") - no-repeat; - background-size: 100% 100%; - } + .btn-time-click { + cursor: pointer; + background: url("~@/assets/screen/index/btn-time-click.png") no-repeat; + background-size: 100% 100%; } } @@ -1734,12 +1772,12 @@ export default { align-items: center; .value { - font-size: 0.8rem; + font-size: 0.7rem; font-family: "DouYu"; color: #ffffff; span { - font-size: 1.5rem; + font-size: 1.4rem; font-family: "DouYu"; background: linear-gradient( to bottom, @@ -1755,7 +1793,7 @@ export default { } .name { - font-size: 0.8rem; + font-size: 0.7rem; font-family: "DouYu"; color: #ffffff; } @@ -2149,37 +2187,6 @@ export default { color: #89c5e8; border-color: #6991cd; } - - .el-select-dropdown { - background-color: #102649; - border-color: #08204f; - - .el-scrollbar { - .el-select-dropdown__wrap { - .el-scrollbar__view { - .el-select-dropdown__item { - color: #aaabb8; - } - - .el-select-dropdown__item:hover { - background-color: #2b4c7e; - } - - .el-select-dropdown__item.selected { - background-color: #2b4c7e; - } - - .el-select-dropdown__item.hover { - background-color: #2b4c7e; - } - } - - .el-select-dropdown__list { - background-color: #102649; - } - } - } - } } // 修改级联样式 @@ -2195,6 +2202,39 @@ export default { }