ฟิลเตอร์การลา
This commit is contained in:
STW_TTTY\stwtt
parent
94a8733746
commit
1b23eed1d1
3 changed files with 72 additions and 14 deletions
|
|
@ -67,13 +67,18 @@ function updateVisible(value: []) {
|
|||
|
||||
/** filter */
|
||||
const year = ref<number>(new Date().getFullYear());
|
||||
const type = ref<string>("00000000-0000-0000-0000-000000000000");
|
||||
const status = ref<string>("ALL");
|
||||
|
||||
const filter = ref<string>("");
|
||||
|
||||
/** function updateFilter*/
|
||||
function filterTable() {
|
||||
emit("update:filter", year.value, type.value, status.value, filter.value);
|
||||
emit(
|
||||
"update:filter",
|
||||
year.value,
|
||||
leaveStore.type,
|
||||
leaveStore.status,
|
||||
filter.value
|
||||
);
|
||||
}
|
||||
|
||||
/** function updatePagination*/
|
||||
|
|
@ -134,7 +139,7 @@ watch([() => currentPage.value, () => pagination.value.rowsPerPage], () => {
|
|||
<q-select
|
||||
outlined
|
||||
dense
|
||||
v-model="type"
|
||||
v-model="leaveStore.type"
|
||||
:label="`${'ประเภทใบลา'}`"
|
||||
emit-value
|
||||
map-options
|
||||
|
|
@ -149,17 +154,31 @@ watch([() => currentPage.value, () => pagination.value.rowsPerPage], () => {
|
|||
@filter="(inputValue:any,
|
||||
doneFn:Function) => filterOption(inputValue, doneFn,'LeaveTypeOption'
|
||||
) "
|
||||
typeOptionsMain
|
||||
>
|
||||
<template v-slot:no-option>
|
||||
<q-item>
|
||||
<q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
|
||||
</q-item>
|
||||
</template></q-select
|
||||
>
|
||||
</template>
|
||||
<template
|
||||
v-if="leaveStore.type !== '00000000-0000-0000-0000-000000000000'"
|
||||
v-slot:append
|
||||
>
|
||||
<q-icon
|
||||
name="cancel"
|
||||
@click.stop.prevent="
|
||||
(leaveStore.typeOptions = leaveStore.typeOptionsMain),
|
||||
(leaveStore.type = '00000000-0000-0000-0000-000000000000'),
|
||||
filterTable()
|
||||
"
|
||||
class="cursor-pointer"
|
||||
/> </template
|
||||
></q-select>
|
||||
<q-select
|
||||
outlined
|
||||
dense
|
||||
v-model="status"
|
||||
v-model="leaveStore.status"
|
||||
:label="`${'สถานะ'}`"
|
||||
emit-value
|
||||
map-options
|
||||
|
|
@ -179,8 +198,18 @@ watch([() => currentPage.value, () => pagination.value.rowsPerPage], () => {
|
|||
<q-item>
|
||||
<q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
|
||||
</q-item>
|
||||
</template></q-select
|
||||
>
|
||||
</template>
|
||||
<template v-if="leaveStore.status !== 'ALL'" v-slot:append>
|
||||
<q-icon
|
||||
name="cancel"
|
||||
@click.stop.prevent="
|
||||
(leaveStore.statusOptions = leaveStore.statusOptionsMain),
|
||||
(leaveStore.status = 'ALL'),
|
||||
filterTable()
|
||||
"
|
||||
class="cursor-pointer"
|
||||
/> </template
|
||||
></q-select>
|
||||
<q-space />
|
||||
|
||||
<!-- แสดงคอลัมน์ใน table -->
|
||||
|
|
@ -209,7 +238,6 @@ watch([() => currentPage.value, () => pagination.value.rowsPerPage], () => {
|
|||
ref="table"
|
||||
flat
|
||||
bordered
|
||||
|
||||
v-bind="attrs"
|
||||
virtual-scroll
|
||||
:virtual-scroll-sticky-size-start="48"
|
||||
|
|
|
|||
|
|
@ -12,7 +12,8 @@ import { useCounterMixin } from "@/stores/mixin"
|
|||
const mixin = useCounterMixin()
|
||||
const { date2Thai, messageError } = mixin
|
||||
const $q = useQuasar()
|
||||
|
||||
const type = ref<string>("00000000-0000-0000-0000-000000000000");
|
||||
const status = ref<string>("ALL");
|
||||
export const useLeaveStore = defineStore("Leave", () => {
|
||||
const tabValue = ref<string>("calendar")
|
||||
const typeLeave = ref<string | undefined>("")
|
||||
|
|
@ -113,11 +114,13 @@ export const useLeaveStore = defineStore("Leave", () => {
|
|||
function filterOption(val: any, update: Function, refData: string) {
|
||||
switch (refData) {
|
||||
case "LeaveTypeOption":
|
||||
type.value = ''
|
||||
update(() => {
|
||||
typeOptions.value = typeOptionsMain.value.filter((v: any) => v.name.indexOf(val) > -1)
|
||||
})
|
||||
break
|
||||
case "LeaveStatusOption":
|
||||
status.value = ''
|
||||
update(() => {
|
||||
statusOptions.value = statusOptionsMain.value.filter((v: any) => v.name.indexOf(val) > -1)
|
||||
})
|
||||
|
|
@ -389,5 +392,9 @@ export const useLeaveStore = defineStore("Leave", () => {
|
|||
convertStatud,
|
||||
resetForm2,
|
||||
fetchProfileOld,
|
||||
type,
|
||||
typeOptionsMain,
|
||||
status,
|
||||
statusOptionsMain
|
||||
}
|
||||
})
|
||||
|
|
|
|||
|
|
@ -79,6 +79,20 @@ function onSubmit(postData: FormData, isLeave: boolean = true) {
|
|||
}
|
||||
}
|
||||
|
||||
const option = ref<any[]>(dataStore.options);
|
||||
/**
|
||||
* function ค้นหาข้อมูลใน option
|
||||
* @param val คำค้นหา
|
||||
* @param update function
|
||||
*/
|
||||
function filterOptionFn(val: string, update: Function) {
|
||||
update(() => {
|
||||
option.value = dataStore.options.filter(
|
||||
(e: any) => e.name.search(val) !== -1
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
if (dataStore.options.length == 0) {
|
||||
await fectOptionType();
|
||||
|
|
@ -103,7 +117,7 @@ onMounted(async () => {
|
|||
<div>สร้างใบลา</div>
|
||||
</div>
|
||||
|
||||
<q-form ref="myform" >
|
||||
<q-form ref="myform">
|
||||
<q-card bordered>
|
||||
<div class="row q-col-gutter-md q-pa-md">
|
||||
<div class="col-xs-12 col-sm-12">
|
||||
|
|
@ -124,7 +138,7 @@ onMounted(async () => {
|
|||
class="col-12 col-sm-6 col-md-4 inputgreen"
|
||||
outlined
|
||||
v-model="model"
|
||||
:options="dataStore.options"
|
||||
:options="option"
|
||||
option-value="code"
|
||||
option-label="name"
|
||||
emit-value
|
||||
|
|
@ -135,7 +149,16 @@ onMounted(async () => {
|
|||
(modelSpecific = ''),
|
||||
dataStore.fetchProfile()
|
||||
"
|
||||
/>
|
||||
use-input
|
||||
@filter="filterOptionFn"
|
||||
>
|
||||
<template v-slot:no-option>
|
||||
<q-item>
|
||||
<q-item-section class="text-grey">
|
||||
ไม่มีข้อมูล
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</template></q-select>
|
||||
</div>
|
||||
|
||||
<div class="row q-mt-sm">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue