pull/47/head
parent
45aed4098e
commit
3f04ee521b
|
|
@ -2,13 +2,13 @@
|
||||||
<div class="home">
|
<div class="home">
|
||||||
<div class="kuang">
|
<div class="kuang">
|
||||||
<div class="title">温室智慧云数据统计</div>
|
<div class="title">温室智慧云数据统计</div>
|
||||||
<div class="auto_play">
|
<!-- <div class="auto_play">
|
||||||
<span :class="autoPlay ? '' : 'act'" @click="autoPlay1">手动播放</span>
|
<span :class="autoPlay ? '' : 'act'" @click="autoPlay1">手动播放</span>
|
||||||
<span :class="autoPlay ? 'act' : ''" @click="autoPlay2">自动播放</span>
|
<span :class="autoPlay ? 'act' : ''" @click="autoPlay2">自动播放</span>
|
||||||
</div>
|
</div> -->
|
||||||
<div class="yuan">
|
<!-- <div class="yuan">
|
||||||
<img src="../../assets/img/big.png" alt="" />
|
<img src="../../assets/img/big.png" alt="" />
|
||||||
</div>
|
</div> -->
|
||||||
<div class="calendar" v-if="time">
|
<div class="calendar" v-if="time">
|
||||||
<img src="../../assets/img/calendar.png" alt="" />
|
<img src="../../assets/img/calendar.png" alt="" />
|
||||||
<span>{{ getNowTime() }}</span>
|
<span>{{ getNowTime() }}</span>
|
||||||
|
|
@ -316,7 +316,7 @@ export default {
|
||||||
player: null,
|
player: null,
|
||||||
|
|
||||||
// 自动跳转和手动跳转切换
|
// 自动跳转和手动跳转切换
|
||||||
autoPlay: false, //false 手动切换 true 自动切换
|
//autoPlay: false, //false 手动切换 true 自动切换
|
||||||
|
|
||||||
typeList: [
|
typeList: [
|
||||||
{
|
{
|
||||||
|
|
@ -943,29 +943,29 @@ export default {
|
||||||
this.dataInit(userInfo.userid);
|
this.dataInit(userInfo.userid);
|
||||||
this.get_sel_eqbyid(userInfo.userid);
|
this.get_sel_eqbyid(userInfo.userid);
|
||||||
|
|
||||||
this.autoPlay = JSON.parse(localStorage.getItem("autoPlay"));
|
// this.autoPlay = JSON.parse(localStorage.getItem("autoPlay"));
|
||||||
console.log(this.autoPlay);
|
// console.log(this.autoPlay);
|
||||||
if (this.autoPlay == false) {
|
// if (this.autoPlay == false) {
|
||||||
clearInterval(this.timer_) && this.timer_;
|
// clearInterval(this.timer_) && this.timer_;
|
||||||
} else {
|
// } else {
|
||||||
this.timer_ = setTimeout(() => {
|
// this.timer_ = setTimeout(() => {
|
||||||
this.$router.push({ path: "/largeScreen1" });
|
// this.$router.push({ path: "/largeScreen1" });
|
||||||
}, 20000);
|
// }, 20000);
|
||||||
}
|
// }
|
||||||
},
|
},
|
||||||
|
|
||||||
autoPlay1() {
|
// autoPlay1() {
|
||||||
this.autoPlay = false;
|
// this.autoPlay = false;
|
||||||
clearInterval(this.timer_) && this.timer_;
|
// clearInterval(this.timer_) && this.timer_;
|
||||||
localStorage.setItem("autoPlay", JSON.stringify(this.autoPlay));
|
// localStorage.setItem("autoPlay", JSON.stringify(this.autoPlay));
|
||||||
},
|
// },
|
||||||
autoPlay2() {
|
// autoPlay2() {
|
||||||
this.autoPlay = true;
|
// this.autoPlay = true;
|
||||||
localStorage.setItem("autoPlay", JSON.stringify(this.autoPlay));
|
// localStorage.setItem("autoPlay", JSON.stringify(this.autoPlay));
|
||||||
this.timer_ = setTimeout(() => {
|
// this.timer_ = setTimeout(() => {
|
||||||
this.$router.push({ path: "/largeScreen1" });
|
// this.$router.push({ path: "/largeScreen1" });
|
||||||
}, 20000);
|
// }, 20000);
|
||||||
},
|
// },
|
||||||
|
|
||||||
createVideoNew(accessToken, url, index) {
|
createVideoNew(accessToken, url, index) {
|
||||||
// console.log(accessToken, url, index, 111);
|
// console.log(accessToken, url, index, 111);
|
||||||
|
|
@ -1309,7 +1309,7 @@ export default {
|
||||||
width: 4rem;
|
width: 4rem;
|
||||||
height: calc(100% - 0.66rem);
|
height: calc(100% - 0.66rem);
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding-top: 0.56rem;
|
// padding-top: 0.56rem;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0.56rem;
|
top: 0.56rem;
|
||||||
left: 0.66rem;
|
left: 0.66rem;
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,10 @@
|
||||||
<div class="yuan" @click="toBack">
|
<div class="yuan" @click="toBack">
|
||||||
<img src="../../assets/img/small.png" alt="" />
|
<img src="../../assets/img/small.png" alt="" />
|
||||||
</div>
|
</div>
|
||||||
|
<div class="auto_play">
|
||||||
|
<span :class="autoPlay ? '' : 'act'" @click="autoPlay1">手动播放</span>
|
||||||
|
<span :class="autoPlay ? 'act' : ''" @click="autoPlay2">自动播放</span>
|
||||||
|
</div>
|
||||||
<div class="calendar">
|
<div class="calendar">
|
||||||
<img src="../../assets/img/calendar.png" alt="" />
|
<img src="../../assets/img/calendar.png" alt="" />
|
||||||
<span>{{ getNowTime() }}</span>
|
<span>{{ getNowTime() }}</span>
|
||||||
|
|
@ -79,17 +82,9 @@
|
||||||
<template>
|
<template>
|
||||||
<!-- <div class="pop_content" :style="getTopOrLeft(item.greenhouseName)" :key="index"
|
<!-- <div class="pop_content" :style="getTopOrLeft(item.greenhouseName)" :key="index"
|
||||||
v-if="popContentCurrent == index ? true : false"> -->
|
v-if="popContentCurrent == index ? true : false"> -->
|
||||||
<div
|
<div class="pop_content" :style="getTopOrLeft(item.id)"
|
||||||
class="pop_content"
|
v-show="popContentCurrent == item.id ? true : false">
|
||||||
:style="getTopOrLeft(item.id)"
|
<img class="close_img" src="../../assets/img/close.png" alt="" @click="cancelHandler" />
|
||||||
v-show="popContentCurrent == item.id ? true : false"
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
class="close_img"
|
|
||||||
src="../../assets/img/close.png"
|
|
||||||
alt=""
|
|
||||||
@click="cancelHandler"
|
|
||||||
/>
|
|
||||||
<div class="p_video">
|
<div class="p_video">
|
||||||
<img :src="item.greenhouseImage" alt="" />
|
<img :src="item.greenhouseImage" alt="" />
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -116,20 +111,12 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="line" style="margin-top: 0.2rem"></div>
|
<div class="line" style="margin-top: 0.2rem"></div>
|
||||||
<div class="icon_item scroll">
|
<div class="icon_item scroll">
|
||||||
<div
|
<div class="icon_item_child" v-for="(item1, index1) in item.childList" :key="index1">
|
||||||
class="icon_item_child"
|
|
||||||
v-for="(item1, index1) in item.childList"
|
|
||||||
:key="index1"
|
|
||||||
>
|
|
||||||
<!-- <img :src="item.formula" alt=""> -->
|
<!-- <img :src="item.formula" alt=""> -->
|
||||||
<img
|
<img :src="require('../../assets/image/real-time-' +
|
||||||
:src="
|
|
||||||
require('../../assets/image/real-time-' +
|
|
||||||
item1.formula +
|
item1.formula +
|
||||||
'.png')
|
'.png')
|
||||||
"
|
" alt="" />
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
<div>
|
<div>
|
||||||
<span>{{ item1.environmentDataId }}</span>
|
<span>{{ item1.environmentDataId }}</span>
|
||||||
<span>{{
|
<span>{{
|
||||||
|
|
@ -652,22 +639,40 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
getNamePosition(id){
|
getNamePosition(id) {
|
||||||
if(id == 1){
|
if (id == 1) {
|
||||||
return "position: absolute;top: 41%;left: 13%;"
|
return "position: absolute;top: 41%;left: 13%;"
|
||||||
}else if(id == 2){
|
} else if (id == 2) {
|
||||||
return "position: absolute;top: 10%;left: 24%;"
|
return "position: absolute;top: 10%;left: 24%;"
|
||||||
}else if(id == 3){
|
} else if (id == 3) {
|
||||||
return "position: absolute;top: 22%;left: 40%;"
|
return "position: absolute;top: 22%;left: 40%;"
|
||||||
}else if(id == 4){
|
} else if (id == 4) {
|
||||||
return "position: absolute;top: 29%;left: 76%;"
|
return "position: absolute;top: 29%;left: 76%;"
|
||||||
}else if(id == 5){
|
} else if (id == 5) {
|
||||||
return "position: absolute;top: 61%;left: 62%;"
|
return "position: absolute;top: 61%;left: 62%;"
|
||||||
}else if(id == 6){
|
} else if (id == 6) {
|
||||||
return "position: absolute;top: 1%;left: 62%;"
|
return "position: absolute;top: 1%;left: 62%;"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
autoPlay1() {
|
||||||
|
let that = this
|
||||||
|
this.autoPlay = false;
|
||||||
|
clearInterval(that.timer2) && this.timer2;
|
||||||
|
localStorage.setItem("autoPlay", JSON.stringify(this.autoPlay));
|
||||||
|
},
|
||||||
|
autoPlay2() {
|
||||||
|
this.autoPlay = true;
|
||||||
|
localStorage.setItem("autoPlay", JSON.stringify(this.autoPlay));
|
||||||
|
this.timer2 = setInterval(() => {
|
||||||
|
this.popContentCurrent++;
|
||||||
|
if (this.popContentCurrent > 7) {
|
||||||
|
this.popContentCurrent = 0;
|
||||||
|
// this.$router.push({ path: "/largeScreen" });
|
||||||
|
}
|
||||||
|
}, 3000);
|
||||||
|
},
|
||||||
|
|
||||||
// 数据单位
|
// 数据单位
|
||||||
getTypeList(val) {
|
getTypeList(val) {
|
||||||
let typeList1 = [];
|
let typeList1 = [];
|
||||||
|
|
@ -705,10 +710,10 @@ export default {
|
||||||
} else {
|
} else {
|
||||||
this.timer2 = setInterval(() => {
|
this.timer2 = setInterval(() => {
|
||||||
this.popContentCurrent++;
|
this.popContentCurrent++;
|
||||||
console.log('this.popContentCurrent',this.popContentCurrent);
|
console.log('this.popContentCurrent', this.popContentCurrent);
|
||||||
if (this.popContentCurrent > 7) {
|
if (this.popContentCurrent > 7) {
|
||||||
this.popContentCurrent = 0;
|
this.popContentCurrent = 0;
|
||||||
this.$router.push({ path: "/largeScreen" });
|
// this.$router.push({ path: "/largeScreen" });
|
||||||
}
|
}
|
||||||
}, 3000);
|
}, 3000);
|
||||||
}
|
}
|
||||||
|
|
@ -850,17 +855,52 @@ export default {
|
||||||
opacity: 0.89;
|
opacity: 0.89;
|
||||||
text-shadow: 0.01 0.1rem 0.2rem rgba(0, 51, 103, 0.25);
|
text-shadow: 0.01 0.1rem 0.2rem rgba(0, 51, 103, 0.25);
|
||||||
|
|
||||||
background: linear-gradient(
|
background: linear-gradient(to bottom,
|
||||||
to bottom,
|
|
||||||
#ffffff 45%,
|
#ffffff 45%,
|
||||||
#e9f8ff 90%,
|
#e9f8ff 90%,
|
||||||
#77baff 100%
|
#77baff 100%);
|
||||||
);
|
|
||||||
-webkit-background-clip: text;
|
-webkit-background-clip: text;
|
||||||
-webkit-text-fill-color: transparent;
|
-webkit-text-fill-color: transparent;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.auto_play {
|
||||||
|
height: 0.56rem;
|
||||||
|
position: absolute;
|
||||||
|
top: 0.53rem;
|
||||||
|
left: 1.4rem;
|
||||||
|
z-index: 99999999;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
>span {
|
||||||
|
width: 0.8rem;
|
||||||
|
height: 0.3rem;
|
||||||
|
background: rgba(14, 91, 165, 0.1);
|
||||||
|
border: 1px solid rgba(97, 152, 209, 0.65);
|
||||||
|
margin-right: 0.1rem;
|
||||||
|
font-size: 0.18rem;
|
||||||
|
font-family: MicrosoftYaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #70d0ee;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 0.3rem;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.act {
|
||||||
|
background: linear-gradient(-35deg,
|
||||||
|
#56a8d5 0%,
|
||||||
|
rgba(0, 55, 110, 0.75) 50%,
|
||||||
|
#56a8d5 100%);
|
||||||
|
border: 1px solid rgba(122, 225, 255, 0.75);
|
||||||
|
font-size: 0.18rem;
|
||||||
|
font-family: MicrosoftYaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.yuan {
|
.yuan {
|
||||||
width: 0.56rem;
|
width: 0.56rem;
|
||||||
height: 0.56rem;
|
height: 0.56rem;
|
||||||
|
|
@ -874,7 +914,7 @@ export default {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
|
||||||
> img {
|
>img {
|
||||||
width: 0.2rem;
|
width: 0.2rem;
|
||||||
height: 0.2rem;
|
height: 0.2rem;
|
||||||
}
|
}
|
||||||
|
|
@ -890,26 +930,26 @@ export default {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
|
||||||
> img {
|
>img {
|
||||||
width: 0.28rem;
|
width: 0.28rem;
|
||||||
height: 0.3rem;
|
height: 0.3rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
> span:nth-child(2) {
|
>span:nth-child(2) {
|
||||||
font-size: 0.24rem;
|
font-size: 0.24rem;
|
||||||
font-family: PingFang-SC-Bold;
|
font-family: PingFang-SC-Bold;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: #7abaff;
|
color: #7abaff;
|
||||||
}
|
}
|
||||||
|
|
||||||
> span:nth-child(4) {
|
>span:nth-child(4) {
|
||||||
font-size: 0.2rem;
|
font-size: 0.2rem;
|
||||||
font-family: PingFang-SC-Bold;
|
font-family: PingFang-SC-Bold;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: #7abaff;
|
color: #7abaff;
|
||||||
}
|
}
|
||||||
|
|
||||||
> span:nth-child(6) {
|
>span:nth-child(6) {
|
||||||
font-size: 0.3rem;
|
font-size: 0.3rem;
|
||||||
font-family: PingFang-SC-Bold;
|
font-family: PingFang-SC-Bold;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
|
@ -935,25 +975,21 @@ export default {
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
z-index: 99;
|
z-index: 99;
|
||||||
-webkit-mask-image: linear-gradient(
|
-webkit-mask-image: linear-gradient(90deg,
|
||||||
90deg,
|
|
||||||
transparent 0%,
|
transparent 0%,
|
||||||
blue 7%,
|
blue 7%,
|
||||||
blue 87%,
|
blue 87%,
|
||||||
transparent 97%
|
transparent 97%);
|
||||||
);
|
|
||||||
|
|
||||||
.map1 {
|
.map1 {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
// background: url('../assets/img/map.png') center no-repeat;
|
// background: url('../assets/img/map.png') center no-repeat;
|
||||||
// background-size: 100% 100%;
|
// background-size: 100% 100%;
|
||||||
-webkit-mask-image: linear-gradient(
|
-webkit-mask-image: linear-gradient(transparent 4%,
|
||||||
transparent 4%,
|
|
||||||
blue 15%,
|
blue 15%,
|
||||||
blue 86%,
|
blue 86%,
|
||||||
transparent 100%
|
transparent 100%);
|
||||||
);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|
||||||
|
|
@ -961,23 +997,19 @@ export default {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
-webkit-mask-image: linear-gradient(
|
-webkit-mask-image: linear-gradient(90deg,
|
||||||
90deg,
|
|
||||||
transparent 4%,
|
transparent 4%,
|
||||||
blue 18%,
|
blue 18%,
|
||||||
blue 88%,
|
blue 88%,
|
||||||
transparent 100%
|
transparent 100%);
|
||||||
);
|
|
||||||
|
|
||||||
.drag_img {
|
.drag_img {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
-webkit-mask-image: linear-gradient(
|
-webkit-mask-image: linear-gradient(transparent 0%,
|
||||||
transparent 0%,
|
|
||||||
blue 13%,
|
blue 13%,
|
||||||
blue 73%,
|
blue 73%,
|
||||||
transparent 97%
|
transparent 97%);
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.pole_item_4 {
|
.pole_item_4 {
|
||||||
|
|
@ -1003,13 +1035,13 @@ export default {
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
|
|
||||||
> img {
|
>img {
|
||||||
width: 0.32rem;
|
width: 0.32rem;
|
||||||
height: 0.32rem;
|
height: 0.32rem;
|
||||||
margin-right: 0.15rem;
|
margin-right: 0.15rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
> span {
|
>span {
|
||||||
font-size: 0.18rem;
|
font-size: 0.18rem;
|
||||||
font-family: MicrosoftYaHei;
|
font-family: MicrosoftYaHei;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
|
|
@ -1085,7 +1117,7 @@ export default {
|
||||||
height: 2.8rem;
|
height: 2.8rem;
|
||||||
margin: 0.2rem auto 0;
|
margin: 0.2rem auto 0;
|
||||||
|
|
||||||
> img {
|
>img {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
@ -1129,13 +1161,13 @@ export default {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding: 0 0.1rem 0 0.1rem;
|
padding: 0 0.1rem 0 0.1rem;
|
||||||
|
|
||||||
> img {
|
>img {
|
||||||
width: 0.18rem;
|
width: 0.18rem;
|
||||||
height: 0.18rem;
|
height: 0.18rem;
|
||||||
margin-right: 0.05rem;
|
margin-right: 0.05rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
> span {
|
>span {
|
||||||
font-size: 0.16rem;
|
font-size: 0.16rem;
|
||||||
font-family: MicrosoftYaHei;
|
font-family: MicrosoftYaHei;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
|
|
@ -1154,20 +1186,20 @@ export default {
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
> img {
|
>img {
|
||||||
width: 0.22rem;
|
width: 0.22rem;
|
||||||
height: 0.18rem;
|
height: 0.18rem;
|
||||||
margin-right: 0.1rem;
|
margin-right: 0.1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
> span:nth-child(2) {
|
>span:nth-child(2) {
|
||||||
font-size: 0.16rem;
|
font-size: 0.16rem;
|
||||||
font-family: MicrosoftYaHei;
|
font-family: MicrosoftYaHei;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
}
|
}
|
||||||
|
|
||||||
> span:nth-child(3) {
|
>span:nth-child(3) {
|
||||||
font-size: 0.16rem;
|
font-size: 0.16rem;
|
||||||
font-family: MicrosoftYaHei;
|
font-family: MicrosoftYaHei;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
|
|
@ -1191,24 +1223,24 @@ export default {
|
||||||
display: flex;
|
display: flex;
|
||||||
margin-bottom: 0.1rem;
|
margin-bottom: 0.1rem;
|
||||||
|
|
||||||
> img {
|
>img {
|
||||||
width: 0.6rem;
|
width: 0.6rem;
|
||||||
height: 0.53rem;
|
height: 0.53rem;
|
||||||
margin-right: 0.1rem;
|
margin-right: 0.1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
> div {
|
>div {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
||||||
> span:nth-child(1) {
|
>span:nth-child(1) {
|
||||||
font-size: 0.14rem;
|
font-size: 0.14rem;
|
||||||
font-family: MicrosoftYaHei;
|
font-family: MicrosoftYaHei;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: #86d9ff;
|
color: #86d9ff;
|
||||||
}
|
}
|
||||||
|
|
||||||
> span:nth-child(2) {
|
>span:nth-child(2) {
|
||||||
font-size: 0.2rem;
|
font-size: 0.2rem;
|
||||||
font-family: AlibabaPuHuiTiB;
|
font-family: AlibabaPuHuiTiB;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue