Merge branch 'nice_dev' into develop

2024-01-29 11:20:02 +07:00 · 2024-01-29 11:20:02 +07:00 · 0ca406eb04
commit 0ca406eb04
parent 81a773db1d 8c1bfb7a75
6 changed files with 237 additions and 111 deletions
--- a/src/modules/02_organizationalNew/components/DialogFormAgency.vue
+++ b/src/modules/02_organizationalNew/components/DialogFormAgency.vue
@ -9,6 +9,7 @@ import type {
  DataOption,
 } from "@/modules/02_organizationalNew/interface/index/Main";

+const level = defineModel<string>("orgLevel", { required: true });
 const props = defineProps({
  modal: Boolean,
  close: Function,
@ -18,35 +19,46 @@ const $q = useQuasar();
 const mixin = useCounterMixin();
 const { dialogConfirm } = mixin;

-const ocLevelOp = ref<DataOption[]>([]);
+const orgLevelOptionMain = ref<DataOption[]>([
+  { name: "ระดับสำนัก", id: "DEPARTMENT" },
+  {
+    name: "ระดับกอง/สำนักงาน/ส่วนราชการ/โรงพยาบาล/เทียบเท่ากอง",
+    id: "OFFICE",
+  },
+  { name: "ระดับส่วน/กลุ่มภารกิจ", id: "DIVISION" },
+  { name: "ระดับฝ่าย/กลุ่มงาน", id: "SECTION" },
+]);

-const ocNameRef = ref<Object | null>(null);
-const shortNameRef = ref<Object | null>(null);
-const ocNoRef = ref<Object | null>(null);
-const ocLevelRef = ref<Object | null>(null);
-const telOutRef = ref<Object | null>(null);
-const telInRef = ref<Object | null>(null);
-const telRef = ref<Object | null>(null);
+const orgLevelOption = ref<DataOption[]>([]);
+
+const orgNameRef = ref<Object | null>(null);
+const orgShortNameRef = ref<Object | null>(null);
+const orgCodeRef = ref<Object | null>(null);
+const orgPhoneExRef = ref<Object | null>(null);
+const orgPhoneInRef = ref<Object | null>(null);
+const orgFaxRef = ref<Object | null>(null);
+const orgLevelRef = ref<Object | null>(null);

 const formData = reactive<FormDataAgency>({
-  ocName: "",
-  shortName: "",
-  ocNo: "",
-  ocLevel: "",
-  telOut: "",
-  telIn: "",
-  tel: "",
+  orgName: "",
+  orgShortName: "",
+  orgCode: "",
+  orgPhoneEx: "",
+  orgPhoneIn: "",
+  orgFax: "",
+  orgRevisionId: "",
+  orgLevel: "",
 });

 /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
 const objectComplaintsRef: FormAgencyRef = {
-  ocName: ocNameRef,
-  shortName: shortNameRef,
-  ocNo: ocNoRef,
-  ocLevel: ocLevelRef,
-  telOut: telOutRef,
-  telIn: telInRef,
-  tel: telRef,
+  orgName: orgNameRef,
+  orgShortName: orgShortNameRef,
+  orgCode: orgCodeRef,
+  orgPhoneEx: orgPhoneExRef,
+  orgPhoneIn: orgPhoneInRef,
+  orgFax: orgFaxRef,
+  orgLevel: orgLevelRef,
 };

 /** ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม */
@ -70,7 +82,7 @@ function validateForm() {
 /** ฟังชั่น บันทึก */
 function onSubmit() {
  dialogConfirm($q, () => {
-    console.log(formData)
+    console.log(formData);
  });
 }

@ -78,16 +90,13 @@ watch(
  () => props.modal,
  () => {
    if (props.modal === true) {
-      ocLevelOp.value = [
-        {
-          id: "id1",
-          name: "id1",
-        },
-        {
-          id: "id2",
-          name: "id2",
-        },
-      ];
+      if (level.value === "DEPARTMENT") {
+        formData.orgLevel = level.value;
+        orgLevelOption.value = orgLevelOptionMain.value;
+      } else {
+        orgLevelOption.value = orgLevelOptionMain.value.splice(1, 4);
+        formData.orgLevel = "";
+      }
    }
  }
 );
@ -104,8 +113,8 @@ watch(
            <div class="row q-col-gutter-sm">
              <div class="col-4">
                <q-input
-                  v-model="formData.ocName"
-                  ref="ocNameRef"
+                  v-model="formData.orgName"
+                  ref="orgNameRef"
                  dense
                  outlined
                  for="#ocName"
@ -116,8 +125,8 @@ watch(
              </div>
              <div class="col-2">
                <q-input
-                  v-model="formData.shortName"
-                  ref="shortNameRef"
+                  v-model="formData.orgShortName"
+                  ref="orgShortNameRef"
                  dense
                  outlined
                  for="#shortName"
@ -128,8 +137,8 @@ watch(
              </div>
              <div class="col-2">
                <q-input
-                  v-model="formData.ocNo"
-                  ref="ocNoRef"
+                  v-model="formData.orgCode"
+                  ref="orgCodeRef"
                  dense
                  outlined
                  for="#ocNo"
@ -140,8 +149,9 @@ watch(
              </div>
              <div class="col-4">
                <q-select
+                  :readonly="level === 'DEPARTMENT'"
                  for="#ocLevel"
-                  ref="ocLevelRef"
+                  ref="orgLevelRef"
                  dense
                  hide-bottom-space
                  outlined
@ -149,8 +159,8 @@ watch(
                  option-value="id"
                  emit-value
                  map-options
-                  v-model="formData.ocLevel"
-                  :options="ocLevelOp"
+                  v-model="formData.orgLevel"
+                  :options="orgLevelOption"
                  label="ระดับของหน่วยงาน"
                  :rules="[(val) => !!val || `${'กรุณาเลือกระดับของหน่วยงาน'}`]"
                  lazy-rules
@ -158,8 +168,8 @@ watch(
              </div>
              <div class="col-4">
                <q-input
-                  v-model="formData.telOut"
-                  ref="telOutRef"
+                  v-model="formData.orgPhoneEx"
+                  ref="orgPhoneExRef"
                  dense
                  outlined
                  for="#telOut"
@ -174,8 +184,8 @@ watch(
              </div>
              <div class="col-4">
                <q-input
-                  v-model="formData.telIn"
-                  ref="telInRef"
+                  v-model="formData.orgPhoneIn"
+                  ref="orgPhoneInRef"
                  dense
                  outlined
                  for="#telIn"
@ -189,8 +199,8 @@ watch(
              </div>
              <div class="col-4">
                <q-input
-                  v-model="formData.tel"
-                  ref="telRef"
+                  v-model="formData.orgFax"
+                  ref="orgFaxRef"
                  dense
                  outlined
                  for="#tel"
--- a/src/modules/02_organizationalNew/components/DialogNewStructure.vue
+++ b/src/modules/02_organizationalNew/components/DialogNewStructure.vue
@ -10,6 +10,7 @@ import type {
  FormDataNewStructure,
  FormNewStructureRef,
  DataOption,
+  HistoryType,
 } from "@/modules/02_organizationalNew/interface/index/Main";

 import { useCounterMixin } from "@/stores/mixin";
@ -22,6 +23,7 @@ const { dialogConfirm, showLoader, success, hideLoader, messageError } =

 const modal = defineModel<boolean>("newStructure", { required: true });
 const status = defineModel<boolean>("status", { required: true });
+const type = defineModel<string>("type", { default: "NEW" });

 const typeOp = ref<DataOption[]>([
  {
@ -41,19 +43,25 @@ const typeOp = ref<DataOption[]>([
    name: "ทำสำเนาโครงสร้าง ตำแหน่ง และคนครอง",
  },
 ]);
+const orgRevisionId = ref<string>("");
+const orgRevisionOpMain = ref<DataOption[]>([]);
+const orgRevisionOp = ref<DataOption[]>([]);

 const orgRevisionNameRef = ref<Object | null>(null);
 const typeRef = ref<Object | null>(null);
+const orgRevisionIdRef = ref<Object | null>(null);

 const formData = reactive<FormDataNewStructure>({
+  orgRevisionId: "",
  orgRevisionName: "",
-  type: "",
+  typeDraft: "",
 });

 /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
 const objectRef: FormNewStructureRef = {
  orgRevisionName: orgRevisionNameRef,
  type: typeRef,
+  orgRevisionId: orgRevisionIdRef,
 };

 /** ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม */
@ -77,31 +85,75 @@ function validateForm() {
 /** ฟังชั่น บันทึก */
 function onSubmit() {
  dialogConfirm($q, () => {
-    // http
-    //   .post(config.API.createOrganization, formData)
-    //   .then(() => {
-    status.value = true;
-    store.typeOrganizational = "draft";
-    success($q, "บันทึกข้อมูลสำเร็จ");
-    // })
-    // .catch((err) => {
-    //   messageError($q, err);
-    // })
-    // .finally(() => {});
-
-    console.log(formData);
+    showLoader();
+    http
+      .post(config.API.createOrganization, formData)
+      .then(() => {
+        status.value = true;
+        store.typeOrganizational = "draft";
+        success($q, "บันทึกข้อมูลสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(async () => {
+        modal.value = await false;
+        await close();
+        await hideLoader();
+      });
  });
-  modal.value = false;
 }

 function close() {
  modal.value = false;
+  formData.orgRevisionId = "";
+  formData.orgRevisionName = "";
+  formData.typeDraft = "";
+}
+
+async function fetchOrgRevision() {
+  showLoader();
+  await http
+    .get(config.API.organizationHistoryNew)
+    .then((res) => {
+      const data = res.data.result.filter(
+        (e: HistoryType) => e.orgRevisionIsDraft === false
+      );
+      if (data) {
+        const listOption = data.map((e: HistoryType) => ({
+          id: e.orgRevisionId,
+          name: e.orgRevisionName,
+        }));
+        orgRevisionOpMain.value = listOption;
+      }
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+}
+
+function filterSelector(val: any, update: Function, refData: string) {
+  switch (refData) {
+    case "orgRevisionId":
+      update(() => {
+        orgRevisionOp.value = orgRevisionOpMain.value.filter(
+          (v: DataOption) => v.name.indexOf(val) > -1
+        );
+      });
+      break;
+    default:
+      break;
+  }
 }

 watch(
  () => modal.value,
  () => {
-    modal.value && !status.value && (formData.type = "NEW");
+    modal.value && (formData.typeDraft = type.value);
+    modal.value && type.value !== "NEW" && fetchOrgRevision();
  }
 );
 </script>
@ -131,7 +183,7 @@ watch(
                <q-select
                  for="#type"
                  ref="typeRef"
-                  :readonly="!status"
+                  readonly
                  dense
                  hide-bottom-space
                  outlined
@ -139,13 +191,43 @@ watch(
                  option-value="id"
                  emit-value
                  map-options
-                  v-model="formData.type"
+                  v-model="formData.typeDraft"
                  :options="typeOp"
                  label="ประเภทการโคลน"
                  :rules="[(val) => !!val || `${'กรุณาเลือกประเภทการโคลน'}`]"
                  lazy-rules
                />
              </div>
+              <div class="col-6" v-if="type !== 'NEW'">
+                <q-select
+                  for="#orgRevisionId"
+                  ref="orgRevisionIdRef"
+                  dense
+                  hide-bottom-space
+                  outlined
+                  option-label="name"
+                  option-value="id"
+                  emit-value
+                  map-options
+                  v-model="formData.orgRevisionId"
+                  :options="orgRevisionOp"
+                  label="เลือกโครงสร้าง"
+                  :rules="[(val) => !!val || `${'กรุณาเลือกโครงการสร้าง'}`]"
+                  lazy-rules
+                  use-input
+                  @filter="(inputValue:any,
+                  doneFn:Function) => filterSelector(inputValue, doneFn,'orgRevisionId'
+                  ) "
+                >
+                  <template v-slot:no-option>
+                    <q-item>
+                      <q-item-section class="text-grey-5">
+                        ไม่พบข้อมูล
+                      </q-item-section>
+                    </q-item>
+                  </template>
+                </q-select>
+              </div>
            </div>
          </q-card-section>
          <q-separator />
--- a/src/modules/02_organizationalNew/components/mainTree.vue
+++ b/src/modules/02_organizationalNew/components/mainTree.vue
@ -64,6 +64,7 @@ const expanded = ref<Array<any>>([]);
 const notFound = ref<string>("ไม่พบข้อมูลที่ค้นหา");
 const noData = ref<string>("ไม่มีข้อมูล");
 const selected = ref("");
+const orgLevel = ref<string>("");

 const filterData = (node: any, filter: string) => {
  // ให้ทาง API ค้นหาให้
@ -225,8 +226,9 @@ function searchAndReplace(
 }

 const dialogAgency = ref<boolean>(false);
-function onClickAgency() {
+function onClickAgency(level: string) {
  dialogAgency.value = !dialogAgency.value;
+  orgLevel.value = level;
 }

 watch(
@ -277,7 +279,7 @@ onMounted(async () => {
            round
            color="primary"
            icon="add"
-            @click="onClickAgency"
+            @click="onClickAgency('DEPARTMENT')"
          >
            <q-tooltip>เพิ่มหน่วยงาน</q-tooltip>
          </q-btn>
@ -347,6 +349,8 @@ onMounted(async () => {
                    @click="
                      item.val === 'EDIT'
                        ? edit(prop.node.organizationId)
+                        : item.val === 'ADD'
+                        ? onClickAgency('TEST')
                        : null
                    "
                  >
@ -370,7 +374,12 @@ onMounted(async () => {
    </div>
  </div>

-  <DialogAgency :modal="dialogAgency" :close="onClickAgency" />
+  <!-- เพิ่มหน่วยงาน -->
+  <DialogAgency
+    :modal="dialogAgency"
+    :close="onClickAgency"
+    v-model:orgLevel="orgLevel"
+  />
 </template>

 <style scoped></style>
--- a/src/modules/02_organizationalNew/interface/index/Main.ts
+++ b/src/modules/02_organizationalNew/interface/index/Main.ts
@ -8,36 +8,37 @@ interface DataOption {
 }

 interface FormDataAgency {
-  ocName: string
-  shortName: string
-  ocNo: string
-  ocLevel: string
-  telOut: string
-  telIn: string
-  tel: string
+  orgName: string;
+  orgShortName: string;
+  orgCode: string;
+  orgPhoneEx: string;
+  orgPhoneIn: string;
+  orgFax: string;
+  orgRevisionId: string;
+  orgLevel: string;
 }

 interface FormDataPosition {
-  prefixNo: string
-  positionNo: string
-  suffixNo: string
-  confirm: boolean
+  prefixNo: string;
+  positionNo: string;
+  suffixNo: string;
+  confirm: boolean;
 }

 interface FormDataNewStructure {
-  orgRevisionName: string
-  type: string
-
+  orgRevisionId: string;
+  orgRevisionName: string;
+  typeDraft: string;
 }

 interface FormAgencyRef {
-  ocName: object | null;
-  shortName: object | null;
-  ocNo: object | null;
-  ocLevel: object | null;
-  telOut: object | null;
-  telIn: object | null;
-  tel: object | null;
+  orgName: object | null;
+  orgShortName: object | null;
+  orgCode: object | null;
+  orgPhoneEx: object | null;
+  orgPhoneIn: object | null;
+  orgFax: object | null;
+  orgLevel: object | null;
  [key: string]: any;
 }

@ -54,26 +55,27 @@ interface FormDateTimeRef {

 interface FormNewStructureRef {
  orgRevisionName: object | null;
+  orgRevisionId: object | null;
  type: object | null;
  [key: string]: any;
 }

 interface HistoryType {
-  orgRevisionId: string
-  orgRevisionName: string
-  orgRevisionIsCurrent: boolean
-  orgRevisionIsDraft: boolean
-  orgRevisionCreatedAt: any
+  orgRevisionId: string;
+  orgRevisionName: string;
+  orgRevisionIsCurrent: boolean;
+  orgRevisionIsDraft: boolean;
+  orgRevisionCreatedAt: any;
 }
-export type { 
-  Pagination, 
-  DataOption, 
-  FormDataAgency, 
-  FormDataPosition, 
-  FormAgencyRef, 
-  FormPositionRef, 
-  FormDateTimeRef, 
-  FormDataNewStructure, 
-  FormNewStructureRef, 
-  HistoryType 
+export type {
+  Pagination,
+  DataOption,
+  FormDataAgency,
+  FormDataPosition,
+  FormAgencyRef,
+  FormPositionRef,
+  FormDateTimeRef,
+  FormDataNewStructure,
+  FormNewStructureRef,
+  HistoryType,
 };
--- a/src/modules/02_organizationalNew/store/organizational.ts
+++ b/src/modules/02_organizationalNew/store/organizational.ts
@ -1,12 +1,27 @@
 import { defineStore } from "pinia";
 import { ref } from "vue";

+/** importType*/
+import type { DataActive } from "@/modules/02_organizationalNew/interface/response/organizational";
+
 export const useOrganizational = defineStore("organizationalStore", () => {
  const typeOrganizational = ref<string>("current");
  const statusView = ref<string>("list");

+  const dataActive = ref<DataActive>();
+  const activeId = ref<string>();
+  const draftId = ref<string>();
+  function fetchDataActive(data: DataActive) {
+    activeId.value = data.activeId;
+    draftId.value = data.draftId;
+    dataActive.value = data;
+  }
+
  return {
    typeOrganizational,
    statusView,
+
+    //
+    fetchDataActive,
  };
 });
--- a/src/modules/02_organizationalNew/views/main.vue
+++ b/src/modules/02_organizationalNew/views/main.vue
@ -5,7 +5,6 @@ import http from "@/plugins/http";
 import config from "@/app.config";

 /** importType*/
-import type { DataActive } from "@/modules/02_organizationalNew/interface/response/organizational";

 /** importComponents*/
 import ListView from "@/modules/02_organizationalNew/components/listView.vue";
@ -21,7 +20,6 @@ import { useCounterMixin } from "@/stores/mixin";
 const $q = useQuasar();
 const { showLoader, hideLoader, messageError } = useCounterMixin();

-const modalNewStructure = ref<boolean>(false);
 const stroe = useOrganizational();

 const isStatusData = ref<boolean>(false);
@ -45,16 +43,15 @@ const itemStructure = ref<any>([
    name: "ทำสำเนาโครงสร้าง ตำแหน่งและคนครอง",
  },
 ]);
-const dataActive = ref<DataActive>();

 async function fetchOrganizationActive() {
  showLoader();
  await http
    .get(config.API.activeOrganization)
    .then((res) => {
-      console.log(res);
      const data = res.data.result;
      if (data) {
+        stroe.fetchDataActive(data);
        if (data.activeName === null && data.draftName === null) {
          isStatusData.value = false;
        } else {
@ -79,6 +76,13 @@ async function fetchOrganizationActive() {
    });
 }

+const modalNewStructure = ref<boolean>(false);
+const typeStructure = ref<string>("");
+function ocClickAddStructure(type: string) {
+  modalNewStructure.value = !modalNewStructure.value;
+  typeStructure.value = type;
+}
+
 const modalDateTime = ref<boolean>(false);
 function onClickDateTime() {
  modalDateTime.value = !modalDateTime.value;
@ -137,7 +141,7 @@ onMounted(async () => {
              color="primary"
              size="lg"
              icon="add"
-              @click="modalNewStructure = true"
+              @click="ocClickAddStructure('NEW')"
            >
              <q-tooltip>เพิ่มโครงสร้าง </q-tooltip>
            </q-btn>
@ -175,6 +179,7 @@ onMounted(async () => {
                  v-close-popup
                  v-for="(item, index) in itemStructure"
                  :key="index"
+                  @click="ocClickAddStructure(item.val)"
                >
                  <q-item-section>
                    <q-item-label>{{ item.name }}</q-item-label>
@ -222,10 +227,13 @@ onMounted(async () => {
  <DialogFormNewStructure
    v-model:new-structure="modalNewStructure"
    v-model:status="isStatusData"
+    v-model:type="typeStructure"
  />

+  <!-- ตั้งเวลาเผยแพร่ -->
  <DialogDateTime :modal="modalDateTime" :close="onClickDateTime" />

+  <!-- ประวัติโครงสร้าง -->
  <DialogHistory :modal="modalHistory" :close="onClickHistory" />
 </template>