vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

feat: calendar week number slots

pull/4670/head
robo 2023-10-21 13:22:15 -07:00
parent 19f52ab2f8
commit 3cccacc236
2 changed files with 33 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
components/lib/calendar/Calendar.d.ts vendored
View File

@ -801,6 +801,30 @@ export interface CalendarSlots {
*/ */
class: any; class: any;
}): VNode[]; }): VNode[];
/**
* Custom header for the showWeek
*/
showWeekHeader(): VNode[];
/**
* Custom showWeek template
* @param {Object} scope - showWeek slot params
*/
showWeek(scope: {
/**
* Date information corresponding to first day of week
*/
date: {
day: number;
month: number;
year: number;
today: boolean;
selectable: boolean;
};
/**
* Internally calculated week number
*/
weekNumber: number;
}): VNode[];
} }
/** /**

12
components/lib/calendar/Calendar.vue
View File

@ -169,7 +169,11 @@
<thead v-bind="ptm('tableHeader')"> <thead v-bind="ptm('tableHeader')">
<tr v-bind="ptm('tableHeaderRow')"> <tr v-bind="ptm('tableHeaderRow')">
<th v-if="showWeek" scope="col" :class="cx('weekHeader')" v-bind="ptm('weekHeader', { context: { disabled: showWeek } })" :data-p-disabled="showWeek" data-pc-group-section="tableheadercell"> <th v-if="showWeek" scope="col" :class="cx('weekHeader')" v-bind="ptm('weekHeader', { context: { disabled: showWeek } })" :data-p-disabled="showWeek" data-pc-group-section="tableheadercell">
<span v-bind="ptm('weekLabel')" data-pc-group-section="tableheadercelllabel">{{ weekHeaderLabel }}</span> <slot name="showWeekHeader">
<span v-bind="ptm('weekLabel')" data-pc-group-section="tableheadercelllabel">
{{ weekHeaderLabel }}
</span>
</slot>
</th> </th>
<th v-for="weekDay of weekDays" :key="weekDay" scope="col" :abbr="weekDay" v-bind="ptm('tableHeaderCell')" data-pc-group-section="tableheadercell"> <th v-for="weekDay of weekDays" :key="weekDay" scope="col" :abbr="weekDay" v-bind="ptm('tableHeaderCell')" data-pc-group-section="tableheadercell">
<span v-bind="ptm('weekDay')" data-pc-group-section="tableheadercelllabel">{{ weekDay }}</span> <span v-bind="ptm('weekDay')" data-pc-group-section="tableheadercelllabel">{{ weekDay }}</span>
@ -180,8 +184,10 @@
<tr v-for="(week, i) of month.dates" :key="week[0].day + '' + week[0].month" v-bind="ptm('tableBodyRow')"> <tr v-for="(week, i) of month.dates" :key="week[0].day + '' + week[0].month" v-bind="ptm('tableBodyRow')">
<td v-if="showWeek" :class="cx('weekNumber')" v-bind="ptm('weekNumber')" data-pc-group-section="tablebodycell"> <td v-if="showWeek" :class="cx('weekNumber')" v-bind="ptm('weekNumber')" data-pc-group-section="tablebodycell">
<span :class="cx('weekLabelContainer')" v-bind="ptm('weekLabelContainer', { context: { disabled: showWeek } })" :data-p-disabled="showWeek" data-pc-group-section="tablebodycelllabel"> <span :class="cx('weekLabelContainer')" v-bind="ptm('weekLabelContainer', { context: { disabled: showWeek } })" :data-p-disabled="showWeek" data-pc-group-section="tablebodycelllabel">
<span v-if="month.weekNumbers[i] < 10" style="visibility: hidden" v-bind="ptm('weekLabel')">0</span> <slot name="showWeek" :date="week[i]" :weekNumber="month.weekNumbers[i]">
{{ month.weekNumbers[i] }} <span v-if="month.weekNumbers[i] < 10" style="visibility: hidden" v-bind="ptm('weekLabel')">0</span>
{{ month.weekNumbers[i] }}
</slot>
</span> </span>
</td> </td>
<td <td