fix: default month in select month
This commit is contained in:
@ -1,26 +1,27 @@
|
||||
<script setup lang="ts">
|
||||
import Select from '@/components/Select.vue';
|
||||
import Select from '@/components/Select.vue'
|
||||
import {
|
||||
selectedUid,
|
||||
selectedUp3Ulp,
|
||||
fetchRegional,
|
||||
fetchUid, itemsUid,
|
||||
fetchUid,
|
||||
itemsUid,
|
||||
itemsUp3,
|
||||
itemsUlp,
|
||||
itemsRegional,
|
||||
months,
|
||||
years
|
||||
} from './reference';
|
||||
import { onMounted, ref } from 'vue';
|
||||
import { getMonthName } from '@/utils/texts';
|
||||
} from './reference'
|
||||
import { onMounted, ref } from 'vue'
|
||||
import { getMonthName } from '@/utils/texts'
|
||||
|
||||
const uidPlaceholder = 'Semua Unit Induk Distribusi/Wilayah'
|
||||
const up3Placholder = 'Semua Unit Pelaksanaan Pelayanan Pelanggan'
|
||||
const ulpPlaceholder = 'Semua Unit Layanan Pelanggan'
|
||||
const regionalPlaceholder = 'Semua Regional'
|
||||
const bulanPlaceholder = getMonthName(new Date().getMonth())
|
||||
const bulanPlaceholder = getMonthName(new Date().getMonth() + 1)
|
||||
const tahunPlaceholder = new Date().getFullYear().toString()
|
||||
const bulanSelected = new Date().getMonth()
|
||||
const bulanSelected = new Date().getMonth() + 1
|
||||
const tahunSelected = new Date().getFullYear()
|
||||
const uppp = ref({ id: 0, name: up3Placholder })
|
||||
const uid = ref({ id: 0, name: uidPlaceholder })
|
||||
@ -103,35 +104,57 @@ onMounted(() => {
|
||||
<div class="flex flex-col flex-1 space-y-2">
|
||||
<label class="filter-input-label">Regional:</label>
|
||||
|
||||
<Select @update:selected="setRegional($event)" :data="itemsRegional" :placeholder="regionalPlaceholder" />
|
||||
<Select
|
||||
@update:selected="setRegional($event)"
|
||||
:data="itemsRegional"
|
||||
:placeholder="regionalPlaceholder"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col flex-1 space-y-2">
|
||||
<label class="filter-input-label">Unit Induk Distribusi/Wilayah:</label>
|
||||
|
||||
<Select @update:selected="setUid($event)" :data="itemsUid" :selected="uid" :placeholder="uidPlaceholder" />
|
||||
<Select
|
||||
@update:selected="setUid($event)"
|
||||
:data="itemsUid"
|
||||
:selected="uid"
|
||||
:placeholder="uidPlaceholder"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col flex-1 space-y-2">
|
||||
<label class="filter-input-label">Unit Pelaksanaan Pelayanan Pelanggan:</label>
|
||||
|
||||
<Select @update:selected="setUp3($event)" :selected="uppp" :data="itemsUp3" :placeholder="up3Placholder" />
|
||||
<Select
|
||||
@update:selected="setUp3($event)"
|
||||
:selected="uppp"
|
||||
:data="itemsUp3"
|
||||
:placeholder="up3Placholder"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col flex-1 space-y-2">
|
||||
<label class="filter-input-label">Unit Layanan Pelanggan:</label>
|
||||
|
||||
<Select @update:selected="setUlp($event)" :data="itemsUlp" :selected="ulp" :placeholder="ulpPlaceholder" />
|
||||
<Select
|
||||
@update:selected="setUlp($event)"
|
||||
:data="itemsUlp"
|
||||
:selected="ulp"
|
||||
:placeholder="ulpPlaceholder"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col flex-1 space-y-2">
|
||||
<label class="filter-input-label">Periode</label>
|
||||
|
||||
<div class="grid grid-cols-2 gap-x-2">
|
||||
<Select @update:selected="setMonth($event)" :data="months" :placeholder="bulanPlaceholder" />
|
||||
<Select
|
||||
@update:selected="setMonth($event)"
|
||||
:data="months"
|
||||
:placeholder="bulanPlaceholder"
|
||||
/>
|
||||
<Select @update:selected="setYear($event)" :data="years" :placeholder="tahunPlaceholder" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
Reference in New Issue
Block a user