diff --git a/src/api/aircAndWindc/index.js b/src/api/aircAndWindc/index.js index c68fd65..324ff36 100644 --- a/src/api/aircAndWindc/index.js +++ b/src/api/aircAndWindc/index.js @@ -8,3 +8,20 @@ export function windList(query) { params: query, }); } + +//查询定时开关列表 +export function timeList(query) { + return request({ + url: "/device/ahu/monitor/timeList", + method: "get", + params: query, + }); +} +//修改定时开关 +export function undateTime(query) { + return request({ + url: "/device/ahu/monitor/time", + method: "put", + params: query, + }); +} diff --git a/src/views/aircAndWindc/awSysMonitor/index.vue b/src/views/aircAndWindc/awSysMonitor/index.vue index 591f006..6a9d185 100644 --- a/src/views/aircAndWindc/awSysMonitor/index.vue +++ b/src/views/aircAndWindc/awSysMonitor/index.vue @@ -1,5 +1,5 @@ @@ -760,6 +1066,59 @@ export default { width: 13rem; height: 5.38rem; position: relative; + .menu-title { + color: #e1f4ff; + font-size: 0.18rem; + --bRadius: 0.05rem; + text-align: center; + position: absolute; + top: 0; + right: 0.5rem; + width: 1.25rem; + cursor: pointer; + z-index: 999; + div { + position: relative; + text-align: center; + border-radius: var(--bRadius); + transition: all 0.3s; + padding: 0.01rem 0.02rem; + background-color: rgba(85, 139, 211, 0.2); + cursor: pointer; + &::before, + &::after { + content: ""; + position: absolute; + top: -10px; + left: -10px; + right: -10px; + bottom: -10px; + border: 2px solid #46b2f1; + transition: all 0.5s; + border-radius: var(--bRadius); + animation: clippath 3s infinite linear; + cursor: pointer; + } + &::after { + animation: clippath 3s infinite -1.5s linear; + } + @keyframes clippath { + 0%, + 100% { + clip-path: inset(0 0 98% 0); + } + 25% { + clip-path: inset(0 98% 0 0); + } + 50% { + clip-path: inset(98% 0 0 0); + } + 75% { + clip-path: inset(0 0 0 98%); + } + } + } + } .wind-img { width: 13.1rem; height: 5.5rem; @@ -1157,6 +1516,60 @@ export default { } } } +.device-container { + display: flex; + flex-direction: column; + width: 100%; + min-height: 530px; + background-color: #142c4e; + padding: 10px 10px 30px 10px; + border-radius: 10px; + font-size: 14px; + .device-li { + width: 100%; + display: flex; + flex-direction: row; + align-items: center; + padding: 12px 0; + color: #abcdfc; + border-bottom: 1px dashed #0349ac; + .device-name { + flex: 1; + white-space: nowrap; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + flex-wrap: nowrap; + padding: 0 5px; + .slip { + margin: 0 5px; + color: #1282d8; + font-weight: bold; + } + } + } + .device-li:nth-child(1) { + color: #9ca3af; + } +} +// 媒体查询,适配大于2000px分辨率的大屏样式 +@media (min-width: 2000px) { + .device-container { + min-height: 7rem !important; + padding: 0.1rem 0.1rem 0.3rem 0.1rem !important; + border-radius: 0.1rem !important; + font-size: 0.14rem !important; + .device-li { + padding: 0.12rem 0 !important; + .device-name { + .slip { + margin: 0 0.05rem !important; + } + } + } + } +} @media (min-width: 1360px) and (max-width: 1680px) { .windC { transform: scale(0.9);