<template>
    <div class="loading">
        <div class="load">
        <img src="./../assets/st-imges/loading.svg" alt="">
        </div>
    </div>
</template>
<script>
export default {
    data(){
        return{
            // lodShow:false
        }
    },
    // computed:{
    //     getLodShow(){
    //         return this.$store.getters.getLoading;
    //     }
    // },
    // watch:{
    //     getLodShow(val){
    //         console.log('val',val)
    //         this.lodShow = val;
    //     }
    // }
}
</script>
<style scoped>
.loading{
    z-index: 8;
    background-color: #000000;
    opacity: 0.8;
    height: 100%;

}
.load{
    width: 1rem;
    height:1rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%)
}
.loading .load img {
    width: 0.8rem;
    height: 0.8rem;
    animation: lod 2s infinite linear;
}
@keyframes lod {
  100% {
    transform: rotate(360deg);
  }
}
</style>