import { Button, Icon } from '@whalecloud/fdx';
import React from 'react';
import { formatCurrencyWithSymbol } from '../../../utils/currencyUtil';
import './index.less';

var ProductList = function ProductList(props) {
  var productList = props.productList,
      itemUp = props.itemUp,
      itemDown = props.itemDown,
      delImg = props.delImg;
  return /*#__PURE__*/React.createElement("div", {
    className: "productList"
  }, productList.map(function (item, index) {
    return /*#__PURE__*/React.createElement("div", {
      className: "content",
      key: index
    }, /*#__PURE__*/React.createElement("div", {
      className: "imgCot"
    }, /*#__PURE__*/React.createElement("img", {
      height: "72px",
      width: "72px",
      src: item.productImageUrl,
      alt: ""
    })), /*#__PURE__*/React.createElement("div", {
      className: "itemCot"
    }, /*#__PURE__*/React.createElement("div", {
      className: "itemName"
    }, item.productName), /*#__PURE__*/React.createElement("div", {
      className: "itemPrice"
    }, formatCurrencyWithSymbol(item.salesPrice)), /*#__PURE__*/React.createElement("div", {
      className: "itemButton"
    }, /*#__PURE__*/React.createElement(Button, {
      onClick: function onClick() {
        return itemUp(index);
      },
      disabled: index === 0 || productList.length === 1,
      style: {
        padding: '0 10px',
        height: '28px',
        marginBottom: '4px'
      }
    }, /*#__PURE__*/React.createElement(Icon, {
      type: "arrow-up"
    })), /*#__PURE__*/React.createElement(Button, {
      onClick: function onClick() {
        return itemDown(index);
      },
      disabled: index === productList.length - 1 || productList.length === 1,
      style: {
        padding: '0 10px',
        height: '28px'
      }
    }, /*#__PURE__*/React.createElement(Icon, {
      type: "arrow-down"
    })), /*#__PURE__*/React.createElement(Button, {
      onClick: function onClick() {
        return delImg(index);
      },
      style: {
        padding: '0 10px',
        height: '28px'
      }
    }, /*#__PURE__*/React.createElement(Icon, {
      type: "delete"
    })))));
  }));
};

export default ProductList;