แก้ไขทะเบียนประวัติ ตำแหน่ง/เงินเดือน

src/modules/04_registryPerson/views/edit/components/DialogEdit.vue

@@ -0,0 +1,102 @@
+<script setup lang="ts">
+import { ref, watch } from "vue";
+import { useQuasar } from "quasar";
+
+import { useCounterMixin } from "@/stores/mixin";
+import { useRoute } from "vue-router";
+import http from "@/plugins/http";
+import config from "@/app.config";
+
+import DialogHeader from "@/components/DialogHeader.vue";
+
+const $q = useQuasar();
+const route = useRoute();
+const {
+  dialogConfirm,
+  showLoader,
+  hideLoader,
+  messageError,
+  success,
+  convertDateToAPI,
+} = useCounterMixin();
+
+const profileId = ref<string>(route.params.id.toString());
+
+const modal = defineModel<boolean>("modal", { required: true });
+const empType = defineModel<string>("empType", { required: true });
+
+const props = defineProps({
+  fetchData: { type: Function, required: true },
+});
+
+const remark = ref<string>("");
+
+function onClickCloseDialog() {
+  modal.value = false;
+}
+
+function onSubmit() {
+  dialogConfirm($q, async () => {
+    showLoader();
+    await http
+      .patch(config.API.salaryTemp + `/return-edit/${profileId.value}`, {
+        detailForEdit: remark.value,
+      })
+      .then(async () => {
+        await props.fetchData?.();
+        success($q, "บันทึกข้อมูลสำเร็จ");
+        onClickCloseDialog();
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
+watch(modal, async (val) => {
+  if (val) {
+  } else {
+    remark.value = "";
+  }
+});
+</script>
+
+<template>
+  <q-dialog v-model="modal" persistent>
+    <q-card style="min-width: 40%">
+      <q-form greedy @submit.prevent @validation-success="onSubmit">
+        <DialogHeader :tittle="'ตีกลับให้แก้ไข'" :close="onClickCloseDialog" />
+        <q-separator />
+
+        <q-card-section>
+          <div class="row">
+            <div class="col-12">
+              <q-input
+                class="inputgreen"
+                outlined
+                dense
+                borderless
+                v-model="remark"
+                :label="`${'รายละเอียดการแก้ไข'}`"
+                type="textarea"
+              />
+            </div>
+          </div>
+        </q-card-section>
+
+        <q-separator />
+
+        <q-card-actions align="right">
+          <q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
+            <q-tooltip>บันทึกข้อมูล</q-tooltip>
+          </q-btn>
+        </q-card-actions>
+      </q-form>
+    </q-card>
+  </q-dialog>
+</template>
+
+<style scoped></style>