import React, { memo } from 'react';
import { SummaryRow, TD } from '../style';
import { calcOffsets, mapFixedClass } from '../helpers';
import { IColumn, ITable } from '../types';

const Summary = function({ columns, showChecker, showSummary, fixRow, summaryData, onChange }: ITable) {
    const filteredColumns = columns.filter(Boolean) as IColumn[];

    const [leftOffset, rightOffset, leftFixedIndex, rightFixedIndex] = calcOffsets(filteredColumns, !!showChecker);

    const checkFixed = filteredColumns[0] && filteredColumns[0].fixed === 'left' ? 'fix-left-cell' : '';

    return (
        showSummary && (
            <SummaryRow className={fixRow === 'summary' ? 'summary-row-fixed' : ''}>
                {[
                    !!showChecker && (
                        <TD key="checker" align="left" checker={true} className={checkFixed} offset={0}>
                            汇总
                        </TD>
                    ),
                ].concat(
                    filteredColumns.map((col: IColumn, index) => {
                        if (!index && !showChecker) {
                            return (
                                <TD
                                    key={index}
                                    checker={true}
                                    align={col.align}
                                    className={mapFixedClass(
                                        col.fixed,
                                        index === leftFixedIndex || index === rightFixedIndex
                                    )}
                                    offset={leftOffset.length > index ? leftOffset[index] : rightOffset[index]}
                                >
                                    汇总
                                </TD>
                            );
                        }
                        return (
                            <TD
                                align={col.align}
                                key={index}
                                className={mapFixedClass(
                                    col.fixed,
                                    index === leftFixedIndex || index === rightFixedIndex
                                )}
                                offset={leftOffset.length > index ? leftOffset[index] : rightOffset[index]}
                            >
                                {col.render
                                    ? col.render({
                                          value: summaryData[col.key as string],
                                          index,
                                          row: summaryData,
                                          onChange,
                                          key: col.key,
                                      })
                                    : summaryData[col.key as string] || '-'}
                            </TD>
                        );
                    })
                )}
            </SummaryRow>
        )
    );
};
export default memo<any>(Summary);