Refactoring code module 11_discipline

src/modules/11_discipline/components/6_BasicInformation/Channel/MainPage.vue

@@ -1,27 +1,30 @@
 <script setup lang="ts">
-import { ref, useAttrs, onMounted } from "vue";
+import { ref, onMounted } from "vue";
 import router from "@/router";
-import { useCounterMixin } from "@/stores/mixin";
-import { useQuasar } from "quasar";
-import { useDisciplineChannelDataStore } from "@/modules/11_discipline/store/ChannelStore";
+
 import config from "@/app.config";
 import http from "@/plugins/http";
+import { useQuasar } from "quasar";
+import { useCounterMixin } from "@/stores/mixin";
+
+import { useDisciplineChannelDataStore } from "@/modules/11_discipline/store/ChannelStore";
+
 import type { typeItem } from "@/modules/11_discipline/interface/response/channel";
 
 import { checkPermission } from "@/utils/permissions";
 import Header from "@/components/DialogHeader.vue";
 
+const $q = useQuasar(); //ใช้ noti quasar
+const dataStore = useDisciplineChannelDataStore();
+const mixin = useCounterMixin();
+const { dialogRemove, showLoader, messageError, hideLoader, success } = mixin;
+
 const modal = ref<boolean>(false);
 const isEdit = ref<boolean>(false);
 const isRead = ref<boolean>(false);
 const isId = ref<string>("");
 const channel = ref<string>("");
 
-const dataStore = useDisciplineChannelDataStore();
-const mixin = useCounterMixin();
-const { dialogRemove, showLoader, messageError, hideLoader, success } = mixin;
-const $q = useQuasar(); //ใช้ noti quasar
-
 /**
  * ค้นหาในตาราง
  */
@@ -38,7 +41,6 @@ const resetFilter = () => {
  *pagination ของตาราง
  */
 const pagination = ref({
-  // sortBy: "desc",
   descending: false,
   page: 1,
   rowsPerPage: 10,
@@ -114,15 +116,7 @@ async function deleteData(id: string) {
     });
 }
 
-/**
- * ไปหน้า แก้ไข
- * @param id type
- */
-function editPage(data: typeItem) {
-  dataStore.getType(data.name);
-  router.push(`/discipline/channel/${data.id}`);
-}
-
+/** ปิด popup */
 function closeDialog() {
   modal.value = false;
   channel.value = "";
@@ -130,6 +124,7 @@ function closeDialog() {
   isRead.value = false;
 }
 
+/** class input */
 function inputEdit(val: boolean) {
   return {
     "full-width cursor-pointer ": val,
@@ -137,6 +132,7 @@ function inputEdit(val: boolean) {
   };
 }
 
+/** บันทึกช่องทางการร้องเรียน */
 function onSubmit() {
   const url = isEdit.value
     ? config.API.complaintChannelbyId(isId.value)

src/modules/11_discipline/components/6_BasicInformation/Director/AddPage.vue

@@ -1,10 +1,12 @@
 <script setup lang="ts">
 import Form from "@/modules/11_discipline/components/6_BasicInformation/Director/Form.vue";
-import { useCounterMixin } from "@/stores/mixin";
-import { useRoute, useRouter } from "vue-router";
+import { useRouter } from "vue-router";
+import { useQuasar } from "quasar";
+
 import http from "@/plugins/http";
 import config from "@/app.config";
-import { useQuasar } from "quasar";
+import { useCounterMixin } from "@/stores/mixin";
+
 import type { FormDataPost } from "@/modules/11_discipline/interface/request/director";
 
 const $q = useQuasar();

src/modules/11_discipline/components/6_BasicInformation/Director/DialogEdit.vue

@@ -1,19 +1,20 @@
 <script setup lang="ts">
-import { ref, reactive, watch, onMounted } from "vue";
+import { ref, reactive, watch } from "vue";
 import { useQuasar } from "quasar";
-import type { FormData } from "@/modules/11_discipline/interface/request/director";
-import { useCounterMixin } from "@/stores/mixin";
 
 import http from "@/plugins/http";
 import config from "@/app.config";
+import { useCounterMixin } from "@/stores/mixin";
+
+import type { FormData } from "@/modules/11_discipline/interface/request/director";
 
 import Header from "@/components/DialogHeader.vue";
 
 const $q = useQuasar();
 const mixin = useCounterMixin();
-const { dialogConfirm, success, showLoader, hideLoader, messageError } = mixin;
-const isReadonly = ref<boolean>(false);
+const { success, showLoader, hideLoader, messageError } = mixin;
 
+const isReadonly = ref<boolean>(false);
 const modal = defineModel<boolean>("modal", { required: true });
 const personalId = defineModel<string>("personalId", { required: true });
 const isEdit = defineModel<boolean>("isEdit", { required: true });
@@ -21,6 +22,7 @@ const isEdit = defineModel<boolean>("isEdit", { required: true });
 const props = defineProps({
   getList: Function,
 });
+
 const data = reactive<FormData>({
   personalId: "",
   prefix: "",
@@ -39,6 +41,7 @@ function inputEdit(val: boolean) {
   };
 }
 
+/** ปิด popup เเละ clear */
 function closeDialog() {
   modal.value = false;
   personalId.value = "";
@@ -52,6 +55,7 @@ function closeDialog() {
   data.qualification = "";
 }
 
+/** บันทึก กรรมการ */
 function onSubmit() {
   showLoader();
   http

src/modules/11_discipline/components/6_BasicInformation/Director/DialogInvestigateTotal.vue

@@ -1,18 +1,14 @@
 <script setup lang="ts">
-import {
-  ref,
-  computed,
-  watchEffect,
-  watch,
-  type PropType,
-  onMounted,
-} from "vue";
+import { ref, watch } from "vue";
 import { QForm, useQuasar } from "quasar";
-import { useCounterMixin } from "@/stores/mixin";
-import type { DirectorRowsResponse } from "@/modules/11_discipline/interface/response/director";
-import DialogHeader from "@/components/DialogHeader.vue";
+
 import config from "@/app.config";
 import http from "@/plugins/http";
+import { useCounterMixin } from "@/stores/mixin";
+
+import type { DirectorRowsResponse } from "@/modules/11_discipline/interface/response/director";
+
+import DialogHeader from "@/components/DialogHeader.vue";
 
 const $q = useQuasar();
 const mixin = useCounterMixin();

src/modules/11_discipline/components/6_BasicInformation/Director/EditPage.vue

@@ -1,17 +1,20 @@
 <script setup lang="ts">
 import { ref, onMounted, reactive } from "vue";
-import Form from "@/modules/11_discipline/components/6_BasicInformation/Director/Form.vue";
-import type { FormData } from "@/modules/11_discipline/interface/request/director";
-import { useCounterMixin } from "@/stores/mixin";
-import { useQuasar } from "quasar";
 import { useRoute } from "vue-router";
-import router from "@/router";
+import { useQuasar } from "quasar";
+
 import http from "@/plugins/http";
 import config from "@/app.config";
+import router from "@/router";
+import { useCounterMixin } from "@/stores/mixin";
 
+import type { FormData } from "@/modules/11_discipline/interface/request/director";
+
+import Form from "@/modules/11_discipline/components/6_BasicInformation/Director/Form.vue";
+
+const $q = useQuasar();
 const route = useRoute();
 const personalId = ref<string>(route.params.id.toString());
-const $q = useQuasar();
 const mixin = useCounterMixin();
 const { messageError, showLoader, hideLoader, dialogConfirm, success } = mixin;
 

src/modules/11_discipline/components/6_BasicInformation/Director/Form.vue

@@ -1,8 +1,12 @@
 <script setup lang="ts">
 import { ref, reactive, watch } from "vue";
-import { useCounterMixin } from "@/stores/mixin";
 import { useQuasar } from "quasar";
 import type { QTableProps } from "quasar";
+
+import http from "@/plugins/http";
+import config from "@/app.config";
+import { useCounterMixin } from "@/stores/mixin";
+
 import type {
   FormData,
   FormRef,
@@ -10,8 +14,6 @@ import type {
   ResponsePreson,
   tableType,
 } from "@/modules/11_discipline/interface/request/director";
-import http from "@/plugins/http";
-import config from "@/app.config";
 
 import PopupPersonal from "@/components/Dialogs/PopupPersonalNew.vue";
 
@@ -142,12 +144,8 @@ const columnsRespondent = ref<QTableProps["columns"]>([
 const visibleColumnsRespondent = ref<string[]>([
   "info",
   "no",
-  // "idcard",
   "name",
-  // "posNo",
   "position",
-  // "positionLevel",
-  // "salary",
   "organization",
 ]);
 
@@ -168,6 +166,7 @@ function onValidate() {
   }
 }
 
+/** class input */
 function inputEdit(val: boolean) {
   return {
     "full-width cursor-pointer ": val,
@@ -180,6 +179,7 @@ function updateSelect() {
   search.value = "";
 }
 
+/** ค้าหาข้อมูล */
 async function searchInput() {
   searchRef.value.validate();
   if (!searchRef.value.hasError) {
@@ -187,6 +187,7 @@ async function searchInput() {
   }
 }
 
+/** ดึงข้อมูล */
 async function getSearch() {
   showLoader();
   const body = {
@@ -233,6 +234,7 @@ async function getSearch() {
     });
 }
 
+/** เก็บข้อมูลลงตัวแปร */
 function returnDetail(data: ResponsePreson) {
   formData.prefix = data.prefix;
   formData.firstname = data.firstName;
@@ -392,10 +394,6 @@ watch(
                         }}
                       </div>
                       <div v-else-if="col.name == 'info'">
-                        <!-- <router-link
-                          target="_blank"
-                          :to="`/registry/${props.row.personId}`"
-                          > -->
                         <q-btn
                           dense
                           flat
@@ -417,7 +415,6 @@ watch(
               </d-table>
             </div>
           </div>
-          <!-- <div class="col-12"><q-separator /></div> -->
 
           <div class="col-3">
             <q-input

src/modules/11_discipline/components/6_BasicInformation/Director/MainPage.vue

@@ -1,14 +1,16 @@
 <script setup lang="ts">
-import { ref, useAttrs, onMounted, watch } from "vue";
-import { useCounterMixin } from "@/stores/mixin";
+import { ref, onMounted, watch } from "vue";
 import { useQuasar } from "quasar";
-import { useDisciplineDirectorDataStore } from "@/modules/11_discipline/store/DirectorStore";
+
 import config from "@/app.config";
 import http from "@/plugins/http";
-import DialogTotal from "@/modules/11_discipline/components/6_BasicInformation/Director/DialogInvestigateTotal.vue";
+import { checkPermission } from "@/utils/permissions";
+import { useCounterMixin } from "@/stores/mixin";
+import { useDisciplineDirectorDataStore } from "@/modules/11_discipline/store/DirectorStore";
+
 import type { DirectorRowsResponse } from "@/modules/11_discipline/interface/response/director";
 
-import { checkPermission } from "@/utils/permissions";
+import DialogTotal from "@/modules/11_discipline/components/6_BasicInformation/Director/DialogInvestigateTotal.vue";
 import DialogEdit from "@/modules/11_discipline/components/6_BasicInformation/Director/DialogEdit.vue";
 
 const $q = useQuasar();
@@ -44,22 +46,6 @@ const pagination = ref({
   rowsPerPage: rowsPerPage.value,
 });
 
-watch(
-  () => currentPage.value,
-  () => {
-    rowsPerPage.value = pagination.value.rowsPerPage;
-    getList();
-  }
-);
-
-watch(
-  () => pagination.value.rowsPerPage,
-  () => {
-    rowsPerPage.value = pagination.value.rowsPerPage;
-    currentPage.value = 1;
-    getList();
-  }
-);
 async function getList() {
   showLoader();
   await http
@@ -144,6 +130,23 @@ function onEdit(id: string, check: boolean) {
   isEdit.value = check;
 }
 
+watch(
+  () => currentPage.value,
+  () => {
+    rowsPerPage.value = pagination.value.rowsPerPage;
+    getList();
+  }
+);
+
+watch(
+  () => pagination.value.rowsPerPage,
+  () => {
+    rowsPerPage.value = pagination.value.rowsPerPage;
+    currentPage.value = 1;
+    getList();
+  }
+);
+
 /**เมื่อเริ่มโหลดหน้า
  * ส่งข้อมูลจำลองไปยัง store
  */