hamed/nobat724_front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

change tabs dashboard & handle hour functionality code page add timer

Browse Source
This commit is contained in:
Ehsan
2024-09-16 01:51:55 +03:30
parent c2ea0db6d4
commit 3c7d6af867
10 changed files with 132 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/component/TimePickerField.js
+14 -2
View File
@@ -2,7 +2,7 @@ import { useState } from "react";
import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
import { LocalizationProvider, TimePicker } from "@mui/x-date-pickers"
function TimePickerField() {
function TimePickerField({ dataChange, setData, data }) {
const [value, setValue] = useState('00:00');
@@ -13,14 +13,26 @@ function TimePickerField() {
ampm={false}
format="hh:mm"
className="!w-full"
shouldDisableTime={(timeValue, clockType) => {
if (clockType === 'hours') {
return dataChange.is_morgen ?
!(16 > timeValue.$H && timeValue.$H > 5) :
!(24 > timeValue.$H && timeValue.$H > 11)
}
}}
views={['hours', 'minutes']}
placeholder="انتخاب کنید..."
onChange={e => {
const hours = e.$H;
const minute = e.$m;
const handleTwoLength = value => String(value).length === 1 ? `0${value}` : value
const newValue = `${handleTwoLength(hours)}:${handleTwoLength(minute)}`;
setValue(`${handleTwoLength(hours)}:${handleTwoLength(minute)}`)
const newData = data;
const { idx, is_morning } = dataChange;
newData[idx][is_morning ? 'morning_time' : 'evening_time'] = newValue
setValue(newValue);
}}
sx={{
'& .MuiFormLabel-root': {
app/component/date/dateTime/index.js
+1 -1
View File
@@ -50,7 +50,7 @@ function DateTime({ doctor, setStep, setIsError, locateVisit }) {
/>
<div className="w-full flex justify-end">
<Button
className="!gap-[4px] !px-[12px] !py-[8px] md:!py-[9px] !w-full md:!w-fit !min-w-[157px]"
className="!gap-[4px] !shadow-none !px-[12px] !py-[8px] md:!py-[9px] !w-full md:!w-fit !min-w-[157px]"
onClick={() => {
if (locateVisit) {
localStorage.setItem('doctor-id', doctor?.id);
components/booking/date/Time/index.js
+5 -2
View File
@@ -1,10 +1,13 @@
import SelectDatePicker from "./SelectDatePicker"
function Time() {
function Time({ isStep }) {
return (
<div className="flex mt-[24px] flex-col items-start gap-[19px] justify-start">
<div className="flex relative mt-[24px] flex-col items-start gap-[19px] justify-start">
<p className="text-[#3B3B3B] text-[14px] md:text-[16px] font-bold">2. انتخاب روز</p>
<SelectDatePicker />
{!isStep && (
<div className="absolute left-0 top-0 w-full h-full bg-[rgba(255,255,255,0.84)]"></div>
)}
</div>
)
}
components/booking/date/hour/index.js
+5 -2
View File
@@ -1,8 +1,8 @@
import DateTime from "@/app/component/date/dateTime"
function Hour({ doctor, setStep, setIsError, locateVisit }) {
function Hour({ doctor, setStep, setIsError, locateVisit, isStep }) {
return (
<div className="flex mt-[24px] flex-col items-start gap-[12px] justify-start">
<div className="flex relative mt-[24px] flex-col items-start gap-[12px] justify-start">
<p className="text-[#3B3B3B] text-[14px] md:text-[16px] font-bold">3. انتخاب ساعت</p>
<DateTime
doctor={doctor}
@@ -10,6 +10,9 @@ function Hour({ doctor, setStep, setIsError, locateVisit }) {
setIsError={setIsError}
locateVisit={locateVisit}
/>
{!isStep && (
<div className="absolute left-0 top-0 w-full h-full bg-[rgba(255,255,255,0.84)]"></div>
)}
</div>
)
}
components/booking/date/index.js
+7 -2
View File
@@ -10,14 +10,19 @@ function Date({ doctor, setStep }) {
return (
<div className="w-full lg:w-[61%]">
<div className="p-0 lg:p-[24px] rounded-[8px] border border-solid border-transparent lg:border-[#EFEFEF] bg-transparent lg:bg-[#FFF]">
<div className="p-0 lg:p-[24px] rounded-[8px] border border-solid border-transparent lg:border-[#EFEFEF]
bg-transparent lg:bg-[#FFF]">
<PlaceVisit
setLocateVisit={setLocateVisit}
locateVisit={locateVisit}
isError={isError}
/>
<Time />
<Time
isStep={doctor.multiwork ? locateVisit : true}
locateVisit={locateVisit}
/>
<Hour
isStep={doctor.multiwork ? locateVisit : true}
setLocateVisit={setLocateVisit}
locateVisit={locateVisit}
setIsError={setIsError}
components/panel/addDoctor/listMenu/workingDays/List.js
+26 -7
View File
@@ -17,6 +17,10 @@ function List() {
const [open, setOpen] = useState(false);
const handleOpen = () => setOpen(true);
const handleClose = () => setOpen(false);
const [dataChange, setDataChange] = useState({
is_morgen: false,
idx: undefined
});
return (
<div className="w-full flex justify-center">
@@ -42,7 +46,7 @@ function List() {
</TableRow>
</TableHead>
<TableBody>
{data.map((row) => (
{data.map((row, idx) => (
<TableRow
key={row.name}
sx={{ '&:last-child td, &:last-child th': { border: 0 } }}
@@ -50,14 +54,26 @@ function List() {
<TableCell className="!border-[1px] !border-[#DBDBDB]" component="th" scope="row">
{row.name}
</TableCell>
<TableCell className="!border-[1px] !border-[#DBDBDB]" align="right">
{row.morning_time ? '' : (
<ModalAddTime handleOpen={handleOpen} />
<TableCell className="!border-[1px] !text-[#616161] !text-center !text-[16px] !font-medium !border-[#DBDBDB]" align="right">
{row.morning_time || (
<ModalAddTime
setDataChange={setDataChange}
handleOpen={handleOpen}
setData={setData}
isMorgen={true}
idx={idx}
/>
)}
</TableCell>
<TableCell className="!border-[1px] !border-[#DBDBDB]" align="right">
{row.evening_time ? '' : (
<ModalAddTime handleOpen={handleOpen} />
<TableCell className="!border-[1px] !text-[#616161] !text-center !text-[16px] !font-medium !border-[#DBDBDB]" align="right">
{row.evening_time || (
<ModalAddTime
setDataChange={setDataChange}
handleOpen={handleOpen}
setData={setData}
isMorgen={false}
idx={idx}
/>
)}
</TableCell>
</TableRow>
@@ -67,7 +83,10 @@ function List() {
</TableContainer>
<ContentModal
open={open}
data={data}
setOpen={setOpen}
setData={setData}
dataChange={dataChange}
handleClose={handleClose}
/>
</div>
components/panel/addDoctor/listMenu/workingDays/modal/ContentModal.js
+7 -2
View File
@@ -4,7 +4,7 @@ import { Box, Button, Modal } from "@mui/material"
import Radios from "./Radios"
import Form from "./Form"
function ContentModal({ open, setOpen, handleClose }) {
function ContentModal({ open, data, setOpen, setData, dataChange, handleClose }) {
return (
<Modal
open={open}
@@ -26,7 +26,12 @@ function ContentModal({ open, setOpen, handleClose }) {
</div>
<div className="mx-0 md:mx-[52px]">
<Radios />
<Form handleClose={handleClose} />
<Form
handleClose={handleClose}
dataChange={dataChange}
setData={setData}
data={data}
/>
</div>
</Box>
</Modal>
components/panel/addDoctor/listMenu/workingDays/modal/Form.js
+11 -3
View File
@@ -2,14 +2,22 @@ import { Button } from "@mui/material";
import ContentText from "@/components/panel/ContentText";
import TimePickerField from "@/app/component/TimePickerField";
function Form({ handleClose }) {
function Form({ handleClose, setData, dataChange, data }) {
return (
<div className="flex flex-col gap-[32px] md:gap-[36px] lg:gap-[40px] min-w-fit md:min-w-[420px]">
<ContentText text='زمان شروع'>
<TimePickerField />
<TimePickerField
dataChange={dataChange}
setData={setData}
data={data}
/>
</ContentText>
<ContentText text='زمان پایان'>
<TimePickerField />
<TimePickerField
dataChange={dataChange}
setData={setData}
data={data}
/>
</ContentText>
<div className="flex flex-wrap items-center justify-center gap-[16px]">
<Button
components/panel/addDoctor/listMenu/workingDays/modal/ModalAddTime.js
+8 -2
View File
@@ -2,12 +2,18 @@ import AddTimeP from '@/components/icons/AddTimeP'
import { Button } from '@mui/material'
import React from 'react'
function ModalAddTime({ handleOpen }) {
function ModalAddTime({ handleOpen, isMorgen, idx, setDataChange }) {
return (
<div>
<Button
variant='text'
onClick={handleOpen}
onClick={() => {
handleOpen();
setDataChange({
is_morgen: isMorgen,
idx
})
}}
className='!gap-[2px] sm:!gap-[4px] md:!gap-[6px] lg:!gap-[8px] !p-1 !text-[#5559CE] !text-[14px] md:!text-[16px] !font-medium'
>
<AddTimeP />
data/doctors.json
+48
View File
@@ -2,6 +2,7 @@
{
"id": 1,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -604,6 +605,7 @@
{
"id": 2,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -1206,6 +1208,7 @@
{
"id": 3,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -1808,6 +1811,7 @@
{
"id": 4,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -2410,6 +2414,7 @@
{
"id": 5,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -3012,6 +3017,7 @@
{
"id": 6,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -3614,6 +3620,7 @@
{
"id": 7,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -4216,6 +4223,7 @@
{
"id": 8,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -4818,6 +4826,7 @@
{
"id": 9,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -5420,6 +5429,7 @@
{
"id": 10,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -6022,6 +6032,7 @@
{
"id": 11,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -6624,6 +6635,7 @@
{
"id": 12,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -7226,6 +7238,7 @@
{
"id": 13,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -7828,6 +7841,7 @@
{
"id": 14,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -8430,6 +8444,7 @@
{
"id": 15,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -9032,6 +9047,7 @@
{
"id": 16,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -9634,6 +9650,7 @@
{
"id": 17,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -10236,6 +10253,7 @@
{
"id": 18,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -10838,6 +10856,7 @@
{
"id": 19,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -11440,6 +11459,7 @@
{
"id": 20,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -12042,6 +12062,7 @@
{
"id": 21,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -12644,6 +12665,7 @@
{
"id": 22,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -13246,6 +13268,7 @@
{
"id": 23,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -13848,6 +13871,7 @@
{
"id": 24,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -14450,6 +14474,7 @@
{
"id": 25,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -15052,6 +15077,7 @@
{
"id": 26,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -15654,6 +15680,7 @@
{
"id": 27,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -16256,6 +16283,7 @@
{
"id": 28,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -16858,6 +16886,7 @@
{
"id": 29,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -17460,6 +17489,7 @@
{
"id": 30,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -18062,6 +18092,7 @@
{
"id": 31,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -18664,6 +18695,7 @@
{
"id": 32,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -19266,6 +19298,7 @@
{
"id": 33,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -19868,6 +19901,7 @@
{
"id": 34,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -20470,6 +20504,7 @@
{
"id": 35,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -21072,6 +21107,7 @@
{
"id": 36,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -21674,6 +21710,7 @@
{
"id": 37,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -22276,6 +22313,7 @@
{
"id": 38,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -22878,6 +22916,7 @@
{
"id": 39,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -23480,6 +23519,7 @@
{
"id": 40,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -24082,6 +24122,7 @@
{
"id": 41,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -24684,6 +24725,7 @@
{
"id": 42,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -25286,6 +25328,7 @@
{
"id": 43,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -25888,6 +25931,7 @@
{
"id": 44,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -26490,6 +26534,7 @@
{
"id": 45,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -27092,6 +27137,7 @@
{
"id": 46,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -27694,6 +27740,7 @@
{
"id": 47,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",
@@ -28296,6 +28343,7 @@
{
"id": 48,
"name": "دکتر مهران امینی",
"multiwork": true,
"hours_morning": [
{
"hour": "09.00",