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

set file build image

Browse source
This commit is contained in:
Kittapath 2023-11-07 19:23:16 +07:00
parent a079fcd0ae
commit 970c582e34
7 changed files with 1793 additions and 2223 deletions
Download patch file Download diff file Expand all files Collapse all files

1777
src/interface/request/main/main.ts
View file

File diff suppressed because it is too large Load diff

544
src/modules/01_manual/components/2_data/24_Officer.vue
View file

@ -1,11 +1,11 @@
<script setup lang="ts">
import { ref } from "vue";
const rightDrawerOpen = ref(false);
const text = ref("");
import { ref } from "vue"
const rightDrawerOpen = ref(false)
const text = ref("")
</script>
<template>
<!-- <div class="row col-12">
<!-- <div class="row col-12">
<div class="col-9">
<div class="toptitle text-dark col-12 row items-center">
คู่มือการใช้งานระบบบริหารทรัพยากรบุคคลของกรุงเทพมหานคร
@ -26,422 +26,170 @@ const text = ref("");
</div>
</q-card> -->
<q-card
flat
bordered
class="col-12 q-pa-md"
style="border-radius: 0px 0px 8px 8px"
>
<div style="font-weight: bold; font-size: 15px; color: #00aa86">
2.3 ข้อมูลตำแหน่งของข้าราชการ
</div>
<q-card flat bordered class="col-12 q-pa-md" style="border-radius: 0px 0px 8px 8px">
<div style="font-weight: bold; font-size: 15px; color: #00aa86">2.3 ข้อมูลตำแหน่งของข้าราชการ</div>
<div class="col-12" style="margin-top: 20px; margin-left: 10px">
- เมื่อกดเลือกเมนู “ข้อมูลตำแหน่งของข้าราชการ” จะปรากฏรายละเอียดดังรูปภาพ
</div>
<div class="col-12" style="margin-top: 20px; margin-left: 10px">- เมื่อกดเลือกเมนู “ข้อมูลตำแหน่งของข้าราชการ” จะปรากฏรายละเอียดดังรูปภาพ</div>
<div class="col-12">
<q-img
src="@/assets/manual/02_data/4_Officer/2-41.png"
style="
display: block;
margin: 0 auto;
border-radius: 20px;
margin-top: 20px;
"
/>
<div class="text-center text-grey-6" style="margin-top: 20px">
รูปภาพที่ 2 - 41 รายละเอียดข้อมูลตำแหน่งของข้าราชการ
</div>
</div>
<div class="col-12">
<q-img src="@/assets/manual/02_data/4_officer/2-41.png" style="display: block; margin: 0 auto; border-radius: 20px; margin-top: 20px" />
<div class="text-center text-grey-6" style="margin-top: 20px">รูปภาพที่ 2 - 41 รายละเอียดข้อมูลตำแหน่งของข้าราชการ</div>
</div>
<div class="col-12" style="margin-top: 50px; margin-left: 10px">
<p>
- เลือกกดแถบเมนูย่อย “ตำแหน่งประเภท, ชื่อสายงาน, ชื่อตำแหน่งสายงาน,
ด้าน/สาขาของสายงาน, ระดับตำแหน่ง, ชื่อตำแหน่งทางการบริหาร,
ด้านทางการบริหารหรือ สถานะของตำแหน่ง” ระบบแสดงข้อมูลโดยสามารถเพิ่ม
ลบหรือแก้ไขข้อมูลได้ดังรูปภาพ
ซึ่งเมนูย่อยอื่นๆสามารถทำตามขั้นตอนดังต่อไปนี้ได้เนื่องจากมีวิธีการทำและการแสดง
หน้าจอเหมือนกันและในกรอบสีแดงที่ช่องค้นหาสามารถสืบค้นข้อมูลและช่องคอลัมน์สามารถเลือกรายการเพื่อซ่อน
</p>
</div>
<div class="col-12" style="margin-top: 50px; margin-left: 10px">
<p>
- เลือกกดแถบเมนูย่อย “ตำแหน่งประเภท, ชื่อสายงาน, ชื่อตำแหน่งสายงาน, ด้าน/สาขาของสายงาน, ระดับตำแหน่ง, ชื่อตำแหน่งทางการบริหาร, ด้านทางการบริหารหรือ สถานะของตำแหน่ง”
ระบบแสดงข้อมูลโดยสามารถเพิ่ม ลบหรือแก้ไขข้อมูลได้ดังรูปภาพ ซึ่งเมนูย่อยอื่นๆสามารถทำตามขั้นตอนดังต่อไปนี้ได้เนื่องจากมีวิธีการทำและการแสดง
หน้าจอเหมือนกันและในกรอบสีแดงที่ช่องค้นหาสามารถสืบค้นข้อมูลและช่องคอลัมน์สามารถเลือกรายการเพื่อซ่อน
</p>
</div>
<div class="col-12">
<q-img
src="@/assets/manual/02_data/4_Officer/2-42.png"
style="
display: block;
margin: 0 auto;
border-radius: 20px;
margin-top: 20px;
"
/>
<div class="col-12">
<q-img src="@/assets/manual/02_data/4_officer/2-42.png" style="display: block; margin: 0 auto; border-radius: 20px; margin-top: 20px" />
<div class="text-center text-grey-6" style="margin-top: 20px">
รูปภาพที่ 2 - 42 แถบเมนูข้อมูลตำแหน่งของข้าราชการ
</div>
<div class="text-center text-grey-6" style="margin-top: 20px">รูปภาพที่ 2 - 42 แถบเมนูข้อมูลตำแหน่งของข้าราชการ</div>
<div
class="col-12"
style="
margin-top: -;
padding: 10px;
background-color: rgb(243, 243, 243);
font-size: 14px;
margin-top: 20px;
border-radius: 5px;
"
>
หมายเลข 1
คอลัมน์แสดงชื่อคอลัมน์แสดงข้อมูลย่อยของข้อมูลตำแหน่งของข้าราชการ <br />
หมายเลข 2
ช่องสำหรับกรอกค้นหาและเลือกคอลัมน์แสดงข้อมูลตามที่ได้ได้การค้นหา
</div>
</div>
<div class="col-12" style="margin-top: -; padding: 10px; background-color: rgb(243, 243, 243); font-size: 14px; margin-top: 20px; border-radius: 5px">
หมายเลข 1 คอลัมน์แสดงชื่อคอลัมน์แสดงข้อมูลย่อยของข้อมูลตำแหน่งของข้าราชการ <br />
หมายเลข 2 ช่องสำหรับกรอกค้นหาและเลือกคอลัมน์แสดงข้อมูลตามที่ได้ได้การค้นหา
</div>
</div>
<div class="col-12">
<p style="margin-top: 50px; margin-left: 10px">
- กดไอคอน
<q-icon
name="mdi-pencil-outline"
style="margin: 0 5px; color: #02a998"
size="xs"
/>
เพื่อเพิ่ม ลบหรือแก้ไขข้อมูล ระบบแสดงดังรูปภาพ
โดยสามารถแก้ไขรายการที่มีอยู่ได้เลย
</p>
</div>
<div class="col-12">
<p style="margin-top: 50px; margin-left: 10px">
- กดไอคอน
<q-icon name="mdi-pencil-outline" style="margin: 0 5px; color: #02a998" size="xs" />
เพื่อเพิ่ม ลบหรือแก้ไขข้อมูล ระบบแสดงดังรูปภาพ โดยสามารถแก้ไขรายการที่มีอยู่ได้เลย
</p>
</div>
<div class="col-12">
<q-img
src="@/assets/manual/02_data/4_Officer/2-43.png"
style="
display: block;
margin: 0 auto;
border-radius: 20px;
margin-top: 20px;
"
/>
<div class="col-12">
<q-img src="@/assets/manual/02_data/4_officer/2-43.png" style="display: block; margin: 0 auto; border-radius: 20px; margin-top: 20px" />
<div class="text-center text-grey-6" style="margin-top: 20px">
รูปภาพที่ 2 - 43 แก้ไขหรือลบข้อมูล
</div>
</div>
<div class="text-center text-grey-6" style="margin-top: 20px">รูปภาพที่ 2 - 43 แก้ไขหรือลบข้อมูล</div>
</div>
<div class="col-12">
<p style="margin-top: 50px; margin-left: 10px">
- กดไอคอน
<q-icon
name="mdi-plus"
style="margin: 0 5px; color: #00aa86"
size="xs"
/>
เพื่อเพิ่มข้อมูลระบบจะปรากฏช่องเพื่อให้เพิ่มข้อมูลดังรูปภาพและเมื่อกรอกเพื่อเพิ่มข้อมูลเรียบร้อยแล้วให้กดไอคอน
<q-icon
name="mdi-content-save-outline"
style="margin: 0 5px; color: #01435f"
size="xs"
/>
เพื่อบันทึกร่าง (ข้อมูลยังไม่มีการ-เผยแพร่)
โดยการบันทึกเฉพาะข้อมูลร่างนั้นจะมีเพียงผู้ดูแลระบบเท่านั้นที่เห็นได้
สามารถกดไอคอน
<q-icon
name="mdi-file-remove-outline"
style="margin: 0 5px; color: hsl(0, 100%, 50%)"
size="xs"
/>
เพื่อลบบันทึกร่างและสามารถกดไอคอน
<q-icon
name="mdi-cloud-upload-outline"
style="margin: 0 5px; color: #01435f"
size="xs"
/>
เพื่อเผยแพร่ข้อมูล
โดยในส่วนการเผยแพร่ข้อมูลนั้นผู้ดูแลระบบมีการตรวจสอบความถูกต้องเรียบร้อยแล้ว
และได้ทำการเผยแพร่ให้เจ้าหน้าที่ทุกคนเห็นข้อมูล
</p>
<div class="col-12">
<p style="margin-top: 50px; margin-left: 10px">
- กดไอคอน
<q-icon name="mdi-plus" style="margin: 0 5px; color: #00aa86" size="xs" />
เพื่อเพิ่มข้อมูลระบบจะปรากฏช่องเพื่อให้เพิ่มข้อมูลดังรูปภาพและเมื่อกรอกเพื่อเพิ่มข้อมูลเรียบร้อยแล้วให้กดไอคอน
<q-icon name="mdi-content-save-outline" style="margin: 0 5px; color: #01435f" size="xs" />
เพื่อบันทึกร่าง (ข้อมูลยังไม่มีการ-เผยแพร่) โดยการบันทึกเฉพาะข้อมูลร่างนั้นจะมีเพียงผู้ดูแลระบบเท่านั้นที่เห็นได้ สามารถกดไอคอน
<q-icon name="mdi-file-remove-outline" style="margin: 0 5px; color: hsl(0, 100%, 50%)" size="xs" />
เพื่อลบบันทึกร่างและสามารถกดไอคอน
<q-icon name="mdi-cloud-upload-outline" style="margin: 0 5px; color: #01435f" size="xs" />
เพื่อเผยแพร่ข้อมูล โดยในส่วนการเผยแพร่ข้อมูลนั้นผู้ดูแลระบบมีการตรวจสอบความถูกต้องเรียบร้อยแล้ว และได้ทำการเผยแพร่ให้เจ้าหน้าที่ทุกคนเห็นข้อมูล
</p>
<q-img
src="@/assets/manual/02_data/4_Officer/2-44.png"
style="
max-width: 100%;
display: block;
margin: 0 auto;
border-radius: 20px;
margin-top: 20px;
border: 1px solid #97b2de;
"
/>
<div class="text-center text-grey-6" style="margin-top: 20px">
รูปภาพที่ 2 - 44 เพิ่มข้อมูลในช่องที่ปรากฏ
</div>
<q-img src="@/assets/manual/02_data/4_officer/2-44.png" style="max-width: 100%; display: block; margin: 0 auto; border-radius: 20px; margin-top: 20px; border: 1px solid #97b2de" />
<div class="text-center text-grey-6" style="margin-top: 20px">รูปภาพที่ 2 - 44 เพิ่มข้อมูลในช่องที่ปรากฏ</div>
<div
style="
margin-top: 20px;
padding: 10px;
background-color: #f3f3f3;
font-size: 14px;
color: #000000;
border-radius: 5px;
"
>
หมายเลข 1
ช่องสำหรับกรอกเพิ่มข้อมูลชื่อหน่วยงาน/หน่วยงานต้นสังกัด/ส่วนรายการต้นสังกัด
<div style="margin-left: 50px">
- เมื่อไม่ต้องการเพิ่มข้อมูลแล้วให้กดไอคอน
<q-icon
name="mdi-trash-can-outline"
style="margin: 0 5px; color: hsl(0, 100%, 50%)"
size="xs"
/>
เพื่อลบช่องเพิ่มข้อมูล <br />
- เมื่อต้องการปิดสถานะให้กดตรงไอคอน
<div
class="q-toggle__inner relative-position non-selectable q-toggle__inner--truthy text-positive"
aria-hidden="true"
style="
font-size: 24px;
display: inline-block;
padding: 0 0.3em !important ;
height: 0.35em;
"
>
<div
class="q-toggle__thumb absolute flex flex-center no-wrap"
style="top: -0.08em"
></div>
<div class="q-toggle__track"></div>
</div>
เพื่อที่จะไม่แสดงข้อมูลนั้นในหน้าอื่นจากนั้นให้กดไอคอน
<q-icon
name="mdi-content-save-outline"
style="margin: 0 5px; color: #01435f"
size="xs"
/>
เพื่อบันทึกร่าง และกดไอคอน
<q-icon
name="mdi-cloud-upload-outline"
style="margin: 0 5px; color: #01435f"
size="xs"
/>
เพื่อเผยแพร่ข้อมูล
</div>
</div>
</div>
<div style="margin-top: 20px; padding: 10px; background-color: #f3f3f3; font-size: 14px; color: #000000; border-radius: 5px">
หมายเลข 1 ช่องสำหรับกรอกเพิ่มข้อมูลชื่อหน่วยงาน/หน่วยงานต้นสังกัด/ส่วนรายการต้นสังกัด
<div style="margin-left: 50px">
- เมื่อไม่ต้องการเพิ่มข้อมูลแล้วให้กดไอคอน
<q-icon name="mdi-trash-can-outline" style="margin: 0 5px; color: hsl(0, 100%, 50%)" size="xs" />
เพื่อลบช่องเพิ่มข้อมูล <br />
- เมื่อต้องการปิดสถานะให้กดตรงไอคอน
<div
class="q-toggle__inner relative-position non-selectable q-toggle__inner--truthy text-positive"
aria-hidden="true"
style="font-size: 24px; display: inline-block; padding: 0 0.3em !important ; height: 0.35em"
>
<div class="q-toggle__thumb absolute flex flex-center no-wrap" style="top: -0.08em"></div>
<div class="q-toggle__track"></div>
</div>
เพื่อที่จะไม่แสดงข้อมูลนั้นในหน้าอื่นจากนั้นให้กดไอคอน
<q-icon name="mdi-content-save-outline" style="margin: 0 5px; color: #01435f" size="xs" />
เพื่อบันทึกร่าง และกดไอคอน
<q-icon name="mdi-cloud-upload-outline" style="margin: 0 5px; color: #01435f" size="xs" />
เพื่อเผยแพร่ข้อมูล
</div>
</div>
</div>
<div class="col-12" style="margin-top: 50px; margin-left: 10px">
<p>
- เมื่อกดไอคอน
<q-icon
name="mdi-content-save-outline"
style="margin: 0 5px; color: #01435f"
size="xs"
/>
เพื่อบันทึกร่าง (ข้อมูลยังไม่มีการเผยแพร่) ระบบปรากฏป้าย
“บันทึกข้อมูลร่างสำเร็จ” ดังรูปภาพ
</p>
</div>
<div class="col-12">
<q-img
src="@/assets/manual/02_data/4_Officer/2-45.png"
style="
display: block;
margin: 0 auto;
border-radius: 20px;
margin-top: 20px;
"
/>
<div class="text-center text-grey-6" style="margin-top: 20px">
รูปภาพที่ 2 - 45 ป้าย “บันทึกข้อมูลร่างสำเร็จ”
</div>
<div class="col-12" style="margin-top: 50px; margin-left: 10px">
<p>
- เมื่อกดไอคอน
<q-icon name="mdi-content-save-outline" style="margin: 0 5px; color: #01435f" size="xs" />
เพื่อบันทึกร่าง (ข้อมูลยังไม่มีการเผยแพร่) ระบบปรากฏป้าย “บันทึกข้อมูลร่างสำเร็จ” ดังรูปภาพ
</p>
</div>
<div class="col-12">
<q-img src="@/assets/manual/02_data/4_officer/2-45.png" style="display: block; margin: 0 auto; border-radius: 20px; margin-top: 20px" />
<div class="text-center text-grey-6" style="margin-top: 20px">รูปภาพที่ 2 - 45 ป้าย “บันทึกข้อมูลร่างสำเร็จ”</div>
<div
class="col-12"
style="
margin-top: -;
padding: 10px;
background-color: rgb(243, 243, 243);
font-size: 14px;
margin-top: 20px;
border-radius: 5px;
"
>
หมายเลข 1 ระบบแสดงสถานะ “บันทึกข้อมูลร่างสำเร็จ”
หลังจากกดบันทึกเพิ่มข้อมูลตำแหน่งของข้าราชการ
</div>
</div>
<div class="col-12" style="margin-top: -; padding: 10px; background-color: rgb(243, 243, 243); font-size: 14px; margin-top: 20px; border-radius: 5px">
หมายเลข 1 ระบบแสดงสถานะ “บันทึกข้อมูลร่างสำเร็จ” หลังจากกดบันทึกเพิ่มข้อมูลตำแหน่งของข้าราชการ
</div>
</div>
<div class="col-12" style="margin-top: 50px; margin-left: 10px">
- กดไอคอน
<q-icon
name="mdi-file-remove-outline"
style="margin: 0 5px; color: hsl(0, 100%, 50%)"
size="xs"
/>
เพื่อลบบันทึกร่าง ระบบจะขึ้นป้าย “ต้องการลบข้อมูลบันทึกร่างนี้หรือไม่?”
ดังรูปภาพ
<div class="col-12" style="margin-top: 50px; margin-left: 10px">
- กดไอคอน
<q-icon name="mdi-file-remove-outline" style="margin: 0 5px; color: hsl(0, 100%, 50%)" size="xs" />
เพื่อลบบันทึกร่าง ระบบจะขึ้นป้าย “ต้องการลบข้อมูลบันทึกร่างนี้หรือไม่?” ดังรูปภาพ
<q-img
class="col-12"
src="@/assets/manual/02_data/4_Officer/2-46.png"
style="
max-width: 70%;
display: block;
margin: 0 auto;
border-radius: 20px;
margin-top: 20px;
border: 1px solid #97b2de;
"
/>
<div class="text-center text-grey-6" style="margin-top: 20px">
รูปภาพที่ 2 - 46 ป้าย “ต้องการลบข้อมูลบันทึกร่างนี้หรือไม่?”
</div>
</div>
<q-img
class="col-12"
src="@/assets/manual/02_data/4_officer/2-46.png"
style="max-width: 70%; display: block; margin: 0 auto; border-radius: 20px; margin-top: 20px; border: 1px solid #97b2de"
/>
<div class="text-center text-grey-6" style="margin-top: 20px">รูปภาพที่ 2 - 46 ป้าย “ต้องการลบข้อมูลบันทึกร่างนี้หรือไม่?”</div>
</div>
<div class="col-12" style="margin-top: 50px; margin-left: 10px">
<p>
- เมื่อกดปุ่ม “ลบบันทึก” ระบบปรากฏป้าย “ลบข้อมูลร่างสำเร็จ” ดังรูปภาพ
และเมื่อกดปุ่ม “ยกเลิก” ระบบจะไม่ทำการลบข้อมูลร่าง
</p>
</div>
<div class="col-12">
<q-img
src="@/assets/manual/02_data/4_Officer/2-47.png"
style="
display: block;
margin: 0 auto;
border-radius: 20px;
margin-top: 20px;
"
/>
<div class="text-center text-grey-6" style="margin-top: 20px">
รูปภาพที่ 2 - 47 ป้าย “ลบข้อมูลร่างสำเร็จ”
</div>
<div class="col-12" style="margin-top: 50px; margin-left: 10px">
<p>- เมื่อกดปุ่ม “ลบบันทึก” ระบบปรากฏป้าย “ลบข้อมูลร่างสำเร็จ” ดังรูปภาพ และเมื่อกดปุ่ม “ยกเลิก” ระบบจะไม่ทำการลบข้อมูลร่าง</p>
</div>
<div class="col-12">
<q-img src="@/assets/manual/02_data/4_officer/2-47.png" style="display: block; margin: 0 auto; border-radius: 20px; margin-top: 20px" />
<div class="text-center text-grey-6" style="margin-top: 20px">รูปภาพที่ 2 - 47 ป้าย “ลบข้อมูลร่างสำเร็จ”</div>
<div
class="col-12"
style="
margin-top: -;
padding: 10px;
background-color: rgb(243, 243, 243);
font-size: 14px;
margin-top: 20px;
border-radius: 5px;
"
>
หมายเลข 1 ระบบแสดงสถานะ “ลบข้อมูลสำเร็จ”
หลังจากคลิกยืนยันการลบข้อมูลตำแหน่งของข้าราชการ
</div>
</div>
<div class="col-12" style="margin-top: -; padding: 10px; background-color: rgb(243, 243, 243); font-size: 14px; margin-top: 20px; border-radius: 5px">
หมายเลข 1 ระบบแสดงสถานะ “ลบข้อมูลสำเร็จ” หลังจากคลิกยืนยันการลบข้อมูลตำแหน่งของข้าราชการ
</div>
</div>
<div class="col-12" style="margin-top: 50px; margin-left: 10px">
<p>
- กดไอคอน
<q-icon
name="mdi-cloud-upload-outline"
style="margin: 0 5px; color: #01435f"
size="xs"
/>
เพื่อเผยแพร่ข้อมูลระบบปรากฏป้าย “ต้องการเผยแพร่ข้อมูลนี้หรือไม่?”
ดังรูปภาพ
</p>
</div>
<div class="col-12">
<q-img
src="@/assets/manual/02_data/4_Officer/2-48.png"
style="
max-width: 70%;
display: block;
margin: 0 auto;
border-radius: 20px;
margin-top: 20px;
border: 1px solid #97b2de;
"
/>
<div class="text-center text-grey-6" style="margin-top: 20px">
รูปภาพที่ 2 - 48 ป้าย “ต้องการเผยแพร่ข้อมูลนี้หรือไม่?”
</div>
</div>
<div class="col-12" style="margin-top: 50px; margin-left: 10px">
<p>
- กดไอคอน
<q-icon name="mdi-cloud-upload-outline" style="margin: 0 5px; color: #01435f" size="xs" />
เพื่อเผยแพร่ข้อมูลระบบปรากฏป้าย “ต้องการเผยแพร่ข้อมูลนี้หรือไม่?” ดังรูปภาพ
</p>
</div>
<div class="col-12">
<q-img src="@/assets/manual/02_data/4_officer/2-48.png" style="max-width: 70%; display: block; margin: 0 auto; border-radius: 20px; margin-top: 20px; border: 1px solid #97b2de" />
<div class="text-center text-grey-6" style="margin-top: 20px">รูปภาพที่ 2 - 48 ป้าย “ต้องการเผยแพร่ข้อมูลนี้หรือไม่?”</div>
</div>
<div class="col-12" style="margin-top: 50px; margin-left: 10px">
<p>
- เมื่อกดปุ่ม “เผยแพร่” ระบบปรากฏป้าย “เผยแพร่ข้อมูลสำเร็จ” ดังรูปภาพ
และเมื่อกดปุ่ม“ยกเลิก” ระบบจะไม่ทำการเผยแพร่ข้อมูล
</p>
</div>
<div class="col-12">
<q-img
src="@/assets/manual/02_data/4_Officer/2-49.png"
style="
display: block;
margin: 0 auto;
border-radius: 20px;
margin-top: 20px;
"
/>
<div class="text-center text-grey-6" style="margin-top: 20px">
รูปภาพที่ 2 - 49 ป้าย “เผยแพร่ข้อมูลสำเร็จ”
</div>
<div class="col-12" style="margin-top: 50px; margin-left: 10px">
<p>- เมื่อกดปุ่ม “เผยแพร่” ระบบปรากฏป้าย “เผยแพร่ข้อมูลสำเร็จ” ดังรูปภาพ และเมื่อกดปุ่ม“ยกเลิก” ระบบจะไม่ทำการเผยแพร่ข้อมูล</p>
</div>
<div class="col-12">
<q-img src="@/assets/manual/02_data/4_officer/2-49.png" style="display: block; margin: 0 auto; border-radius: 20px; margin-top: 20px" />
<div class="text-center text-grey-6" style="margin-top: 20px">รูปภาพที่ 2 - 49 ป้าย “เผยแพร่ข้อมูลสำเร็จ”</div>
<div
class="col-12"
style="
margin-top: -;
padding: 10px;
background-color: rgb(243, 243, 243);
font-size: 14px;
margin-top: 20px;
border-radius: 5px;
"
>
หมายเลข 1 ระบบแสดงสถานะ “เผยแพร่ข้อมูลสำเร็จ”
หลังจากคลิกเผยแพร่ข้อมูลตำแหน่ง
</div>
</div>
<div class="col-12" style="margin-top: -; padding: 10px; background-color: rgb(243, 243, 243); font-size: 14px; margin-top: 20px; border-radius: 5px">
หมายเลข 1 ระบบแสดงสถานะ “เผยแพร่ข้อมูลสำเร็จ” หลังจากคลิกเผยแพร่ข้อมูลตำแหน่ง
</div>
</div>
<div class="col-12" style="margin-top: 50px; margin-left: 10px">
<p>
- กดไอคอน
<q-icon
name="mdi-history"
style="margin: 0 5px; color: #31ccec"
size="xs"
/>
เพื่อดูประวัติข้อมูลแก้ไข ดังรูปภาพ
ในกรอบสีแดงสามารถกรอกที่ช่องค้นหาเพื่อสืบค้นข้อมูลหรือที่ช่องคอลัมน์สามารถเลือกรายการเพื่อซ่อน
</p>
</div>
<div class="col-12">
<q-img
src="@/assets/manual/02_data/4_Officer/2-50.png"
style="
display: block;
margin: 0 auto;
border-radius: 20px;
margin-top: 20px;
"
/>
<div class="text-center text-grey-6" style="margin-top: 20px">
รูปภาพที่ 2 - 50 หน้าประวัติแก้ไขข้อมูล
</div>
<div class="col-12" style="margin-top: 50px; margin-left: 10px">
<p>
- กดไอคอน
<q-icon name="mdi-history" style="margin: 0 5px; color: #31ccec" size="xs" />
เพื่อดูประวัติข้อมูลแก้ไข ดังรูปภาพ ในกรอบสีแดงสามารถกรอกที่ช่องค้นหาเพื่อสืบค้นข้อมูลหรือที่ช่องคอลัมน์สามารถเลือกรายการเพื่อซ่อน
</p>
</div>
<div class="col-12">
<q-img src="@/assets/manual/02_data/4_officer/2-50.png" style="display: block; margin: 0 auto; border-radius: 20px; margin-top: 20px" />
<div class="text-center text-grey-6" style="margin-top: 20px">รูปภาพที่ 2 - 50 หน้าประวัติแก้ไขข้อมูล</div>
<div
class="col-12"
style="
margin-top: -;
padding: 10px;
background-color: rgb(243, 243, 243);
font-size: 14px;
margin-top: 20px;
border-radius: 5px;
"
>
หมายเลข 1
ช่องสำหรับกรอกข้อมูลเพื่อค้นหาและเลือกคอลัมน์แสดงข้อมูลประวัติแก้ไขชื่อตำแหน่งของข้าราชการที่ทำการกรอกค้นหา
</div>
</div>
</q-card>
<!-- </div>
<div class="col-12" style="margin-top: -; padding: 10px; background-color: rgb(243, 243, 243); font-size: 14px; margin-top: 20px; border-radius: 5px">
หมายเลข 1 ช่องสำหรับกรอกข้อมูลเพื่อค้นหาและเลือกคอลัมน์แสดงข้อมูลประวัติแก้ไขชื่อตำแหน่งของข้าราชการที่ทำการกรอกค้นหา
</div>
</div>
</q-card>
<!-- </div>
</div> -->
</template>

138
src/router/index.ts
View file

@ -1,79 +1,79 @@
import { createRouter, createWebHistory } from "vue-router";
import { createRouter, createWebHistory } from "vue-router"
const MainLayout = () => import("@/views/MainLayout.vue");
const Dashboard = () => import("@/views/Dashboard.vue");
const Error404NotFound = () => import("@/views/Error404NotFound.vue");
const MainLayout = () => import("@/views/MainLayout.vue")
const Dashboard = () => import("@/views/Dashboard.vue")
const Error404NotFound = () => import("@/views/Error404NotFound.vue")
import ModuleManual from "@/modules/01_manual/router";
import ModuleManual from "@/modules/01_manual/router"
// TODO: ใช้หรือไม่?
import keycloak from "@/plugins/keycloak";
import keycloak from "@/plugins/keycloak"
const router = createRouter({
history: createWebHistory(import.meta.env.BASE_URL),
routes: [
{
path: "/",
name: "home",
component: MainLayout,
children: [
{
path: "/",
name: "dashboard",
component: Dashboard,
meta: {
Auth: true,
Key: [7],
Role: "dashboard",
},
},
...ModuleManual,
],
},
/**
* 404 Not Found
* ref: https://router.vuejs.org/guide/essentials/dynamic-matching.html#catch-all-404-not-found-route
*/
{
// path: "/:catchAll(.*)*", // TODO: ใช้ pathMatch แทนตามในเอกสารแนะนำ คงไว้เผื่อจำเป็น
path: "/:pathMatch(.*)*",
component: Error404NotFound,
},
],
history: createWebHistory(import.meta.env.BASE_URL),
routes: [
{
path: "/",
name: "home",
component: MainLayout,
children: [
// {
// path: "/",
// name: "dashboard",
// component: Dashboard,
// meta: {
// Auth: true,
// Key: [7],
// Role: "dashboard",
// },
// },
...ModuleManual,
],
},
/**
* 404 Not Found
* ref: https://router.vuejs.org/guide/essentials/dynamic-matching.html#catch-all-404-not-found-route
*/
{
// path: "/:catchAll(.*)*", // TODO: ใช้ pathMatch แทนตามในเอกสารแนะนำ คงไว้เผื่อจำเป็น
path: "/:pathMatch(.*)*",
component: Error404NotFound,
},
],
scrollBehavior(to, from, savedPosition) {
if (savedPosition) {
return savedPosition;
} else if (to.hash) {
return {
el: to.hash,
behavior: "smooth",
};
}
},
});
scrollBehavior(to, from, savedPosition) {
if (savedPosition) {
return savedPosition
} else if (to.hash) {
return {
el: to.hash,
behavior: "smooth",
}
}
},
})
router.beforeEach((to, from, next) => {
if (to.meta.Auth) {
if (!keycloak.authenticated) {
keycloak.login({
redirectUri: `${window.location.protocol}//${window.location.host}${to.path}`,
locale: "th",
});
} else {
// keycloak.updateToken(60);
const role = keycloak.tokenParsed?.role;
if (role.includes(to.meta.Role)) {
next();
} else {
next({ path: "" });
// next();
}
}
} else {
next();
}
// next();
});
// if (to.meta.Auth) {
// if (!keycloak.authenticated) {
// keycloak.login({
// redirectUri: `${window.location.protocol}//${window.location.host}${to.path}`,
// locale: "th",
// })
// } else {
// // keycloak.updateToken(60);
// const role = keycloak.tokenParsed?.role
// if (role.includes(to.meta.Role)) {
// next()
// } else {
// next({ path: "" })
// // next();
// }
// }
// } else {
// next()
// }
next()
})
export default router;
export default router

1513
src/views/MainLayout.vue
View file

File diff suppressed because it is too large Load diff