fix ออกคำสั่ง

src/modules/18_command/components/Step/2_ListPersons.vue

@@ -95,8 +95,20 @@ const columns = ref<QTableProps["columns"]>([
       return `${row.prefix ?? ""}${row.firstName ?? ""} ${row.lastName ?? ""}`;
     },
   },
+  {
+    name: "amount",
+    align: "left",
+    label: "เงินเดือน",
+    field: "amount",
+    format(val) {
+      return val ? val.toLocaleString() : "-";
+    },
+    sortable: true,
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
 ]);
-const visibleColumns = ref<String[]>(["no", "citizenId", "fullName"]);
+const visibleColumns = ref<String[]>(["no", "citizenId", "fullName", "amount"]);
 
 const modalSalary = ref<boolean>(false);
 const titleName = ref<string>("");
@@ -221,8 +233,6 @@ async function getCommandSalaryList(type: string) {
     });
 }
 
-function onSubmit() {}
-
 /** ดึงข้อมูล บุคคล */
 async function getPersonList() {
   showLoader();

src/modules/18_command/components/Step/Dialog2_Salary.vue

@@ -7,10 +7,10 @@ import config from "@/app.config";
 import { useCounterMixin } from "@/stores/mixin";
 
 import DialogHeader from "@/components/DialogHeader.vue";
-import CurruncyInput from "@/components/CurruncyInput.vue";
 
 const $q = useQuasar();
-const { dialogConfirm, messageError, success } = useCounterMixin();
+const { showLoader, hideLoader, dialogConfirm, messageError, success } =
+  useCounterMixin();
 
 const props = defineProps({
   getData: Function,
@@ -22,41 +22,53 @@ const commandEditRecive = defineModel<string>("commandEditRecive", {
   required: true,
 });
 
-const formData = reactive({
-  salaryAmount: 0,
-  positionSalaryAmount: 0,
-  monthSalaryAmount: 0,
+const formData = reactive<any>({
+  amount: null,
+  positionSalaryAmount: null,
+  mouthSalaryAmount: null,
   remarkVertical: null,
   remarkHorizontal: null,
 });
 
 function onSubmit() {
   dialogConfirm($q, () => {
+    showLoader();
     http
       .put(config.API.commandEditRecive("tab2", commandEditRecive.value), {
-        mouthSalaryAmount: formData.salaryAmount, //เงินเดือน
-        positionSalaryAmount: formData.positionSalaryAmount, //เงินประจำตำแหน่ง
-        amount: formData.monthSalaryAmount, //เงินค่าตอบแทนรายเดือน
+        mouthSalaryAmount:
+          typeof formData.monthSalaryAmount === "string"
+            ? Number(formData.monthSalaryAmount?.replace(/,/g, ""))
+            : formData.monthSalaryAmount, //เงินเดือน
+        positionSalaryAmount:
+          typeof formData.positionSalaryAmount === "string"
+            ? Number(formData.positionSalaryAmount?.replace(/,/g, ""))
+            : formData.positionSalaryAmount, //เงินประจำตำแหน่ง
+        amount:
+          typeof formData.amount === "string"
+            ? Number(formData.amount?.replace(/,/g, ""))
+            : formData.amount, //เงินค่าตอบแทนรายเดือน
         remarkVertical: formData.remarkVertical, //หมายเหตุแนวตั้ง
         remarkHorizontal: formData.remarkHorizontal, //หมายเหตุแนวนอน
       })
-      .then((res) => {
+      .then(async () => {
+        await props.getData?.();
         success($q, "บันทึกข้อมูลสำเร็จ");
         onClose();
-        props.getData?.();
       })
       .catch((e) => {
         messageError($q, e);
       })
-      .finally(() => {});
+      .finally(() => {
+        hideLoader();
+      });
   });
 }
 
 function onClose() {
   modal.value = false;
-  formData.salaryAmount = 0;
-  formData.positionSalaryAmount = 0;
-  formData.monthSalaryAmount = 0;
+  formData.amount = null;
+  formData.positionSalaryAmount = null;
+  formData.monthSalaryAmount = null;
   formData.remarkVertical = null;
   formData.remarkHorizontal = null;
 }
@@ -67,9 +79,9 @@ watch(
     if (modal.value) {
       if (props.selectPersonData) {
         const list = props.selectPersonData;
-        formData.salaryAmount = list.mouthSalaryAmount;
+        formData.amount = list.amount;
         formData.positionSalaryAmount = list.positionSalaryAmount;
-        formData.monthSalaryAmount = list.amount;
+        formData.monthSalaryAmount = list.mouthSalaryAmount;
         formData.remarkVertical = list.remarkVertical;
         formData.remarkHorizontal = list.remarkHorizontal;
       }
@@ -80,41 +92,76 @@ watch(
 
 <template>
   <q-dialog v-model="modal" persistent>
-    <q-card style="width: 50vw; max-width: 50vw">
+    <q-card style="min-width: 40vw">
       <q-form q-form greedy @submit.prevent @validation-success="onSubmit">
         <DialogHeader :tittle="titleName" :close="onClose" />
         <q-separator />
         <q-card-section>
           <div class="row col-12 q-col-gutter-sm">
             <div class="col-xs-6 col-sm-6 col-md-6">
-              <CurruncyInput
+              <!-- <CurruncyInput
                 :edit="true"
                 :dense="true"
-                v-model="formData.salaryAmount"
+                v-model="formData.amount"
                 :label="`${'เงินเดือน'}`"
                 :rules="[(val: any) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
                 hide-bottom-space
+              /> -->
+
+              <q-input
+                dense
+                outlined
+                lazy-rules
+                hide-bottom-space
+                v-model="formData.amount"
+                class="inputgreen"
+                mask="###,###,###,###,###,###"
+                reverse-fill-mask
+                :label="`${'เงินเดือน'}`"
+                :rules="[(val: any) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
               />
             </div>
 
             <div class="col-xs-6 col-sm-6 col-md-6">
-              <CurruncyInput
+              <q-input
+                dense
+                outlined
+                lazy-rules
+                hide-bottom-space
+                v-model="formData.positionSalaryAmount"
+                class="inputgreen"
+                mask="###,###,###,###,###,###"
+                reverse-fill-mask
+                :label="`${'เงินประจำตำแหน่ง'}`"
+              />
+              <!-- <CurruncyInput
                 :edit="true"
                 :dense="true"
                 v-model="formData.positionSalaryAmount"
                 :label="`${'เงินประจำตำแหน่ง'}`"
                 hide-bottom-space
-              />
+              /> -->
             </div>
 
             <div class="col-xs-6 col-sm-6 col-md-6">
-              <CurruncyInput
+              <q-input
+                dense
+                outlined
+                lazy-rules
+                hide-bottom-space
+                v-model="formData.monthSalaryAmount"
+                class="inputgreen"
+                mask="###,###,###,###,###,###"
+                reverse-fill-mask
+                :label="`${'เงินค่าตอบแทนรายเดือน'}`"
+              />
+              <!-- <CurruncyInput
                 :edit="true"
                 :dense="true"
                 v-model="formData.monthSalaryAmount"
                 :label="`${'เงินค่าตอบแทนรายเดือน'}`"
                 hide-bottom-space
-              />
+              /> -->
             </div>
             <div class="col-xs-6 col-sm-6 col-md-12">
               <q-input
@@ -123,7 +170,7 @@ watch(
                 v-model="formData.remarkVertical"
                 label="หมายเหตุแนวตั้ง"
                 type="textarea"
-                rows="2"
+                rows="5"
                 class="inputgreen"
               />
             </div>
@@ -134,7 +181,7 @@ watch(
                 v-model="formData.remarkHorizontal"
                 type="textarea"
                 label="หมายเหตุแนวนอน"
-                rows="2"
+                rows="5"
                 class="inputgreen"
               />
             </div>