<template>
	<view>
		<view class="cu-bar bg-white solid-bottom margin-top-sm">
			<view class="action">
				<text class="cuIcon-titles uni-text-color"></text> {{title}}
			</view>
		</view>
		<view class="cu-card case no-card solid-bottom" v-for="(item, index) in goodsInfos" :key="index">
			<view class="cu-item shadow">
				<view class="image">
					<image :src="item.imgUrl"
					 mode="widthFix"></image>
				</view>
				<view class="cu-item item-margin-custom">					
					<view class="content flex-sub">
						<view class="text-xl">{{item.name}}</view>
						<view class="text-sm text-gray margin-tb-xs">{{item.desc}}</view>
						<view class="flex justify-between align-end">
							<view class="text-red text-xs">{{item.tag}}</view>
							<view class="text-red text-price text-xl">{{item.price}}</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "classify-goods-card",
		props: {
			title: '',
			goodsInfos: {
				type: Array,
				default: []
			}
		},
		data() {
			return {};
		},
		methods: {

		}
	}
</script>

<style scoped>
	.item-margin-custom {
		margin: 10rpx 30rpx;
	}
</style>
