import React from 'react';
import { debug } from 'util';

class TBody extends React.Component {

    render() {
        const { onSelectedRow, columns, rows, tableId, rowsSelected, keyRow, vertical } = this.props;
        const dataColumns = columns;
        const dataRows = rows;
        const _self = this;
        let _tableBody = "";        
        if (vertical) {
            _tableBody =  dataColumns.map(function (column, indexColumn) {
                return (
                    <tr key={indexColumn}>
                    <th className={column.class == undefined ? '' : column.class} key={indexColumn}>{column.title}{column.defaultValue != undefined ? column.defaultValue : ''}</th>
                    {dataRows.map(function (row, index) {
                            return <td className={column.class == undefined ? '' : column.class} key={index + indexColumn} >{row[column.field]}{column.defaultValue != undefined ? column.defaultValue : ''} </td>
                    })}
                </tr>
                );
                
            })
        } else {
            _tableBody = dataRows.map(function (row, index) {                
                let keyValue = row[keyRow];
                let findedRow = rowsSelected != undefined ? rowsSelected.find(item => { return item[keyRow] == keyValue }) : undefined;
                return (
                    <tr key={index} onClick={() => { _self.props.onSelectedRow != undefined ? _self.props.onSelectedRow(row, tableId) : () => { } }} className={findedRow != undefined ? 'selected' : ''}>
                        {dataColumns.map(function (column, indexColumn) {
                            return <td style={column.style == undefined ? {} : column.style} className={column.class == undefined ? '' : column.class} key={index + indexColumn}>{column.isImage == undefined ? row[column.field] : <img src={row[column.field]} style={column.style == undefined ? {} : column.style}/>}    {column.defaultValue != undefined ? column.defaultValue : ''}</td>;
                        })}
                    </tr>);

            });
        }

        return (
                <tbody>
                {_tableBody}
                </tbody>
        )
    }
};
export default TBody;