import { Switch, TableBody, TableCell, TableRow } from "@mui/material";
import { useState } from "react";
import { Grid } from "../../../../components/grid/Grid";

export const ProvinceManageUsersRowKillHouse = ({ row, item }) => {
  const { details } = item;

  const [checked, setChecked] = useState(details.active);

  const handleChange = () => {
    setChecked(!checked);
  };

  return (
    <TableBody>
      {/* {row.userRoles.map((userRolesRow) => ( */}
      <TableRow key={details.name}>
        <TableCell align="center" component="th" scope="row">
          {details.name}
        </TableCell>
        <TableCell align="center">
          {details.systemAddress.province.name}
        </TableCell>
        <TableCell align="center">{details.systemAddress.city.name}</TableCell>
        <TableCell align="center">{details.systemAddress.address}</TableCell>
        <TableCell align="center">
          {details.capacity.toLocaleString()}
        </TableCell>
        <TableCell align="center">{"-"}</TableCell>
        <TableCell align="center">{details.identityDocuments}</TableCell>
        <TableCell align="center">
          {details.killHouseOperator.userBankInfo &&
          details.killHouseOperator.userBankInfo.bankName ? (
            <Grid container direction="column">
              <Grid>
                نام بانک: {details.killHouseOperator.userBankInfo.bankName}
              </Grid>
              <Grid>
                شماره کارت: {details.killHouseOperator.userBankInfo.card}
              </Grid>
              <Grid>
                شماره حساب: {details.killHouseOperator.userBankInfo.account}
              </Grid>
              <Grid>شبا: {details.killHouseOperator.userBankInfo.shaba}</Grid>
            </Grid>
          ) : (
            "-"
          )}
        </TableCell>
        <TableCell align="center">
          <Switch checked={checked} onChange={handleChange} color="primary" />
        </TableCell>
      </TableRow>
      {/* ))} */}
    </TableBody>
  );
};
