Merge branch 'nice_dev' into develop

2024-04-09 13:03:42 +07:00 · 2024-04-09 13:03:42 +07:00 · 10efd65ba9
commit 10efd65ba9
parent 38b5bdd2d1 6d8c062a42
6 changed files with 240 additions and 49 deletions
--- a/src/modules/15_development/components/MainTab.vue
+++ b/src/modules/15_development/components/MainTab.vue
@ -86,6 +86,17 @@ function fetchDataProject(id: string) {
      store.formAddProject.actualGoals = actualGoals;
      store.formAddProject.actualPeoples = actualPeoples;

+      // ลักษณะโครงการ
+      store.formAddProject.projectDay = store.formAddProject.projectDay
+        ? Number(store.formAddProject.projectDay)
+        : null;
+      store.formAddProject.projectNigth = store.formAddProject.projectNigth
+        ? Number(store.formAddProject.projectNigth)
+        : null;
+      store.formAddProject.projectModal = store.formAddProject.projectModal
+        ? Number(store.formAddProject.projectModal)
+        : null;
+
      /** การติดตามผลดารประเมิน*/
      store.formAddProject.metricType = data.metricType;
      store.formAddProject.indicators = data.indicators;
--- a/src/modules/15_development/components/Other.vue
+++ b/src/modules/15_development/components/Other.vue
@ -31,6 +31,20 @@ const budgetOp = ref<DataOption[]>([
    name: "เงินนอกงบประมาณ",
  },
 ]);
+const budgetSubOp = ref<DataOption[]>([
+  {
+    id: "1",
+    name: "เงินบำรุง",
+  },
+  {
+    id: "2",
+    name: "เงินกองทุน",
+  },
+  {
+    id: "3",
+    name: "เงินอุดหนุน",
+  },
+]);

 const getProvince = async () => {
  showLoader();
@ -92,6 +106,8 @@ const filterSelector = (val: string, update: Function) => {
  });
 };

+const multiple = ref(null);
+
 onMounted(() => {
  getProvince();
 });
@ -244,6 +260,21 @@ onMounted(() => {
        class="inputgreen"
      />
    </div>
+    <div class="col-2">
+      <q-select
+        v-if="store.formAddProject.budget === 'OUTSIDEBUDGET'"
+        outlined
+        dense
+        v-model="store.formAddProject.budgetSub"
+        label="ประเภทย่อย"
+        :options="budgetSubOp"
+        option-label="name"
+        option-value="id"
+        emit-value
+        map-options
+        class="inputgreen"
+      />
+    </div>
    <div class="col-12">
      <div class="row q-col-gutter-x-sm">
        <div class="col-3">
@ -396,6 +427,7 @@ onMounted(() => {
        map-options
        class="inputgreen"
        use-input
+        multiple
        @filter="
        (inputValue:string, doneFn:Function) =>
          filterSelector(inputValue, doneFn, )
--- a/src/modules/15_development/components/ProjectDetail.vue
+++ b/src/modules/15_development/components/ProjectDetail.vue
@ -1,12 +1,112 @@
 <script setup lang="ts">
-import { onMounted } from "vue";
+import { ref, onMounted, reactive, watch } from "vue";
+
+/**importType*/
+import type { DataOption } from "@/modules/15_development/interface/index/Main";
+
+import { useDevelopmentDataStore } from "@/modules/15_development/store/developmentStore";
+
+const store = useDevelopmentDataStore();
+
+const projectTypeOp = ref<DataOption[]>([
+  { id: "1", name: "โครงการตามยุทธศาสตร์" },
+  { id: "2", name: "โครงการตามภารกิจประจำของหน่วยงาน" },
+  { id: "3", name: "โครงการใหม่" },
+  { id: "4", name: "โครงการต่อเนื่อง" },
+]);
+const projectCharacteristicsOp = ref<DataOption[]>([
+  { id: "1", name: "ไป-กลับ" },
+  { id: "2", name: "พักค้าง" },
+  { id: "3", name: "ไป-กลับและพักค้าง" },
+]);
+const projectTechniquesOp = ref<DataOption[]>([
+  { id: "1", name: "การอบรม" },
+  { id: "2", name: "การประชุม" },
+  { id: "3", name: "การสัมมนา" },
+  { id: "4", name: "การศึกษาดูงาน" },
+  { id: "5", name: "การสัมมนาทางวิชาการ" },
+  { id: "6", name: "การสัมมนาเชิงปฏิบัติการ" },
+  { id: "7", name: "การบรรยายพิเศษ" },
+  { id: "8", name: "การฝึกศึกษา" },
+]);

 onMounted(() => {
  console.log("ลักษณะโครงการ");
 });
 </script>
 <template>
-  <div>ลักษณะโครงการ</div>
+  <div class="row q-pa-md q-col-gutter-sm">
+    <div class="col-12 col-sm-12 col-md-4">
+      <q-select
+        dense
+        outlined
+        v-model="store.formAddProject.projectType"
+        :options="projectTypeOp"
+        label="ประเภทโครงการ"
+        option-label="name"
+        option-value="id"
+        emit-value
+        map-options
+      />
+    </div>
+    <div class="col-12 col-sm-6 col-md-4">
+      <q-select
+        dense
+        outlined
+        v-model="store.formAddProject.projectCharacteristics"
+        :options="projectCharacteristicsOp"
+        label="ลักษณะ"
+        option-label="name"
+        option-value="id"
+        emit-value
+        map-options
+      />
+    </div>
+    <div class="col-12 col-sm-6 col-md-2">
+      <q-input
+        dense
+        outlined
+        v-model="store.formAddProject.projectDay"
+        label="จำนวน (วัน)"
+        mask="#"
+        reverse-fill-mask
+      />
+    </div>
+    <div class="col-12 col-sm-6 col-md-2">
+      <q-input
+        v-if="store.formAddProject.projectCharacteristics !== '1'"
+        dense
+        outlined
+        v-model="store.formAddProject.projectNigth"
+        label="จำนวน (คืน)"
+        mask="#"
+        reverse-fill-mask
+      />
+    </div>
+    <div class="col-12 col-sm-6 col-md-4">
+      <q-select
+        dense
+        outlined
+        v-model="store.formAddProject.projectTechniques"
+        :options="projectTechniquesOp"
+        label="เทคนิควิธีการที่ใช้ในการพัฒนา"
+        option-label="name"
+        option-value="id"
+        emit-value
+        map-options
+      />
+    </div>
+    <div class="col-12 col-sm-6 col-md-2">
+      <q-input
+        dense
+        outlined
+        v-model="store.formAddProject.projectModal"
+        label="จำนวน (รุ่น)"
+        mask="#"
+        reverse-fill-mask
+      />
+    </div>
+  </div>
 </template>

 <style scoped></style>
--- a/src/modules/15_development/interface/request/Main.ts
+++ b/src/modules/15_development/interface/request/Main.ts
@ -2,6 +2,7 @@ interface FormQueryListProject {
  year: number;
  page: number;
  pageSize: number;
+  org: string;
  keyword: string;
 }

@ -140,6 +141,7 @@ interface FormAddProject {
  address: string;
  provinceId: string | null;
  budget: string;
+  budgetSub: string;
  accept: number | string | null;
  receive: number | string | null;
  approved: number | string | null;
@ -152,11 +154,17 @@ interface FormAddProject {
  expect: string;
  topicAcademic: string;
  addressAcademic: string;
-  provinceActualId: string | null;
+  provinceActualId: any;
  actualPeoples: People[];
  plannedPeoples: People[];
  actualGoals: actualGoals[];
  plannedGoals: PlannedGoals[];
+  projectType: string;
+  projectCharacteristics: string;
+  projectDay: number | null;
+  projectNigth: number | null;
+  projectTechniques: string;
+  projectModal: number | null;
 }

 interface People {
--- a/src/modules/15_development/store/developmentStore.ts
+++ b/src/modules/15_development/store/developmentStore.ts
@ -8,7 +8,7 @@ import type { FormAddProject } from "@/modules/15_development/interface/request/
 export const useDevelopmentDataStore = defineStore(
  "developmentDataStore",
  () => {
-    const statusEdit = ref<boolean>(false)
+    const statusEdit = ref<boolean>(false);
    const formAddProject = reactive<FormAddProject>({
      year: new Date().getFullYear(), //ปีงบประมาณ*
      projectName: "", //ชื่อโครงการ/กิจกรรม/หลักสูตร*
@ -34,6 +34,7 @@ export const useDevelopmentDataStore = defineStore(
      address: "", //ที่อยู่
      provinceId: null, //จังหวัด
      budget: "", //ประเภทงบประมาณ(งบตามข้อบัญญัติ->REGULATIONBUDGET, งบประมาณกรุงเทพมหานคร->BANGKOKBUDGET, เงินนอกงบประมาณ->OUTSIDEBUDGET)
+      budgetSub:"",
      accept: null, //จํานวนงบประมาณที่ขอรับการจัดสรรฯ
      receive: null, //จํานวนงบประมาณที่ได้รับการจัดสรรฯ
      approved: null, //จํานวนงบประมาณที่ได้รับอนุมัติ
@ -81,6 +82,14 @@ export const useDevelopmentDataStore = defineStore(
        //   amount: null, //จำนวน(คน)
        // },
      ], //เป้าหมายตามแผน กลุ่มเป้าหมาย
+
+      // ลักษณะโครงการ
+      projectType: "",
+      projectCharacteristics: "",
+      projectDay: null,
+      projectNigth: null,
+      projectTechniques: "",
+      projectModal: null,
    });

    function clearFormAddProject() {
@ -96,6 +105,14 @@ export const useDevelopmentDataStore = defineStore(
      formAddProject.actualGoals = [];
      formAddProject.actualPeoples = [];

+      // ลักษณะโครงการ
+      formAddProject.projectType = "";
+      formAddProject.projectCharacteristics = "";
+      formAddProject.projectDay = null;
+      formAddProject.projectNigth = null;
+      formAddProject.projectTechniques = "";
+      formAddProject.projectModal = null;
+
      /** การติดตามผลดารประเมิน*/
      formAddProject.metricType = "";
      formAddProject.indicators = "";
--- a/src/modules/15_development/views/MainPage.vue
+++ b/src/modules/15_development/views/MainPage.vue
@ -7,6 +7,7 @@ import config from "@/app.config";

 /**importType*/
 import type {
+  DataOption,
  ItemsMenu,
  NewPagination,
 } from "@/modules/15_development/interface/index/Main";
@ -22,6 +23,7 @@ const router = useRouter();
 const { showLoader, hideLoader, messageError } = useCounterMixin();

 /** หัวตาราง */
+const rows = ref<ResListProject[]>([]); // ข้อมูลรายการ
 const columns = ref<QTableProps["columns"]>([
  {
    name: "year",
@ -82,10 +84,12 @@ const formQuery = reactive<FormQueryListProject>({
  year: new Date().getFullYear(),
  page: 1,
  pageSize: 10,
+  org: "1",
  keyword: "",
 });
+const orgOp = ref<DataOption[]>([{ id: "1", name: "หน่วยงาน 1" }]);
+
 const totalList = ref<number>(1); //จำนวนข้อมูลรายการ
-const rows = ref<ResListProject[]>([]); // ข้อมูลรายการ

 /** funciton  fetch รายการโครงการ*/
 function fetchListProject() {
@ -134,6 +138,11 @@ watch(
  }
 );

+function fetchListProjectNew() {
+  formQuery.page = 1;
+  fetchListProject();
+}
+
 onMounted(() => {
  fetchListProject();
 });
@ -145,50 +154,64 @@ onMounted(() => {
  </div>
  <q-card flat bordered class="q-pa-md">
    <q-toolbar style="padding: 0">
-      <datepicker
-        menu-class-name="modalfix"
-        v-model="formQuery.year"
-        :locale="'th'"
-        autoApply
-        year-picker
-        :enableTimePicker="false"
-        @update:model-value="fetchListProject"
-      >
-        <template #year="{ year }">{{ year + 543 }}</template>
-        <template #year-overlay-value="{ value }">{{
-          parseInt(value + 543)
-        }}</template>
-        <template #trigger>
-          <q-input
-            dense
-            lazy-rules
-            outlined
-            :model-value="Number(formQuery.year) + 543"
-            :label="`${'ปีงบประมาณ'}`"
-          >
-            <template v-slot:prepend>
-              <q-icon
-                name="event"
-                class="cursor-pointer"
-                style="color: var(--q-primary)"
-              >
-              </q-icon>
-            </template>
-          </q-input>
-        </template>
-      </datepicker>
-      <q-toolbar-title>
-        <q-btn
-          flat
-          round
-          dense
-          icon="add"
-          color="primary"
-          @click="onClickAddOrView()"
+      <div class="row q-gutter-sm">
+        <datepicker
+          menu-class-name="modalfix"
+          v-model="formQuery.year"
+          :locale="'th'"
+          autoApply
+          year-picker
+          :enableTimePicker="false"
+          @update:model-value="fetchListProjectNew"
        >
-          <q-tooltip>เพิ่ม</q-tooltip>
-        </q-btn>
-      </q-toolbar-title>
+          <template #year="{ year }">{{ year + 543 }}</template>
+          <template #year-overlay-value="{ value }">{{
+            parseInt(value + 543)
+          }}</template>
+          <template #trigger>
+            <q-input
+              dense
+              lazy-rules
+              outlined
+              :model-value="Number(formQuery.year) + 543"
+              :label="`${'ปีงบประมาณ'}`"
+            >
+              <template v-slot:prepend>
+                <q-icon
+                  name="event"
+                  class="cursor-pointer"
+                  style="color: var(--q-primary)"
+                >
+                </q-icon>
+              </template>
+            </q-input>
+          </template>
+        </datepicker>
+        <q-select
+          dense
+          outlined
+          v-model="formQuery.org"
+          :options="orgOp"
+          label="หน่วยงาน"
+          option-label="name"
+          option-value="id"
+          emit-value
+          map-options
+          @update:model-value="fetchListProjectNew"
+        />
+        <q-toolbar-title>
+          <q-btn
+            flat
+            round
+            dense
+            icon="add"
+            color="primary"
+            @click="onClickAddOrView()"
+          >
+            <q-tooltip>เพิ่ม</q-tooltip>
+          </q-btn>
+        </q-toolbar-title>
+      </div>

      <q-space />
      <div class="row q-gutter-sm">
@ -222,7 +245,7 @@ onMounted(() => {
            ref="filterRef"
            outlined
            placeholder="ค้นหา"
-            @keyup.enter="fetchListProject"
+            @keyup.enter="fetchListProjectNew"
          >
            <template v-slot:append>
              <q-icon v-if="formQuery.keyword == ''" name="search" />