From 0eb2de2d7631496fb6d9db215852c43b49793f6a Mon Sep 17 00:00:00 2001 From: wangqi <magical1908@outlook.com> Date: 星期一, 12 四月 2021 15:08:45 +0800 Subject: [PATCH] Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetwork into develop --- src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue | 98 ++++++++++++++++--------------------------------- 1 files changed, 32 insertions(+), 66 deletions(-) diff --git a/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue b/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue index 7296b46..efb16e4 100644 --- a/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue +++ b/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue @@ -5,20 +5,19 @@ <div class="border_corner border_corner_left_bottom"></div> <div class="border_corner border_corner_right_bottom"></div> <ul class="tab"> - <li @click='tabTaggle("ECharts")'>瀹炴椂鏁版嵁</li> + <li @click='tabTaggle("Echarts")'>瀹炴椂鏁版嵁</li> <li @click='tabTaggle("EChartsHour")'>灏忔椂鏁版嵁</li> <li @click='tabTaggle("EChartsDate")'>鏃ユ暟鎹�</li> <li @click='tabTaggle("ECharts")'>浜哄伐鏁版嵁</li> - <div id="title" > - <span><strong> </strong></span> - <span >姝e父</span> - <span ></span> - <span >棰勮</span> - <span ></span> - <span >瓒呮爣</span> - <span ></span> - </div> </ul> + <div class="legend" > + <span >姝e父</span> + <i style=" background: #4ec99c;"></i> + <span >棰勮</span> + <i style=" background: red;"></i> + <span >瓒呮爣</span> + <i style=" background: orange;"></i> + </div> <component :is="currentTab" v-bind="$attrs"></component> </div> </template> @@ -48,17 +47,11 @@ </script> -<style scoped> -* { - margin: 0; - padding: 0; - list-style: none; -} - +<style scoped lang="less"> .win { position: relative; /*margin-bottom: 13px;*/ - background-color: rgba(33, 41, 69, 0.9); + background:@background-color; border: 0.8px solid #396d83; /*height: 1.5rem;*/ } @@ -103,66 +96,39 @@ .tab { display: flex; border-bottom: 1px solid #396d83; - margin-bottom: 10px; + padding:5px 10px } -li { +.tab li { background-color: #243a55; - margin: 10px 10px 2px 10px; - /*padding: 5px 10px;*/ - width: 90px; - height: 25px; line-height: 25px; text-align: center; border-radius: 5px; + margin-right: 10px; + padding:0 15px } -ul li:hover { +.tab li:hover { background-color: #0e639e; color: #682000; cursor: pointer; } -#title{ - height: 30px; - /* margin-top: 30px; */ - color: #ffffff; - margin-top: 5px; +.legend{ + position: absolute; + top:10px; + right: 0; + display: flex; + justify-items: center; +} +.legend i { + display: block; + width: 35px; + height: 15px; + margin:0 10px 0 3px; + border-radius: 3px; +} +.legend span{ + line-height: 15px; } -#title span:nth-child(1){ - /*margin-left: 478px*/ -} -#title span:nth-child(2){ - /*margin-left: 177px*/ -} -#title span:nth-child(3){ - display: inline-block; - background-color: #4ec99c; - height: 15px; - width: 35px; - margin-left: 10px; - border-radius: 5px; -} -#title span:nth-child(6){ - /*margin-left: 21px*/ -} -#title span:nth-child(7){ - display: inline-block; - background-color: red; - height: 15px; - width: 35px; - margin-left: 7px; - border-radius: 5px; -} -#title span:nth-child(4){ - margin-left: 17px; -} -#title span:nth-child(5){ - display: inline-block; - background-color: orange; - height: 15px; - width: 35px; - margin-left: 9px; - border-radius: 5px; -} </style> -- Gitblit v1.8.0