import React from "react";
import BaseCard from "../BaseCard";
import IconFont from "../../../themeComponents/IconFont"
import './index.less'


/**
 * @desc 单列卡片
 * @param {array} data 卡片数据 [{info,icon}]
 * @param {string} icon 图标
 * @param {string} info 信息
 * @param {node} children 子组件
 * @param {node} outChildren 加在卡片子级的子组件
 */
const SingleColumnCard = props => {
  const { data = [], children,outChildren} = props;
  return (
    <BaseCard {...props}>
      <div className="lm-base-card-info" >
        {data.map((item,i) => (
          <div className="info" key={`info${i}`}>
            <IconFont type={item.icon} />
            <span className="ellipsis" title={item.info}>
              {item.info}
            </span>
          </div>
        ))}
        {children}
      </div>
      {outChildren}
    </BaseCard>
  );
};

export default SingleColumnCard
