change list sort doctors page & change function search list specialties & remove pagination from page specialties & fix zoom page & change design all fields & change regex validation phone number for nobat724 and clinic-pro

This commit is contained in:
Ehsan
2025-05-14 15:57:40 +03:30
parent 845db52e31
commit feba3c4a64
10 changed files with 42 additions and 82 deletions
@@ -21,8 +21,6 @@ function ButtonFilter({ selected, setOpen }) {
className='text-[#616161] text-[11px] md:text-[14px] leading-[17px] sm:leading-[19px]
md:leading-[22px] lg:leading-[24px] font-medium ml-1 md:mx-1'
>
{selected.province || 'استان'}
{' | '}
{selected.city || 'شهر'}
</p>
<div className="w-[16px] h-[16px] md:w-[18px] md:h-[18px] lg:w-[20px] lg:h-[20px] grid place-items-center">
+2 -2
View File
@@ -235,7 +235,7 @@ html {
}
.MuiFormControl-root .MuiInputBase-root .MuiInputBase-input {
font-size: 10px !important;
font-size: 16px !important;
}
@keyframes openx {
@@ -384,7 +384,7 @@ html {
}
.MuiFormControl-root .MuiInputBase-root .MuiInputBase-input {
font-size: 13px !important;
font-size: 16px !important;
}
.MuiModal-root .MuiBox-root {
+3 -23
View File
@@ -3,38 +3,18 @@
import { useEffect, useState } from "react";
import SearchBar from "./search";
import SortList from "./sortlist";
import { Button } from "@mui/material";
import ListDoctors from "./listDoctors";
import LocationD from "../icons/LocationD";
import { useSearchParams } from "next/navigation";
import ModalSearchCity from "@/app/component/modalSearchCity";
import { useProvince } from "@/context/ProvinceProvider";
import { Button } from "@mui/material";
// Data
import citiesData from "@/data/city.json";
import statesData from "@/data/state.json";
function DoctorsPage({ params, matchedCity, matchedState }) {
const [loading, setLoading] = useState(true);
const [open, setOpen] = useState(false);
const { isProvinceInclude } = useProvince();
const [selected, setSelected] = useState({
province: matchedState?.name,
city: matchedCity?.name,
province: matchedState?.name || params?.province,
city: matchedCity?.name || params?.city,
});
const searchParams = useSearchParams();
const locationSelected = {
province: searchParams.get("province"),
city: searchParams.get("city"),
};
const provinceId = statesData.find(
(state) => state.name === locationSelected?.province
);
const newCity =
locationSelected.city ||
(provinceId &&
citiesData.find((city) => city.province_id === provinceId.id)?.name);
const [data, setData] = useState({
expertise: "",
+21 -8
View File
@@ -2,17 +2,20 @@ import { MenuItem, Select, SvgIcon } from "@mui/material";
import { useState } from "react";
import ArrowBottomD from "../../icons/ArrowBottomD";
import SortD from "../../icons/SortD";
import StarDI from "@/components/icons/StarDI";
const listSort = [
{ label: "براساس امتیاز 1", id: 10 },
{ label: "براساس امتیاز 2", id: 20 },
{ label: "براساس امتیاز 3", id: 30 },
{ label: 3, id: 30 },
{ label: 4, id: 40 },
{ label: 5, id: 50 },
];
function SelectSort() {
const [sort, setSort] = useState("");
const [sort, setSort] = useState(3);
const handleChange = (event) => setSort(event.target.value);
console.log(sort);
const handleChange = (event) => setSort(event.target.name);
return (
<Select
@@ -26,7 +29,14 @@ function SelectSort() {
<SvgIcon color="primary">
<SortD />
</SvgIcon>
{value || "مرتب سازی"}
<ul className="flex items-center justify-start gap-1">
{Array(sort).fill({}).map((_, idx) => (
<li key={idx}>
<StarDI />
</li>
))}
</ul>
{/* {value || "مرتب سازی"} */}
</div>
);
}}
@@ -51,8 +61,11 @@ function SelectSort() {
name={item.label}
className="!flex !flex-col !items-start !w-full hover:!bg-transparent"
>
<div value={item.id} className="!p-2 !mr-2 !w-[calc(100%_-_16px)]">
{item.label}
<div value={item.id} className="!p-2 !mr-2 !w-[calc(100%_-_16px)] flex items-center justify-start">
{/* {item.label} */}
{Array(item.label).fill({}).map((_, idx) => (
<StarDI key={idx} />
))}
</div>
{/* {listSort.length > idx + 1 && (
<span className="block mr-2 w-[calc(100%_-_16px)] h-px bg-[#EFEFEF]"></span>
+2 -2
View File
@@ -86,8 +86,8 @@ function ModalSearchCity() {
</div>
<p
className={`text-[#616161] text-[11px] md:text-[14px] leading-[17px] sm:leading-[19px]
md:leading-[22px] lg:leading-[24px] font-medium ml-1 md:mx-1
${selected.first && selected.second ? "" : ""}`}
md:leading-[22px] lg:leading-[24px] font-medium ml-1 md:mx-1
${selected.first && selected.second ? "" : ""}`}
>
{selected.first && selected.second
? `${selected.first} | ${selected.second}`
-1
View File
@@ -8,7 +8,6 @@ function LogInPage({ setIsSendMsg, setStep, matchedCity }) {
const [num, setNum] = useState("");
const [error, setError] = useState({ valid: true, text: '' });
const handleChange = (val) => {
const formatted = formatPhoneNumber(val);
const checkedNum = validatePhoneNumber(formatted);
+2 -8
View File
@@ -1,13 +1,7 @@
import SearchD from "@/components/icons/SearchD";
import { Button, ButtonGroup, TextField } from "@mui/material";
function SmSearch({ placeholder, onSearch }) {
const handleSearchChange = (event) => {
if (onSearch) {
onSearch(event.target.value);
}
};
function SmSearch({ placeholder, searchHandler }) {
return (
<ButtonGroup
variant="contained"
@@ -32,7 +26,7 @@ function SmSearch({ placeholder, onSearch }) {
}}
placeholder={placeholder}
dir="rtl"
onChange={handleSearchChange}
onChange={e => searchHandler(e)}
className={`!shadow-none !w-full !px-5 !h-full bg-[#FAFAFA] !text-[14px] md:!text-[16px] !min-w-[50%] !rounded-0 !font-normal !text-[#6C757D]`}
/>
<Button
+9 -17
View File
@@ -1,29 +1,21 @@
"use client";
import { useEffect, useState } from "react";
import { useState } from "react";
import List from "./list";
import SmSearch from "../searchHead/SmSearch";
import HeadPageList from "@/app/component/head";
import specialtiesData from "@/data/specialties.json";
function SpecialtiesPage() {
const [searchQuery, setSearchQuery] = useState("");
const [filteredSpecialties, setFilteredSpecialties] = useState(specialtiesData);
useEffect(() => {
if (searchQuery.trim() === "") {
setFilteredSpecialties(specialtiesData);
} else {
const query = searchQuery.toLowerCase().trim();
const filtered = specialtiesData.filter((specialty) =>
specialty.name.toLowerCase().includes(query)
);
setFilteredSpecialties(filtered);
}
}, [searchQuery]);
const handleSearch = (query) => {
setSearchQuery(query);
const searchHandler = (e) => {
const value = e.target.value
setFilteredSpecialties(
specialtiesData.filter(item =>
item.name.toLowerCase().includes(value)
)
)
};
return (
@@ -32,7 +24,7 @@ function SpecialtiesPage() {
title="تخصص مورد نظر شما چیست؟"
detail="تخصص مورد نظرتان را جستجو کرده و یا از لیست زیر انتخاب نمایید:"
>
<SmSearch placeholder="جستجوی تخصص" onSearch={handleSearch} />
<SmSearch placeholder="جستجوی تخصص" searchHandler={searchHandler} />
</HeadPageList>
<List specialties={filteredSpecialties} />
</div>
+1 -18
View File
@@ -1,16 +1,7 @@
import MenuS from "@/components/icons/MenuS";
import Pagination from "@/app/component/Pagination";
import ItemSpecialties from "./ItemSpecialties";
import { useState } from "react";
function List({ specialties = [] }) {
const [page, setPage] = useState(1);
const itemsPerPage = 24;
const startIndex = (page - 1) * itemsPerPage;
const endIndex = startIndex + itemsPerPage;
const currentList = specialties.filter((_, i) => i >= startIndex && i < endIndex);
return (
<div className="bg-[#FAFAFA]">
<div className="flex items-center justify-center gap-[12px] pt-[24px] mb-[40px]">
@@ -29,19 +20,11 @@ function List({ specialties = [] }) {
gap-x-[16px] md:gap-x-[20px] lg:gap-x-[24px]
gap-y-[16px] sm:gap-y-[24px] md:gap-y-[32px] lg:gap-y-[40px]"
>
{currentList.map((speciality) => (
{specialties.map((speciality) => (
<ItemSpecialties data={speciality} key={speciality.id} />
))}
</ul>
)}
<div className="mt-[48px] flex justify-center">
<Pagination
page={page}
setPage={setPage}
list={specialties}
itemsPerPage={itemsPerPage}
/>
</div>
</div>
);
}
+2 -1
View File
@@ -119,11 +119,12 @@ export function validatePhoneNumber(input) {
return { valid: false, text: 'شماره موبایل نمی‌تواند خالی باشد.' };
}
if (digits.length !== 9) {
return { valid: false, text: 'شماره موبایل باید دقیقا 11 رقم باشد.' };
}
const isValid = /^9\d{8}$/.test(digits);
const isValid = /^[1-9]\d{8}$/.test(digits);
if (!isValid) {
return { valid: false, text: 'شماره موبایل نامعتبر است.' };
}