-
用户数
-
+
+
{{ weatherData.city }}
+
+
+ {{ weatherData.temperature }}℃ {{ weatherData.weather }}
+
@@ -384,12 +374,16 @@ onUnmounted(() => {
// };
// });
const doubleCount = (id: string, index: number) => {
+ const label = infoData.value[index].label;
const arr = infoData.value[index].header_main;
- const obj = arr.find((item: any) => item.id === id);
- const lable = obj != undefined ? `
${obj.label}${obj.value} ${obj.paramUnit}` : '';
+ const obj = arr?.find((item: any) => item.id === id);
+ const mainLable =
+ obj != undefined && obj?.value !== ''
+ ? `
${obj.label}(${label}):${obj.value === '' ? '--' : obj.value} ${obj.paramUnit}`
+ : '';
// const lable = obj != undefined ? `${obj.label}` : ''
// const value = obj != undefined ? `${obj.value}` : '0.0'
- return lable;
+ return mainLable;
};
console.log('doubleCount-', doubleCount);
diff --git a/src/views/monitoring/devicemanage/index.scss b/src/views/monitoring/devicemanage/index.scss
index 367c2fe..fec055d 100644
--- a/src/views/monitoring/devicemanage/index.scss
+++ b/src/views/monitoring/devicemanage/index.scss
@@ -142,10 +142,9 @@
overflow: hidden;
.dataInfo {
- padding: 5px 0;
-
span {
- display: block;
+ display: inline-block;
+ padding: 5px 0;
}
}
@@ -161,6 +160,13 @@
}
}
}
+ // .card.card_a{
+ // .dataInfo{
+ // span{
+ // display: inline-block;
+ // }
+ // }
+ // }
// .switch {
// position: absolute;
// z-index: 99;
@@ -185,23 +191,23 @@
.deviceImgA {
.card_a {
- top: 40%;
- left: 5%;
+ top: 50%;
+ left: 1%;
}
.card_b {
- top: 5%;
- left: 5%;
+ top: 18%;
+ left: 1%;
}
.card_c {
- top: 30%;
- right: 3%;
+ top: 35%;
+ right: 1%;
}
.card_f {
- top: 30%;
- right: 20%;
+ top: 35%;
+ right: 17%;
}
// .switch_a {
// width: 35px;
@@ -222,41 +228,51 @@
.deviceImgB {
.card_a {
top: 42%;
- left: 5%;
+ left: 2%;
}
.card_b {
top: 8%;
- left: 5%;
+ left: 2%;
}
.card_c {
top: 16%;
- right: 3%;
+ right: 2%;
}
.card_d {
top: 52%;
- right: 3%;
+ right: 2%;
}
.card_f {
top: 30%;
- right: 21%;
+ right: 18%;
}
}
.deviceImgC {
.card_a {
top: 6%;
- left: 6%;
+ left: 4%;
}
.card_b {
- top: 62%;
- left: 5%;
+ top: 40%;
+ left: 1%;
}
+ // .card_g {
+ // top: 60%;
+ // left: 5%;
+ // }
+
+ // .card_h {
+ // top: 80%;
+ // left: 5%;
+ // }
+
.card_c {
top: 2%;
right: 2%;
@@ -268,13 +284,13 @@
}
.card_e {
- top: 67%;
+ top: 68%;
right: 2%;
}
.card_f {
- top: 30%;
- right: 21%;
+ top: 36%;
+ right: 18%;
}
}
@@ -718,6 +734,7 @@
font-family: Arial;
font-size: 12px;
letter-spacing: 1px;
+ margin-top: 5px;
}
}
diff --git a/src/views/monitoring/screen/index.vue b/src/views/monitoring/screen/index.vue
index 2794411..0e6a7b8 100644
--- a/src/views/monitoring/screen/index.vue
+++ b/src/views/monitoring/screen/index.vue
@@ -78,7 +78,7 @@
-
+
Copyright © {{ $t('copyright.year') }} {{ $t('copyright.abbr') }} {{ $t('copyright.document') }}
diff --git a/src/views/monitoring/screenData/components/infoPanel.vue b/src/views/monitoring/screenData/components/infoPanel.vue
new file mode 100644
index 0000000..6a19090
--- /dev/null
+++ b/src/views/monitoring/screenData/components/infoPanel.vue
@@ -0,0 +1,149 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
{{ item.ext }}
+
{{ item.title }}
+
+
+
+ {{ res.name }}:
+
+ {{ res.unit }}
+
+
+
+
+
+
+
+
diff --git a/src/views/monitoring/screenData/components/main.vue b/src/views/monitoring/screenData/components/main.vue
new file mode 100644
index 0000000..708f260
--- /dev/null
+++ b/src/views/monitoring/screenData/components/main.vue
@@ -0,0 +1,565 @@
+
+
+
+
+
+
+
+
+
+
+ {{ row.gTitle }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/views/monitoring/screenData/components/menu.vue b/src/views/monitoring/screenData/components/menu.vue
new file mode 100644
index 0000000..e19fc83
--- /dev/null
+++ b/src/views/monitoring/screenData/components/menu.vue
@@ -0,0 +1,68 @@
+
+
+
+
+
+
diff --git a/src/views/monitoring/screenData/components/showTree.vue b/src/views/monitoring/screenData/components/showTree.vue
new file mode 100644
index 0000000..aa5bb54
--- /dev/null
+++ b/src/views/monitoring/screenData/components/showTree.vue
@@ -0,0 +1,299 @@
+
+
+
+
+
+ {{ data.field === 'deviceStatus' ? '状态' : data.title }}
+
+
+ 宽度(px):
+
+
+
+
+
+ 取消
+ {{ treeLoading ? '确认中' : '确认' }}
+
+
+
+
+
+
diff --git a/src/views/monitoring/screenData/index.scss b/src/views/monitoring/screenData/index.scss
new file mode 100644
index 0000000..e4154d2
--- /dev/null
+++ b/src/views/monitoring/screenData/index.scss
@@ -0,0 +1,752 @@
+@import url('@/assets/fonts/font.css');
+
+.screen {
+ position: relative;
+ width: 100%;
+ height: 100vh;
+ background-color: #dedede;
+ // background: url(@/assets/images/screen.png) no-repeat;
+ // background-color: var(--tableBg);
+ // background-size: 100% 100%;
+ // background-color: rgba(29,30,31,0.8);
+ // background-blend-mode: multiply;
+ padding: 0 25px;
+ overflow: hidden;
+
+ .menuShow {
+ width: 26px;
+ height: 26px;
+ position: absolute;
+ top: 118px;
+ left: 0;
+ color: #1169c0;
+ text-align: center;
+ // border: 1px solid #0d55b0;
+ // background-color: #02072e;
+ border-right: none;
+ cursor: pointer;
+
+ .iconfont {
+ display: inline-block;
+ }
+
+ .left {
+ transform: rotate(0deg);
+ -webkit-transform: rotate(0deg);
+ transition: transform 0.5s;
+ }
+
+ .right {
+ transform: rotate(180deg);
+ -webkit-transform: rotate(180deg);
+ transition: transform 0.5s;
+ }
+ }
+
+ .panelBtn {
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ width: 70%;
+ height: 45px;
+ text-align: center;
+ color: #1169c0;
+ // background: url(@/assets/images/panelBtn_bg.png) no-repeat center;
+ // background-size: 100% 100%;
+ transition: width 0.28s;
+ margin: 0 auto;
+ cursor: pointer;
+
+ .iconfont {
+ display: inline-block;
+ font-size: 18px;
+ }
+
+ .up {
+ transform: rotate(0deg);
+ -webkit-transform: rotate(0deg);
+ transition: transform 0.5s;
+ }
+
+ .down {
+ transform: rotate(180deg);
+ -webkit-transform: rotate(180deg);
+ transition: transform 0.5s;
+ }
+ .copyright {
+ width: 100%;
+ // height: 25px;
+ // line-height: 25px;
+ text-align: center;
+ color: #acaeb1;
+ font-family: Arial;
+ font-size: 12px;
+ letter-spacing: 1px;
+ }
+ }
+
+ .panelBtn.left {
+ left: 14%;
+ }
+
+ // .header {
+ // display: flex;
+ // justify-content: space-between;
+ // align-items: center;
+ // // height: 5.7rem;
+
+ // .title {
+ // width: 1500px;
+ // background: url(@/assets/images/title-bg.png);
+ // background-size: 100%;
+ // text-align: center;
+ // padding-bottom: 38px;
+ // margin: 0 auto;
+
+ // h3 {
+ // font-size: 3.8rem;
+ // font-family: 'YouSheBiaoTiHei';
+ // font-weight: 400;
+ // letter-spacing: 4px;
+ // background: linear-gradient(180deg, #FEFDFF 0%, #95DAFF 97%);
+ // background-clip: text;
+ // -webkit-background-clip: text;
+ // -webkit-text-fill-color: transparent;
+ // margin: 0;
+ // }
+ // }
+ // }
+
+ // .weather {
+ // display: flex;
+ // align-items: center;
+ // position: absolute;
+ // top: 2.5rem;
+ // left: 7rem;
+ // color: #B2D4FF;
+ // font-size: 1.6rem;
+ // line-height: 2.2rem;
+ // font-family: 'AlibabaPuHuiTiRegular';
+
+ // .line {
+ // width: 2px;
+ // height: 2rem;
+ // background: linear-gradient(to top, #000E38, #1EA8DD, #000E38);
+ // margin: 0 1rem;
+ // }
+
+ // .forecast {
+ // display: flex;
+ // align-items: center;
+
+ // img {
+ // width: 25px;
+ // margin-left: 10px;
+ // }
+ // }
+ // }
+
+ // .seeting {
+ // position: absolute;
+ // top: 2.5rem;
+ // right: 7rem;
+
+ // .tooltips {
+ // width: 36px;
+ // height: 36px;
+ // background: linear-gradient(180deg, #003269 1%, rgba(3, 79, 163, 0.2314) 56%, #003269 100%);
+ // border-radius: 0px 0px 0px 0px;
+ // opacity: 1;
+
+ // :deep(span) {
+ // color: #5beff9;
+ // }
+
+ // margin-left: 10px;
+ // }
+ // }
+
+ .layout {
+ display: flex;
+ // margin-top: 20px;
+
+ .sidebar {
+ width: 12%;
+ height: calc(100vh - 70px - 45px); //屏幕高度-头部header高度-底部高度
+ flex-shrink: 0;
+ border: 1px solid #b7babf;
+ padding: 10px 0;
+ // box-shadow: inset 0px 0px 10px 0px rgb(36, 90, 12);
+ margin-right: 1vw;
+ position: relative;
+ overflow: auto;
+ transition: width 0.28s;
+ // background-color: rgba(2, 8, 46, 0.8);
+
+ // .menu {
+ // text-align: center;
+
+ // :deep(.n-submenu) {
+ // --n-item-color-hover: auto;
+
+ // .n-menu-item {
+ // .n-menu-item-content {
+ // padding: 0 !important;
+
+ // .n-ellipsis {
+ // font-family: 'AlibabaPuHuiTiBold';
+ // padding: 0 15px;
+ // }
+ // }
+
+ // .n-menu-item-content-header {
+ // font-size: 2.4rem;
+ // color: #B1E3FF;
+ // }
+ // }
+
+ // .n-submenu-children {
+ // .n-menu-item-content-header {
+ // font-size: 1.8rem;
+ // }
+
+ // .n-menu-item-content--selected {
+ // .n-menu-item-content-header {
+ // color: #fff;
+
+ // .n-ellipsis {
+ // position: relative;
+
+ // span {
+ // padding: 0 10px;
+ // }
+
+ // span::before {
+ // content: '';
+ // position: absolute;
+ // left: 0;
+ // top: 0.7rem;
+ // width: 1.8rem;
+ // height: 1.8rem;
+ // background: url(../../../assets/images/taps.png) no-repeat;
+ // background-size: cover;
+ // }
+ // }
+ // }
+ // }
+
+ // .n-menu-item-content--selected::before {
+ // background: -webkit-linear-gradient(left, #1fc7ff29 0%, #1177e700 100%);
+ // left: 0;
+ // right: 0;
+ // }
+
+ // .n-menu-item-content--selected::after {
+ // content: '';
+ // position: absolute;
+ // bottom: 0;
+ // width: 100%;
+ // height: 2px;
+ // background: -webkit-linear-gradient(left, #1fc7ff29 0%, #1177e700 100%);
+ // }
+ // }
+
+ // .n-base-icon {
+ // color: #84e0f7;
+ // right: 10px;
+ // }
+ // }
+ // }
+ }
+
+ .sidebar.sidebarHide {
+ width: 0;
+ border: none;
+ margin-right: 0;
+ transition: width 0.28s;
+ }
+
+ .sidebar::after {
+ content: none;
+ position: absolute;
+ bottom: 0;
+ width: 100%;
+ height: 18rem;
+ background: url(@/assets/images/menu_bg.png) no-repeat;
+ background-size: 100% 100%;
+ }
+
+ .main {
+ position: relative;
+ width: 87%;
+ // background-color: rgba(2, 8, 46, 0.8);
+
+ .headerInfo {
+ border: 1px solid #0d55b0;
+ // box-shadow: inset 0px 0px 10px 0px rgb(36, 90, 124);
+ margin-bottom: 10px;
+
+ .header {
+ display: flex;
+ align-items: center;
+ flex-wrap: wrap;
+
+ .headerItem {
+ width: 11.1%;
+ color: #fff;
+ text-align: center;
+
+ .name {
+ font-size: 12px;
+ line-height: 36px;
+ padding: 0 3rem;
+ color: #ffffffb3;
+ background-color: #123f7580;
+ border-top: 1px solid #265a89;
+ border-bottom: 1px solid #265a89;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ overflow: hidden;
+ }
+
+ .value {
+ font-size: 18px;
+ color: #5beff9;
+ line-height: 36px;
+ }
+ }
+ }
+ }
+
+ .mainTable {
+ // height: calc(100vh - 8rem - 202px);
+ // height: calc(100% - 162px);
+ border: 1px solid #b7babf;
+ background-color: #dedede;
+ transition: height 0.28s;
+ overflow: hidden;
+
+ .tableGrid {
+ // --vxe-table-header-background-color: none;
+ // --vxe-table-body-background-color: none;
+ // --vxe-table-footer-background-color: none;
+ // --vxe-table-border-color: rgba(12, 80, 166, 0.2);
+ // --vxe-table-border-color: none;
+ --vxe-font-color: #000;
+ // --vxe-table-header-font-color: #ffffffb3;
+ // border: 1px solid #b7babf;
+ // box-shadow: inset 0px 0px 10px 0px rgb(36, 90, 124);
+
+ :deep(.vxe-table) {
+ // height: calc(100vh - 5.7rem - 60px) !important;
+ .vxe-table--body-wrapper {
+ background-color: #dedede;
+ // height: calc(100vh - 5.7rem - 182px) !important;
+ }
+
+ .headerRowClass {
+ .headerCellClass {
+ font-size: 18px;
+ font-weight: 800;
+ color: #eee;
+ background-color: #1169c0;
+ // border: 1px solid var(--vxe-font-color) !important;
+ border-left: none !important;
+
+ .vxe-resizable.is--line:before {
+ content: none;
+ }
+ }
+
+ // .headerCellClass:nth-child(1){
+ // border-left: none !important;
+ // }
+
+ .headerCellClass.col--fixed {
+ // background-color: #020e38;
+ // box-shadow: inset 0px 0px 10px 0px #245a7c;
+ }
+ }
+
+ .tableRowClass {
+ font-size: 18px;
+ font-weight: 500;
+ .tableCellClass {
+ background-color: #dedede;
+ border-bottom: 1px solid #b7babf !important;
+ border-right: 1px solid #b7babf !important;
+ border-right-color: #b7babf !important;
+ .vxe-cell {
+ font-family: 'AlibabaPuHuiTiRegular';
+ // color: #b1e3ff;
+
+ .title {
+ display: flex;
+ align-items: center;
+ text-align: left;
+
+ .svg-icon {
+ flex-shrink: 0;
+ }
+ }
+ }
+
+ .vxe-cell--html {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+
+ .warning {
+ font-size: 18px;
+ font-weight: bold;
+ color: red;
+ }
+
+ .cellEdit {
+ cursor: pointer;
+ }
+
+ .iconfont {
+ font-size: 18px;
+ }
+
+ .iconfont.icon-rise {
+ color: green;
+ }
+
+ .iconfont.icon-decline {
+ color: red;
+ }
+
+ .iconfont.icon-edit-icon {
+ font-size: 16px;
+ margin-left: 5px;
+ cursor: pointer;
+ }
+ }
+ }
+ }
+
+ .tableRowClass.row--stripe {
+ background-color: rgba(0, 95, 199, 0.15);
+ }
+
+ .tips {
+ display: inline-block;
+ width: 10px;
+ height: 10px;
+ margin: 0 auto;
+ border-radius: 10px;
+ margin-right: 5px;
+ }
+
+ .tips.green {
+ background-color: green;
+ }
+
+ .tips.red {
+ background-color: red;
+ }
+
+ .name {
+ margin-left: 5px;
+ cursor: pointer;
+ }
+
+ .cellName {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ color: #fef961;
+ }
+
+ .cellInput {
+ input {
+ color: #222;
+ text-align: center;
+ }
+ }
+
+ .vxe-table--fixed-left-wrapper.scrolling--middle {
+ background: -webkit-linear-gradient(top, #02072b 0%, #02082b 100%);
+ box-shadow: inset 0px 0px 10px rgb(36, 90, 124) !important;
+ }
+ }
+ }
+ .tablePage {
+ background-color: #dedede;
+ // --vxe-pager-background-color: none;
+ padding: 0 2rem;
+ // color: #b1e3ff;
+ // :deep(.vxe-select) {
+ // .vxe-input--inner {
+ // color: #b1e3ff;
+ // border: 1px solid #b1e3ff;
+ // background-color: transparent;
+ // }
+ // .vxe-select--panel {
+ // color: #b1e3ff;
+ // .vxe-select-option--wrapper {
+ // border: 1px solid #b1e3ff;
+ // background: -webkit-linear-gradient(top, #02072b 0%, #02082b 100%);
+ // .vxe-select-option:not(.is--disabled).is--hover {
+ // background: none;
+ // }
+ // }
+ // }
+ // }
+ // :deep(.vxe-pager--jump) {
+ // .vxe-pager--goto {
+ // color: #b1e3ff;
+ // border: 1px solid #b1e3ff;
+ // background-color: transparent;
+ // }
+ // }
+ }
+
+ // /*滚动条整体部分*/
+ // .tableGrid ::-webkit-scrollbar {
+ // width: 8px;
+ // height: 8px;
+ // }
+ // /*滚动条的轨道*/
+ // .tableGrid ::-webkit-scrollbar-track {
+ // background-color: transparent;
+ // -webkit-border-radius: 8px;
+ // -moz-border-radius: 8px;
+ // border-radius: 8px;
+ // }
+ // /*滚动条里面的小方块,能向上向下移动*/
+ // .tableGrid ::-webkit-scrollbar-thumb {
+ // background-color: rgb(147, 147, 153, 0.5);
+ // -webkit-border-radius: 8px;
+ // -moz-border-radius: 8px;
+ // border-radius: 8px;
+ // }
+ // .tableGrid ::-webkit-scrollbar-thumb:hover {
+ // background-color: #a8a8a8;
+ // }
+ // .tableGrid ::-webkit-scrollbar-thumb:active {
+ // background-color: #787878;
+ // }
+ // /*边角,即两个滚动条的交汇处*/
+ // .tableGrid ::-webkit-scrollbar-corner {
+ // background-color: transparent;
+ // }
+ }
+
+ .infoPanel {
+ height: 280px;
+ margin-top: 20px;
+ transition: transform 0.5s;
+
+ :deep(.swiper) {
+ --swiper-theme-color: #ff6600;
+ /* 设置Swiper风格 */
+ --swiper-navigation-color: #00ff33;
+ /* 单独设置按钮颜色 */
+ --swiper-navigation-size: 30px;
+
+ /* 设置按钮大小 */
+ .item {
+ height: 280px;
+
+ .content {
+ display: flex;
+ align-items: center;
+ height: -webkit-fill-available;
+ border: 2px solid #b7babf;
+ border-radius: 5px;
+ color: #000;
+ // padding: 15px;
+ // background-color: rgba(2, 8, 46, 0.5);
+
+ .icon {
+ width: 35%;
+
+ img {
+ width: 100%;
+ }
+ }
+
+ .numValue {
+ flex: 1;
+ text-align: center;
+ color: #000;
+
+ span {
+ font-size: 5rem;
+ }
+
+ i {
+ font-size: 3rem;
+ font-style: normal;
+ }
+
+ p {
+ font-size: 2rem;
+ margin: 0;
+ color: #1782ff;
+ }
+ }
+
+ .numValueMore {
+ flex: 1;
+ margin-left: 1.5rem;
+ span {
+ font-size: 1.4rem;
+ line-height: 30px;
+ color: #000;
+ margin-right: 3px;
+ }
+ span:nth-child(1) {
+ font-size: 1.6rem;
+ color: #1782ff;
+ }
+ span:nth-child(2) {
+ font-size: 1.8rem;
+ margin-right: 5px;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+
+ /*滚动条整体部分*/
+ .tableGrid ::-webkit-scrollbar {
+ width: 8px;
+ height: 8px;
+ }
+
+ /*滚动条的轨道*/
+ .tableGrid ::-webkit-scrollbar-track {
+ background-color: transparent;
+ -webkit-border-radius: 8px;
+ -moz-border-radius: 8px;
+ border-radius: 8px;
+ }
+
+ /*滚动条里面的小方块,能向上向下移动*/
+ .tableGrid ::-webkit-scrollbar-thumb {
+ background-color: rgb(147, 147, 153, 0.5);
+ -webkit-border-radius: 8px;
+ -moz-border-radius: 8px;
+ border-radius: 8px;
+ }
+
+ .tableGrid ::-webkit-scrollbar-thumb:hover {
+ background-color: #a8a8a8;
+ }
+
+ .tableGrid ::-webkit-scrollbar-thumb:active {
+ background-color: #787878;
+ }
+
+ /*边角,即两个滚动条的交汇处*/
+ .tableGrid ::-webkit-scrollbar-corner {
+ background-color: transparent;
+ }
+ }
+}
+
+// .cardClass {
+
+.treeCard {
+ .showTree {
+ height: 50vh;
+ overflow: auto;
+ .weight {
+ display: flex;
+ align-items: center;
+ margin-left: auto;
+
+ span {
+ margin-right: 2px;
+ }
+ }
+ }
+ .treeBtn {
+ margin-top: 20px;
+ text-align: right;
+
+ .n-button {
+ margin-left: 10px;
+ }
+ }
+ /*滚动条整体部分*/
+ .showTree::-webkit-scrollbar {
+ width: 8px;
+ height: 8px;
+ }
+
+ /*滚动条的轨道*/
+ .showTree::-webkit-scrollbar-track {
+ background-color: transparent;
+ -webkit-border-radius: 8px;
+ -moz-border-radius: 8px;
+ border-radius: 8px;
+ }
+
+ /*滚动条里面的小方块,能向上向下移动*/
+ .showTree::-webkit-scrollbar-thumb {
+ background-color: rgb(147, 147, 153, 0.5);
+ -webkit-border-radius: 8px;
+ -moz-border-radius: 8px;
+ border-radius: 8px;
+ }
+
+ .showTree::-webkit-scrollbar-thumb:hover {
+ background-color: #a8a8a8;
+ }
+
+ .showTree:-webkit-scrollbar-thumb:active {
+ background-color: #787878;
+ }
+
+ /*边角,即两个滚动条的交汇处*/
+ .showTree::-webkit-scrollbar-corner {
+ background-color: transparent;
+ }
+}
+
+// }
+
+.dark {
+ .screen {
+ background-color: rgba(29, 30, 31, 0.8);
+ background-blend-mode: multiply;
+
+ .layout {
+ .sidebar {
+ background-color: rgba(29, 30, 31, 0.8);
+ }
+
+ .main {
+ background-color: rgba(29, 30, 31, 0.8);
+ .mainTable {
+ .tableGrid {
+ :deep(.vxe-table) {
+ .vxe-table--fixed-left-wrapper.scrolling--middle {
+ background: -webkit-linear-gradient(top, rgba(21, 21, 25, 1) 0%, rgba(21, 21, 25, 1) 100%);
+ box-shadow: inset 0px 0px 10px rgb(36, 90, 124) !important;
+ }
+ }
+ }
+ }
+ }
+
+ .infoPanel {
+ :deep(.swiper) {
+ .item {
+ .content {
+ background-color: rgba(29, 30, 31, 0.8);
+ }
+ }
+ }
+ }
+ }
+ }
+}
diff --git a/src/views/monitoring/screenData/index.vue b/src/views/monitoring/screenData/index.vue
new file mode 100644
index 0000000..2794411
--- /dev/null
+++ b/src/views/monitoring/screenData/index.vue
@@ -0,0 +1,200 @@
+
+
+
+
+
+
+
+
+
Copyright © {{ $t('copyright.year') }} {{ $t('copyright.abbr') }} {{ $t('copyright.document') }}
+
+
+
+
+
+