feat : bornage min/max du MonthPicker (#date-year-picker)
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -9,14 +9,19 @@
|
||||
type="button"
|
||||
data-test="month"
|
||||
:data-month="index"
|
||||
:disabled="!isMonthInRange(currentYear, index, min, max)"
|
||||
:aria-disabled="!isMonthInRange(currentYear, index, min, max)"
|
||||
class="flex h-[45px] w-full items-center justify-center"
|
||||
:class="isMonthInRange(currentYear, index, min, max) ? 'cursor-pointer' : 'cursor-not-allowed'"
|
||||
@click="emit('select', index)"
|
||||
>
|
||||
<span
|
||||
class="flex h-[30px] w-full items-center justify-center rounded text-sm transition-colors duration-100"
|
||||
:class="index === selectedMonth
|
||||
? 'bg-m-primary text-white'
|
||||
: 'text-black hover:bg-m-primary/10'"
|
||||
: isMonthInRange(currentYear, index, min, max)
|
||||
? 'text-black hover:bg-m-primary/10'
|
||||
: 'text-m-muted/30'"
|
||||
>
|
||||
{{ name }}
|
||||
</span>
|
||||
@@ -25,9 +30,16 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import {isMonthInRange} from '../composables/dateFormat'
|
||||
|
||||
defineOptions({name: 'MalioDateMonthPicker'})
|
||||
|
||||
defineProps<{selectedMonth?: number}>()
|
||||
defineProps<{
|
||||
currentYear: number
|
||||
selectedMonth?: number
|
||||
min?: string
|
||||
max?: string
|
||||
}>()
|
||||
|
||||
const emit = defineEmits<{(e: 'select', month: number): void}>()
|
||||
|
||||
|
||||
Reference in New Issue
Block a user