refactor: comment fetchKeycloakPosition existingData

src/components/PopupPrivacy.vue

@@ -16,41 +16,26 @@ const modal = defineModel<boolean>('modal', {
 
 // Privacy content data
 const privacyContent = {
-  title: 'การคุ้มครองข้อมูลส่วนบุคคล',
+  title: 'ประกาศความเป็นส่วนตัว',
   mainText:
-    'ระบบนี้มีการเก็บ และใช้ภาพถ่ายของท่าน เพื่อยืนยันตัวตนในการลงเวลาปฏิบัติราชการ ข้อมูลจะถูกใช้เฉพาะตามวัตถุประสงค์ของระบบ และจัดเก็บอย่างปลอดภัยตามกฎหมายคุ้มครองข้อมูลส่วนบุคคล (PDPA)',
+    'ประกาศความเป็นส่วนตัวสำหรับการลงเวลาปฏิบัติราชการผ่านระบบอิเล็กทรอนิกส์ในระบบริหารทรัพยากรบุคคลของกรุงเทพมหานคร (BMA – HRMS)',
   warningText: '* หากท่านไม่กดยอมรับ อาจทำให้ไม่สามารถใช้งานระบบได้',
   detailIntro:
-    'ข้าพเจ้าตกลงให้กรุงเทพมหานครเก็บ ใช้ และประมวลผลข้อมูลส่วนบุคคลประเภทภาพถ่ายของข้าพเจ้า ซึ่งได้มาจากการใช้งานระบบลงเวลาปฏิบัติราชการอิเล็กทรอนิกส์ ของระบบบริหารทรัพยากรบุคคลของกรุงเทพมหานคร (BMA - HRMS) ทั้งนี้ เพื่อวัตถุประสงค์ดังต่อไปนี้',
+    'กรุงเทพมหานครเก็บรวบรวมและใช้ข้อมูลส่วนบุคคลของท่าน ได้แก่ ข้อมูลวันและเวลาลงเวลาปฏิบัติราชการ พิกัดสถานที่ ณ ขณะลงเวลา ภาพถ่าย ณ ขณะลงเวลา ข้อมูลหน่วยงานหรือสถานที่ปฏิบัติงาน และข้อมูลทางเทคนิคที่จำเป็นต่อการใช้งานระบบ เพื่อวัตถุประสงค์ในการยืนยันการมาปฏิบัติราชการ ป้องกันการลงเวลาแทนกัน ตรวจสอบความถูกต้องของข้อมูล บริหารวันและเวลาปฏิบัติราชการ การลา การประเมินผลการปฏิบัติราชการ การพิจารณาเลื่อนเงินเดือน ตลอดจนการบริหารทรัพยากรบุคคลตามกฎหมาย กฎ ระเบียบ และหลักเกณฑ์ที่เกี่ยวข้อง',
-  purposes: {
+
-    title: 'วัตถุประสงค์การใช้ข้อมูล',
+  paragraphs: [
-    items: [
+    'การเก็บรวบรวมและใช้ข้อมูลดังกล่าวเป็นการดำเนินการโดยอาศัยฐานการปฏิบัติหน้าที่ในการดำเนินภารกิจเพื่อประโยชน์สาธารณะหรือการใช้อำนาจรัฐตามมาตรา 24 (4) และฐานการปฏิบัติตามกฎหมายของ ผู้ควบคุมข้อมูลส่วนบุคคลตามมาตรา 24 (6) แห่งพระราชบัญญัติคุ้มครองข้อมูลส่วนบุคคล พ.ศ. 2562 โดยมิได้อาศัยความยินยอมของเจ้าของข้อมูลส่วนบุคคล',
-      'เพื่อยืนยันตัวตนของผู้ปฏิบัติงานในการบันทึกเวลาเข้า-ออกการปฏิบัติราชการ',
+    'ระบบจะเข้าถึงข้อมูลพิกัดและกล้องถ่ายภาพเฉพาะในขณะที่ท่านดำเนินการลงเวลาเข้าและออกจากการปฏิบัติราชการเท่านั้น โดยไม่มีการติดตามหรือบันทึกพิกัดของท่านอย่างต่อเนื่องภายหลังจากการลงเวลาเสร็จสิ้น',
-      'เพื่อใช้เป็นหลักฐานประกอบการบริหารงานด้านทรัพยากรบุคคล การจ่ายค่าตอบแทน และการกำกับ ดูแลการปฏิบัติราชการ',
+    'กรุงเทพมหานครจะเก็บรักษาข้อมูลภาพถ่าย พิกัด ณ ขณะลงเวลา และข้อมูลรายละเอียดการลงเวลาไว้ตามรอบการประเมินผลการปฏิบัติราชการเป็นระยะเวลาไม่เกิน 6 เดือนนับแต่วันที่เก็บรวบรวม หรือจนกว่าการตรวจสอบข้อมูลในรอบการประเมินนั้นจะแล้วเสร็จ แล้วแต่ระยะเวลาใดจะยาวกว่า เมื่อครบกำหนด กรุงเทพมหานครจะลบ ทำลาย หรือทำให้ข้อมูลดังกล่าวไม่สามารถระบุตัวบุคคลได้ตามวิธีการและมาตรการรักษาความมั่นคงปลอดภัยที่กำหนด',
-      'เพื่อรักษาความถูกต้อง โปร่งใส และป้องกันการทุจริตในการบันทึกเวลาการปฏิบัติงาน',
+    'กรณีข้อมูลดังกล่าวเกี่ยวข้องกับการร้องเรียน การโต้แย้ง การตรวจสอบ การดำเนินการทางวินัยการอุทธรณ์ การดำเนินคดี หรือการใช้สิทธิเรียกร้องตามกฎหมาย กรุงเทพมหานครอาจเก็บรักษาข้อมูลไว้เกินกว่า 6 เดือนได้เท่าที่จำเป็น จนกว่ากระบวนการดังกล่าวจะถึงที่สุดหรือพ้นระยะเวลาที่กฎหมายกำหนด',
+    'ทั้งนี้ ข้อมูลสรุปเกี่ยวกับวันเวลาปฏิบัติราชการ การลา การมาสาย การขาดราชการ ผลการประเมินผลการปฏิบัติราชการ และผลการพิจารณาเลื่อนเงินเดือน ซึ่งเป็นส่วนหนึ่งของทะเบียนประวัติหรือเอกสารด้านการบริหารทรัพยากรบุคคล อาจได้รับการเก็บรักษาตามระยะเวลาที่กฎหมาย ระเบียบ หลักเกณฑ์งานบุคคล และระเบียบงานสารบรรณกำหนด ซึ่งอาจมีระยะเวลาแตกต่างจากข้อมูลภาพถ่ายและพิกัดที่ใช้ประกอบการลงเวลา',
+    'กรุงเทพมหานครจะจำกัดการเข้าถึงข้อมูลเฉพาะเจ้าหน้าที่หรือผู้ปฏิบัติงานที่มีหน้าที่เกี่ยวข้อง และจะไม่นำข้อมูลไปใช้หรือเปิดเผยเพื่อวัตถุประสงค์อื่นที่ไม่สอดคล้องกับวัตถุประสงค์ที่ได้แจ้งไว้ เว้นแต่เป็นกรณีที่กฎหมายกำหนดหรืออนุญาตให้ดำเนินการได้',
+    'ท่านมีสิทธิขอเข้าถึง ขอรับสำเนา ขอแก้ไข ขอคัดค้าน ขอระงับการใช้ หรือขอให้ลบข้อมูลส่วนบุคคลของท่านได้ตามหลักเกณฑ์และเงื่อนไขที่พระราชบัญญัติคุ้มครองข้อมูลส่วนบุคคล พ.ศ. 2562 กำหนด โดยการใช้สิทธิดังกล่าวไม่กระทบต่อหน้าที่ในการลงเวลาปฏิบัติราชการและการปฏิบัติตามกฎหมาย กฎ ระเบียบ และหลักเกณฑ์ของกรุงเทพมหานคร',
   ],
-  },
-  understanding: {
-    items: [
-      'การเก็บ ใช้ และประมวลผลข้อมูลส่วนบุคคลดังกล่าว จะดำเนินการ เท่าที่จำเป็นตามวัตถุประสงค์ที่ระบุไว้เท่านั้น',
-      'หน่วยงานจะจัดให้มีมาตรการรักษาความมั่นคงปลอดภัยของข้อมูลส่วนบุคคล ตามที่กฎหมายกำหนด',
-      'ข้อมูลส่วนบุคคลของข้าพเจ้าจะถูกเก็บรักษา ตามระยะเวลาที่จำเป็น ต่อการปฏิบัติงานหรือเป็นไปตามที่กฎหมายกำหนด',
-    ],
-  },
-  rights: {
-    title:
-      'ข้าพเจ้าทราบถึง สิทธิของเจ้าของข้อมูลส่วนบุคคล ตามพระราชบัญญัติคุ้มครองข้อมูลส่วนบุคคล พ.ศ. ๒๕๖๒ ได้แก่',
-    items: [
-      'สิทธิขอเข้าถึงและขอรับสำเนาข้อมูล',
-      'สิทธิขอแก้ไขข้อมูลให้ถูกต้อง',
-      'สิทธิขอถอนความยินยอม (ทั้งนี้ การถอนความยินยอมอาจส่งผลต่อการใช้งานระบบลงเวลาการปฏิบัติราชการ)',
-      'สิทธิร้องเรียนต่อคณะกรรมการคุ้มครองข้อมูลส่วนบุคคล',
-    ],
-  },
   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,51 +153,19 @@ const checkIfScrollable = () => {
             {{ privacyContent.detailIntro }}
           </p>
 
-          <!-- วัตถุประสงค์ -->
+          <!-- เนื้อหาประกาศความเป็นส่วนตัว -->
           <div class="q-mb-md">
-            <ol class="q-pl-lg list-style">
+            <p
-              <li
+              v-for="(paragraph, index) in privacyContent.paragraphs"
-                v-for="(item, index) in privacyContent.purposes.items"
               :key="`p-${index}`"
-                class="q-mb-xs"
+              class="q-mb-sm"
             >
-                {{ item }}
+              {{ paragraph }}
-              </li>
-            </ol>
-          </div>
-
-          <!-- ข้าพเจ้าทราบและเข้าใจว่า -->
-          <div class="q-mx-sm">
-            ข้าพเจ้าทราบและเข้าใจว่า
-            <ul class="q-mt-sm">
-              <li
-                v-for="(item, index) in privacyContent.understanding.items"
-                :key="`u-${index}`"
-                class="q-mb-xs"
-              >
-                {{ item }}
-              </li>
-            </ul>
-          </div>
-
-          <!-- สิทธิ์ของเจ้าของข้อมูล -->
-          <div>
-            <p>
-              {{ privacyContent.rights.title }}
             </p>
-            <ul>
+          </div>
-              <li
-                v-for="(item, index) in privacyContent.rights.items"
-                :key="`r-${index}`"
-                class="q-mb-xs"
-              >
-                {{ item }}
-              </li>
-            </ul>
 
           <p class="consent-text q-mt-lg">{{ privacyContent.consentText }}</p>
         </div>
-        </div>
       </q-card-section>
 
       <!-- Fixed Bottom Section -->

src/views/HomeView.vue

@@ -1298,7 +1298,10 @@ watch(notificationCounter, () => {
 
           <div class="col-12 text-grey-9">
             <div class="col-12 row justify-center">
-              <div class="col-12 row q-pt-md justify-center gt-xs">
+              <div
+                v-if="$q.screen.gt.xs"
+                class="col-12 row q-pt-md justify-center"
+              >
                 <div
                   class="col-xs-12 col-sm-10 text-h6 text-center text-weight-bold"
                 >
@@ -1348,7 +1351,7 @@ watch(notificationCounter, () => {
                     {{ crossDayCheckoutWarning }}
                   </q-banner>
                 </div>
-                <div class="col-xs-12 col-sm-8 gt-xs">
+                <div v-if="$q.screen.gt.xs" class="col-xs-12 col-sm-8">
                   <div class="col-12">
                     <MapCheck
                       ref="mapRefDesktop"
@@ -1853,7 +1856,7 @@ watch(notificationCounter, () => {
   </q-page>
 
   <!--  top page sticky  หน้ามือถือ-->
-  <q-page-sticky expand position="top" v-if="$q.screen.xs">
+  <q-page-sticky expand position="top" v-show="$q.screen.xs">
     <div
       class="row q-col-gutter-sm col bg-white col-12 q-pa-md"
       style="height: 100px"

src/views/MainView.vue

@@ -178,31 +178,32 @@ const landingPageUrl = ref<string>(configParam.landingPageUrl)
 /** ฟังก์ชันเรียกข้อมูลผู้ใช่งาน*/
 async function fetchKeycloakPosition() {
   // เช็คว่ามีข้อมูลใน store อยู่แล้วหรือไม่ (จาก localStorage)
-  const existingData = positionKeycloakStore.dataPositionKeycloak
+  // จะช่วยลดจำนวนครั้งในการเรียก API และปรับปรุงประสิทธิภาพของแอปพลิเคชัน
+  // const existingData = positionKeycloakStore.dataPositionKeycloak
 
-  if (existingData) {
+  // if (existingData) {
-    // มีข้อมูลอยู่แล้ว ใช้ข้อมูลเดิม
+  //   // มีข้อมูลอยู่แล้ว ใช้ข้อมูลเดิม
 
-    // เช็คว่ามีข้อมูลสังกัด (organization) หรือไม่
+  //   // เช็คว่ามีข้อมูลสังกัด (organization) หรือไม่
-    const hasOrganization =
+  //   const hasOrganization =
-      existingData.organization &&
+  //     existingData.organization &&
-      (existingData.organization.root ||
+  //     (existingData.organization.root ||
-        existingData.organization.child1 ||
+  //       existingData.organization.child1 ||
-        existingData.organization.child2 ||
+  //       existingData.organization.child2 ||
-        existingData.organization.child3 ||
+  //       existingData.organization.child3 ||
-        existingData.organization.child4)
+  //       existingData.organization.child4)
 
-    if (!hasOrganization) {
+  //   if (!hasOrganization) {
-      // ไม่มีข้อมูลสังกัด redirect ไปหน้า NoPosition
+  //     // ไม่มีข้อมูลสังกัด redirect ไปหน้า NoPosition
-      router.replace('/no-position')
+  //     router.replace('/no-position')
-      return
+  //     return
-    }
+  //   }
 
-    privacyStore.modalPrivacy = !existingData.privacyCheckin
+  //   privacyStore.modalPrivacy = !existingData.privacyCheckin
-    privacyStore.setAccepted(existingData.privacyCheckin)
+  //   privacyStore.setAccepted(existingData.privacyCheckin)
 
-    return
+  //   return
-  }
+  // }
 
   // ไม่มีข้อมูล ให้ fetch จาก API
   await http