diff --git a/components/ProgressIndicator.vue b/components/ProgressIndicator.vue new file mode 100644 index 0000000000000000000000000000000000000000..9bd0e8993fe4836a545469b94cbba564cfd2edcb --- /dev/null +++ b/components/ProgressIndicator.vue @@ -0,0 +1,50 @@ +<template> + <div> + <v-overlay + :value="isInProgress" + :opacity="dark ? 0.5 : 0.05" + > + <v-progress-circular + indeterminate + class="center-absolute" + /> + </v-overlay> + </div> +</template> + +<style> + .center-absolute { + position: fixed; + top: 50%; + left: 50%; + margin-top: -16px; + margin-left: -16px; + } +</style> + +<script lang="ts"> +import { Component, Vue, Prop } from 'nuxt-property-decorator' + +@Component +export default class ProgressIndicator extends Vue { + @Prop({ + default: false, + required: false, + type: Boolean + }) + // @ts-ignore + readonly value!: boolean + + @Prop({ + default: false, + required: false, + type: Boolean + }) + // @ts-ignore + readonly dark!: boolean + + get isInProgress (): boolean { + return this.value + } +} +</script>