BzCalendarFull

تقویم کامل

نمونه تمام صفحه

تقویم ارتفاع کادر والدش را پر میکنه، پس والد باید ارتفاع مشخصی داشته باشد.

انتخاب‌شده: 1405/05/20

شیدسچپج
27
28
29
30
31
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
جلسه تیمبازبینی کد
21
ارسال نسخه
22
ددلاین فاکتورتماس با مشتریقرار اضافه 11+ بیشتر
23
24
25
رویداد هفته
26
27
28
29
30
31
1
2
3
4
5
6
razor
@using BzCore.Components.Calendar
@using BzCore.Enums

<div style="height: 640px;">
    <BzCalendarFull SelectedDate="selected" OnDayClick="@(d => selected = d)" Events="events" />
</div>

@code {
    DateTime? selected = DateTime.Today;
    List<BzCalendarEvent> events = new()
    {
        new(DateTime.Today, "جلسه تیم", BzColor.Primary),
        new(DateTime.Today.AddDays(2), "ددلاین", BzColor.Danger),
        new(DateTime.Today.AddDays(5), "انتشار", BzColor.Success),
    };
}
در یک کادر کوچک تر

همان کامپوننت در کادری با ارتفاع و عرض کمتر — چیدمان خودش را جمع میکنه.

شیدسچپج
27
28
29
30
31
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
جلسه تیمبازبینی کد
21
ارسال نسخه
22
ددلاین فاکتورتماس با مشتریقرار اضافه 11+ بیشتر
23
24
25
رویداد هفته
26
27
28
29
30
31
1
2
3
4
5
6
razor
@using BzCore.Components.Calendar
@using BzCore.Enums

@* The calendar fills its parent, so give the parent a height. *@
<div style="height: 420px; max-width: 720px;">
    <BzCalendarFull Events="events" />
</div>

@code {
    List<BzCalendarEvent> events = new()
    {
        new(DateTime.Today, "جلسه تیم", BzColor.Primary),
        new(DateTime.Today.AddDays(2), "ددلاین", BzColor.Danger),
    };
}
رویداد و کلیک روی روز (افزودن رویداد)
شیدسچپج
27
28
29
30
31
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
جلسه تیمبازبینی کد
21
ارسال نسخه
22
ددلاین فاکتورتماس با مشتریقرار اضافه 11+ بیشتر
23
24
25
رویداد هفته
26
27
28
29
30
31
1
2
3
4
5
6

1405/05/20

  • جلسه تیم
  • بازبینی کد
razor
<BzCalendarFull SelectedDate="picked" OnDayClick="OnDay" Events="events" />

@code {
    DateTime picked = DateTime.Today;
    List<BzCalendarEvent> events = new();

    // events of the clicked day
    List<BzCalendarEvent> DayEvents =>
        events.Where(e => e.Date.Date == picked.Date).ToList();

    void OnDay(DateTime d) => picked = d;

    void AddEvent(string title)
        => events.Add(new() { Date = picked, Title = title, Color = BzColor.Primary });
}
تنظیمات: تعطیلات، اعداد فارسی و نوع تقویم
شیدسچپج
27
28
29
30
31
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
جلسه تیمبازبینی کد
21
ارسال نسخه
22
ددلاین فاکتورتماس با مشتریقرار اضافه 11+ بیشتر
23
24
25
رویداد هفته
26
27
28
29
30
31
1
2
3
4
5
6
razor
@* holidays, persian digits and calendar type *@
<BzCalendarFull Events="events"
                ShowHolidays="true"
                PersianDigits="false"
                Calendar="BzCalendarType.Jalali" />

@* gregorian calendar *@
<BzCalendarFull Events="events" Calendar="BzCalendarType.Gregorian" />