pc-master #22
@ -9,6 +9,14 @@
|
||||
return {
|
||||
}
|
||||
},
|
||||
created(){
|
||||
if (sessionStorage.getItem("store") ) { //在页面加载时读取sessionStorage里的状态信息
|
||||
this.$store.replaceState(Object.assign({}, this.$store.state,JSON.parse(sessionStorage.getItem("store"))))
|
||||
}
|
||||
window.addEventListener("beforeunload",()=>{ //在页面刷新时将vuex里的信息保存到sessionStorage里
|
||||
sessionStorage.setItem("store",JSON.stringify(this.$store.state))
|
||||
})
|
||||
},
|
||||
mounted(){
|
||||
let inputList = document.querySelectorAll('input');
|
||||
for (let index = 0; index < inputList.length; index++) {
|
||||
|
||||
@ -116,4 +116,32 @@ export default {
|
||||
getUser(data){
|
||||
return sendGetRequest('/api/sel/user',data)
|
||||
},
|
||||
|
||||
|
||||
//控制器接口
|
||||
//控制器实时数据
|
||||
getControlRtdata(data){
|
||||
return sendPostRequest("/getcontrol/rtdata?equipmentId="+data, '');
|
||||
},
|
||||
//控制器实时数据折线图
|
||||
getControlFsdata(data){
|
||||
return sendPostRequest("/getcontrol/fsdata?equipmentId="+data, '');
|
||||
},
|
||||
//控制器数据上传数据获取
|
||||
getControldataUpload(data){
|
||||
return sendGetRequest('/readControl/dataUpload',data)
|
||||
},
|
||||
//控制器写入数据
|
||||
postControlWrite(data){
|
||||
return sendPostRequest("/writeJinHuaControl/write", data);
|
||||
},
|
||||
//控制器传感器通道
|
||||
getReadControlSensorChannel(data){
|
||||
return sendGetRequest('/readControl/sensorChannel',data)
|
||||
},
|
||||
//控制器 顶模和风机
|
||||
getReadControlliShuiControl(data){
|
||||
return sendGetRequest('/readControl/liShuiControl',data)
|
||||
},
|
||||
|
||||
};
|
||||
@ -423,6 +423,10 @@
|
||||
padding: 0 8px;
|
||||
}
|
||||
|
||||
.input-sel > .title {
|
||||
margin-bottom: 11px;
|
||||
}
|
||||
|
||||
.input-sel .el-dropdown-link {
|
||||
width: 300px;
|
||||
height: 44px;
|
||||
@ -758,7 +762,7 @@
|
||||
}
|
||||
|
||||
.btn {
|
||||
margin: 0 8px;
|
||||
margin: 0 8px !important;
|
||||
padding: 0 20px;
|
||||
border-radius: 3px;
|
||||
height: 40px;
|
||||
@ -771,6 +775,7 @@
|
||||
color: #FFFFFF;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
min-width: 120px;
|
||||
}
|
||||
|
||||
.btn > img {
|
||||
@ -787,6 +792,12 @@
|
||||
background: #0294E2;
|
||||
}
|
||||
|
||||
.btn.off {
|
||||
background: #003070;
|
||||
border: 1px solid rgba(2, 148, 226, 0.5);
|
||||
color: #00C0F7;
|
||||
}
|
||||
|
||||
.irrigateSet .open-btn {
|
||||
width: 300px;
|
||||
height: 54px;
|
||||
@ -936,11 +947,28 @@
|
||||
padding: 19px 30px;
|
||||
}
|
||||
|
||||
.upload .upload-content.upload-content1 {
|
||||
height: auto;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 19px 30px;
|
||||
}
|
||||
|
||||
.upload .upload-content.upload-content1 > div {
|
||||
width: 218px;
|
||||
height: 45px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.upload .upload-content > div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
flex-shrink: 0;
|
||||
white-space: nowrap;
|
||||
max-height: 50px;
|
||||
}
|
||||
|
||||
.upload .upload-content > div > .no-sel {
|
||||
@ -1070,6 +1098,70 @@
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
.sensorSet .sensor-type .sensor-title {
|
||||
font-size: 20px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
||||
.sensorSet .sensor-type .sensor-type-div {
|
||||
width: 100%;
|
||||
height: 66px;
|
||||
background: rgba(0, 186, 255, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.4);
|
||||
margin-bottom: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.sensorSet .sensor-type .sensor-type-div .name {
|
||||
width: 120px;
|
||||
border-right: 1px solid rgba(2, 148, 227, 0.5);
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.sensorSet .sensor-type .sensor-type-div .sensor-sel {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: calc(100% - 120px);
|
||||
}
|
||||
|
||||
.sensorSet .sensor-type .sensor-type-div .sensor-sel > div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
flex-shrink: 0;
|
||||
white-space: nowrap;
|
||||
max-height: 50px;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.sensorSet .sensor-type .sensor-type-div .sensor-sel > div > .no-sel {
|
||||
margin-right: 10px;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
box-shadow: 0 0 15px rgba(53, 187, 247, 0.5) inset;
|
||||
border: 1px solid rgba(0, 204, 255, 0.7);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.sensorSet .sensor-type .sensor-type-div .sensor-sel > div .sel {
|
||||
margin-right: 10px;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
background: url(../image/radio.png) no-repeat center;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.el-dialog__wrapper .el-dialog {
|
||||
background: rgba(0, 59, 114, 0.8);
|
||||
border: 2px solid rgba(0, 186, 255, 0.35);
|
||||
@ -1659,3 +1751,105 @@
|
||||
background: rgba(0, 186, 255, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.4);
|
||||
}
|
||||
|
||||
.input-100-view {
|
||||
width: 100%;
|
||||
height: 66px;
|
||||
background: rgba(0, 186, 255, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.4);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 20px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.input-100-view .title {
|
||||
font-size: 20px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.input-100-view span {
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.input-100-view .line {
|
||||
width: 1px;
|
||||
height: 40px;
|
||||
background: #0294E2;
|
||||
opacity: 0.5;
|
||||
margin: 0 20px;
|
||||
}
|
||||
|
||||
.input-100-view .input-140 {
|
||||
width: 140px;
|
||||
height: 44px;
|
||||
background: rgba(0, 186, 255, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.4);
|
||||
padding-left: 11px;
|
||||
}
|
||||
|
||||
.input-100-view .input-140::placeholder {
|
||||
color: #859bb6;
|
||||
}
|
||||
|
||||
.input-100-view .input-180 {
|
||||
width: 180px;
|
||||
height: 44px;
|
||||
background: rgba(0, 186, 255, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.4);
|
||||
padding-left: 11px;
|
||||
}
|
||||
|
||||
.input-100-view .input-180::placeholder {
|
||||
color: #859bb6;
|
||||
}
|
||||
|
||||
.input-100-view .input-100 {
|
||||
width: 100px;
|
||||
height: 44px;
|
||||
background: rgba(0, 48, 112, 0.75);
|
||||
border: 1px solid rgba(0, 186, 255, 0.8);
|
||||
padding-left: 11px;
|
||||
}
|
||||
|
||||
.input-100-view .input-100::placeholder {
|
||||
color: #859bb6;
|
||||
}
|
||||
|
||||
.bold-title {
|
||||
font-size: 20px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.padding-none {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.margin-none {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.skylight .input-sel {
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.skylight .flex-view {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.skylight .input-main {
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.skylight .input-main > input {
|
||||
width: 260px;
|
||||
}
|
||||
|
||||
.fan .bold-title {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
2
src/assets/css/main.min.css
vendored
2
src/assets/css/main.min.css
vendored
File diff suppressed because one or more lines are too long
@ -177,24 +177,25 @@
|
||||
|
||||
&.set-params {
|
||||
.el-collapse-item {
|
||||
&.active{
|
||||
.el-collapse-item__header {
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.3);
|
||||
|
||||
.name {
|
||||
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
}
|
||||
&.active {
|
||||
.el-collapse-item__header {
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.3);
|
||||
|
||||
.name {
|
||||
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.el-collapse-item__header {
|
||||
.name{
|
||||
color: #A8B6C8;
|
||||
}
|
||||
|
||||
.name {
|
||||
color: #A8B6C8;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.table-ul {
|
||||
@ -450,6 +451,9 @@
|
||||
}
|
||||
|
||||
.input-sel {
|
||||
>.title{
|
||||
margin-bottom: 11px;
|
||||
}
|
||||
.el-dropdown-link {
|
||||
width: 300px;
|
||||
height: 44px;
|
||||
@ -796,7 +800,7 @@
|
||||
}
|
||||
|
||||
.btn {
|
||||
margin: 0 8px;
|
||||
margin: 0 8px!important;
|
||||
padding: 0 20px;
|
||||
border-radius: 3px;
|
||||
height: 40px;
|
||||
@ -809,7 +813,7 @@
|
||||
color: #FFFFFF;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
|
||||
min-width: 120px;
|
||||
>img {
|
||||
margin-right: 10px;
|
||||
width: 14px;
|
||||
@ -823,6 +827,11 @@
|
||||
&.blue {
|
||||
background: #0294E2;
|
||||
}
|
||||
&.off{
|
||||
background: #003070;
|
||||
border: 1px solid rgba(2,148,226,0.5);
|
||||
color: #00C0F7;
|
||||
}
|
||||
}
|
||||
|
||||
.irrigateSet {
|
||||
@ -985,11 +994,32 @@
|
||||
grid-column-gap: 20px; //横向间隔
|
||||
padding: 19px 30px;
|
||||
|
||||
&.upload-content1 {
|
||||
height: auto;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
// grid-template-columns: repeat(2, 1fr);
|
||||
// grid-row-gap: 20px; //纵向间隔
|
||||
// grid-column-gap: 20px; //横向间隔
|
||||
padding: 19px 30px;
|
||||
|
||||
>div {
|
||||
|
||||
width: 218px;
|
||||
height: 45px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
>div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
flex-shrink: 0;
|
||||
white-space: nowrap;
|
||||
max-height: 50px;
|
||||
|
||||
>.no-sel {
|
||||
margin-right: 10px;
|
||||
@ -1126,6 +1156,69 @@
|
||||
}
|
||||
}
|
||||
|
||||
.sensor-type {
|
||||
.sensor-title {
|
||||
font-size: 20px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
||||
.sensor-type-div {
|
||||
width: 100%;
|
||||
height: 66px;
|
||||
background: rgba(0, 186, 255, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.4);
|
||||
margin-bottom: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.name {
|
||||
width: 120px;
|
||||
border-right: 1px solid rgba(2, 148, 227, 0.5);
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.sensor-sel{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: calc(100% - 120px);
|
||||
|
||||
>div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
flex-shrink: 0;
|
||||
white-space: nowrap;
|
||||
max-height: 50px;
|
||||
padding: 0 20px;
|
||||
>.no-sel {
|
||||
margin-right: 10px;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
box-shadow: 0 0 15px rgba(53, 187, 247, 0.50) inset;
|
||||
border: 1px solid rgba(0, 204, 255, 0.70);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.sel {
|
||||
margin-right: 10px;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
background: url(../image/radio.png) no-repeat center;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.el-dialog__wrapper {
|
||||
@ -1746,6 +1839,7 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
|
||||
.manage-input {
|
||||
|
||||
>input {
|
||||
@ -1765,12 +1859,105 @@
|
||||
background: rgba(0, 186, 255, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.40);
|
||||
|
||||
>div {
|
||||
|
||||
}
|
||||
>div {}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.input-100-view{
|
||||
width: 100%;
|
||||
height: 66px;
|
||||
background: rgba(0,186,255,0.15);
|
||||
border: 2px solid rgba(0,186,255,0.4);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding:0 20px ;
|
||||
margin-bottom: 30px;
|
||||
.title{
|
||||
font-size: 20px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
span{
|
||||
padding: 0 10px;
|
||||
}
|
||||
.line{
|
||||
width: 1px;
|
||||
height: 40px;
|
||||
background: #0294E2;
|
||||
opacity: 0.5;
|
||||
margin: 0 20px;
|
||||
}
|
||||
.input-140{
|
||||
width: 140px;
|
||||
height: 44px;
|
||||
background: rgba(0,186,255,0.15);
|
||||
border: 2px solid rgba(0,186,255,0.4);
|
||||
padding-left: 11px;
|
||||
|
||||
&::placeholder {
|
||||
color: rgba(133, 155, 182, 1);
|
||||
}
|
||||
}
|
||||
.input-180{
|
||||
width: 180px;
|
||||
height: 44px;
|
||||
background: rgba(0,186,255,0.15);
|
||||
border: 2px solid rgba(0,186,255,0.4);
|
||||
padding-left: 11px;
|
||||
|
||||
&::placeholder {
|
||||
color: rgba(133, 155, 182, 1);
|
||||
}
|
||||
}
|
||||
.input-100{
|
||||
width: 100px;
|
||||
height: 44px;
|
||||
background: rgba(0,48,112,0.75);
|
||||
border: 1px solid rgba(0, 186, 255, 0.80);
|
||||
padding-left: 11px;
|
||||
|
||||
&::placeholder {
|
||||
color: rgba(133, 155, 182, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
.bold-title{
|
||||
font-size: 20px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.padding-none{
|
||||
padding: 0;
|
||||
}
|
||||
.margin-none{
|
||||
margin: 0;
|
||||
}
|
||||
.skylight{
|
||||
.input-sel{
|
||||
margin-right: 20px;
|
||||
.el-dropdown-link{
|
||||
// width: 260px;
|
||||
}
|
||||
}
|
||||
.flex-view{
|
||||
border: none;
|
||||
}
|
||||
.input-main{
|
||||
margin-right: 20px;
|
||||
>input{
|
||||
width: 260px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fan{
|
||||
.bold-title{
|
||||
margin-top: 20px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 16 KiB After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-10.png
Normal file
BIN
src/assets/image/real-time-10.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-11.png
Normal file
BIN
src/assets/image/real-time-11.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-12.png
Normal file
BIN
src/assets/image/real-time-12.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-13.png
Normal file
BIN
src/assets/image/real-time-13.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-14.png
Normal file
BIN
src/assets/image/real-time-14.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-15.png
Normal file
BIN
src/assets/image/real-time-15.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
BIN
src/assets/image/real-time-16.png
Normal file
BIN
src/assets/image/real-time-16.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-17.png
Normal file
BIN
src/assets/image/real-time-17.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-18.png
Normal file
BIN
src/assets/image/real-time-18.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-19.png
Normal file
BIN
src/assets/image/real-time-19.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-2.png
Normal file
BIN
src/assets/image/real-time-2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-20.png
Normal file
BIN
src/assets/image/real-time-20.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-21.png
Normal file
BIN
src/assets/image/real-time-21.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-22.png
Normal file
BIN
src/assets/image/real-time-22.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-23.png
Normal file
BIN
src/assets/image/real-time-23.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
BIN
src/assets/image/real-time-24.png
Normal file
BIN
src/assets/image/real-time-24.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-25.png
Normal file
BIN
src/assets/image/real-time-25.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
BIN
src/assets/image/real-time-26.png
Normal file
BIN
src/assets/image/real-time-26.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-27.png
Normal file
BIN
src/assets/image/real-time-27.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-28.png
Normal file
BIN
src/assets/image/real-time-28.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-29.png
Normal file
BIN
src/assets/image/real-time-29.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-3.png
Normal file
BIN
src/assets/image/real-time-3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-30.png
Normal file
BIN
src/assets/image/real-time-30.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
BIN
src/assets/image/real-time-31.png
Normal file
BIN
src/assets/image/real-time-31.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-32.png
Normal file
BIN
src/assets/image/real-time-32.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-33.png
Normal file
BIN
src/assets/image/real-time-33.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-34.png
Normal file
BIN
src/assets/image/real-time-34.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-35.png
Normal file
BIN
src/assets/image/real-time-35.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-36.png
Normal file
BIN
src/assets/image/real-time-36.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-37.png
Normal file
BIN
src/assets/image/real-time-37.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-38.png
Normal file
BIN
src/assets/image/real-time-38.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
BIN
src/assets/image/real-time-39.png
Normal file
BIN
src/assets/image/real-time-39.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-4.png
Normal file
BIN
src/assets/image/real-time-4.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-40.png
Normal file
BIN
src/assets/image/real-time-40.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-41.png
Normal file
BIN
src/assets/image/real-time-41.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-42.png
Normal file
BIN
src/assets/image/real-time-42.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-43.png
Normal file
BIN
src/assets/image/real-time-43.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 17 KiB After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-45.png
Normal file
BIN
src/assets/image/real-time-45.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-46.png
Normal file
BIN
src/assets/image/real-time-46.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-47.png
Normal file
BIN
src/assets/image/real-time-47.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-48.png
Normal file
BIN
src/assets/image/real-time-48.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-49.png
Normal file
BIN
src/assets/image/real-time-49.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 16 KiB After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-50.png
Normal file
BIN
src/assets/image/real-time-50.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-51.png
Normal file
BIN
src/assets/image/real-time-51.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-52.png
Normal file
BIN
src/assets/image/real-time-52.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-53.png
Normal file
BIN
src/assets/image/real-time-53.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-54.png
Normal file
BIN
src/assets/image/real-time-54.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-55.png
Normal file
BIN
src/assets/image/real-time-55.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-56.png
Normal file
BIN
src/assets/image/real-time-56.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-57.png
Normal file
BIN
src/assets/image/real-time-57.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-58.png
Normal file
BIN
src/assets/image/real-time-58.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/image/real-time-6.png
Normal file
BIN
src/assets/image/real-time-6.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/real-time-7.png
Normal file
BIN
src/assets/image/real-time-7.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 16 KiB After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 17 KiB After Width: | Height: | Size: 16 KiB |
BIN
src/assets/image/skylight.png
Normal file
BIN
src/assets/image/skylight.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.4 KiB |
@ -77,7 +77,33 @@ export default {
|
||||
this.dataInit()
|
||||
},
|
||||
methods: {
|
||||
//获取设备名称/配方名称
|
||||
getByid() {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
};
|
||||
this.api.getByid(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
store.equipmentName = res.data.data
|
||||
this.getList()
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
this.loading = false
|
||||
});
|
||||
},
|
||||
dataInit() {
|
||||
var store = this.$store.state
|
||||
if(!store.equipmentName){
|
||||
this.getByid()
|
||||
}else{
|
||||
this.getList()
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
getList(){
|
||||
var store = this.$store.state
|
||||
store.nameList.forEach((el, index) => {
|
||||
if (index < 8) {
|
||||
@ -92,8 +118,6 @@ export default {
|
||||
}
|
||||
}
|
||||
})
|
||||
console.log(this.routerList[0], 11);
|
||||
|
||||
},
|
||||
//去首页
|
||||
toHome(index) {
|
||||
|
||||
168
src/components/setParamsControl.vue
Normal file
168
src/components/setParamsControl.vue
Normal file
@ -0,0 +1,168 @@
|
||||
<template>
|
||||
<div class="set-params collapse scroll">
|
||||
<div class="set-top">
|
||||
<img src="../assets/image/set-icon.png" alt="">设定值参数
|
||||
</div>
|
||||
<div class="set-tips">
|
||||
<div @click="toHome($store.state.equipmentIndex)">
|
||||
{{ $store.state.equipmentList[$store.state.equipmentIndex - 1].deviceTypeName }}状态显示</div>
|
||||
</div>
|
||||
<el-collapse v-model="$store.state.activeNames">
|
||||
<template v-for="item, index in routerList">
|
||||
<el-collapse-item :class="routerNow == item.router ? 'active' : ''" :name="index + 1" :key="index"
|
||||
v-if="!item.isRouter">
|
||||
<template slot="title" class="collapse-title">
|
||||
<span class="name">{{ item.name }}</span>
|
||||
</template>
|
||||
<!-- -->
|
||||
<ul class="table-ul">
|
||||
<li @click="toRouter(item1)"
|
||||
:class="routerNow == item1.router && routerIndex == index1 + 1 ? 'active' : ''" class="table-li"
|
||||
v-for="item1, index1 in item.list" :key="index1">{{
|
||||
item1.name }} <div class="status" :class="item1.status == 0 ? 'outline' : 'online'"
|
||||
v-if="item1.status >= 0">{{ item1.status
|
||||
== 0
|
||||
? '离线' : '在线' }}</div>
|
||||
</li>
|
||||
</ul>
|
||||
</el-collapse-item>
|
||||
<div @click="toRouter(item)" :class="routerNow == item.router ? 'active' : ''" class="no-list" v-else>{{
|
||||
item.name
|
||||
}}</div>
|
||||
</template>
|
||||
</el-collapse>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
routerList: [
|
||||
{
|
||||
name: '天窗',router: 'skylight', list: [
|
||||
{ name: '顶卷膜1', status: -1, router: 'skylight', index: 1 },
|
||||
{ name: '顶卷膜2', status: -1, router: 'skylight', index: 2 },
|
||||
{ name: '顶卷膜3', status: -1, router: 'skylight', index: 3 },
|
||||
{ name: '顶卷膜4', status: -1, router: 'skylight', index: 4 },
|
||||
]
|
||||
},
|
||||
{
|
||||
name: '风机', router: 'fan', list: [
|
||||
{ name: '风机1', status: -1, router: 'fan', index: 1 },
|
||||
{ name: '风机2', status: -1, router: 'fan', index: 2 },
|
||||
{ name: '风机3', status: -1, router: 'fan', index: 3 },
|
||||
{ name: '风机4', status: -1, router: 'fan', index: 4 },
|
||||
{ name: '风机5', status: -1, router: 'fan', index: 5 },
|
||||
]
|
||||
},
|
||||
// { name: '系统参数配置', list: [], router: 'systemSet-con', isRouter: true, },
|
||||
{ name: '传感器通道配置', list: [], router: 'sensorSet-con', isRouter: true, },
|
||||
{ name: '数据上传', list: [], router: 'upload-con', isRouter: true, },],
|
||||
routerNow: 'skylight',
|
||||
routerIndex: 1,
|
||||
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
"$route"(newName, oldName) {
|
||||
this.gerRouter();
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.gerRouter();
|
||||
},
|
||||
methods: {
|
||||
dataInit() {
|
||||
|
||||
|
||||
},
|
||||
//去首页
|
||||
toHome(index) {
|
||||
this.$router.push({ path: `/status?eqbyIndex=` + index })
|
||||
},
|
||||
gerRouter() {
|
||||
this.routerNow = this.$route.name;
|
||||
this.routerIndex = this.$route.query.id ? this.$route.query.id : 1
|
||||
},
|
||||
toRouter(item) {
|
||||
if (item.router) {
|
||||
if (item.http) {
|
||||
window.location.href = item.http;
|
||||
} else if (item.router == 'skylight' && this.$route.query.id != item.index) {
|
||||
this.$router.push({ path: `/skylight?id=${item.index}` })
|
||||
} else if (item.router == 'fan' && this.$route.query.id != item.index) {
|
||||
this.$router.push({ path: `/fan?id=${item.index}` })
|
||||
} else if (item.router != this.routerNow && !item.http) {
|
||||
|
||||
this.$router.push({ name: item.router })
|
||||
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.set-params {
|
||||
width: 280px;
|
||||
height: 100%;
|
||||
background: rgba(0, 92, 178, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.20);
|
||||
|
||||
.set-top {
|
||||
font-size: 20px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
width: 100%;
|
||||
padding-left: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-top: 20px;
|
||||
|
||||
img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.el-collapse-item {
|
||||
&.active {}
|
||||
}
|
||||
|
||||
.no-list {
|
||||
color: #A8B6C8;
|
||||
|
||||
&.active {
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.3);
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.set-tips {
|
||||
width: 100%;
|
||||
border-bottom: 1px solid rgba(168, 182, 200, 0.2);
|
||||
margin-top: 17px;
|
||||
padding-bottom: 17px;
|
||||
padding-left: 10px;
|
||||
cursor: pointer;
|
||||
|
||||
>div {
|
||||
width: 220px;
|
||||
height: 40px;
|
||||
// background: rgba(255, 255, 255, 0.1);
|
||||
// border: 1px solid rgba(255, 255, 255, 0.3);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
padding-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -3,6 +3,7 @@ import VueRouter from 'vue-router'
|
||||
import HomeView from '../views/HomeView.vue'
|
||||
import index from '../views/index.vue'
|
||||
import login from '../views/login.vue'
|
||||
import control from '../views/control.vue'
|
||||
Vue.use(VueRouter)
|
||||
|
||||
const routes = [
|
||||
@ -68,6 +69,28 @@ const routes = [
|
||||
path: '/systemManage',
|
||||
name: 'systemManage',
|
||||
component: () => import('../views/page/systemManage.vue')
|
||||
}, {
|
||||
path: '/control',
|
||||
name: 'control',
|
||||
component: control,
|
||||
redirect: '/skylight',
|
||||
children: [{
|
||||
path: '/skylight',
|
||||
name: 'skylight',
|
||||
component: () => import('../views/page/skylight.vue')
|
||||
},{
|
||||
path: '/fan',
|
||||
name: 'fan',
|
||||
component: () => import('../views/page/fan.vue')
|
||||
},{
|
||||
path: '/upload-con',
|
||||
name: 'upload-con',
|
||||
component: () => import('../views/page/upload-con.vue')
|
||||
},{
|
||||
path: '/sensorSet-con',
|
||||
name: 'sensorSet-con',
|
||||
component: () => import('../views/page/sensorSet-con.vue')
|
||||
},]
|
||||
},]
|
||||
},
|
||||
]
|
||||
|
||||
32
src/views/control.vue
Normal file
32
src/views/control.vue
Normal file
@ -0,0 +1,32 @@
|
||||
<template>
|
||||
<div class="formula control">
|
||||
<setParamsControl></setParamsControl>
|
||||
<div class="page-content">
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import setParamsControl from "../components/setParamsControl.vue";
|
||||
export default {
|
||||
components: {
|
||||
setParamsControl,
|
||||
},
|
||||
data(){
|
||||
return {}
|
||||
},
|
||||
mounted(){},
|
||||
methods:{},
|
||||
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@ -62,28 +62,29 @@ export default {
|
||||
headerList: [
|
||||
{ name: '实时数据', router: 'realTime', routerList: ['realTime'], img: require('../assets/image/header-img1.png') },
|
||||
// { name: '设定值参数', router: 'status', index: 1, routerList: ['formula', 'irrigateSet', 'PIDSet', 'systemSet', 'upload', 'sensorSet'], img: require('../assets/image/header-img0.png') },
|
||||
{ name: '设定值参数', router: 'status', index: 1, routerList: ['status'], img: require('../assets/image/header-img0.png') },
|
||||
{ name: '设定值参数', router: 'status', index: 1, routerList: ['status','skylight', 'fan','upload-con','sensorSet-con'], img: require('../assets/image/header-img0.png') },
|
||||
{ name: '设备菜单', router: '', routerList: [], img: require('../assets/image/header-img1.png') },
|
||||
{ name: '视频监控', router: '', routerList: [], img: require('../assets/image/header-img2.png') },
|
||||
// history history
|
||||
{ name: '历史数据', router: '',index: 1, routerList: [''], img: require('../assets/image/header-img3.png') },
|
||||
{ name: '历史数据', router: '', index: 1, routerList: [''], img: require('../assets/image/header-img3.png') },
|
||||
//dataAnalysis dataAnalysis
|
||||
{ name: '数据分析', router: '',index: 1, routerList: [''], img: require('../assets/image/header-img4.png') },
|
||||
{ name: '数据分析', router: '', index: 1, routerList: [''], img: require('../assets/image/header-img4.png') },
|
||||
{ name: '设备菜单', router: '', routerList: [], img: require('../assets/image/header-img5.png') },
|
||||
//systemManage systemManage
|
||||
{ name: '管理', router: '', routerList: [''], img: require('../assets/image/header-img6.png') }],
|
||||
activeNames: [4],
|
||||
activeNames: [3],
|
||||
leftList: [
|
||||
{ name: '首页', img: require('../assets/image/index-icon.png'), list: [], router: 'realTime', isRouter: true, },
|
||||
{ name: '一号温室', img: require('../assets/image/left-img0.png'), list: [] },
|
||||
{ name: '二号温室', img: require('../assets/image/left-img1.png'), list: [] },
|
||||
{ name: '施肥机', routerList: ['formula', 'irrigateSet', 'PIDSet', 'systemSet', 'upload', 'sensorSet', 'realTime','history','dataAnalysis'], img: require('../assets/image/left-img2.png'), list: [] },],
|
||||
{ name: '温室', routerList: ['realTime', 'skylight', 'control','fan','upload-con','sensorSet-con'], img: require('../assets/image/left-img0.png'), list: [] },
|
||||
// { name: '二号温室', img: require('../assets/image/left-img1.png'), list: [] },
|
||||
{ name: '施肥机', routerList: ['formula', 'irrigateSet', 'PIDSet', 'systemSet', 'upload', 'sensorSet', 'realTime', 'history', 'dataAnalysis'], img: require('../assets/image/left-img2.png'), list: [] },],
|
||||
routerNow: 'realTime',
|
||||
deviceName: 1,
|
||||
routerIndex: 1,
|
||||
equipmentList: [],
|
||||
userInfo: null,
|
||||
loading: true,//页面加载
|
||||
IDTimer:null,
|
||||
IDTimer: null,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
@ -99,8 +100,8 @@ export default {
|
||||
localStorage.setItem('token', router.token)
|
||||
|
||||
this.api.getUser({ userId: router.userid }).then(res => {
|
||||
var data=res.data.data
|
||||
data.userid=router.userid
|
||||
var data = res.data.data
|
||||
data.userid = router.userid
|
||||
localStorage.setItem('userInfo', JSON.stringify(data))
|
||||
this.userInfo = JSON.parse(localStorage.getItem('userInfo'))
|
||||
this.gerRouter();
|
||||
@ -114,14 +115,14 @@ export default {
|
||||
this.gerRouter();
|
||||
this.getEqbyid()
|
||||
}
|
||||
this.IDTimer&&clearInterval( this.IDTimer)
|
||||
this.IDTimer= setInterval(() => {
|
||||
this.IDTimer && clearInterval(this.IDTimer)
|
||||
this.IDTimer = setInterval(() => {
|
||||
that.getEqbyid()
|
||||
}, 120000);
|
||||
|
||||
},
|
||||
beforeDestroy(){
|
||||
this.IDTimer&&clearInterval( this.IDTimer)
|
||||
beforeDestroy() {
|
||||
this.IDTimer && clearInterval(this.IDTimer)
|
||||
},
|
||||
methods: {
|
||||
//获取设备名称/配方名称
|
||||
@ -151,20 +152,39 @@ export default {
|
||||
index: index + 1,
|
||||
};
|
||||
});
|
||||
|
||||
this.leftList.forEach((el, index) => {
|
||||
if (el.name == '施肥机') {
|
||||
this.leftList[index].list = this.$store.state.equipmentList
|
||||
this.leftList[1].list = []
|
||||
this.leftList[2].list = []
|
||||
this.$store.state.equipmentList.forEach((el, index) => {
|
||||
if (el.deviceName == 1) {
|
||||
this.leftList.forEach((el1, index1) => {
|
||||
if (el1.name == '施肥机') {
|
||||
this.leftList[index1].list.push(el)
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.leftList.forEach((el1, index1) => {
|
||||
if (el1.name == '温室') {
|
||||
this.leftList[index1].list.push(el)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.gerRouter()
|
||||
this.getByid()
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
gerRouter() {
|
||||
this.routerIndex = this.$route.query.index ? this.$route.query.index : this.$store.state.equipmentIndex
|
||||
var store=this.$store.state
|
||||
this.routerIndex = this.$route.query.index ? this.$route.query.index : store.equipmentIndex
|
||||
this.routerNow = this.$route.name;
|
||||
if(store.equipmentList.length){
|
||||
this.deviceName =store.equipmentList[this.routerIndex - 1].deviceName
|
||||
}else{
|
||||
|
||||
}
|
||||
|
||||
},
|
||||
loginOut() {
|
||||
this.api.loginOut().then((res) => {
|
||||
@ -193,12 +213,18 @@ export default {
|
||||
this.$store.state.equipmentIndex = item.index
|
||||
this.$router.push({ path: `/${item.router}?id=${item.index ? item.index : 1}` })
|
||||
|
||||
}else if (item.router == 'history' && this.$route.query.index != item.index) {
|
||||
} else if (item.router == 'history' && this.$route.query.index != item.index) {
|
||||
this.$router.push({ path: `/history?index=${item.index ? item.index : 1}` })
|
||||
|
||||
}else if (item.router == 'dataAnalysis' && this.$route.query.index != item.index) {
|
||||
} else if (item.router == 'dataAnalysis' && this.$route.query.index != item.index) {
|
||||
this.$router.push({ path: `/dataAnalysis?index=${item.index ? item.index : 1}` })
|
||||
|
||||
} else if (this.routerNow == 'realTime' && item.router == 'status' && this.deviceName == '10') {
|
||||
this.$router.push({ path: `/control` })
|
||||
} else if (item.router == 'realTime') {
|
||||
|
||||
this.$router.push({ path: `/realTime` })
|
||||
|
||||
} else if (item.router != this.routerNow && !item.http) {
|
||||
this.$router.push({ name: item.router })
|
||||
}
|
||||
@ -207,23 +233,36 @@ export default {
|
||||
}
|
||||
},
|
||||
toRouter1(item) {
|
||||
console.log(item, 11, this.routerNow);
|
||||
if (item.router) {
|
||||
if (item.http) {
|
||||
window.location.href = item.http;
|
||||
} else if (item.router == 'formula' && this.$route.query.index != item.index) {
|
||||
|
||||
if (this.routerNow == 'realTime') {
|
||||
this.$router.push({ path: `/realTime?index=${item.index ? item.index : 1}` })
|
||||
} else if(this.routerNow == 'formula'){
|
||||
this.$router.push({ path: `/realTime?index=${item.index ? item.index : 1}&name=${item.deviceName}` })
|
||||
} else if (this.routerNow == 'formula') {
|
||||
this.$store.state.equipmentIndex = item.index
|
||||
this.$router.push({ path: `/formula?index=${item.index ? item.index : 1}` })
|
||||
} else if(this.routerNow == 'history'){
|
||||
} else if (this.routerNow == 'history') {
|
||||
this.$router.push({ path: `/history?index=${item.index ? item.index : 1}` })
|
||||
} else if(this.routerNow == 'dataAnalysis'){
|
||||
} else if (this.routerNow == 'dataAnalysis') {
|
||||
this.$router.push({ path: `/dataAnalysis?index=${item.index ? item.index : 1}` })
|
||||
} else if (item.router == 'formula') {
|
||||
this.$store.state.equipmentIndex = item.index
|
||||
if (item.deviceName == 10) {
|
||||
this.$router.push({ path: `/control` })
|
||||
} else if (item.deviceName == 1) {
|
||||
this.$router.push({ path: `/irrigateSet` })
|
||||
}
|
||||
}
|
||||
} else if (item.router != this.routerNow && !item.http) {
|
||||
} else if (item.router == 'formula' && this.$route.query.index == item.index) {
|
||||
|
||||
} else if (item.router != this.routerNow && !item.http) {
|
||||
this.$router.push({ name: item.router })
|
||||
}
|
||||
} else if (!item.deviceState) {
|
||||
this.$message('当前设备为离线状态');
|
||||
} else {
|
||||
this.$message('当前页面正在努力开发中');
|
||||
}
|
||||
|
||||
367
src/views/page/fan.vue
Normal file
367
src/views/page/fan.vue
Normal file
@ -0,0 +1,367 @@
|
||||
<template>
|
||||
<div class="skylight fan">
|
||||
<div class="table-title">
|
||||
<img src="../../assets/image/skylight.png" alt=""> 风机{{ indexs }}
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div class="input-btn">
|
||||
<div @click="changeOpen(1)" class="btn" :class="openIndex == 1 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet2.png" alt="" />自动运行
|
||||
</div>
|
||||
|
||||
<div @click="changeOpen(2)" class="btn" :class="openIndex == 2 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet3.png" alt="" />手动打开
|
||||
</div>
|
||||
<div @click="changeOpen(3)" class="btn" :class="openIndex == 3 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet1.png" alt="" />手动关闭
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div @click="changeIndexOpen(1)" class="btn" :class="actList1[1]=='1'?'blue':'off'">
|
||||
一号风组
|
||||
</div>
|
||||
<div @click="changeIndexOpen(2)" class="btn" :class="actList1[2]=='1'?'blue':'off'">
|
||||
二号风组
|
||||
</div>
|
||||
<div @click="changeIndexOpen(3)" class="btn" :class="actList1[3]=='1'?'blue':'off'">
|
||||
三号风组
|
||||
</div>
|
||||
<div @click="changeIndexOpen(4)" class="btn" :class="actList1[4]=='1'?'blue':'off'">
|
||||
四号风组
|
||||
</div>
|
||||
<div @click="changeIndexOpen(5)" class="btn" :class="actList1[5]=='1'?'blue':'off'">
|
||||
五号风组
|
||||
</div>
|
||||
</div>
|
||||
<div class="bold-title">通道输入信号类型</div>
|
||||
<div class="input-100-view">
|
||||
<span>风机控温宽度</span>
|
||||
<input @blur="blurChange10(21602, $event)" v-model="inputData[21602]" @input="changeCount10(21602, $event)"
|
||||
class="input-180" type="text" placeholder="0.0">
|
||||
<span>℃</span>
|
||||
</div>
|
||||
<div v-if="indexs==1" class="input-100-view">
|
||||
<div class="title">
|
||||
一号风机
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<span>室内1#平均温度大于</span>
|
||||
<input @blur="blurChangeCount(21603, $event)" v-model="inputData[21603]" @input="changeCountData(21603, $event)"
|
||||
class="input-140" type="text" placeholder="0.0">
|
||||
<span>℃启动</span>
|
||||
<div class="line"></div>
|
||||
<span>风机通道</span>
|
||||
<input @blur="blurChange(21604, $event)" v-model="inputData[21604]" @input="change(21604, $event)"
|
||||
class="input-100" type="text" placeholder="0.0">
|
||||
</div>
|
||||
<div v-if="indexs==2" class="input-100-view">
|
||||
<div class="title">
|
||||
二号风机
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<span>室内1#平均温度大于</span>
|
||||
<input @blur="blurChangeCount(21605, $event)" v-model="inputData[21605]" @input="changeCountData(21605, $event)"
|
||||
class="input-140" type="text" placeholder="0.0">
|
||||
<span>℃启动</span>
|
||||
<div class="line"></div>
|
||||
<span>风机通道</span>
|
||||
<input @blur="blurChange(21606, $event)" v-model="inputData[21606]" @input="change(21606, $event)"
|
||||
class="input-100" type="text" placeholder="0.0">
|
||||
</div>
|
||||
<div v-if="indexs==3" class="input-100-view">
|
||||
<div class="title">
|
||||
三号风机
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<span>室内1#平均温度大于</span>
|
||||
<input @blur="blurChangeCount(21607, $event)" v-model="inputData[21607]" @input="changeCountData(21607, $event)"
|
||||
class="input-140" type="text" placeholder="0.0">
|
||||
<span>℃启动</span>
|
||||
<div class="line"></div>
|
||||
<span>风机通道</span>
|
||||
<input @blur="blurChange(21608, $event)" v-model="inputData[21608]" @input="change(21608, $event)"
|
||||
class="input-100" type="text" placeholder="0.0">
|
||||
</div>
|
||||
<div v-if="indexs==4" class="input-100-view">
|
||||
<div class="title">
|
||||
四号风机
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<span>室内1#平均温度大于</span>
|
||||
<input @blur="blurChangeCount(21609, $event)" v-model="inputData[21609]" @input="changeCountData(21609, $event)"
|
||||
class="input-140" type="text" placeholder="0.0">
|
||||
<span>℃启动</span>
|
||||
<div class="line"></div>
|
||||
<span>风机通道</span>
|
||||
<input @blur="blurChange(21610, $event)" v-model="inputData[21610]" @input="change(21610, $event)"
|
||||
class="input-100" type="text" placeholder="0.0">
|
||||
</div>
|
||||
<div v-if="indexs==5" class="input-100-view margin-none">
|
||||
<div class="title">
|
||||
五号风机
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<span>室内1#平均温度大于</span>
|
||||
<input @blur="blurChangeCount(21611, $event)" v-model="inputData[21611]" @input="changeCountData(21611, $event)"
|
||||
class="input-140" type="text" placeholder="0.0">
|
||||
<span>℃启动</span>
|
||||
<div class="line"></div>
|
||||
<span>风机通道</span>
|
||||
<input @blur="blurChange(21612, $event)" v-model="inputData[21612]" @input="change(21612, $event)"
|
||||
class="input-100" type="text" placeholder="0.0">
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
indexs: 1,
|
||||
inputData: [],
|
||||
//有效性设置
|
||||
openIndex: 0,
|
||||
actList1:[],
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
$route(newVal, oldVal) {
|
||||
const that = this;
|
||||
this.indexs = this.$route.query.id ? this.$route.query.id : 1;
|
||||
// setTimeout(() => {
|
||||
// that.dataInit();
|
||||
// }, 0);
|
||||
},
|
||||
},
|
||||
|
||||
mounted() {
|
||||
const that = this;
|
||||
this.indexs = this.$route.query.id ? this.$route.query.id : 1;
|
||||
setTimeout(() => {
|
||||
that.dataInit();
|
||||
}, 0);
|
||||
//input获取焦点后全选
|
||||
let inputList = document.querySelectorAll('input');
|
||||
for (let index = 0; index < inputList.length; index++) {
|
||||
inputList[index].onfocus = this.selectValue;//input放入焦点，全选文本
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
padString(str, length) {
|
||||
return str.padStart(length, '0');
|
||||
},
|
||||
//开启几号风机
|
||||
changeIndexOpen(active){
|
||||
if (this.actList1[active] == '1') {
|
||||
this.actList1[active] = '0'
|
||||
} else {
|
||||
this.actList1[active] = '1'
|
||||
}
|
||||
this.$forceUpdate();
|
||||
var revList = this.actList1.slice().reverse()
|
||||
var num = revList.join("");
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: parseInt(num, 2),
|
||||
},
|
||||
};
|
||||
this.changeBtn('21601', dataNum);
|
||||
},
|
||||
//有效性修改
|
||||
changeOpen(index) {
|
||||
this.openIndex = index
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: this.openIndex,
|
||||
},
|
||||
};
|
||||
this.changeBtn(21600 + ((this.indexs - 1) * 11), dataNum);
|
||||
},
|
||||
//失去焦点 计算公式 x/10
|
||||
blurChange10(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value * 10,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
|
||||
},
|
||||
//反向计算 计算公式 x/10
|
||||
changeCount10(code, el) {
|
||||
var data = el.target.value * 10
|
||||
var sendData = {
|
||||
target: {
|
||||
value: data
|
||||
}
|
||||
}
|
||||
this.change(code, sendData)
|
||||
},
|
||||
// 计算展示值 计算公式 x/10
|
||||
countData10(data) {
|
||||
if (data) {
|
||||
return data / 10
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
//失去焦点 计算公式 (x-400) / 10
|
||||
blurChangeCount(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: (el.target.value * 10) + 400,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
|
||||
},
|
||||
//反向计算 计算公式 (x-400) / 10
|
||||
changeCountData(code, el) {
|
||||
var data = (el.target.value * 10) + 400
|
||||
var sendData = {
|
||||
target: {
|
||||
value: data
|
||||
}
|
||||
}
|
||||
this.change(code, sendData)
|
||||
},
|
||||
// 计算展示值 计算公式 (x-400) / 10
|
||||
countData(data) {
|
||||
if (data) {
|
||||
return (data - 400) / 10
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
getAct21601(){
|
||||
this.actList1=[]
|
||||
var num = this.inputData['21601']?this.inputData['21601']:0
|
||||
var num1 = this.padString(num.toString(2), 5)
|
||||
var openListNew
|
||||
openListNew = num1.split("")
|
||||
openListNew.forEach((el, index) => {
|
||||
this.actList1.push(openListNew[openListNew.length - index - 1])
|
||||
})
|
||||
},
|
||||
dataInit() {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
|
||||
};
|
||||
this.api.getReadControlliShuiControl(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.inputData = res.data.data;
|
||||
this.openIndex = this.inputData[21600]
|
||||
this.getAct21601()
|
||||
this.inputData[21603] = this.countData(this.inputData[21603])
|
||||
this.inputData[21605] = this.countData(this.inputData[21605])
|
||||
this.inputData[21607] = this.countData(this.inputData[21607])
|
||||
this.inputData[21609] = this.countData(this.inputData[21609])
|
||||
this.inputData[21611] = this.countData(this.inputData[21611])
|
||||
this.inputData[21602] = this.countData10(this.inputData[21602])
|
||||
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
//全选文本
|
||||
selectValue(e) {
|
||||
e.currentTarget.select();
|
||||
},
|
||||
//失去焦点
|
||||
blurChange(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
|
||||
},
|
||||
changeBtn(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
};
|
||||
this.delayTimerBtn(0, data);
|
||||
},
|
||||
//切换btn的限制 写入停止后j*100毫秒调取函数
|
||||
delayTimerBtn(i, data) {
|
||||
const that = this;
|
||||
//整体接口
|
||||
let j = this.$store.state.lateSendBtn;
|
||||
//避免开启多个计时器
|
||||
this.timer && clearInterval(this.timer);
|
||||
|
||||
this.timer = setInterval(() => {
|
||||
++i;
|
||||
if (i == j) {
|
||||
that.changeData(data);
|
||||
clearInterval(this.timer);
|
||||
}
|
||||
}, 100);
|
||||
},
|
||||
change(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
};
|
||||
this.delayTimer(0, data);
|
||||
},
|
||||
//限制 写入停止后j*100毫秒调取函数
|
||||
delayTimer(i, data) {
|
||||
const that = this;
|
||||
//整体接口
|
||||
let j = this.$store.state.lateSend;
|
||||
//避免开启多个计时器
|
||||
this.timer && clearInterval(this.timer);
|
||||
|
||||
this.timer = setInterval(() => {
|
||||
++i;
|
||||
if (i == j) {
|
||||
that.changeData(data);
|
||||
clearInterval(this.timer);
|
||||
}
|
||||
}, 100);
|
||||
},
|
||||
changeData(data) {
|
||||
this.api.postControlWrite(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.$message({
|
||||
message: res.data.msg,
|
||||
type: "success",
|
||||
});
|
||||
this.dataInit();
|
||||
} else {
|
||||
this.$message.error("请求出错");
|
||||
}
|
||||
this.timer = null
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
<style lang="scss"></style>
|
||||
|
||||
@ -72,13 +72,16 @@ export default {
|
||||
indexs: 1,
|
||||
player: null,
|
||||
url: '',
|
||||
timer:null
|
||||
timer:null,
|
||||
deviceName:1,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
$route(newVal, oldVal) {
|
||||
const that = this;
|
||||
this.indexs = this.$route.query.index ? this.$route.query.index : 1;
|
||||
const store=this.$store.state
|
||||
this.indexs = this.$route.query.index ? this.$route.query.index : store.equipmentIndex;
|
||||
this.deviceName =store.equipmentList[this.indexs - 1].deviceName
|
||||
setTimeout(() => {
|
||||
that.dataInit();
|
||||
}, 0);
|
||||
@ -86,11 +89,11 @@ export default {
|
||||
},
|
||||
mounted() {
|
||||
const that = this;
|
||||
this.indexs = this.$route.query.index ? this.$route.query.index : 1;
|
||||
|
||||
const store=this.$store.state
|
||||
this.indexs = this.$route.query.index ? this.$route.query.index : store.equipmentIndex;
|
||||
this.deviceName =store.equipmentList[this.indexs - 1].deviceName
|
||||
// this.getTime()
|
||||
|
||||
|
||||
setTimeout(() => {
|
||||
that.dataInit();
|
||||
that.timer&&clearInterval(that.timer)
|
||||
@ -160,7 +163,8 @@ export default {
|
||||
// // regNum: 73,
|
||||
// };
|
||||
var list = store.typeList
|
||||
this.api.postRtdata(equipmentId).then((res) => {
|
||||
if(this.deviceName==1){
|
||||
this.api.postRtdata(equipmentId).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.inputData = res.data.data;
|
||||
this.list=[]
|
||||
@ -237,6 +241,86 @@ export default {
|
||||
this.createVideo()
|
||||
}
|
||||
})
|
||||
}else if(this.deviceName==10){
|
||||
this.api.getControlRtdata(equipmentId).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.inputData = res.data.data;
|
||||
this.list=[]
|
||||
this.inputData.forEach((el,index)=>{
|
||||
list.forEach((el1,index1)=>{
|
||||
if(el.formula==el1.value){
|
||||
var num=0
|
||||
var name=''
|
||||
// if(el1.countType==1){
|
||||
// num=this.countType1(el.environmentData)+el1.unit
|
||||
// }else if(el1.countType==2){
|
||||
// num=this.countType2(el.environmentData)+el1.unit
|
||||
// }else if(el1.countType==3){
|
||||
// num=this.countType3(el.environmentData)+el1.unit
|
||||
// }else{
|
||||
num=el.environmentData+el1.unit
|
||||
// }
|
||||
if(el.equipmentNumber==0){
|
||||
if(el.targetValue==1){
|
||||
name='目标'+el.environmentDataId
|
||||
}else{
|
||||
name='1#平均'+el.environmentDataId
|
||||
}
|
||||
}else if(el.equipmentNumber==15){
|
||||
if(el.targetValue==1){
|
||||
name='目标'+el.environmentDataId
|
||||
}else{
|
||||
name='2#平均'+el.environmentDataId
|
||||
}
|
||||
}else{
|
||||
name=el.equipmentNumber+'#'+el.environmentDataId
|
||||
}
|
||||
|
||||
this.list.push({
|
||||
...el,
|
||||
name:name,
|
||||
num: num,
|
||||
img: require(`../../assets/image/real-time-${el.formula}.png`)
|
||||
|
||||
})
|
||||
|
||||
}
|
||||
})
|
||||
})
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
});
|
||||
var data1 = store.equipmentList[this.indexs - 1].deviceId
|
||||
|
||||
this.api.getControlFsdata(data1).then(res => {
|
||||
if (res.data.code == 200) {
|
||||
var chartsData=res.data.data
|
||||
realTimeLine('realTime-line',chartsData)
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
})
|
||||
var nowDevice = store.equipmentList[this.indexs - 1]
|
||||
var data2={
|
||||
cameraid:nowDevice.cameraSerialNumber,
|
||||
channelid:nowDevice.cameraChannelNumber
|
||||
}
|
||||
|
||||
//当前没有设备 默认写死 后续有数据需要改回去
|
||||
// var data2 = {
|
||||
// cameraid: 'L18357958',
|
||||
// channelid: '1'
|
||||
// }
|
||||
this.api.getGethls(data2).then(res => {
|
||||
console.log(res.data, 11);
|
||||
if (res.data.code == 200) {
|
||||
this.url = res.data.msg
|
||||
this.createVideo()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
getTime() {
|
||||
this.time = getnowtime()
|
||||
|
||||
389
src/views/page/sensorSet-con.vue
Normal file
389
src/views/page/sensorSet-con.vue
Normal file
@ -0,0 +1,389 @@
|
||||
<template>
|
||||
<div class="irrigateSet sensorSet">
|
||||
<div class="table-title">
|
||||
<img src="../../assets/image/sensor.png" alt=""> 传感器配置界面
|
||||
</div>
|
||||
<div class="sensor-view">
|
||||
<div class="left scroll">
|
||||
<div @click="toIndex(index)" :class="active == index ? 'active' : ''" v-for="item, index in 48"
|
||||
:key="index">
|
||||
<div>
|
||||
{{ index + 1 }}#传感器通道
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="right-top">
|
||||
<div class="right-sel">
|
||||
<div @click="changeOpen(active)">
|
||||
<div v-if="getOpenTrue(active)" class="no-sel"></div>
|
||||
<div v-else class="sel"></div>
|
||||
有效性
|
||||
</div>
|
||||
</div>
|
||||
<div class="input-sel">
|
||||
<div class="title">专感器类型</div>
|
||||
<el-dropdown @command="handleCommand">
|
||||
<div class="el-dropdown-link">
|
||||
<input v-model="sensorType" type="text" class="input-input" placeholder="选择传感器类型">
|
||||
<div class="arrow"><img src="../../assets/image/arrow.png" alt=""></div>
|
||||
</div>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item v-for="item, index in typeList" :key="index" :command="item.value">{{
|
||||
item.label }}</el-dropdown-item>
|
||||
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</div>
|
||||
<!-- <div class="right-sel">
|
||||
<div @click="sel2 = !sel2">
|
||||
<div v-if="!sel2" class="no-sel"></div>
|
||||
<div v-else class="sel"></div>
|
||||
通讯类传感器
|
||||
</div>
|
||||
<div @click="sel3 = !sel3">
|
||||
<div v-if="!sel3" class="no-sel"></div>
|
||||
<div v-else class="sel"></div>
|
||||
模拟量传感器
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="right-bottom">
|
||||
<div>
|
||||
<div class="input-main">
|
||||
<div>标定低点AD值</div>
|
||||
<input @blur="blurChange(20904 + (active * 5 + 1), $event)"
|
||||
v-model="inputData[20904 + (active * 5 + 1)]"
|
||||
@input="change(20904 + (active * 5 + 1), $event)" type="number" placeholder="0.0">
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<div>标定低点数据</div>
|
||||
<input @blur="blurChange(20904 + (active * 5 + 2), $event)"
|
||||
v-model="inputData[20904 + (active * 5 + 2)]"
|
||||
@input="change(20904 + (active * 5 + 2), $event)" type="number" placeholder="0.0">
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="input-main">
|
||||
<div>标定高点AD值</div>
|
||||
<input @blur="blurChange(20904 + (active * 5 + 3), $event)"
|
||||
v-model="inputData[20904 + (active * 5 + 3)]"
|
||||
@input="change(20904 + (active * 5 + 3), $event)" type="number" placeholder="0.0">
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<div>标定高点数据</div>
|
||||
<input @blur="blurChange(20904 + (active * 5 + 4), $event)"
|
||||
v-model="inputData[20904 + (active * 5 + 4)]"
|
||||
@input="change(20904 + (active * 5 + 4), $event)" type="number" placeholder="0.0">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sensor-type">
|
||||
<div class="sensor-title">通道输入信号类型</div>
|
||||
<div class="sensor-type-div" v-for="item, index in openTypeList" :key="index">
|
||||
<div class="name">第{{ index+1 }}通道</div>
|
||||
<div class="sensor-sel">
|
||||
<div>
|
||||
<div @click="changeTypeOpen(index, '0')" :class="item == '1' ? 'no-sel' : 'sel'"></div>
|
||||
485通讯类型的传感器
|
||||
</div>
|
||||
<div>
|
||||
<div @click="changeTypeOpen(index, '1')" :class="item == '0' ? 'no-sel' : 'sel'"></div>
|
||||
4-20ma模拟量类型的传感器
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
active: 0,
|
||||
sel1: true,
|
||||
sel2: false,
|
||||
sel3: false,
|
||||
inputData: [],
|
||||
sensorType: '',//当前传感器类型
|
||||
openList1: [],//当前有效的传感器
|
||||
openList2: [],//当前有效的传感器
|
||||
openList3: [],//当前有效的传感器
|
||||
openTypeList: [],//八个通道输入信号的类型
|
||||
typeList: this.$store.state.typeList
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'active'(newVal, oldVal) {
|
||||
this.getSensorType()
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.dataInit()
|
||||
//input获取焦点后全选
|
||||
let inputList = document.querySelectorAll('input');
|
||||
for (let index = 0; index < inputList.length; index++) {
|
||||
inputList[index].onfocus = this.selectValue;//input放入焦点，全选文本
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
//类型选择
|
||||
handleCommand(command) {
|
||||
this.typeList.forEach((el, index) => {
|
||||
if (el.value == command) {
|
||||
this.sensorType = el.label
|
||||
}
|
||||
})
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: command,
|
||||
},
|
||||
};
|
||||
this.changeBtn(20904 + (this.active * 5), dataNum);
|
||||
},
|
||||
getSensorType() {
|
||||
this.typeList.forEach((el, index) => {
|
||||
if (el.value == this.inputData[20904 + (this.active * 5)]) {
|
||||
this.sensorType = el.label
|
||||
}
|
||||
})
|
||||
},
|
||||
toIndex(index) {
|
||||
this.active = index
|
||||
},
|
||||
padString(str, length) {
|
||||
return str.padStart(length, '0');
|
||||
},
|
||||
changeOpen(active) {
|
||||
if (active >= 0 && active < 16) {
|
||||
if (this.openList1[active] == '1') {
|
||||
this.openList1[active] = '0'
|
||||
} else {
|
||||
this.openList1[active] = '1'
|
||||
}
|
||||
var revList = this.openList1.slice().reverse()
|
||||
var num = revList.join("");
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: parseInt(num, 2),
|
||||
},
|
||||
};
|
||||
this.changeBtn('20901', dataNum);
|
||||
} else if (active >= 16 && active < 32) {
|
||||
if (this.openList2[active - 16] == '1') {
|
||||
this.openList2[active - 16] = '0'
|
||||
} else {
|
||||
this.openList2[active - 16] = '1'
|
||||
}
|
||||
var revList = this.openList2.slice().reverse()
|
||||
var num = revList.join("");
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: parseInt(num, 2),
|
||||
},
|
||||
};
|
||||
this.changeBtn('20902', dataNum);
|
||||
} else if (active >= 32 && active < 48) {
|
||||
if (this.openList3[active - 32] == '1') {
|
||||
this.openList3[active - 32] = '0'
|
||||
} else {
|
||||
this.openList3[active - 32] = '1'
|
||||
}
|
||||
var revList = this.openList3.slice().reverse()
|
||||
var num = revList.join("");
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: parseInt(num, 2),
|
||||
},
|
||||
};
|
||||
this.changeBtn('20903', dataNum);
|
||||
}
|
||||
this.$forceUpdate();
|
||||
},
|
||||
changeTypeOpen(index, num) {
|
||||
this.openTypeList[index] = num
|
||||
this.$forceUpdate();
|
||||
var openTypeList = this.openTypeList.slice().reverse()
|
||||
var num = openTypeList.join("");
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: parseInt(num, 2),
|
||||
},
|
||||
};
|
||||
this.changeBtn('20900', dataNum);
|
||||
},
|
||||
getTypeOpen(active) {
|
||||
if (this.openTypeList[active] == '1') {
|
||||
return true
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
},
|
||||
getOpenTrue(active) {
|
||||
if (active >= 0 && active < 16) {
|
||||
if (this.openList1[active] == '1') {
|
||||
return false
|
||||
} else {
|
||||
return true
|
||||
}
|
||||
} else if (active >= 16 && active < 32) {
|
||||
if (this.openList2[active - 16] == '1') {
|
||||
return false
|
||||
} else {
|
||||
return true
|
||||
}
|
||||
} else if (active >= 32 && active < 48) {
|
||||
if (this.openList3[active - 32] == '1') {
|
||||
return false
|
||||
} else {
|
||||
return true
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
getOpen() {
|
||||
this.openList1 = []
|
||||
this.openList2 = []
|
||||
this.openList3 = []
|
||||
var num1 = this.inputData['20901']
|
||||
var num11 = this.padString(num1.toString(2), 16)
|
||||
var openList1New
|
||||
openList1New = num11.split("")
|
||||
openList1New.forEach((el, index) => {
|
||||
this.openList1.push(openList1New[openList1New.length - index - 1])
|
||||
})
|
||||
|
||||
var num2 = this.inputData['20902']
|
||||
var num22 = this.padString(num2.toString(2), 16)
|
||||
var openList2New
|
||||
openList2New = num22.split("")
|
||||
openList2New.forEach((el, index) => {
|
||||
this.openList2.push(openList2New[openList2New.length - index - 1])
|
||||
})
|
||||
|
||||
var num3 = this.inputData['20903']
|
||||
var num33 = this.padString(num3.toString(2), 16)
|
||||
var openList3New
|
||||
openList3New = num33.split("")
|
||||
openList3New.forEach((el, index) => {
|
||||
this.openList3.push(openList3New[openList3New.length - index - 1])
|
||||
})
|
||||
|
||||
this.openTypeList = []
|
||||
var num4 = this.inputData['20900']
|
||||
var num44 = this.padString(num4.toString(2), 8)
|
||||
var openList4New
|
||||
openList4New = num44.split("")
|
||||
openList4New.forEach((el, index) => {
|
||||
this.openTypeList.push(openList4New[openList4New.length - index - 1])
|
||||
})
|
||||
},
|
||||
dataInit() {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
|
||||
};
|
||||
this.api.getReadControlSensorChannel(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.inputData = res.data.data;
|
||||
// this.getData272()
|
||||
this.getOpen()
|
||||
this.getSensorType()
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
//全选文本
|
||||
selectValue(e) {
|
||||
e.currentTarget.select();
|
||||
},
|
||||
//失去焦点
|
||||
blurChange(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
|
||||
},
|
||||
changeBtn(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
};
|
||||
this.delayTimerBtn(0, data);
|
||||
},
|
||||
//切换btn的限制 写入停止后j*100毫秒调取函数
|
||||
delayTimerBtn(i, data) {
|
||||
const that = this;
|
||||
//整体接口
|
||||
let j = this.$store.state.lateSendBtn;
|
||||
//避免开启多个计时器
|
||||
this.timer && clearInterval(this.timer);
|
||||
|
||||
this.timer = setInterval(() => {
|
||||
++i;
|
||||
if (i == j) {
|
||||
that.changeData(data);
|
||||
clearInterval(this.timer);
|
||||
}
|
||||
}, 100);
|
||||
},
|
||||
change(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
};
|
||||
this.delayTimer(0, data);
|
||||
},
|
||||
//限制 写入停止后j*100毫秒调取函数
|
||||
delayTimer(i, data) {
|
||||
const that = this;
|
||||
//整体接口
|
||||
let j = this.$store.state.lateSend;
|
||||
//避免开启多个计时器
|
||||
this.timer && clearInterval(this.timer);
|
||||
|
||||
this.timer = setInterval(() => {
|
||||
++i;
|
||||
if (i == j) {
|
||||
that.changeData(data);
|
||||
clearInterval(this.timer);
|
||||
}
|
||||
}, 100);
|
||||
},
|
||||
changeData(data) {
|
||||
this.api.postControlWrite(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.$message({
|
||||
message: res.data.msg,
|
||||
type: "success",
|
||||
});
|
||||
this.dataInit();
|
||||
} else {
|
||||
this.$message.error("请求出错");
|
||||
}
|
||||
this.timer = null
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
<style lang="scss"></style>
|
||||
|
||||
331
src/views/page/skylight.vue
Normal file
331
src/views/page/skylight.vue
Normal file
@ -0,0 +1,331 @@
|
||||
<template>
|
||||
<div class="skylight">
|
||||
<div class="table-title">
|
||||
<img src="../../assets/image/skylight.png" alt=""> 顶卷膜{{ indexs }}
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div class="input-btn">
|
||||
<div class="btn" @click="changeOpen(1)" :class="openIndex == 1 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet2.png" alt="" />自动运行
|
||||
</div>
|
||||
<div class="btn" @click="changeOpen(2)" :class="openIndex == 2 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet1.png" alt="" />手动关闭
|
||||
</div>
|
||||
<div class="btn" @click="changeOpen(3)" :class="openIndex == 3 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet3.png" alt="" />手动打开
|
||||
</div>
|
||||
<div class="btn" @click="changeOpen(4)" :class="openIndex == 4 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet1.png" alt="" />停止
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div class="input-sel">
|
||||
<div class="title">温度选择</div>
|
||||
<el-dropdown @command="handleCommand">
|
||||
<div class="el-dropdown-link">
|
||||
<input v-model="TypeSel" type="text" class="input-input" placeholder="温度选择">
|
||||
<div class="arrow"><img src="../../assets/image/arrow.png" alt=""></div>
|
||||
</div>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item v-for="item, index in typeSelList" :key="index"
|
||||
:command="index">{{ item.name }}</el-dropdown-item>
|
||||
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<div>控温宽度</div>
|
||||
<input @blur="blurChange(21614 + ((indexs - 1) * 11), $event)" v-model="inputData[21614 + ((indexs - 1) * 11)]"
|
||||
@input="change(21614 + ((indexs - 1) * 11), $event)" type="number" placeholder="0.0">
|
||||
<span>℃</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="input-100-view">
|
||||
<div class="title">
|
||||
①室内温度 >
|
||||
</div>
|
||||
<input
|
||||
@blur="blurChangeCount(21615 + ((indexs - 1) * 11), $event)"
|
||||
v-model="inputData[21615 + ((indexs - 1) * 11)]"
|
||||
@input="changeCountData(21615 + ((indexs - 1) * 11), $event)"
|
||||
class="input-140" type="text" placeholder="0.0">
|
||||
<span>℃，打开</span>
|
||||
<input
|
||||
@blur="blurChange(21616 + ((indexs - 1) * 11), $event)"
|
||||
v-model="inputData[21616 + ((indexs - 1) * 11)]"
|
||||
@input="change(21616 + ((indexs - 1) * 11), $event)"
|
||||
class="input-140" type="text" placeholder="0">
|
||||
<span>%</span>
|
||||
</div>
|
||||
<div class="input-100-view">
|
||||
<div class="title">
|
||||
②室内温度 >
|
||||
</div>
|
||||
<input
|
||||
@blur="blurChangeCount(21617 + ((indexs - 1) * 11), $event)"
|
||||
v-model="inputData[21617 + ((indexs - 1) * 11)]"
|
||||
@input="changeCountData(21617 + ((indexs - 1) * 11), $event)"
|
||||
class="input-140" type="text" placeholder="0.0">
|
||||
<span>℃，打开</span>
|
||||
<input
|
||||
@blur="blurChange(21618 + ((indexs - 1) * 11), $event)" v-model="inputData[21618 + ((indexs - 1) * 11)]"
|
||||
@input="change(21618 + ((indexs - 1) * 11), $event)"
|
||||
class="input-140" type="text" placeholder="0">
|
||||
<span>%</span>
|
||||
</div>
|
||||
<div class="input-100-view margin-none">
|
||||
<div class="title">
|
||||
③室内温度 >
|
||||
</div>
|
||||
<input
|
||||
@blur="blurChangeCount(21619 + ((indexs - 1) * 11), $event)"
|
||||
v-model="inputData[21619 + ((indexs - 1) * 11)]"
|
||||
@input="changeCountData(21619 + ((indexs - 1) * 11), $event)"
|
||||
class="input-140" type="text" placeholder="0.0">
|
||||
<span>℃，打开</span>
|
||||
<input
|
||||
@blur="blurChange(21620 + ((indexs - 1) * 11), $event)" v-model="inputData[21620 + ((indexs - 1) * 11)]"
|
||||
@input="change(21620 + ((indexs - 1) * 11), $event)"
|
||||
class="input-140" type="text" placeholder="0">
|
||||
<span>%</span>
|
||||
</div>
|
||||
<div class="flex-view padding-none">
|
||||
<div class="input-main">
|
||||
<div>全程运行时间</div>
|
||||
<input @blur="blurChange(21621 + ((indexs - 1) * 11), $event)" v-model="inputData[21621 + ((indexs - 1) * 11)]"
|
||||
@input="change(21621 + ((indexs - 1) * 11), $event)" type="number" placeholder="0.0">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view padding-none">
|
||||
<div class="input-main">
|
||||
<div>打开通道</div>
|
||||
<input @blur="blurChange(21622 + ((indexs - 1) * 11), $event)" v-model="inputData[21622 + ((indexs - 1) * 11)]"
|
||||
@input="change(21622 + ((indexs - 1) * 11), $event)" type="number" placeholder="0.0">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view padding-none">
|
||||
<div class="input-main">
|
||||
<div>关闭通道</div>
|
||||
<input @blur="blurChange(21623 + ((indexs - 1) * 11), $event)" v-model="inputData[21623 + ((indexs - 1) * 11)]"
|
||||
@input="change(21623 + ((indexs - 1) * 11), $event)" type="number" placeholder="0.0">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
indexs: 1,
|
||||
//类型选择
|
||||
TypeSel: '',
|
||||
TypeSelIndex: -1,
|
||||
//页面数据
|
||||
inputData: [],
|
||||
//选择内容
|
||||
typeSelList: [{ name: '1#平均空气温度', value: 1, },
|
||||
{ name: '2#平均空气温度', value: 2, },
|
||||
{ name: '1#空气温度', value: 3, },
|
||||
{ name: '2#空气温度', value: 4, },
|
||||
{ name: '3#空气温度', value: 5, },
|
||||
{ name: '4#空气温度', value: 6, },
|
||||
{ name: '5#空气温度', value: 7, },
|
||||
{ name: '6#空气温度', value: 8, },
|
||||
{ name: '7#空气温度', value: 9, },
|
||||
{ name: '8#空气温度', value: 10, },],
|
||||
//有效性设置
|
||||
openIndex: 0,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
$route(newVal, oldVal) {
|
||||
const that = this;
|
||||
this.indexs = this.$route.query.id ? this.$route.query.id : 1;
|
||||
setTimeout(() => {
|
||||
that.getNowData();
|
||||
}, 0);
|
||||
},
|
||||
},
|
||||
|
||||
mounted() {
|
||||
const that = this;
|
||||
this.indexs = this.$route.query.id ? this.$route.query.id : 1;
|
||||
setTimeout(() => {
|
||||
that.dataInit();
|
||||
}, 0);
|
||||
//input获取焦点后全选
|
||||
let inputList = document.querySelectorAll('input');
|
||||
for (let index = 0; index < inputList.length; index++) {
|
||||
inputList[index].onfocus = this.selectValue;//input放入焦点，全选文本
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
padString(str, length) {
|
||||
return str.padStart(length, '0');
|
||||
},
|
||||
changeOpen(index) {
|
||||
this.openIndex = index
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: this.openIndex,
|
||||
},
|
||||
};
|
||||
this.changeBtn(21613 + ((this.indexs - 1) * 11), dataNum);
|
||||
},
|
||||
//类型选择
|
||||
handleCommand(index) {
|
||||
this.TypeSel = this.typeSelList[index].name
|
||||
this.TypeSelIndex = this.typeSelList[index].value
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: this.TypeSelIndex,
|
||||
},
|
||||
};
|
||||
this.changeBtn(21657 + (this.indexs - 1), dataNum);
|
||||
},
|
||||
//失去焦点
|
||||
blurChangeCount(code, el) {
|
||||
var store=this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex-1].deviceId,
|
||||
regAddress: code,
|
||||
num:( el.target.value*10)+400,
|
||||
}; //避免开启多个计时器
|
||||
if(this.timer){
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
|
||||
},
|
||||
changeCountData(code,el){
|
||||
var data=(el.target.value*10)+400
|
||||
var sendData={
|
||||
target:{
|
||||
value:data
|
||||
}
|
||||
}
|
||||
this.change(code,sendData)
|
||||
},
|
||||
countData(data){
|
||||
if(data){
|
||||
return (data-400)/10
|
||||
}else{
|
||||
return 0
|
||||
}
|
||||
},
|
||||
dataInit() {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
|
||||
};
|
||||
this.api.getReadControlliShuiControl(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.inputData = res.data.data;
|
||||
this.getNowData()
|
||||
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
//获取当前页面的参数
|
||||
getNowData(){
|
||||
this.openIndex= this.inputData[21613 + ((this.indexs - 1) * 11)]
|
||||
this.inputData[21615 + ((this.indexs - 1) * 11)]=this.countData(this.inputData[21615 + ((this.indexs - 1) * 11)])
|
||||
this.inputData[21617 + ((this.indexs - 1) * 11)]=this.countData(this.inputData[21617 + ((this.indexs - 1) * 11)])
|
||||
this.inputData[21619 + ((this.indexs - 1) * 11)]=this.countData(this.inputData[21619 + ((this.indexs - 1) * 11)])
|
||||
},
|
||||
//全选文本
|
||||
selectValue(e) {
|
||||
e.currentTarget.select();
|
||||
},
|
||||
//失去焦点
|
||||
blurChange(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
|
||||
},
|
||||
changeBtn(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
};
|
||||
this.delayTimerBtn(0, data);
|
||||
},
|
||||
//切换btn的限制 写入停止后j*100毫秒调取函数
|
||||
delayTimerBtn(i, data) {
|
||||
const that = this;
|
||||
//整体接口
|
||||
let j = this.$store.state.lateSendBtn;
|
||||
//避免开启多个计时器
|
||||
this.timer && clearInterval(this.timer);
|
||||
|
||||
this.timer = setInterval(() => {
|
||||
++i;
|
||||
if (i == j) {
|
||||
that.changeData(data);
|
||||
clearInterval(this.timer);
|
||||
}
|
||||
}, 100);
|
||||
},
|
||||
change(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
};
|
||||
this.delayTimer(0, data);
|
||||
},
|
||||
//限制 写入停止后j*100毫秒调取函数
|
||||
delayTimer(i, data) {
|
||||
const that = this;
|
||||
//整体接口
|
||||
let j = this.$store.state.lateSend;
|
||||
//避免开启多个计时器
|
||||
this.timer && clearInterval(this.timer);
|
||||
|
||||
this.timer = setInterval(() => {
|
||||
++i;
|
||||
if (i == j) {
|
||||
that.changeData(data);
|
||||
clearInterval(this.timer);
|
||||
}
|
||||
}, 100);
|
||||
},
|
||||
changeData(data) {
|
||||
this.api.postControlWrite(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.$message({
|
||||
message: res.data.msg,
|
||||
type: "success",
|
||||
});
|
||||
this.dataInit();
|
||||
} else {
|
||||
this.$message.error("请求出错");
|
||||
}
|
||||
this.timer = null
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
<style lang="scss"></style>
|
||||
|
||||
508
src/views/page/upload-con.vue
Normal file
508
src/views/page/upload-con.vue
Normal file
@ -0,0 +1,508 @@
|
||||
<template>
|
||||
<div class=" irrigateSet upload">
|
||||
<div class="table-title">
|
||||
<img src="../../assets/image/upload.png" alt=""> 数据上传
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div class="input-main">
|
||||
<span>环境数据上传时间</span>
|
||||
<input v-model="inputData['21500']" @input="change('21500', $event)" type="number" placeholder="0">
|
||||
<span>秒</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="flex-view border-none">
|
||||
<div class="upload-view">
|
||||
<div class="page-title upload-title">
|
||||
气象站
|
||||
</div>
|
||||
<div class="upload-content">
|
||||
<div @click="selList1(index)" v-for="item, index in list1" :key="index">
|
||||
<div v-if="actList1.indexOf(index) == -1" class="no-sel"></div>
|
||||
<div v-else class="sel"></div>
|
||||
{{ item }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="upload-view">
|
||||
<div class="page-title upload-title">
|
||||
平均值
|
||||
</div>
|
||||
<div class="upload-content">
|
||||
<div @click="selList2(index)" v-for="item, index in list2" :key="index">
|
||||
<div v-if="actList2.indexOf(index) == -1" class="no-sel"></div>
|
||||
<div v-else class="sel"></div>
|
||||
{{ item }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="upload-view">
|
||||
<div class="page-title upload-title">
|
||||
目标值
|
||||
</div>
|
||||
<div class="upload-content upload-content1 ">
|
||||
<div @click="selList3(index)" v-for="item, index in list3" :key="index">
|
||||
<div v-if="actList3.indexOf(index) == -1" class="no-sel"></div>
|
||||
<div v-else class="sel"></div>
|
||||
{{ item }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="upload-view">
|
||||
<div class="page-title upload-title">
|
||||
通道传感器1-16
|
||||
</div>
|
||||
<div class="upload-content">
|
||||
<div @click="selList4(index)" v-for="item, index in list4" :key="index">
|
||||
<div v-if="actList4.indexOf(index) == -1" class="no-sel"></div>
|
||||
<div v-else class="sel"></div>
|
||||
{{ item }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="upload-view">
|
||||
<div class="page-title upload-title">
|
||||
通道传感器17-32
|
||||
</div>
|
||||
<div class="upload-content">
|
||||
<div @click="selList5(index)" v-for="item, index in list5" :key="index">
|
||||
<div v-if="actList5.indexOf(index) == -1" class="no-sel"></div>
|
||||
<div v-else class="sel"></div>
|
||||
{{ item }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="upload-view">
|
||||
<div class="page-title upload-title">
|
||||
通道传感器33-48
|
||||
</div>
|
||||
<div class="upload-content">
|
||||
<div @click="selList6(index)" v-for="item, index in list6" :key="index">
|
||||
<div v-if="actList6.indexOf(index) == -1" class="no-sel"></div>
|
||||
<div v-else class="sel"></div>
|
||||
{{ item }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
//气象站数据
|
||||
actList1: [],
|
||||
actList1New: [],
|
||||
list1: ['室外平均温度传感器',
|
||||
'室外平均湿度传感器',
|
||||
'室外平均光照传感器',
|
||||
'室外平均风速传感器',
|
||||
'室外平均风向传感器',
|
||||
'室外平均雨雪传感器',
|
||||
'室外平均雨量传感器',
|
||||
'气象站电池电压(V)',
|
||||
'气象站信号强度(RSSI)',
|
||||
'气象站信噪比(SNR)',
|
||||
'室外平均露点温度',
|
||||
'室外平均C02传感器',
|
||||
'室外平均土温传感器',
|
||||
'室外平均土湿传感器'],
|
||||
|
||||
//平均值数据
|
||||
actList2: [],
|
||||
actList2New: [],
|
||||
list2: ['目标水肥PH数据',
|
||||
'目标水肥EC数据',
|
||||
'平均水肥PH数据',
|
||||
'平均水肥EC数据',
|
||||
'1#水肥PH数据',
|
||||
'1#水肥EC数据',
|
||||
'2#水肥PH数据',
|
||||
'2#水肥EC数据',
|
||||
'1#通道传感器数据',
|
||||
'2#通道传感器数据',
|
||||
'3#通道传感器数据',
|
||||
'4#通道传感器数据',
|
||||
'5#通道传感器数据',
|
||||
'6#通道传感器数据'],
|
||||
//目标值数据
|
||||
actList3: [],
|
||||
actList3New: [],
|
||||
list3: ['目标温度传感器1',
|
||||
'目标温度传感器2',
|
||||
'目标湿度传感器1',
|
||||
'目标湿度传感器2',
|
||||
'目标CO2传感器1',],
|
||||
//传感器1-16
|
||||
actList4: [],
|
||||
actList4New: [],
|
||||
list4: ['通道传感器1',
|
||||
'通道传感器2',
|
||||
'通道传感器3',
|
||||
'通道传感器4',
|
||||
'通道传感器5',
|
||||
'通道传感器6',
|
||||
'通道传感器7',
|
||||
'通道传感器8',
|
||||
'通道传感器9',
|
||||
'通道传感器10',
|
||||
'通道传感器11',
|
||||
'通道传感器12',
|
||||
'通道传感器13',
|
||||
'通道传感器14',
|
||||
'通道传感器15',
|
||||
'通道传感器16',],
|
||||
//传感器17-32
|
||||
actList5: [],
|
||||
actList5New: [],
|
||||
list5: ['通道传感器17',
|
||||
'通道传感器18',
|
||||
'通道传感器19',
|
||||
'通道传感器20',
|
||||
'通道传感器21',
|
||||
'通道传感器22',
|
||||
'通道传感器23',
|
||||
'通道传感器24',
|
||||
'通道传感器25',
|
||||
'通道传感器26',
|
||||
'通道传感器27',
|
||||
'通道传感器28',
|
||||
'通道传感器29',
|
||||
'通道传感器30',
|
||||
'通道传感器31',
|
||||
'通道传感器32',],
|
||||
//传感器32-48
|
||||
actList6: [],
|
||||
actList6New: [],
|
||||
list6: ['通道传感器33',
|
||||
'通道传感器34',
|
||||
'通道传感器35',
|
||||
'通道传感器36',
|
||||
'通道传感器37',
|
||||
'通道传感器38',
|
||||
'通道传感器39',
|
||||
'通道传感器40',
|
||||
'通道传感器41',
|
||||
'通道传感器42',
|
||||
'通道传感器43',
|
||||
'通道传感器44',
|
||||
'通道传感器45',
|
||||
'通道传感器46',
|
||||
'通道传感器47',
|
||||
'通道传感器48',],
|
||||
inputData: [],
|
||||
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.dataInit()
|
||||
//input获取焦点后全选
|
||||
let inputList = document.querySelectorAll('input');
|
||||
for (let index = 0; index < inputList.length; index++) {
|
||||
inputList[index].onfocus = this.selectValue;//input放入焦点，全选文本
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
padString(str, length) {
|
||||
return str.padStart(length, '0');
|
||||
},
|
||||
//由于bit0和页面内是相反的 所以要倒着来
|
||||
getAct1() {
|
||||
this.actList1=[]
|
||||
var num = this.inputData['21501']
|
||||
var num2 = this.padString(num.toString(2), 14)
|
||||
this.actList1New=num2.split("")
|
||||
this.actList1New.forEach((el,index)=>{
|
||||
if(el=='1'){
|
||||
this.actList1.push(this.actList1New.length-index-1)
|
||||
}
|
||||
})
|
||||
},
|
||||
getAct2() {
|
||||
this.actList2=[]
|
||||
var num = this.inputData['21503']
|
||||
var num2 = this.padString(num.toString(2), 14)
|
||||
this.actList2New=num2.split("")
|
||||
this.actList2New.forEach((el,index)=>{
|
||||
if(el=='1'){
|
||||
this.actList2.push(this.actList2New.length-index-1)
|
||||
}
|
||||
})
|
||||
},
|
||||
getAct3() {
|
||||
this.actList3=[]
|
||||
var num = this.inputData['21502']
|
||||
var num3 = this.padString(num.toString(2), 5)
|
||||
this.actList3New=num3.split("")
|
||||
this.actList3New.forEach((el,index)=>{
|
||||
if(el=='1'){
|
||||
this.actList3.push(this.actList3New.length-index-1)
|
||||
}
|
||||
})
|
||||
},
|
||||
getAct4() {
|
||||
this.actList4=[]
|
||||
var num = this.inputData['21504']
|
||||
var num4 = this.padString(num.toString(2), 16)
|
||||
this.actList4New=num4.split("")
|
||||
this.actList4New.forEach((el,index)=>{
|
||||
if(el=='1'){
|
||||
this.actList4.push(this.actList4New.length-index-1)
|
||||
}
|
||||
})
|
||||
},
|
||||
getAct5() {
|
||||
this.actList5=[]
|
||||
var num = this.inputData['21505']
|
||||
var num5 = this.padString(num.toString(2), 16)
|
||||
this.actList5New=num5.split("")
|
||||
this.actList5New.forEach((el,index)=>{
|
||||
if(el=='1'){
|
||||
this.actList5.push(this.actList5New.length-index-1)
|
||||
}
|
||||
})
|
||||
},
|
||||
getAct6() {
|
||||
this.actList6=[]
|
||||
var num = this.inputData['21506']
|
||||
var num6 = this.padString(num.toString(2), 16)
|
||||
this.actList6New=num6.split("")
|
||||
this.actList6New.forEach((el,index)=>{
|
||||
if(el=='1'){
|
||||
this.actList6.push(this.actList6New.length-index-1)
|
||||
}
|
||||
})
|
||||
},
|
||||
dataInit() {
|
||||
this.actList1New = []
|
||||
this.list1.forEach((el, index) => {
|
||||
this.actList1New.push('0')
|
||||
})
|
||||
this.actList1New = []
|
||||
this.list2.forEach((el, index) => {
|
||||
this.actList1New.push('0')
|
||||
})
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
|
||||
};
|
||||
this.api.getControldataUpload(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.inputData = res.data.data;
|
||||
|
||||
this.getAct1()
|
||||
this.getAct2()
|
||||
this.getAct3()
|
||||
|
||||
this.getAct4()
|
||||
this.getAct5()
|
||||
this.getAct6()
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
//全选文本
|
||||
selectValue(e) {
|
||||
e.currentTarget.select();
|
||||
},
|
||||
//失去焦点
|
||||
blurChange(code, el) {
|
||||
var store=this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex-1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
}; //避免开启多个计时器
|
||||
if(this.timer){
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
|
||||
},
|
||||
changeBtn(code,el){
|
||||
var store=this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex-1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
};
|
||||
this.delayTimerBtn(0, data);
|
||||
},
|
||||
//切换btn的限制 写入停止后j*100毫秒调取函数
|
||||
delayTimerBtn(i, data) {
|
||||
const that = this;
|
||||
//整体接口
|
||||
let j = this.$store.state.lateSendBtn;
|
||||
//避免开启多个计时器
|
||||
this.timer && clearInterval(this.timer);
|
||||
|
||||
this.timer = setInterval(() => {
|
||||
++i;
|
||||
if (i == j) {
|
||||
that.changeData(data);
|
||||
clearInterval(this.timer);
|
||||
}
|
||||
}, 100);
|
||||
},
|
||||
change(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
};
|
||||
this.delayTimer(0, data);
|
||||
},
|
||||
//限制 写入停止后j*100毫秒调取函数
|
||||
delayTimer(i, data) {
|
||||
const that = this;
|
||||
//整体接口
|
||||
let j = this.$store.state.lateSend;
|
||||
//避免开启多个计时器
|
||||
this.timer && clearInterval(this.timer);
|
||||
|
||||
this.timer = setInterval(() => {
|
||||
++i;
|
||||
if (i == j) {
|
||||
that.changeData(data);
|
||||
clearInterval(this.timer);
|
||||
}
|
||||
}, 100);
|
||||
},
|
||||
changeData(data) {
|
||||
this.api.postControlWrite(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.$message({
|
||||
message: res.data.msg,
|
||||
type: "success",
|
||||
});
|
||||
this.dataInit();
|
||||
} else {
|
||||
this.$message.error("请求出错");
|
||||
}
|
||||
this.timer=null
|
||||
});
|
||||
},
|
||||
selList1(index) {
|
||||
if (this.actList1.indexOf(index) == -1) {
|
||||
this.actList1.push(index)
|
||||
} else {
|
||||
this.actList1.splice(this.actList1.indexOf(index), 1)
|
||||
}
|
||||
this.actList1New=['0','0','0','0','0','0','0','0','0','0','0','0','0','0',]
|
||||
this.actList1.forEach((el, index) => {
|
||||
this.actList1New[this.actList1New.length-el-1] = '1'
|
||||
})
|
||||
|
||||
var num = this.actList1New.join("");
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: parseInt(num, 2),
|
||||
},
|
||||
};
|
||||
this.changeBtn('500', dataNum);
|
||||
},
|
||||
selList2(index) {
|
||||
if (this.actList2.indexOf(index) == -1) {
|
||||
this.actList2.push(index)
|
||||
} else {
|
||||
this.actList2.splice(this.actList2.indexOf(index), 1)
|
||||
}
|
||||
this.actList2New=['0','0','0','0','0','0','0','0','0','0','0','0','0','0',]
|
||||
this.actList2.forEach((el, index) => {
|
||||
this.actList2New[this.actList2New.length-el-1] = '1'
|
||||
})
|
||||
|
||||
var num = this.actList2New.join("");
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: parseInt(num, 2),
|
||||
},
|
||||
};
|
||||
this.changeBtn('501', dataNum);
|
||||
},
|
||||
selList3(index) {
|
||||
if (this.actList3.indexOf(index) == -1) {
|
||||
this.actList3.push(index)
|
||||
} else {
|
||||
this.actList3.splice(this.actList3.indexOf(index), 1)
|
||||
}
|
||||
this.actList3New=['0','0','0','0','0']
|
||||
this.actList3.forEach((el, index) => {
|
||||
this.actList3New[this.actList3New.length-el-1] = '1'
|
||||
})
|
||||
|
||||
var num = this.actList3New.join("");
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: parseInt(num, 2),
|
||||
},
|
||||
};
|
||||
this.changeBtn('21502', dataNum);
|
||||
},
|
||||
selList4(index) {
|
||||
if (this.actList4.indexOf(index) == -1) {
|
||||
this.actList4.push(index)
|
||||
} else {
|
||||
this.actList4.splice(this.actList4.indexOf(index), 1)
|
||||
}
|
||||
this.actList4New=['0','0','0','0','0','0','0','0','0','0','0','0','0','0','0','0']
|
||||
this.actList4.forEach((el, index) => {
|
||||
this.actList4New[this.actList4New.length-el-1] = '1'
|
||||
})
|
||||
|
||||
var num = this.actList4New.join("");
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: parseInt(num, 2),
|
||||
},
|
||||
};
|
||||
this.changeBtn('21504', dataNum);
|
||||
},
|
||||
selList5(index) {
|
||||
if (this.actList5.indexOf(index) == -1) {
|
||||
this.actList5.push(index)
|
||||
} else {
|
||||
this.actList5.splice(this.actList5.indexOf(index), 1)
|
||||
}
|
||||
this.actList5New=['0','0','0','0','0','0','0','0','0','0','0','0','0','0','0','0']
|
||||
this.actList5.forEach((el, index) => {
|
||||
this.actList5New[this.actList5New.length-el-1] = '1'
|
||||
})
|
||||
|
||||
var num = this.actList5New.join("");
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: parseInt(num, 2),
|
||||
},
|
||||
};
|
||||
this.changeBtn('21505', dataNum);
|
||||
},
|
||||
selList6(index) {
|
||||
if (this.actList6.indexOf(index) == -1) {
|
||||
this.actList6.push(index)
|
||||
} else {
|
||||
this.actList6.splice(this.actList6.indexOf(index), 1)
|
||||
}
|
||||
this.actList6New=['0','0','0','0','0','0','0','0','0','0','0','0','0','0','0','0']
|
||||
this.actList6.forEach((el, index) => {
|
||||
this.actList6New[this.actList6New.length-el-1] = '1'
|
||||
})
|
||||
|
||||
var num = this.actList6New.join("");
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: parseInt(num, 2),
|
||||
},
|
||||
};
|
||||
this.changeBtn('21506', dataNum);
|
||||
},
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
<style lang="scss"></style>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user