<template>
    <div class="empty-container" :style="{'margin-top':top+'px'}">
        <img src="@/assets/icon/no_data.png" width="100" />
        <span :style="{'margin-top':textTop+'px'}">{{ textContent }}</span>
    </div>
</template>

<script>
	let that = this
    export default {
        name: 'emptyData',
        props: {
		  top: {
			type: Number,
			default: 20
		  },
		  textTop: {
			type: Number,
			default: 10
		  },
		  textContent: {
			type: String,
			default: function (){
				return this.$t('evaluation.noData')
			}
		  }
		},
        data() {
            return {
            }
        },
        created() {
            // console.log(this.top);
        },
        methods: {

        }
    }
</script>
<style>
    .empty-container {
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

        .empty-container span {
            font-size: 14px;
            color: #848484;
        }
</style>
