import React from 'react';
import { image as imageAli, locales } from '@pisell/utils';
import "./index.less";
var CustomerCard = function CustomerCard(props) {
  var _name$charAt;
  var id = props.id,
    nickname = props.nickname,
    display_name = props.display_name,
    phone = props.phone,
    country_calling_code = props.country_calling_code,
    cover = props.cover,
    isMultiple = props.isMultiple;
  if (!id && !nickname && !display_name && !phone && !isMultiple) {
    return null;
  }
  var phoneStr = phone ? "".concat(country_calling_code, " ").concat(phone) : '-';
  var name = display_name || nickname || '';
  return /*#__PURE__*/React.createElement("div", {
    className: "pisell2-ecocup-customer-card"
  }, /*#__PURE__*/React.createElement("div", {
    className: "pisell2-ecocup-customer-card-avatar"
  }, isMultiple ? /*#__PURE__*/React.createElement("div", {
    className: "pisell2-ecocup-customer-card-avatar-text"
  }) : cover ? /*#__PURE__*/React.createElement("img", {
    src: imageAli.ali(cover, 360),
    alt: "avatar"
  }) : /*#__PURE__*/React.createElement("div", {
    className: "pisell2-ecocup-customer-card-avatar-text"
  }, (name === null || name === void 0 || (_name$charAt = name.charAt(0)) === null || _name$charAt === void 0 ? void 0 : _name$charAt.toUpperCase()) || '')), /*#__PURE__*/React.createElement("div", {
    className: "pisell2-ecocup-customer-card-info"
  }, /*#__PURE__*/React.createElement("div", {
    className: "pisell2-ecocup-customer-card-info-name"
  }, isMultiple ? locales.getText('pisell2.text.ecocup.cup-info-card.title.multiple-customer') : name || ''), /*#__PURE__*/React.createElement("div", {
    className: "pisell2-ecocup-customer-card-info-phone"
  }, isMultiple ? '-' : phoneStr || ''), isMultiple ? /*#__PURE__*/React.createElement("div", null, "-") : null));
};
export default CustomerCard;