purityselect_admin/resources/js/views/demos/components/progress-linear/DemoProgressLinearSlots.vue
2024-10-25 19:58:19 +05:00

34 lines
624 B
Vue

<script setup>
const skill = ref(20)
const knowledge = ref(33)
const power = ref(78)
</script>
<template>
<div class="demo-space-y">
<VProgressLinear
v-model="power"
color="primary"
height="8"
/>
<VProgressLinear
v-model="skill"
color="primary"
height="20"
>
<template #default="{ value }">
<span>{{ Math.ceil(value) }}%</span>
</template>
</VProgressLinear>
<VProgressLinear
v-model="knowledge"
height="20"
color="primary"
>
<span>{{ Math.ceil(knowledge) }}%</span>
</VProgressLinear>
</div>
</template>