hrms-bangkok/hrms-mgt
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

แก้ไข paging สรรหา > รายชื่อคัดเลือก

Browse source
This commit is contained in:
Warunee Tamkoo 2023-10-27 11:01:13 +07:00
parent 0939d490df
commit 5d361bcbfc
2 changed files with 25 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

21
src/modules/03_recruiting/components/TableCandidate.vue
View file

@ -67,8 +67,10 @@
<q-space />
<div class="items-center gt-xs" style="display: flex">
<!-- ค้นหาข้อความใน table -->
<q-input standout dense :model-value="inputfilter" ref="filterRef" @update:model-value="updateInput" outlined
debounce="300" placeholder="ค้นหา" style="max-width: 200px" class="q-ml-sm">
<!-- @keydown.enter.prevent:model-value="updateInput" -->
<q-input :model-value="inputfilter" @keydown.enter.prevent="submitInput" @update:model-value="updateInput"
ref="filterRef" standout dense outlined debounce="300" placeholder="ค้นหา" style="max-width: 200px"
class="q-ml-sm">
<template v-slot:append>
<q-icon v-if="inputfilter == ''" name="search" />
<q-icon v-if="inputfilter !== ''" name="clear" class="cursor-pointer" @click="resetFilter" />
@ -84,10 +86,11 @@
<q-table ref="table" flat bordered class="custom-header-table" v-bind="attrs" virtual-scroll
:virtual-scroll-sticky-size-start="48" dense :pagination="initialPagination"
:rows-per-page-options="paging == true ? [25, 50, 100, 500] : []" row-key="id" selection="multiple"
v-model:selected="selected" @update:pagination="updatePagination">
v-model:selected="selected" @update:pagination="updatePagination" :filter="false">
<template v-slot:pagination="scope">
ทั้งหมด {{ props.total }} รายการ
<q-pagination v-model="currentPage" active-color="primary" color="dark" :max-pages="5" size="sm" boundary-links direction-links :max="props.maxPage < 1 ? 1 : props.maxPage"></q-pagination>
<q-pagination v-model="currentPage" active-color="primary" color="dark" :max-pages="5" size="sm" boundary-links
direction-links :max="props.maxPage < 1 ? 1 : props.maxPage"></q-pagination>
</template>
<template v-slot:header="props">
<q-tr :props="props">
@ -238,6 +241,7 @@ const props = defineProps({
// Pagination - page & change page & get new data
const currentPage = ref<number>(1)
watch(currentPage, () => {
console.log(currentPage.value)
props.changePage(currentPage.value, props.pageSize, true);
});
@ -265,13 +269,16 @@ const emit = defineEmits([
const updateInput = async (value: any) => {
await emit("update:inputfilter", value);
};
// search & get new data by keyword
if (value.length > 3) {
// search & get new data by keyword
const submitInput = () => {
setTimeout(() => {
props.changePage(1, props.pageSize);
currentPage.value = 1
}
}, 500);
};
const updateVisible = (value: any) => {
emit("update:inputvisible", value);
};

22
src/modules/03_recruiting/views/02_qualify/manageDetail.vue
View file

@ -48,9 +48,9 @@
<q-card flat bordered class="col-12 q-pt-sm">
<TableCandidate style="max-height: 80vh" :rows="rows" :columns="columns" :filter="filter"
:visible-columns="visibleColumns" v-model:inputfilter="filter" v-model:inputvisible="visibleColumns"
v-model:inputvisibleFilter="status" v-model:optionsFilter="optionsStatus"
:nornmalData="true" :paging="true" :titleText="''" :statusPayment="statusPayment" :setSeat="setSeat"
:fetchData="fetchDataCom" :history="true" :page-size="page_size" :total="total" :page="page" :changePage="changePage" :max-page="maxPage">
v-model:inputvisibleFilter="status" v-model:optionsFilter="optionsStatus" :nornmalData="true" :paging="true"
:titleText="''" :statusPayment="statusPayment" :setSeat="setSeat" :fetchData="fetchDataCom" :history="true"
:page-size="page_size" :total="total" :page="page" :changePage="changePage" :max-page="maxPage">
<template #columns="props">
<q-tr :props="props" class="cursor-pointer">
<q-td auto-width>
@ -100,11 +100,11 @@
</div>
</div>
<div v-else-if="col.name == 'status'" :class="props.row.status == 'checkRegister' ||
props.row.status == 'checkPayment' ||
props.row.status == 'checkSeat' ||
props.row.status == 'checkPoint'
? 'text-blue'
: ''
props.row.status == 'checkPayment' ||
props.row.status == 'checkSeat' ||
props.row.status == 'checkPoint'
? 'text-blue'
: ''
">
{{ statusCandidate(props.row.status) }}
</div>
@ -395,7 +395,7 @@ const fetchDataCom = async () => {
// paging
const page = ref<number>(1)
const page_size = ref<number>(5)
const page_size = ref<number>(25)
const total = ref<number>(0)
const maxPage = ref<number>(1)
@ -409,10 +409,10 @@ const fetchData = async (loading: boolean = true) => {
loading === true ?? showLoader()
await http
.get(config.API.candidateOfPeriodExam(status.value, examId.value) + `?page=${page.value}&pageSize=${page_size.value}&keyword=${filter.value}`)
.then((res) => {
.then(async (res) => {
const data = res.data.result;
total.value = data.total
maxPage.value = Math.ceil(data.total / page_size.value)
maxPage.value = await Math.ceil(data.total / page_size.value)
rows.value = [];
data.data.map((r: any) => {
rows.value.push({