change date type for req & design and fields & add requests & fix bug appointment and dashboard

This commit is contained in:
Ehsan
2025-07-04 23:44:29 +03:30
parent 597fa1931d
commit f951128074
19 changed files with 273 additions and 58 deletions
+1 -1
View File
@@ -14,7 +14,7 @@ function Field({
<TextField
{...props}
size="small"
defaultValue={value}
defaultValue={value || ""}
type={type || "text"}
multiline={!!multiline}
rows={!!multiline ? 4 : 1}
+10 -2
View File
@@ -440,7 +440,14 @@ html {
.icon-keyboard_double_arrow_right,
.icon-keyboard_double_arrow_left {
display: none !important;
color: transparent !important;
}
.icon-keyboard_double_arrow_right::before,
.icon-keyboard_double_arrow_left::before {
background: url(../public/assets/icons/double-right.svg);
width: 24px;
height: 24px;
}
.icon-chevron-right::before,
@@ -451,7 +458,8 @@ html {
height: 24px;
}
.icon-chevron-left::before {
.icon-chevron-left::before,
.icon-keyboard_double_arrow_left::before {
rotate: 180deg;
}
+4 -8
View File
@@ -1,15 +1,17 @@
import CalendarAdD from "@/components/icons/CalendarAdD";
import CardTickD from "@/components/icons/CardTickD";
import { Button } from "@mui/material";
import { getParsedUserInfo } from "@/helper";
import Image from "next/image";
function Head({ user }) {
const userInfo = getParsedUserInfo();
return (
<div className="hidden md:flex flex-col lg:flex-row w-full items-stretch justify-center gap-[12px] lg:gap-[24px]">
<div className="bg-head-dashboard rounded-[8px] relative w-full !bg-no-repeat !bg-cover py-[20px] px-[24px] !bg-center flex items-center">
<div className="flex w-full pl-[calc(5%+140px)] lg:pl-[calc(9%+171px)] flex-col justify-start items-start gap-[8px]">
<p className="text-[#3B3B3B] text-[16px] font-bold">
{user.name}{" "}
{userInfo.realName}{" "}
<span className="text-[#3B3B3B] text-[16px] font-normal">
عزیز!
</span>
@@ -18,12 +20,6 @@ function Head({ user }) {
در این قسمت میتوانید اطلاعات حساب خود و نوبت های گرفته شده را مدیریت
کنید.{" "}
</p>
<Button
variant="contained"
className="!bg-[#5559CE] !rounded-[4px] !py-[4px] !px-[8px] !text-[#EFEFEF] !text-[12px] !font-medium !leading-[22px]"
>
مشاهده اطلاعات
</Button>
</div>
<Image
className="w-[120px] lg:w-[140px] xl:w-[170px] xl:min-w-[170px] h-fit absolute bottom-0 left-[3%] md:left-[5%] lg:left-[9%]"
@@ -1,5 +1,6 @@
import ArrowLeftWhiteD from "@/components/icons/ArrowLeftWhiteD";
import {
convertJalaliTimestamp,
handleTimeExpiresToken,
removeAdditionalKeysDashboard,
} from "@/helper";
@@ -23,7 +24,23 @@ function ButtonSendData({
setLoading(false);
};
const changeDateType = (data) => {
const newData = data;
const splitedDate = newData.birthday.split("/");
newData.birthday = convertJalaliTimestamp(
{
jy: Number(splitedDate[0]),
jm: Number(splitedDate[1]),
jd: Number(splitedDate[2]),
},
true
);
return newData;
};
const postData = () => {
console.log(changeDateType(information));
request
.postUserProfile(information)
.then((response) => {
@@ -67,6 +84,7 @@ function ButtonSendData({
const patchData = () => {
const usedKays = removeAdditionalKeysDashboard(information);
console.log(changeDateType(information));
request
.patchUserProfile(
@@ -1,8 +1,8 @@
import { getParsedUserInfo } from "@/helper";
import Content from "./Content";
import DateBirthday from "./DateBirthday";
import AutoSelector from "./component/AutoSelector";
import Field from "./component/Field";
import AutoSelector from "../component/AutoSelector";
import Field from "../component/Field";
import {
gender,
blood_group,
@@ -20,6 +20,8 @@ function Form({ insurance, errors, changeData, information }) {
list.find((g) => g.id === information[name]);
const parsedUserInfo = getParsedUserInfo();
console.log(information);
return (
<div className="grid grid-cols-1 lg:grid-cols-2 gap-x-[24px] gap-y-[10px]">
<Content title="شماره موبایل" isConfirmed={true}>
@@ -31,9 +31,3 @@ export const job = [
{ label: "آزاد", id: "azad" },
{ label: "دولتی", id: "dolati" },
];
export const insurance = [
{ label: "بیمه 1", id: 10 },
{ label: "بیمه 2", id: 20 },
{ label: "بیمه 3", id: 30 },
];
@@ -1,9 +1,9 @@
import { useEffect, useState } from "react";
import Form from "./Form";
import Form from "./form";
import { request } from "@/services/response";
import ButtonSendData from "./ButtonSendData";
import { getParsedUserInfo } from "@/helper";
import { disease } from "../information/disease";
import { disease } from "./form/disease";
function Information({ information, setInformation }) {
const [loading, setLoading] = useState(false);
@@ -13,16 +13,11 @@ function ItemRelatives({ row, idx, changeData }) {
address: row.contact.address,
};
const [data, setData] = useState(contentData);
const resetData = () => setData(contentData);
const [data, setData] = useState(row);
const resetData = () => setData(row);
useEffect(() => {
setData({
name: row.name,
relation: row.relation,
phone: row.contact.phone,
address: row.contact.address,
});
setData(row);
}, [row]);
return (
@@ -9,6 +9,7 @@ function Relatives({ data, changeData, loading, updateData }) {
const tableHead = ["ردیف", "نام", "نسبت", "شماره تماس", "آدرس", ""];
const centerTable = [0];
const [open, setOpen] = useState(false);
console.log(relatives);
return (
<div className="opacity-page">
@@ -3,7 +3,18 @@ import Field from "@/app/component/Field";
function Content({ setData, data }) {
const handleChange = (name, value) =>
setData((prev) => ({ ...prev, [name]: value }));
name === "phone" || name === "address"
? setData((prev) => ({
...prev,
contact: {
...prev.contact,
[name]: value,
},
}))
: setData((prev) => ({
...prev,
[name]: value,
}));
return (
<div className="mt-[32px] md:mt-[36px] lg:mt-[40px] flex flex-col gap-[24px] md:gap-[28px] lg:gap-[32px] px-0 sm:px-[52px]">
@@ -33,7 +44,7 @@ function Content({ setData, data }) {
type="number"
name="phone"
isPlaceHolder={true}
value={Number(data?.phone.replace(/^\+/, ""))}
value={Number(data?.contact?.phone.replace(/^\+/, ""))}
handleChange={handleChange}
/>
</FieldLabel>
@@ -43,7 +54,7 @@ function Content({ setData, data }) {
type="text"
name="address"
isPlaceHolder={true}
value={data?.address}
value={data?.contact?.address}
handleChange={handleChange}
/>
</FieldLabel>
@@ -10,27 +10,21 @@ function ModalAddRelatives({ open, setOpen, changeData, loading, updateData }) {
const contentItem = {
name: "",
relation: "",
phone: "",
address: "",
contact: {
phone: "",
address: "",
},
};
const handleOpen = () => setOpen(true);
const handleClose = () => setOpen(false);
const [newItem, setNewItem] = useState(contentItem);
const handleAddData = () => {
const changedKey = {
name: newItem.name,
relation: newItem.relation,
contact: {
phone: newItem.phone,
address: newItem.address,
},
};
changeData("add", "relatives", null, changedKey);
changeData("add", "relatives", null, newItem);
setNewItem(contentItem);
handleClose();
};
console.log(newItem);
return (
<>
@@ -64,8 +58,8 @@ function ModalAddRelatives({ open, setOpen, changeData, loading, updateData }) {
disabled={
!newItem.name ||
!newItem.relation ||
!newItem.phone ||
!newItem.address
!newItem.contact.phone ||
!newItem.contact.address
}
variant="contained"
>
+4 -9
View File
@@ -1,26 +1,21 @@
import { getParsedUserInfo } from "@/helper";
import Image from "next/image";
function Head({ user }) {
// const userInfo = Cookies.get("userInfo");
// const parsedInfo = userInfo && JSON.parse(userInfo);
const userInfo = getParsedUserInfo();
return (
<div className="w-full flex flex-row md:flex-col items-center justify-center md:justify-start gap-[12px] md:gap-[4px]">
<Image
className="rounded-full border-[3px] border-solid border-[#F8F8FF] shadow-[0px_1px_25.6px_0px_rgba(85,_89,_205,_0.20)]"
src={user.profile}
src={userInfo?.picture[0]?.url}
alt="profile"
height={73}
width={73}
/>
<div className="flex flex-col items-start md:items-center justify-center gap-[8px] md:gap-[4px]">
<p className="text-[#3B3B3B] text-[14px] font-bold">
{/* {parsedInfo?.realName} */}
user
</p>
<p className="text-[#7E7E7E] text-[14px] font-normal">
{/* {parsedInfo?.username} */}
user
{userInfo?.realName}
</p>
</div>
</div>
+192
View File
@@ -224,3 +224,195 @@ export const removeAdditionalKeysDashboard = (information) => {
return usedKays;
};
// handle TimeStamp
function div(a, b) {
return Math.floor(a / b);
}
function isLeapGregorian(year) {
return (year % 4 === 0 && year % 100 !== 0) || year % 400 === 0;
}
function dayOfYearToGregorian(year, dayOfYear) {
const monthDays = [
31,
isLeapGregorian(year) ? 29 : 28,
31,
30,
31,
30,
31,
31,
30,
31,
30,
31,
];
let month = 1;
while (dayOfYear > monthDays[month - 1]) {
dayOfYear -= monthDays[month - 1];
month++;
}
return { month, day: dayOfYear };
}
function jalaliToGregorian(jy, jm, jd) {
jy = parseInt(jy);
jm = parseInt(jm);
jd = parseInt(jd);
const breaks = [
-61, 9, 38, 199, 426, 686, 756, 818, 1111, 1181, 1210, 1635, 2060, 2097,
2192, 2262, 2324, 2394, 2456, 3178,
];
let gy = jy + 621;
let leapJ = -14;
let jp = breaks[0];
let jump, i;
for (i = 1; i < breaks.length; i++) {
jump = breaks[i] - jp;
if (jy < breaks[i]) break;
leapJ += div(jump, 33) * 8 + div(jump % 33, 4);
jp = breaks[i];
}
let nYear = jy - jp;
leapJ += div(nYear, 33) * 8 + div((nYear % 33) + 3, 4);
if (jump % 33 === 4 && jump - nYear === 4) leapJ += 1;
let leapG = div(gy, 4) - div((div(gy, 100) + 1) * 3, 4) - 150;
let march = 20 + leapJ - leapG;
let gregorianYear = gy;
let gregorianMonth, gregorianDay;
let jalaliDayOfYear = jm <= 7 ? (jm - 1) * 31 + jd : (jm - 7) * 30 + 186 + jd;
if (jalaliDayOfYear <= march) {
gregorianYear -= 1;
const daysInPrevYear = isLeapGregorian(gregorianYear) ? 366 : 365;
const dayOfYear = daysInPrevYear - (march - jalaliDayOfYear);
const gDate = dayOfYearToGregorian(gregorianYear, dayOfYear);
gregorianMonth = gDate.month;
gregorianDay = gDate.day;
} else {
const dayOfYear = jalaliDayOfYear - march;
const gDate = dayOfYearToGregorian(gregorianYear, dayOfYear);
gregorianMonth = gDate.month;
gregorianDay = gDate.day;
}
return { gy: gregorianYear, gm: gregorianMonth, gd: gregorianDay };
}
function gregorianToJalali(gy, gm, gd) {
gy = parseInt(gy);
gm = parseInt(gm);
gd = parseInt(gd);
const breaks = [
-61, 9, 38, 199, 426, 686, 756, 818, 1111, 1181, 1210, 1635, 2060, 2097,
2192, 2262, 2324, 2394, 2456, 3178,
];
let jy = 0;
let leapJ = -14;
let jp = breaks[0];
let jump, i;
for (i = 1; i < breaks.length; i++) {
jump = breaks[i] - jp;
if (gy < breaks[i]) break;
leapJ += div(jump, 33) * 8 + div(jump % 33, 4);
jp = breaks[i];
}
let nYear = gy - jp;
leapJ += div(nYear, 33) * 8 + div((nYear % 33) + 3, 4);
if (jump % 33 === 4 && jump - nYear === 4) leapJ += 1;
let leapG = div(gy, 4) - div((div(gy, 100) + 1) * 3, 4) - 150;
let march = 20 + leapJ - leapG;
let gregorianDayOfYear = dayOfYear(gy, gm, gd);
let jalaliDayOfYear, jyNew;
if (gregorianDayOfYear > march) {
jalaliDayOfYear = gregorianDayOfYear - march;
jyNew = gy - 621;
} else {
let daysInPrevYear = isLeapGregorian(gy - 1) ? 366 : 365;
jalaliDayOfYear = gregorianDayOfYear + daysInPrevYear - march;
jyNew = gy - 622;
}
let jmNew, jdNew;
if (jalaliDayOfYear <= 186) {
jmNew = Math.ceil(jalaliDayOfYear / 31);
jdNew = jalaliDayOfYear % 31;
if (jdNew === 0) jdNew = 31;
} else {
jalaliDayOfYear -= 186;
jmNew = Math.ceil(jalaliDayOfYear / 30) + 6;
jdNew = jalaliDayOfYear % 30;
if (jdNew === 0) jdNew = 30;
}
return { jy: jyNew, jm: jmNew, jd: jdNew };
}
function dayOfYear(year, month, day) {
const monthDays = [
31,
isLeapGregorian(year) ? 29 : 28,
31,
30,
31,
30,
31,
31,
30,
31,
30,
31,
];
let doy = 0;
for (let i = 1; i < month; i++) {
doy += monthDays[i - 1];
}
doy += day;
return doy;
}
export function convertJalaliTimestamp(input, convertToTimestamp) {
if (convertToTimestamp) {
// input = { jy, jm, jd, hour?, minute?, second? }
const { jy, jm, jd, hour = 0, minute = 0, second = 0 } = input;
const { gy, gm, gd } = jalaliToGregorian(jy, jm, jd);
const date = new Date(gy, gm - 1, gd, hour, minute, second);
return Math.floor(date.getTime() / 1000);
} else {
const date = new Date(input * 1000);
const gy = date.getFullYear();
const gm = date.getMonth() + 1;
const gd = date.getDate();
const hour = date.getHours();
const minute = date.getMinutes();
const second = date.getSeconds();
const { jy, jm, jd } = gregorianToJalali(gy, gm, gd);
return { jy, jm, jd, hour, minute, second };
}
}
const timestamp = convertJalaliTimestamp(
{ jy: 1404, jm: 4, jd: 3, hour: 22, minute: 36, second: 10 },
true
);
console.log(timestamp);
const jalaliDate = convertJalaliTimestamp(1750791970, false);
console.log(jalaliDate);
+4 -3
View File
@@ -27,6 +27,7 @@
"dayjs": "^1.11.13",
"html2canvas": "^1.4.1",
"i": "^0.3.7",
"jalaali-js": "^1.2.8",
"jalaali-react-date-picker": "^1.0.18",
"jalali-moment": "^3.3.11",
"js-cookie": "^3.0.5",
@@ -12693,9 +12694,9 @@
}
},
"node_modules/jalaali-js": {
"version": "1.2.7",
"resolved": "https://registry.npmjs.org/jalaali-js/-/jalaali-js-1.2.7.tgz",
"integrity": "sha512-gE+YHWSbygYAoJa+Xg8LWxGILqFOxZSBQQw39ghel01fVFUxV7bjL0x1JFsHcLQ3uPjvn81HQMa+kxwyPWnxGQ==",
"version": "1.2.8",
"resolved": "https://registry.npmjs.org/jalaali-js/-/jalaali-js-1.2.8.tgz",
"integrity": "sha512-Jl/EwY84JwjW2wsWqeU4pNd22VNQ7EkjI36bDuLw31wH98WQW4fPjD0+mG7cdCK+Y8D6s9R3zLiQ3LaKu6bD8A==",
"license": "MIT"
},
"node_modules/jalaali-react-date-picker": {
+1
View File
@@ -28,6 +28,7 @@
"dayjs": "^1.11.13",
"html2canvas": "^1.4.1",
"i": "^0.3.7",
"jalaali-js": "^1.2.8",
"jalaali-react-date-picker": "^1.0.18",
"jalali-moment": "^3.3.11",
"js-cookie": "^3.0.5",
+7
View File
@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="25" viewBox="0 0 24 25" fill="none">
<!-- First arrow -->
<path d="M8.90961 21.17C8.71961 21.17 8.52961 21.1 8.37961 20.95C8.08961 20.66 8.08961 20.18 8.37961 19.89L14.8996 13.37C15.3796 12.89 15.3796 12.11 14.8996 11.63L8.37961 5.10999C8.08961 4.81999 8.08961 4.33999 8.37961 4.04999C8.66961 3.75999 9.14961 3.75999 9.43961 4.04999L15.9596 10.57C16.4696 11.08 16.7596 11.77 16.7596 12.5C16.7596 13.23 16.4796 13.92 15.9596 14.43L9.43961 20.95C9.28961 21.09 9.09961 21.17 8.90961 21.17Z" fill="#292D32"/>
<!-- Second arrow (shifted 5px to the right) -->
<path d="M13.9096 21.17C13.7196 21.17 13.5296 21.1 13.3796 20.95C13.0896 20.66 13.0896 20.18 13.3796 19.89L19.8996 13.37C20.3796 12.89 20.3796 12.11 19.8996 11.63L13.3796 5.10999C13.0896 4.81999 13.0896 4.33999 13.3796 4.04999C13.6696 3.75999 14.1496 3.75999 14.4396 4.04999L20.9596 10.57C21.4696 11.08 21.7596 11.77 21.7596 12.5C21.7596 13.23 21.4796 13.92 20.9596 14.43L14.4396 20.95C14.2896 21.09 14.0996 21.17 13.9096 21.17Z" fill="#292D32"/>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB