diff --git a/src/assets/img/map2.png b/src/assets/img/map2.png new file mode 100644 index 00000000..763ccd3a Binary files /dev/null and b/src/assets/img/map2.png differ diff --git a/src/views/index.vue b/src/views/index.vue index 3dae874f..33bd51b9 100644 --- a/src/views/index.vue +++ b/src/views/index.vue @@ -284,9 +284,11 @@ export default { return } else if (item.router == 'largeScreen') { - const foundObject = this.limitUserId.find(item => item.id == 2); - const foundObject1 = this.limitUserId.find(item => item.id == 1); - if (!foundObject || !foundObject1) { + // item.id == 2 东北; + // item.id == 1 丽水; + // item.id == 5 石门; + const foundObject = this.limitUserId.find(item => item.id == 2 || item.id == 1 || item.id == 5); + if (!foundObject) { this.$message('您当前没有权限查看!') return } else { diff --git a/src/views/page/largeScreen.vue b/src/views/page/largeScreen.vue index ee563ee1..09821b3e 100644 --- a/src/views/page/largeScreen.vue +++ b/src/views/page/largeScreen.vue @@ -107,6 +107,7 @@
+
+
+ +
+ + + + + + +
@@ -240,7 +276,7 @@ @click="getCurrent(index, item)" > {{ - item.greenhouseName + (limitUserId == 1 ? "温室" : "") + item.greenhouseName }} @@ -340,16 +376,35 @@ -
-
+
+
+
+ + {{ item.title }} + + {{ + item.controlState == 1 ? "自动控制" : "手机控制" + }} + + 进度{{ item.progress }}% + 菜单 +
+
+ + {{ item.title }} + + 无效 + + 菜单 +
+
+
+ + +
+
{{ item.title }} @@ -932,6 +987,13 @@ export default { this.get_environmentData(2023112911050004); this.get_readControl_getState(2023112911050004); this.getWeatherData(2023112911050004); + }else if (limitUserId == 5) { + // 石门 + this.get_weather_echart_data(2023042214250070); + this.get_thisWeekTemperature_echart_data(2023042214250070); + this.get_environmentData(2023042214250070); + this.get_readControl_getState(2023042214250070); + this.getWeatherData(2023042214250070); } } }); @@ -1184,13 +1246,20 @@ export default { get_user_getjurisdiction(userId) { this.api.user_getjurisdiction(userId).then((res) => { if (res.data.code == 200) { - this.limitUserId = res.data.data[0].id; + // id == 2 东北; + // id == 1 丽水; + // id == 5 石门; + this.limitUserId = (res.data.data.filter(el=>el.id == 2 || el.id == 1 || el.id == 5))[0].id; + if (this.limitUserId == 1) { this.drag_boxHandler(); this.dataInit(userId, this.limitUserId); } else if (this.limitUserId == 2) { this.drag_boxHandler1(); this.dataInit(userId, this.limitUserId); + }else if (this.limitUserId == 5) { + this.drag_boxHandler5(); + this.dataInit(userId, this.limitUserId); } } }); @@ -1258,6 +1327,10 @@ export default { this.$router.push({ path: "/largeScreen1" }); }, + handlerAxis_5() { + this.$router.push({ path: "/largeScreen1" }); + }, + toBackPage() { this.$router.push({ path: "/realTime" }); }, @@ -1405,6 +1478,64 @@ export default { } }; }, + + drag_boxHandler5() { + let demo = this.$refs.drag_box5; + demo = document.querySelector(".drag_box5"); //待拖拽元素 + let canMove = false; //拖拽状态 + let x = 0, + y = 0; //鼠标位置 + //监听按下鼠标事件 + demo.onmousedown = function (e) { + x = e.pageX - demo.offsetLeft; + y = e.pageY - demo.offsetTop; + canMove = true; //激活拖拽状态 + }; + //监听右击鼠标事件 + demo.oncontextmenu = function (e) { + e.preventDefault(); //阻止默认行为 + }; + //监听鼠标抬起事件 + window.onmouseup = function () { + canMove = false; //关闭拖拽状态 + }; + + window.onblur = function () { + //窗口失去焦点事件 + canMove = false; //关闭拖拽状态 + }; + + //监听鼠标移动事件 + window.onmousemove = function (e) { + e.preventDefault(); //阻止默认行为(字不能拖走) + if (canMove) { + //对范围判断 + let left = e.pageX - x; + let top = e.pageY - y; + + demo.style.left = left + "px"; + demo.style.top = top + "px"; + } + }; + let scale = 1; + demo.onwheel = function (e) { + if (e.wheelDelta > 0) { + scale += 0.05; + if (scale > 4) { + scale = 4; + } + demo.style.transform = `scale(${scale})`; + // console.log(scale); + } else { + scale -= 0.05; + if (scale < 1) { + scale = 1; + } + demo.style.transform = `scale(${scale})`; + // console.log(scale); + } + }; + }, }, }; @@ -1898,6 +2029,76 @@ export default { } } + .drag_box5{ + width: 100%; + height: 100%; + position: absolute; + // top: 0.3rem; + // left: 0.5rem; + z-index: 10; + -webkit-mask-image: linear-gradient( + 90deg, + transparent 0%, + blue 5%, + blue 93%, + transparent 99% + ); + + .drag_img { + width: 100%; + height: 100%; + -webkit-mask-image: linear-gradient( + transparent 0%, + blue 13%, + blue 73%, + transparent 97% + ); + } + + .axis_shimen{ + width: 0.4rem; + height: 0.5rem; + position: absolute; + top: 49%; + left: 9%; + z-index: 99; + } + + .axis_shimen1{ + width: 0.3rem; + height: 0.4rem; + position: absolute; + top: 52%; + left: 16%; + z-index: 99; + } + + .axis_shimen2{ + width: 0.3rem; + height: 0.4rem; + position: absolute; + top: 50.3%; + left: 18%; + z-index: 99; + } + .axis_shimen3{ + width: 0.3rem; + height: 0.4rem; + position: absolute; + top: 48.3%; + left: 20%; + z-index: 99; + } + .axis_shimen4{ + width: 0.3rem; + height: 0.4rem; + position: absolute; + top: 46.3%; + left: 22%; + z-index: 99; + } + } + .drag_box { width: 100%; height: 100%;