From 645da72002f18791d361c4ce78880e6d5cdffed1 Mon Sep 17 00:00:00 2001 From: ehsan Date: Tue, 30 Sep 2025 15:58:31 +0330 Subject: [PATCH] add state of page in url, add location and working_days on list in clinics page, fix update list clinic with page and limit value, hide pagination when list of clinic is empty, round image of doctor and appo in doctor item --- app/clinics/page.js | 6 +- app/component/ItemDoctor.js | 2 +- app/component/PaginationContent.js | 2 +- app/doctor/[slug]/page.js | 11 +-- components/clinics/head/FilterButton.js | 12 ++- components/clinics/head/SearchBar.js | 4 +- components/clinics/head/filter/Content.js | 14 ++- components/clinics/head/filter/index.js | 2 + components/clinics/index.js | 5 +- components/clinics/list/ItemClinic.js | 4 +- components/clinics/list/index.js | 5 ++ .../doctor/appointmentList/ItemAppointment.js | 8 +- components/doctor/detailDoctor/List.js | 2 - components/doctor/detailDoctor/Share.js | 6 +- components/doctor/detailDoctor/Title.js | 2 +- components/doctor/index.js | 2 +- components/doctor/poster/Address.js | 4 +- components/doctor/poster/ImageProfile.js | 8 +- components/doctor/poster/Telefon.js | 10 +-- components/doctor/poster/index.js | 4 +- .../listDoctors/timestamp_to_persian_date.js | 90 ------------------- helper/index.js | 31 +++++++ 22 files changed, 98 insertions(+), 136 deletions(-) delete mode 100644 components/doctors/listDoctors/timestamp_to_persian_date.js diff --git a/app/clinics/page.js b/app/clinics/page.js index 14e379c..62a622a 100644 --- a/app/clinics/page.js +++ b/app/clinics/page.js @@ -24,11 +24,7 @@ export default async function Clinics({ searchParams }) { else if (matchedCity && matchedCity.id !== "600") newSearchParams.city = matchedCity.name; - const params = { - ...buildClinicParams(newSearchParams), - page: 1, - limit: 12, - }; + const params = buildClinicParams(newSearchParams); // Req clinics = await fetchReq(`${API_URL}/api/v1/clinics`, { diff --git a/app/component/ItemDoctor.js b/app/component/ItemDoctor.js index 1d534dd..f87cdba 100644 --- a/app/component/ItemDoctor.js +++ b/app/component/ItemDoctor.js @@ -11,7 +11,7 @@ import ArrowLeftD from "@/components/icons/ArrowLeftD"; import ClockD from "@/components/icons/ClockD"; import LikeD from "@/components/icons/LikeD"; import PointD from "@/components/icons/PointD"; -import { convertTimestampToPersianDate, convertTimestampToPersianDateSimple } from "@/components/doctors/listDoctors/timestamp_to_persian_date"; +import { convertTimestampToPersianDateSimple } from "@/helper"; moment.loadPersian({ dialect: "persian-modern" }); diff --git a/app/component/PaginationContent.js b/app/component/PaginationContent.js index 8a96300..dc3222f 100644 --- a/app/component/PaginationContent.js +++ b/app/component/PaginationContent.js @@ -9,7 +9,7 @@ function PaginationContent({ page, pageDetail, changePage, limit = 12 }) { page={page || 1} onChange={changePage} color="primary" - className={count < 2 && "!hidden"} + className={(!count || count < 2) && "!hidden"} sx={{ "& .mui-8q7g72-MuiButtonBase-root-MuiPaginationItem-root": { color: "#616161", diff --git a/app/doctor/[slug]/page.js b/app/doctor/[slug]/page.js index 824b5cb..d8902c9 100644 --- a/app/doctor/[slug]/page.js +++ b/app/doctor/[slug]/page.js @@ -3,21 +3,14 @@ import Layout from "@/components/layout/StLayout"; import axios from "axios"; async function Doctor({ params: { slug } }) { - let doctors = null; let doctor = null; let comments = null; const API_URL = process.env.NEXT_PUBLIC_API_URL; try { - const resDoctors = await axios.get( - `${API_URL}/api/v1/doctors?active=1` - ); - const resDoctor = await axios.get( - `${API_URL}/api/v1/doctor/${slug}` - ); + const resDoctor = await axios.get(`${API_URL}/api/v1/doctor/${slug}`); doctor = resDoctor.data; - doctors = resDoctors.data.data; if (doctor) { const resComments = await axios.get( `${API_URL}/api/v1/clinicpro/comments/${doctor.id}` @@ -31,7 +24,7 @@ async function Doctor({ params: { slug } }) { return ( - + ); } diff --git a/components/clinics/head/FilterButton.js b/components/clinics/head/FilterButton.js index 45d7f24..a0b07c9 100644 --- a/components/clinics/head/FilterButton.js +++ b/components/clinics/head/FilterButton.js @@ -1,13 +1,21 @@ import { useState } from "react"; import { Button } from "@mui/material"; import SearchD from "@/components/icons/SearchD"; +import { useRouter } from "next/navigation"; -function FilterButton({ filterData }) { +function FilterButton({ limit, selected, filterData }) { + const router = useRouter(); const [loading, setLoading] = useState(false); const sendReq = () => { setLoading(true); - filterData().finally(() => setLoading(false)); + const newSelected = { ...selected, page: 1, limit }; + filterData(newSelected).finally(() => { + setLoading(false); + const searchParams = new URLSearchParams(window.location.search); + searchParams.set("page", 1); + router.push(`?${searchParams.toString()}`); + }); }; return ( diff --git a/components/clinics/head/SearchBar.js b/components/clinics/head/SearchBar.js index 7e3caa1..3b61c1e 100644 --- a/components/clinics/head/SearchBar.js +++ b/components/clinics/head/SearchBar.js @@ -12,6 +12,7 @@ import { request } from "@/services/response"; function SearchBar({ state, + limit, selected, specialties, setSelected, @@ -59,6 +60,7 @@ function SearchBar({ > - + ); } diff --git a/components/clinics/head/filter/Content.js b/components/clinics/head/filter/Content.js index 5a14757..2563904 100644 --- a/components/clinics/head/filter/Content.js +++ b/components/clinics/head/filter/Content.js @@ -1,13 +1,14 @@ -import { Button } from "@mui/material"; +import { useState } from "react"; -// Icon +import { Button } from "@mui/material"; import CloseModalD from "@/components/icons/CloseModalD"; import ArrowLeftM from "@/components/icons/ArrowLeftM"; import AutoComplete from "./AutoComplete"; -import { useState } from "react"; +import { useRouter } from "next/navigation"; function Content({ state, + limit, states, selected, updateData, @@ -16,6 +17,7 @@ function Content({ filteredCities, handleSearch, }) { + const router = useRouter(); const [loading, setLoading] = useState(false); const listboxProps = { style: { @@ -27,8 +29,12 @@ function Content({ const handleFilter = () => { handleSearch && handleSearch(""); setLoading(true); - filterData().finally(() => { + const newSelected = { ...selected, page: 1, limit }; + filterData(newSelected).finally(() => { handleClose(); + const searchParams = new URLSearchParams(window.location.search); + searchParams.set("page", 1); + router.push(`?${searchParams.toString()}`); setLoading(false); }); }; diff --git a/components/clinics/head/filter/index.js b/components/clinics/head/filter/index.js index 7a4bdf0..7f71714 100644 --- a/components/clinics/head/filter/index.js +++ b/components/clinics/head/filter/index.js @@ -13,6 +13,7 @@ import { useRouter } from "next/navigation"; function ModalSearchCity({ open, state, + limit, setOpen, children, selected, @@ -67,6 +68,7 @@ function ModalSearchCity({ diff --git a/components/clinics/list/ItemClinic.js b/components/clinics/list/ItemClinic.js index efe62a2..9f0ffb2 100644 --- a/components/clinics/list/ItemClinic.js +++ b/components/clinics/list/ItemClinic.js @@ -48,7 +48,7 @@ function ItemClinic({ setFilteredClinics, data, loading }) {

- {data.location} + {data.address}

@@ -56,7 +56,7 @@ function ItemClinic({ setFilteredClinics, data, loading }) {

- ساعت کاری: {data.hours_of_work} + ساعت کاری: {data.field_working_days}

diff --git a/components/clinics/list/index.js b/components/clinics/list/index.js index 2db3518..9009954 100644 --- a/components/clinics/list/index.js +++ b/components/clinics/list/index.js @@ -4,14 +4,19 @@ import { QueryForClinicsFilter } from "@/helper"; import Pageguide from "@/app/component/Pageguide"; import PaginationContent from "@/app/component/PaginationContent"; import { request } from "@/services/response"; +import { useRouter } from "next/navigation"; function List({ limit, selected, clinics, pages, setFilteredClinics }) { const listPage = ["کلینیک ها", selected?.city?.name || ""]; const [page, setPage] = useState(pages?.currentPage); const [loading, setLoading] = useState(false); + const router = useRouter(); const changePage = (_, num) => { setLoading(true); + const searchParams = new URLSearchParams(window.location.search); + searchParams.set("page", num); + router.push(`?${searchParams.toString()}`); setPage(num); const params = { diff --git a/components/doctor/appointmentList/ItemAppointment.js b/components/doctor/appointmentList/ItemAppointment.js index 0688f5d..961e85d 100644 --- a/components/doctor/appointmentList/ItemAppointment.js +++ b/components/doctor/appointmentList/ItemAppointment.js @@ -19,7 +19,13 @@ function ItemAppointment({ turn, loading }) {
- doctor + doctor
diff --git a/components/doctor/detailDoctor/List.js b/components/doctor/detailDoctor/List.js index 4cb944a..4de120a 100644 --- a/components/doctor/detailDoctor/List.js +++ b/components/doctor/detailDoctor/List.js @@ -1,5 +1,3 @@ -import { useRef } from "react"; - // Icons import CopyBlueD from "@/components/icons/CopyBlueD"; import DownloadBlue from "@/components/icons/DownloadBlue"; diff --git a/components/doctor/detailDoctor/Share.js b/components/doctor/detailDoctor/Share.js index f31cf2c..a5922a5 100644 --- a/components/doctor/detailDoctor/Share.js +++ b/components/doctor/detailDoctor/Share.js @@ -1,12 +1,9 @@ "use client"; - import { useRef, useState } from "react"; import { styleDefault } from "@/mui"; import ShareDI from "@/components/icons/ShareDI"; import { Box, Button, Modal } from "@mui/material"; - -// Icons import CloseModalD from "@/components/icons/CloseModalD"; import List from "./List"; import Poster from "../poster"; @@ -28,7 +25,8 @@ function Share({ data }) {

اشتراک گذاری

-
+ {/*
*/} +
diff --git a/components/doctor/detailDoctor/Title.js b/components/doctor/detailDoctor/Title.js index bdc2840..c7a2945 100644 --- a/components/doctor/detailDoctor/Title.js +++ b/components/doctor/detailDoctor/Title.js @@ -12,7 +12,7 @@ function Title({ doctor }) {
diff --git a/components/doctor/poster/Address.js b/components/doctor/poster/Address.js index b602f8c..d0d53df 100644 --- a/components/doctor/poster/Address.js +++ b/components/doctor/poster/Address.js @@ -7,8 +7,8 @@ function Address({ data }) {

آدرس:

-

- {data?.location} +

+ {data?.address[0]?.address}

); diff --git a/components/doctor/poster/ImageProfile.js b/components/doctor/poster/ImageProfile.js index 7133beb..6291736 100644 --- a/components/doctor/poster/ImageProfile.js +++ b/components/doctor/poster/ImageProfile.js @@ -3,7 +3,13 @@ import Image from "next/image"; function ImageProfile({ data }) { return (
- profile-user + profile-user
); } diff --git a/components/doctor/poster/Telefon.js b/components/doctor/poster/Telefon.js index 4f3c0d3..e975ad4 100644 --- a/components/doctor/poster/Telefon.js +++ b/components/doctor/poster/Telefon.js @@ -2,17 +2,17 @@ import TelefonPoster from "@/components/icons/TelefonPoster"; function Telefon({ data }) { return ( -
+

تلفن:

- {data?.phone} -

-

- {data?.phone} - {data?.phone} + {data?.address[0]?.phone}

+ {/*

+ {data?.address[0]?.phone} - {data?.address[0]?.phone} +

*/}
); } diff --git a/components/doctor/poster/index.js b/components/doctor/poster/index.js index ea0421f..87ed84a 100644 --- a/components/doctor/poster/index.js +++ b/components/doctor/poster/index.js @@ -14,10 +14,10 @@ function Poster({ data }) { logo

nobat724.com

-

+

{data?.name}

-

+

تخصص: {data?.expertise?.map( (item, idx) => diff --git a/components/doctors/listDoctors/timestamp_to_persian_date.js b/components/doctors/listDoctors/timestamp_to_persian_date.js deleted file mode 100644 index ac4dfe3..0000000 --- a/components/doctors/listDoctors/timestamp_to_persian_date.js +++ /dev/null @@ -1,90 +0,0 @@ -export function convertTimestampToPersianDate(timestamp) { - // Convert timestamp to milliseconds (JavaScript uses milliseconds) - const date = new Date(timestamp * 1000); - - // Format with Persian calendar and Tehran timezone - const options = { - timeZone: "Asia/Tehran", - calendar: "persian", - year: "numeric", - month: "2-digit", - day: "2-digit", - weekday: "long", - hour: "2-digit", - minute: "2-digit", - second: "2-digit", - hour12: true, - }; - - const formatter = new Intl.DateTimeFormat("fa-IR", options); - const parts = formatter.formatToParts(date); - - // Extract parts - const weekday = parts.find((part) => part.type === "weekday").value; - const year = parts.find((part) => part.type === "year").value; - const month = parts.find((part) => part.type === "month").value; - const day = parts.find((part) => part.type === "day").value; - const hour = parts.find((part) => part.type === "hour").value; - const minute = parts.find((part) => part.type === "minute").value; - const second = parts.find((part) => part.type === "second").value; - const dayPeriod = parts.find((part) => part.type === "dayPeriod").value; - - // Format the final string - return `${weekday}, ${year}-${month}-${day} ${hour}:${minute}:${second} ${dayPeriod}`; -} - -// Alternative simpler approach using toLocaleString -export function convertTimestampToPersianDateSimple(timestamp) { - const date = new Date(timestamp * 1000); - - const options = { - timeZone: "Asia/Tehran", - calendar: "persian", - year: "numeric", - month: "2-digit", - day: "2-digit", - weekday: "long", - hour: "2-digit", - minute: "2-digit", - second: "2-digit", - hour12: true, - }; - - return date.toLocaleString("fa-IR", options); -} - -// Example usage -const timestamp = 1759132200; - -console.log("Method 1 (formatToParts):"); -console.log(convertTimestampToPersianDate(timestamp)); - -console.log("\nMethod 2 (toLocaleString):"); -console.log(convertTimestampToPersianDateSimple(timestamp)); - -// For more control over the format, you can create a custom formatter -export function convertTimestampCustomFormat(timestamp) { - const date = new Date(timestamp * 1000); - - const options = { - timeZone: "Asia/Tehran", - calendar: "persian", - year: "numeric", - month: "2-digit", - day: "2-digit", - weekday: "long", - hour: "2-digit", - minute: "2-digit", - second: "2-digit", - hour12: true, - }; - - const formatter = new Intl.DateTimeFormat("fa-IR", options); - const formatted = formatter.format(date); - - // Add bullet point if needed - return `* ${formatted}`; -} - -console.log("\nMethod 3 (with bullet point):"); -console.log(convertTimestampCustomFormat(timestamp)); diff --git a/helper/index.js b/helper/index.js index 4aad278..ee46abe 100644 --- a/helper/index.js +++ b/helper/index.js @@ -390,6 +390,12 @@ export const QueryForClinicsFilter = (searchParams) => { } } + // 🔹 page + if (searchParams.page) params.page = searchParams.page; + + // 🔹 limit + if (searchParams.limit) params.limit = searchParams.limit; + return params; }; @@ -493,6 +499,12 @@ export const buildClinicParams = (searchParams) => { } } + // 🔹 page + if (searchParams.page) { + params.page = searchParams.page; + params.limit = 12; + } + return params; }; @@ -525,3 +537,22 @@ export function isUserLoggedIn() { const userInfo = Cookies.get("userInfo"); return !!userInfo; } + +export function convertTimestampToPersianDateSimple(timestamp) { + const date = new Date(timestamp * 1000); + + const options = { + timeZone: "Asia/Tehran", + calendar: "persian", + year: "numeric", + month: "2-digit", + day: "2-digit", + weekday: "long", + hour: "2-digit", + minute: "2-digit", + second: "2-digit", + hour12: true, + }; + + return date.toLocaleString("fa-IR", options); +}