import {Image} from '@nutui/nutui-react-taro'
import {Share} from '@nutui/icons-react-taro'
import {View, Text} from '@tarojs/components'
import Taro from '@tarojs/taro'
import './GoodsList.scss'


const GoodsList = (props: any) => {

  return (
    <>
      <View className={'py-3'}>
        <View className={'flex flex-col justify-between items-center rounded-lg px-2'}>
          {props.data?.map((item: any, index: number) => {
            return (
              <View key={index} className={'flex flex-col rounded-lg bg-white shadow-sm w-full mb-5'}>
                <Image src={item.image} mode={'aspectFit'} lazyLoad={false}
                       radius="10px 10px 0 0" height="180"
                       onClick={() => Taro.navigateTo({url: '/shop/goodsDetail/index?id=' + item.goodsId})}/>
                <View className={'flex flex-col p-2 rounded-lg'}>
                  <View>
                    <View className={'car-no text-sm'}>{item.name}</View>
                    <View className={'flex justify-between text-xs py-1'}>
                      <Text className={'text-orange-500'}>{item.comments}</Text>
                      <Text className={'text-gray-400'}>已售 {item.sales}</Text>
                    </View>
                    <View className={'flex justify-between items-center py-2'}>
                      <View className={'flex text-red-500 text-xl items-baseline'}>
                        <Text className={'text-xs'}>￥</Text>
                        <Text className={'font-bold text-2xl'}>{item.price}</Text>
                        <Text className={'text-xs px-1'}>会员价</Text>
                        <Text className={'text-xs text-gray-400 line-through'}>￥{item.salePrice}</Text>
                      </View>
                      <View className={'buy-btn'}>
                        <View className={'cart-icon'}>
                          <Share size={20} className={'mx-4 mt-2'}
                                 onClick={() => Taro.navigateTo({url: '/shop/goodsDetail/index?id=' + item.goodsId})}/>
                        </View>
                        <View className={'text-white pl-4 pr-5'}
                             onClick={() => Taro.navigateTo({url: '/shop/goodsDetail/index?id=' + item.goodsId})}>购买
                        </View>
                      </View>
                    </View>
                  </View>
                </View>
              </View>
            )
          })}
        </View>
      </View>
    </>
  )
}
export default GoodsList
