This commit is contained in:
duanxiaohai 2024-07-25 13:06:14 +08:00
parent b0dce9c0b7
commit 23fad724f9
1 changed files with 21 additions and 8 deletions

View File

@ -111,7 +111,12 @@
</div> </div>
<div class="tableBoxTopa">{{ item.text }}</div> <div class="tableBoxTopa">{{ item.text }}</div>
<div class="progress-container"> <div class="progress-container">
<div class="progress-bar" :style="{ width: item.progress + '%' }"></div> <div
class="progress-bar"
:style="{ width: item.progress + '%' }"
>
<span>{{ item.progress }}%</span>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -151,7 +156,6 @@ const goto = (url) => {
}; };
const data = reactive({ const data = reactive({
taps: "0", taps: "0",
taps1: "0", taps1: "0",
tabPosition: [ tabPosition: [
@ -483,7 +487,7 @@ const rowState = (row) => {
height: 10px; height: 10px;
background-color: rgba(255, 255, 255, 0.2); background-color: rgba(255, 255, 255, 0.2);
border-radius: 5px; border-radius: 5px;
overflow: hidden; // overflow: hidden;
} }
.progress-bar { .progress-bar {
@ -491,6 +495,15 @@ const rowState = (row) => {
background: linear-gradient(90deg, #31ffd8 0%, #00e5ff 100%); background: linear-gradient(90deg, #31ffd8 0%, #00e5ff 100%);
border-radius: 0px 100px 100px 0px; border-radius: 0px 100px 100px 0px;
transition: width 0.3s ease; transition: width 0.3s ease;
position: relative;
}
.progress-bar span {
position: absolute;
right: -10px;
top: -30%;
transform: translateY(-50%);
color: #fff;
font-size: 18px;
} }
} }
img { img {