รายการเงินเดือน

src/modules/13_salary/components/SalaryLists/DialogMoveGroup.vue

@@ -6,18 +6,25 @@ import type { DataOption } from "@/modules/13_salary/interface/response/Main";
 import { useQuasar } from "quasar";
 import http from "@/plugins/http";
 
+import { useSalaryListSDataStore } from "@/modules/13_salary/store/SalaryListsStore";
+
 import config from "@/app.config";
 
 const $q = useQuasar();
+const store = useSalaryListSDataStore();
 const modal = defineModel<boolean>("modal", { required: true });
+const profileId = defineModel<string>("profileId", { required: true });
+const props = defineProps({
+  group: { type: String },
+  fetchData: {
+    type: Function,
+  },
+});
+
 const group = ref<string>("");
 const isReadonly = ref<boolean>(false); // อ่านได้อย่างเดียว
 const mixin = useCounterMixin();
-const { dialogConfirm, date2Thai, messageError } = mixin;
-const groupOp = ref<DataOption[]>([
-  { id: "g1", name: "กลุ่ม1" },
-  { id: "g2", name: "กลุ่ม2" },
-]);
+const { dialogConfirm, success, messageError, showLoader, hideLoader } = mixin;
 
 /*** ฟังก์ชั่นสำหรับ validate ฟอร์ม */
 function validateForm() {
@@ -31,20 +38,24 @@ function close() {
 
 function onSubmit() {
   dialogConfirm($q, () => {
+    showLoader();
     const body = {
-      profileId: "????????????????????????????????????????????",
+      profileId: profileId.value,
       groupId: group.value,
     };
     http
       .post(config.API.salaryPeriod() + `/change/group`, body)
-      .then((res) => {
-        modal.value = false;
-        group.value = "";
+      .then(() => {
+        success($q, "บันทึกข้อมูลสำเร็จ");
+        props.fetchData?.();
       })
       .catch((e) => {
         messageError($q, e);
       })
-      .finally(() => {});
+      .finally(() => {
+        hideLoader();
+        close();
+      });
   });
 }
 
@@ -75,7 +86,7 @@ function inputEdit(val: boolean) {
             map-options
             option-label="name"
             option-value="id"
-            :options="groupOp"
+            :options="store.groupOp.filter((e) => e.name !== props.group)"
             :rules="[(val) => !!val || `${'กรุณาเลือกรอบการขึ้นเงินเดือน'}`]"
             lazy-rules
             hide-bottom-space