round-diagram.vue

<template>
  <div
      class="circle"
      :style="`--progress-value: ${percent};`"
    >
      <div class="circle__progress" />
  </div>
</template>

<script>
export default {
  name: 'round-diagram',
  props: {
    percent: {
      type: Number,
      required: true
    }
  }
}
</script>

<style src="./style.scss" lang="scss" />