diff --git a/app/component/SwitchTable.js b/app/component/SwitchTable.js index 2e77206..3fa3977 100644 --- a/app/component/SwitchTable.js +++ b/app/component/SwitchTable.js @@ -1,7 +1,7 @@ import { FormControlLabel, FormGroup, Switch } from "@mui/material"; import { styled } from "@mui/material/styles"; -const MaterialUISwitch = styled(Switch)(({ theme }) => ({ +const MaterialUISwitch = styled(Switch)(() => ({ width: 63, height: 38, padding: 7, @@ -48,11 +48,17 @@ const MaterialUISwitch = styled(Switch)(({ theme }) => ({ }, })); -function SwitchTable({ value }) { +function SwitchTable({ value, id, changeStatus }) { return ( } + control={ + changeStatus(e.target.checked, id)} + /> + } /> ); diff --git a/components/panel/userAccount/bank/List.js b/components/panel/userAccount/bank/List.js index 5ba5281..3337f4e 100644 --- a/components/panel/userAccount/bank/List.js +++ b/components/panel/userAccount/bank/List.js @@ -5,7 +5,7 @@ import TrashB from "@/components/icons/TrashB"; import EditB from "@/components/icons/EditB"; import SwitchTable from "@/app/component/SwitchTable"; -function List({ data, loading }) { +function List({ data, loading, changeStatus }) { const tableHead = ["ردیف", "شماره کارت", "شماره شبا", "بانک", "وضعیت", ""]; const centerTable = [0, 4, 5]; @@ -59,7 +59,11 @@ function List({ data, loading }) {

{row.status ? "فعال" : "غیر فعال"}

- + diff --git a/components/panel/userAccount/bank/index.js b/components/panel/userAccount/bank/index.js index a955fd6..40f569b 100644 --- a/components/panel/userAccount/bank/index.js +++ b/components/panel/userAccount/bank/index.js @@ -1,13 +1,29 @@ +import { useState } from "react"; import Cards from "./cards"; import Head from "./head"; import List from "./List"; function Bank({ data, loading }) { + const [list, setList] = useState(data); + + const changeStatus = (value, id) => { + let newList = list; + if (value) { + newList = newList.map((item, idx) => { + return { + ...item, + status: item.id === id ? value : false, + }; + }); + } + setList(newList); + }; + return (
- - + +
); } diff --git a/components/panel/userAccount/index.js b/components/panel/userAccount/index.js index cbf8e20..3eb1357 100644 --- a/components/panel/userAccount/index.js +++ b/components/panel/userAccount/index.js @@ -8,7 +8,7 @@ import Tab from "./Tab"; const listTab = ["حساب کاربری", "حساب بانکی"]; function UserAccountPage({ data }) { - const [value, setValue] = useState(0); + const [value, setValue] = useState(1); const [loading, setLoading] = useState(true); useEffect(() => { diff --git a/data/bank.json b/data/bank.json index 43aacee..6547008 100644 --- a/data/bank.json +++ b/data/bank.json @@ -1,17 +1,20 @@ [ { + "id": 1, "card_number": "6037154532659987", "shaba_number": "IR502229107590758200000000", "bank": "مسکن", "status": true }, { + "id": 2, "card_number": "6037154532659987", "shaba_number": "IR502229107590758200000000", "bank": "مسکن", "status": false }, { + "id": 3, "card_number": "6037154532659987", "shaba_number": "IR502229107590758200000000", "bank": "مسکن",