Files
nobat724_front/components/dashboard/userAccount/detailUser/relatives/ItemRelatives.js
T

82 lines
3.0 KiB
JavaScript

import ModalDeleteItem from "@/components/dashboard/userAccount/components/modal/ModalDeleteItem";
import TextLoading from "@/app/component/loading/Text";
import { TableCell, TableRow } from "@mui/material";
import ModalEditItem from "@/components/dashboard/userAccount/components/modal/ModalEditItem";
import Content from "./modal/Content";
import { useEffect, useState } from "react";
function ItemRelatives({ row, idx, changeData }) {
const contentData = {
name: row.name,
relation: row.relation,
phone: row.contact.phone,
address: row.contact.address,
};
const [data, setData] = useState(contentData);
const resetData = () => setData(contentData);
useEffect(() => {
setData({
name: row.name,
relation: row.relation,
phone: row.contact.phone,
address: row.contact.address,
});
}, [row]);
return (
<TableRow
key={idx}
className="!border-0 !border-b !border-[#DBDBDB] dark:!border-transparent"
>
<TableCell
className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap"
align="center"
>
<TextLoading width={15} height={18} loading={false}>
{idx + 1}
</TextLoading>
</TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
<TextLoading width={15} height={18} loading={false}>
{row.name}
</TextLoading>
</TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
<TextLoading width={15} height={18} loading={false}>
{row.relation}
</TextLoading>
</TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
<TextLoading width={15} height={18} loading={false}>
{`${row.contact.phone?.replace("+", "")}+`}
</TextLoading>
</TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
{row.contact.address}
</TableCell>
<TableCell
className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap"
align="right"
>
<div className="flex items-center justify-center gap-[4px]">
<ModalDeleteItem id={idx} name="relatives" changeData={changeData} />
<ModalEditItem
id={idx}
data={data}
name="relatives"
title="داروی مصرفی"
resetData={resetData}
changeData={changeData}
>
<Content data={data} setData={setData} />
</ModalEditItem>
</div>
</TableCell>
</TableRow>
);
}
export default ItemRelatives;