qsy-zdh/components/status-tip.vue

<template>
	<view @click="clickItem">
		<view class="tip-wrap">
			<view class="name">{{ name }}</view>
			<view class="status-wrap">
				<view :class="status ? 'success' : 'error'"></view>
				<view v-if="tip" class="tip">{{ tip }}</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
			}
		},
		props: ['name','status','tip'],
		onLoad() {

		},
		methods: {
			clickItem() {
				this.$emit('clickItem',this.name)
			}
		}
	}
</script>

<style scoped lang="scss">
	.tip-wrap {
		display: flex;
		align-content: center;
		.name {
		}
		.status-wrap {
			display: flex;
			align-items: center;
			.success {
				width: 30rpx;
				height: 30rpx;
				background: #00BD00;
				border-radius: 6rpx;
				margin-right: 7rpx;
			}
			.error {
				width: 30rpx;
				height: 30rpx;
				background: #D6000F;
				border-radius: 6rpx;
				margin-right: 7rpx;
			}
			.tip {
				
			}
		}
	}
</style>