- .boxitem {
- // cursor: pointer;
- width: 100%;
- height: auto;
- display: flex;
- .leftbox {
- border: 1px solid #fff;
- justify-content: center;
- align-items: center;
- text-align: center;
- border-radius: 15px;
- margin-bottom: 10px;
- height: 30px;
- width: 100px;
- display: flex;
- flex-wrap: wrap;
- }
- .rightbox {
- width: calc(100% - 20px);
- display: flex;
- flex-wrap: wrap;
- padding: 0 10px;
- .pumpName {
- cursor: pointer;
- height: 30px;
- width: 100px;
- text-align: center;
- line-height: 30px;
- border: 1px solid #fff;
- border-radius: 5px;
- padding: 0 10px;
- margin-right: 8px;
- margin-bottom: 5px;
- overflow: hidden;
- text-overflow: ellipsis;
- /* 超出部分省略号 */
- word-break: break-all;
- /* break-all(允许在单词内换行。) */
- display: -webkit-box;
- /* 对象作为伸缩盒子模型显示 */
- -webkit-box-orient: vertical;
- /* 设置或检索伸缩盒对象的子元素的排列方式 */
- -webkit-line-clamp: 1;
- /* 显示的行数 */
- &.actived {
- color: #1fa9f6;
- border: 1px solid #1fa9f6;
- }
- }
- }
- }
- .topfilter {
- display: flex;
- flex-wrap: wrap;
- height: 60px;
- .selectbox {
- width: 48%;
- height: 25px;
- line-height: 25px;
- margin-right: 5px;
- display: flex;
- .label {
- margin-right: 5px;
- }
- .value {
- cursor: pointer;
- display: flex;
- margin-right: 5px;
- padding: 0px 5px;
- border: 1px solid #fff;
- border-radius: 5px;
- &.actived {
- color: #00b4f6;
- }
- }
- }
- }
- .bottomtable {
- height: calc(100% - 60px);
- }
- :deep(.el-table) {
- background: transparent;
- border: transparent;
- tr {
- background: linear-gradient(0deg, rgba(38, 77, 134, 0.5) 0%, rgba(38, 77, 134, 0.2) 100%) !important;
- color: #b4cded;
- border: none !important;
- margin: 10px;
- }
- .el-table__header-wrapper {
- th {
- background-color: #263a66 !important;
- border-color: transparent;
- color: #9cdfee;
- font-size: 14px;
- font-weight: 400;
- text-align: center;
- }
- }
- .el-table__inner-wrapper::before {
- /* 去除下边框 */
- height: 0;
- }
- td.el-table__cell {
- border-bottom: 0.00521rem solid #00314e !important;
- color: #c6c6c6;
- }
- .el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
- background: #00314e !important;
- }
- tbody tr:hover > td {
- background-color: #367f7f78 !important;
- }
- }
- :deep(.pagination-container) {
- background: transparent !important;
- margin: 0 !important;
- .el-pagination {
- right: 15px;
- }
- }
- :deep(.el-pagination.is-background .btn-prev:disabled) {
- background-color: transparent !important;
- color: #fff;
- }
- :deep(.el-pagination.is-background .btn-prev) {
- background-color: transparent !important;
- color: #fff;
- }
- :deep(.el-pagination.is-background .el-pager li) {
- color: #fff;
- background-color: transparent !important;
- }
- :deep(.el-pagination__total) {
- color: #fff;
- }
- :deep(.el-pagination.is-background .el-pager li.is-active) {
- color: #409eff;
- }
- :deep(.el-pagination__goto) {
- color: #fff;
- }
- :deep(.el-pagination__classifier) {
- color: #fff;
- }
- :deep(.el-pagination.is-background .btn-next:disabled) {
- background: transparent;
- }
- :deep(.el-pagination.is-background .btn-next) {
- background-color: transparent;
- color: #fff;
- }