柱状图组件

This commit is contained in:
yanran200730
2023-03-09 14:49:34 +08:00
parent 7a04aba3f9
commit f2d0a09dc8

View File

@@ -4,10 +4,12 @@
<i>{{ index + 1 }}</i>
<h2>{{ item.name }}</h2>
<span>{{ item.value }}</span>
<div class="AiRanking-item__rate" :style="{width: item.rate + '%'}">
<div class="bar">
<span></span>
<i></i>
<div class="AiRanking-item__rate--wrapper">
<div class="AiRanking-item__rate" :style="{width: item.rate + '%'}">
<div class="bar">
<span></span>
<i></i>
</div>
</div>
</div>
</div>
@@ -79,6 +81,11 @@
background: url(./asset/ranking1.png) no-repeat;
background-size: 100% 100%;
.AiRanking-item__rate--wrapper {
flex: 1;
background: #6F7171;
}
.AiRanking-item__rate {
position: relative;