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

แก้แสดง ลำดับ วินัย

Browse source
This commit is contained in:
setthawutttty 2023-12-18 09:46:33 +07:00
parent ae8967259c
commit c0e9fb6a0f
8 changed files with 147 additions and 57 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/modules/11_discipline/components/1_Complaint/TableComplaint.vue
View file

@ -206,7 +206,11 @@ onMounted(() => {
@click="OpenEdit(props.row.id)"
>
<div v-if="col.name == 'no'">
{{ props.rowIndex + 1 }}
{{
(currentPage - 1) * Number(pagination.rowsPerPage) +
props.rowIndex +
1
}}
</div>
<div v-else>
{{ col.value }}

6
src/modules/11_discipline/components/2_InvestigateFacts/MainPage.vue
View file

@ -200,7 +200,11 @@ onMounted(async () => {
@click="editPage(props.row.id)"
>
<div v-if="col.name == 'no'">
{{ props.rowIndex + 1 }}
{{
(currentPage - 1) * Number(pagination.rowsPerPage) +
props.rowIndex +
1
}}
</div>
<div>
{{ col.value }}

40
src/modules/11_discipline/components/3_InvestigateDisciplinary/MainPage.vue
View file

@ -16,28 +16,26 @@ const mixin = useCounterMixin();
const dataInvestigateDis = useInvestigateDisStore();
const { showLoader, hideLoader } = mixin;
const { fetchList } = dataInvestigateDis;
const rowsPerPage = ref<number>(10);
const $q = useQuasar(); // show dialog
const router = useRouter();
const filter = ref<string>(""); //search data table
const page = ref<number>(1);
const maxPage = ref<number>(1);
const initialPagination = ref<Pagination>({
rowsPerPage: 10,
});
async function fetchListDisciplinary() {
showLoader();
await http
.get(
config.API.disciplineDisciplinary() +
`?page=${page.value}&pageSize=${initialPagination.value.rowsPerPage}`
`?page=${page.value}&pageSize=${rowsPerPage.value}`
)
.then((res) => {
const data = res.data.result.data;
maxPage.value = Math.ceil(
res.data.result.total / initialPagination.value.rowsPerPage
res.data.result.total / rowsPerPage.value
);
fetchList(data);
})
@ -58,6 +56,12 @@ function openEdit(id: string) {
router.push(`/discipline/disciplinary/${id}`);
}
async function updatePagingProp(rowPerpage: number, pageCurrent: number) {
rowsPerPage.value = rowPerpage;
page.value = pageCurrent;
await fetchListDisciplinary();
}
/**เมื่อเริ่มโหลดหน้า
* ส่งข้อมูลจำลองไปยัง store
*/
@ -80,28 +84,16 @@ onMounted(async () => {
:visible-columns="dataInvestigateDis.visibleColumns"
v-model:inputfilter="filter"
v-model:inputvisible="dataInvestigateDis.visibleColumns"
:pagination="initialPagination"
:pagination="rowsPerPage"
:nornmalData="true"
:paging="true"
:titleText="''"
:rowsPerPage="rowsPerPage"
:page="page"
:maxPage="maxPage"
@update:pagination="updatePagingProp"
v-model:open-edit="openEdit"
>
<template #columns="props">
<q-tr :props="props" class="cursor-pointer">
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
@click="openEdit(props.row.id)"
>
<div v-if="col.name == 'no'">
{{ props.rowIndex + 1 }}
</div>
<div v-else>
{{ col.value }}
</div>
</q-td>
</q-tr>
</template>
</Table>
</div>
</q-card>

91
src/modules/11_discipline/components/3_InvestigateDisciplinary/Table.vue
View file

@ -1,17 +1,12 @@
<script setup lang="ts">
import { ref, useAttrs } from "vue";
import { ref, useAttrs, watch } from "vue";
import type { Pagination } from "@/modules/04_registry/interface/index/Main";
const table = ref<any>(null);
const filterRef = ref<any>(null);
const attrs = ref<any>(useAttrs());
const paging = ref<boolean>(true);
const pagination = ref({
// sortBy: "desc",
descending: false,
page: 1,
rowsPerPage: 10,
});
const currentPage = ref<number>(1);
/** รับ props มาจากหน้าหลัก */
const props = defineProps({
@ -27,6 +22,10 @@ const props = defineProps({
type: Function,
default: () => console.log("not function"),
},
openEdit: {
type: Function,
default: () => console.log("not function"),
},
nornmalData: {
type: Boolean,
defualt: true,
@ -35,14 +34,38 @@ const props = defineProps({
type: Boolean,
defualt: false,
},
filterTable: {
type: String,
default: "",
},
maxPage: {
type: Number,
require: true,
},
rowsPerPage: {
type: Number,
require: true,
},
page: {
type: Number,
require: true,
},
});
const emit = defineEmits([
"update:inputfilter",
"update:inputvisible",
"update:editvisible",
"update:pagination",
]);
/** แสดงจำนวนในตาราง */
const pagination = ref({
descending: true,
page: Number(props.page),
rowsPerPage: props.rowsPerPage,
});
function paginationLabel(start: string, end: string, total: string) {
if (paging.value == true) return " " + start + "-" + end + " ใน " + total;
else return start + "-" + end + " ใน " + total;
@ -61,6 +84,26 @@ function resetFilter() {
emit("update:inputfilter", "");
filterRef.value.focus();
}
function updateProp(newPagination: any, page: number) {
// ส่ง event ไปยัง parent component เพื่ออัพเดทค่า props
emit("update:pagination", newPagination, page);
}
watch(
() => currentPage.value,
() => {
updateProp(pagination.value.rowsPerPage, currentPage.value);
}
);
watch(
() => pagination.value.rowsPerPage,
() => {
currentPage.value = 1;
updateProp(pagination.value.rowsPerPage, currentPage.value);
}
);
</script>
<template>
@ -115,7 +158,19 @@ function resetFilter() {
dense
:pagination-label="paginationLabel"
v-model:pagination="pagination"
:rows-per-page-options="[10, 25, 50, 100]"
>
<template v-slot:pagination="scope">
<q-pagination
v-model="currentPage"
active-color="primary"
color="dark"
:max="Number(props.maxPage)"
size="sm"
boundary-links
direction-links
></q-pagination>
</template>
<template v-slot:header="props">
<q-tr :props="props">
<q-th v-for="col in props.cols" :key="col.name" :props="props">
@ -123,8 +178,26 @@ function resetFilter() {
</q-th>
</q-tr>
</template>
<template #body="props">
<slot v-bind="props" name="columns"></slot>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
@click="openEdit(props.row.id)"
>
<div v-if="col.name == 'no'">
{{
(currentPage - 1) * Number(pagination.rowsPerPage) +
props.rowIndex +
1
}}
</div>
<div v-else>
{{ col.value }}
</div>
</q-td>
</q-tr>
</template>
</d-table>
</template>

21
src/modules/11_discipline/components/4_Result/MainPage.vue
View file

@ -23,7 +23,7 @@ const initialPagination = ref<Pagination>({
});
const page = ref<number>(1);
const pageSize = ref<number>(5);
const pageSize = ref<number>(10);
const maxPage = ref<number>(1);
const filter = ref<string>("");
@ -95,24 +95,9 @@ onMounted(async () => {
:pageSize="pageSize"
:maxPage="maxPage"
@update:queryString="updateQueryString"
v-model:open-edit="openEdit"
>
<template #columns="props">
<q-tr :props="props" class="cursor-pointer">
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
@click="openEdit(props.row.id)"
>
<div v-if="col.name == 'no'">
{{ props.rowIndex + 1 }}
</div>
<div v-else>
{{ col.value }}
</div>
</q-td>
</q-tr>
</template>
</Table>
</div>
</q-card>

28
src/modules/11_discipline/components/4_Result/Table.vue
View file

@ -21,6 +21,10 @@ const props = defineProps({
type: Function,
default: () => console.log("not function"),
},
openEdit: {
type: Function,
default: () => console.log("not function"),
},
nornmalData: {
type: Boolean,
defualt: true,
@ -156,6 +160,7 @@ watch([() => currentPage.value, () => pagination.value.rowsPerPage], () => {
:rows-per-page-options="[10, 25, 50, 100]"
:pagination="pagination"
@update:pagination="updateRowsPerPage"
>
<template v-slot:header="props">
<q-tr :props="props">
@ -164,8 +169,26 @@ watch([() => currentPage.value, () => pagination.value.rowsPerPage], () => {
</q-th>
</q-tr>
</template>
<template #body="props">
<slot v-bind="props" name="columns"></slot>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
@click="openEdit(props.row.id)"
>
<div v-if="col.name == 'no'">
{{
(currentPage - 1) * Number(pagination.rowsPerPage) +
props.rowIndex +
1
}}
</div>
<div v-else>
{{ col.value }}
</div>
</q-td>
</q-tr>
</template>
<template v-slot:pagination="scope">
<q-pagination
@ -178,6 +201,7 @@ watch([() => currentPage.value, () => pagination.value.rowsPerPage], () => {
direction-links
></q-pagination>
</template>
</d-table>
</template>

6
src/modules/11_discipline/components/7_ListSuspend/ListsPage.vue
View file

@ -327,7 +327,11 @@ onMounted(() => {
@click="router.push(`/discipline-suspend/${props.row.id}`)"
>
<div v-if="col.name === 'no'">
{{ props.rowIndex + 1 }}
{{
(currentPage - 1) * Number(pagination.rowsPerPage) +
props.rowIndex +
1
}}
</div>
<div
v-else-if="col.name === 'organization'"

6
src/modules/11_discipline/components/8_AppealComplain/MainPage.vue
View file

@ -449,7 +449,11 @@ onMounted(async () => {
@click="editPage(props.row.id)"
>
<div v-if="col.name == 'no'">
{{ props.rowIndex + 1 }}
{{
(currentPage - 1) * Number(pagination.rowsPerPage) +
props.rowIndex +
1
}}
</div>
<div>
{{ col.value }}