diff --git a/src/assets/css/main.css b/src/assets/css/main.css index f6bb0b4..b1aac76 100644 --- a/src/assets/css/main.css +++ b/src/assets/css/main.css @@ -1,20 +1,20 @@ @charset "UTF-8"; -.scroll, .el-dropdown-menu, .formula .page-content { +.scroll, .el-dropdown-menu, .formula .page-content, .history .page-content .el-table--scrollable-x .el-table__body-wrapper { overflow-y: auto; } -.scroll::-webkit-scrollbar, .el-dropdown-menu::-webkit-scrollbar, .formula .page-content::-webkit-scrollbar { +.scroll::-webkit-scrollbar, .el-dropdown-menu::-webkit-scrollbar, .formula .page-content::-webkit-scrollbar, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar { /*滚动条整体*/ width: 10px; cursor: pointer; } -.scroll::-webkit-scrollbar-track, .el-dropdown-menu::-webkit-scrollbar-track, .formula .page-content::-webkit-scrollbar-track { +.scroll::-webkit-scrollbar-track, .el-dropdown-menu::-webkit-scrollbar-track, .formula .page-content::-webkit-scrollbar-track, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-track { /*滚动条轨道*/ background: #013769; } -.scroll::-webkit-scrollbar-thumb, .el-dropdown-menu::-webkit-scrollbar-thumb, .formula .page-content::-webkit-scrollbar-thumb { +.scroll::-webkit-scrollbar-thumb, .el-dropdown-menu::-webkit-scrollbar-thumb, .formula .page-content::-webkit-scrollbar-thumb, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-thumb { /*滚动条里面的滑块*/ width: 4px; cursor: pointer; @@ -22,14 +22,24 @@ border: 3px solid #013769; } -.scroll::-webkit-scrollbar-thumb:hover, .el-dropdown-menu::-webkit-scrollbar-thumb:hover, .formula .page-content::-webkit-scrollbar-thumb:hover { +.scroll::-webkit-scrollbar-thumb:hover, .el-dropdown-menu::-webkit-scrollbar-thumb:hover, .formula .page-content::-webkit-scrollbar-thumb:hover, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-thumb:hover { /*滚动条鼠标事件，鼠标放上去出现的事件*/ } -.scroll::-webkit-scrollbar-corner, .el-dropdown-menu::-webkit-scrollbar-corner, .formula .page-content::-webkit-scrollbar-corner { +.scroll::-webkit-scrollbar-corner, .el-dropdown-menu::-webkit-scrollbar-corner, .formula .page-content::-webkit-scrollbar-corner, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-corner { /*滚动条边角*/ } +.el-date-table td span, +.el-date-range-picker__header div { + color: #606266; +} + +.el-date-table td.end-date div span, +.el-date-table td.start-date div span { + color: #fff !important; +} + .el-dropdown-menu { max-height: 300px; } @@ -1379,6 +1389,7 @@ display: flex; align-items: center; flex-shrink: 0; + margin-right: 100px; } .realTime .page-content .realTime-list .seamless-warp .list-view { @@ -1453,3 +1464,190 @@ min-width: 230px; height: 100%; } + +.history .page-content { + width: 100%; +} + +.history .page-content .el-table--scrollable-x .el-table__body-wrapper .el-table__row { + height: 60px; +} + +.history .page-content .search-flex { + display: flex; + align-items: center; + justify-content: space-between; + flex-wrap: wrap; + width: 100%; + margin-top: 20px; +} + +.history .page-content .search-flex .search-left { + display: flex; + align-items: center; + flex-shrink: 0; + padding: 15px 0; +} + +.history .page-content .search-flex .search-left > div { + display: flex; + align-items: center; +} + +.history .page-content .search-flex .search-left > div > div { + margin-left: 10px; + width: 80px; + height: 34px; + background: rgba(0, 186, 255, 0.15); + border: 2px solid rgba(0, 186, 255, 0.4); + display: flex; + align-items: center; + justify-content: center; + border-radius: 3px; + cursor: pointer; +} + +.history .page-content .search-flex .search-left > div > div.active { + border: 2px solid #0294E2; + background: #0294E2; +} + +.history .page-content .search-flex .search-right { + display: flex; + align-items: center; + flex-shrink: 0; + padding: 15px 0; +} + +.history .page-content .search-flex .search-right span { + margin-right: 10px; +} + +.history .page-content .search-flex .search-right .el-input__inner { + height: 44px; + background: rgba(0, 186, 255, 0.15); + border: 2px solid rgba(0, 186, 255, 0.4); +} + +.history .page-content .search-flex .search-right .el-date-editor .el-range-separator { + color: #fff; +} + +.history .page-content .search-flex .search-right .el-date-editor .el-range-input { + background-color: transparent; + color: #fff; +} + +.dataAnalysis .page-content .search-flex { + display: flex; + align-items: center; + justify-content: center; +} + +.dataAnalysis .page-content .analysis-charts { + width: 100%; + height: 560px; +} + +.dataAnalysis .page-content .analysis-charts > div { + width: 100%; + height: 100%; +} + +.systemManage .page-content .manage-sel { + display: flex; + align-items: center; + padding: 20px 0; + border-bottom: 1px solid rgba(0, 180, 255, 0.35); +} + +.systemManage .page-content .manage-sel > div { + margin-right: 20px; + padding: 0 20px; + height: 40px; + background: rgba(0, 186, 255, 0.15); + border: 2px solid rgba(0, 186, 255, 0.4); + display: flex; + align-items: center; + justify-content: center; + border-radius: 3px; + cursor: pointer; +} + +.systemManage .page-content .manage-sel > div > img { + width: 14px; + height: auto; + margin-right: 5px; +} + +.systemManage .page-content .manage-sel > div.active { + border: 2px solid #0294E2; + background: #0294E2; +} + +.systemManage .page-content .manage-content { + width: 100%; + height: calc(100% - 160px); +} + +.systemManage .page-content .manage-content .manage-input { + margin-bottom: 25px; +} + +.systemManage .page-content .manage-content .manage-input > div { + margin-bottom: 10px; +} + +.systemManage .page-content .manage-content .manage-input > input { + width: 500px; + height: 44px; + background: rgba(0, 186, 255, 0.15); + border: 2px solid rgba(0, 186, 255, 0.4); + padding: 0 15px; +} + +.systemManage .page-content .manage-content .manage-input > input::placeholder { + color: #859bb6; +} + +.systemManage .page-content .manage-content .manage-btn { + width: 300px; + height: 60px; + background: #0294E2; + border-radius: 10px; + margin-top: 25px; + display: flex; + align-items: center; + justify-content: center; + font-size: 20px; +} + +.systemManage .page-content .manage-content.manage-content-input { + height: 400px; + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; +} + +.systemManage .page-content .manage-content.manage-content-form { + margin-top: 15px; + display: flex; + align-items: center; + flex-direction: column; +} + +.systemManage .page-content .manage-content.manage-content-form .manage-input > input { + width: 660px; +} + +.systemManage .page-content .manage-content.manage-content-form .manage-html > div { + margin-bottom: 10px; +} + +.systemManage .page-content .manage-content.manage-content-form .manage-html > .html { + width: 660px; + height: 120px; + background: rgba(0, 186, 255, 0.15); + border: 2px solid rgba(0, 186, 255, 0.4); +} diff --git a/src/assets/css/main.min.css b/src/assets/css/main.min.css index cf0a0b9..494847b 100644 --- a/src/assets/css/main.min.css +++ b/src/assets/css/main.min.css @@ -1 +1 @@ -.scroll,.el-dropdown-menu,.formula .page-content{overflow-y:auto}.scroll::-webkit-scrollbar,.el-dropdown-menu::-webkit-scrollbar,.formula .page-content::-webkit-scrollbar{width:10px;cursor:pointer}.scroll::-webkit-scrollbar-track,.el-dropdown-menu::-webkit-scrollbar-track,.formula .page-content::-webkit-scrollbar-track{background:#013769}.scroll::-webkit-scrollbar-thumb,.el-dropdown-menu::-webkit-scrollbar-thumb,.formula .page-content::-webkit-scrollbar-thumb{width:4px;cursor:pointer;background:#0294E2;border:3px solid #013769}.el-dropdown-menu{max-height:300px}.border-none{border:none !important}.collapse .el-collapse{border:none}.collapse .el-collapse-item__header,.collapse .el-collapse-item__wrap{background:transparent;border-bottom:1px solid rgba(168,182,200,0.2)}.collapse .el-collapse-item__header{font-size:16px;padding-left:25px;font-family:Microsoft YaHei;font-weight:400;color:#FFFFFF;display:flex;align-items:center}.collapse .el-collapse-item__header>.img{width:20px;height:20px;display:flex;align-items:center;justify-content:center;margin-right:10px}.collapse .el-collapse-item__content{padding:0}.collapse .no-list{width:100%;height:76px;line-height:76px;padding-left:25px;border-bottom:1px solid rgba(168,182,200,0.2);cursor:pointer;color:#A8B6C8}.collapse .no-list:hover{color:#fff}.collapse .table-ul{display:flex;flex-direction:column;align-items:center;padding:10px 0}.collapse .table-ul .table-li{display:flex;align-items:center;padding-left:31px;position:relative;font-size:14px;font-family:Microsoft YaHei;font-weight:400;color:#A8B6C8;width:200px;height:40px;cursor:pointer}.collapse .table-ul .table-li:hover{color:#fff}.collapse .table-ul .table-li:hover::before{background:#fff}.collapse .table-ul .table-li.active{background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.3);color:#fff}.collapse .table-ul .table-li.active::before{background:#fff}.collapse .table-ul .table-li .status{width:50px;height:22px;background:rgba(168,182,200,0.15);border:1px solid rgba(168,182,200,0.5);border-radius:11px;font-size:12px;font-family:Microsoft YaHei;font-weight:400;display:flex;align-items:center;justify-content:center;color:#A8B6C8;margin-left:10px}.collapse .table-ul .table-li .status.online{background:rgba(0,255,186,0.15);border:1px solid rgba(0,255,186,0.5);color:#00FFBA}.collapse .table-ul .table-li::before{content:' ';width:4px;height:4px;background:#A8B6C8;position:absolute;top:50%;transform:translateY(-50%);left:10px}.collapse.set-params .el-collapse-item__header{padding-left:20px;color:#A8B6C8}.collapse.set-params .table-ul .table-li{width:100%;padding-left:40px}.collapse.set-params .table-ul .table-li::before{left:20px}.table-title{display:flex;align-items:center;font-size:28px;font-family:Microsoft YaHei;font-weight:bold;color:#FFFFFF}.table-title>img{width:60px;height:60px;margin-right:15px}.table-title .tips{margin-left:15px;display:flex;align-items:center;justify-content:center;width:120px;height:34px;background:rgba(0,255,186,0.15);border:1px solid rgba(0,255,186,0.5);border-radius:17px;font-size:14px;font-family:Microsoft YaHei;font-weight:400;color:#00FFBA}.index{width:100%;height:100%;min-height:900px;overflow:auto;background:url(../image/index-background.png) no-repeat;background-size:1920px 1080px;background-position:center top}.index .no-list{color:#fff;display:flex;align-items:center}.index .no-list>.img{width:20px;height:20px;display:flex;align-items:center;justify-content:center;margin-right:10px}.index .header{height:78px;display:flex;align-items:center;justify-content:space-between}.index .header .header-left{position:relative;width:373px;height:78px}.index .header .header-left>img{width:373px;height:99px;cursor:pointer}.index .header .header-center{width:calc(100% - 335px - 373px);max-width:1000px;height:78px;display:flex;align-items:center;justify-content:space-around}.index .header .header-center>div{display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;width:111px;height:78px}.index .header .header-center>div.active{background:linear-gradient(0deg, rgba(0,132,255,0.3) 0%, rgba(0,132,255,0) 100%);position:relative}.index .header .header-center>div.active::before{content:' ';position:absolute;left:0;top:0;width:1px;height:78px;background:linear-gradient(0deg, #fff 0%, rgba(255,255,255,0) 100%);opacity:0.3}.index .header .header-center>div.active::after{content:' ';position:absolute;right:0;top:0;width:1px;height:78px;background:linear-gradient(0deg, #fff 0%, rgba(255,255,255,0) 100%);opacity:0.3}.index .header .header-center>div.active .name{color:#fff}.index .header .header-center>div .img{width:30px;height:30px;display:flex;align-items:center;justify-content:center;margin-bottom:5px}.index .header .header-center>div .name{font-size:14px;font-family:Microsoft YaHei;font-weight:400;color:#8BEAFF}.index .header .header-right{width:335px;display:flex;align-items:center;padding-right:20px;justify-content:flex-end}.index .header .header-right>img{width:40px;height:40px}.index .header .header-right .user-data{height:40px;display:flex;flex-direction:column;justify-content:center;padding:0 20px 0 10px;margin-right:20px;border-right:1px solid rgba(255,255,255,0.2)}.index .header .header-right .user-data .name{font-size:14px;font-family:Microsoft YaHei;font-weight:400;color:#8BEAFF}.index .header .header-right .user-data .time{font-size:14px;font-family:Arial;font-weight:400;color:#FFFFFF}.index .header .header-right .login-out{width:40px;height:40px;background:url(../image/login-out.png) no-repeat center;background-size:100% 100%;cursor:pointer}.index .header .header-right .login-out:hover{background:url(../image/login-out-hover.png) no-repeat center;background-size:100% 100%}.index .index-content{display:flex;align-items:center;justify-content:space-between;width:100%;height:calc(100% - 78px);position:relative;z-index:2}.index .index-content .left{width:240px;height:100%;background:rgba(0,29,68,0.25);border-right:2px solid rgba(0,180,255,0.25);overflow:auto}.index .index-content .right{width:calc(100% - 240px);height:100%;overflow:auto}.input-view{display:flex;align-items:center;flex-wrap:wrap;margin-top:15px}.input-view>div{flex-shrink:0;margin-right:20px;display:flex;align-items:center;margin:7.5px 0}.input-view>div>span{padding:0 8px}.input-sel .el-dropdown-link{width:300px;height:44px;background:rgba(0,186,255,0.15);border:2px solid rgba(0,186,255,0.4);cursor:pointer;position:relative}.input-sel .el-dropdown-link input{width:100%;height:100%;background:transparent;border:none;padding-left:15px;font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#00FFBA}.input-sel .el-dropdown-link input::placeholder{color:#859BB6}.input-sel .el-dropdown-link .arrow{width:33px;height:24px;border-left:1px solid #fff;display:flex;align-items:center;justify-content:center;position:absolute;right:0;top:50%;transform:translateY(-50%)}.input-sel .el-dropdown-link .arrow>img{width:6px;height:4px}.input-main span{padding:0 10px}.input-main div{margin-bottom:10px}.input-main input{width:180px;height:44px;background:rgba(0,186,255,0.15);border:2px solid rgba(0,186,255,0.4);padding-left:15px;font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#fff}.input-main input::placeholder{color:#859BB6}.input-main-80{width:100%;flex-wrap:wrap;display:flex;align-items:center}.input-main-80.table-input{justify-content:center}.input-main-80.table-input>span{color:#FF9191}.input-main-80 span{padding:0 10px}.input-main-80 input{width:80px;height:44px;background:rgba(0,186,255,0.15);border:2px solid rgba(0,186,255,0.4);font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#fff;margin:5px 5px;text-align:center}.input-main-80 input::placeholder{color:#859BB6}.el-dropdown-menu{width:300px;border:none;background-color:#014781}.el-dropdown-menu .popper__arrow::after{border-bottom-color:rgba(0,186,255,0.25) !important}.el-dropdown-menu .el-dropdown-menu__item{font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#00C0F7;background:transparent}.el-dropdown-menu .el-dropdown-menu__item.is-disabled{opacity:0.5;cursor:not-allowed}.el-dropdown-menu .el-dropdown-menu__item--divided{border-top:none}.el-dropdown-menu .el-dropdown-menu__item--divided::before{background:#00C0F7}.el-dropdown-menu .el-dropdown-menu__item:focus,.el-dropdown-menu .el-dropdown-menu__item:not(.is-disabled):hover{background-color:rgba(0,186,255,0.25);color:#FFFFFF}.page-title{width:100%;height:43px;padding-left:41px;font-size:20px;font-family:Microsoft YaHei;font-weight:bold;color:#FFFFFF;position:relative;line-height:43px;background:url(../image/title-202.png) no-repeat center;background-size:202px 43px;background-position:left center;min-width:202px}.page-title::before{content:' ';width:32px;height:33px;left:2px;top:50%;position:absolute;transform:translateY(-50%);background:url(../image/page-title.png) no-repeat center;background-size:100% 100%}.page-title.title-302{background:url(../image/title-302.png) no-repeat center;background-size:302px 43px;background-position:left center;min-width:302px}.formula{width:100%;height:100%;padding:20px;display:flex;align-items:center;justify-content:space-between}.formula .page-content{width:calc(100% - 300px);height:100%;background:rgba(0,92,178,0.15);border:2px solid rgba(0,186,255,0.2);padding:20px 30px 0}.formula .page-content .table-view{background:transparent;margin-top:30px}.formula .page-content .table-view .cell{text-align:center}.formula .page-content .table-view .el-table .warning-row{background:rgba(0,180,255,0.2)}.formula .page-content .table-view .el-table .success-row{background:rgba(0,47,94,0.35)}.formula .page-content .table-view .el-table::before,.formula .page-content .table-view .el-table--border::after{height:0}.formula .page-content .table-view .el-table,.formula .page-content .table-view .el-table tr,.formula .page-content .table-view .el-table td.el-table__cell{border:none;background:transparent}.formula .page-content .table-view .el-table th.el-table__cell.is-leaf{border:none;background:rgba(0,180,255,0.2)}.formula .page-content .table-view .el-table th.el-table__cell.is-leaf .cell{font-size:18px;font-family:Microsoft YaHei;font-weight:bold;color:#FFFFFF}.formula .page-content .table-view .status{width:100px;height:34px;background:#0294E2;border-radius:3px;display:flex;align-items:center;justify-content:center;margin:0 auto;font-size:18px;font-family:Microsoft YaHei;font-weight:bold;color:#FFFFFF;cursor:pointer}.formula .page-content .table-view .status.status1{background:#00BB88}.formula .page-content .table-view .status.noSel{opacity:0.5}.formula .page-content .table-view .type0{font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#FF9191}.formula .page-content .table-view .type1{display:flex;align-items:center;justify-content:center;font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#FFFFFF;white-space:nowrap}.formula .page-content .table-view .type1>div{justify-content:center}.formula .page-content .table-view .type2{width:140px;height:34px;background:#0294E2;border-radius:3px;margin:0 auto;display:flex;align-items:center;font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#FFFFFF;cursor:pointer;justify-content:center}.formula .page-content .table-view .type2 img{width:14px;height:14px;margin-right:10px}.formula .page-content .table-view .type2.noSel{opacity:0.5}.flex-view{display:flex;align-items:center;flex-wrap:wrap}.flex-view>div{flex-shrink:0;margin:7.5px 0}.flex-view{padding:12.5px 0;border-bottom:1px solid rgba(0,180,255,0.5)}.input-btn{display:flex;align-items:center}.input-btn>span{font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#FFFFFF;padding-left:8px}.btn{margin:0 8px;padding:0 20px;border-radius:3px;height:40px;display:flex;align-items:center;justify-content:center;font-size:16px;font-family:Microsoft YaHei;font-weight:bold;color:#FFFFFF;cursor:pointer;white-space:nowrap}.btn>img{margin-right:10px;width:14px;height:14px}.btn.green{background:#00BB88}.btn.blue{background:#0294E2}.irrigateSet .open-btn{width:300px;height:54px;background:#003070;border:1px solid rgba(2,148,226,0.5);border-radius:5px;display:flex;align-items:center;justify-content:center;font-size:18px;font-family:Microsoft YaHei;font-weight:bold;color:#00C8FF;margin:7.5px 10px;cursor:pointer}.irrigateSet .open-btn>img{margin-right:10px}.irrigateSet .open-btn.active{color:#FFFFFF;background:#0294E2;border-color:#0294E2}.PIDSet .flex-view{border-bottom:none}.PIDSet .PIDSet-view{width:400px;height:470px;background:rgba(0,132,255,0.15);border:2px solid rgba(0,186,255,0.35);margin:7.5px 10px}.PIDSet .PID-input-content{width:100%;height:calc(100% - 43px);padding:30px 0;display:flex;flex-direction:column;justify-content:space-between}.PIDSet .PID-input{display:flex;align-items:center}.PIDSet .PID-input>div{width:114px;margin-right:10px;font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#FFFFFF;text-align:right}.PIDSet .PID-input input{width:240px;height:44px;background:rgba(0,186,255,0.15);border:2px solid rgba(0,186,255,0.4);padding-left:15px;font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#fff}.PIDSet .PID-input input::placeholder{color:#859BB6}.PIDSet .PID-input-content-full{width:100%;height:calc(100% - 43px);padding:30px 0;display:flex;flex-direction:column;justify-content:space-between;align-items:center}.PIDSet .PID-input-full>div{font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#FFFFFF;margin-bottom:9px}.PIDSet .PID-input-full input{width:350px;height:44px;background:rgba(0,186,255,0.15);border:2px solid rgba(0,186,255,0.4);padding-left:15px;font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#fff}.PIDSet .PID-input-full input::placeholder{color:#859BB6}.systemSet .system-tips{background:rgba(0,92,178,0.15);border:2px solid rgba(0,186,255,0.2);width:100%;padding:20px;font-size:14px;font-family:Microsoft YaHei;font-weight:400;color:#A8B6C8}.upload .upload-view{width:520px;height:520px;margin:7.5px 10px;background:rgba(0,132,255,0.15);border:2px solid rgba(0,186,255,0.35)}.upload .upload-view .upload-title{background:url(../image/title-172.png) no-repeat center;background-size:172px 43px;background-position:left center;min-width:172px}.upload .upload-content{width:100%;height:calc(100% - 43px);display:grid;grid-template-columns:repeat(2, 1fr);grid-row-gap:20px;grid-column-gap:20px;padding:19px 30px}.upload .upload-content>div{display:flex;align-items:center;cursor:pointer;white-space:nowrap}.upload .upload-content>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%}.upload .upload-content>div .sel{margin-right:10px;width:35px;height:35px;background:url(../image/radio.png) no-repeat center;background-size:100% 100%}.sensorSet .sensor-view{display:flex;align-items:center;justify-content:space-between;width:100%;height:520px;margin-top:30px}.sensorSet .sensor-view .left{width:200px;padding:0 10px;height:100%;background:rgba(0,92,178,0.15);border:2px solid rgba(0,186,255,0.2)}.sensorSet .sensor-view .left>div{cursor:pointer;width:100%;height:73px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid rgba(0,180,255,0.25)}.sensorSet .sensor-view .left>div>div{font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#A8B6C8}.sensorSet .sensor-view .left>div.active>div{width:100%;display:flex;align-items:center;justify-content:center;height:40px;background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.3);color:#fff}.sensorSet .sensor-view .right{width:calc(100% - 220px);height:100%;background:rgba(0,92,178,0.15);border:2px solid rgba(0,186,255,0.2)}.sensorSet .sensor-view .right .right-top{width:100%;padding:30px 0px 30px 75px;border-bottom:1px solid rgba(0,180,255,0.35)}.sensorSet .sensor-view .right .right-top .input-sel{margin:30px 0}.sensorSet .sensor-view .right .right-top .input-sel>.title{margin-bottom:11px}.sensorSet .sensor-view .right .right-top .right-sel{display:flex;align-items:center}.sensorSet .sensor-view .right .right-top .right-sel>div{display:flex;align-items:center;cursor:pointer;white-space:nowrap;margin-right:30px}.sensorSet .sensor-view .right .right-top .right-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-view .right .right-top .right-sel>div .sel{margin-right:10px;width:35px;height:35px;background:url(../image/radio.png) no-repeat center;background-size:100% 100%}.sensorSet .sensor-view .right .right-bottom{padding:40px 0 0 75px}.sensorSet .sensor-view .right .right-bottom>div{display:flex;align-items:center;margin-bottom:30px}.sensorSet .sensor-view .right .right-bottom>div>div{margin-right:30px}.el-dialog__wrapper .el-dialog{background:rgba(0,59,114,0.8);border:2px solid rgba(0,186,255,0.35)}.el-dialog__wrapper .el-dialog .el-dialog__header{display:none}.el-dialog__wrapper .el-dialog .el-dialog__body{padding:0}.el-dialog__wrapper .el-dialog .el-dialog__body .model-return{padding:20px;display:flex;align-items:center;justify-content:flex-end}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top{padding:20px 15px;border-bottom:1px solid rgba(0,180,255,0.35);display:flex;align-items:center;justify-content:space-between}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top.model2-top{justify-content:flex-start}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top.model3-top .btn{padding:0 10px}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top.model3-top .btn img{width:26px;height:22px}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top.model4-top{align-items:flex-start}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top.model4-top .btn{padding:0 10px}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top.model4-top .btn img{width:22px;height:24px}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top .btn img{width:10px;height:14px}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top .model-right>div{display:flex;align-items:center;margin-bottom:20px}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top .model-right>div .number{width:30px;margin-right:10px;height:30px;background:#0294E2;border-radius:50%;display:flex;align-items:center;justify-content:center}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top .model-right>div .input-main-80{width:auto}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-bottom{padding:20px 15px;border-bottom:1px solid rgba(0,180,255,0.35)}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-bottom.model3-bottom .title{padding:0 4px}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-bottom .model1-content>div{display:flex;align-items:center;padding:10px 0}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-bottom .model1-content>div .number{width:30px;margin-right:10px;height:30px;background:#0294E2;border-radius:50%;display:flex;align-items:center;justify-content:center}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-bottom .model1-content .input-main-80 span{font-size:20px}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-bottom .model1-content .input-main-80 span.text{font-size:16px;padding:0 4px;flex-shrink:0}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-bottom .model1-content.model3-content{display:flex;align-items:center;flex-wrap:wrap}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-bottom .model1-content.model3-content>div{display:block;width:calc(100% / 3);flex-shrink:0}.login .login-header{position:relative;width:100%;height:76px;background:rgba(0,180,255,0.1);border-bottom:2px solid rgba(0,180,255,0.3)}.login .login-header>img{width:373px;height:99px}.login .login-view{width:520px;height:570px;background:rgba(122,219,255,0.1);border:2px solid rgba(122,219,255,0.66);border-radius:10px;position:fixed;right:5%;top:50%;transform:translateY(-50%);padding-top:59px;display:flex;flex-direction:column;align-items:center}.login .login-view .login-title{width:344px;height:45px;background:url(../image/login-title.png) no-repeat center;background-size:344px 15px;background-position:center bottom;display:flex;align-items:center;justify-content:center;padding-bottom:11px}.login .login-view .login-title>img{width:30px;height:34px;margin-right:9px}.login .login-view .login-title span{font-size:30px;font-family:Alibaba PuHuiTi;font-weight:bold;color:#FFFFFF;background:linear-gradient(0deg, #fff 0%, #BFE7FF 19.99512%, #fff 60.00977%);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.login .login-view .login-input{width:450px;height:63px;background:rgba(122,219,255,0.05);border:2px solid rgba(134,214,255,0.15);border-radius:7px;position:relative}.login .login-view .login-input.active{background:rgba(122,219,255,0.1);border:2px solid rgba(122,219,255,0.66)}.login .login-view .login-input>img{position:absolute;left:25px;top:50%;transform:translateY(-50%)}.login .login-view .login-input>input{width:450px;height:63px;padding-left:72px;background:transparent;border:none;font-size:20px;font-family:Alibaba PuHuiTi;font-weight:400;color:#FFFFFF}.login .login-view .login-input>input::placeholder{color:#FFFFFF}.login .login-view .login-input.username{margin-top:53px}.login .login-view .login-input.password{margin:38px 0 20px}.login .login-view .save{width:450px}.login .login-view .save>div{width:150px;display:flex;font-size:18px;font-family:Alibaba PuHuiTi;color:#FFFFFF;align-items:center;cursor:pointer}.login .login-view .save>div>div{width:20px;height:20px;border:2px solid rgba(122,219,255,0.66);margin-right:12px;display:flex;align-items:center;justify-content:center;border-radius:3px}.login .login-view .login-btn{width:400px;height:63px;background:#0294E2;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:24px;font-family:Alibaba PuHuiTi;font-weight:400;color:#FFFFFF;margin-top:85px;cursor:pointer}.realTime{width:100%;height:100%;padding:20px}.realTime .page-content{position:relative;width:100%;height:100%;background:rgba(0,92,178,0.15);border:2px solid rgba(0,186,255,0.2);padding:20px 30px}.realTime .page-content .timeNow{text-align:center;position:absolute;right:30px;top:42px;width:240px;display:flex;align-items:center;font-size:24px;font-family:Arial;font-weight:bold;color:#8BEAFF}.realTime .page-content .timeNow>span{font-size:24px;font-family:Arial;font-weight:bold;color:#8BEAFF;margin-left:10px}.realTime .page-content .realTime-list{width:100%;overflow:hidden}.realTime .page-content .realTime-list .seamless-warp{display:flex;align-items:center}.realTime .page-content .realTime-list .seamless-warp>div{display:flex;overflow:unset !important}.realTime .page-content .realTime-list .seamless-warp>div>div{display:flex;align-items:center;flex-shrink:0}.realTime .page-content .realTime-list .seamless-warp .list-view{flex-shrink:0;display:flex;flex-direction:column;align-items:center;margin-right:20px}.realTime .page-content .realTime-list .seamless-warp .list-view img{width:80px;height:80px}.realTime .page-content .realTime-list .seamless-warp .list-view .text{margin:5px 0}.realTime .page-content .realTime-list .seamless-warp .list-view .number{width:106px;height:40px;background:url(../image/real-time-text.png) no-repeat center;background-size:100% 100%;font-size:20px;font-family:Arial;font-weight:bold;color:#FFFFFF;display:flex;align-items:center;justify-content:center}.realTime .page-content .flex-list{display:flex;align-items:center;justify-content:space-around}.realTime .page-content .realTime-bottom{height:440px;margin-top:30px}.realTime .page-content .realTime-bottom>div{flex-shrink:0}.realTime .page-content .realTime-bottom .left{width:43%;height:100%;background:rgba(0,132,255,0.15);border:2px solid rgba(0,186,255,0.35);display:flex;align-items:center;justify-content:center;padding:10px}.realTime .page-content .realTime-bottom .left>div{width:100%;height:100%}.realTime .page-content .realTime-bottom .left>div .video-js{width:100%;height:100%}.realTime .page-content .realTime-bottom .right{width:calc(100% - 43%);min-width:230px;height:100%} +.scroll,.el-dropdown-menu,.formula .page-content,.history .page-content .el-table--scrollable-x .el-table__body-wrapper{overflow-y:auto}.scroll::-webkit-scrollbar,.el-dropdown-menu::-webkit-scrollbar,.formula .page-content::-webkit-scrollbar,.history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar{width:10px;cursor:pointer}.scroll::-webkit-scrollbar-track,.el-dropdown-menu::-webkit-scrollbar-track,.formula .page-content::-webkit-scrollbar-track,.history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-track{background:#013769}.scroll::-webkit-scrollbar-thumb,.el-dropdown-menu::-webkit-scrollbar-thumb,.formula .page-content::-webkit-scrollbar-thumb,.history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-thumb{width:4px;cursor:pointer;background:#0294E2;border:3px solid #013769}.el-date-table td span,.el-date-range-picker__header div{color:#606266}.el-date-table td.end-date div span,.el-date-table td.start-date div span{color:#fff !important}.el-dropdown-menu{max-height:300px}.border-none{border:none !important}.collapse .el-collapse{border:none}.collapse .el-collapse-item__header,.collapse .el-collapse-item__wrap{background:transparent;border-bottom:1px solid rgba(168,182,200,0.2)}.collapse .el-collapse-item__header{font-size:16px;padding-left:25px;font-family:Microsoft YaHei;font-weight:400;color:#FFFFFF;display:flex;align-items:center}.collapse .el-collapse-item__header>.img{width:20px;height:20px;display:flex;align-items:center;justify-content:center;margin-right:10px}.collapse .el-collapse-item__content{padding:0}.collapse .no-list{width:100%;height:76px;line-height:76px;padding-left:25px;border-bottom:1px solid rgba(168,182,200,0.2);cursor:pointer;color:#A8B6C8}.collapse .no-list:hover{color:#fff}.collapse .table-ul{display:flex;flex-direction:column;align-items:center;padding:10px 0}.collapse .table-ul .table-li{display:flex;align-items:center;padding-left:31px;position:relative;font-size:14px;font-family:Microsoft YaHei;font-weight:400;color:#A8B6C8;width:200px;height:40px;cursor:pointer}.collapse .table-ul .table-li:hover{color:#fff}.collapse .table-ul .table-li:hover::before{background:#fff}.collapse .table-ul .table-li.active{background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.3);color:#fff}.collapse .table-ul .table-li.active::before{background:#fff}.collapse .table-ul .table-li .status{width:50px;height:22px;background:rgba(168,182,200,0.15);border:1px solid rgba(168,182,200,0.5);border-radius:11px;font-size:12px;font-family:Microsoft YaHei;font-weight:400;display:flex;align-items:center;justify-content:center;color:#A8B6C8;margin-left:10px}.collapse .table-ul .table-li .status.online{background:rgba(0,255,186,0.15);border:1px solid rgba(0,255,186,0.5);color:#00FFBA}.collapse .table-ul .table-li::before{content:' ';width:4px;height:4px;background:#A8B6C8;position:absolute;top:50%;transform:translateY(-50%);left:10px}.collapse.set-params .el-collapse-item__header{padding-left:20px;color:#A8B6C8}.collapse.set-params .table-ul .table-li{width:100%;padding-left:40px}.collapse.set-params .table-ul .table-li::before{left:20px}.table-title{display:flex;align-items:center;font-size:28px;font-family:Microsoft YaHei;font-weight:bold;color:#FFFFFF}.table-title>img{width:60px;height:60px;margin-right:15px}.table-title .tips{margin-left:15px;display:flex;align-items:center;justify-content:center;width:120px;height:34px;background:rgba(0,255,186,0.15);border:1px solid rgba(0,255,186,0.5);border-radius:17px;font-size:14px;font-family:Microsoft YaHei;font-weight:400;color:#00FFBA}.index{width:100%;height:100%;min-height:900px;overflow:auto;background:url(../image/index-background.png) no-repeat;background-size:1920px 1080px;background-position:center top}.index .no-list{color:#fff;display:flex;align-items:center}.index .no-list>.img{width:20px;height:20px;display:flex;align-items:center;justify-content:center;margin-right:10px}.index .header{height:78px;display:flex;align-items:center;justify-content:space-between}.index .header .header-left{position:relative;width:373px;height:78px}.index .header .header-left>img{width:373px;height:99px;cursor:pointer}.index .header .header-center{width:calc(100% - 335px - 373px);max-width:1000px;height:78px;display:flex;align-items:center;justify-content:space-around}.index .header .header-center>div{display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;width:111px;height:78px}.index .header .header-center>div.active{background:linear-gradient(0deg, rgba(0,132,255,0.3) 0%, rgba(0,132,255,0) 100%);position:relative}.index .header .header-center>div.active::before{content:' ';position:absolute;left:0;top:0;width:1px;height:78px;background:linear-gradient(0deg, #fff 0%, rgba(255,255,255,0) 100%);opacity:0.3}.index .header .header-center>div.active::after{content:' ';position:absolute;right:0;top:0;width:1px;height:78px;background:linear-gradient(0deg, #fff 0%, rgba(255,255,255,0) 100%);opacity:0.3}.index .header .header-center>div.active .name{color:#fff}.index .header .header-center>div .img{width:30px;height:30px;display:flex;align-items:center;justify-content:center;margin-bottom:5px}.index .header .header-center>div .name{font-size:14px;font-family:Microsoft YaHei;font-weight:400;color:#8BEAFF}.index .header .header-right{width:335px;display:flex;align-items:center;padding-right:20px;justify-content:flex-end}.index .header .header-right>img{width:40px;height:40px}.index .header .header-right .user-data{height:40px;display:flex;flex-direction:column;justify-content:center;padding:0 20px 0 10px;margin-right:20px;border-right:1px solid rgba(255,255,255,0.2)}.index .header .header-right .user-data .name{font-size:14px;font-family:Microsoft YaHei;font-weight:400;color:#8BEAFF}.index .header .header-right .user-data .time{font-size:14px;font-family:Arial;font-weight:400;color:#FFFFFF}.index .header .header-right .login-out{width:40px;height:40px;background:url(../image/login-out.png) no-repeat center;background-size:100% 100%;cursor:pointer}.index .header .header-right .login-out:hover{background:url(../image/login-out-hover.png) no-repeat center;background-size:100% 100%}.index .index-content{display:flex;align-items:center;justify-content:space-between;width:100%;height:calc(100% - 78px);position:relative;z-index:2}.index .index-content .left{width:240px;height:100%;background:rgba(0,29,68,0.25);border-right:2px solid rgba(0,180,255,0.25);overflow:auto}.index .index-content .right{width:calc(100% - 240px);height:100%;overflow:auto}.input-view{display:flex;align-items:center;flex-wrap:wrap;margin-top:15px}.input-view>div{flex-shrink:0;margin-right:20px;display:flex;align-items:center;margin:7.5px 0}.input-view>div>span{padding:0 8px}.input-sel .el-dropdown-link{width:300px;height:44px;background:rgba(0,186,255,0.15);border:2px solid rgba(0,186,255,0.4);cursor:pointer;position:relative}.input-sel .el-dropdown-link input{width:100%;height:100%;background:transparent;border:none;padding-left:15px;font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#00FFBA}.input-sel .el-dropdown-link input::placeholder{color:#859BB6}.input-sel .el-dropdown-link .arrow{width:33px;height:24px;border-left:1px solid #fff;display:flex;align-items:center;justify-content:center;position:absolute;right:0;top:50%;transform:translateY(-50%)}.input-sel .el-dropdown-link .arrow>img{width:6px;height:4px}.input-main span{padding:0 10px}.input-main div{margin-bottom:10px}.input-main input{width:180px;height:44px;background:rgba(0,186,255,0.15);border:2px solid rgba(0,186,255,0.4);padding-left:15px;font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#fff}.input-main input::placeholder{color:#859BB6}.input-main-80{width:100%;flex-wrap:wrap;display:flex;align-items:center}.input-main-80.table-input{justify-content:center}.input-main-80.table-input>span{color:#FF9191}.input-main-80 span{padding:0 10px}.input-main-80 input{width:80px;height:44px;background:rgba(0,186,255,0.15);border:2px solid rgba(0,186,255,0.4);font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#fff;margin:5px 5px;text-align:center}.input-main-80 input::placeholder{color:#859BB6}.el-dropdown-menu{width:300px;border:none;background-color:#014781}.el-dropdown-menu .popper__arrow::after{border-bottom-color:rgba(0,186,255,0.25) !important}.el-dropdown-menu .el-dropdown-menu__item{font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#00C0F7;background:transparent}.el-dropdown-menu .el-dropdown-menu__item.is-disabled{opacity:0.5;cursor:not-allowed}.el-dropdown-menu .el-dropdown-menu__item--divided{border-top:none}.el-dropdown-menu .el-dropdown-menu__item--divided::before{background:#00C0F7}.el-dropdown-menu .el-dropdown-menu__item:focus,.el-dropdown-menu .el-dropdown-menu__item:not(.is-disabled):hover{background-color:rgba(0,186,255,0.25);color:#FFFFFF}.page-title{width:100%;height:43px;padding-left:41px;font-size:20px;font-family:Microsoft YaHei;font-weight:bold;color:#FFFFFF;position:relative;line-height:43px;background:url(../image/title-202.png) no-repeat center;background-size:202px 43px;background-position:left center;min-width:202px}.page-title::before{content:' ';width:32px;height:33px;left:2px;top:50%;position:absolute;transform:translateY(-50%);background:url(../image/page-title.png) no-repeat center;background-size:100% 100%}.page-title.title-302{background:url(../image/title-302.png) no-repeat center;background-size:302px 43px;background-position:left center;min-width:302px}.formula{width:100%;height:100%;padding:20px;display:flex;align-items:center;justify-content:space-between}.formula .page-content{width:calc(100% - 300px);height:100%;background:rgba(0,92,178,0.15);border:2px solid rgba(0,186,255,0.2);padding:20px 30px 0}.formula .page-content .table-view{background:transparent;margin-top:30px}.formula .page-content .table-view .cell{text-align:center}.formula .page-content .table-view .el-table .warning-row{background:rgba(0,180,255,0.2)}.formula .page-content .table-view .el-table .success-row{background:rgba(0,47,94,0.35)}.formula .page-content .table-view .el-table::before,.formula .page-content .table-view .el-table--border::after{height:0}.formula .page-content .table-view .el-table,.formula .page-content .table-view .el-table tr,.formula .page-content .table-view .el-table td.el-table__cell{border:none;background:transparent}.formula .page-content .table-view .el-table th.el-table__cell.is-leaf{border:none;background:rgba(0,180,255,0.2)}.formula .page-content .table-view .el-table th.el-table__cell.is-leaf .cell{font-size:18px;font-family:Microsoft YaHei;font-weight:bold;color:#FFFFFF}.formula .page-content .table-view .status{width:100px;height:34px;background:#0294E2;border-radius:3px;display:flex;align-items:center;justify-content:center;margin:0 auto;font-size:18px;font-family:Microsoft YaHei;font-weight:bold;color:#FFFFFF;cursor:pointer}.formula .page-content .table-view .status.status1{background:#00BB88}.formula .page-content .table-view .status.noSel{opacity:0.5}.formula .page-content .table-view .type0{font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#FF9191}.formula .page-content .table-view .type1{display:flex;align-items:center;justify-content:center;font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#FFFFFF;white-space:nowrap}.formula .page-content .table-view .type1>div{justify-content:center}.formula .page-content .table-view .type2{width:140px;height:34px;background:#0294E2;border-radius:3px;margin:0 auto;display:flex;align-items:center;font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#FFFFFF;cursor:pointer;justify-content:center}.formula .page-content .table-view .type2 img{width:14px;height:14px;margin-right:10px}.formula .page-content .table-view .type2.noSel{opacity:0.5}.flex-view{display:flex;align-items:center;flex-wrap:wrap}.flex-view>div{flex-shrink:0;margin:7.5px 0}.flex-view{padding:12.5px 0;border-bottom:1px solid rgba(0,180,255,0.5)}.input-btn{display:flex;align-items:center}.input-btn>span{font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#FFFFFF;padding-left:8px}.btn{margin:0 8px;padding:0 20px;border-radius:3px;height:40px;display:flex;align-items:center;justify-content:center;font-size:16px;font-family:Microsoft YaHei;font-weight:bold;color:#FFFFFF;cursor:pointer;white-space:nowrap}.btn>img{margin-right:10px;width:14px;height:14px}.btn.green{background:#00BB88}.btn.blue{background:#0294E2}.irrigateSet .open-btn{width:300px;height:54px;background:#003070;border:1px solid rgba(2,148,226,0.5);border-radius:5px;display:flex;align-items:center;justify-content:center;font-size:18px;font-family:Microsoft YaHei;font-weight:bold;color:#00C8FF;margin:7.5px 10px;cursor:pointer}.irrigateSet .open-btn>img{margin-right:10px}.irrigateSet .open-btn.active{color:#FFFFFF;background:#0294E2;border-color:#0294E2}.PIDSet .flex-view{border-bottom:none}.PIDSet .PIDSet-view{width:400px;height:470px;background:rgba(0,132,255,0.15);border:2px solid rgba(0,186,255,0.35);margin:7.5px 10px}.PIDSet .PID-input-content{width:100%;height:calc(100% - 43px);padding:30px 0;display:flex;flex-direction:column;justify-content:space-between}.PIDSet .PID-input{display:flex;align-items:center}.PIDSet .PID-input>div{width:114px;margin-right:10px;font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#FFFFFF;text-align:right}.PIDSet .PID-input input{width:240px;height:44px;background:rgba(0,186,255,0.15);border:2px solid rgba(0,186,255,0.4);padding-left:15px;font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#fff}.PIDSet .PID-input input::placeholder{color:#859BB6}.PIDSet .PID-input-content-full{width:100%;height:calc(100% - 43px);padding:30px 0;display:flex;flex-direction:column;justify-content:space-between;align-items:center}.PIDSet .PID-input-full>div{font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#FFFFFF;margin-bottom:9px}.PIDSet .PID-input-full input{width:350px;height:44px;background:rgba(0,186,255,0.15);border:2px solid rgba(0,186,255,0.4);padding-left:15px;font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#fff}.PIDSet .PID-input-full input::placeholder{color:#859BB6}.systemSet .system-tips{background:rgba(0,92,178,0.15);border:2px solid rgba(0,186,255,0.2);width:100%;padding:20px;font-size:14px;font-family:Microsoft YaHei;font-weight:400;color:#A8B6C8}.upload .upload-view{width:520px;height:520px;margin:7.5px 10px;background:rgba(0,132,255,0.15);border:2px solid rgba(0,186,255,0.35)}.upload .upload-view .upload-title{background:url(../image/title-172.png) no-repeat center;background-size:172px 43px;background-position:left center;min-width:172px}.upload .upload-content{width:100%;height:calc(100% - 43px);display:grid;grid-template-columns:repeat(2, 1fr);grid-row-gap:20px;grid-column-gap:20px;padding:19px 30px}.upload .upload-content>div{display:flex;align-items:center;cursor:pointer;white-space:nowrap}.upload .upload-content>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%}.upload .upload-content>div .sel{margin-right:10px;width:35px;height:35px;background:url(../image/radio.png) no-repeat center;background-size:100% 100%}.sensorSet .sensor-view{display:flex;align-items:center;justify-content:space-between;width:100%;height:520px;margin-top:30px}.sensorSet .sensor-view .left{width:200px;padding:0 10px;height:100%;background:rgba(0,92,178,0.15);border:2px solid rgba(0,186,255,0.2)}.sensorSet .sensor-view .left>div{cursor:pointer;width:100%;height:73px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid rgba(0,180,255,0.25)}.sensorSet .sensor-view .left>div>div{font-size:16px;font-family:Microsoft YaHei;font-weight:400;color:#A8B6C8}.sensorSet .sensor-view .left>div.active>div{width:100%;display:flex;align-items:center;justify-content:center;height:40px;background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.3);color:#fff}.sensorSet .sensor-view .right{width:calc(100% - 220px);height:100%;background:rgba(0,92,178,0.15);border:2px solid rgba(0,186,255,0.2)}.sensorSet .sensor-view .right .right-top{width:100%;padding:30px 0px 30px 75px;border-bottom:1px solid rgba(0,180,255,0.35)}.sensorSet .sensor-view .right .right-top .input-sel{margin:30px 0}.sensorSet .sensor-view .right .right-top .input-sel>.title{margin-bottom:11px}.sensorSet .sensor-view .right .right-top .right-sel{display:flex;align-items:center}.sensorSet .sensor-view .right .right-top .right-sel>div{display:flex;align-items:center;cursor:pointer;white-space:nowrap;margin-right:30px}.sensorSet .sensor-view .right .right-top .right-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-view .right .right-top .right-sel>div .sel{margin-right:10px;width:35px;height:35px;background:url(../image/radio.png) no-repeat center;background-size:100% 100%}.sensorSet .sensor-view .right .right-bottom{padding:40px 0 0 75px}.sensorSet .sensor-view .right .right-bottom>div{display:flex;align-items:center;margin-bottom:30px}.sensorSet .sensor-view .right .right-bottom>div>div{margin-right:30px}.el-dialog__wrapper .el-dialog{background:rgba(0,59,114,0.8);border:2px solid rgba(0,186,255,0.35)}.el-dialog__wrapper .el-dialog .el-dialog__header{display:none}.el-dialog__wrapper .el-dialog .el-dialog__body{padding:0}.el-dialog__wrapper .el-dialog .el-dialog__body .model-return{padding:20px;display:flex;align-items:center;justify-content:flex-end}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top{padding:20px 15px;border-bottom:1px solid rgba(0,180,255,0.35);display:flex;align-items:center;justify-content:space-between}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top.model2-top{justify-content:flex-start}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top.model3-top .btn{padding:0 10px}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top.model3-top .btn img{width:26px;height:22px}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top.model4-top{align-items:flex-start}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top.model4-top .btn{padding:0 10px}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top.model4-top .btn img{width:22px;height:24px}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top .btn img{width:10px;height:14px}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top .model-right>div{display:flex;align-items:center;margin-bottom:20px}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top .model-right>div .number{width:30px;margin-right:10px;height:30px;background:#0294E2;border-radius:50%;display:flex;align-items:center;justify-content:center}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top .model-right>div .input-main-80{width:auto}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-bottom{padding:20px 15px;border-bottom:1px solid rgba(0,180,255,0.35)}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-bottom.model3-bottom .title{padding:0 4px}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-bottom .model1-content>div{display:flex;align-items:center;padding:10px 0}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-bottom .model1-content>div .number{width:30px;margin-right:10px;height:30px;background:#0294E2;border-radius:50%;display:flex;align-items:center;justify-content:center}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-bottom .model1-content .input-main-80 span{font-size:20px}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-bottom .model1-content .input-main-80 span.text{font-size:16px;padding:0 4px;flex-shrink:0}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-bottom .model1-content.model3-content{display:flex;align-items:center;flex-wrap:wrap}.el-dialog__wrapper .el-dialog .el-dialog__body .model1-bottom .model1-content.model3-content>div{display:block;width:calc(100% / 3);flex-shrink:0}.login .login-header{position:relative;width:100%;height:76px;background:rgba(0,180,255,0.1);border-bottom:2px solid rgba(0,180,255,0.3)}.login .login-header>img{width:373px;height:99px}.login .login-view{width:520px;height:570px;background:rgba(122,219,255,0.1);border:2px solid rgba(122,219,255,0.66);border-radius:10px;position:fixed;right:5%;top:50%;transform:translateY(-50%);padding-top:59px;display:flex;flex-direction:column;align-items:center}.login .login-view .login-title{width:344px;height:45px;background:url(../image/login-title.png) no-repeat center;background-size:344px 15px;background-position:center bottom;display:flex;align-items:center;justify-content:center;padding-bottom:11px}.login .login-view .login-title>img{width:30px;height:34px;margin-right:9px}.login .login-view .login-title span{font-size:30px;font-family:Alibaba PuHuiTi;font-weight:bold;color:#FFFFFF;background:linear-gradient(0deg, #fff 0%, #BFE7FF 19.99512%, #fff 60.00977%);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.login .login-view .login-input{width:450px;height:63px;background:rgba(122,219,255,0.05);border:2px solid rgba(134,214,255,0.15);border-radius:7px;position:relative}.login .login-view .login-input.active{background:rgba(122,219,255,0.1);border:2px solid rgba(122,219,255,0.66)}.login .login-view .login-input>img{position:absolute;left:25px;top:50%;transform:translateY(-50%)}.login .login-view .login-input>input{width:450px;height:63px;padding-left:72px;background:transparent;border:none;font-size:20px;font-family:Alibaba PuHuiTi;font-weight:400;color:#FFFFFF}.login .login-view .login-input>input::placeholder{color:#FFFFFF}.login .login-view .login-input.username{margin-top:53px}.login .login-view .login-input.password{margin:38px 0 20px}.login .login-view .save{width:450px}.login .login-view .save>div{width:150px;display:flex;font-size:18px;font-family:Alibaba PuHuiTi;color:#FFFFFF;align-items:center;cursor:pointer}.login .login-view .save>div>div{width:20px;height:20px;border:2px solid rgba(122,219,255,0.66);margin-right:12px;display:flex;align-items:center;justify-content:center;border-radius:3px}.login .login-view .login-btn{width:400px;height:63px;background:#0294E2;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:24px;font-family:Alibaba PuHuiTi;font-weight:400;color:#FFFFFF;margin-top:85px;cursor:pointer}.realTime{width:100%;height:100%;padding:20px}.realTime .page-content{position:relative;width:100%;height:100%;background:rgba(0,92,178,0.15);border:2px solid rgba(0,186,255,0.2);padding:20px 30px}.realTime .page-content .timeNow{text-align:center;position:absolute;right:30px;top:42px;width:240px;display:flex;align-items:center;font-size:24px;font-family:Arial;font-weight:bold;color:#8BEAFF}.realTime .page-content .timeNow>span{font-size:24px;font-family:Arial;font-weight:bold;color:#8BEAFF;margin-left:10px}.realTime .page-content .realTime-list{width:100%;overflow:hidden}.realTime .page-content .realTime-list .seamless-warp{display:flex;align-items:center}.realTime .page-content .realTime-list .seamless-warp>div{display:flex;overflow:unset !important}.realTime .page-content .realTime-list .seamless-warp>div>div{display:flex;align-items:center;flex-shrink:0;margin-right:100px}.realTime .page-content .realTime-list .seamless-warp .list-view{flex-shrink:0;display:flex;flex-direction:column;align-items:center;margin-right:20px}.realTime .page-content .realTime-list .seamless-warp .list-view img{width:80px;height:80px}.realTime .page-content .realTime-list .seamless-warp .list-view .text{margin:5px 0}.realTime .page-content .realTime-list .seamless-warp .list-view .number{width:106px;height:40px;background:url(../image/real-time-text.png) no-repeat center;background-size:100% 100%;font-size:20px;font-family:Arial;font-weight:bold;color:#FFFFFF;display:flex;align-items:center;justify-content:center}.realTime .page-content .flex-list{display:flex;align-items:center;justify-content:space-around}.realTime .page-content .realTime-bottom{height:440px;margin-top:30px}.realTime .page-content .realTime-bottom>div{flex-shrink:0}.realTime .page-content .realTime-bottom .left{width:43%;height:100%;background:rgba(0,132,255,0.15);border:2px solid rgba(0,186,255,0.35);display:flex;align-items:center;justify-content:center;padding:10px}.realTime .page-content .realTime-bottom .left>div{width:100%;height:100%}.realTime .page-content .realTime-bottom .left>div .video-js{width:100%;height:100%}.realTime .page-content .realTime-bottom .right{width:calc(100% - 43%);min-width:230px;height:100%}.history .page-content{width:100%}.history .page-content .el-table--scrollable-x .el-table__body-wrapper .el-table__row{height:60px}.history .page-content .search-flex{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;width:100%;margin-top:20px}.history .page-content .search-flex .search-left{display:flex;align-items:center;flex-shrink:0;padding:15px 0}.history .page-content .search-flex .search-left>div{display:flex;align-items:center}.history .page-content .search-flex .search-left>div>div{margin-left:10px;width:80px;height:34px;background:rgba(0,186,255,0.15);border:2px solid rgba(0,186,255,0.4);display:flex;align-items:center;justify-content:center;border-radius:3px;cursor:pointer}.history .page-content .search-flex .search-left>div>div.active{border:2px solid #0294E2;background:#0294E2}.history .page-content .search-flex .search-right{display:flex;align-items:center;flex-shrink:0;padding:15px 0}.history .page-content .search-flex .search-right span{margin-right:10px}.history .page-content .search-flex .search-right .el-input__inner{height:44px;background:rgba(0,186,255,0.15);border:2px solid rgba(0,186,255,0.4)}.history .page-content .search-flex .search-right .el-date-editor .el-range-separator{color:#fff}.history .page-content .search-flex .search-right .el-date-editor .el-range-input{background-color:transparent;color:#fff}.dataAnalysis .page-content .search-flex{display:flex;align-items:center;justify-content:center}.dataAnalysis .page-content .analysis-charts{width:100%;height:560px}.dataAnalysis .page-content .analysis-charts>div{width:100%;height:100%}.systemManage .page-content .manage-sel{display:flex;align-items:center;padding:20px 0;border-bottom:1px solid rgba(0,180,255,0.35)}.systemManage .page-content .manage-sel>div{margin-right:20px;padding:0 20px;height:40px;background:rgba(0,186,255,0.15);border:2px solid rgba(0,186,255,0.4);display:flex;align-items:center;justify-content:center;border-radius:3px;cursor:pointer}.systemManage .page-content .manage-sel>div>img{width:14px;height:auto;margin-right:5px}.systemManage .page-content .manage-sel>div.active{border:2px solid #0294E2;background:#0294E2}.systemManage .page-content .manage-content{width:100%;height:calc(100% - 160px)}.systemManage .page-content .manage-content .manage-input{margin-bottom:25px}.systemManage .page-content .manage-content .manage-input>div{margin-bottom:10px}.systemManage .page-content .manage-content .manage-input>input{width:500px;height:44px;background:rgba(0,186,255,0.15);border:2px solid rgba(0,186,255,0.4);padding:0 15px}.systemManage .page-content .manage-content .manage-input>input::placeholder{color:#859bb6}.systemManage .page-content .manage-content .manage-btn{width:300px;height:60px;background:#0294E2;border-radius:10px;margin-top:25px;display:flex;align-items:center;justify-content:center;font-size:20px}.systemManage .page-content .manage-content.manage-content-input{height:400px;display:flex;align-items:center;justify-content:center;flex-direction:column}.systemManage .page-content .manage-content.manage-content-form{margin-top:15px;display:flex;align-items:center;flex-direction:column}.systemManage .page-content .manage-content.manage-content-form .manage-input>input{width:660px}.systemManage .page-content .manage-content.manage-content-form .manage-html>div{margin-bottom:10px}.systemManage .page-content .manage-content.manage-content-form .manage-html>.html{width:660px;height:120px;background:rgba(0,186,255,0.15);border:2px solid rgba(0,186,255,0.4)} diff --git a/src/assets/css/main.scss b/src/assets/css/main.scss index 19a2df2..12d088f 100644 --- a/src/assets/css/main.scss +++ b/src/assets/css/main.scss @@ -33,6 +33,16 @@ } +.el-date-table td span, +.el-date-range-picker__header div { + color: #606266; +} + +.el-date-table td.end-date div span, +.el-date-table td.start-date div span { + color: #fff !important; +} + .el-dropdown-menu { max-height: 300px; @extend .scroll; @@ -224,6 +234,7 @@ background: url(../image/index-background.png) no-repeat; background-size: 1920px 1080px; background-position: center top; + .no-list { color: #fff; display: flex; @@ -1431,55 +1442,63 @@ margin-left: 10px; } } - .realTime-list{ + + .realTime-list { width: 100%; overflow: hidden; - .seamless-warp{ + + .seamless-warp { + display: flex; + align-items: center; + + >div { + // width: 100%!important; display: flex; - align-items: center; - >div{ - // width: 100%!important; + overflow: unset !important; + + >div { display: flex; - overflow: unset!important; - >div{ - display: flex; - align-items: center; - flex-shrink: 0; - } - } - .list-view { - flex-shrink: 0; - display: flex; - flex-direction: column; align-items: center; - margin-right: 20px; - img { - width: 80px; - height: 80px; - - } - - .text { - margin: 5px 0; - } - - .number { - width: 106px; - height: 40px; - background: url(../image/real-time-text.png) no-repeat center; - background-size: 100% 100%; - font-size: 20px; - font-family: Arial; - font-weight: bold; - color: #FFFFFF; - display: flex; - align-items: center; - justify-content: center; - } + flex-shrink: 0; + margin-right: 100px; } } - + + .list-view { + flex-shrink: 0; + display: flex; + flex-direction: column; + align-items: center; + margin-right: 20px; + + img { + width: 80px; + height: 80px; + + } + + .text { + margin: 5px 0; + } + + .number { + width: 106px; + height: 40px; + background: url(../image/real-time-text.png) no-repeat center; + background-size: 100% 100%; + font-size: 20px; + font-family: Arial; + font-weight: bold; + color: #FFFFFF; + display: flex; + align-items: center; + justify-content: center; + } + } + } + } + .flex-list { display: flex; align-items: center; @@ -1498,7 +1517,7 @@ } .left { - width:43%; + width: 43%; height: 100%; background: rgba(0, 132, 255, 0.15); border: 2px solid rgba(0, 186, 255, 0.35); @@ -1508,7 +1527,7 @@ padding: 10px; >div { - width:100%; + width: 100%; height: 100%; .video-js { @@ -1525,4 +1544,217 @@ } } } +} + +.history { + .page-content { + width: 100%; + + .el-table--scrollable-x .el-table__body-wrapper { + @extend .scroll; + + .el-table__row { + height: 60px; + } + } + + .search-flex { + display: flex; + align-items: center; + justify-content: space-between; + flex-wrap: wrap; + width: 100%; + margin-top: 20px; + + .search-left { + display: flex; + align-items: center; + flex-shrink: 0; + padding: 15px 0; + + span {} + + >div { + display: flex; + align-items: center; + + >div { + margin-left: 10px; + width: 80px; + height: 34px; + background: rgba(0, 186, 255, 0.15); + border: 2px solid rgba(0, 186, 255, 0.4); + display: flex; + align-items: center; + justify-content: center; + border-radius: 3px; + cursor: pointer; + + &.active { + border: 2px solid #0294E2; + background: #0294E2; + } + } + } + } + + .search-right { + display: flex; + align-items: center; + flex-shrink: 0; + padding: 15px 0; + + span { + margin-right: 10px; + } + + .el-input__inner { + height: 44px; + background: rgba(0, 186, 255, 0.15); + border: 2px solid rgba(0, 186, 255, 0.40); + } + + .el-date-editor .el-range-separator { + color: #fff; + } + + .el-date-editor .el-range-input { + background-color: transparent; + color: #fff; + } + } + } + } +} + +.dataAnalysis { + .page-content { + .search-flex { + display: flex; + align-items: center; + justify-content: center; + } + + .analysis-charts { + width: 100%; + height: 560px; + + >div { + width: 100%; + height: 100%; + } + } + } +} + +.systemManage { + .page-content { + .manage-sel { + display: flex; + align-items: center; + padding: 20px 0; + border-bottom: 1px solid rgba(0, 180, 255, .35); + + >div { + margin-right: 20px; + padding: 0 20px; + height: 40px; + background: rgba(0, 186, 255, 0.15); + border: 2px solid rgba(0, 186, 255, 0.4); + display: flex; + align-items: center; + justify-content: center; + border-radius: 3px; + cursor: pointer; + + >img { + width: 14px; + height: auto; + margin-right: 5px; + } + + &.active { + border: 2px solid #0294E2; + background: #0294E2; + } + } + } + + .manage-content { + width: 100%; + height: calc(100% - 160px); + + .manage-input { + margin-bottom: 25px; + + >div { + margin-bottom: 10px; + } + + >input { + width: 500px; + height: 44px; + background: rgba(0, 186, 255, 0.15); + border: 2px solid rgba(0, 186, 255, 0.40); + padding: 0 15px; + + &::placeholder { + color: rgba(133, 155, 182, 1); + } + } + } + + .manage-btn { + width: 300px; + height: 60px; + background: #0294E2; + border-radius: 10px; + margin-top: 25px; + display: flex; + align-items: center; + justify-content: center; + font-size: 20px; + } + + &.manage-content-input { + height: 400px; + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + + } + + &.manage-content-form { + margin-top: 15px; + display: flex; + align-items: center; + flex-direction: column; + .manage-input { + + >input { + width: 660px; + + } + } + + .manage-html { + >div { + margin-bottom: 10px; + } + + >.html { + width: 660px; + height: 120px; + background: rgba(0, 186, 255, 0.15); + border: 2px solid rgba(0, 186, 255, 0.40); + + >div { + + } + } + } + } + } + } } \ No newline at end of file diff --git a/src/assets/image/analysis.png b/src/assets/image/analysis.png new file mode 100644 index 0000000..9885300 Binary files /dev/null and b/src/assets/image/analysis.png differ diff --git a/src/assets/image/compose.png b/src/assets/image/compose.png new file mode 100644 index 0000000..71192c3 Binary files /dev/null and b/src/assets/image/compose.png differ diff --git a/src/assets/image/history.png b/src/assets/image/history.png new file mode 100644 index 0000000..72c4cdc Binary files /dev/null and b/src/assets/image/history.png differ diff --git a/src/assets/image/user.png b/src/assets/image/user.png new file mode 100644 index 0000000..eabce58 Binary files /dev/null and b/src/assets/image/user.png differ diff --git a/src/assets/js/charts.js b/src/assets/js/charts.js index 0ebc371..abd2c0a 100644 --- a/src/assets/js/charts.js +++ b/src/assets/js/charts.js @@ -13,17 +13,21 @@ export function realTimeLine(id,data) { var data7=[]//1#水肥EC var data8=[]//2#水肥EC var data9=[]//1#空气温度 + var data10=[]//1#管道压力 data.forEach((el,index)=>{ Xdata.push(el.time) data1.push(el.value['目标水肥PH']) data2.push(el.value['目标水肥EC']) - data3.push(el.value['平均值水肥PH']) - data4.push(el.value['平均值水肥EC']) + data3.push(el.value['1#平均水肥EC']) + data4.push(el.value['1#平均水肥PH']) data5.push(el.value['1#水肥PH']) data6.push(el.value['2#水肥PH']) data7.push(el.value['1#水肥EC']) data8.push(el.value['2#水肥EC']) + data10.push(el.value['1#管道压力']) data9.push(el.value['1#空气温度']) + + }) console.log(data1,data2); var list = [ @@ -404,6 +408,48 @@ export function realTimeLine(id,data) { borderWidth: 1, }, }, + }, + { + name: '1#管道压力', + data: data9, + type: "line", + symbol: "circle", + smooth: true, + symbolSize: 5, + showSymbol: false, + lineStyle: { + normal: { + width: 2, + }, + }, + areaStyle: { + normal: { + color: new echarts.graphic.LinearGradient( + 0, + 0, + 0, + 1, + [ + { + offset: 0, + color: "rgba(255, 156, 154, 0.50)", + }, + { + offset: 0.8, + color: "rgba(255, 156, 154, 0)", + }, + ], + false + ), + }, + }, + itemStyle: { + normal: { + color: "rgba(255, 156, 154, 1)", + borderColor: "rgba(255, 156, 154, 1)", + borderWidth: 1, + }, + }, }] var option = { tooltip: { diff --git a/src/assets/ttf.zip b/src/assets/ttf.zip new file mode 100644 index 0000000..accb2af Binary files /dev/null and b/src/assets/ttf.zip differ diff --git a/src/components/setParams.vue b/src/components/setParams.vue index 0bb7636..d25b77e 100644 --- a/src/components/setParams.vue +++ b/src/components/setParams.vue @@ -77,9 +77,9 @@ export default { store.nameList.forEach((el,index)=>{ if(index<8){ if(store.equipmentName['fertilization'+store.nameList[index]]){ - console.log(store.equipmentName,2); + // store.equipmentName['fertilization'+store.nameList[index]] this.routerList[0].list.push({ - name:store.equipmentName['fertilization'+store.nameList[index]], + name:'配方'+(index+1), status: -1, index:index+1, router: 'formula' diff --git a/src/router/index.js b/src/router/index.js index 3f568ff..e95e899 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -56,6 +56,18 @@ const routes = [ path: '/sensorSet', name: 'sensorSet', component: () => import('../views/page/sensorSet.vue') + },{ + path: '/history', + name: 'history', + component: () => import('../views/page/history.vue') + },{ + path: '/dataAnalysis', + name: 'dataAnalysis', + component: () => import('../views/page/dataAnalysis.vue') + },{ + path: '/systemManage', + name: 'systemManage', + component: () => import('../views/page/systemManage.vue') },] }, ] diff --git a/src/store/index.js b/src/store/index.js index 7903167..d0cfb26 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -6,6 +6,7 @@ Vue.use(Vuex) export default new Vuex.Store({ state: { lateSend: 100,//写入停止后 *100毫秒进行发送 例如10*100就是1000毫秒(1s) + lateSendBtn: 10,//写入停止后 *100毫秒进行发送 例如10*100就是1000毫秒(1s) equipmentList: [],//当前账户施肥设备 equipmentIndex: 1,//当前在第几个设备 equipmentName: null,//当前设备 小设备的各个名字 diff --git a/src/views/index.vue b/src/views/index.vue index 9419509..8411880 100644 --- a/src/views/index.vue +++ b/src/views/index.vue @@ -64,16 +64,19 @@ export default { { name: '设定值参数', router: 'formula', index: 1, routerList: ['formula', 'irrigateSet', 'PIDSet', 'systemSet', 'upload', 'sensorSet'], 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') }, - { name: '历史数据', router: '', routerList: [], img: require('../assets/image/header-img3.png') }, - { name: '图库数据', router: '', routerList: [], img: require('../assets/image/header-img4.png') }, + // history history + { 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: '', routerList: [], img: require('../assets/image/header-img5.png') }, - { name: '管理', router: '', routerList: [], img: require('../assets/image/header-img6.png') }], + //systemManage systemManage + { name: '管理', router: '', routerList: [''], img: require('../assets/image/header-img6.png') }], activeNames: [4], 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'], img: require('../assets/image/left-img2.png'), list: [] },], + { name: '施肥机', routerList: ['formula', 'irrigateSet', 'PIDSet', 'systemSet', 'upload', 'sensorSet', 'realTime','history','dataAnalysis'], img: require('../assets/image/left-img2.png'), list: [] },], routerNow: 'realTime', routerIndex: 1, equipmentList: [], @@ -189,6 +192,12 @@ export default { this.$store.state.equipmentIndex = item.index this.$router.push({ path: `/${item.router}?index=${item.index ? item.index : 1}` }) + }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) { + this.$router.push({ path: `/dataAnalysis?index=${item.index ? item.index : 1}` }) + } else if (item.router != this.routerNow && !item.http) { this.$router.push({ name: item.router }) } @@ -203,12 +212,15 @@ export default { } 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 { + } 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'){ + this.$router.push({ path: `/history?index=${item.index ? item.index : 1}` }) + } else if(this.routerNow == 'dataAnalysis'){ + this.$router.push({ path: `/dataAnalysis?index=${item.index ? item.index : 1}` }) } - } else if (item.router != this.routerNow && !item.http) { + } else if (item.router != this.routerNow && !item.http) { this.$router.push({ name: item.router }) } } else { diff --git a/src/views/page/dataAnalysis.vue b/src/views/page/dataAnalysis.vue new file mode 100644 index 0000000..20906f6 --- /dev/null +++ b/src/views/page/dataAnalysis.vue @@ -0,0 +1,66 @@ + + + + + \ No newline at end of file diff --git a/src/views/page/formula.vue b/src/views/page/formula.vue index 569cf56..ff8acbe 100644 --- a/src/views/page/formula.vue +++ b/src/views/page/formula.vue @@ -21,13 +21,13 @@
目标PH值 -
目标EC值 -
@@ -65,7 +65,7 @@
{{ scope.row.data3 }} - @@ -74,7 +74,7 @@
{{ scope.row.data3 }} - @@ -294,7 +294,22 @@ export default { value: el.target.value * 10 } }; + console.log(data,11); this.change(code, data) + }, + //失去焦点 + blurChangeCount(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); + } + }, //计算数据 /10 countData1(data) { diff --git a/src/views/page/history.vue b/src/views/page/history.vue new file mode 100644 index 0000000..7c1dc6e --- /dev/null +++ b/src/views/page/history.vue @@ -0,0 +1,129 @@ + + + + + \ No newline at end of file diff --git a/src/views/page/irrigateSet.vue b/src/views/page/irrigateSet.vue index 6cd1a40..863b29d 100644 --- a/src/views/page/irrigateSet.vue +++ b/src/views/page/irrigateSet.vue @@ -874,7 +874,7 @@ export default { value: parseInt(num, 2), }, }; - this.change(10 + (this.indexs - 1) + "00", dataNum); + this.changeBtn(10 + (this.indexs - 1) + "00", dataNum); }, padString(str, length) { return str.padStart(length, '0'); @@ -920,7 +920,7 @@ export default { value: parseInt(num, 2), }, }; - this.change(10 + (this.indexs - 1) + "59", dataNum); + this.changeBtn(10 + (this.indexs - 1) + "59", dataNum); }, getType() { var number =this.padString( this.inputData[10 + (this.indexs - 1) + "59"].toString(2),4) @@ -993,6 +993,31 @@ selectValue(e) { } }, + 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 diff --git a/src/views/page/realTime.vue b/src/views/page/realTime.vue index 663b6ef..73766eb 100644 --- a/src/views/page/realTime.vue +++ b/src/views/page/realTime.vue @@ -180,15 +180,15 @@ export default { // } if(el.equipmentNumber==0){ if(el.targetValue==1){ - name=el.environmentDataId+'(目标值)' + name='目标'+el.environmentDataId }else{ - name=el.environmentDataId+'(1号平均值)' + name='1#平均'+el.environmentDataId } }else if(el.equipmentNumber==15){ if(el.targetValue==1){ - name=el.environmentDataId+'(目标值)' + name='目标'+el.environmentDataId }else{ - name=el.environmentDataId+'(2号平均值)' + name='2#平均'+el.environmentDataId } }else{ name=el.equipmentNumber+'#'+el.environmentDataId @@ -212,7 +212,6 @@ export default { var data1 = store.equipmentList[this.indexs - 1].deviceId this.api.postFsdata(data1).then(res => { - console.log(res.data, 11); if (res.data.code == 200) { var chartsData=res.data.data realTimeLine('realTime-line',chartsData) diff --git a/src/views/page/sensorSet.vue b/src/views/page/sensorSet.vue index 9959aae..1256897 100644 --- a/src/views/page/sensorSet.vue +++ b/src/views/page/sensorSet.vue @@ -130,7 +130,7 @@ export default { value:command, }, }; - this.change(this.numberList[this.active], dataNum); + this.changeBtn(this.numberList[this.active], dataNum); }, getSensorType(){ this.typeList.forEach((el,index)=>{ @@ -163,7 +163,7 @@ export default { value: parseInt(listNew, 2), }, }; - this.change('272', dataNum); + this.changeBtn('272', dataNum); }, getData272() { var inputData = this.inputData @@ -213,6 +213,31 @@ selectValue(e) { 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 diff --git a/src/views/page/status.vue b/src/views/page/status.vue index 6b67b76..cc29b4e 100644 --- a/src/views/page/status.vue +++ b/src/views/page/status.vue @@ -288,6 +288,7 @@ export default { const that = this; if (localStorage.getItem('token')) { that.getEqbyid(); + this.getReg() setTimeout(() => { that.pageTimer && clearInterval(that.pageTimer) that.pageTimer = setInterval(() => { @@ -525,7 +526,7 @@ export default { var data = { "equipmentId": deviceDetail.deviceId, "pattern": 0,//需要根据文档填写 //6目标ph-数值 - "regNum": 71 + "regNum": 72 } var week = [ "星期日", @@ -542,7 +543,7 @@ export default { this.getData30() //数据30/进水出水泵 this.getData29()//数据29 启动方式/信号 - this.getReg() + this.getleft2List()//获取左下角数据 this.getrightList3()//获取又下角数据 this.getcenterBottom()//获取电磁阀 @@ -570,7 +571,7 @@ export default { return i; }, getReg() { - var deviceDetail = this.deviceDetail + var deviceDetail = store.equipmentList[store.equipmentIndex - 1] //获取传感器种类 var data1 = { equipmentId: deviceDetail.deviceId, diff --git a/src/views/page/systemManage.vue b/src/views/page/systemManage.vue new file mode 100644 index 0000000..f65b4aa --- /dev/null +++ b/src/views/page/systemManage.vue @@ -0,0 +1,62 @@ + + + + + \ No newline at end of file diff --git a/src/views/page/systemSet.vue b/src/views/page/systemSet.vue index c85c966..ae2160e 100644 --- a/src/views/page/systemSet.vue +++ b/src/views/page/systemSet.vue @@ -90,8 +90,8 @@ export default { var store = this.$store.state var data = { equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId, - pattern: 55, //需要根据文档填写 //6目标ph-数值 - regNum: 17, + pattern: 0, //需要根据文档填写 //6目标ph-数值 + regNum: 72, }; this.api.postState(data).then((res) => { console.log(res, 11); diff --git a/src/views/page/upload.vue b/src/views/page/upload.vue index a7a184e..302d74e 100644 --- a/src/views/page/upload.vue +++ b/src/views/page/upload.vue @@ -120,6 +120,7 @@ export default { this.actList2.push(this.actList2New.length-index-1) } }) + console.log(this.actList2); }, dataInit() { this.actList1New = [] @@ -164,6 +165,31 @@ selectValue(e) { 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 @@ -210,6 +236,7 @@ selectValue(e) { } 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' }) @@ -220,7 +247,7 @@ selectValue(e) { value: parseInt(num, 2), }, }; - this.change('500', dataNum); + this.changeBtn('500', dataNum); }, selList2(index) { if (this.actList2.indexOf(index) == -1) { @@ -228,17 +255,18 @@ selectValue(e) { } 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' }) - + console.log(this.actList2,this.actList2New,this.actList2New.join("")); var num = this.actList2New.join(""); var dataNum = { target: { value: parseInt(num, 2), }, }; - this.change('501', dataNum); + this.changeBtn('501', dataNum); }, },