handle filter list with button

2024-10-23 03:16:12 +03:30
parent 5939ae7933
commit 1820a0a59b
4 changed files with 21 additions and 29 deletions
@@ -22,7 +22,7 @@ function List({ user, loading }) {
    <div className="!mt-[32px]">
      <div className="hidden md:block w-full">
        <CustomTable tableHead={tableHead} centerTable={centerTable}>
-          {user.done.map((row, idx) => (
+          {user.turns.done.map((row, idx) => (
            <TableRow
              key={idx}
              className="!border-0 !border-b !border-[#DBDBDB]"
@@ -111,7 +111,7 @@ function List({ user, loading }) {
        </CustomTable>
      </div>
      <ul className="flex md:hidden flex-col gap-y-[24px]">
-        {user.done.map((row, idx) => (
+        {user.turns.done.map((row, idx) => (
          <Card key={idx} data={row} loading={loading} />
        ))}
      </ul>
@@ -3,7 +3,7 @@ import { Button } from "@mui/material";

 const listTab = ["نوبت های جاری", "نوبت های انجام شده"];

-function Head({ value, setValue, isDone, setIsDone, handleChange }) {
+function Head({ isDone, setIsDone }) {
  return (
    <div className="flex items-center justify-start gap-[32px] mt-[24px] sm:mt-[26px] md:mt-[28px] lg:mt-[30px]">
      <div className="block w-full lg:hidden">
@@ -31,10 +31,10 @@ function Head({ value, setValue, isDone, setIsDone, handleChange }) {
              color: "#5559CE !important",
            },
          }}
-          value={value}
          color="#5559CE"
          listTab={listTab}
-          handleChange={handleChange}
+          value={isDone ? 0 : 1}
+          handleChange={(e, value) => setIsDone(!!!value)}
        />
      </div>
      <Button
@@ -3,26 +3,18 @@ import Head from "./Head";
 import List from "./List";

 function Turns({ user, setIsTurnsDetails, loading }) {
-  const [value, setValue] = useState(0);
  const [isDone, setIsDone] = useState(true);
-  const handleChange = (event, newValue) => setValue(newValue);

  return (
    <div className="opacity-page">
      <p className="text-[#3B3B3B] hidden md:flex text-[16px] font-bold">
        تاریخچه نوبت ها
      </p>
-      <Head
-        value={value}
-        isDone={isDone}
-        setValue={setValue}
-        setIsDone={setIsDone}
-        handleChange={handleChange}
-      />
+      <Head isDone={isDone} setIsDone={setIsDone} />
      <List
-        user={user.turns[isDone ? "done" : "current"]}
        loading={loading}
        setIsTurnsDetails={setIsTurnsDetails}
+        user={user.turns[isDone ? "done" : "current"]}
      />
    </div>
  );
@@ -91,20 +91,6 @@
        }
      ],
      "done": [
-        {
-          "name": "دنیا خلیلی",
-          "image": "/assets/images/doctor-1.png",
-          "id": 12345678,
-          "status": "success",
-          "expertise": "دندان پزشکی",
-          "location": "اهواز، کیانپارس، پهلوان شرقی، مجتمع پزشکی آویسا، واحد 12",
-          "phone": 6133916589,
-          "date_turn": "13 خرداد 1403",
-          "date": "1403-03-27",
-          "time": "15:30",
-          "amount": "2350000",
-          "amount_paid": 20000
-        },
        {
          "name": "علی بدیعی زاده",
          "image": "/assets/images/doctor.png",
@@ -119,6 +105,20 @@
          "amount": "2350000",
          "amount_paid": 20000
        },
+        {
+          "name": "دنیا خلیلی",
+          "image": "/assets/images/doctor-1.png",
+          "id": 12345678,
+          "status": "success",
+          "expertise": "دندان پزشکی",
+          "location": "اهواز، کیانپارس، پهلوان شرقی، مجتمع پزشکی آویسا، واحد 12",
+          "phone": 6133916589,
+          "date_turn": "13 خرداد 1403",
+          "date": "1403-03-27",
+          "time": "15:30",
+          "amount": "2350000",
+          "amount_paid": 20000
+        },
        {
          "name": "دنیا خلیلی",
          "image": "/assets/images/doctor-1.png",