123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167 |
- .box {
- display: flex;
- }
- .title {
- padding-left: 20px;
- height: 56px;
- width: 100%;
- font-size: 24px;
- // color: #fff;
- line-height: 56px;
- // background: url('@/assets/newUI/theadBg.png') no-repeat center;
- background-size: 100% 100%;
- }
- .listBox {
- width: 33%;
- height: 100%;
- margin-right: 40px;
- display: flex;
- flex-direction: column;
- max-width: 220px;
- :global {
- .ant-empty {
- margin-left: -30px;
- }
- }
- }
- .list {
- flex: 1;
- overflow-y: auto;
- }
- .listItem {
- display: block !important;
- text-align: center;
- margin-bottom: 5px;
- // color: #fff;
- font-size: 20px;
- cursor: pointer;
- border-bottom: 1px solid rgba(153, 231, 255, 0.4);
- }
- .listItemActive {
- .listItem;
- background: #40a9ff !important;
- }
- .tabs {
- display: flex;
- width: 72%;
- align-items: center;
- .item {
- padding: 4px 20px;
- border: 1px solid #02a7f0;
- border-left: none;
- font-size: 20px;
- cursor: pointer;
- max-height: 40px;
- width: 100%;
- white-space: nowrap;
- &:nth-child(1) {
- border-left: 1px solid #02a7f0;
- }
- &.active {
- background-color: #02a7f0;
- }
- }
- .left {
- // background: url('@/assets/newUI/left.png') no-repeat center;
- background-size: 100% 100%;
- width: 31px;
- height: 32px;
- margin-right: 12px;
- cursor: pointer;
- }
- .right {
- // background: url('@/assets/newUI/right.png') no-repeat center;
- background-size: 100% 100%;
- width: 31px;
- height: 32px;
- margin-left: 12px;
- cursor: pointer;
- }
- .content {
- display: flex;
- width: 90%;
- overflow-x: hidden;
- }
- }
- .chartBox {
- width: 100%;
- height: 100%;
- padding: 28px 32px;
- :global {
- .ant-select-selection-item {
- line-height: 60px !important;
- font-size: 30px !important;
- }
- .ant-select-selector {
- height: 60px !important;
- }
- }
- }
- .chartBoxTop {
- display: flex;
- justify-content: space-between;
- align-items: center;
- margin-bottom: 30px;
- }
- .dateTabs {
- display: flex;
- border: 1px solid #d5d5d5;
- height: 60px;
- .dateTabsItem {
- width: 128px;
- text-align: center;
- cursor: pointer;
- border-right: 1px solid #d5d5d5;
- line-height: 60px;
- font-size: 24px;
- font-weight: 400;
- color: #4a4a4a;
- &:last-child {
- border-right: none;
- }
- &.active {
- background: #4a90e2;
- color: #fff;
- }
- }
- }
- .optimization {
- background-color: rgba(245, 166, 35, 0.08);
- padding: 20px 30px;
- margin-top: 24px;
- .title1 {
- font-size: 28px;
- font-weight: 400;
- color: #4a4a4a;
- line-height: 38px;
- margin-bottom: 20px;
- }
- .title2 {
- padding: 6px 20px;
- background: rgba(245, 166, 35, 0.35);
- font-size: 28px;
- font-weight: 400;
- color: #4a4a4a;
- line-height: 38px;
- margin-bottom: 12px;
- }
- .content {
- font-size: 28px;
- font-weight: 400;
- color: #4a4a4a;
- line-height: 38px;
- padding-left: 20px;
- margin-bottom: 10px;
- }
- }
|