lixuefeng/fengjie-datascreen
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat：完善首页样式

Browse Source
This commit is contained in:
zjc
2024-12-25 12:52:26 +08:00
parent 1d301b2d8f
commit 45c85763dd
10 changed files with 151 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
src/views/home/components/box-3.vue
View File

@@ -56,13 +56,8 @@
</div>
<div class="progress-box">
<span class="text">工单完成数</span>
<div class="progress">
<el-progress
:percentage="50"
:show-text="false"
color="linear-gradient( to right,
#00C4F9 0%, #00C4F9 100%)"
/>
<div class="progress-1">
<el-progress :percentage="50" :show-text="false" />
</div>
<span class="value">50%</span>
</div>
@@ -80,13 +75,8 @@
</div>
<div class="progress-box">
<span class="text">工单完成数</span>
<div class="progress">
<el-progress
:percentage="50"
:show-text="false"
color="linear-gradient( to right,
#DA3637 0%, #DA3637 100%)"
/>
<div class="progress-2">
<el-progress :percentage="50" :show-text="false" />
</div>
<span class="value">50%</span>
</div>
@@ -120,8 +110,8 @@
</template>
<script setup>
import ScrollNumber from '@/components/ScrollNumber/index.vue'
import countup from 'vue-countup-v3'
import ScrollNumber from '@/components/ScrollNumber/index.vue'
let count = ref('6945959')
</script>
@@ -225,6 +215,21 @@
}
.progress {
width: vw(100);
:deep(.el-progress-bar__outer) {
background-color: #0858ae !important;
}
}
.progress-1 {
@extend .progress;
:deep(.el-progress-bar__inner) {
background: linear-gradient(to right, #0566bb 0%, #00c4f9 100%);
}
}
.progress-2 {
@extend .progress;
:deep(.el-progress-bar__inner) {
background: linear-gradient(to right, #0566bb 0%, #d6383a 100%);
}
}
.value {
margin-left: vw(10);