From 45e291c7e7a17d8b34535cc2d6847abcce39f574 Mon Sep 17 00:00:00 2001 From: hanbaoshan <hanbaoshan@aiotlink.com> Date: 星期日, 28 二月 2021 19:13:47 +0800 Subject: [PATCH] 朔黄进度条定制样式 --- src/pages/shuohuangMonitorAnalyze/components/guideIndex.vue | 26 ++++++++++++++++++++++++-- 1 files changed, 24 insertions(+), 2 deletions(-) diff --git a/src/pages/shuohuangMonitorAnalyze/components/guideIndex.vue b/src/pages/shuohuangMonitorAnalyze/components/guideIndex.vue index 67cb70e..48c2ce7 100644 --- a/src/pages/shuohuangMonitorAnalyze/components/guideIndex.vue +++ b/src/pages/shuohuangMonitorAnalyze/components/guideIndex.vue @@ -76,6 +76,7 @@ <div class="val">99%</div> <div class="trend"> <el-progress + class="defined-progress" :percentage="99" stroke-linecap="square" color="#1890ff" @@ -1111,10 +1112,10 @@ <style lang="scss"> .guide-index { .el-progress-bar__outer { - border-radius: 5px; + border-radius: 2px; } .el-progress-bar__inner { - border-radius: 5px; + border-radius: 2px; } .triangle { width: 0; @@ -1133,6 +1134,27 @@ border-right-color: transparent; } } + .defined-progress{ + position: relative; + &:before{ + content: ''; + position: absolute; + width: 2px; + height: 4px; + background: #1890ff; + top: -6px; + right: -5px; + } + &:after{ + content: ''; + position: absolute; + width: 2px; + height: 4px; + background: #1890ff; + bottom: -6px; + right: -5px; + } + } .tab-menu { .el-tabs__item { padding: 0 30px !important; -- Gitblit v1.8.0