luoyang-uniapp-app/pages/tabbar/index/comp/informaItem.vue

<template>
	<view class="flex-b" @click="$goPage('pages/indexEntry/iIndustryInfo/detail/detail?id='+item.id)">
		<view class="imgBox">
			<image :src="item.picture" mode="aspectFill"></image>
		</view>
		<view class="rightText">
			<view class="text towRowText">{{ item.title }}</view>
			<view class="date">{{ $u.timeFormat(item.createTime, 'yyyy/mm/dd') }}</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			item: {
				type: Object,
				default () {
					return {}
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.flex-b {
		justify-content: flex-start !important;
		.imgBox {
			width: 200rpx;
			height: 135rpx;
			background: linear-gradient(180deg, rgba(0, 122, 255, 0.5) 0%, #007AFF 100%);
			border-radius: 20rpx;
			overflow: hidden;
		}
	
		.rightText {
			flex: 1;
			width: 0;
			padding: 30rpx 0 0rpx 30rpx;
			height: 190rpx;
			box-sizing: content;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			border-bottom: 1px solid #F4F4F4;
			.text {
				font-size: 28rpx;
				color: #333;
				min-height: 62rpx;
				margin-top: 6rpx;
			}
	
			.date {
				font-size: 20rpx;
				color: #686B73;
				margin-bottom: 30rpx;
			}
		}
	}
</style>