/**
 * 钟是志
 * 2022年5月31日
 * 禅道需求定制化
 * 27141 [黔南]门户---单位个人中心，，双选会申请可视化展示，，发布到门户后，在邀请函页面也可视化展示
 * */
import React, { Fragment } from 'react';
import { Tag, Radio } from 'antd';
import styles from './styles.less';


export default function TableSelectZhanWei(props) {
  const {
    isMultiple, isShowQuanXuan,
    selectAll, cancelAll,
    valueName, dataSource,
    columns3, allWidth,
    get, otherProps,
    callback,selects
  } = props;

  const { headerInfoFields,
    rowKey,
    prefixName = '',
    statusKey,
    canSelectKeys = [],
    typeList = [],
  } = otherProps;
  // console.log(otherProps, dataSource.list);
  if (!dataSource || !dataSource.list || !dataSource.list.length) {
    return <div>暂无可选数据</div>;
  }
  const data = dataSource.list;

  const selectItem = (selectData) => {
    callback(selectData);
  }

  // console.log(selects);

  return <div className={styles.zhanWei}>

    {headerInfoFields && headerInfoFields.length &&
    <div className={styles.header}>
      {headerInfoFields.map((g) => {
        return <span key={g.key}>
          {g.label} : {data[0][g.key]}
        </span>;
      })}
    </div>
    }


    <div className={styles.list}>
      {
        data.map((item, index) => {
          const status = item[statusKey];
          const defaultChecked = canSelectKeys.includes(status + '');
          const typeConfig = typeList[status + ''] || {};
          const nowSelect = !!selects[item[rowKey]];
          return <div className={styles.item}
                      key={item[rowKey]}
          >
            <div className={styles.itemHead}>
              <div>
                <Radio disabled={!defaultChecked}
                       checked={!defaultChecked || nowSelect}
                       onChange={(e) => {
                         selectItem(item);
                       }}
                >
                </Radio>
              </div>
              <div className={styles.statusTag}>
                <Tag color={typeConfig.color}>
                  {typeConfig.text}
                </Tag>
              </div>
            </div>
            <div className={styles.name}>
              {prefixName + item.booth_no_name}
            </div>
          </div>;
        })
      }
    </div>

  </div>;
}