You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

84 lines
1.9 KiB

import React, { useState } from "react";
import './index.css';
import Calendar from "./CalendarComponents/Calendar";
import { utils } from "./CalendarComponents";
import './index.css';
const SimpleCalendar = () => {
const [selectedDay, setSelectedDay] = useState(null);
return (
<div className="flex items-center justify-center w-full my-2">
<Calendar
value={selectedDay}
onChange={setSelectedDay}
shouldHighlightWeekends
renderFooter={() => <center><button className="GoToTodayButton" onClick={() => setSelectedDay(utils('fa').getToday())}> امروز </button></center>}
locale="fa"
events={eventsList}
/>
</div>
);
};
const eventsList = [
{
id: 2,
description: "تست 2",
type: "global",
isHoliday: true,
date: "2022-01-04T00:00:00.000Z",
year: 1400,
month: 10,
day: 2
},
{
id: 4,
description: "تست 4",
type: "global",
isHoliday: true,
date: "2022-01-12T00:00:00.000Z",
year: 1400,
month: 10,
day: 1
},
{
id: 1,
description: "تست کاربر 1",
type: "userDefined",
userId: "5",
date: "2022-01-12T00:00:00.000Z",
categoryId: 1,
year: 1400,
month: 10,
day: 3,
color: 'blue'
},
{
id: 4,
description: "تست کاربر 4",
type: "userDefined",
userId: "5",
date: "2022-01-08T00:00:00.000Z",
categoryId: 3,
year: 1400,
month: 11,
day: 6
},
{
id: 5,
description: "تست کاربر 5",
type: "userDefined",
userId: "5",
date: "2022-01-12T00:00:00.000Z",
categoryId: 1,
year: 1400,
month: 10,
day: 3
}
];
export default SimpleCalendar;