viam-projectv-scan/src/components/scanList/checkTable.js

ViaCheck deposit application

/* eslint-disable jsx-a11y/label-has-associated-control */
import React from 'react';
import CheckTableRow from './checkTableRow';

// eslint-disable-next-line react/prefer-stateless-function
class CheckTable extends React.Component {

	onRestartFocus = () => {
		const { onRestartFocus } = this.props;
		onRestartFocus();
	};


	onSelectAll = (isSelectedAll) => {
		const { onSelectAll } = this.props;
		onSelectAll(isSelectedAll);
	};

	render() {
		const {
			checksArray,
			checkSelected,
			onHandleKeyBoardTable,
			onClickCheckTable,
			onChangeValue,
			onSetFocusRow,
			onSelectCheck,
			deleteCheck,
			onSetRef,
			validateAmount,
			validateRouting,
			validateAccount,
			validateCheckNumber,
			// validateCheckDate
		} = this.props;
	
		let i = 0;
		let isSelectedAll = false;
		let validateSelected = true;

		
		checksArray.forEach((check) => {
			if (check.selected === false) validateSelected = false;

			i += 1;

			if (i === checksArray.length) {
				isSelectedAll = validateSelected;
			}
		});

		return (
			// <div >
			<table className="check-window table-navigate mt-2 table-width-complete">
				<thead>
					<tr>
						<th>
							{' '}
							<div className="custom-control custom-switch">
								<input
									type="checkbox"
									className="custom-control-input"
									id="customSwitch1"
									checked={isSelectedAll}
									onChange={() => this.onSelectAll(isSelectedAll)}
								/>
								<label className="custom-control-label text-muted lato-font" htmlFor="customSwitch1">
									Seleccionar Todos
								</label>
							</div>
						</th>						
						<th>Número de Cheque</th>
						<th>Ruta</th>
						<th>Cuenta</th>
						<th>Valor</th>
						<th />
					</tr>
				</thead>
				<tbody>
					{/* {rows} */
					checksArray.map((check, key) => (
						<CheckTableRow
							key={key}
							index={key}
							d={check}
							onHandleKeyBoardTable={onHandleKeyBoardTable}
							onSetFocusRow={onSetFocusRow}
							onSetRef={onSetRef}
							validateRouting={validateRouting}
							validateAccount={validateAccount}
							validateCheckNumber={validateCheckNumber}
							validateAmount={validateAmount}
							deleteCheck={deleteCheck}
							// validateCheckDate={validateCheckDate}
							onClickCheckTable={onClickCheckTable}
							onChangeValue={onChangeValue}
							onSelectCheck={onSelectCheck}
							checkSelected={checkSelected}
						/>
					))}
				</tbody>
			</table>
		
		);
	}
}

export default CheckTable;