import React, { useState } from 'react' import { Paper, Table, TableBody, TableCell, TableHead, TableContainer, TablePagination, TableRow, IconButton, MenuItem, Tooltip, Icon, } from '@material-ui/core' import EditIcon from '@material-ui/icons/Edit' import DeleteIcon from '@material-ui/icons/Delete' import colors from '../../../assets/Color' import useStyles from '../../../styles/Table' import { Breadcrumb, SimpleCard } from 'app/components' const columns = [ { id: 'index', label: 'STT', align: 'center', minWidth: 80, }, { id: 'user_created', label: 'Account', align: 'left', minWidth: 'auto', }, { id: 'functions', label: 'Chức năng', align: 'left', minWidth: 140, }, { id: 'actions', label: 'Action', align: 'left', minWidth: 'auto', }, { id: 'IP', label: 'IP', align: 'left', minWidth: 140, }, { id: 'date_created', label: 'Thời gian', align: 'left', minWidth: 'auto', }, { id: 'result_logging', label: 'Kết quả', align: 'left', minWidth: 100, }, ] function TableList(props) { const classes = useStyles() const { data, handeChangeActive, removeItem, changeActive, setChangeActive, setPageIndex, setPageSize, pageIndex, totalRecords, } = props const handleChangePage = (event, newPage) => { setPageIndex(newPage) } const handleChangeRowsPerPage = (event) => { setPageSize(event.target.value) } return ( <Paper className={classes.root}> <TableContainer className={classes.container}> <Table stickyHeader aria-label="sticky table"> <TableHead> <TableRow> {columns.map((column) => ( <TableCell key={column.id} align={'center'} style={{ width: column.minWidth, backgroundColor: colors.headerTable, }} > {column.label} </TableCell> ))} </TableRow> </TableHead> <TableBody className={classes.columnTable}> {data.map((row) => { return ( <TableRow hover role="checkbox" tabIndex={-1} key={row.id} > {columns.map((column) => { const avatar = row[column.id] return ( <TableCell key={column.id} align={column.align} > {column.format ? ( <img src={column.format( avatar )} className={ classes.image } /> ) : ( avatar )} </TableCell> ) })} </TableRow> ) })} </TableBody> </Table> </TableContainer> <TablePagination component="div" page={pageIndex} count={totalRecords} rowsPerPage={10} rowsPerPageOptions={[]} onChangePage={handleChangePage} onChangeRowsPerPage={handleChangeRowsPerPage} /> </Paper> ) } export default TableList