xiaomeng
/
wszhyWx
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request '1' (#183) from pc-master into portal 

Reviewed-on: #183
portal
xiaomeng 2024-11-05 00:07:57 +00:00
parent a6404f964d 6b79c4086e
commit 74d5a7cd91
4 changed files with 396 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/img/map4.jpg 100644
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.4 MiB

2
src/views/index.vue
View File

@ -475,7 +475,7 @@ export default {
// item.id == 2 东北;
// item.id == 1 丽水;
// item.id == 5 石门;
const foundObject = this.limitUserId.find(item => item.id == 2 || item.id == 1 || item.id == 5|| item.id == 7);
const foundObject = this.limitUserId.find(item => item.id == 2 || item.id == 1 || item.id == 5|| item.id == 7|| item.id == 8);
if (!foundObject) {
this.$message('您当前没有权限查看!')
return

200
src/views/page/largeScreen.vue
View File

@ -155,6 +155,18 @@
<img class="axis_shimen4" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
<img class="axis_shimen5" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
</div>
<!-- 大冶鑫 -->
<div class="drag_box8" ref="drag_box8" v-show="limitUserId == 8">
<img class="drag_img" src="../../assets/img/map4.jpg" alt="" />
<img class="axis_shimen" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
<img class="axis_shimen1" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
<img class="axis_shimen2" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
<img class="axis_shimen3" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
<img class="axis_shimen4" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
<img class="axis_shimen5" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
<img class="axis_shimen6" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
<img class="axis_shimen7" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
</div>
</div>
</div>
</div>
@ -914,8 +926,6 @@ export default {
}
})
list.sort(this.compare('equipmentStatu'))
console.log(list, 123);
// 丽水
this.get_weather_echart_data(list[0].deviceId);
this.get_thisWeekTemperature_echart_data(list[0].deviceId);
@ -943,6 +953,22 @@ export default {
this.get_environmentData(2023120613270120);
this.get_readControl_getState(2023120613270120);
this.getWeatherData(2023120613270120);
} else if (limitUserId == 8) {
// 获取控制器第一个Id
const list = []
this.$store.state.equipmentList.forEach((el, index) => {
if (el.deviceName == 10) {
list.push(el)
}
})
list.sort(this.compare('equipmentStatu'))
// 大冶鑫
this.get_weather_echart_data(list[0].deviceId);
this.get_thisWeekTemperature_echart_data(list[0].deviceId);
this.get_environmentData(list[0].deviceId);
this.get_readControl_getState(list[0].deviceId);
this.getWeatherData(list[0].deviceId);
}
}
});
@ -1200,7 +1226,7 @@ export default {
// id == 1 丽水;
// id == 5 石门;
// id == 5 大冶鑫;
this.limitUserId = (res.data.data.filter(el => el.id == 2 || el.id == 1 || el.id == 5 || el.id == 7))[0].id;
this.limitUserId = (res.data.data.filter(el => el.id == 2 || el.id == 1 || el.id == 5 || el.id == 7|| el.id == 8))[0].id;
if (this.limitUserId == 1) {
this.drag_boxHandler();
this.dataInit(userId, this.limitUserId);
@ -1213,6 +1239,9 @@ export default {
} else if (this.limitUserId == 7) {
this.drag_boxHandler7();
this.dataInit(userId, this.limitUserId);
} else if (this.limitUserId == 8) {
this.drag_boxHandler8();
this.dataInit(userId, this.limitUserId);
}
}
});
@ -1292,14 +1321,25 @@ export default {
this.current1 = index;
// console.log(item,'00000000000000');
// this.get_readControl_getState(item.deviceId);
// 获取控制器第一个Id
const list = []
this.$store.state.equipmentList.forEach((el, index) => {
if (el.deviceName == 10) {
list.push(el)
}
})
list.sort(this.compare('equipmentStatu'))
if (this.limitUserId == 1) {
this.get_readControl_getState(2023042214250027);
this.get_readControl_getState(list[0].deviceId);
} else if (this.limitUserId == 2) {
this.get_readControl_getState(2023112911050004);
} else if (this.limitUserId == 5) {
this.get_readControl_getState(2023042214250070);
} else if (this.limitUserId == 7) {
this.get_readControl_getState(2023120613270120);
}else if (this.limitUserId == 8) {
this.get_readControl_getState(list[0].deviceId);
}
},
@ -1439,6 +1479,63 @@ export default {
}
};
},
drag_boxHandler8() {
let demo = this.$refs.drag_box8;
demo = document.querySelector(".drag_box8"); //待拖拽元素
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);
}
};
},
drag_boxHandler7() {
let demo = this.$refs.drag_box7;
demo = document.querySelector(".drag_box7"); //待拖拽元素
@ -2202,7 +2299,102 @@ export default {
cursor: pointer;
}
}
.drag_box8 {
width: 100%;
height: auto;
position: absolute;
// top: 0.3rem;
// left: 0.5rem;
z-index: 10;
top: -64px;
-webkit-mask-image: linear-gradient(90deg,
transparent 0%,
blue 2%,
blue 97%,
transparent 99%);
.drag_img {
width: 100%;
height: auto;
-webkit-mask-image: linear-gradient(transparent 0%,
blue 2%,
blue 95%,
transparent 97%);
}
.axis_shimen {
width: 0.4rem;
height: auto;
position: absolute;
top: 83%;
left: 30%;
z-index: 99;
cursor: pointer;
}
.axis_shimen1 {
width: 0.4rem;
height: auto;
position: absolute;
top: 66%;
left: 41%;
z-index: 99;
cursor: pointer;
}
.axis_shimen2 {
width: 0.4rem;
height: auto;
position: absolute;
top: 48%;
left: 54%;
z-index: 99;
cursor: pointer;
}
.axis_shimen3 {
width: 0.4rem;
height: auto;
position: absolute;
top: 28%;
left: 61%;
z-index: 99;
cursor: pointer;
}
.axis_shimen4 {
width: 0.4rem;
height: auto;
position: absolute;
top: 20%;
left: 59%;
z-index: 99;
cursor: pointer;
}
.axis_shimen5 {
width: 0.4rem;
height: auto;
position: absolute;
top: 10%;
left: 57%;
z-index: 99;
cursor: pointer;
}
.axis_shimen6 {
width: 0.4rem;
height: auto;
position: absolute;
top: 5%;
left: 54%;
z-index: 99;
cursor: pointer;
}
.axis_shimen7 {
width: 0.4rem;
height: auto;
position: absolute;
top: 0%;
left: 50%;
z-index: 99;
cursor: pointer;
}
}
.drag_box {
width: 100%;
height: 100%;

205
src/views/page/largeScreen1.vue
View File

@ -471,6 +471,90 @@
</div>
</div>
</div>
<!-- 大冶鑫 -->
<div class="content" v-show="limitUserId == 8">
<div class="map">
<div class="map1">
<div class="drag_box8" ref="drag_box8">
<img class="drag_img" src="../../assets/img/map4.jpg" alt="" />
<div class="popBox" v-for="(item, index) in popContentList" :key="index">
<template>
<div class="pole_item" :style="getTopOrLeft8(item.id)" @click="handlerPop(item.id)">
<div class="p_title">
<img src="../../assets/img/wenshi.png" alt="" />
<span>{{ item.greenhouseName }}#温室</span>
</div>
<img
class="pole1"
src="../../assets/img/pole1.png"
alt=""
/>
</div>
</template>
<!-- 弹框 -->
<template>
<div
class="pop_content1"
v-show="popContentCurrent == item.id ? true : false"
:style="getTopOrLeft8_8(item.id)"
>
<img
class="close_img"
src="../../assets/img/close.png"
alt=""
@click="cancelHandler"
/>
<div class="p_video">
<img :src="item.greenhouseImage" alt="" />
</div>
<div class="text">{{ item.greenhouseName }}</div>
<div class="line"></div>
<div class="detail">
<div class="d_item">
<img src="../../assets/img/detail_img.png" alt="" />
<span>品种：{{ item.greenhouseVariety }}</span>
</div>
<div class="d_item">
<img src="../../assets/img/detail_img.png" alt="" />
<span>数量：{{ item.greenhouseNums }}株</span>
</div>
</div>
<div class="grow">
<img src="../../assets/img/grow_img.png" alt="" />
<span>生长阶段：</span>
<span>{{ item.growthStageName }}</span>
</div>
<div class="line" style="margin-top: 0.06rem"></div>
<div class="icon_item scroll">
<div
class="icon_item_child"
v-for="(item1, index1) in item.childList"
:key="index1"
>
<img
:src="
require('../../assets/image/real-time-' +
item1.formula +
'.png')
"
alt=""
/>
<div>
<span>{{ item1.environmentDataId }}</span>
<span>{{
item1.environmentData + getTypeList(item1.formula)
}}</span>
</div>
</div>
</div>
</div>
</template>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
@ -1015,6 +1099,7 @@ export default {
return 'top:52%;left:64%'
}
},
getTopOrLeft77(id){
if(id == 1){
@ -1031,6 +1116,44 @@ export default {
return 'top:52%;left:64%;transform: translate(54%,-50%);'
}
},
getTopOrLeft8(id){
if(id == 1){
return 'top:79%;left:28%;z-index:8;'
}else if(id == 2){
return 'top:62%;left:39%;z-index:7;'
}else if(id == 3){
return 'top:48%;left:52%;z-index:6;'
}else if(id == 4){
return 'top:24%;left:59%;z-index:5;'
}else if(id == 5){
return 'top:16%;left:57%;z-index:4;'
}else if(id == 6){
return 'top:6%;left:55%;z-index:3;'
}else if(id == 7){
return 'top:1%;left:52%;z-index:2;'
}else if(id == 8){
return 'top:-4%;left:48%;z-index:1;'
}
},
getTopOrLeft8_8(id){
if(id == 1){
return 'top:79%;left:28%;transform: translate(54%,-50%);'
}else if(id == 2){
return 'top:62%;left:39%;transform: translate(54%,-50%);'
}else if(id == 3){
return 'top:48%;left:52%;transform: translate(54%,-50%);'
}else if(id == 4){
return 'top:24%;left:59%;transform: translate(54%,-50%);'
}else if(id == 5){
return 'top:16%;left:57%;transform: translate(54%,0%);'
}else if(id == 6){
return 'top:6%;left:55%;transform: translate(54%,0%);'
}else if(id == 7){
return 'top:1%;left:52%;transform: translate(54%,0%);'
}else if(id == 8){
return 'top:0%;left:48%;transform: translate(54%,0%);'
}
},
getNamePosition(id) {
if (id == 1) {
return "position: absolute;top: 41%;left: 13%;";
@ -1150,7 +1273,7 @@ export default {
get_user_getjurisdiction(userId) {
this.api.user_getjurisdiction(userId).then((res) => {
if (res.data.code == 200) {
this.limitUserId = (res.data.data.filter(el=>el.id == 1 || el.id == 2 || el.id == 5|| el.id == 7))[0].id;
this.limitUserId = (res.data.data.filter(el=>el.id == 1 || el.id == 2 || el.id == 5|| el.id == 7|| el.id == 8))[0].id;
if (this.limitUserId == 1) {
this.drag_boxHandler();
} else if (this.limitUserId == 2) {
@ -1159,6 +1282,8 @@ export default {
this.drag_boxHandler5();
} else if (this.limitUserId == 7) {
this.drag_boxHandler7();
} else if (this.limitUserId == 8) {
this.drag_boxHandler8();
}
}
});
@ -1340,6 +1465,73 @@ export default {
}
};
},
drag_boxHandler8() {
let demo = this.$refs.drag_box8;
demo = document.querySelector(".drag_box8"); //待拖拽元素
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;
//if (left > 0) left = 0 //当距离左边小于0时 让它为0
//if (top > 0) top = 0 //当距离上边小于0时 让它为0
// //右边距离为 标签距离左边最大距离(页面宽度减去div宽度得到)
// let maxLeft = window.innerWidth - demo.offsetWidth
// //下边距离为 标签距离上边最大距离(页面高度减去div高度度得到)
// let maxTop = window.innerHeight - demo.offsetHeight
// if (left > maxLeft) left = maxLeft
// if (top > maxTop) top = maxTop
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);
}
};
},
drag_boxHandler7() {
let demo = this.$refs.drag_box7;
demo = document.querySelector(".drag_box7"); //待拖拽元素
@ -2142,7 +2334,8 @@ export default {
}
}
}
.drag_box7{
.drag_box7,.drag_box8{
width: 100%;
height: auto;
position: absolute;
@ -2150,8 +2343,8 @@ export default {
-webkit-mask-image: linear-gradient(
90deg,
transparent 0%,
blue 5%,
blue 93%,
blue 2%,
blue 97%,
transparent 99%
);
@ -2160,8 +2353,8 @@ export default {
height: auto;
-webkit-mask-image: linear-gradient(
transparent 0%,
blue 13%,
blue 73%,
blue 3%,
blue 95%,
transparent 97%
);
}