assess-app/uni_modules/qiun-data-charts/components/qiun-error/qiun-error.vue

<template>
	<view class="chartsview">
		<view class="" v-if="!errorType">
			<view class="charts-error"></view>
			<view class="charts-font">{{errorMessage==null?'请点击重试':errorMessage}}</view>
		</view>
		<image class="charts-error-image" src="/static/img/index/chat-error.png" mode="aspectFill" v-else></image>
	</view>
</template>

<script>
	export default {
		name: 'qiun-error',
		props: {
			errorType: {
				type: String,
				default: null
			},
			errorMessage: {
				type: String,
				default: null
			},
		},
		data() {
			return {

			};
		},
	}
</script>

<style>
	.chartsview {
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;
		flex: 1;
		justify-content: center;
		align-items: center;
	}

	.charts-font {
		font-size: 14px;
		color: #CCCCCC;
		margin-top: 10px;
	}

	.charts-error {
		width: 150px;
		height: 80px;
		background-image: url('https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/public/task-empty.png');
		background-size: 150px 80px;
		background-position: center;
	}

	.charts-error-image {
		width: 120rpx;
		height: 100rpx;
	}
</style>