pc-master #63

Merged
xiaomeng merged 6 commits from pc-master into portal 2023-12-05 10:01:21 +00:00
12 changed files with 982 additions and 275 deletions

View File

@ -160,6 +160,10 @@ export default {
getControlGetState(data) {
return sendGetRequest('/readControl/getState', data)
},
//控制器 气象站实时数据折线图
getControlChartdata(data) {
return sendPostRequest('/equip/chartdata?equipmentId='+data, '')
},
@ -210,4 +214,18 @@ export default {
return sendGetRequest(`/readControl/fiveControl`, data);
},
// 查看用户额外权限
user_getjurisdiction(userId,data){
return sendGetRequest(`/user/getjurisdiction?userId=${userId}`, data)
},
//实时数据页面状态值(查看全部设备)
getStatePermissionStatus(data){
return sendGetRequest(`/getcontrol/getStatePermissionStatus`, data)
},
getPermissionStatus(data){
return sendGetRequest(`/getcontrol/getPermissionStatus`, data)
}
};

View File

@ -225,6 +225,11 @@
color: #00FFBA;
}
.table-title .title-text {
font-size: 16px;
margin-left: 15px;
}
.index {
width: 100%;
height: 100%;
@ -1694,7 +1699,7 @@
}
.realTime .page-content .status-view .status-view-top {
padding: 0 10px 0 20px;
padding: 0 10px 0 10px;
display: flex;
align-items: center;
justify-content: space-between;
@ -1707,6 +1712,7 @@
font-family: Microsoft YaHei;
font-weight: bold;
color: #FFFFFF;
white-space: nowrap;
}
.realTime .page-content .status-view .status-view-top .status-view-top-right {

File diff suppressed because one or more lines are too long

View File

@ -245,6 +245,10 @@
font-weight: 400;
color: #00FFBA;
}
.title-text{
font-size: 16px;
margin-left: 15px;
}
}
.index {
@ -1791,7 +1795,7 @@ margin-top: 20px;
margin: 7.5px;
.status-view-top {
padding: 0 10px 0 20px;
padding: 0 10px 0 10px;
display: flex;
align-items: center;
justify-content: space-between;
@ -1803,6 +1807,7 @@ margin-top: 20px;
font-family: Microsoft YaHei;
font-weight: bold;
color: #FFFFFF;
white-space: nowrap;
}
.status-view-top-right {

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 MiB

View File

@ -89,6 +89,7 @@ export default {
loading: true,//
IDTimer: null,
deviceId:'',
limitUserId:''
}
},
watch: {
@ -125,11 +126,25 @@ export default {
that.getEqbyid()
}, 120000);
// id
this.get_user_getjurisdiction()
},
beforeDestroy() {
this.IDTimer && clearInterval(this.IDTimer)
},
methods: {
// id
get_user_getjurisdiction() {
let userInfo = JSON.parse(localStorage.getItem("userInfo"));
let userId = userInfo.userid
this.api.user_getjurisdiction(userId).then(res => {
if (res.data.code == 200) {
this.limitUserId = res.data.data[0].id;
}
})
},
///
getByid() {
var store = this.$store.state
@ -255,6 +270,7 @@ export default {
return
} else if (item.router != this.routerNow && !item.http) {
if(this.limitUserId == 0) return this.$message('您当前没有权限查看!')
this.$router.push({ name: item.router })
}
} else {

View File

@ -90,7 +90,7 @@
<div class="middle">
<div class="map">
<div class="map1">
<div class="drag_box" ref="drag_box">
<div class="drag_box" ref="drag_box" v-show="limitUserId == 1">
<img class="drag_img" src="../../assets/img/map.png" alt="" />
<img class="axis_1" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_1" />
<img class="axis_2" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_1" />
@ -100,6 +100,12 @@
<img class="axis_6" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_1" />
<img class="axis_7" src="../../assets/img/axis2.png" alt="" @click="handlerAxis_1" />
</div>
<div class="drag_box1" ref="drag_box1" v-show="limitUserId == 2">
<img class="drag_img" src="../../assets/img/map1.png" alt="" />
<img class="axis_init" :class="'axis_' + (index + 8)" src="../../assets/img/axis1.png" :style="'left:' + (48.5 + index * 4.1) + '%'" alt="" @click="handlerAxis_2" v-for="(i,index) in 10" :key="index + '_1'"/>
<img class="axis_init1" :class="'axis_' + (index1 + 17)" src="../../assets/img/axis1.png" :style="'top:' + (22 + index1 * 0.105) + '%' + ';' + 'left:' + (5 + index1 * 3.3) + '%' + ';'" alt="" @click="handlerAxis_2" v-for="(i,index1) in 25" :key="index1 + '_2'"/>
</div>
</div>
</div>
</div>
@ -673,10 +679,13 @@ export default {
unit: "dB",
},
],
limitUserId:''
};
},
mounted() {
this.drag_boxHandler();
this.login();
@ -943,6 +952,9 @@ export default {
this.dataInit(userInfo.userid);
this.get_sel_eqbyid(userInfo.userid);
// id
this.get_user_getjurisdiction(userInfo.userid)
// this.autoPlay = JSON.parse(localStorage.getItem("autoPlay"));
// console.log(this.autoPlay);
// if (this.autoPlay == false) {
@ -954,6 +966,20 @@ export default {
// }
},
// id
get_user_getjurisdiction(userId){
this.api.user_getjurisdiction(userId).then(res=>{
if(res.data.code == 200){
this.limitUserId = res.data.data[0].id;
if(this.limitUserId == 1){
this.drag_boxHandler();
}else if(this.limitUserId == 2){
this.drag_boxHandler1();
}
}
})
},
// autoPlay1() {
// this.autoPlay = false;
// clearInterval(this.timer_) && this.timer_;
@ -1012,6 +1038,10 @@ export default {
this.$router.push({ path: "/largeScreen1" });
},
handlerAxis_2() {
this.$router.push({ path: "/largeScreen1" });
},
toBackPage() {
this.$router.push({ path: "/realTime" });
},
@ -1089,6 +1119,74 @@ export default {
}
};
},
drag_boxHandler1() {
let demo = this.$refs.drag_box1;
demo = document.querySelector(".drag_box1"); //
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);
}
};
},
},
};
</script>
@ -1506,6 +1604,43 @@ export default {
transform: translate(-50%, -50%);
overflow: hidden;
.drag_box1{
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_init{
width: 0.4rem;
height: 0.5rem;
position: absolute;
top: 54%;
z-index: 99;
}
.axis_init1{
width: 0.4rem;
height: 0.5rem;
position: absolute;
z-index: 99;
}
}
.drag_box {
width: 100%;
height: 100%;

View File

@ -19,7 +19,7 @@
<span>{{ time.time }}</span>
</div>
<div class="content">
<div class="content" v-show="limitUserId == 1">
<div class="map">
<div class="map1">
<div class="drag_box" ref="drag_box">
@ -40,48 +40,10 @@
</div>
<img class="pole1" src="../../assets/img/pole1.png" alt="" />
</div>
<!-- <div class="pole_item pole_item2" @click="handlerPop(3)">
<div class="p_title">
<img src="../../assets/img/wenshi.png" alt="" />
<span>1#温室</span>
</div>
<img class="pole1" src="../../assets/img/pole1.png" alt="" />
</div>
<div class="pole_item pole_item3" @click="handlerPop(4)">
<div class="p_title">
<img src="../../assets/img/wenshi1.png" alt="" />
<span>3#温室</span>
</div>
<img class="pole1" src="../../assets/img/pole.png" alt="" />
</div> -->
<!-- <div class="pole_item pole_item5" @click="handlerPop(5)">
<div class="p_title">
<img src="../../assets/img/wenshi.png" alt="" />
<span>4#温室</span>
</div>
<img class="pole1" src="../../assets/img/pole1.png" alt="" />
</div>
<div class="pole_item pole_item6" @click="handlerPop(6)">
<div class="p_title">
<img src="../../assets/img/wenshi.png" alt="" />
<span>5#温室</span>
</div>
<img class="pole1" src="../../assets/img/pole1.png" alt="" />
</div>
<div class="pole_item pole_item7" @click="handlerPop(7)">
<div class="p_title">
<img src="../../assets/img/wenshi.png" alt="" />
<span>6#温室</span>
</div>
<img class="pole1" src="../../assets/img/pole1.png" alt="" />
</div> -->
</template>
<!-- 弹框 -->
<template>
<!-- <div class="pop_content" :style="getTopOrLeft(item.greenhouseName)" :key="index"
v-if="popContentCurrent == index ? true : false"> -->
<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" />
@ -132,44 +94,126 @@
</div>
</div>
</div>
<!-- <el-dialog title="" :visible.sync="dialogVisible" width="30%" :before-close="handleClose">
<div class="pop_content">
<div class="p_video">
<img src="../assets/img/c_top.png" alt="">
</div>
<div class="text">某某项目温室一号</div>
<div class="line"></div>
<div class="detail">
<div class="d_item">
<img src="../assets/img/detail_img.png" alt="">
<span>面积6652</span>
</div>
<div class="d_item">
<img src="../assets/img/detail_img.png" alt="">
<span>品种番茄</span>
</div>
<div class="d_item">
<img src="../assets/img/detail_img.png" alt="">
<span>数量80000</span>
</div>
</div>
<div class="grow">
<img src="../assets/img/grow_img.png" alt="">
<span>生长阶段</span>
<span>幼苗期</span>
</div>
<div class="line" style="margin-top: 0.2rem;"></div>
<div class="icon_item">
<div class="icon_item_child" v-for="(item, index) in list" :key="index">
<img :src="item.img" alt="">
<div>
<span>{{ item.name }}</span>
<span>{{ item.data }}</span>
<div class="content" v-show="limitUserId == 2">
<div class="map">
<div class="map1">
<div class="drag_box1" ref="drag_box1">
<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:' + (21 + index * .1) + '%' + ';' + 'left:' + (83 - index * 3.24) + '%' + ';'" @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="" />
</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="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 class="popBox" v-for="(item, index) in popContentList2" :key="index + '_2'">
<template >
<div class="pole_item_1"
:style="'top:' + (51 + index * .2) + '%' + ';' + 'left:' + (84 - index * 4.05) + '%' + ';'" @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="" />
</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="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>
</el-dialog> -->
</div>
</div>
</div>
</template>
@ -221,6 +265,7 @@ export default {
popContentList: [],
popContentCurrent: 1,
popContentCurrent1: 1,
//
autoPlay: false, //false true
@ -582,10 +627,14 @@ export default {
unit: "dB",
},
],
limitUserId: '',
popContentList1: [],
popContentList2: [],
};
},
mounted() {
this.drag_boxHandler();
this.login();
@ -602,7 +651,7 @@ export default {
// id
dataInit(userid) {
this.api.Bigdata_getAllControl(userid).then((res) => {
console.log("根据用户id查询对应的设备大数据信息", res);
// console.log("id", res);
this.popContentList = res.data.data;
this.popContentList = this.popContentList.map((item) => {
return {
@ -620,6 +669,14 @@ export default {
});
});
// console.log(this.popContentList,'12121212');
if (this.limitUserId == 2) {
this.popContentList1 = (this.popContentList.slice(0, 25))
// this.popContentList2 = this.popContentList.slice(-10)
if(this.popContentList.length > 25){
this.popContentList2 = (this.popContentList.slice(-(this.popContentList.length - 25)))
}
console.log(this.popContentList1);
}
});
},
@ -639,6 +696,33 @@ export default {
}
},
getTopOrLeft1(id) {
for(let i = 0; i < 26;i++){
if(id == (i + 1)){
return `top:34%;left:${(74 - i * 3) < 15 ? 15 : (74 - i * 3)}%;transform: translate(-50%,-50%);`;
}
}
// if (id == 1) {
// return "top:34%;left:74%;transform: translate(-50%,-50%);";
// } else if (id == 2) {
// return "top:34%;left:70%;transform: translate(-50%,-50%);";
// }else if(id == 3){
// return "top:34%;left:68%;transform: translate(-50%,-50%);";
// }
},
getTopOrLeft11(id) {
for(let i=0;i<10;i++){
if(id == (i + 26))
return `top:65%;left:${77 - i *4}%;transform: translate(-50%,-50%);`
}
// if (id == 10) {
// return "top:65%;left:57%;transform: translate(-50%,-50%);";
// } else if (id == 11) {
// return "top:65%;left:61%;transform: translate(-50%,-50%);";
// }
},
getNamePosition(id) {
if (id == 1) {
return "position: absolute;top: 41%;left: 13%;"
@ -662,14 +746,22 @@ export default {
localStorage.setItem("autoPlay", JSON.stringify(this.autoPlay));
},
autoPlay2() {
let that = this
this.autoPlay = true;
localStorage.setItem("autoPlay", JSON.stringify(this.autoPlay));
this.timer2 = setInterval(() => {
this.popContentCurrent++;
if (this.popContentCurrent > 6) {
this.popContentCurrent = 1;
// this.$router.push({ path: "/largeScreen" });
if(that.limitUserId == 1){
that.popContentCurrent++;
if (that.popContentCurrent > 6) {
that.popContentCurrent = 1;
}
}else if(that.limitUserId == 2){
that.popContentCurrent1++;
if (that.popContentCurrent1 > 35) {
that.popContentCurrent1 = 1;
}
}
}, 3000);
},
@ -702,23 +794,44 @@ export default {
let userInfo = JSON.parse(localStorage.getItem("userInfo"));
this.dataInit(userInfo.userid);
// id
this.get_user_getjurisdiction(userInfo.userid)
let that = this;
this.autoPlay = JSON.parse(localStorage.getItem("autoPlay"));
// this.popContentCurrent = 0;
if (this.autoPlay == false) {
clearInterval(that.timer2) && this.timer2;
} else {
this.timer2 = setInterval(() => {
this.popContentCurrent++;
console.log('this.popContentCurrent', this.popContentCurrent);
if (this.popContentCurrent > 6) {
this.popContentCurrent = 1;
// this.$router.push({ path: "/largeScreen" });
if(that.limitUserId == 1){
that.popContentCurrent++;
if (that.popContentCurrent > 6) {
that.popContentCurrent = 1;
}
}else if(that.limitUserId == 2){
that.popContentCurrent1++;
if (that.popContentCurrent1 > 35) {
that.popContentCurrent1 = 1;
}
}
}, 3000);
}
},
// id
get_user_getjurisdiction(userId) {
this.api.user_getjurisdiction(userId).then(res => {
if (res.data.code == 200) {
this.limitUserId = res.data.data[0].id;
if (this.limitUserId == 1) {
this.drag_boxHandler();
} else if (this.limitUserId == 2) {
this.drag_boxHandler1();
}
}
})
},
getTime() {
this.time = getnowtime();
// console.log(this.time);
@ -743,15 +856,19 @@ export default {
clearInterval(that.timer2) && this.timer2;
},
// handleClose(done) {
// done();
// },
cancelHandler1(){
this.popContentCurrent1 = -1;
},
handlerPop(id) {
console.log(id);
this.popContentCurrent = id;
},
handlerPop1(id){
this.popContentCurrent1 = id;
},
toBack() {
this.$router.push({ path: "/largeScreen" });
},
@ -823,6 +940,74 @@ export default {
}
};
},
drag_boxHandler1() {
let demo = this.$refs.drag_box1;
demo = document.querySelector(".drag_box1"); //
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);
}
};
},
},
};
</script>
@ -993,6 +1178,231 @@ export default {
overflow: hidden;
position: absolute;
.drag_box1 {
width: 100%;
height: 100%;
position: absolute;
-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%);
}
.pole_item,
.pole_item_1 {
width: 0.5rem;
height: 0.22rem;
position: absolute;
// top: 21%;
// left: 5%;
.p_title {
width: 0.5rem;
height: 0.22rem;
background: rgba(1, 12, 28, 0.7);
border-radius: 12px;
display: flex;
align-items: center;
box-sizing: border-box;
padding: 0.04rem;
position: absolute;
overflow: hidden;
white-space: nowrap;
>img {
width: 0.1rem;
height: 0.1rem;
margin-right: 0.05rem;
}
>span {
font-size: 0.1rem;
font-family: MicrosoftYaHei;
font-weight: 400;
color: #ffffff;
flex: 1;
}
}
.pole1 {
width: 0.3rem;
height: 0.7rem;
position: absolute;
right: 0;
}
}
.pop_content1 {
width: 2.5rem;
height: 3rem;
background: url("../../assets/img/pop_bg.png") center no-repeat;
background-size: 100% 100%;
overflow: hidden;
position: absolute;
// top: 17%;
// left: 23%;
z-index: 999999;
.close_img {
width: .2rem;
height: .2rem;
position: absolute;
top: 0;
right: 0;
}
.p_video {
width: 90%;
height: 1.2rem;
margin: 0.1rem auto 0;
>img {
width: 100%;
height: 100%;
}
}
.text {
width: 100%;
height: 0.3rem;
font-size: 0.15rem;
font-family: AlimamaShuHeiTi-Bold;
font-weight: bold;
color: #f3fdff;
line-height: 0.3rem;
box-sizing: border-box;
padding-left: 0.15rem;
}
.line {
width: 2.2rem;
height: 0.01rem;
background: #51d4fa;
opacity: 0.5;
margin: 0 auto;
}
.detail {
width: 100%;
height: 0.3rem;
display: flex;
align-items: center;
justify-content: space-evenly;
padding: 0 0.15rem;
.d_item {
height: 0.2rem;
background: rgba(81, 212, 250, 0.15);
border: 0.01rem solid rgba(106, 222, 255, 0.4);
border-radius: 0.02rem;
display: flex;
justify-content: center;
align-items: center;
box-sizing: border-box;
padding: 0 0.05rem;
>img {
width: 0.1rem;
height: 0.1rem;
margin-right: 0.05rem;
}
>span {
font-size: 0.12rem;
font-family: MicrosoftYaHei;
font-weight: 400;
color: #d9effd;
}
}
}
.grow {
width: 2.5rem;
height: 0.2rem;
background: url("../../assets/img/grow_bg.png") center no-repeat;
background-size: 100% 100%;
margin: 0 auto;
display: flex;
justify-content: center;
align-items: center;
>img {
width: 0.15rem;
height: 0.15rem;
margin-right: 0.05rem;
}
>span:nth-child(2) {
font-size: 0.12rem;
font-family: MicrosoftYaHei;
font-weight: 400;
color: #ffffff;
}
>span:nth-child(3) {
font-size: 0.12rem;
font-family: MicrosoftYaHei;
font-weight: 400;
color: #36ffd2;
}
}
.icon_item {
width: 95%;
height: calc(100% - 2.22rem);
box-sizing: border-box;
padding: 0.1rem 0.15rem;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
overflow: auto;
.icon_item_child {
width: 50%;
height: 45%;
display: flex;
margin-bottom: 0.05rem;
> img {
width: 0.28rem;
height: 0.28rem;
margin-right: 0.05rem;
}
> div {
display: flex;
flex-direction: column;
> span:nth-child(1) {
font-size: 0.1rem;
font-family: MicrosoftYaHei;
font-weight: bold;
color: #86d9ff;
}
> span:nth-child(2) {
font-size: 0.11rem;
font-family: AlibabaPuHuiTiB;
font-weight: bold;
color: #ffffff;
}
}
}
}
}
}
.drag_box {
width: 100%;
height: 100%;
@ -1251,25 +1661,15 @@ export default {
}
}
}
}
}
}
}
// ::v-deep .el-dialog {
// background: unset !important;
// .el-icon-close:before {
// contain: " ";
// width: .44rem;
// height: .44rem;
// background: url('../assets/img/close.png') center no-repeat;
// background-size: 100% 100%;
// position: absolute;
// top: 0.3rem;
// left: -0.1rem;
// }
// }
}
}
</style>
::-webkit-scrollbar {
display: none;
}</style>

View File

@ -1,8 +1,8 @@
<template>
<div class="formula realTime">
<div class="page-content new-data" :class="deviceName == 10 ? 'control-page' : ''">
<div class="page-content new-data" :class="deviceName == 10 || deviceName == 30 ? 'control-page' : ''">
<div class="control-view" v-if="deviceName == 10">
<div class="control-view" v-if="deviceName == 10 || deviceName == 30">
<div class="title">气象站:</div>
<vue-seamless class="control-list" :data="controlList" :class-option="defaultOption1">
<div class="list-view" v-for="item, index in controlList " :key="index">
@ -22,8 +22,6 @@
<div class="table-title">
<img src="../../assets/image/real-time.png" alt="" />
实时数据
<!-- <div class="tips">种植作物1</div> -->
</div>
<div class="timeNow" v-if="list.length">
<!-- {{ time.year.year }}-{{ time.year.month }}-{{ time.year.date }}<span> {{ time.time }}:{{ time.timeS
@ -53,7 +51,7 @@
</div>
<div class="flex-list realTime-bottom">
<div class="left-view">
<div class="left-view" v-if="deviceName != 30">
<div ref="monitor" class="monitor" id="monitor">
<!-- <video ref="videoPlayer" class="video-js" id="video-js"></video> -->
<div ref="videoPlayer" class="video-js" id="video-js"></div>
@ -68,83 +66,11 @@
设备运行状态
</div>
<div class="flex-view border-none">
<div class="status-view">
<div class="status-view-top">
<div class="status-view-top-left">{{ fanStatus.name }}</div>
<!-- <el-popover placement="top" width="140">
<div class="set-status-blue">进入修改设定值</div>
<el-popover placement="top" width="160">
<p class="del-text"><i style="color:red" class="el-popconfirm__icon el-icon-info"></i>确认删除?
</p>
<div style="text-align: right; margin: 0">
<el-button class="el-button el-button--text el-button--mini color-blue">取消</el-button>
<el-button class="el-button el-button--text el-button--mini color-blue">确定</el-button>
</div>
<div class="set-status-red" slot="reference">删除</div>
</el-popover>
<el-popover placement="right" width="100">
<input v-model="item.index" type="text" class="status-save">
<el-button class="el-button el-button--text el-button--mini color-blue">保存</el-button>
<div class="set-status-blue" slot="reference">排序</div>
</el-popover>
<img class="status-view-top-right" slot="reference" src="../../assets/img/more.png" alt="">
</el-popover> -->
<img class="status-view-top-right" slot="reference" src="../../assets/img/more.png" alt="">
</div>
<div class="status-view-content">
<div v-if="fanStatus.open != 0" class="status-true">
<div class="status-true-sel">
<div class="sel">
<img v-if="fanStatus.open == 1" src="../../assets/img/status-true-sel.png" alt="">
<img v-else src="../../assets/img/status-true-nosel.png" alt="">
自动控制
</div>
<div class="sel-phone">
<img v-if="fanStatus.open != 1" src="../../assets/img/status-true-sel.png" alt="">
<img v-else src="../../assets/img/status-true-nosel.png" alt="">
手机控制
</div>
</div>
<div class="status-fan">
<div class="btn" :class="fanStatus.status[0] == 1 ? 'blue' : 'off'">
<img class="fan-img" v-if="fanStatus.status[0] == 1" src="../../assets/img/fan-on.png"
alt="">
<img v-else src="../../assets/img/fan-off.png" alt="">
<span>1#风机</span>
</div>
<div class="btn" :class="fanStatus.status[1] == 1 ? 'blue' : 'off'">
<img class="fan-img" v-if="fanStatus.status[1] == 1" src="../../assets/img/fan-on.png"
alt="">
<img v-else src="../../assets/img/fan-off.png" alt=""> <span>2#风机</span>
</div>
<div class="btn" :class="fanStatus.status[2] == 1 ? 'blue' : 'off'">
<img class="fan-img" v-if="fanStatus.status[2] == 1" src="../../assets/img/fan-on.png"
alt="">
<img v-else src="../../assets/img/fan-off.png" alt=""> <span>3#风机</span>
</div>
<div class="btn" :class="fanStatus.status[3] == 1 ? 'blue' : 'off'">
<img class="fan-img" v-if="fanStatus.status[3] == 1" src="../../assets/img/fan-on.png"
alt="">
<img v-else src="../../assets/img/fan-off.png" alt=""> <span>4#风机</span>
</div>
<div class="btn" :class="fanStatus.status[4] == 1 ? 'blue' : 'off'">
<img class="fan-img" v-if="fanStatus.status[4] == 1" src="../../assets/img/fan-on.png"
alt="">
<img v-else src="../../assets/img/fan-off.png" alt=""> <span>5#风机</span>
</div>
</div>
</div>
<div v-else class="status-noTrue">
<img src="../../assets/img/status-no.png" alt="">
<div>当前设备无效</div>
</div>
</div>
</div>
<div class="status-view" v-for="item, index in statusList" :key="index">
<div class="status-view-top">
<div class="status-view-top-left">{{ item.name }}</div>
<!-- <el-popover placement="top" width="140">
<div class="set-status-blue">进入修改设定值</div>
<el-popover placement="top" width="140">
<!-- <div class="set-status-blue">进入修改设定值</div> -->
<el-popover placement="top" width="160">
<p class="del-text"><i style="color:red" class="el-popconfirm__icon el-icon-info"></i>确认删除?
</p>
@ -154,16 +80,12 @@
</div>
<div class="set-status-red" slot="reference">删除</div>
</el-popover>
<el-popover placement="right" width="100">
<input v-model="item.index" type="text" class="status-save">
<el-button class="el-button el-button--text el-button--mini color-blue">保存</el-button>
<div class="set-status-blue" slot="reference">排序</div>
</el-popover>
<img class="status-view-top-right" slot="reference" src="../../assets/img/more.png" alt="">
</el-popover> -->
<img class="status-view-top-right" slot="reference" src="../../assets/img/more.png" alt="">
</el-popover>
<!-- <img class="status-view-top-right" slot="reference" src="../../assets/img/more.png" alt=""> -->
</div>
<div class="status-view-content">
<!-- 风机 -->
<div class="status-view-content" v-if="item.type == 1">
<div v-if="item.open != 0" class="status-true">
<div class="status-true-sel">
<div class="sel">
@ -177,13 +99,66 @@
手机控制
</div>
</div>
<div class="status-true-charts">
<div class="status-fan">
<div class="btn" :class="item.status[0] == 1 ? 'blue' : 'off'">
<img class="fan-img" v-if="item.status[0] == 1" src="../../assets/img/fan-on.png"
alt="">
<img v-else src="../../assets/img/fan-off.png" alt="">
<span>1#风机</span>
</div>
<div class="btn" :class="item.status[1] == 1 ? 'blue' : 'off'">
<img class="fan-img" v-if="item.status[1] == 1" src="../../assets/img/fan-on.png"
alt="">
<img v-else src="../../assets/img/fan-off.png" alt=""> <span>2#风机</span>
</div>
<div class="btn" :class="item.status[2] == 1 ? 'blue' : 'off'">
<img class="fan-img" v-if="item.status[2] == 1" src="../../assets/img/fan-on.png"
alt="">
<img v-else src="../../assets/img/fan-off.png" alt=""> <span>3#风机</span>
</div>
<div class="btn" :class="item.status[3] == 1 ? 'blue' : 'off'">
<img class="fan-img" v-if="item.status[3] == 1" src="../../assets/img/fan-on.png"
alt="">
<img v-else src="../../assets/img/fan-off.png" alt=""> <span>4#风机</span>
</div>
<div class="btn" :class="item.status[4] == 1 ? 'blue' : 'off'">
<img class="fan-img" v-if="item.status[4] == 1" src="../../assets/img/fan-on.png"
alt="">
<img v-else src="../../assets/img/fan-off.png" alt=""> <span>5#风机</span>
</div>
</div>
</div>
<div v-else class="status-noTrue">
<img src="../../assets/img/status-no.png" alt="">
<div>当前设备无效</div>
</div>
</div>
<!-- 顶卷膜及其他 -->
<div class="status-view-content" v-if="item.type != 1">
<div v-if="item.open != 0" class="status-true">
<div class="status-true-sel">
<div class="sel">
<img v-if="item.open == 1" src="../../assets/img/status-true-sel.png" alt="">
<img v-else src="../../assets/img/status-true-nosel.png" alt="">
自动控制
</div>
<div class="sel-phone">
<img v-if="item.open != 1" src="../../assets/img/status-true-sel.png" alt="">
<img v-else src="../../assets/img/status-true-nosel.png" alt="">
手机控制
</div>
</div>
<div class="status-true-charts" v-if="item.type == 6 || item.type == 5 || item.type == 2">
<img src="../../assets/img/status-true-charts-icon.png" alt="">
<div :id="'statusCharts' + index"></div>
</div>
<div class="status-true-charts" style="background: unset;height: 50px;" v-else>
</div>
<div class="status-true-text">
<div class="status-true-text-left">{{ getNumberStatus(item.index) }}</div>
<div class="status-true-text-right">{{ item.progress }}%</div>
<div class="status-true-text-left">{{ getNumberStatus(item) }}</div>
<div class="status-true-text-right" v-if="item.type == 6 || item.type == 5 || item.type == 2">{{
item.progress }}%</div>
</div>
</div>
<div v-else class="status-noTrue">
@ -236,9 +211,6 @@ export default {
return {
statusList: [],
fanStatus: {
name: '风机', open: 0, status: []
},
time: null,//
list: [],
inputData: [],
@ -250,6 +222,9 @@ export default {
controlList: [],
statusInterval: null,//statusInterval
statusTime: 2,//status
allDevicestatus: [],//
nowDevicestatus: [],//
}
},
watch: {
@ -323,16 +298,48 @@ export default {
})
console.log(this.player);
},
getNumberStatus(index) {
if (index == 0) {
return '静止状态'
} else if (index == 1) {
return '正向打开中'
} else if (index == 2) {
return '反向关闭中'
} else {
return ''
getNumberStatus(item) {
var index = item.index
if (item.type == 2||item.type == 5||item.type == 6) {
//
if (index == 0) {
return '静止状态'
} else if (index == 1) {
return '正向打开中'
} else if (index == 2) {
return '反向关闭中'
} else {
return ''
}
} else if (item.type == 3) {
//
if (index == 0) {
return '加温水泵关闭'
} else if (index == 1) {
return '加温水泵打开'
} else {
return ''
}
} else if (item.type == 4) {
//
if (index == 0) {
return '地热风机关闭'
} else if (index == 1) {
return '地热风机打开'
} else {
return ''
}
} else if (item.type == 7) {
//
if (index == 0) {
return '除雪关闭'
} else if (index == 1) {
return '除雪打开'
} else {
return ''
}
}
},
createVideo() {
@ -568,8 +575,9 @@ export default {
}
// console.log(this.controlList);
})
this.getPermissionStatus()
this.getStatus()
this.getStatePermissionStatus()
clearInterval(this.statusInterval) && this.statusInterval
this.statusInterval = setInterval(() => {
if (this.deviceName == 10) {
@ -606,9 +614,64 @@ export default {
}
})
}
} else if (this.deviceName == 30) {
this.api.getControlRtDatastation(formData).then(res => {
this.controlList = []
if (res.data.code == 200) {
res.data.data.forEach((el, index) => {
list.forEach((el1, index1) => {
if (el.formula == el1.value) {
// console.log(el1);
var num = el.environmentData + el1.unit
this.list.push({
...el,
name: el.environmentDataId,
num: num,
img: require(`../../assets/image/real-time-${el.formula}.png`)
})
this.controlList.push({
...el,
num: num,
img: require(`../../assets/image/real-time-${el.formula}.png`)
})
}
})
})
}
// console.log(this.controlList);
})
this.api.getControlChartdata(equipmentId).then(res => {
if (res.data.code == 200) {
res.data.data.forEach((el, index) => {
var chartsData = res.data.data
realTimeLine('realTime-line', chartsData)
})
}
})
}
},
//status
getStatePermissionStatus() {
this.api.getStatePermissionStatus().then(res => {
if (res.data.code == 200) {
this.allDevicestatus = res.data.data
}
})
},
//
getPermissionStatus() {
var store = this.$store.state
var TargetValue = {
deviceId: store.equipmentList[this.indexs - 1].deviceId
}
this.api.getPermissionStatus(TargetValue).then(res => {
if (res.data.code == 200) {
this.nowDevicestatus = res.data.data
}
})
},
getStatus() {
var store = this.$store.state
var TargetValue = {
@ -616,24 +679,57 @@ export default {
}
this.api.getControlGetState(TargetValue).then(res => {
if (res.data.code == 200) {
this.fanStatus.open = res.data.data['1023']
this.fanStatus.status = []
var num = res.data.data['1024']
var num1 = this.padString(num.toString(2), 5)
var openListNew = []
openListNew = num1.split("")
this.fanStatus.status = openListNew.reverse()
this.statusList = []
for (var i = 0; i < 4; i++) {
var statusData = { name: `顶卷膜${i + 1}`, open: res.data.data[(1025 + (i * 3))], progress: res.data.data[(1027 + (i * 3))], index: res.data.data[(1026 + (i * 3))] }
this.statusList.push(statusData)
this.nowDevicestatus.forEach((el, index) => {
if (el.id == 1) {
//
var fandata = {}
fandata.open = res.data.data['1023']
fandata.id = el.id
fandata.type = 1
fandata.name = el.name
fandata.status = []
var num = res.data.data['1024']
var num1 = this.padString(num.toString(2), 5)
var openListNew = []
openListNew = num1.split("")
fandata.status = openListNew.reverse()
this.statusList.push(fandata)
} else if (el.id == 2 || el.id == 3 || el.id == 4 || el.id == 5) {
//
var statusData = { name: el.name, type: 2, id: el.id, open: res.data.data[(1025 + ((el.id - 2) * 3))], progress: res.data.data[(1027 + ((el.id - 2) * 3))], index: res.data.data[(1026 + ((el.id - 2) * 3))] }
this.statusList.push(statusData)
} else if (el.id == 6) {
//
var statusData = { name: el.name, type: 3, id: el.id, open: res.data.data['1000'], progress: 0, index: res.data.data['1001'] }
this.statusList.push(statusData)
} else if (el.id == 7) {
//
var statusData = { name: el.name, type: 4, id: el.id, open: res.data.data['1002'], progress: 0, index: res.data.data['1003'] }
this.statusList.push(statusData)
} else if (el.id == 8) {
//
var statusData = { name: el.name, type: 5, id: el.id, open: res.data.data['1004'], progress: res.data.data['1006'], index: res.data.data['1005'] }
this.statusList.push(statusData)
} else if (el.id == 9) {
//
var statusData = { name: el.name, type: 5, id: el.id, open: res.data.data['1007'], progress: res.data.data['1009'], index: res.data.data['1008'] }
this.statusList.push(statusData)
} else if (el.id == 10) {
//
var statusData = { name: el.name, type: 6, id: el.id, open: res.data.data['1010'], progress: res.data.data['1012'], index: res.data.data['1011'] }
this.statusList.push(statusData)
} else if (el.id == 11) {
//
var statusData = { name: el.name, type: 7, id: el.id, open: res.data.data['1013'], progress: 0, index: res.data.data['1014'] }
this.statusList.push(statusData)
}
})
}
this.$forceUpdate();
setTimeout(() => {
this.statusList.forEach((el, index) => {
if (el.open != 0) {
if (el.open != 0 && (el.type == 6 || el.type == 5 || el.type == 2)) {
statusCharts(`statusCharts${index}`, el.progress)
}
})
@ -641,9 +737,7 @@ export default {
} else {
this.statusList = []
this.fanStatus = {
name: '风机', open: 0, status: []
}
this.$forceUpdate();
// this.$message.error(res.data.msg);
}

View File

@ -2,6 +2,9 @@
<div class="waterPump wufang">
<div class="table-title">
<img src="../../assets/img/rollByRoll.png" alt=""> 卷被
<div class="title-text">日出:{{ sunrise }}</div>
<div class="title-text">日落:{{ sunset }}</div>
</div>
<div class="title-tips">卷被有效性设置</div>
<div class="flex-view">
@ -24,56 +27,48 @@
<div class="flex-view">
<div class="flex-sel padding-none" v-if="openTrue.length" @click="changeOpenTrue(0)">
<div v-if="openTrue[0]==0" class="no-sel margin-none"></div>
<div v-if="openTrue[0] == 0" class="no-sel margin-none"></div>
<div v-else class="sel margin-none"></div>
</div>
<div class="input-main">
<span>①室外光照大于</span>
<input @blur="blurChange10('21550', $event)"
v-model="inputData['21550']"
@input="changeCount10('21550', $event)"
type="text" value="60" placeholder="60" />
<input @blur="blurChange10('21550', $event)" v-model="inputData['21550']"
@input="changeCount10('21550', $event)" type="text" value="60" placeholder="60" />
<span>klx收拢卷被</span>
</div>
</div>
<div class="flex-view">
<div class="flex-sel padding-none" v-if="openTrue.length" @click="changeOpenTrue(1)">
<div v-if="openTrue[1]==0" class="no-sel margin-none"></div>
<div v-if="openTrue[1] == 0" class="no-sel margin-none"></div>
<div v-else class="sel margin-none"></div>
</div>
<div class="input-main">
<span>②日出</span>
<input @blur="blurChange('21551', $event)"
v-model="inputData['21551']"
@input="change('21551', $event)"
<input @blur="blurChange('21551', $event)" v-model="inputData['21551']" @input="change('21551', $event)"
type="text" value="60" placeholder="60" />
<span>分钟收拢卷被</span>
</div>
</div>
<div class="flex-view">
<div class="flex-sel padding-none" v-if="openTrue.length" @click="changeOpenTrue(2)">
<div v-if="openTrue[2]==0" class="no-sel margin-none"></div>
<div v-if="openTrue[2] == 0" class="no-sel margin-none"></div>
<div v-else class="sel margin-none"></div>
</div>
<div class="input-main">
<span>③室内1#平均温度低于</span>
<input @blur="blurChangeCount('21552', $event)"
v-model="inputData['21552']"
@input="changeCountData('21552', $event)"
type="text" value="60" placeholder="60" />
<input @blur="blurChangeCount('21552', $event)" v-model="inputData['21552']"
@input="changeCountData('21552', $event)" type="text" value="60" placeholder="60" />
<span>展开卷被</span>
</div>
</div>
<div class="flex-view">
<div class="flex-sel padding-none" v-if="openTrue.length" @click="changeOpenTrue(3)">
<div v-if="openTrue[3]==0" class="no-sel margin-none"></div>
<div v-if="openTrue[3] == 0" class="no-sel margin-none"></div>
<div v-else class="sel margin-none"></div>
</div>
<div class="input-main">
<span>④日落前</span>
<input @blur="blurChange('21553', $event)"
v-model="inputData['21553']"
@input="change('21553', $event)"
<input @blur="blurChange('21553', $event)" v-model="inputData['21553']" @input="change('21553', $event)"
type="text" value="60" placeholder="60" />
<span>分钟展开卷被</span>
</div>
@ -81,25 +76,19 @@
<div class="flex-view border-none">
<div class="input-main">
<div>卷被的行程时间</div>
<input @blur="blurChange('21554', $event)"
v-model="inputData['21554']"
@input="change('21554', $event)"
<input @blur="blurChange('21554', $event)" v-model="inputData['21554']" @input="change('21554', $event)"
type="text" value="60" placeholder="60" />
<span></span>
</div>
<div class="input-main">
<div>卷被开窗的行程时间</div>
<input @blur="blurChange('21555', $event)"
v-model="inputData['21555']"
@input="change('21555', $event)"
<input @blur="blurChange('21555', $event)" v-model="inputData['21555']" @input="change('21555', $event)"
type="text" value="60" placeholder="60" />
<span></span>
</div>
<div class="input-main">
<div>展开的输出通道</div>
<input @blur="blurChange('21556', $event)"
v-model="inputData['21556']"
@input="change('21556', $event)"
<input @blur="blurChange('21556', $event)" v-model="inputData['21556']" @input="change('21556', $event)"
type="text" value="60" placeholder="60" />
<span></span>
</div>
@ -119,6 +108,8 @@ export default {
openIndex: 1,
inputData: {},
openTrue: [],
sunrise: '00:00',
sunset: '00:00'
}
},
mounted() {
@ -130,21 +121,21 @@ export default {
}
},
methods: {
//
myReverse(arr) {
//
myReverse(arr) {
return [...arr].reverse()
},
padString(str, length) {
return str.padStart(length, '0');
},
changeOpenTrue(index) {
if( this.openTrue[index]==0){
this.openTrue[index]=1
}else{
this.openTrue[index]=0
}
this.$forceUpdate();
var num=this.myReverse(this.openTrue).join("")
if (this.openTrue[index] == 0) {
this.openTrue[index] = 1
} else {
this.openTrue[index] = 0
}
this.$forceUpdate();
var num = this.myReverse(this.openTrue).join("")
var dataNum = {
target: {
@ -227,12 +218,34 @@ export default {
return 0
}
},
get21549(){
get21549() {
var num1 = this.inputData['21549']
var num11 = this.padString(num1.toString(2), 4)
var openList1New
openList1New = num11.split("")
this.openTrue= openList1New.reverse()
this.openTrue = openList1New.reverse()
},
getStatus(data) {
this.api.getControlGetState(data).then(res => {
if (res.data.code == 200) {
this.sunrise = this.convertToTimeMinutes(res.data.data['1021'])
this.sunset = this.convertToTimeMinutes(res.data.data['1022'])
}
})
},
//16 16
convertToTimeMinutes(hexValue) {
// 16 16
const intValue = hexValue
//
const hours = (intValue >> 8) & 0xFF;
const minutes = intValue & 0xFF;
// :
const formattedTime = `${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}`;
return formattedTime;
},
dataInit() {
var store = this.$store.state
@ -242,17 +255,18 @@ export default {
};
this.api.readControl_fiveControl(data).then(res => {
console.log(res, 111);
if(res.data.code==200){
if (res.data.code == 200) {
this.inputData = res.data.data
this.openIndex = this.inputData['21548']
this.openIndex = this.inputData['21548']
this.get21549()
this.inputData['21552'] = this.countData(this.inputData['21552'])
this.inputData['21550'] = this.countData10(this.inputData['21550'])
this.inputData['21552'] = this.countData(this.inputData['21552'])
this.inputData['21550'] = this.countData10(this.inputData['21550'])
}
})
this.getStatus(data)
},
//
selectValue(e) {

View File

@ -55,7 +55,7 @@
</div>
<div class="input-main border-right">
<span>最大开度</span>
<span>{{ inputData['21535'] }}</span>
<span>{{ statusNum }}</span>
<span>%</span>
</div>
<div class="input-main">
@ -93,8 +93,13 @@ export default {
openIndex: 1,
inputData: {},
openTrue: false,
statusNum:0,
statusInterval:null,
}
},
beforeDestroy(){
clearInterval(this.statusInterval)&&this.statusInterval
},
mounted() {
this.dataInit();
//input
@ -203,6 +208,18 @@ export default {
}
})
this.getStatus(data)
clearInterval(this.statusInterval)&&this.statusInterval
this.statusInterval=setInterval(() => {
this.getStatus(data)
}, 3000);
},
getStatus(data){
this.api.getControlGetState(data).then(res=>{
if(res.data.code==200){
this.statusNum=res.data.data['1015']
}
})
},
//
selectValue(e) {

View File

@ -3,3 +3,5 @@ vscode打开
先npm install 下载依赖
依赖下载完成后 npm run serve 进行运行
该项目很多数据是无法循环的 故许多参数数据是写死的 如果需要添加新数据需要手动添加.