<template>
  <div id="busyBar">
    <progress
      class="progress is-small is-primary"
      max="100"
      v-if="isBusy"
    ></progress>
    <progress
      class="progress is-small is-primary"
      v-bind:value="progress"
      max="100"
      v-if="progress < 100"
      >{{ progress }}%</progress
    >
  </div>
</template>

<script>
export default {
  name: "BusyBar",
  computed: {
    isBusy() {
      return this.$store.getters.busy;
    },
    progress() {
      return this.$store.getters.progress;
    }
  }
};
</script>
