From 5ba2a6dce5c49dec2b51c9cfde85549dcc9782e0 Mon Sep 17 00:00:00 2001 From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" Date: Mon, 8 Jun 2026 17:11:09 +0700 Subject: [PATCH 1/3] fix: pagination --- src/components/TableHistory.vue | 58 ++++++++++++--------------------- src/interface/index/Main.ts | 2 +- src/views/HistoryView.vue | 9 ++--- 3 files changed, 27 insertions(+), 42 deletions(-) diff --git a/src/components/TableHistory.vue b/src/components/TableHistory.vue index c364c30..e081a3c 100644 --- a/src/components/TableHistory.vue +++ b/src/components/TableHistory.vue @@ -13,20 +13,15 @@ import SkeletonTable from '@/components/SkeletonTable.vue' // skeleton table const { date2Thai } = useCounterMixin() const stores = useCheckIn() +const page = defineModel('page', { required: true }) +const pageSize = defineModel('pageSize', { required: true }) + /** props ข้อมูลจาก Components Page HistoryView */ const props = defineProps({ paging: { type: Boolean, default: false, }, - pageSize: { - type: Number, - default: 10, - }, - page: { - type: Number, - default: 1, - }, maxPage: { type: Number, default: 1, @@ -194,31 +189,20 @@ const visibleColumns = ref([ 'checkOutLocation', 'checkOutStatus', ]) - -const currentPage = ref(1) //หน้าปัจจุบัน -// Pagination - initial pagination -const initialPagination = ref({ - sortBy: null, - descending: false, - page: 1, - rowsPerPage: props.pageSize, // set ตาม page หลักส่งมา +const pagination = ref({ + page: page.value, + rowsPerPage: pageSize.value, }) // Pagination - update rowsPerPage async function updatePagination(newPagination: Pagination) { - initialPagination.value = newPagination - currentPage.value = 1 // set current page เป็น 1 เสมอเมื่อเปลี่ยน per row + pageSize.value = newPagination.rowsPerPage } async function filterFn() { - // ส่งอีเวนต์ 'update:change-page' เมื่อหน้าเปลี่ยนแปลง - emit( - 'update:change-page', - 1, - initialPagination.value.rowsPerPage, - keyword.value - ) + emit('update:change-page', 1, pageSize.value, keyword.value) } + const modalPopup = ref(false) // popup แก้ไขลงเวลา const titlePopup = ref('') // หัวขข้อ popup แก้ไขลงเวลา const dataRow = ref() // ข้อมูลการลงเวลา @@ -276,17 +260,15 @@ function onClickOpenPopupRejrct(data: DataCheckIn) { } } -/** watch currentPage และ rowsPerPage*/ +function onUpdatePage(val: number) { + emit('update:change-page', val, pageSize.value, keyword.value) +} + +/** watch pageSize*/ watch( - [() => currentPage.value, () => initialPagination.value.rowsPerPage], + () => pageSize.value, () => { - // ส่งอีเวนต์ 'update:change-page' เมื่อหน้าเปลี่ยนแปลง - emit( - 'update:change-page', - currentPage.value, - initialPagination.value.rowsPerPage, - keyword.value - ) + emit('update:change-page', 1, pageSize.value, keyword.value) } ) @@ -340,10 +322,10 @@ watch( v-model:selected="selected" :virtual-scroll-sticky-size-start="48" :style="$q.screen.gt.xs ? 'max-height: 64vh' : ''" - :rows-per-page-options="[10, 25, 50, 100]" + :rows-per-page-options="[1, 10, 25, 50, 100]" :grid="$q.screen.gt.xs ? false : true" - :pagination="initialPagination" @update:pagination="updatePagination" + v-model:pagination="pagination" > + diff --git a/src/interface/index/Main.ts b/src/interface/index/Main.ts index 5d82bd2..72b2ba1 100644 --- a/src/interface/index/Main.ts +++ b/src/interface/index/Main.ts @@ -29,7 +29,7 @@ interface Pagination { sortBy: string | null descending: boolean page: number - rowsPerPage: number | undefined + rowsPerPage: number } interface DataCheckIn { checkInDate: string diff --git a/src/views/HistoryView.vue b/src/views/HistoryView.vue index 089d697..8f5a2bd 100644 --- a/src/views/HistoryView.vue +++ b/src/views/HistoryView.vue @@ -115,6 +115,7 @@ async function fetchlistTime() { async function updateYear(y: number, m: number) { stores.tab === 'history' ? (year.value = y) : (year2.value = y) month.value = m + page.value = 1 // รีเซ็ตหน้าเป็นหน้าแรกเมื่อปีหรือเดือนเปลี่ยนแปลง await functionFetch() // เรียกใช้งานฟังก์ชัน functionFetch เพื่อดึงข้อมูลใหม่ } @@ -177,9 +178,9 @@ watch( /> Date: Thu, 16 Jul 2026 11:30:46 +0700 Subject: [PATCH 2/3] refactor: privacyContent --- src/components/PopupPrivacy.vue | 98 +++++++++------------------------ src/views/HomeView.vue | 9 ++- 2 files changed, 32 insertions(+), 75 deletions(-) diff --git a/src/components/PopupPrivacy.vue b/src/components/PopupPrivacy.vue index 1bd816b..739d65f 100644 --- a/src/components/PopupPrivacy.vue +++ b/src/components/PopupPrivacy.vue @@ -16,41 +16,26 @@ const modal = defineModel('modal', { // Privacy content data const privacyContent = { - title: 'การคุ้มครองข้อมูลส่วนบุคคล', + title: 'ประกาศความเป็นส่วนตัว', mainText: - 'ระบบนี้มีการเก็บ และใช้ภาพถ่ายของท่าน เพื่อยืนยันตัวตนในการลงเวลาปฏิบัติราชการ ข้อมูลจะถูกใช้เฉพาะตามวัตถุประสงค์ของระบบ และจัดเก็บอย่างปลอดภัยตามกฎหมายคุ้มครองข้อมูลส่วนบุคคล (PDPA)', + 'ประกาศความเป็นส่วนตัวสำหรับการลงเวลาปฏิบัติราชการผ่านระบบอิเล็กทรอนิกส์ในระบบริหารทรัพยากรบุคคลของกรุงเทพมหานคร (BMA – HRMS)', warningText: '* หากท่านไม่กดยอมรับ อาจทำให้ไม่สามารถใช้งานระบบได้', detailIntro: - 'ข้าพเจ้าตกลงให้กรุงเทพมหานครเก็บ ใช้ และประมวลผลข้อมูลส่วนบุคคลประเภทภาพถ่ายของข้าพเจ้า ซึ่งได้มาจากการใช้งานระบบลงเวลาปฏิบัติราชการอิเล็กทรอนิกส์ ของระบบบริหารทรัพยากรบุคคลของกรุงเทพมหานคร (BMA - HRMS) ทั้งนี้ เพื่อวัตถุประสงค์ดังต่อไปนี้', - purposes: { - title: 'วัตถุประสงค์การใช้ข้อมูล', - items: [ - 'เพื่อยืนยันตัวตนของผู้ปฏิบัติงานในการบันทึกเวลาเข้า-ออกการปฏิบัติราชการ', - 'เพื่อใช้เป็นหลักฐานประกอบการบริหารงานด้านทรัพยากรบุคคล การจ่ายค่าตอบแทน และการกำกับ ดูแลการปฏิบัติราชการ', - 'เพื่อรักษาความถูกต้อง โปร่งใส และป้องกันการทุจริตในการบันทึกเวลาการปฏิบัติงาน', - ], - }, - understanding: { - items: [ - 'การเก็บ ใช้ และประมวลผลข้อมูลส่วนบุคคลดังกล่าว จะดำเนินการ เท่าที่จำเป็นตามวัตถุประสงค์ที่ระบุไว้เท่านั้น', - 'หน่วยงานจะจัดให้มีมาตรการรักษาความมั่นคงปลอดภัยของข้อมูลส่วนบุคคล ตามที่กฎหมายกำหนด', - 'ข้อมูลส่วนบุคคลของข้าพเจ้าจะถูกเก็บรักษา ตามระยะเวลาที่จำเป็น ต่อการปฏิบัติงานหรือเป็นไปตามที่กฎหมายกำหนด', - ], - }, - rights: { - title: - 'ข้าพเจ้าทราบถึง สิทธิของเจ้าของข้อมูลส่วนบุคคล ตามพระราชบัญญัติคุ้มครองข้อมูลส่วนบุคคล พ.ศ. ๒๕๖๒ ได้แก่', - items: [ - 'สิทธิขอเข้าถึงและขอรับสำเนาข้อมูล', - 'สิทธิขอแก้ไขข้อมูลให้ถูกต้อง', - 'สิทธิขอถอนความยินยอม (ทั้งนี้ การถอนความยินยอมอาจส่งผลต่อการใช้งานระบบลงเวลาการปฏิบัติราชการ)', - 'สิทธิร้องเรียนต่อคณะกรรมการคุ้มครองข้อมูลส่วนบุคคล', - ], - }, + 'กรุงเทพมหานครเก็บรวบรวมและใช้ข้อมูลส่วนบุคคลของท่าน ได้แก่ ข้อมูลวันและเวลาลงเวลาปฏิบัติราชการ พิกัดสถานที่ ณ ขณะลงเวลา ภาพถ่าย ณ ขณะลงเวลา ข้อมูลหน่วยงานหรือสถานที่ปฏิบัติงาน และข้อมูลทางเทคนิคที่จำเป็นต่อการใช้งานระบบ เพื่อวัตถุประสงค์ในการยืนยันการมาปฏิบัติราชการ ป้องกันการลงเวลาแทนกัน ตรวจสอบความถูกต้องของข้อมูล บริหารวันและเวลาปฏิบัติราชการ การลา การประเมินผลการปฏิบัติราชการ การพิจารณาเลื่อนเงินเดือน ตลอดจนการบริหารทรัพยากรบุคคลตามกฎหมาย กฎ ระเบียบ และหลักเกณฑ์ที่เกี่ยวข้อง', + + paragraphs: [ + 'การเก็บรวบรวมและใช้ข้อมูลดังกล่าวเป็นการดำเนินการโดยอาศัยฐานการปฏิบัติหน้าที่ในการดำเนินภารกิจเพื่อประโยชน์สาธารณะหรือการใช้อำนาจรัฐตามมาตรา 24 (4) และฐานการปฏิบัติตามกฎหมายของ ผู้ควบคุมข้อมูลส่วนบุคคลตามมาตรา 24 (6) แห่งพระราชบัญญัติคุ้มครองข้อมูลส่วนบุคคล พ.ศ. 2562 โดยมิได้อาศัยความยินยอมของเจ้าของข้อมูลส่วนบุคคล', + 'ระบบจะเข้าถึงข้อมูลพิกัดและกล้องถ่ายภาพเฉพาะในขณะที่ท่านดำเนินการลงเวลาเข้าและออกจากการปฏิบัติราชการเท่านั้น โดยไม่มีการติดตามหรือบันทึกพิกัดของท่านอย่างต่อเนื่องภายหลังจากการลงเวลาเสร็จสิ้น', + 'กรุงเทพมหานครจะเก็บรักษาข้อมูลภาพถ่าย พิกัด ณ ขณะลงเวลา และข้อมูลรายละเอียดการลงเวลาไว้ตามรอบการประเมินผลการปฏิบัติราชการเป็นระยะเวลาไม่เกิน 6 เดือนนับแต่วันที่เก็บรวบรวม หรือจนกว่าการตรวจสอบข้อมูลในรอบการประเมินนั้นจะแล้วเสร็จ แล้วแต่ระยะเวลาใดจะยาวกว่า เมื่อครบกำหนด กรุงเทพมหานครจะลบ ทำลาย หรือทำให้ข้อมูลดังกล่าวไม่สามารถระบุตัวบุคคลได้ตามวิธีการและมาตรการรักษาความมั่นคงปลอดภัยที่กำหนด', + 'กรณีข้อมูลดังกล่าวเกี่ยวข้องกับการร้องเรียน การโต้แย้ง การตรวจสอบ การดำเนินการทางวินัยการอุทธรณ์ การดำเนินคดี หรือการใช้สิทธิเรียกร้องตามกฎหมาย กรุงเทพมหานครอาจเก็บรักษาข้อมูลไว้เกินกว่า 6 เดือนได้เท่าที่จำเป็น จนกว่ากระบวนการดังกล่าวจะถึงที่สุดหรือพ้นระยะเวลาที่กฎหมายกำหนด', + 'ทั้งนี้ ข้อมูลสรุปเกี่ยวกับวันเวลาปฏิบัติราชการ การลา การมาสาย การขาดราชการ ผลการประเมินผลการปฏิบัติราชการ และผลการพิจารณาเลื่อนเงินเดือน ซึ่งเป็นส่วนหนึ่งของทะเบียนประวัติหรือเอกสารด้านการบริหารทรัพยากรบุคคล อาจได้รับการเก็บรักษาตามระยะเวลาที่กฎหมาย ระเบียบ หลักเกณฑ์งานบุคคล และระเบียบงานสารบรรณกำหนด ซึ่งอาจมีระยะเวลาแตกต่างจากข้อมูลภาพถ่ายและพิกัดที่ใช้ประกอบการลงเวลา', + 'กรุงเทพมหานครจะจำกัดการเข้าถึงข้อมูลเฉพาะเจ้าหน้าที่หรือผู้ปฏิบัติงานที่มีหน้าที่เกี่ยวข้อง และจะไม่นำข้อมูลไปใช้หรือเปิดเผยเพื่อวัตถุประสงค์อื่นที่ไม่สอดคล้องกับวัตถุประสงค์ที่ได้แจ้งไว้ เว้นแต่เป็นกรณีที่กฎหมายกำหนดหรืออนุญาตให้ดำเนินการได้', + 'ท่านมีสิทธิขอเข้าถึง ขอรับสำเนา ขอแก้ไข ขอคัดค้าน ขอระงับการใช้ หรือขอให้ลบข้อมูลส่วนบุคคลของท่านได้ตามหลักเกณฑ์และเงื่อนไขที่พระราชบัญญัติคุ้มครองข้อมูลส่วนบุคคล พ.ศ. 2562 กำหนด โดยการใช้สิทธิดังกล่าวไม่กระทบต่อหน้าที่ในการลงเวลาปฏิบัติราชการและการปฏิบัติตามกฎหมาย กฎ ระเบียบ และหลักเกณฑ์ของกรุงเทพมหานคร', + ], consentText: - 'ข้าพเจ้าได้อ่านและเข้าใจรายละเอียดทั้งหมดแล้ว และยินยอมให้เก็บ ใช้ และประมวลผลข้อมูลส่วนบุคคล ประเภทภาพถ่ายของข้าพเจ้า ตามที่ระบุไว้ข้างต้นโดยสมัครใจ', + 'ข้าพเจ้าได้รับทราบประกาศความเป็นส่วนตัวเกี่ยวกับการลงเวลาปฏิบัติราชการผ่านระบบอิเล็กทรอนิกส์แล้ว', buttons: { - accept: 'ยอมรับ', + accept: 'รับทราบและดำเนินการต่อ', decline: 'ไม่ยอมรับ', }, } @@ -97,7 +82,8 @@ const toggleDetails = () => { const checkIfScrollable = () => { nextTick(() => { - const container = (scrollContainer.value as any)?.$el || scrollContainer.value + const container = + (scrollContainer.value as any)?.$el || scrollContainer.value if (container) { const { scrollHeight, clientHeight } = container @@ -167,50 +153,18 @@ const checkIfScrollable = () => { {{ privacyContent.detailIntro }}

- +
-
    -
  1. - {{ item }} -
  2. -
-
- - -
- ข้าพเจ้าทราบและเข้าใจว่า -
    -
  • - {{ item }} -
  • -
-
- - -
-

- {{ privacyContent.rights.title }} +

+ {{ paragraph }}

-
    -
  • - {{ item }} -
  • -
- -
+ + diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue index 84a3e77..e114761 100644 --- a/src/views/HomeView.vue +++ b/src/views/HomeView.vue @@ -1298,7 +1298,10 @@ watch(notificationCounter, () => {
-
+
@@ -1348,7 +1351,7 @@ watch(notificationCounter, () => { {{ crossDayCheckoutWarning }}
-
+
{ - +
Date: Thu, 16 Jul 2026 14:07:07 +0700 Subject: [PATCH 3/3] refactor: comment fetchKeycloakPosition existingData --- src/views/MainView.vue | 41 +++++++++++++++++++++-------------------- 1 file changed, 21 insertions(+), 20 deletions(-) diff --git a/src/views/MainView.vue b/src/views/MainView.vue index d83192e..f278e96 100644 --- a/src/views/MainView.vue +++ b/src/views/MainView.vue @@ -178,31 +178,32 @@ const landingPageUrl = ref(configParam.landingPageUrl) /** ฟังก์ชันเรียกข้อมูลผู้ใช่งาน*/ async function fetchKeycloakPosition() { // เช็คว่ามีข้อมูลใน store อยู่แล้วหรือไม่ (จาก localStorage) - const existingData = positionKeycloakStore.dataPositionKeycloak + // จะช่วยลดจำนวนครั้งในการเรียก API และปรับปรุงประสิทธิภาพของแอปพลิเคชัน + // const existingData = positionKeycloakStore.dataPositionKeycloak - if (existingData) { - // มีข้อมูลอยู่แล้ว ใช้ข้อมูลเดิม + // if (existingData) { + // // มีข้อมูลอยู่แล้ว ใช้ข้อมูลเดิม - // เช็คว่ามีข้อมูลสังกัด (organization) หรือไม่ - const hasOrganization = - existingData.organization && - (existingData.organization.root || - existingData.organization.child1 || - existingData.organization.child2 || - existingData.organization.child3 || - existingData.organization.child4) + // // เช็คว่ามีข้อมูลสังกัด (organization) หรือไม่ + // const hasOrganization = + // existingData.organization && + // (existingData.organization.root || + // existingData.organization.child1 || + // existingData.organization.child2 || + // existingData.organization.child3 || + // existingData.organization.child4) - if (!hasOrganization) { - // ไม่มีข้อมูลสังกัด redirect ไปหน้า NoPosition - router.replace('/no-position') - return - } + // if (!hasOrganization) { + // // ไม่มีข้อมูลสังกัด redirect ไปหน้า NoPosition + // router.replace('/no-position') + // return + // } - privacyStore.modalPrivacy = !existingData.privacyCheckin - privacyStore.setAccepted(existingData.privacyCheckin) + // privacyStore.modalPrivacy = !existingData.privacyCheckin + // privacyStore.setAccepted(existingData.privacyCheckin) - return - } + // return + // } // ไม่มีข้อมูล ให้ fetch จาก API await http