pc-master #208

Merged
xiaomeng merged 2 commits from pc-master into portal 2024-12-27 03:13:22 +00:00
5 changed files with 596 additions and 908 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 6.3 MiB

After

Width:  |  Height:  |  Size: 3.7 MiB

BIN
src/assets/img/map7.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 MiB

View File

@ -476,7 +476,7 @@ export default {
// item.id == 1 ;
// item.id == 5 ;
//
const foundObject = this.limitUserId.find(item => item.id == 2 || item.id == 1 || item.id == 5|| item.id == 7|| item.id == 8|| item.id == 9|| item.id == 10);
const foundObject = this.limitUserId.find(item => item.id == 2 || item.id == 1 || item.id == 5|| item.id == 7|| item.id == 8|| item.id == 9|| item.id == 10|| item.id == 11);
if (!foundObject) {
this.$message('您当前没有权限查看!')
return

View File

@ -193,6 +193,11 @@
<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 class="drag_box11" ref="drag_box11" v-show="limitUserId == 11">
<img class="drag_img" src="../../assets/img/map7.png" alt="" />
<img class="axis_shimen" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
</div>
</div>
</div>
</div>
@ -365,7 +370,7 @@
</div>
</div>
<!-- 大冶鑫 -->
<div class="content_item" v-if="limitUserId == 7 || limitUserId == 9|| limitUserId == 10">
<div class="content_item" v-if="limitUserId == 7 || limitUserId == 9|| limitUserId == 10|| limitUserId == 11">
<div v-for="(item, index) in fiveControlList" :key="index" style="margin-bottom: 0.15rem">
<div class="i_title" v-if="item.controlState != 0">
<img src="../../assets/img/i_title_img.png" alt="" />
@ -490,361 +495,6 @@ export default {
//
//autoPlay: false, //false true
typeList: [
{
label: "无意义的传感器",
value: 0,
countType: 0,
},
{
label: "空气温度",
value: 1,
countType: 3,
unit: "℃",
},
{
label: "空气湿度",
value: 2,
countType: 2,
unit: "%",
},
{
label: "光亮度",
value: 3,
countType: 2,
unit: "Klux",
},
{
label: "二氧化碳",
value: 4,
countType: 0,
unit: "ppm",
},
{
label: "土壤温度",
value: 5,
countType: 3,
unit: "℃",
},
{
label: "土壤湿度",
value: 6,
countType: 2,
unit: "%",
},
{
label: "水温",
value: 7,
countType: 3,
unit: "℃",
},
{
label: "水肥PH",
value: 8,
countType: 2,
unit: "",
},
{
label: "水肥EC",
value: 9,
countType: 2,
unit: "mS/cm",
},
{
label: "压差",
value: 10,
countType: 0,
unit: "Pa",
},
{
label: "风速",
value: 11,
countType: 2,
unit: "m/s",
},
{
label: "风向",
value: 12,
countType: 0,
unit: "°",
},
{
label: "雨雪信号",
value: 13,
countType: 0,
unit: "",
},
{
label: "降雨量",
value: 14,
countType: 2,
unit: "mm",
},
{
label: "光合有效辐射",
value: 15,
countType: 2,
unit: "umol/m2.s",
},
{
label: "太阳总辐射",
value: 16,
countType: 0,
unit: "W/m2",
},
{
label: "流量",
value: 17,
countType: 0,
unit: "L/H",
},
{
label: "大气压强",
value: 18,
countType: 2,
unit: "KPa",
},
{
label: "土壤PH",
value: 19,
countType: 2,
unit: "",
},
{
label: "土壤EC",
value: 20,
countType: 0,
unit: "uS/cm",
},
{
label: "叶面温度",
value: 21,
countType: 3,
unit: "℃",
},
{
label: "叶面湿度",
value: 22,
countType: 2,
unit: "%",
},
{
label: "果实直径",
value: 23,
countType: 0,
unit: "mm",
},
{
label: "茎秆直径",
value: 24,
countType: 0,
unit: "mm",
},
{
label: "流速",
value: 25,
countType: 2,
unit: "m/s",
},
{
label: "瞬时流量",
value: 26,
countType: 2,
unit: "m3",
},
{
label: "当日流量",
value: 27,
countType: 2,
unit: "T",
},
{
label: "累计流量",
value: 28,
countType: 0,
unit: "T",
},
{
label: "无线气象站电池电压",
value: 29,
countType: 2,
unit: "V",
},
{
label: "无线气象站无线信号强度",
value: 30,
countType: 1,
unit: "dBm",
},
{
label: "无线气象站信噪比SNR",
value: 31,
countType: 1,
unit: "dB",
},
{
label: "PM1.0",
value: 32,
countType: 0,
unit: "μg/m2",
},
{
label: "PM2.5",
value: 33,
countType: 0,
unit: "μg/m2",
},
{
label: "PM10",
value: 34,
countType: 0,
unit: "μg/m2",
},
{
label: "紫外辐射",
value: 35,
countType: 0,
unit: "W/m2",
},
{
label: "蒸发量",
value: 36,
countType: 2,
unit: "mm",
},
{
label: "负氧离子",
value: 37,
countType: 0,
unit: "个/cm3",
},
{
label: "露点温度",
value: 38,
countType: 3,
unit: "℃",
},
{
label: "设备电压",
value: 39,
countType: 2,
unit: "V",
},
{
label: "设备电流",
value: 40,
countType: 2,
unit: "A",
},
{
label: "土壤氮含量",
value: 41,
countType: 0,
unit: "mg/kg",
},
{
label: "土壤磷含量",
value: 42,
countType: 0,
unit: "mg/kg",
},
{
label: "土壤钾含量",
value: 43,
countType: 0,
unit: "mg/kg",
},
{
label: "管道压力",
value: 44,
countType: 0,
unit: "Kpa",
},
{
label: "一氧化碳",
value: 45,
countType: 0,
unit: "ppm",
},
{
label: "氨气",
value: 46,
countType: 0,
unit: "ppm",
},
{
label: "硫化氢",
value: 47,
countType: 0,
unit: "ppm",
},
{
label: "氧气",
value: 48,
countType: 2,
unit: "%vol",
},
{
label: "甲烷",
value: 49,
countType: 2,
unit: "%vol",
},
{
label: "铜CU",
value: 50,
countType: 0,
unit: "mg/kg",
},
{
label: "镉CD",
value: 51,
countType: 2,
unit: "mg/kg",
},
{
label: "铅PB",
value: 52,
countType: 0,
unit: "mg/kg",
},
{
label: "噪声",
value: 53,
countType: 0,
unit: "dB",
},
{
label: "叶面面积",
value: 54,
countType: 0,
unit: "mm",
},
{
label: "虫数量",
value: 55,
countType: 0,
unit: "个",
},
{
label: "无线传感器电池电压",
value: 56,
countType: 2,
unit: "V",
},
{
label: "无线传感器无线信号强度",
value: 57,
countType: 1,
unit: "dBm",
},
{
label: "无线传感器信噪比SNR",
value: 58,
countType: 1,
unit: "dB",
},
],
limitUserId: "",
@ -986,7 +636,7 @@ export default {
this.get_environmentData(2023120613270120);
this.get_readControl_getState(2023120613270120);
this.getWeatherData(2023120613270120);
} else if (limitUserId == 8||limitUserId == 10) {
} else if (limitUserId == 8||limitUserId == 10||limitUserId == 11) {
// Id
const list = []
this.$store.state.equipmentList.forEach((el, index) => {
@ -1271,7 +921,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 || el.id == 8 || el.id == 9|| el.id == 10))[0].id;
this.limitUserId = (res.data.data.filter(el => el.id == 2 || el.id == 1 || el.id == 5 || el.id == 7 || el.id == 8 || el.id == 9|| el.id == 10|| el.id == 11))[0].id;
if (this.limitUserId == 1) {
this.drag_boxHandler();
this.dataInit(userId, this.limitUserId);
@ -1293,6 +943,9 @@ export default {
}else if (this.limitUserId == 10) {
this.drag_boxHandler10();
this.dataInit(userId, this.limitUserId);
}else if (this.limitUserId == 11) {
this.drag_boxHandler11();
this.dataInit(userId, this.limitUserId);
}
}
@ -1390,7 +1043,7 @@ export default {
this.get_readControl_getState(2023042214250070);
} else if (this.limitUserId == 7) {
this.get_readControl_getState(2023120613270120);
} else if (this.limitUserId == 8||this.limitUserId == 9||this.limitUserId == 10) {
} else if (this.limitUserId == 8||this.limitUserId == 9||this.limitUserId == 10||this.limitUserId == 11) {
this.get_readControl_getState(list[0].deviceId);
}
@ -1531,6 +1184,63 @@ export default {
}
};
},
drag_boxHandler11() {
let demo = this.$refs.drag_box11;
demo = document.querySelector(".drag_box11"); //
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_boxHandler10() {
let demo = this.$refs.drag_box10;
demo = document.querySelector(".drag_box10"); //
@ -2465,6 +2175,39 @@ export default {
cursor: pointer;
}
}
.drag_box11 {
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.3rem;
height: auto;
position: absolute;
top: 18%;
left: 42%;
z-index: 99;
cursor: pointer;
}
}
.drag_box10 {
width: 100%;
height: auto;

View File

@ -33,36 +33,20 @@
</div>
<div class="popBox" v-for="(item, index) in popContentList" :key="index">
<template>
<div
class="pole_item"
:style="getNamePosition(item.id)"
@click="handlerPop(item.id)"
>
<div class="pole_item" :style="getNamePosition(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=""
/>
<img class="pole1" src="../../assets/img/pole1.png" alt="" />
</div>
</template>
<!-- 弹框 -->
<template>
<div
class="pop_content"
:style="getTopOrLeft(item.id)"
v-show="popContentCurrent == item.id ? true : false"
>
<img
class="close_img"
src="../../assets/img/close.png"
alt=""
@click="cancelHandler"
/>
<div class="pop_content" :style="getTopOrLeft(item.id)"
v-show="popContentCurrent == item.id ? true : false">
<img class="close_img" src="../../assets/img/close.png" alt="" @click="cancelHandler" />
<div class="p_video">
<img :src="item.greenhouseImage" alt="" />
</div>
@ -89,20 +73,12 @@
</div>
<div class="line" style="margin-top: 0.2rem"></div>
<div class="icon_item scroll">
<div
class="icon_item_child"
v-for="(item1, index1) in item.childList"
:key="index1"
>
<div class="icon_item_child" v-for="(item1, index1) in item.childList" :key="index1">
<!-- <img :src="item.formula" alt=""> -->
<img
:src="
require('../../assets/image/real-time-' +
<img :src="require('../../assets/image/real-time-' +
item1.formula +
'.png')
"
alt=""
/>
" alt="" />
<div>
<span>{{ item1.environmentDataId }}</span>
<span>{{
@ -126,10 +102,7 @@
<img class="drag_img" src="../../assets/img/map1.png" alt="" />
<div class="popBox" v-for="(item, index) in popContentList1" :key="index + '_1'">
<template>
<div
class="pole_item"
:style="
'top:' +
<div class="pole_item" :style="'top:' +
(21 + index * 0.1) +
'%' +
';' +
@ -137,34 +110,20 @@
(82.7 - index * 3.21) +
'%' +
';'
"
@click="handlerPop1(item.id)"
>
" @click="handlerPop1(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=""
/>
<img class="pole1" src="../../assets/img/pole1.png" alt="" />
</div>
</template>
<!-- 弹框 -->
<template>
<div
class="pop_content1"
v-show="popContentCurrent1 == item.id ? true : false"
:style="getTopOrLeft1(item.id)"
>
<img
class="close_img"
src="../../assets/img/close.png"
alt=""
@click="cancelHandler1"
/>
<div class="pop_content1" v-show="popContentCurrent1 == item.id ? true : false"
:style="getTopOrLeft1(item.id)">
<img class="close_img" src="../../assets/img/close.png" alt="" @click="cancelHandler1" />
<div class="p_video">
<img :src="item.greenhouseImage" alt="" />
</div>
@ -187,19 +146,11 @@
</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-' +
<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=""
/>
" alt="" />
<div>
<span>{{ item1.environmentDataId }}</span>
<span>{{
@ -214,10 +165,7 @@
<div class="popBox" v-for="(item, index) in popContentList2" :key="index + '_2'">
<template>
<div
class="pole_item_1"
:style="
'top:' +
<div class="pole_item_1" :style="'top:' +
(51 + index * 0.2) +
'%' +
';' +
@ -225,34 +173,20 @@
(80 - index * 3.95) +
'%' +
';'
"
@click="handlerPop1(item.id)"
>
" @click="handlerPop1(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=""
/>
<img class="pole1" src="../../assets/img/pole1.png" alt="" />
</div>
</template>
<!-- 弹框 -->
<template>
<div
class="pop_content1"
v-show="popContentCurrent1 == item.id ? true : false"
:style="getTopOrLeft11(item.id)"
>
<img
class="close_img"
src="../../assets/img/close.png"
alt=""
@click="cancelHandler1"
/>
<div class="pop_content1" v-show="popContentCurrent1 == item.id ? true : false"
:style="getTopOrLeft11(item.id)">
<img class="close_img" src="../../assets/img/close.png" alt="" @click="cancelHandler1" />
<div class="p_video">
<img :src="item.greenhouseImage" alt="" />
</div>
@ -275,19 +209,11 @@
</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-' +
<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=""
/>
" alt="" />
<div>
<span>{{ item1.environmentDataId }}</span>
<span>{{
@ -316,27 +242,15 @@
<img src="../../assets/img/wenshi.png" alt="" />
<span>{{ item.greenhouseName }}#温室</span>
</div>
<img
class="pole1"
src="../../assets/img/pole1.png"
alt=""
/>
<img class="pole1" src="../../assets/img/pole1.png" alt="" />
</div>
</template>
<!-- 弹框 -->
<template>
<div
class="pop_content1"
v-show="popContentCurrent == item.id ? true : false"
:style="getTopOrLeft55(item.id)"
>
<img
class="close_img"
src="../../assets/img/close.png"
alt=""
@click="cancelHandler"
/>
<div class="pop_content1" v-show="popContentCurrent == item.id ? true : false"
:style="getTopOrLeft55(item.id)">
<img class="close_img" src="../../assets/img/close.png" alt="" @click="cancelHandler" />
<div class="p_video">
<img :src="item.greenhouseImage" alt="" />
</div>
@ -359,19 +273,11 @@
</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-' +
<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=""
/>
" alt="" />
<div>
<span>{{ item1.environmentDataId }}</span>
<span>{{
@ -400,27 +306,15 @@
<img src="../../assets/img/wenshi.png" alt="" />
<span>{{ item.greenhouseName }}#温室</span>
</div>
<img
class="pole1"
src="../../assets/img/pole1.png"
alt=""
/>
<img class="pole1" src="../../assets/img/pole1.png" alt="" />
</div>
</template>
<!-- 弹框 -->
<template>
<div
class="pop_content1"
v-show="popContentCurrent == item.id ? true : false"
:style="getTopOrLeft77(item.id)"
>
<img
class="close_img"
src="../../assets/img/close.png"
alt=""
@click="cancelHandler"
/>
<div class="pop_content1" v-show="popContentCurrent == item.id ? true : false"
:style="getTopOrLeft77(item.id)">
<img class="close_img" src="../../assets/img/close.png" alt="" @click="cancelHandler" />
<div class="p_video">
<img :src="item.greenhouseImage" alt="" />
</div>
@ -443,19 +337,11 @@
</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-' +
<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=""
/>
" alt="" />
<div>
<span>{{ item1.environmentDataId }}</span>
<span>{{
@ -484,11 +370,7 @@
<img src="../../assets/img/wenshi.png" alt="" />
<span>泵房</span>
</div>
<img
class="pole1"
src="../../assets/img/pole1.png"
alt=""
/>
<img class="pole1" src="../../assets/img/pole1.png" alt="" />
</div>
</template>
</div>
@ -499,27 +381,15 @@
<img src="../../assets/img/wenshi.png" alt="" />
<span>{{ item.greenhouseName }}#温室</span>
</div>
<img
class="pole1"
src="../../assets/img/pole1.png"
alt=""
/>
<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="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>
@ -542,19 +412,11 @@
</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-' +
<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=""
/>
" alt="" />
<div>
<span>{{ item1.environmentDataId }}</span>
<span>{{
@ -597,11 +459,7 @@
<img src="../../assets/img/wenshi.png" alt="" />
<span>100个拱棚</span>
</div>
<img
class="pole1"
src="../../assets/img/pole1.png"
alt=""
/>
<img class="pole1" src="../../assets/img/pole1.png" alt="" />
</div>
</div>
<div class="popBox" v-for="(item, index) in popContentList" :key="index">
@ -611,27 +469,15 @@
<img src="../../assets/img/wenshi.png" alt="" />
<span>{{ item.greenhouseName }} </span>
</div>
<img
class="pole1"
src="../../assets/img/pole1.png"
alt=""
/>
<img class="pole1" src="../../assets/img/pole1.png" alt="" />
</div>
</template>
<!-- 弹框 -->
<template>
<div
class="pop_content1"
v-show="popContentCurrent == item.id ? true : false"
:style="getTopOrLeft9_9(item.id)"
>
<img
class="close_img"
src="../../assets/img/close.png"
alt=""
@click="cancelHandler"
/>
<div class="pop_content1" v-show="popContentCurrent == item.id ? true : false"
:style="getTopOrLeft9_9(item.id)">
<img class="close_img" src="../../assets/img/close.png" alt="" @click="cancelHandler" />
<div class="p_video">
<img :src="item.greenhouseImage" alt="" />
</div>
@ -654,19 +500,11 @@
</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-' +
<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=""
/>
" alt="" />
<div>
<span>{{ item1.environmentDataId }}</span>
<span>{{
@ -682,7 +520,7 @@
</div>
</div>
</div>
<!-- 甘井设施农业 -->
<!-- 丽水凤鸣共富葡萄 -->
<div class="content" v-show="limitUserId == 10">
<div class="map">
<div class="map1">
@ -694,11 +532,7 @@
<img src="../../assets/img/wenshi.png" alt="" />
<span>泵房</span>
</div>
<img
class="pole1"
src="../../assets/img/pole1.png"
alt=""
/>
<img class="pole1" src="../../assets/img/pole1.png" alt="" />
</div>
</div>
<div class="popBox">
@ -707,11 +541,7 @@
<img src="../../assets/img/wenshi.png" alt="" />
<span>控制中心</span>
</div>
<img
class="pole1"
src="../../assets/img/pole1.png"
alt=""
/>
<img class="pole1" src="../../assets/img/pole1.png" alt="" />
</div>
</div>
<div class="popBox" v-for="(item, index) in popContentList" :key="index">
@ -721,27 +551,15 @@
<img src="../../assets/img/wenshi.png" alt="" />
<span>{{ item.greenhouseName }} </span>
</div>
<img
class="pole1"
src="../../assets/img/pole1.png"
alt=""
/>
<img class="pole1" src="../../assets/img/pole1.png" alt="" />
</div>
</template>
<!-- 弹框 -->
<template>
<div
class="pop_content1"
v-show="popContentCurrent == item.id ? true : false"
:style="getTopOrLeft10_10(item.id)"
>
<img
class="close_img"
src="../../assets/img/close.png"
alt=""
@click="cancelHandler"
/>
<div class="pop_content1" v-show="popContentCurrent == item.id ? true : false"
:style="getTopOrLeft10_10(item.id)">
<img class="close_img" src="../../assets/img/close.png" alt="" @click="cancelHandler" />
<div class="p_video">
<img :src="item.greenhouseImage" alt="" />
</div>
@ -764,19 +582,85 @@
</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-' +
<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=""
/>
" alt="" />
<div>
<span>{{ item1.environmentDataId }}</span>
<span>{{
item1.environmentData + getTypeList(item1.formula)
}}</span>
</div>
</div>
</div>
</div>
</template>
</div>
</div>
</div>
</div>
</div>
<!-- 镇海欣丰农场 -->
<div class="content" v-show="limitUserId == 11">
<div class="map">
<div class="map1">
<div class="drag_box11" ref="drag_box11">
<img class="drag_img" src="../../assets/img/map7.png" alt="" />
<!-- <div class="popBox">
<div class="pole_item" style="top:78.5%;left:40.5%;z-index:1;" @click="toHttp">
<div class="p_title">
<img src="../../assets/img/wenshi.png" alt="" />
<span>泵房</span>
</div>
<img class="pole1" src="../../assets/img/pole1.png" alt="" />
</div>
</div> -->
<div class="popBox" v-for="(item, index) in popContentList" :key="index">
<template>
<div class="pole_item" :style="getTopOrLeft11(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="getTopOrLeft11_11(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>{{
@ -1278,12 +1162,10 @@ export default {
for (let i = 0; i < 25; i++) {
if (id == i + 1) {
if (i < 20) {
return `top:40%;left:${
74 - i * 3 < 15 ? 15 : 74 - i * 3
return `top:40%;left:${74 - i * 3 < 15 ? 15 : 74 - i * 3
}%;transform: translate(-50%,-50%);`;
} else {
return `top:40%;left:${
74 - i * 3 < 15 ? 15 + (i - 20) * 3 : 74 - i * 3
return `top:40%;left:${74 - i * 3 < 15 ? 15 + (i - 20) * 3 : 74 - i * 3
}%;transform: translate(-50%,-50%);`;
}
}
@ -1467,6 +1349,16 @@ export default {
return 'top:68%;left:54%;transform: translate(54%,0%);'
}
},
getTopOrLeft11(id) {
if (id == 1) {
return 'top:14.5%;left:41%;z-index:10;'
}
},
getTopOrLeft11_11(id) {
if (id == 1) {
return 'top:14.5%;left:41%;transform: translate(54%,0);'
}
},
getNamePosition(id) {
if (id == 1) {
return "position: absolute;top: 41%;left: 13%;";
@ -1586,7 +1478,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|| el.id == 8|| el.id == 9|| el.id == 10))[0].id;
this.limitUserId = (res.data.data.filter(el => el.id == 1 || el.id == 2 || el.id == 5 || el.id == 7 || el.id == 8 || el.id == 9 || el.id == 10|| el.id == 11))[0].id;
if (this.limitUserId == 1) {
this.drag_boxHandler();
} else if (this.limitUserId == 2) {
@ -1601,6 +1493,8 @@ export default {
this.drag_boxHandler9();
} else if (this.limitUserId == 10) {
this.drag_boxHandler10();
} else if (this.limitUserId == 11) {
this.drag_boxHandler11();
}
}
});
@ -1784,6 +1678,73 @@ toHttp(){
}
};
},
drag_boxHandler11() {
let demo = this.$refs.drag_box11;
demo = document.querySelector(".drag_box11"); //
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_boxHandler10() {
let demo = this.$refs.drag_box10;
demo = document.querySelector(".drag_box10"); //
@ -2151,12 +2112,10 @@ toHttp(){
opacity: 0.89;
text-shadow: 0.01 0.1rem 0.2rem rgba(0, 51, 103, 0.25);
background: linear-gradient(
to bottom,
background: linear-gradient(to bottom,
#ffffff 45%,
#e9f8ff 90%,
#77baff 100%
);
#77baff 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
text-align: center;
@ -2187,12 +2146,10 @@ toHttp(){
}
.act {
background: linear-gradient(
-35deg,
background: linear-gradient(-35deg,
#56a8d5 0%,
rgba(0, 55, 110, 0.75) 50%,
#56a8d5 100%
);
#56a8d5 100%);
border: 1px solid rgba(122, 225, 255, 0.75);
font-size: 0.18rem;
font-family: MicrosoftYaHei;
@ -2275,25 +2232,21 @@ toHttp(){
top: 0;
left: 0;
z-index: 99;
-webkit-mask-image: linear-gradient(
90deg,
-webkit-mask-image: linear-gradient(90deg,
transparent 0%,
blue 7%,
blue 87%,
transparent 97%
);
transparent 97%);
.map1 {
width: 100%;
height: 100%;
// background: url('../assets/img/map.png') center no-repeat;
// background-size: 100% 100%;
-webkit-mask-image: linear-gradient(
transparent 4%,
-webkit-mask-image: linear-gradient(transparent 4%,
blue 15%,
blue 86%,
transparent 100%
);
transparent 100%);
overflow: hidden;
position: absolute;
@ -2301,23 +2254,19 @@ toHttp(){
width: 100%;
height: 100%;
position: absolute;
-webkit-mask-image: linear-gradient(
90deg,
-webkit-mask-image: linear-gradient(90deg,
transparent 0%,
blue 5%,
blue 93%,
transparent 99%
);
transparent 99%);
.drag_img {
width: 100%;
height: 100%;
-webkit-mask-image: linear-gradient(
transparent 0%,
-webkit-mask-image: linear-gradient(transparent 0%,
blue 13%,
blue 73%,
transparent 97%
);
transparent 97%);
}
.pole_item,
@ -2528,23 +2477,19 @@ toHttp(){
width: 100%;
height: 100%;
position: absolute;
-webkit-mask-image: linear-gradient(
90deg,
-webkit-mask-image: linear-gradient(90deg,
transparent 4%,
blue 18%,
blue 88%,
transparent 100%
);
transparent 100%);
.drag_img {
width: 100%;
height: 100%;
-webkit-mask-image: linear-gradient(
transparent 0%,
-webkit-mask-image: linear-gradient(transparent 0%,
blue 13%,
blue 73%,
transparent 97%
);
transparent 97%);
}
.pole_item_4 {
@ -2788,7 +2733,11 @@ toHttp(){
}
}
.drag_box7,.drag_box8,.drag_box9,.drag_box10{
.drag_box7,
.drag_box8,
.drag_box9,
.drag_box10,
.drag_box11 {
width: 100%;
height: auto;
position: absolute;
@ -2804,12 +2753,10 @@ toHttp(){
.drag_img {
width: 100%;
height: auto;
-webkit-mask-image: linear-gradient(
transparent 0%,
-webkit-mask-image: linear-gradient(transparent 0%,
blue 3%,
blue 95%,
transparent 97%
);
transparent 97%);
}
.pole_item {
@ -2819,6 +2766,7 @@ toHttp(){
top: 21%;
left: 5%;
cursor: pointer;
.p_title {
// width: 0.5rem;
// height: 0.22rem;
@ -3016,27 +2964,24 @@ toHttp(){
}
}
}
.drag_box5 {
width: 100%;
height: 100%;
position: absolute;
-webkit-mask-image: linear-gradient(
90deg,
-webkit-mask-image: linear-gradient(90deg,
transparent 0%,
blue 5%,
blue 93%,
transparent 99%
);
transparent 99%);
.drag_img {
width: 100%;
height: 100%;
-webkit-mask-image: linear-gradient(
transparent 0%,
-webkit-mask-image: linear-gradient(transparent 0%,
blue 13%,
blue 73%,
transparent 97%
);
transparent 97%);
}
.pole_item {