ปรับ code โครงสร้าง

src/modules/02_organizationalNew/components/tableTree.vue

@@ -25,10 +25,18 @@ import DialogHistoryPos from "@/modules/02_organizationalNew/components/DialogHi
 import { useOrganizational } from "@/modules/02_organizationalNew/store/organizational";
 import { useCounterMixin } from "@/stores/mixin";
 
+const $q = useQuasar();
+const stroe = useOrganizational();
 const { showLoader, hideLoader, messageError, success, dialogRemove } =
   useCounterMixin();
-const $q = useQuasar();
 
+/** prosp*/
+const nodeTree = defineModel<any>("nodeTree", { required: true });
+const orgLevel = defineModel<number>("orgLevel", { required: true });
+const treeId = defineModel<string>("treeId", { required: true });
+const reqMaster = defineModel<FilterMaster>("reqMaster", { required: true });
+const totalPage = defineModel<number>("totalPage", { required: true });
+const posMaster = defineModel<PosMaster2[]>("posMaster", { required: true });
 const props = defineProps({
   filterKeyword: { type: Function, require: true, default: () => {} },
   fetchDataTable: {
@@ -43,16 +51,9 @@ const props = defineProps({
   },
 });
 
-const modalSort = ref<boolean>(false);
-
-const nodeTree = defineModel<any>("nodeTree", { required: true });
-const orgLevel = defineModel<number>("orgLevel", { required: true });
-const treeId = defineModel<string>("treeId", { required: true });
-const reqMaster = defineModel<FilterMaster>("reqMaster", { required: true });
-const totalPage = defineModel<number>("totalPage", { required: true });
-const posMaster = defineModel<PosMaster2[]>("posMaster", { required: true });
-const stroe = useOrganizational();
+const rowId = ref<string>("");
 const actionType = ref<string>("");
+/** ListMenu Table*/
 const listMenu = ref<ListMenu[]>([
   {
     label: "แก้ไข",
@@ -100,6 +101,7 @@ const document = ref<any>([
   },
 ]);
 
+/** columns*/
 const columns = ref<QTableProps["columns"]>([
   {
     name: "no",
@@ -231,7 +233,11 @@ const columnsExpand = ref<QTableProps["columns"]>([
 ]);
 
 const dialogPosition = ref<boolean>(false);
-const rowId = ref<string>("");
+/**
+ * function  openPopup เพิ่มอัตรากำลัง
+ * @param type ประเภท
+ * @param id id
+ */
 function onClickPosition(type: string, id: string) {
   rowId.value = id;
   actionType.value = type;
@@ -240,11 +246,19 @@ function onClickPosition(type: string, id: string) {
 
 const dialogDetail = ref<boolean>(false);
 const dataDetailPos = ref<DataPosition[]>([]);
+/**
+ * function ดูรายละเอียดประวัติตำแหน่ง
+ * @param data ข้อมูล ประวัติตำแหน่ง
+ */
 function onClickViewDetail(data: DataPosition[]) {
   dialogDetail.value = !dialogDetail.value;
   dataDetailPos.value = data;
 }
 
+/**
+ * function ยืนยันการลบตำแหน่ง
+ * @param id id ตำแหน่ง
+ */
 function onClickDelete(id: string) {
   dialogRemove($q, async () => {
     showLoader();
@@ -263,12 +277,19 @@ function onClickDelete(id: string) {
   });
 }
 
+const modalSort = ref<boolean>(false);
+/** fdunction จัดลำดับตำแหน่ง */
 function onClickSort() {
   modalSort.value = true;
 }
 
 const modalDialogMMove = ref<boolean>(false);
 const typeMove = ref<string>("");
+/**
+ * function openPopup  ย้ายตำแหน่ง
+ * @param id ID ตำแหน่ง
+ * @param type ประเภท [ALL,SINGER]
+ */
 function onClickMovePos(id: string, type: string) {
   modalDialogMMove.value = !modalDialogMMove.value;
   typeMove.value = type;
@@ -276,11 +297,19 @@ function onClickMovePos(id: string, type: string) {
 }
 
 const modalDialogHistoryPos = ref<boolean>(false);
+/**
+ * function ดูประวัติตำแหน่ง
+ * @param id ID ตำแหน่ง
+ */
 function onClickHistoryPos(id: string) {
   modalDialogHistoryPos.value = !modalDialogHistoryPos.value;
   rowId.value = id;
 }
 
+/**
+ * function updatePagination
+ * @param newPagination ข้อมูล Pagination ใหม่
+ */
 function updatePagination(newPagination: NewPagination) {
   reqMaster.value.pageSize = newPagination.rowsPerPage;
   reqMaster.value.page = 1;
@@ -458,9 +487,13 @@ function updatePagination(newPagination: NewPagination) {
                         : null
                     "
                   >
-                    <q-item-section> 
+                    <q-item-section>
                       <div class="row items-center">
-                        <q-icon :color="item.color" size="17px" :name="item.icon" />
+                        <q-icon
+                          :color="item.color"
+                          size="17px"
+                          :name="item.icon"
+                        />
                         <div class="q-pl-md">{{ item.label }}</div>
                       </div>
                     </q-item-section>
@@ -483,17 +516,19 @@ function updatePagination(newPagination: NewPagination) {
                 dense
                 hide-bottom
                 bordered
-                separator="vertical" 
+                separator="vertical"
                 class="custom-header-table-expand"
               >
                 <template v-slot:header="props">
-                  <q-tr :props="props" class=" bg-grey-2">
+                  <q-tr :props="props" class="bg-grey-2">
                     <q-th
                       v-for="col in props.cols"
                       :key="col.name"
                       :props="props"
                     >
-                      <span class="q-px-sm text-body2 text-black">{{ col.label }}</span>
+                      <span class="q-px-sm text-body2 text-black">{{
+                        col.label
+                      }}</span>
                     </q-th>
                   </q-tr>
                 </template>
@@ -503,13 +538,12 @@ function updatePagination(newPagination: NewPagination) {
                       v-for="col in props.cols"
                       :key="col.name"
                       :props="props"
-                      
                     >
-                      <div v-if="col.name == 'no'" class=" text-body2 ">
+                      <div v-if="col.name == 'no'" class="text-body2">
                         {{ props.rowIndex + 1 }}
                       </div>
 
-                      <div v-else class=" text-body2">
+                      <div v-else class="text-body2">
                         {{ col.value }}
                       </div>
                     </q-td>
@@ -569,6 +603,7 @@ function updatePagination(newPagination: NewPagination) {
     :rowId="rowId"
   />
 
+  <!-- ประวัติตำแหน่ง -->
   <DialogHistoryPos v-model:modal="modalDialogHistoryPos" :rowId="rowId" />
 </template>
 
@@ -599,10 +634,9 @@ function updatePagination(newPagination: NewPagination) {
     top: 0;
     padding: 0px;
   }
-  
 }
- .q-table th:last-child, .q-table td:last-child{
+.q-table th:last-child,
+.q-table td:last-child {
   padding: 0px !important;
-  
 }
 </style>