เลื่อนเงินเดือน => เพิ่ม remark

src/modules/13_salary/components/SalaryEmployeeLists/DialogMoveLevel.vue

@@ -23,12 +23,14 @@ const profileId = defineModel<string>("profileId", { required: true });
 const props = defineProps({
   typeLevel: { type: String, required: true },
   isReserve: { type: Boolean, required: true },
+  remark: { type: String, required: true },
   fetchData: {
     type: Function,
   },
 });
 
 const type = ref<string>("");
+const note = ref<string>("");
 const typeRef = ref<any>(null);
 const isReadonly = ref<boolean>(false); // อ่านได้อย่างเดียว
 const isChange = ref<boolean>(false); // มีการแก้ไขข้อมูลหรือไม่
@@ -75,6 +77,7 @@ function onSubmit() {
       profileId: profileId.value,
       type: type.value,
       isReserve: isReserve.value,
+      remark: type.value === "NONE" ? note.value : undefined,
     };
     http
       .post(config.API.salaryPeriodEmp() + `/change/type`, body)
@@ -92,10 +95,15 @@ function onSubmit() {
   });
 }
 
+function chengType() {
+  note.value = props.typeLevel === "NONE" ? props.remark : "";
+}
+
 watch(
   () => modal.value,
   () => {
     type.value = props.typeLevel == "PENDING" ? "" : props.typeLevel;
+    note.value = props.typeLevel === "NONE" ? props.remark : "";
     isReserve.value = props.isReserve;
     isChange.value = false;
   }
@@ -132,7 +140,7 @@ function inputEdit(val: boolean) {
             :rules="[(val) => !!val || `${'กรุณาเลือก ขั้น'}`]"
             lazy-rules
             hide-bottom-space
-            @update:model-value="isChange = true"
+            @update:model-value="(isChange = true), chengType()"
           />
           <!-- :options="typeRangeOps.filter((e) => e.id !== store.tabType)" -->
 
@@ -144,6 +152,17 @@ function inputEdit(val: boolean) {
             v-model="isReserve"
             @update:model-value="isChange = true"
           />
+
+          <q-input
+            v-if="type === 'NONE'"
+            :class="inputEdit(isReadonly)"
+            outlined
+            dense
+            v-model="note"
+            label="หมายเหตุ"
+            type="textarea"
+            @update:model-value="isChange = true"
+          />
         </div>
       </q-card-section>
       <q-separator />

src/modules/13_salary/components/SalaryEmployeeLists/TabMain.vue

@@ -541,6 +541,7 @@ const updateIsShowRetire = async () => {
                   v-model:formFilter="formFilter"
                   :fetchDataTable="fetchDataPeriodNew"
                   :total="total"
+                  :type="item.type"
                 />
               </q-tab-panel>
             </q-tab-panels>

src/modules/13_salary/components/SalaryEmployeeLists/TableTypeOther.vue

@@ -36,10 +36,14 @@ const props = defineProps({
   total: {
     type: Number,
   },
+  type: {
+    type: String,
+    requird: true,
+  },
 });
 
 /** ข้อมูล Table*/
-const columns = ref<QTableProps["columns"]>([
+const baseColumns = ref<QTableProps["columns"]>([
   {
     name: "no",
     align: "left",
@@ -152,6 +156,15 @@ const columns = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
+  {
+    name: "remark",
+    align: "center",
+    label: "หมายเหตุ",
+    sortable: false,
+    field: "remark",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
 ]);
 
 const visibleColumns = ref<string[]>([
@@ -167,8 +180,18 @@ const visibleColumns = ref<string[]>([
   "amountUse",
   "positionSalaryAmount",
   "isRetired",
+  "remark",
 ]);
 
+const columns = computed(() => {
+  if (props.type !== "NONE") {
+    if (baseColumns.value) {
+      return baseColumns.value.filter((column) => column.name !== "remark");
+    }
+  }
+  return baseColumns.value;
+});
+
 /** modalDialog*/
 const modalDialogAddPerson = ref<boolean>(false);
 const modalDialogForm = ref<boolean>(false);
@@ -207,16 +230,24 @@ function onClickMovieGroup(id: string) {
 
 const typeLevel = ref<string>("");
 const isReserve = ref<boolean>(false);
+const remark = ref<string>("");
+
 /**
  * function openPopup ย้ายกขั้น
  * @param id profileId
  *
  */
-function onClickMoveLevel(id: string, typeVal: string, isReserveVal: boolean) {
+function onClickMoveLevel(
+  id: string,
+  typeVal: string,
+  isReserveVal: boolean,
+  remarkVal: string = ""
+) {
   profileId.value = id;
   modalDialogMoveLeve.value = !modalDialogMoveLeve.value;
   typeLevel.value = typeVal;
   isReserve.value = isReserveVal;
+  remark.value = typeVal === "NONE" ? remarkVal : "";
 }
 
 /**
@@ -306,7 +337,7 @@ watch(
         store.roundMainCode === 'OCT'
           ? columns
           : columns
-          ? columns.slice(0, 11)
+          ? columns.filter((e) => e.name !== 'isRetired')
           : []
       "
       option-value="name"
@@ -322,7 +353,7 @@ watch(
       store.roundMainCode === 'OCT'
         ? columns
         : columns
-        ? columns.slice(0, 11)
+        ? columns.filter((e) => e.name !== 'isRetired')
         : []
     "
     :rows="props.rows"
@@ -416,7 +447,7 @@ watch(
             />
           </div>
 
-          <div v-else>
+          <div v-else class="table_ellipsis2">
             {{ col.value ? col.value : "-" }}
           </div>
         </q-td>
@@ -446,7 +477,8 @@ watch(
                       ? onClickMoveLevel(
                           props.row.id,
                           props.row.type,
-                          props.row.isReserve
+                          props.row.isReserve,
+                          props.row.remark
                         )
                       : item.type === 'delete'
                       ? onClickDelete(props.row.id)
@@ -510,6 +542,7 @@ watch(
     v-model:profileId="profileId"
     :fetchData="props.fetchDataTable"
     :type="store.tabType"
+    :remark="remark"
   />
 </template>