105 lines
2.6 KiB
Vue
105 lines
2.6 KiB
Vue
<script setup lang="ts">
|
|
//import Stores
|
|
import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
|
|
|
|
const leaveStore = useLeavelistDataStore();
|
|
const { searchDataFn, filterOption } = leaveStore;
|
|
</script>
|
|
|
|
<template>
|
|
<q-toolbar style="padding: 0" class="q-gutter-sm q-mb-sm">
|
|
<div class="col-2">
|
|
<q-select
|
|
for="selectYear"
|
|
emit-value
|
|
map-options
|
|
outlined
|
|
dense
|
|
v-model="leaveStore.selectYear"
|
|
:options="leaveStore.optionYear"
|
|
option-value="id"
|
|
option-label="name"
|
|
label="ปีงบประมาณ"
|
|
/>
|
|
</div>
|
|
<div class="col-3">
|
|
<q-select
|
|
for="selectType"
|
|
emit-value
|
|
map-options
|
|
outlined
|
|
dense
|
|
v-model="leaveStore.selectType"
|
|
:options="leaveStore.optionType"
|
|
option-value="id"
|
|
option-label="name"
|
|
label="ประเภทการลา"
|
|
@update:model-value="
|
|
searchDataFn(leaveStore.selectType, leaveStore.selectStatus)
|
|
"
|
|
use-input
|
|
@filter="
|
|
(inputValue:any, doneFn:Function) =>
|
|
filterOption(inputValue, doneFn, 'type')
|
|
"
|
|
>
|
|
<template v-slot:no-option>
|
|
<q-item>
|
|
<q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
|
|
</q-item>
|
|
</template></q-select
|
|
>
|
|
</div>
|
|
<div class="col-2">
|
|
<q-select
|
|
for="selectStatus"
|
|
v-if="leaveStore.tab == '2'"
|
|
emit-value
|
|
map-options
|
|
outlined
|
|
dense
|
|
v-model="leaveStore.selectStatus"
|
|
:options="leaveStore.optionStatus"
|
|
option-value="id"
|
|
option-label="name"
|
|
label="สถานะ"
|
|
@update:model-value="
|
|
searchDataFn(leaveStore.selectType, leaveStore.selectStatus)
|
|
"
|
|
use-input
|
|
@filter="
|
|
(inputValue:any, doneFn:Function) =>
|
|
filterOption(inputValue, doneFn, 'status')
|
|
"
|
|
/>
|
|
</div>
|
|
<q-space />
|
|
<div class="col-2">
|
|
<q-input
|
|
for="filterTable"
|
|
dense
|
|
outlined
|
|
v-model="leaveStore.filterTable"
|
|
label="ค้นหา"
|
|
/>
|
|
</div>
|
|
<div class="col-2">
|
|
<q-select
|
|
for="visibleColumns"
|
|
v-model="leaveStore.visibleColumns"
|
|
multiple
|
|
outlined
|
|
dense
|
|
options-dense
|
|
:display-value="$q.lang.table.columns"
|
|
emit-value
|
|
map-options
|
|
:options="leaveStore.columns"
|
|
option-value="name"
|
|
options-cover
|
|
/>
|
|
</div>
|
|
</q-toolbar>
|
|
</template>
|
|
|
|
<style scoped></style>
|