.waring1 .waring1-top .page-box { height: 358px; } .waring2 { display: flex; } .waring2 .waring2-left { width: 49%; display: flex; flex-wrap: wrap; justify-content: space-between; top: 480px; height: 410px; } .waring2 .waring2-left .page-box:nth-child(-n+2) { width: 100%; } .waring2 .waring2-left .page-box:nth-child(3) { width: 100%; } .waring2 .waring2-left .page-box:first-child .content { display: flex; flex-direction: column; padding: 10px; } .waring2 .waring2-left .page-box:first-child ul { display: flex; height: 40px; margin: 25px 0 30px; } .waring2 .waring2-left .page-box:first-child ul li { flex: 1; display: flex; flex-direction: column; justify-content: center; align-items: center; border-right: 1px solid #ddd; } .waring2 .waring2-left .page-box:first-child ul li:last-child { border-right: 0; } .waring2 .waring2-left .page-box:first-child ul li img { width: 20px; height: 20px; } .waring2 .waring2-left .page-box:first-child ul li span:first-of-type { font-size: 14px; color: #75798A; padding: 6px 0; } .waring2 .waring2-left .page-box:first-child ul li span:last-of-type { color: #fff; } .waring2 .waring2-left .page-box:first-child .img-box { flex: 1; } .waring2 .waring2-left .page-box:first-child .img-box img{ width: 100%; height: 100%; } .waring2 .waring2-right { /* width: calc(40% - 30px); */ width:49%; position: absolute; top: 480px; right: 10px; height: 410px; } .waring2 .waring2-right .content { display: flex; flex-direction: column; } .waring2 .waring2-right .content .header { display: flex; justify-content: space-between; margin: 20px; } .waring2 .waring2-right .content .header-right { display: flex; align-items: center; } .waring2 .waring2-right .content .header-right select { height: 32px; line-height: 32px; background: #191934; font-size: 14px; color: #97B8DA; border: 0; margin-left: 10px; cursor: pointer; padding: 0 8px; } .waring2 .waring2-right .content .header-right button { width: 80px; height: 32px; border: 0; color: #fff; cursor: pointer; display: flex; justify-content: center; align-items: center; margin-left: 10px; } .waring2 .waring2-right .content .header-right .search { background: #5C89FF; } .waring2 .waring2-right .content .header-right .export { background: #FCB333; } .waring2 .waring2-right .content .header-right button img { width: 14px; height: 14px; margin-right: 10px; } .waring2 .list-table { flex: 1; overflow: auto; } .waring2 .list-table ul{ width: 100%; overflow: hidden; } .waring2 .list-table li{ width: 13%; height: 40px; line-height: 40px; float: left; text-align: center; display:block; overflow:hidden; word-break:keep-all; white-space:nowrap; text-overflow:ellipsis; } .waring2 .list-table li + li{ width: 12%; } .waring2 .list-table li + li + li{ width: 13%; } .waring2 .list-table li + li + li + li{ width: 13%; } /* .waring2 .list-table li + li + li + li+ li{ width: 15%; } .waring2 .list-table li + li + li + li+ li{ width: 10%; } */ .waring2 .list-table li + li + li + li+ li{ width: 12%; } .waring2 .list-table li.lv1{ background: url(../../assets/images/level1.png) no-repeat center center; } .waring2 .list-table li.lv2{ background: url(../../assets/images/level2.png) no-repeat center center; } .waring2 .list-table li.lv3{ background: url(../../assets/images/level3.png) no-repeat center center; } .waring2 .list-table li.gd{ color:#39c160 } .waring2 .list-table li.rd{ color:#fd4f54 } .waring2 .list-table .tb-hd{ width: 100%; height: 40px; } .waring2 .list-table .tb-bd{ width: 100%; height: calc(100% - 40px); overflow: hidden; overflow-y: auto; } .waring2 .list-table .tb-hd ul{ color:#98b9d9; } .waring2 .list-table .tb-bd ul:nth-child(odd){ background: #191937; } .warning1bottom{ left:0; top:368px; right:0; height: 500px; } .warning1bottom .page-box{ height: 100%; } .warning1bottom .list-table{ width: 100%; height: calc(100% - 86px); margin-top: 20px; } .warning1bottom .list-table ul{ width: 100%; overflow: hidden; } .warning1bottom .list-table li{ width: calc(100% / 7); height: 40px; line-height: 40px; float: left; text-align: center; } .warning1bottom .list-table li img{ margin-top: 10px; } .warning1bottom .list-table li.rd{ color:#fd4f54; } .warning1bottom .list-table li.gd{ color:#39c160; } .warning1bottom .list-table .tb-hd{ width: 100%; height: 40px; } .warning1bottom .list-table .tb-bd{ width: 100%; height: calc(100% - 40px); overflow: hidden; overflow-y: auto; } .warning1bottom .list-table .tb-hd ul{ color:#98b9d9; } .warning1bottom .list-table .tb-bd ul:nth-child(odd){ background: #191937; } .warning1bottom .page-box .content .header-right input { height: 32px; line-height: 32px; background: #191934; font-size: 14px; color: #97B8DA; border: 0; margin-left: 10px; padding: 0 8px; } .mask { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(10,6,30,0.70); display: none; } .warning-detail { width: 500px; height: 80%; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; flex-direction: column; background: #111029; display: none; } .warning-detail .title { height: 40px; line-height: 40px; padding: 0 10px; background: #191934; } .warning-detail .detail { flex: 1; padding: 20px 10px 10px; overflow: auto; } .warning-detail .detail .base-info { display: flex; align-items: center; flex-wrap: wrap; margin-bottom: 10px; } .warning-detail .detail .base-info label { line-height: 30px; color: #97B8DA; } .warning-detail .detail .base-info img { width: 20px; height: 20px; } .warning-detail .detail .base-info p { padding: 5px 10px; line-height: 22px; background: #191934; } .warning-detail .detail .btns { display: flex; justify-content: flex-end; } .warning-detail .detail .btns button { width: 80px; height: 32px; line-height: 32px; background: #5C89FF; border: 0; font-size: 14px; color: #fff; margin-left: 10px; cursor: pointer; } .warning-detail .detail .base-info .pdf { flex: 1; display: flex; justify-content: space-between; } .warning-detail .detail .base-info .pdf .operate { color: #1890FF; cursor: pointer; } .waring2 .waring2-bottom { position: absolute; width: calc(100% - 20px); height: calc(100% - 440px); top: 10px; overflow: hidden; } .waring2 .waring2-bottom .page-box{ height: 100%!important; } .waring2 .waring2-bottom .content{ padding: 0!important; } .waring2 .waring2-bottom .check-box { position: absolute; top: 40px; left: 0; height: calc(100% - 40px); padding: 10px 20px; line-height: 22px; color: #fff; } .waring2 .waring2-bottom img{ width: 100%; height:100% } .waring2 .waring2-hide{ position: absolute; /* top: 64px; */ top: 20px; left:30%; background: #111029 !important; width: 42%; /* height: calc(100% - 205px); */ height: calc(100% - 36px); transition: right .3s linear 0s; } .waring2 .waring2-hide .page-box{ width: 100%; height: 100%; } .waring2 .waring2-hide .page-box .title i{ width: 30px; height: 30px; font-style: normal; line-height: 30px; text-align: center; position: absolute; right: 5px; top:5px; display: block; cursor: pointer; } .waring2 .waring2-hide .page-box .content .top-box{ width: 100%; height: 100px; padding:10px 20px; } .waring2 .waring2-hide .page-box .content .top-box ul{ width: 100%; height: 100%; } .waring2 .waring2-hide .page-box .content .top-box li{ float: left; width: 20%; display: flex; height: 40px; line-height: 40px; } .waring2 .waring2-hide .page-box .content .top-box li:nth-child(3n - 2){ width: 58%; } .waring2 .waring2-hide .page-box .content .top-box li:nth-child(5){ width: 60%; } .waring2 .waring2-hide .page-box .content .top-box li label{ display: block; width: 70px; color:#97b8da; } .waring2 .waring2-hide .page-box .content .top-box li span{ flex: 1; display: block; text-overflow: ellipsis; overflow: hidden; } .waring2 .waring2-hide .page-box .content .top-box li span.gd{ color:#39c160 } .waring2 .waring2-hide .page-box .content .top-box li span.rd{ color:#fd4f54 } .waring2 .waring2-hide.show{ /* right:10px; */ position: absolute; top: 84px; left: 50%; margin-left: -21%; background: #111029 !important; width: 42%; /* margin: 0 auto; */ height: calc(100% - 140px); transition: right .3s linear 0s; } .waring2 .waring2-hide .page-box .content .list-table{ border: 1px #2f2f45 solid; width: calc(100% - 40px); margin: 0 auto; /* height: 120px; */ height:203px; } .waring2 .waring2-hide .page-box .content .list-table .tb-hd ul li{ width: calc(100% / 7) } .waring2 .waring2-hide .page-box .content .list-table .tb-bd ul li{ width: calc(100% / 7) } .waring2 .waring2-hide .page-box .content .chart-header{ width: calc(100% - 40px)!important; margin: 0 auto; width: 100%; height: 40px; text-align: right; padding-top: 5px; } .waring2 .waring2-hide .page-box .content .chart-header select{ height: 32px; line-height: 32px; background: #191934; font-size: 14px; color: #97B8DA; border: 0; margin-left: 10px; cursor: pointer; padding: 0 8px; } .waring2 .waring2-hide .page-box .content .chart-wrap{ width: calc(100% - 40px); margin: 0 auto; height: 160px; /* height: calc(100% - 546px); */ } .waring2 .waring2-hide .page-box .content .chart-wrap .chart{ width: 100%; height: 100%; } .waring2 .waring2-hide .page-box .content .bt-button{ border: 1px #5c89ff solid; width: calc(100% - 40px); margin: 0 auto; height: 32px; line-height: 32px; color:#5c89ff; text-align: center; cursor: pointer; } .waring2 .waring2-popup{ display: none; position: absolute; top:470px; right:45%; width: 400px; height: 300px; transition: right .3s linear 0s; } .waring2 .waring2-popup.show{ display: block; } .waring2 .waring2-popup .page-box{ width: 100%; height: 100%; } .waring2 .waring2-popup .page-box .content img{ width: 100%; height: auto; } .waring2 .waring2-popup .page-box .title i{ width: 30px; height: 30px; font-style: normal; line-height: 30px; text-align: center; position: absolute; right: 5px; top:5px; display: block; cursor: pointer; } .list-table .tb-bd > ul{ cursor: pointer; } .list-table .tb-bd > ul.active{ background: rgba(61, 26, 189, 0.6)!important; } .scorce{ position: absolute; right: 0; top:0; font-size: 30px; padding: 10px; } .page-box::-webkit-scrollbar{ display:none; } .filterChart{ height: 32px; line-height: 32px; background: #191934; font-size: 14px; color: #97B8DA; /* border: 0; */ margin-left: 10px; cursor: pointer; padding: 0 8px; margin-top: 4px; } .timesDuring{ width:20%; } .time-bottom .page-box .content .chart-wrap #chart2,.time-bottom .page-box .content .chart-wrap #chart1 { /* width: 800px; */ height: 240px; margin: 0 auto; } .show{ display: block; } /* .waring2-hide{ display: none; } */ .label{ color: #97b8da; line-height: 26px; } .content .showInfo{ /* width: 97%; margin: 0 auto; background: RGB(25,25,52); line-height: 24px; */ } .preDealtail{ width: 100%; padding: 0 20px 10px 20px; margin-top: 15px; } .save{ text-align: right; } .save button{ background: RGB(92,137,255); width: 66px; height: 22px; color: #fff; border: 0; cursor: pointer; } .inputClass{ background: RGB(25,25,52); border: 0; color: #fff; } .showInfo textarea{ width: 100%; height: 50px; } .time-selector { height: 32px; line-height: 32px; background: #191934; font-size: 14px; color: #97b8da; border: 0; margin-left: 10px; cursor: pointer; padding: 0 8px; } .preOpara{ color: rgb(24,144,255); cursor: pointer; } .preOpara:hover{ color: white; } .preOparal{ color:#55566a; }