Files
system/components/datepicker/EventOneMonth.vue
Xuan Loi ae1ea57130 changes
2026-01-09 17:25:23 +07:00

52 lines
1.5 KiB
Vue

<template>
<div class="columns mx-0">
<div class="column is-narrow" v-if="1<0">
<EventSummary></EventSummary>
</div>
<div class="column">
<div class="mb-4">
<span class="fsb-17 mr-4">{{ `T${vmonth}/${vyear}` }}</span>
<a class="mr-2" @click="previous()"><SvgIcon v-bind="{name: 'left1.svg', type: 'dark', size: 18}"></SvgIcon></a>
<a class="mr-3" @click="next()"><SvgIcon v-bind="{name: 'right.svg', type: 'dark', size: 18}"></SvgIcon></a>
<a @click="refresh()"><SvgIcon v-bind="{name: 'refresh.svg', type: 'dark', size: 18}"></SvgIcon></a>
</div>
<EventDetail v-bind="{events: events, vyear: vyear, vmonth: vmonth}"></EventDetail>
</div>
</div>
</template>
<script setup>
import EventSummary from '@/components/datepicker/EventSummary'
import EventDetail from '@/components/datepicker/EventDetail'
</script>
<script>
export default {
props: ['events', 'year', 'month'],
data() {
return {
vyear: this.year? this.$copy(this.year) : undefined,
vmonth: this.month? this.$copy(this.month) : undefined
}
},
methods: {
next() {
let month = this.vmonth + 1
if(month>12) {
month = 1
this.vyear += 1
}
this.vmonth = month
},
previous() {
let month = this.vmonth - 1
if(month===0) {
month = 12
this.vyear -= 1
}
this.vmonth = month
},
refresh() {
this.$emit('refresh')
}
}
}
</script>