<template>
    <view 
        class="b-pageloading"
        :style="{
            'background-color': backgroundColor,
            'z-index': zIndex
        }">
        <view class="pageloading-wrap">
            <view class="pageloading-img">
                <image class="pageloading-image" src="https://ss1.baidu.com/6ONXsjip0QIZ8tyhnq/it/u=2669382790,1249805892&fm=179&app=35&f=GIF?w=100&h=50&s=FF8838624B8367744EFDF0CA0000E0B1"></image>
            </view>
            <slot></slot>
        </view>
    </view>
</template>

<script>
/**
* @file 整页loading
* @author wangying51
*/
export default {
    config: {
        component: true
    },
    props: {
        backgroundColor: {
            type: String,
            default: '#ffffff'
        },
        zIndex: {
            type: Number,
            default: 99
        }
    },
    data() {
        return {
        };
    },
    methods: {
    }
};
</script>
<style lang="less" scoped>
.b-pageloading {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 99;
    .pageloading-wrap {
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -75%);
        
        .pageloading-img {
            text-align: center
        }
        .pageloading-image {
            width: .8rem;
            height: .4rem;
            display: inline-block;
            margin: 0 auto;
        }
    }
}
</style>


