|
@@ -1,151 +1,204 @@
|
|
|
.charge-box {
|
|
|
- display: flex;
|
|
|
- padding: 0 20px;
|
|
|
- flex-direction: column;
|
|
|
- margin-top: 15px;
|
|
|
- .charge-tools {
|
|
|
- height: 88px;
|
|
|
- background-color: #111827;
|
|
|
- border: #192337 solid 1px;
|
|
|
- padding: 25px;
|
|
|
- width: 100%;
|
|
|
+ display: flex;
|
|
|
+ padding: 0 20px;
|
|
|
+ flex-direction: column;
|
|
|
+ margin-top: 15px;
|
|
|
+ .charge-tools {
|
|
|
+ height: 88px;
|
|
|
+ background-color: #111827;
|
|
|
+ border: #192337 solid 1px;
|
|
|
+ padding: 25px;
|
|
|
+ width: 100%;
|
|
|
|
|
|
- .serch {
|
|
|
- background-color: #111827;
|
|
|
- width: 70px;
|
|
|
- height: 40px;
|
|
|
- border: #263042 solid 1px;
|
|
|
- margin-left: 8px;
|
|
|
- font-size: 16px;
|
|
|
- }
|
|
|
- .serch:hover{
|
|
|
- color: #69b889;
|
|
|
- background-color: #181e2e;
|
|
|
- border-color: #69b889;
|
|
|
- }
|
|
|
- .actve {
|
|
|
- background-color: #91fdb9;
|
|
|
- color: #111827;
|
|
|
- border: none;
|
|
|
- }
|
|
|
- .actve:hover{
|
|
|
- background-color: #69b889;
|
|
|
- border-color: #69b889;
|
|
|
- color: white;
|
|
|
- }
|
|
|
+ .serch {
|
|
|
+ background-color: #111827;
|
|
|
+ width: 70px;
|
|
|
+ height: 40px;
|
|
|
+ border: #263042 solid 1px;
|
|
|
+ margin-left: 8px;
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
+ .serch:hover {
|
|
|
+ color: #69b889;
|
|
|
+ background-color: #181e2e;
|
|
|
+ border-color: #69b889;
|
|
|
+ }
|
|
|
+ .actve {
|
|
|
+ background-color: #91fdb9;
|
|
|
+ color: #111827;
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+ .actve:hover {
|
|
|
+ background-color: #69b889;
|
|
|
+ border-color: #69b889;
|
|
|
+ color: white;
|
|
|
+ }
|
|
|
|
|
|
- .days {
|
|
|
- background-color: #111827;
|
|
|
- height: 40px;
|
|
|
- border: #263042 solid 1px;
|
|
|
- width: 92px;
|
|
|
- margin-right: 18px;
|
|
|
- font-size: 16px;
|
|
|
- }
|
|
|
+ .days {
|
|
|
+ background-color: #111827;
|
|
|
+ height: 40px;
|
|
|
+ border: #263042 solid 1px;
|
|
|
+ width: 92px;
|
|
|
+ margin-right: 18px;
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
|
|
|
- .times {
|
|
|
- background-color: #111827;
|
|
|
- height: 40px;
|
|
|
- border: #263042 solid 1px;
|
|
|
- }
|
|
|
+ .times {
|
|
|
+ background-color: #111827;
|
|
|
+ height: 40px;
|
|
|
+ border: #263042 solid 1px;
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .charge-table {
|
|
|
- padding: 15px 25px;
|
|
|
- background-color: #111827;
|
|
|
- border: #192337 solid 1px;
|
|
|
- width: 100%;
|
|
|
- min-height: 68vh;
|
|
|
- margin-top: 15px;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
+ .charge-table {
|
|
|
+ padding: 15px 25px;
|
|
|
+ background-color: #111827;
|
|
|
+ border: #192337 solid 1px;
|
|
|
+ width: 100%;
|
|
|
+ min-height: 68vh;
|
|
|
+ margin-top: 15px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
|
|
|
- .charge-table-top {
|
|
|
- height: 50px;
|
|
|
- width: 100%;
|
|
|
- text-align: right;
|
|
|
- margin-bottom: 10px;
|
|
|
+ .charge-table-top {
|
|
|
+ height: 50px;
|
|
|
+ width: 100%;
|
|
|
+ text-align: right;
|
|
|
+ margin-bottom: 10px;
|
|
|
|
|
|
- .daochu {
|
|
|
- background-color: #111827;
|
|
|
- width: 100px;
|
|
|
- border: #91fdb9 solid 1px;
|
|
|
- color: #91fdb9;
|
|
|
- height: 40px;
|
|
|
- font-size: 14px;
|
|
|
- font-weight: 600;
|
|
|
- }
|
|
|
- }
|
|
|
+ .daochu {
|
|
|
+ background-color: #111827;
|
|
|
+ width: 100px;
|
|
|
+ border: #91fdb9 solid 1px;
|
|
|
+ color: #91fdb9;
|
|
|
+ height: 40px;
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: 600;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .charge-table-bottom {
|
|
|
- width: 100%;
|
|
|
- min-height: 100%;
|
|
|
- background-color: #111827;
|
|
|
- .el-progress-bar{
|
|
|
- width: 50%;
|
|
|
- .el-progress-bar__inner{
|
|
|
- background-color:#91fdb9
|
|
|
- }
|
|
|
- }
|
|
|
- .el-progress__text{
|
|
|
- color: white;
|
|
|
- }
|
|
|
+ .charge-table-bottom {
|
|
|
+ width: 100%;
|
|
|
+ min-height: 100%;
|
|
|
+ background-color: #111827;
|
|
|
+ .el-progress-bar {
|
|
|
+ width: 50%;
|
|
|
+ .el-progress-bar__inner {
|
|
|
+ background-color: #91fdb9;
|
|
|
}
|
|
|
+ }
|
|
|
+ .el-progress__text {
|
|
|
+ color: white;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .pageblock {
|
|
|
- text-align: right;
|
|
|
- padding: 15px 0px;
|
|
|
- }
|
|
|
+ .pageblock {
|
|
|
+ text-align: right;
|
|
|
+ padding: 15px 0px;
|
|
|
}
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
-.checkFirst{
|
|
|
- height: 40px;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- padding: 0 12px;
|
|
|
- color: #fff;
|
|
|
- font-size: 15px;
|
|
|
- font-weight: 600;
|
|
|
- margin: 0 auto;
|
|
|
- justify-content: center;
|
|
|
+.checkFirst {
|
|
|
+ height: 40px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding: 0 12px;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 15px;
|
|
|
+ font-weight: 600;
|
|
|
+ margin: 0 auto;
|
|
|
+ justify-content: center;
|
|
|
}
|
|
|
.setExport {
|
|
|
- margin: 35px auto;
|
|
|
+ margin: 35px auto;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ padding-bottom: 45px;
|
|
|
+ flex-direction: column;
|
|
|
+ span {
|
|
|
+ color: #fff;
|
|
|
+ font-size: 15px;
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-input {
|
|
|
+ width: 240px;
|
|
|
+ margin-right: 15px;
|
|
|
+ }
|
|
|
+ .el-form {
|
|
|
display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- padding-bottom: 45px;
|
|
|
- flex-direction: column;
|
|
|
+ .el-button {
|
|
|
+ background-color: #91fdb9;
|
|
|
+ border-color: #91fdb9;
|
|
|
+ font-weight: 600;
|
|
|
+ letter-spacing: 1px;
|
|
|
+ span {
|
|
|
+ color: #0b111d;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-form-item {
|
|
|
+ display: flex;
|
|
|
+ margin-left: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .descript {
|
|
|
+ color: #d9001b;
|
|
|
+ text-indent: 1em;
|
|
|
+ font-weight: normal;
|
|
|
+ }
|
|
|
+}
|
|
|
+@media screen and (max-width: 1440px) {
|
|
|
+ .charge-box .charge-table .charge-table-top .daochu span {
|
|
|
+ position: relative;
|
|
|
+ left: -3px;
|
|
|
+ top: -2px;
|
|
|
+ }
|
|
|
+ .charge-box .charge-tools .serch span {
|
|
|
+ position: relative;
|
|
|
+ left: -3px;
|
|
|
+ top: -2px;
|
|
|
+ }
|
|
|
+}
|
|
|
+@media screen and (max-width: 1278px) {
|
|
|
+ .charge-box .charge-table .charge-table-top .daochu {
|
|
|
+ width: 130px;
|
|
|
+ height: 48px;
|
|
|
span {
|
|
|
- color: #fff;
|
|
|
- font-size: 15px;
|
|
|
- text-align: right;
|
|
|
+ position: relative;
|
|
|
+ left: -3px;
|
|
|
+ top: -2px;
|
|
|
}
|
|
|
-
|
|
|
- .el-input {
|
|
|
- width: 240px;
|
|
|
- margin-right: 15px;
|
|
|
- }
|
|
|
- .el-form{
|
|
|
- display: flex;
|
|
|
- .el-button{
|
|
|
- background-color: #91fdb9;
|
|
|
- border-color: #91fdb9;
|
|
|
- font-weight: 600;
|
|
|
- letter-spacing: 1px;
|
|
|
- span{
|
|
|
- color: #0b111d;
|
|
|
- }
|
|
|
- }
|
|
|
- .el-form-item{
|
|
|
- display: flex;
|
|
|
- margin-left:0;
|
|
|
- }
|
|
|
+ }
|
|
|
+ .charge-box .charge-tools .serch {
|
|
|
+ width: 80px;
|
|
|
+ height: 46px;
|
|
|
+ span {
|
|
|
+ position: relative;
|
|
|
+ left: -3px;
|
|
|
+ top: -2px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .charge-box .charge-tools .actve {
|
|
|
+ position: relative;
|
|
|
+ top: -1px;
|
|
|
+ }
|
|
|
+ .el-form--inline .el-form-item__content {
|
|
|
+ .el-select {
|
|
|
+ height: 46px;
|
|
|
+ }
|
|
|
+ .charge-box .charge-tools .times {
|
|
|
+ height: 46px;
|
|
|
}
|
|
|
- .descript{
|
|
|
- color: #D9001B;
|
|
|
- text-indent: 1em;
|
|
|
- font-weight: normal;
|
|
|
+ }
|
|
|
+ .charge-box .charge-tools {
|
|
|
+ .el-form-item {
|
|
|
+ margin-left: 35px !important;
|
|
|
+ margin-right: 0px !important;
|
|
|
}
|
|
|
-}
|
|
|
+ .el-form-item:last-child {
|
|
|
+ margin-left: 10px !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|