38 lines
932 B
Vue
38 lines
932 B
Vue
<script setup>
|
|
import { computed } from 'vue';
|
|
|
|
import { useWeekdayStore } from 'src/stores/useWeekdayStore';
|
|
|
|
const props = defineProps({
|
|
wdays: {
|
|
type: Array,
|
|
default: () => [],
|
|
},
|
|
});
|
|
|
|
const emit = defineEmits(['update:wdays']);
|
|
|
|
const weekdayStore = useWeekdayStore();
|
|
|
|
const selectedWDays = computed({
|
|
get: () => props.wdays,
|
|
set: (value) => emit('update:wdays', value),
|
|
});
|
|
|
|
const toggleDay = (index) => (selectedWDays.value[index] = !selectedWDays.value[index]);
|
|
</script>
|
|
|
|
<template>
|
|
<div class="q-gutter-x-sm" style="width: max-content">
|
|
<QBtn
|
|
v-for="(weekday, index) in weekdayStore.getLocalesMap"
|
|
:key="index"
|
|
:label="weekday.localeChar"
|
|
rounded
|
|
style="max-width: 36px"
|
|
:color="selectedWDays[weekday.index] ? 'primary' : ''"
|
|
@click="toggleDay(weekday.index)"
|
|
/>
|
|
</div>
|
|
</template>
|