This commit is contained in:
parent
b0dce9c0b7
commit
23fad724f9
|
@ -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 {
|
||||||
|
|
Loading…
Reference in New Issue