{"remainingRequest":"D:\\jenkins\\workspace\\sfz-lh-fvue\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\jenkins\\workspace\\sfz-lh-fvue\\src\\views\\BigScreen\\homePage.vue?vue&type=style&index=0&id=0403ffd1&lang=scss&scoped=true&","dependencies":[{"path":"D:\\jenkins\\workspace\\sfz-lh-fvue\\src\\views\\BigScreen\\homePage.vue","mtime":1712257743734},{"path":"D:\\jenkins\\workspace\\sfz-lh-fvue\\node_modules\\css-loader\\index.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\sfz-lh-fvue\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\sfz-lh-fvue\\node_modules\\postcss-loader\\src\\index.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\sfz-lh-fvue\\node_modules\\postcss-loader\\src\\index.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\sfz-lh-fvue\\node_modules\\sass-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\sfz-lh-fvue\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\sfz-lh-fvue\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\r\n@import '../../views/BigScreen/bigScreen.scss';\r\n.screen-page{\r\n    width: 100%;\r\n    height: 100%;\r\n    overflow: hidden;\r\n    position: relative;\r\n    background-color: #333640;\r\n    \r\n}\r\n.screen-page-mask{\r\n    width: 100%;\r\n    height: 100%;\r\n    overflow: hidden;\r\n    position: absolute;\r\n    left: 0;\r\n    top: 0;\r\n    background: url('../../assets/img/bigScreen/modelbg-mask2.png') no-repeat center / 100% 100%;\r\n    pointer-events: none;\r\n}\r\n.tollstation-infor{\r\n  width: 100%;\r\n  height: 100%;\r\n  display: flex;\r\n  flex-direction: column;\r\n  position: relative;\r\n}\r\n.circle{\r\n    position: absolute;\r\n    left: calc(50% - 134px);\r\n    top: 30px;\r\n    width: 268px;\r\n    height: 268px;\r\n    margin: 0 auto;\r\n    background: url('../../assets/img/bigScreen/diwen-circle.png') no-repeat center / 100% 100%;\r\n    // animation: circle 10s linear infinite;\r\n}\r\n.section1{\r\n    width: 100%;\r\n    height: 9%;\r\n    margin-top: 10px;\r\n    position: relative;\r\n    .target{\r\n        position: absolute;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        width: 164px;\r\n        height: 55px;\r\n        background: url('../../assets/img/bigScreen/dikuang-home.png') no-repeat center / 100% 100%;\r\n        .label{\r\n            color: #FFFFFF;\r\n            font-size: 12px;\r\n            line-height: 18px;\r\n        }\r\n        .count{\r\n            color: #FFFFFF;\r\n            font-size: 22px;\r\n            font-weight: 700;\r\n            line-height: 29px;\r\n        }\r\n    }\r\n    .target1{\r\n        left: 0;\r\n        top: 5%;\r\n        align-items: flex-start;\r\n    }\r\n    .target2{\r\n        right: 0;\r\n        top: 14%;\r\n        align-items: flex-end;\r\n    }\r\n    .zhiban{\r\n        position: absolute;\r\n        left: 0;\r\n        bottom: 0;\r\n        width: 100%;\r\n        height: 112px;\r\n        padding: 16px;\r\n        box-sizing: border-box;\r\n        background: url('../../assets/img/bigScreen/content-dk.png') no-repeat center / 100% 100%;\r\n    }\r\n    .avator{\r\n        width:80px;\r\n        height: 80px;\r\n        border: 1px solid #177EE5;\r\n    }\r\n    .zhiban-info{\r\n        height: 80px;\r\n        color: #fff;\r\n        margin-left: 16px;\r\n        justify-content: space-around;\r\n        div{\r\n            font-size: 14px;\r\n        }\r\n    }\r\n}\r\n\r\n\r\n@keyframes circle {\r\n    0% {\r\n        transform: rotate(0deg);\r\n        opacity: 1;\r\n    }\r\n    50% {\r\n        transform: rotate(180deg);\r\n        opacity: 0.8;\r\n    }\r\n    100% {\r\n        transform: rotate(360deg);\r\n        opacity: 1;\r\n    }\r\n}\r\n\r\n\r\n.section-content-block{\r\n    width: 100%;\r\n    height: 14%;\r\n    display: flex;\r\n    align-items: center;\r\n    margin-top: 10px;\r\n    padding: 16px;\r\n    box-sizing: border-box;\r\n    background: url('../../assets/img/bigScreen/content.png') no-repeat center / 100% 100%;\r\n}\r\n.section-content-block.lane{\r\n    height: 18%;\r\n    background: url('../../assets/img/bigScreen/content-1.png') no-repeat center / 100% 100%;\r\n}\r\n.icon-lane{\r\n    height: 100px;\r\n    width: 100px;\r\n    background: url('../../assets/img/bigScreen/icon-lane1.png') no-repeat center / 100% 100%;\r\n}\r\n.icon-transit-time{\r\n    height: 100px;\r\n    width: 100px;\r\n    background: url('../../assets/img/bigScreen/icon-transit-time.png') no-repeat center / 100% 100%;\r\n}\r\n.icon-transaction-rate{\r\n    height: 100px;\r\n    width: 100px;\r\n    background: url('../../assets/img/bigScreen/icon-transaction-rate.png') no-repeat center / 100% 100%;\r\n}\r\n.section-content-container{\r\n    width: calc(100% - 110px);\r\n    margin-left: 10px;\r\n    height: 100px;\r\n    justify-content: center;\r\n    gap: 8px;\r\n}\r\n.lane-total{\r\n    .lane-label{\r\n        font-size: 16px;\r\n        font-weight: 700;\r\n        color: #FFFFFF;\r\n    }\r\n    .lane-count{\r\n        font-size: 32px;\r\n        font-weight: 700;\r\n        color: #FFFFFF;\r\n    }\r\n    .img-lane{\r\n        width: 88px;\r\n        height: 68px;\r\n    }\r\n\r\n    .img-arrow{\r\n        width: 28px;\r\n        height: 24px;\r\n    }\r\n}\r\n.lane-line{\r\n    width: 100%;\r\n    height: 0px;\r\n    opacity: 1;\r\n    border: 1px solid;\r\n    border-image: linear-gradient(90deg, rgba(51.00000075995922, 153.00000607967377, 255, 0), rgba(178.49999696016312, 216.75006687641144, 255, 0.5), rgba(51.00000075995922, 153.00000607967377, 255, 0)) 1 1;\r\n\r\n}\r\n.lane-type{\r\n    .lane-type-item{\r\n        width: 60px;\r\n        .label{\r\n            font-size: 14px;\r\n            // font-weight: 700;\r\n            line-height: 18px;\r\n            color:#fff;\r\n            // background: linear-gradient(180deg, #CCFFFF 14%, #3399FF 100%);\r\n            // -webkit-background-clip: text;\r\n            // -webkit-text-fill-color: transparent;\r\n        }\r\n        .count{\r\n            width: 60px;\r\n            height: 26px;\r\n            line-height: 26px;\r\n            font-size: 18px;\r\n            font-weight: 700;\r\n            color: #FFFFFF;\r\n            text-align: center;\r\n            position: relative;\r\n        }\r\n        .count::before{\r\n            content: '';\r\n            position: absolute;\r\n            left: 0;\r\n            bottom: 0;\r\n            width: 100%;\r\n            height: 10px;\r\n            background: url('../../assets/img/bigScreen/icon-lane2.png') no-repeat center / 100% 100%;\r\n        }\r\n    }\r\n}\r\n.container-name{\r\n    width: 100%;\r\n    font-size: 12px;\r\n    font-weight: 400;\r\n    color: #FFFFFF;\r\n}\r\n.container-content{\r\n    width: 100%;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: flex-start;\r\n    color: #fff;\r\n    overflow-y: hidden;\r\n    \r\n}\r\n.number-blocks-wrapper{\r\n    flex: 1;\r\n    width: 32px;\r\n    max-width: 36px;\r\n    height: 46px;\r\n    transform: translate(0, 0);\r\n    transition: transform 1s ease-in-out;\r\n}\r\n\r\n.number-blocks-wrapper~.number-blocks-wrapper{\r\n    margin-left: 2px;\r\n}\r\n.number-block{\r\n    width: 100%;\r\n    height: 46px;\r\n    background: #3D4953;\r\n    border-radius: 8px;\r\n    line-height: 46px;\r\n    text-align: center;\r\n    font-size: 30px;\r\n    font-weight: bold;\r\n    vertical-align: middle;\r\n    position: relative;\r\n    transition: transform 1s ease-in-out;\r\n    \r\n}\r\n.number-block::before{\r\n    content:'';\r\n    position:absolute;\r\n    left: 0;\r\n    top: calc(50% - 1px);\r\n    width: 100%;\r\n    height: 2px;\r\n    background: #3D4953;\r\n}\r\n.container-content-unit{\r\n    width: 16px;\r\n    height: 46px;\r\n    margin: 0 2px;\r\n    display: flex;\r\n    align-items: flex-end;\r\n    span{\r\n        color: #FFFFFF;\r\n        font-size: 16px;\r\n    }\r\n}\r\n.container-content-unit.point{\r\n    width: 6px;\r\n    span{\r\n        font-size: 40px;\r\n    }\r\n}\r\n.section-bottom{\r\n    height: 20%;\r\n    width: 100%;\r\n    margin: 10px 0;\r\n    justify-content: space-between;\r\n    position: relative;\r\n}\r\n\r\n.section-content-wrapper{\r\n    width: 100%;\r\n    height: 36%;\r\n    background: linear-gradient(270deg, #405980 0%, rgba(64,89,128,0) 40%,rgba(64,89,128,0) 60% , #405980 100%);\r\n    border-radius: 8px;\r\n    padding:0 10px;\r\n    box-sizing: border-box;\r\n}\r\n.type-content{\r\n    position: relative;\r\n    .label{\r\n        font-size: 14px;\r\n        color: #A0AAB2;\r\n    }\r\n    .count{\r\n        font-size: 18px;\r\n        font-family: Arial, Arial;\r\n        font-weight: 700;\r\n        color: #FFFFFF;\r\n    }\r\n    .unit{\r\n        font-size: 12px;\r\n        color: #A0AAB2;\r\n        margin-left: 6px;\r\n    }\r\n    &::after{\r\n        content:\"\";\r\n        position: absolute;\r\n        width: 2px;\r\n        height: 10px;\r\n        top: calc(50% - 5px);\r\n    }\r\n}\r\n.type-content.type1{\r\n    &::after{\r\n        left: -6px;\r\n        background: #3399FF;\r\n    }\r\n}\r\n.type-content.type2{\r\n    text-align: right;\r\n    &::after{\r\n        right: -6px;\r\n        background: #FD9854;\r\n    }\r\n}\r\n.type-content.type3{\r\n    text-align: right;\r\n    &::after{\r\n        right: -6px;\r\n        background: #55EDB0;\r\n    }\r\n}\r\n.type-content.type4{\r\n    &::after{\r\n        left: -6px;\r\n        background: #F4DE79;\r\n    }\r\n}\r\n.center-wrapper{\r\n    position: absolute;\r\n    width: 150px;\r\n    height: 150px;\r\n    left: 50%;\r\n    top: 50%;\r\n    transform: translate(-50%, -50%);\r\n    background: linear-gradient(90deg, rgba(105,155,255,0) 8%, rgba(107, 156, 255,0.15), rgba(105,155,255,0) 92%);\r\n    border-radius: 150px;\r\n    #pie-chart{\r\n        width: 140px;\r\n        height: 140px;\r\n    }\r\n}\r\n\r\n\r\n.lane-info{\r\n    width: 100%;\r\n    height: 250px;\r\n}\r\n.lane-wrapper{\r\n    width: 100%;\r\n    height: calc(100% - 46px);\r\n    margin-top:16px;\r\n}\r\n\r\n\r\n\r\n.device-info{\r\n    width: 100%;\r\n    height: 100%;\r\n}\r\n.device-wrapper{\r\n    width: 100%;\r\n    height: 180px;\r\n    margin-top:16px;\r\n}\r\n.guage-wrapper{\r\n    width: 100%;\r\n    height: 172px;\r\n    gap: 10px;\r\n}\r\n.guage-content{\r\n    width: 172px;\r\n    text-align: center;\r\n    position: relative;\r\n    #gauge{\r\n        position: absolute;\r\n        left: 6px;\r\n        top: 6px;\r\n        width: 160px;\r\n        height: 160px;\r\n    }\r\n    img.pan{\r\n        width: 172px;\r\n        height: 172px;\r\n    }\r\n    img.zhen{\r\n        width: 10px;\r\n        height: 73px;\r\n        position: absolute;\r\n        left: 50%;\r\n        top: 12%;\r\n        transform: rotate(-132deg);  // 136deg\r\n        transform-origin: 50% 93.15%;\r\n        transition: transform 2s ease-in-out;\r\n    }\r\n    .device-rate-count{\r\n        position: absolute;\r\n        left: 0;\r\n        right: 0;\r\n        bottom: 31px;\r\n        font-size: 20px;\r\n        font-weight: 700;\r\n        color: #FFFFFF;\r\n    }\r\n    .device-rate-label{\r\n        position: absolute;\r\n        left: 0;\r\n        right: 0;\r\n        bottom: 15px;\r\n        color: #FFFFFF;\r\n        font-size: 16px;\r\n    }\r\n}\r\n.device-status{\r\n    width: calc(100% - 180px);\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    flex-direction: column;\r\n    gap: 8px;\r\n}\r\n.status-item{\r\n    width: 134px;\r\n    height: 50px;\r\n    padding: 10px;\r\n    box-sizing: border-box;\r\n    align-items: flex-start;\r\n    justify-content: center;\r\n    background: url(\"../../assets/img/bigScreen/status-border.png\");\r\n    position: relative;\r\n    .label{\r\n        font-size: 12px;\r\n    }\r\n    .count{\r\n        font-size: 14px;\r\n        font-weight: bold;\r\n    }\r\n    ::before{\r\n        content:'';\r\n        position: absolute;\r\n        right: 0;\r\n        bottom: 15%;\r\n        height: 4px;\r\n        width: 3px;\r\n        border-radius: 2px;\r\n       \r\n    }\r\n}\r\n.status-item.item1{\r\n    color: #00E5E5;\r\n    ::before{\r\n        background: #00E5E5;\r\n    }\r\n}\r\n.status-item.item2{\r\n    color: #FFDA81;\r\n    ::before{\r\n        background: #FFDA81;\r\n        animation: shine 2s linear infinite;\r\n    }\r\n}\r\n.status-item.item3{\r\n    color: #FD9854;\r\n    ::before{\r\n        background: #FD9854;\r\n        animation: shine 2s linear infinite;\r\n    }\r\n}\r\n@keyframes shine {\r\n    0% {\r\n        transform: scale(1);\r\n        opacity: 0.1;\r\n    }\r\n    50% {\r\n        transform: scale(1.5);\r\n        opacity: 1;\r\n    }\r\n    100% {\r\n        transform: scale(1);\r\n        opacity: 0.1;\r\n    }\r\n}\r\n.section-bottom-table{\r\n    width: 100%;\r\n    margin-top:4px;\r\n    height: calc(100% - 30px - 9% - 14% - 16% - 20% - 84px);\r\n}\r\n.table-wrapper{\r\n    width: 100%;\r\n    height:100%;\r\n}\r\n.device-selector{\r\n    position: absolute;\r\n    left: 420px;\r\n    top: 126px;\r\n    width: 84px; //260px;\r\n    height: 84px;\r\n    background: rgba(58, 65, 74, 0.6);\r\n    z-index: 99;\r\n    border-radius: 4px;\r\n    gap: 40px;\r\n    overflow: hidden;\r\n    transition: all 0.1s linear;\r\n    .device-btn-container{\r\n        width: 80px;\r\n        height: 76px;\r\n        margin-bottom: -25px;\r\n        cursor: pointer;\r\n        div{\r\n            margin-top: 28px;\r\n            font-size: 14px;\r\n            color: #fff;\r\n        }\r\n    }\r\n    .device-btn-container.active,.device-btn-container:hover{\r\n        div{\r\n            color: #00FFFF;\r\n        }\r\n    }\r\n    .device-btn-container.device{\r\n        background: url(\"../../assets/img/bigScreen/device-btn.png\") no-repeat center / 100% 100%;\r\n    }\r\n    .device-btn-container.device.active, .device-btn-container.device:hover{\r\n        background: url(\"../../assets/img/bigScreen/device-btn-active.png\") no-repeat center / 100% 100%;\r\n    }\r\n    .device-btn-container.video{\r\n        background: url(\"../../assets/img/bigScreen/video-btn.png\") no-repeat center / 100% 100%;\r\n    }\r\n    .device-btn-container.video.active,.device-btn-container.video:hover{\r\n        background: url(\"../../assets/img/bigScreen/video-btn-active.png\") no-repeat center / 100% 100%;\r\n    }\r\n    .device-hidden-btn{\r\n        transition: all 0.1s linear 0.1s;\r\n        width: 36px;\r\n        height: 36px;\r\n        text-align: center;\r\n        cursor: pointer;\r\n        img{\r\n            width: 100%;\r\n            height: 100%;\r\n        }\r\n    }\r\n    .device-layer{\r\n        transition: all 0.1s linear 0.1s;\r\n        width: 100%;\r\n        height: 100%;\r\n        padding:0 14px 0 14px;\r\n        box-sizing:border-box;\r\n        color: #fff;\r\n        .title{\r\n            font-size: 16px;\r\n            border-bottom: 1px solid rgba(255,255,255, 0.2);\r\n            padding: 10px 0;\r\n            margin-bottom: 10px;\r\n            span,i{\r\n                font-size: 16px;\r\n            }\r\n            i.el-icon-d-arrow-left{\r\n                cursor: pointer;\r\n            }\r\n            i.el-icon-d-arrow-left:hover{\r\n                color: #3399FF;\r\n            }\r\n            .el-icon-info{\r\n                color: #FD9854;\r\n                margin-left: 10px;\r\n                vertical-align: middle;\r\n                 margin-top: -3px;\r\n            }\r\n        }\r\n        .title-icon{\r\n            width: 16px;\r\n            height: 16px;\r\n            margin-right: 6px;\r\n            vertical-align: middle;\r\n            margin-top: 3px;\r\n        }\r\n    }\r\n    .options-wrapper{\r\n        display: flex;\r\n        flex-wrap: wrap;\r\n        .el-checkbox{\r\n            // flex: 1;\r\n            width: 50%;\r\n            margin-right: 0;\r\n            margin: 8px 0;\r\n            color: rgba(255,255,255,0.7);\r\n        }\r\n    }\r\n}\r\n.select-options.device{\r\n    height: 280px;\r\n    overflow: auto;\r\n}\r\n.device-selector.show-device{\r\n    width: 260px;\r\n    height: 430px;\r\n}\r\n.lane-wrapper{\r\n    height: 240px;\r\n    margin: 10px 0;\r\n    .lane-content{\r\n        height: 50%;\r\n        width: 100%;\r\n        gap: 4px;\r\n    }\r\n    .lane-position{\r\n        width: 70px;\r\n        height: 70px;   \r\n    }\r\n    .lane-position.entry{\r\n        background: url(\"../../assets/img/bigScreen/icon-entry.png\") no-repeat center / 100% 100%;\r\n    }\r\n    .lane-position.exit{\r\n        background: url(\"../../assets/img/bigScreen/icon-exit.png\") no-repeat center / 100% 100%;\r\n    }\r\n    .lane-item{\r\n        width: calc((100% - 70px)/4);\r\n        height: 120px;\r\n        background: url(\"../../assets/img/bigScreen/lane-status-1.png\") no-repeat center / 100% 100%;\r\n        color: #fff;\r\n        text-align: center;\r\n        display: flex;\r\n        flex-direction: column;\r\n        align-items: center;\r\n        justify-content: center;\r\n        box-sizing: border-box;\r\n        padding: 16px 4px;\r\n        position: relative;\r\n        .status{\r\n            margin: 14px 0;\r\n        }\r\n    }\r\n    \r\n    .lane-name.error{\r\n        color: #F35675;\r\n    }\r\n    .status{\r\n        font-size: 16px;\r\n    }\r\n    .status.normal{\r\n        color: #8AF7E0;\r\n    }\r\n    .status.error{\r\n        color: #F35675;\r\n    }\r\n    .lane-item.error{\r\n        cursor: pointer;\r\n        background: url(\"../../assets/img/bigScreen/lane-status-2.png\") no-repeat center / 100% 100%;\r\n    }\r\n    .lane-item .error-reason{\r\n        position: absolute;\r\n        left: 50%;\r\n        top: 10px;\r\n        width: 140px;\r\n        transform: translate(-50%, 0);\r\n        border-radius: 4px;\r\n        border: 1px solid #F35675;\r\n        background-color: rgba(#1f1722, 0.95);\r\n        padding: 10px;\r\n        box-sizing: border-box;\r\n        display: none;\r\n        z-index: 5;\r\n        .error-reason-title{\r\n            font-size: 12px;\r\n            margin-bottom: 10px;\r\n            text-align: left;\r\n        }\r\n        .error-reason-info{\r\n            color: #fff;\r\n            text-align: justify;\r\n        }\r\n    }\r\n    .lane-item:hover .error-reason{\r\n        display: block;\r\n    }\r\n    .status-icon{\r\n        width: 16px;\r\n        height: 16px;\r\n    }\r\n    .status-icon.error{\r\n        background: url(\"../../assets/img/bigScreen/icon-error.png\") no-repeat center / 100% 100%;\r\n        // animation: shine3 1s linear infinite;\r\n    }\r\n    .status-icon.normal{\r\n        background: url(\"../../assets/img/bigScreen/icon-normal.png\") no-repeat center / 100% 100%;\r\n        // animation: shine2 8s linear infinite;\r\n    }\r\n    @keyframes shine2 {\r\n        0% {\r\n            transform: scale(1);\r\n            opacity: 0.3;\r\n        }\r\n        50% {\r\n            transform: scale(1.3);\r\n            opacity: 1;\r\n        }\r\n        100% {\r\n            transform: scale(1);\r\n            opacity: 0.3;\r\n        }\r\n    }\r\n    @keyframes shine3 {\r\n        0% {\r\n            transform: scale(1);\r\n            opacity: 0.4;\r\n        }\r\n        50% {\r\n            transform: scale(1.4);\r\n            opacity: 1;\r\n        }\r\n        100% {\r\n            transform: scale(1);\r\n            opacity: 0.4;\r\n        }\r\n    }\r\n}\r\n.fault-table-wrapper{\r\n    width: 100%;\r\n    height: calc(100% - 90px - 180px - 16px - 260px - 10px);\r\n    margin-top: 10px;\r\n}\r\n.scroll-falut-wrapper{\r\n    width: 100%;\r\n    height: 100%;\r\n    overflow: hidden;\r\n}\r\n.scroll-falut-column{\r\n    border-bottom: 1px solid rgba(255, 255, 255, 0.1);\r\n    padding: 4px 0;\r\n}\r\n.fault-item-wrapper{\r\n    width: 100%;\r\n    padding: 10px 0;\r\n    height: 20px;\r\n    box-sizing: border-box;\r\n}\r\n.fault-item{\r\n    color: #fff;\r\n    font-size: 12px;\r\n    .icon{\r\n        width: 20px;\r\n        height: 20px;\r\n        display: inline-block;\r\n        background: url(\"../../assets/img/bigScreen/icon-warn-point.png\") no-repeat center / 100% 100%;\r\n        animation: shine3 2s linear infinite;\r\n        vertical-align: middle;\r\n        margin-right: 4px;\r\n    }\r\n    .date{\r\n        font-size: 12px;\r\n        font-weight: bold;\r\n        color: #fff;\r\n        vertical-align: middle;\r\n    }\r\n    span{\r\n        font-size: 12px;\r\n        color: #fff;\r\n        vertical-align: middle;\r\n    }\r\n    .reason{\r\n        color: #F35675;\r\n    }\r\n}\r\n/deep/.el-empty__description p{\r\ncolor:#fff !important\r\n}\r\n.empty{\r\n  display: flex;  \r\n   justify-content: center;       /*水平排列居中*/\r\n   align-items: center;\r\n}\r\n/deep/.el-dialog__body{\r\n    padding: 0px 16px 0 16px;\r\n}\r\n/deep/.el-dialog__header{\r\n    background-color: transparent!important;\r\n    .title_{\r\n        font-size: 14px;\r\n        line-height: 38px !important;\r\n        color: #fff;\r\n    }\r\n}\r\n/deep/.el-dialog{\r\n    background: url(\"../../assets/img/bigScreen/popbg.png\") no-repeat center / 100% 100%;\r\n}\r\n",null]}