<style lang="scss">
	.goods_item {
		width: 342rpx;
		box-shadow: 0px 1rpx 3rpx 0px rgba(156,156,156,0.2);
		border-radius: 8rpx;
		margin-bottom: 20rpx;
		.goods_image {
			width: 342rpx;
			height: 266rpx;
			border-radius: 10rpx 10rpx 0 0;
		}
		.goods_name {
			font-size: 24rpx;
			color: #2C2C2C;
			margin-left: 18rpx;
		}
		.goods_price {
			margin-top: 55rpx;
			padding-left: 18rpx;
			padding-bottom: 30rpx;
			image {
				width: 32rpx;
				height: 32rpx;
			}
			.price1 {
				margin-left: 12rpx;
				color: #E40000;
				font-weight: bold;
				font-size: 33rpx;
				span {
					font-size: 22rpx;
					position: relative;
					top: 2rpx;
				}
			}
			.price2 {
				color: #A7A7A7;
				font-size: 18rpx;
				font-weight: bold;
				margin-left: 12rpx;
				text-decoration: line-through;
				position: relative;
				top: 2rpx;
				span {
					text-decoration: none;
					font-size: 12rpx;
				}
			}
		}
	}
</style>
<template>
	<view class="goods_item bg-w" @tap="jumpTo">
		<image class="goods_image" :src="filterImg(dataItem.mainImage)" mode="widthFix"></image>
		<view class="goods_name text-ellipsis">
			{{ dataItem.titleName }}
		</view>
		<view class="goods_price flex flex-align-center">
			<image src="../../../static/images/home/ic_cn.png"></image>
			<view class="price1 flex flex-align-center flex-align-end">
				{{dataItem.wholesalePrice}} <span>.00</span>
			</view>
			<view class="price2 flex flex-align-end">
				¥1560 <span>.00</span>
			</view>
		</view>
	</view>
</template>

<script>
	import publics from "@/common/utils/public.js"
	export default{
		props: {
			dataItem: {
				type: Object,
				default: () => {}
			}
		},
		methods: {
			jumpTo(item) {
				this.$navigateTo('/pages/home/details?id='+this.dataItem.id)
			},
			filterImg(img){
				return publics.filterImgUrl(img, 3)
			}
		}
	}
</script>