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

add prettier formatter to all file

Browse Source
This commit is contained in:
Ehsan
2024-09-25 11:03:44 +03:30
parent fa38ee2b21
commit eda896e917
410 changed files with 47636 additions and 43842 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/component/TimePickerField.js
+73 -62
View File
@@ -1,73 +1,84 @@
import { useState } from "react";
import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
import { LocalizationProvider, TimePicker } from "@mui/x-date-pickers"
import { LocalizationProvider, TimePicker } from "@mui/x-date-pickers";
function TimePickerField({ dataChange, disable, setData, timeStart, data }) {
const [value, setValue] = useState("00:00");
const [value, setValue] = useState('00:00');
return (
<div className="w-full relative">
<LocalizationProvider dateAdapter={AdapterDayjs}>
<TimePicker
ampm={false}
disabled={disable}
format="hh:mm"
className="!w-full"
shouldDisableTime={(timeValue, clockType) => {
if (clockType === "hours") {
const { idx, is_morgen } = dataChange;
const value =
data[idx][is_morgen ? "morning_time" : "evening_time"][0];
const hourSelected = value ? +value.split(":")[0] : false;
return (
<div className="w-full relative">
<LocalizationProvider dateAdapter={AdapterDayjs}>
<TimePicker
ampm={false}
disabled={disable}
format="hh:mm"
className="!w-full"
shouldDisableTime={(timeValue, clockType) => {
if (clockType === 'hours') {
const { idx, is_morgen } = dataChange;
const value = data[idx][is_morgen ? 'morning_time' : 'evening_time'][0];
const hourSelected = value ? +value.split(':')[0] : false
const disableMinHour =
timeStart || !value ? false : hourSelected + 1 > timeValue.$H;
return dataChange.is_morgen
? !(16 > timeValue.$H && timeValue.$H > 5 && !disableMinHour)
: !(24 > timeValue.$H && timeValue.$H > 11 && !disableMinHour);
}
}}
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
)}`;
const disableMinHour = timeStart || !value ? false :
(hourSelected + 1 > timeValue.$H)
return dataChange.is_morgen ?
!(16 > timeValue.$H && timeValue.$H > 5 && !disableMinHour) :
!(24 > timeValue.$H && timeValue.$H > 11 && !disableMinHour)
const newData = data;
const { idx, is_morgen } = dataChange;
newData[idx][is_morgen ? "morning_time" : "evening_time"][
timeStart ? 0 : 1
] = newValue;
}
}}
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)}`;
const newData = data;
const { idx, is_morgen } = dataChange;
newData[idx][is_morgen ? 'morning_time' : 'evening_time'][timeStart ? 0 : 1] = newValue;
setValue(newValue);
}}
sx={{
'& .MuiFormLabel-root': {
top: '-4px !important'
},
'& .MuiInputBase-input': { padding: '12.5px 14px' },
'& .MuiOutlinedInput-notchedOutline': { border: '1px solid #D7D7D7 !important' },
'& .MuiInputBase-root': {
borderRadius: '8px !important'
},
'.Mui-focused': {
'& .MuiOutlinedInput-notchedOutline': {
border: '1px solid #5559CE !important',
transition: '0.5s all'
}
},
'& .muirtl-jv54yp-MuiList-root-MuiMultiSectionDigitalClockSection-root::after': {
display: 'none !important'
}
}}
/>
<p className={`absolute flex items-center right-[4px] h-[44px] py-[8px] px-[8px]
setValue(newValue);
}}
sx={{
"& .MuiFormLabel-root": {
top: "-4px !important",
},
"& .MuiInputBase-input": { padding: "12.5px 14px" },
"& .MuiOutlinedInput-notchedOutline": {
border: "1px solid #D7D7D7 !important",
},
"& .MuiInputBase-root": {
borderRadius: "8px !important",
},
".Mui-focused": {
"& .MuiOutlinedInput-notchedOutline": {
border: "1px solid #5559CE !important",
transition: "0.5s all",
},
},
"& .muirtl-jv54yp-MuiList-root-MuiMultiSectionDigitalClockSection-root::after":
{
display: "none !important",
},
}}
/>
<p
className={`absolute flex items-center right-[4px] h-[44px] py-[8px] px-[8px]
w-[calc(100%_-_52px)] text-[#7E7E7E] bg-[#FFFFFF] text-[14px] font-normal top-1/2 -translate-y-1/2
${disable && '!text-[rgba(126,126,126,0.5)]'}`}>{value}</p>
</LocalizationProvider>
</div>
)
${disable && "!text-[rgba(126,126,126,0.5)]"}`}
>
{value}
</p>
</LocalizationProvider>
</div>
);
}
export default TimePickerField
export default TimePickerField;