import React from 'react';
import SingleColumnCard from '../SingleColumnCard';
import { AlarmCardFooter, AlarmCardEffective } from '../utils';
import './index.less';

/**
 * @desc 外来人员、专网布控、事件布防卡片
 * @param {array} data 卡片数据 [{info,icon,click,relateds:[{title,icon,click}]}]
 * @param {string} icon 图标
 * @param {string} info 信息
 * @param {function} handleChangeYN 有效无效事件
 * @param {boolean} isActual 是否显示有效、无效按钮和水印
 */
class AlarmOneImgCard extends React.Component {
  render() {
    const { sourceData = {}, isActual = false, handleChangeYN, score, actionName, ...res } = this.props;
    let { isEffective, isHandle } = sourceData; //       alarmType,
    return (
      <SingleColumnCard
        className={"lm-one-img-card"}
        sourceData={sourceData}
        imgUrl={sourceData.faceUrl}
        {...res}
        outChildren={
          isActual && isHandle === 1 && <AlarmCardEffective isEffective={isEffective} />
        }
        children={
          <React.Fragment>
            {isActual ? (
              isHandle === 0 ? (
                <AlarmCardFooter actionName={actionName} sourceData={sourceData} handleChangeYN={handleChangeYN} />
              ) : (
                <div className="card-footer" style={{ height: '0px' }} />
              )
            ) : (
              ''
            )}
          </React.Fragment>
        }
      ></SingleColumnCard>
    );
  }
}

export default AlarmOneImgCard;
