<!-- empty空数据提示组件 -->
<template>
	<view class="empty" :style="styleObj">
		<view v-if="emptyImg.length > 0" class="emptyImgView">
			<image class="emptyImg" :src="emptyImg" mode=""></image>
		</view>
		<view class="emptyTitle">
			{{ title }}
		</view>
	</view>
</template>

<script>
	export default {
		name: 'Empty',
		props: {
			// 提示文本
			title: {
				type: String,
				default: '暂无数据'
			},
			// 提示图片路径
			emptyImg: {
				type: String,
				default: '/static/new/mine/empty.png'
			},
			// 自定义样式
			styleObj: {
				type: Object,
				default: function () {
					return {}
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
.empty {
	.emptyImgView {
		display: flex;
		align-items: center;
		justify-content: center;
		
		.emptyImg {
			width: 456rpx;
			height: 262rpx;
		}
	}
	.emptyTitle {
		padding-top: 41rpx;
		text-align: center;
		font-weight: 400;
		font-size: 20rpx;
		color: #888888;
	}
}
</style>
