xiamen-sb-uniapp/components/my-card/my-card.vue

<template>
	<view>
		<view class="d-flex py2 border-bottom a-center" @tap='handleLubrication'>
			<view class="iconfont  mr-3 icon main-color-text" :class="icon" :style="colorStyle"></view>
			<view class="f-size-32 text-color-3">{{title}}</view>
			<view class="d-flex a-center ml-auto">
				<view v-if="tipNum" class="f-size-24 text-color-white" style="background-color: red;border-radius: 50%;padding: 0rpx 10rpx;">{{tipNum}}</view>
				<view class="ml-2 text-color-9"> <u-icon name="arrow-right"></u-icon> </view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			};
		},
		computed:{
			colorStyle(){
				return `color:${this.iColor}`
			}
		},
		props:{
			title:{
				type:String,
				default:''
			},
			tipNum:{
				type:Number,
				default:0
			},
			icon:{
				type:String,
				default:'icon-icon_jishiben-'
			},
			iColor:{
				type:String,
				default:''
			}
		},
		methods:{
			handleLubrication(){
				this.$emit('handleLubrication',this.title)
			}
		}
	}
</script>

<style scoped>
.icon{
	font-size: 50rpx;
}
</style>