| | |
| | | .bajgxt-home { |
| | | height: 100%; |
| | | width: 100%; |
| | | // width: 1920px; |
| | | // height: 1080px; |
| | | background: url("../../../public/img/bajgxt/backimg.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | |
| | |
| | | text-align: center; |
| | | line-height: 77px; |
| | | } |
| | | // span:nth-child(2) { |
| | | // position: absolute; |
| | | // margin-top: 22px; |
| | | // margin-left: 26%; |
| | | // font-size: 22px; |
| | | // cursor: pointer; |
| | | // &:hover { |
| | | // color: #90cef0; |
| | | // } |
| | | // } |
| | | img { |
| | | position: absolute; |
| | | margin-top: 22px; |
| | |
| | | float: right; |
| | | color: #fff; |
| | | margin-right: 52px; |
| | | font-size: 17px; |
| | | font-size: 18px; |
| | | margin-top: -35px; |
| | | cursor: pointer; |
| | | &:hover { |
| | | color: #90cef0; |
| | | } |
| | | } |
| | | .side { |
| | | width: 27%; |
| | | height: 100%; |
| | | } |
| | | .content { |
| | | margin: 5px 20px 20px 20px; |
| | | // height: calc(100% - 77px); |
| | | // width: 100%; |
| | | height: calc(100% - 102px); |
| | | width: calc(100% - 40px); |
| | | display: flex; |
| | | .left, |
| | | .right { |
| | | @extend .side; |
| | | width: 27%; |
| | | height: 100%; |
| | | } |
| | | .middle { |
| | | width: calc(46% - 50px); |
| | |
| | | width: 100%; |
| | | height: 260px; |
| | | } |
| | | .echartClass { |
| | | height: 100%; |
| | | .echartClass_1920 { |
| | | // height: 100%; |
| | | width: 100%; |
| | | height: calc(100% - 70px); |
| | | } |
| | |
| | | height: 60%; |
| | | width: 100%; |
| | | background-size: 100% 100%; |
| | | position: relative; |
| | | #left1Echart { |
| | | @extend .echartClass; |
| | | @extend .echartClass_1920; |
| | | height: calc(100% - 140px) !important; |
| | | margin-top: 68px; |
| | | } |
| | | } |
| | | .left2 { |
| | |
| | | width: 100%; |
| | | background-size: 100% 100%; |
| | | margin-top: 25px; |
| | | position: relative; |
| | | #left2Echart { |
| | | @extend .echartClass; |
| | | @extend .echartClass_1920; |
| | | } |
| | | } |
| | | } |
| | |
| | | height: 28%; |
| | | position: relative; |
| | | #right1Echart { |
| | | @extend .echartClass; |
| | | @extend .echartClass_1920; |
| | | } |
| | | } |
| | | .right2 { |
| | |
| | | margin-top: 30px; |
| | | position: relative; |
| | | #right2Echart { |
| | | @extend .echartClass; |
| | | @extend .echartClass_1920; |
| | | } |
| | | } |
| | | .right3 { |
| | |
| | | background-size: 100% 100%; |
| | | margin-top: 25px; |
| | | #right3Echart { |
| | | @extend .echartClass; |
| | | @extend .echartClass_1920; |
| | | } |
| | | } |
| | | } |
| | |
| | | |
| | | .middle { |
| | | .mapimg { |
| | | background: url("../../../public/img/bajgxt/mapimg.png") no-repeat; |
| | | background: url("../../../public/img/bajgxt/u3.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | height: 60%; |
| | | width: 100%; |
| | |
| | | width: 44px; |
| | | height: 56px; |
| | | position: absolute; |
| | | margin-left: -7px; |
| | | margin-top: -9px; |
| | | left: -7px; |
| | | top: -9px; |
| | | } |
| | | .leftbottom { |
| | | background: url("../../../public/img/bajgxt/leftbottom.png") no-repeat; |
| | |
| | | width: 44px; |
| | | height: 56px; |
| | | position: absolute; |
| | | margin-left: -7px; |
| | | margin-top: calc(40% - 66px); |
| | | left: -7px; |
| | | bottom: -7px; |
| | | } |
| | | .righttop { |
| | | background: url("../../../public/img/bajgxt/righttop.png") no-repeat; |
| | |
| | | width: 44px; |
| | | height: 56px; |
| | | position: absolute; |
| | | margin-left: calc(100% - 37px); |
| | | margin-top: -9px; |
| | | left: calc(100% - 37px); |
| | | top: -9px; |
| | | } |
| | | .rightbottom { |
| | | background: url("../../../public/img/bajgxt/rightbottom.png") no-repeat; |
| | |
| | | width: 44px; |
| | | height: 56px; |
| | | position: absolute; |
| | | margin-left: calc(100% - 37px); |
| | | margin-top: calc(40% - 66px); |
| | | left: calc(100% - 37px); |
| | | bottom: -7px; |
| | | } |
| | | } |
| | | } |
| | | .el-table { |
| | | width: calc(100% - 40px); |
| | | height: calc(100% - 65px); |
| | | margin: 0px 20px 15px; |
| | | top: 50px; |
| | | .middle { |
| | | // .el-table { |
| | | // width: calc(100% - 40px); |
| | | // height: calc(100% - 65px); |
| | | // margin: 0px 20px 15px; |
| | | // top: 50px; |
| | | // } |
| | | /deep/ .el-table--striped .el-table__body tr.el-table__row--striped td { |
| | | background: #031d4b !important; |
| | | } |
| | | /deep/ .el-table--enable-row-transition .el-table__body td, |
| | | /deep/ .el-table th, |
| | | .el-table tr { |
| | | background: #03225b !important; |
| | | } |
| | | /deep/ .el-table .cell { |
| | | color: #fff; |
| | | text-align: center; |
| | | } |
| | | /deep/ .el-table td, |
| | | .el-table th.is-leaf { |
| | | border-bottom-color: transparent; |
| | | background: rgb(3, 34, 91) !important; |
| | | } |
| | | /deep/ .el-table__header th { |
| | | border-bottom: 1px solid #031a38 !important; |
| | | } |
| | | /deep/.el-table--enable-row-hover .el-table__body tr:hover > td { |
| | | background-color: #b0caf3; |
| | | } |
| | | } |
| | | /deep/ .el-table--striped .el-table__body tr.el-table__row--striped td { |
| | | background: #18458f; |
| | | } |
| | | /deep/ .el-table--enable-row-transition .el-table__body td, |
| | | /deep/ .el-table th, |
| | | .el-table tr { |
| | | background: #3457b1; |
| | | } |
| | | /deep/ .el-table .cell { |
| | | color: #fff; |
| | | text-align: center; |
| | | } |
| | | /deep/ .el-table td, |
| | | .el-table th.is-leaf { |
| | | border-bottom-color: transparent; |
| | | } |
| | | /deep/.el-table--enable-row-hover .el-table__body tr:hover > td { |
| | | background-color: #b0caf3; |
| | | } |
| | | |
| | | /deep/ .el-input__inner { |
| | | height: 27px; |
| | | color: #fff !important; |
| | |
| | | /deep/ .el-table--border::after, |
| | | /deep/ .el-table--group::after, |
| | | /deep/ .el-table::before { |
| | | background-color: transparent; |
| | | background-color: transparent !important; |
| | | } |
| | | .card-text { |
| | | height: 30px; |
| | |
| | | } |
| | | } |
| | | .right-content { |
| | | height: calc(100% - 41px); |
| | | width: 100%; |
| | | height: calc(100% - 71px); |
| | | width: calc(100% - 30px); |
| | | padding: 15px; |
| | | } |
| | | .card-list { |
| | | margin: 25px 60px 20px 90px; |
| | | margin: 15px 60px 10px 50px; |
| | | display: flex; |
| | | height: 55px; |
| | | line-height: 55px; |
| | |
| | | .mapBtn:nth-child(3) { |
| | | margin-top: 160px; |
| | | } |
| | | /deep/ .el-table__body-wrapper { |
| | | overflow: auto; |
| | | // /deep/ .el-table__body-wrapper { |
| | | // overflow: auto; |
| | | // height: calc(100% - 50px); |
| | | // } |
| | | } |
| | | .left2-btn { |
| | | height: 21px; |
| | | width: 69px; |
| | | background-color: #4478d0; |
| | | color: #fff; |
| | | font-size: 13px !important; |
| | | font-weight: 700; |
| | | |
| | | line-height: 21px !important; |
| | | text-align: center; |
| | | position: absolute; |
| | | cursor: pointer; |
| | | } |
| | | .left2-btn.btn1 { |
| | | right: 106px; |
| | | margin-top: 25px; |
| | | } |
| | | .left2-btn.btn2 { |
| | | right: 25px; |
| | | margin-top: 25px; |
| | | } |
| | | .left2-btn.date { |
| | | right: 47px; |
| | | margin-top: 27px; |
| | | } |
| | | .left2-btn.mounce { |
| | | right: 47px; |
| | | margin-top: 71px; |
| | | } |
| | | .left2-btn.all { |
| | | right: 47px; |
| | | margin-top: 114px; |
| | | } |
| | | |
| | | .rightData { |
| | | position: relative; |
| | | color: #fff; |
| | | background: #010945; |
| | | border-radius: 11px; |
| | | height: 52px; |
| | | display: inline-flex; |
| | | width: 174px; |
| | | cursor: pointer; |
| | | font-weight: 700; |
| | | img { |
| | | margin: 12px; |
| | | height: 28px; |
| | | width: 30px; |
| | | } |
| | | .text { |
| | | width: 100px; |
| | | text-align: center; |
| | | // margin: 3px; |
| | | line-height: 25px; |
| | | span:nth-child(1) { |
| | | width: 100%; |
| | | display: block; |
| | | font-size: 14px; |
| | | } |
| | | span:nth-child(2) { |
| | | width: 100%; |
| | | display: block; |
| | | color: #00ccff; |
| | | font-size: 15px; |
| | | } |
| | | } |
| | | } |
| | | .rightData1 { |
| | | margin-left: 42px; |
| | | margin-top: 23px; |
| | | } |
| | | .rightData2 { |
| | | margin-left: 58px; |
| | | margin-top: 23px; |
| | | } |
| | | .rightData3 { |
| | | margin-top: 21px; |
| | | margin-left: 42px; |
| | | } |
| | | .rightData4 { |
| | | margin-top: 21px; |
| | | margin-left: 58px; |
| | | } |
| | | .rightData5 { |
| | | margin-top: 8px; |
| | | margin-left: 42px; |
| | | } |
| | | |
| | | .textBox { |
| | | width: 70%; |
| | | height: 58px; |
| | | // margin: 0 auto; |
| | | overflow: hidden; |
| | | position: absolute; |
| | | text-align: left; |
| | | color: #09b560; |
| | | left: 20px; |
| | | top: 20px; |
| | | font-size: 15px; |
| | | .text { |
| | | width: 100%; |
| | | position: absolute; |
| | | bottom: 0; |
| | | } |
| | | .slide-enter-active, |
| | | .slide-leave-active { |
| | | transition: all 0.5s linear; |
| | | } |
| | | .slide-enter { |
| | | transform: translateY(20px) scale(1); |
| | | opacity: 1; |
| | | } |
| | | .slide-leave-to { |
| | | transform: translateY(-20px) scale(0.8); |
| | | opacity: 0; |
| | | } |
| | | } |
| | | .leftEchartTitle { |
| | | height: 30px; |
| | | display: flex; |
| | | line-height: 30px; |
| | | margin-top: 10px; |
| | | margin-left: 28px; |
| | | position: absolute; |
| | | .block1 { |
| | | width: 23px; |
| | | height: 13px; |
| | | background: #2ec7c9; |
| | | border-radius: 3px; |
| | | margin-top: 9px; |
| | | } |
| | | span:nth-child(2) { |
| | | color: #fff; |
| | | font-size: 13px; |
| | | margin: 0px 10px 0px 3px; |
| | | } |
| | | span:nth-child(3) { |
| | | color: #2ec7c9; |
| | | font-size: 17px; |
| | | font-weight: 700; |
| | | display: block; |
| | | width: 65px; |
| | | text-align: center; |
| | | } |
| | | span:nth-child(4) { |
| | | font-size: 13px; |
| | | color: #2ec7c9; |
| | | } |
| | | } |
| | | .leftEchartTitle2 { |
| | | right: 35px; |
| | | .block1 { |
| | | background: #b6a2de; |
| | | } |
| | | span:nth-child(3) { |
| | | color: #b6a2de; |
| | | font-size: 15px; |
| | | } |
| | | } |
| | | .leftEchartTitle3 { |
| | | margin-top: 37px; |
| | | .block1 { |
| | | background: #5ab1ef; |
| | | } |
| | | span:nth-child(3) { |
| | | color: #5ab1ef; |
| | | font-size: 15px; |
| | | } |
| | | } |
| | | .leftEchartTitle4 { |
| | | margin-top: 37px; |
| | | right: 36px; |
| | | .block1 { |
| | | background: #ffb980; |
| | | } |
| | | span:nth-child(2) { |
| | | width: 77px; |
| | | } |
| | | span:nth-child(3) { |
| | | color: #ffb980; |
| | | font-size: 15px; |
| | | } |
| | | } |
| | | .leftEchartTitle5 { |
| | | margin-top: 64px; |
| | | .block1 { |
| | | background: #fc8452; |
| | | } |
| | | span:nth-child(3) { |
| | | color: #fc8452; |
| | | font-size: 15px; |
| | | } |
| | | } |
| | | .bayHover { |
| | | background-color: #0445b5; |
| | | color: #fff !important; |
| | | } |
| | | .leftEchartTitle.xbNan { |
| | | right: 47px; |
| | | margin-top: 76px; |
| | | .block1 { |
| | | width: 10px; |
| | | height: 10px; |
| | | background: #008dec; |
| | | margin-top: 10px; |
| | | border-radius: 100%; |
| | | } |
| | | span:nth-child(2) { |
| | | color: #fff; |
| | | font-size: 13px; |
| | | } |
| | | span:nth-child(3) { |
| | | color: #008dec; |
| | | font-size: 17px; |
| | | } |
| | | span:nth-child(4) { |
| | | font-size: 13px; |
| | | color: #008dec; |
| | | } |
| | | } |
| | | .leftEchartTitle.xbNv { |
| | | right: 47px; |
| | | margin-top: 135px; |
| | | .block1 { |
| | | width: 10px; |
| | | height: 10px; |
| | | background: #886eff; |
| | | margin-top: 10px; |
| | | border-radius: 100%; |
| | | } |
| | | span:nth-child(2) { |
| | | color: #fff; |
| | | font-size: 13px; |
| | | } |
| | | span:nth-child(3) { |
| | | color: #886eff; |
| | | font-size: 17px; |
| | | } |
| | | span:nth-child(4) { |
| | | font-size: 13px; |
| | | color: #886eff; |
| | | } |
| | | } |
| | | .showDialog:hover { |
| | | cursor: pointer; |
| | | } |
| | | .bajgxt-home { |
| | | /deep/.dialog { |
| | | z-index: 10000000 !important; |
| | | .el-table { |
| | | top: 0px !important; |
| | | margin: 0px !important; |
| | | width: 100% !important; |
| | | height: calc(100% - 50px) !important; |
| | | .el-table__header { |
| | | background-color: #2d5cc8 !important; |
| | | } |
| | | .el-table__body-wrapper { |
| | | height: calc(100% - 50px); |
| | | overflow-x: hidden; |
| | | overflow-y: auto; |
| | | } |
| | | } |
| | | .el-pagination { |
| | | color: #a2a5a5; |
| | | } |
| | | .btn-prev, |
| | | .btn-next { |
| | | background: transparent !important; |
| | | } |
| | | .el-dialog__body { |
| | | padding: 10px 20px; |
| | | height: calc(100% - 60px); |
| | | .el-input { |
| | | width: 50px !important; |
| | | border-bottom: 1px solid #8a7b7b !important; |
| | | } |
| | | } |
| | | } |
| | | /deep/ .el-dialog { |
| | | width: 80% !important; |
| | | height: 77%; |
| | | } |
| | | } |
| | | .bottom-table { |
| | | width: calc(100% - 40px); |
| | | height: 100%; |
| | | margin: 0px 20px 15px; |
| | | top: 50px; |
| | | .el-table { |
| | | width: 100%; |
| | | height: calc(100% - 65px); |
| | | top: 50px; |
| | | overflow-y: auto; |
| | | } |
| | | } |
| | | ::-webkit-scrollbar { |
| | | display: none; |
| | | } |
| | | .dialog-table { |
| | | top: 0px !important; |
| | | margin: 0px !important; |
| | | width: 100% !important; |
| | | height: calc(100% - 50px) !important; |
| | | overflow: auto; |
| | | .el-table { |
| | | width: 100%; |
| | | height: 100%; |
| | | overflow: auto; |
| | | } |
| | | } |