implemented "today" button for quickly setting promotion dates
This commit is contained in:
@@ -26,7 +26,7 @@ import { error } from 'console';
|
|||||||
import Input from '../ui/input/Input.vue';
|
import Input from '../ui/input/Input.vue';
|
||||||
import Field from '../ui/field/Field.vue';
|
import Field from '../ui/field/Field.vue';
|
||||||
|
|
||||||
const { handleSubmit, errors, values, resetForm } = useForm({
|
const { handleSubmit, errors, values, resetForm, setFieldValue } = useForm({
|
||||||
validationSchema: toTypedSchema(batchPromotionSchema),
|
validationSchema: toTypedSchema(batchPromotionSchema),
|
||||||
validateOnMount: false,
|
validateOnMount: false,
|
||||||
})
|
})
|
||||||
@@ -103,8 +103,21 @@ onMounted(async () => {
|
|||||||
allRanks.value = await getAllRanks();
|
allRanks.value = await getAllRanks();
|
||||||
})
|
})
|
||||||
|
|
||||||
|
function setAllToday() {
|
||||||
|
const today = () => {
|
||||||
|
const d = new Date()
|
||||||
|
const year = d.getFullYear()
|
||||||
|
const month = String(d.getMonth() + 1).padStart(2, '0')
|
||||||
|
const day = String(d.getDate()).padStart(2, '0')
|
||||||
|
|
||||||
|
return `${year}-${month}-${day}`
|
||||||
|
}
|
||||||
|
|
||||||
|
values.promotions?.forEach((_, index) => {
|
||||||
|
// @ts-ignore
|
||||||
|
setFieldValue(`promotions[${index}].start_date`, today())
|
||||||
|
})
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -134,7 +147,10 @@ onMounted(async () => {
|
|||||||
text-sm font-medium text-muted-foreground">
|
text-sm font-medium text-muted-foreground">
|
||||||
<div>Member</div>
|
<div>Member</div>
|
||||||
<div>Rank</div>
|
<div>Rank</div>
|
||||||
<div>Date</div>
|
<div class="flex justify-between">
|
||||||
|
<p>Date</p><button @click.prevent.stop="setAllToday"
|
||||||
|
class="cursor-pointer border-1 rounded-full px-3 hover:bg-secondary hover:border-accent">Today</button>
|
||||||
|
</div>
|
||||||
<div></div>
|
<div></div>
|
||||||
<div></div>
|
<div></div>
|
||||||
</div>
|
</div>
|
||||||
@@ -145,8 +161,8 @@ onMounted(async () => {
|
|||||||
<!-- Member -->
|
<!-- Member -->
|
||||||
<VeeField :name="`promotions[${index}].member_id`" v-slot="{ field, errors }">
|
<VeeField :name="`promotions[${index}].member_id`" v-slot="{ field, errors }">
|
||||||
<div class="flex flex-col min-w-0">
|
<div class="flex flex-col min-w-0">
|
||||||
<Combobox :model-value="field.value" @update:model-value="field.onChange"
|
<Combobox :model-value="field.value"
|
||||||
:ignore-filter="true">
|
@update:model-value="field.onChange" :ignore-filter="true">
|
||||||
<ComboboxAnchor>
|
<ComboboxAnchor>
|
||||||
<ComboboxInput class="w-full pl-3" placeholder="Search members…"
|
<ComboboxInput class="w-full pl-3" placeholder="Search members…"
|
||||||
:display-value="id =>
|
:display-value="id =>
|
||||||
@@ -178,8 +194,8 @@ onMounted(async () => {
|
|||||||
<!-- Rank -->
|
<!-- Rank -->
|
||||||
<VeeField :name="`promotions[${index}].rank_id`" v-slot="{ field, errors }">
|
<VeeField :name="`promotions[${index}].rank_id`" v-slot="{ field, errors }">
|
||||||
<div class="flex flex-col min-w-0">
|
<div class="flex flex-col min-w-0">
|
||||||
<Combobox :model-value="field.value" @update:model-value="field.onChange"
|
<Combobox :model-value="field.value"
|
||||||
:ignore-filter="true">
|
@update:model-value="field.onChange" :ignore-filter="true">
|
||||||
<ComboboxAnchor>
|
<ComboboxAnchor>
|
||||||
<ComboboxInput class="w-full pl-3" placeholder="Select rank…"
|
<ComboboxInput class="w-full pl-3" placeholder="Select rank…"
|
||||||
:display-value="id => rankById.get(id)?.name"
|
:display-value="id => rankById.get(id)?.name"
|
||||||
@@ -190,8 +206,8 @@ onMounted(async () => {
|
|||||||
<ComboboxGroup>
|
<ComboboxGroup>
|
||||||
<div
|
<div
|
||||||
class="max-h-80 overflow-y-auto min-w-[12rem] scrollbar-themed">
|
class="max-h-80 overflow-y-auto min-w-[12rem] scrollbar-themed">
|
||||||
<ComboboxItem v-for="rank in filteredRanks" :key="rank.id"
|
<ComboboxItem v-for="rank in filteredRanks"
|
||||||
:value="rank.id">
|
:key="rank.id" :value="rank.id">
|
||||||
{{ rank.name }}
|
{{ rank.name }}
|
||||||
<ComboboxItemIndicator>
|
<ComboboxItemIndicator>
|
||||||
<Check />
|
<Check />
|
||||||
|
|||||||
Reference in New Issue
Block a user