调整安防视频页面及逻辑

czt

2 天以前 51faf3e9c3c613e7fb12db6c88356946f2429e0c

 fzzy-igdss-web/src/main/resources/static/group/master.css

@@ -9,6 +9,7 @@
   font-family: DINCond-Bold;
   src: url('../fonts/DINCond-Bold.otf');
}

/*common*/

.i-icon {
@@ -30,7 +31,7 @@

.i-icon img,
.i-icon32 img {
   /*width: 100%;*/
   width: 100%;
   height: 100%;
   vertical-align: top;
}
@@ -45,7 +46,7 @@
   height: 1080px;
   width: 1920px;
   position: relative;
   background: url(../group/img/i-body.png) center top no-repeat;
   background: url(../img/web/group/i-body.png) center top no-repeat;
   background-size: 100% 100%;
   padding-right: 0;
   padding-left: 0;
@@ -55,7 +56,7 @@
.i-top {
   height: 140px;
   width: 100%;
   background: url(../group/img/i-top-bg.png) center top no-repeat;
   background: url(../img/web/group/i-top-bg.png) center top no-repeat;
   background-size: 100% 100%;
   position: relative;
}
@@ -106,14 +107,14 @@
.i-nav2,
.i-nav3,
.i-nav4 {
   background: url(../group/img/i-navBg-l.png) no-repeat;
   background: url(../img/web/group/i-navBg-l.png) no-repeat;
   left: 50%;
}

.i-nav5,
.i-nav6,
.i-nav7 {
   background: url(../group/img/i-navBg-r.png) no-repeat;
   background: url(../img/web/group/i-navBg-r.png) no-repeat;
   right: 50%;
}

@@ -124,7 +125,7 @@
.i-nav2:hover,
.i-nav3:hover,
.i-nav4:hover{
   background: url(../group/img/i-navBg-l_on.png) no-repeat;
   background: url(../img/web/group/i-navBg-l_on.png) no-repeat;
   left: 50%;
}
.i-nav5.active,
@@ -133,7 +134,7 @@
.i-nav5:hover,
.i-nav6:hover,
.i-nav7:hover{
   background: url(../group/img/i-navBg-r_on.png) no-repeat;
   background: url(../img/web/group/i-navBg-r_on.png) no-repeat;
   right: 50%;
}

@@ -213,7 +214,7 @@
   position: relative;
   width: 100%;
   height: 185px;
   background: url("../group/img/left-box1.png") no-repeat;
   background: url("../img/web/group/left-box1.png") no-repeat;
   background-size: 100% 100%;
   margin-bottom: 18px;
   padding: 36px 20px 8px 20px;
@@ -235,13 +236,14 @@
   background-size: 100% 100%;
}


.panel-title  .dot {
   display: inline-block;
   height: 16px;
   width: 16px;
   vertical-align:middle;
   margin:-2px 0 0 5px;
   background: url("../group/img/icon_dot.png") no-repeat;
   background: url("../img/web/group/icon_dot.png") no-repeat;
   -webkit-animation: title 2.5s ease-in-out infinite;
   animation: title 2.5s ease-in-out infinite;
}
@@ -262,7 +264,7 @@
   height: 90px;
   width: 481px;
   overflow: hidden;
   background: url(../group/img/left-m1-bg.png) no-repeat;
   background: url(../img/web/group/left-m1-bg.png) no-repeat;
   margin-top: 35px;
}

@@ -311,7 +313,7 @@


.left-m2 {
   background: url("../group/img/left-box2.png") no-repeat;
   background: url("../img/web/group/left-box2.png") no-repeat;
   width: 100%;
   height: 362px;
   box-sizing: border-box;
@@ -325,7 +327,7 @@
   width: 100%;
   height: 31px;
   line-height: 31px;
   background: url("../group/img/left-m2-bg.png") no-repeat;
   background: url("../img/web/group/left-m2-bg.png") no-repeat;
   background-size: 100% 100%;
   display: flex;
   font-size: 14px;
@@ -381,7 +383,7 @@
   position: relative;
   width: 100%;
   height: 328px;
   background: url("../group/img/left-box3.png") no-repeat;
   background: url("../img/web/group/left-box3.png") no-repeat;
   background-size: 100% 100%;
   margin-bottom: 1vw;
}
@@ -430,14 +432,18 @@
}

.right-map>img {
   width: 700px;
   height: 540px;
   /* width: 700px;
   height: 540px; */
   width: 350px;
    height: 627px;
    margin-top: -40px;
}

.right-map-item {
   position: absolute;
   text-align: center;
   z-index: 3;
/*    z-index: 3; */
   cursor: pointer;
}

.right-map-item p {
@@ -447,32 +453,31 @@
}

.right-map-item1 {
   left: 420px;
   top: 55px;
   left: 386px;
    top: 59px;
}

.right-map-item2 {
   left: 505px;
   top: 95px;
   left: 385px;
    top: 202px;
}

.right-map-item3 {
   left: 250px;
   top: 180px;
   left: 368px;
    top: 275px;
}
.right-map-item04 {
   left: 340px;
   top: 115px;
   left: 357px;
    top: 320px;
}

.right-map-item4 {
   left: 388px;
   top: 170px;
   left: 382px;
    top: 349px;
}

.right-map-item5 {
   left: 575px;
   top: 200px;
   left: 435px;
    top: 370px;
}

.right-map-item6 {
@@ -481,15 +486,23 @@
}

.right-map-item7 {
   left: 130px;
   top: 420px;
   left: 283px;
    top: 351px;
}

.right-map-item8{
   left: 295px;
    top: 428px;
}
.right-map-item9{
   left: 387px;
    top: 451px;
}
/* 地图弹窗 */

.right-map .map-lay{
   width:280px;
   height:186px;
   background-image:url(../group/img/sup-popBg3.png);
   background-image:url(../img/web/group/sup-popBg3.png);
   background-repeat:no-repeat;
   background-size:100% 100%;
   position: absolute;
@@ -504,7 +517,7 @@
.right-map .map-lay .close{
   width:10px;
   height:10px;
   background:url(../group/img/icon_close.png) no-repeat;
   background:url(../img/web/group/icon_close.png) no-repeat;
   background-size:100% 100%;
   float:right;
   margin:-5px 20px 0 0 ;
@@ -520,12 +533,12 @@
   text-align:left;
   overflow:hidden;
   text-overflow: ellipsis;
   background:url(../group/img/dbx1.png) no-repeat left bottom;
   background:url(../img/web/group/dbx1.png) no-repeat left bottom;
   background-size:100% 1px;
   white-space:nowrap;
}
.right-map .map-lay  li:last-child{
   background:none;.right-map-item3
   background:none;
}
.right-map-item04 .map-lay{
   top:8px;
@@ -533,7 +546,7 @@
}

.right-map-item3 .map-lay,.right-map-item5 .map-lay,.right-map-item6 .map-lay{
   background-image:url(../group/img/sup-popBg1.png);
   background-image:url(../img/web/group/sup-popBg1.png);
   top:-138px;
   left:-250px;
}
@@ -541,10 +554,11 @@
   margin:0;
}
.right-map-item7 .map-lay{
   background-image:url(../group/img/sup-popBg2.png);
   background-image:url(../img/web/group/sup-popBg2.png);
   top:-148px;
   left:-115px;
}


.right-map .map-lay  li a{
   color:#fff
@@ -557,46 +571,36 @@
   display: inline-block;
   height: 50px;
   width: 50px;
   background: url("../group/img/icon-dian.png") no-repeat;
   z-index:0;
   background: url("../img/web/group/icon-dian.png") no-repeat;
   -webkit-animation: title 2.5s ease-in-out infinite;
   animation: title 2.5s ease-in-out infinite;
}

.xianqu {
   background: url("../group/img/icon-dian.png") no-repeat;
}
/*.xianqu {*/
/*   background: url("../img/web/group/icon-dian.png") no-repeat;*/
/*}*/

.right-map-item:hover .xianqu{
   background: url("../group/img/icon-dian-h.png") no-repeat;
}
/*.right-map-item:hover .xianqu{*/
/*   background: url("../img/web/group/icon-dian-h.png") no-repeat;*/
/*}*/

.gongsi{
   background: url("../group/img/icon-gongsi.png") no-repeat;
}
/*.gongsi{*/
/*   background: url("../img/web/group/icon-gongsi.png") no-repeat;*/
/*}*/

.right-map-item:hover .gongsi{
   background: url("../group/img/icon-gongsi-h.png") no-repeat;
}
/*.right-map-item:hover .gongsi{*/
/*   background: url("../img/web/group/icon-gongsi-h.png") no-repeat;*/
/*}*/

.gongsi1{
   background: url("../group/img/icon-gongsi1.png") no-repeat;
}
/*.kuqu{*/
/*   background: url("../img/web/group/icon-kuqu.png") no-repeat;*/
/*}*/

.right-map-item:hover .gongsi1{
   background: url("../group/img/icon-gongsi1-h.png") no-repeat;
}
/*.right-map-item:hover .kuqu{*/
/*   background: url("../img/web/group/icon-kuqu-h.png") no-repeat;*/
/*}*/

.kuqu{
   background: url("../group/img/icon-kuqu.png") no-repeat;
}

.kuqu-h{
   background: url("../group/img/icon-kuqu-h.png") no-repeat;
}

.right-map-item:hover .kuqu{
   background: url("../group/img/icon-kuqu-h.png") no-repeat;
}

@keyframes title {
   from {
@@ -636,7 +640,7 @@
   position: relative;
   width: 100%;
   height: 185px;
   background: url("../group/img/left-box1.png") no-repeat;
   background: url("../img/web/group/left-box1.png") no-repeat;
   background-size: 100% 100%;
   margin-bottom: 18px;
   padding: 36px 20px 8px 20px;
@@ -682,7 +686,7 @@
}

.right-topInfo-box2 {
   background: url("../group/img/left-box2.png") no-repeat;
   background: url("../img/web/group/left-box2.png") no-repeat;
   width: 100%;
   height: 362px;
   box-sizing: border-box;
@@ -704,7 +708,7 @@
   height: 90px;
   margin: 20px auto;
   overflow: hidden;
   background: url("../group/img/right-m2-bg.png") no-repeat;
   background: url("../img/web/group/right-m2-bg.png") no-repeat;
   background-size: 100% 100%;
}

@@ -748,7 +752,7 @@


.right-bottom {
   background: url("../group/img/bottom-box.png") no-repeat;
   background: url("../img/web/group/bottom-box.png") no-repeat;
   width: 1320px;
   height: 328px;
   box-sizing: border-box;
@@ -757,7 +761,7 @@
}

.bottom-container .panel-content .stats-chart-box {
   display: inline-block;
   /* display: inline-block; */
   vertical-align: top;
   height: 100%;
   width: 100%;
@@ -769,11 +773,11 @@
   width: 158px;
   height: 36px;
   line-height: 36px;
   background: url("../group/img/bottom-titbg.png") no-repeat;
   background: url("../img/web/group/bottom-titbg.png") no-repeat;
   background-size: 100% 100%;
   font-size: 18px;
   color: #ffffff;
   margin-top: 10px;
   margin-top: 2px;
}


@@ -782,7 +786,7 @@
   vertical-align: top;
   height: 100%;
   width: calc(100% / 5);
   background: url("../group/img/bg-line.png") right bottom no-repeat;
   background: url("../img/web/group/bg-line.png") right bottom no-repeat;
   box-sizing: border-box;
   text-align: center;
   float: left;
@@ -796,8 +800,9 @@
   width: 100%;
   height: calc(100% - 36px);
}


.chart-box{
   margin-top: -15px;
}

/* data */
.data-top {
@@ -810,7 +815,7 @@
   position: relative;
   width: 529px;
   height: 358px;
   background: url("../group/img/data-left-boxBg.png") no-repeat;
   background: url("../img/web/group/data-left-boxBg.png") no-repeat;
   background-size: 100% 100%;
   padding: 36px 20px 8px 20px;
   box-sizing: border-box;
@@ -863,7 +868,7 @@
   width: 135px;
   height: 30px;
   line-height: 30px;
   background: url("../group/img/select-bg.png") no-repeat;
   background: url("../img/web/group/select-bg.png") no-repeat;
   background-size: 100% 100%;
   color: #fff;
   text-align: center;
@@ -923,7 +928,7 @@
   left: 1px;
   width: 18px;
   height: 18px;
   background: url(../group/img/icon-duihao.png) no-repeat;
   background: url(../img/web/group/icon-duihao.png) no-repeat;
}


@@ -951,7 +956,7 @@
.data-top-btn:last-child{
   width: -webkit-calc(50% - 5px);
   width: calc(50% - 5px);

	
}

.data-top-btn:first-child{
@@ -960,13 +965,13 @@

.data-top-btn:first-child:active,
.data-top-btn:first-child:hover{
   background: url("../group/img/data-top-btn_03.png") no-repeat;
   background: url("../img/web/group/data-top-btn_03.png") no-repeat;
   background-size: 100% 100%;
}

.data-top-btn:last-child:active,
.data-top-btn:last-child:hover{
   background: url("../group/img/data-btn-h_04.png") no-repeat;
   background: url("../img/web/group/data-btn-h_04.png") no-repeat;
   background-size: 100% 100%;
}

@@ -979,7 +984,7 @@


.data-top-right {
   background: url(".../group/img/data-right-box.png") no-repeat;
   background: url("../img/web/group/data-right-box.png") no-repeat;
   width: 1320px;
   height: 358px;
   box-sizing: border-box;
@@ -989,7 +994,7 @@
}

.data-bottom {
   background: url("../group/img/data-bottom-box.png") no-repeat;
   background: url("../img/web/group/data-bottom-box.png") no-repeat;
   background-size: 100% 100%;
   width: 100%;
   height: 486px;
@@ -1003,7 +1008,7 @@
   min-width: 100%;
   height: 448px;
   overflow: auto;

	
}

.data-tableBox::-webkit-scrollbar {
@@ -1027,8 +1032,9 @@
}

.data-table-hd{
   height: 72px;
   height: 36px;
   min-width: 100%;
   background: rgba(9, 70, 154, 0.6);
   border-radius: 10px;
   white-space: nowrap;
   display: inline-block;
@@ -1048,8 +1054,8 @@
   position: relative;
   line-height: 36px;
   display: inline-block;
   font-size: 15px;
   text-align: left;
   font-size: 18px;
   text-align: center;
   width: 80px;
   box-sizing: border-box;
   margin: 0 10px;
@@ -1091,7 +1097,7 @@
   white-space: nowrap;
   z-index: 3;
   text-align: center;
   background: url(../group/img/bottom-titbg.png) no-repeat;
   background: url(../img/web/group/bottom-titbg.png) no-repeat;
   background-size: 100% 100%;
   padding: 0 30px;
   box-sizing: border-box;
@@ -1113,7 +1119,7 @@
/* supervise */

.sup-body{
   background: url("../group/img/sup-body.png") no-repeat;
   background: url("../img/web/group/sup-body.png") no-repeat;
   width: 1869px;
   height: 853px;
   background-size: 100% 100%;
@@ -1163,7 +1169,7 @@
}

.sup-topInfo-kd .right-topInfo-kd-item p {

	
   font-size: 40px;
   line-height: 55px;
   font-weight: normal;
@@ -1193,7 +1199,7 @@
.sup-right{
   width: 381px;
   height: 853px;
   background: url("../group/img/sup-right2.png") no-repeat;
   background: url("../img/web/group/sup-right2.png") no-repeat;
   background-size: 100% 100%;
}

@@ -1207,12 +1213,12 @@
   height: 277px;
   margin-top: -138px;
   cursor: pointer;
   background: url("../group/img/sup-right-btn.png") no-repeat;
   background: url("../img/web/group/sup-right-btn-on.png") no-repeat;
   background-size: 100% 100%;
}

.sup-rightWrap.showOn .sup-right-btn{
   background: url("../group/img/sup-right-btn-on.png") no-repeat;
   background: url("../img/web/group/sup-right-btn.png") no-repeat;
   background-size: 100% 100%;
}

@@ -1284,6 +1290,8 @@
}




/* plan */
.plan-top-center,
.plan-top-left{
@@ -1295,7 +1303,7 @@
}

.plan-top-left{
   background: url(../group/img/plan-left-boxBg.png) no-repeat;
   background: url(../img/web/group/plan-left-boxBg.png) no-repeat;
   background-size: 100% 100%;
   padding: 36px 20px 2px 20px;
}
@@ -1310,7 +1318,7 @@

.plan-top-left .data-area-select{
   width: 236px;
   background: url("../group/img/select-bg-lang.png") no-repeat;
   background: url("../img/web/group/select-bg-lang.png") no-repeat;
   background-size: 100% 100%;
}

@@ -1337,7 +1345,7 @@

.plan-top-center{
   margin-left: 25px;
   background: url(../group/img/plan-center-boxBg.png) no-repeat;
   background: url(../img/web/group/plan-center-boxBg.png) no-repeat;
   background-size: 100% 100%;
   padding: 36px 30px 9px 30px;
}
@@ -1345,7 +1353,7 @@
.plan-center-top{
   height: 51px;
   line-height: 50px;
   background: url(../group/img/plan-center-top.png) center no-repeat;
   background: url(../img/web/group/plan-center-top.png) center no-repeat;
   background-size: 100% 100%;
   padding: 0 10px;
   margin-top: 7px;
@@ -1427,8 +1435,8 @@
   width: 80px;
   position: relative;
   display: table;


	
	
}
.plan-progress-group dt span{
   line-height: 24px;
@@ -1494,7 +1502,7 @@
   width: 922px;
   background-size: 100% 100%;
   height: 355px;
   background: url("../group/img/plan-right-box.png") no-repeat;
   background: url("../img/web/group/plan-right-box.png") no-repeat;
}

.plan-top-right .panel-content .stats-chart-box .chart-item{
@@ -1518,7 +1526,7 @@

.animate{
   -webkit-animation: animate-positive 2s;
   animation: animate-positive 2s;
    animation: animate-positive 2s;
}

@-webkit-keyframes animate-positive{
@@ -1526,7 +1534,7 @@
}

@keyframes animate-positive{
   0%{ width: 0; }
    0%{ width: 0; }
}


@@ -1559,13 +1567,13 @@
   height: 6px;
   margin: 0 3px;
   display: inline-block;
   background: url(../group/img/visual/lb-tab.png)  no-repeat;
   background: url(../img/web/group/lb-tab.png)  no-repeat;
}

.carousel-tab.bg,
.lb-tab.bg{
   width: 26px;
   background: url(../group/img/lb-tab-on.png)  no-repeat;
   background: url(../img/web/group/lb-tab-on.png)  no-repeat;
}

.lb-btn{
@@ -1608,4 +1616,14 @@
.tubiao-Carousel .stats-chart-box{
   position: absolute;
   width: 100%;
}
}