| | |
| | | <template> |
| | | <v-scale-screen width="1920" height="960" :fullScreen="true"> |
| | | <v-scale-screen width="1920" height="960"> |
| | | <div class="main_app"> |
| | | <img src="@/assets/images/energy_ef/bg@2x.png" class="main_bg" alt="" /> |
| | | <div class="main_header"> |
| | | <!-- <img src="@/assets/images/maintitle.gif" class="main_header_bg" alt="" /> --> |
| | | <img src="@/assets/images/maintitle@2x.png" class="main_header_bg" alt="" /> |
| | | <div class="title">安泰智慧物流园区-调度能效跟踪</div> |
| | | <div class="time_wrap"> |
| | |
| | | </div> |
| | | <Percent :rate="80" /> |
| | | </div> |
| | | <div class="list"></div> |
| | | <div class="list"> |
| | | <div class="item"> |
| | | <div class="la">黄山(新制皖烟)</div> |
| | | <div class="val">400万支</div> |
| | | </div> |
| | | <div class="item"> |
| | | <div class="la">黄山(新制皖烟)</div> |
| | | <div class="val">400万支</div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | |
| | | .list { |
| | | margin-left: 36px; |
| | | |
| | | .item { |
| | | margin-bottom: 14px; |
| | | font-size: 14px; |
| | | &:nth-last-child(1){ |
| | | |
| | | &:nth-last-child(1) { |
| | | margin: 0; |
| | | } |
| | | |
| | | .line { |
| | | display: flex; |
| | | align-items: center; |
| | | margin-bottom: 6px; |
| | | |
| | | .icon { |
| | | width: 12px; |
| | | height: 12px; |
| | |
| | | background: linear-gradient(270deg, #29aeff 0%, #207ff7 100%); |
| | | } |
| | | } |
| | | .num{ |
| | | |
| | | .num { |
| | | margin-left: 20px; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | .right_box_three{ |
| | | |
| | | .right_box_three { |
| | | .repertory { |
| | | .header { |
| | | padding: 15px; |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | font-size: 14px; |
| | | color: #D2E0FF; |
| | | margin-bottom: 11px; |
| | | .num { |
| | | font-weight: 500; |
| | | font-size: 16px; |
| | | color: #FFFFFF; |
| | | } |
| | | } |
| | | .list{ |
| | | margin-top: 22px; |
| | | .item{ |
| | | width: 100%; |
| | | height: 36px; |
| | | display: flex; |
| | | align-items: center; |
| | | &:nth-of-type(2n+1){ |
| | | background: rgba(0,152,255,0.13); |
| | | } |
| | | .la{ |
| | | flex: 5; |
| | | padding-left: 20px; |
| | | } |
| | | .val{ |
| | | flex: 2; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | |
| | | color: #FFFFFF; |
| | | position: relative; |
| | | z-index: -2; |
| | | |
| | | font-size: 14px; |
| | | .main_bg { |
| | | position: absolute; |
| | | left: 0; |