| | |
| | | <template> |
| | | <div class="pam-loading" v-if="isLoading"> |
| | | <lottie |
| | | :options="defaultOptions" |
| | | <div class="pam-loading" |
| | | v-if="isLoading"> |
| | | <lottie :options="defaultOptions" |
| | | :width="250" |
| | | :height="250" |
| | | :loop="true"/> |
| | |
| | | }) |
| | | export default class Loading extends Vue { |
| | | isLoading=false; |
| | | defaultOptions={ animationData: require('@/assets/lottie/loading.json')}; |
| | | defaultOptions = { |
| | | animationData: require('@/assets/lottie/loading.json') |
| | | }; |
| | | start():void{ |
| | | this.isLoading = true; |
| | | } |
| | |
| | | this.isLoading = false; |
| | | } |
| | | } |
| | | |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | <style lang="scss" |
| | | scoped> |
| | | .pam-loading{ |
| | | position: absolute; |
| | | background-color: rgba(#222222,0.5); |
| | |
| | | justify-content: center; |
| | | align-items: center; |
| | | } |
| | | |
| | | </style> |