From 3a974e84cbbe43b82fed076103d1a0d217e85360 Mon Sep 17 00:00:00 2001
From: oat_dev <nattapon@frappet.com>
Date: Wed, 10 Apr 2024 14:29:48 +0700
Subject: [PATCH 1/5] =?UTF-8?q?=E0=B9=80=E0=B8=9B=E0=B9=89=E0=B8=B2?=
 =?UTF-8?q?=E0=B8=AB=E0=B8=A1=E0=B8=B2=E0=B8=A2=20=E0=B9=81=E0=B8=81?=
 =?UTF-8?q?=E0=B9=89=E0=B9=84=E0=B8=82=E0=B8=9A=E0=B8=B1=E0=B8=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../15_development/components/MainTab.vue       | 11 ++++++-----
 .../15_development/components/Target.vue        | 16 +++++++++++-----
 .../15_development/interface/request/Main.ts    | 17 ++++++++++++++++-
 .../15_development/interface/response/Main.ts   |  9 ++++++++-
 4 files changed, 41 insertions(+), 12 deletions(-)

diff --git a/src/modules/15_development/components/MainTab.vue b/src/modules/15_development/components/MainTab.vue
index 0d5fd5193..e0dbba93f 100644
--- a/src/modules/15_development/components/MainTab.vue
+++ b/src/modules/15_development/components/MainTab.vue
@@ -53,15 +53,16 @@ function fetchDataProject(id: string) {
       store.formAddProject.projectName = data.projectName;
       store.formAddProject.reason = data.reason;
       store.formAddProject.objective = data.objective;
-
       /**เป้าหมาย*/
       const plannedGoals = data.plannedGoals.map((e: ResPlannedGoals) => ({
         groupTarget: e.groupTarget,
         groupTargetSub: e.groupTargetSub,
-        position: e.position,
-        posTypePlannedId: e.posTypePlannedId,
-        posLevelPlannedId: e.posLevelPlannedId,
-        type: e.type,
+        positions: e.plannedGoalPositions.map((v: any) => ({
+          position: v.position,
+          posTypePlannedId: v.posTypePlannedId,
+          posLevelPlannedId: v.posLevelPlannedId,
+        })),
+        type: e.type ? e.type : null,
         amount: e.amount,
       }));
       const plannedPeoples = data.plannedPeoples.map((e: ResPeople) => ({
diff --git a/src/modules/15_development/components/Target.vue b/src/modules/15_development/components/Target.vue
index 10ba8cfd7..10dd8b547 100644
--- a/src/modules/15_development/components/Target.vue
+++ b/src/modules/15_development/components/Target.vue
@@ -158,7 +158,7 @@ const formGroupTarget = reactive<FormGroupTargetPlannedGoal>({
   position: "",
   posType: "",
   level: "",
-  type: "",
+  type: null,
   amount: null,
   // positions: {
   //   position: "",
@@ -222,11 +222,14 @@ function onSubmitGroup() {
     const list = data.map((e: FormGroupTargetPlannedGoal) => ({
       groupTarget: e.groupTarget,
       groupTargetSub: e.groupTargetSub,
-      positions: e.positions,
+      positions: e.positions.map((v: any) => ({
+        position: v.position,
+        posTypePlannedId: v.posTypePlannedId,
+        posLevelPlannedId: v.posLevelPlannedId,
+      })),
       type: e.type ? e.type : null,
       amount: Number(e.amount),
     }));
-    console.log(list);
     if (isEdit.value) {
       plannedGoals.value.splice(rowIndex.value, 1, ...list);
     } else {
@@ -376,7 +379,6 @@ onMounted(() => {
   plannedGoals.value = store.formAddProject.plannedGoals
     ? store.formAddProject.plannedGoals
     : [];
-
   plannedPeoples.value = store.formAddProject.plannedPeoples
     ? store.formAddProject.plannedPeoples
     : [];
@@ -401,7 +403,10 @@ onMounted(() => {
             <q-item
               clickable
               v-close-popup
-              @click="onClickOpenDialog('group', 'planned')"
+              @click="
+                cleanFormData();
+                onClickOpenDialog('group', 'planned');
+              "
             >
               <q-item-section>กลุ่มเป้าหมาย</q-item-section>
             </q-item>
@@ -464,6 +469,7 @@ onMounted(() => {
                       formGroupTarget.groupTarget = props.row.groupTarget;
                       formGroupTarget.groupTargetSub = props.row.groupTargetSub;
                       formGroupTarget.amount = props.row.amount;
+                      formGroupTarget.positions = props.row.positions;
                       newModalGroupTarget = true;
                     }
                   "
diff --git a/src/modules/15_development/interface/request/Main.ts b/src/modules/15_development/interface/request/Main.ts
index b8d3a7e23..3d262f021 100644
--- a/src/modules/15_development/interface/request/Main.ts
+++ b/src/modules/15_development/interface/request/Main.ts
@@ -32,6 +32,14 @@ interface FormGroupTargetPlannedGoal {
       posLevelPlannedId: string;
     }
   ];
+  plannedGoalPositions?: [
+    {
+      position: string;
+      posTypePlannedId: string;
+      posLevelPlannedId: string;
+    }
+  ];
+
   groupTarget: string;
   groupTargetSub: string;
   position: string;
@@ -202,7 +210,14 @@ interface actualGoals {
 interface PlannedGoals {
   groupTarget: string;
   groupTargetSub: string;
-  positions: [
+  positions?: [
+    {
+      position: string;
+      posTypePlannedId: string;
+      posLevelPlannedId: string;
+    }
+  ];
+  plannedGoalPositions?: [
     {
       position: string;
       posTypePlannedId: string;
diff --git a/src/modules/15_development/interface/response/Main.ts b/src/modules/15_development/interface/response/Main.ts
index 55346e830..392510085 100644
--- a/src/modules/15_development/interface/response/Main.ts
+++ b/src/modules/15_development/interface/response/Main.ts
@@ -88,7 +88,14 @@ interface ResActualGoals {
 interface ResPlannedGoals {
   groupTarget: string;
   groupTargetSub: string;
-  position: [
+  plannedGoalPositions?: [
+    {
+      position: string;
+      posTypePlannedId: string;
+      posLevelPlannedId: string;
+    }
+  ];
+  positions?: [
     {
       position: string;
       posTypePlannedId: string;

From e0a7c8e2becb9d85c1c7c5b5739ef5231164f0a6 Mon Sep 17 00:00:00 2001
From: oat_dev <nattapon@frappet.com>
Date: Wed, 10 Apr 2024 15:45:03 +0700
Subject: [PATCH 2/5] =?UTF-8?q?UI=20=E0=B8=AA=E0=B8=A1=E0=B8=A3=E0=B8=A3?=
 =?UTF-8?q?=E0=B8=96=E0=B8=99=E0=B8=B0=2004,05?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Forms/04_FormExecutivePosition.vue        | 214 +++++++++++++++++-
 .../Forms/05_FormExecutiveLevel.vue           | 176 +++++++++++++-
 2 files changed, 382 insertions(+), 8 deletions(-)

diff --git a/src/modules/14_KPI/components/competency/Forms/04_FormExecutivePosition.vue b/src/modules/14_KPI/components/competency/Forms/04_FormExecutivePosition.vue
index 212191a98..105cc93e5 100644
--- a/src/modules/14_KPI/components/competency/Forms/04_FormExecutivePosition.vue
+++ b/src/modules/14_KPI/components/competency/Forms/04_FormExecutivePosition.vue
@@ -1,5 +1,211 @@
+<script setup lang="ts">
+import { ref } from "vue";
+import type { QTableProps } from "quasar";
+import { useCounterMixin } from "@/stores/mixin";
+import { useQuasar } from "quasar";
+import { useRouter } from "vue-router";
+
+import http from "@/plugins/http";
+import config from "@/app.config";
+const router = useRouter();
+
+const mixin = useCounterMixin();
+const $q = useQuasar();
+const mode = ref<string>("table");
+const {
+  dialogRemove,
+  dialogConfirm,
+  showLoader,
+  hideLoader,
+  messageError,
+  success,
+  date2Thai,
+} = mixin;
+const L1Editor = ref<string>("");
+const competencyName = ref<string>("");
+async function onSubmit() {
+  dialogConfirm($q, async () => {});
+}
+</script>
+
 <template>
-    <div>
-        สมรรถนะเฉพาะสำหรับตำแหน่ง ผอ.เขต ผช.ผอ.เขต และหัวหน้าฝ่ายในสังกัด สนง.เขต
-    </div>
-</template>
\ No newline at end of file
+  <div class="full-width">
+    <q-form @submit.prevent greedy @validation-success="onSubmit()">
+      <div class="col-12">
+        <q-input outlined v-model="competencyName" dense label="ชื่อสมรรถนะ" />
+      </div>
+      <q-card-section class="col-12 q-px-none">
+        <div>
+          <q-editor
+            v-model="L1Editor"
+            :dense="$q.screen.lt.md"
+            min-height="7rem"
+            placeholder="คำจำกัดความ"
+            :toolbar="[
+              [
+                'bold',
+                'italic',
+                'strike',
+                'underline',
+                'subscript',
+                'superscript',
+              ],
+
+              ['unordered', 'ordered'],
+            ]"
+            :fonts="{
+              arial: 'Arial',
+              arial_black: 'Arial Black',
+              comic_sans: 'Comic Sans MS',
+              courier_new: 'Courier New',
+              impact: 'Impact',
+              lucida_grande: 'Lucida Grande',
+              times_new_roman: 'Times New Roman',
+              verdana: 'Verdana',
+            }"
+          />
+        </div>
+      </q-card-section>
+      <div class="col-12">
+        <q-card flat bordered>
+          <q-card-section class="bg-grey-4 q-py-sm">
+            <div class="row text-dark text-body2 text-weight-medium">
+              <div class="col-6 q-pl-xl">ระบบตำแหน่ง</div>
+              <div class="col-6">
+                คำอธิบายระดับ/พฤติกรรมที่คาดหวัง/พฤติกรรมย่อย
+              </div>
+            </div>
+          </q-card-section>
+          <div class="row items-center">
+            <q-card-section class="q-pa-none q-pl-xl col-6">
+              <span class="text-dark text-subtitle1 text-weight-medium">
+                L1 ระดับ หัวหน้าฝ่ายในสังกัด
+              </span>
+            </q-card-section>
+            <q-card-section class="q-pa-none col-6">
+              <div class="q-py-md q-mr-md">
+                <q-editor
+                  v-model="L1Editor"
+                  :dense="$q.screen.lt.md"
+                  min-height="5rem"
+                  :toolbar="[
+                    [
+                      'bold',
+                      'italic',
+                      'strike',
+                      'underline',
+                      'subscript',
+                      'superscript',
+                    ],
+
+                    ['unordered', 'ordered'],
+                  ]"
+                  :fonts="{
+                    arial: 'Arial',
+                    arial_black: 'Arial Black',
+                    comic_sans: 'Comic Sans MS',
+                    courier_new: 'Courier New',
+                    impact: 'Impact',
+                    lucida_grande: 'Lucida Grande',
+                    times_new_roman: 'Times New Roman',
+                    verdana: 'Verdana',
+                  }"
+                />
+              </div>
+            </q-card-section>
+          </div>
+          <div class="row items-center">
+            <q-card-section class="q-pa-none q-pl-xl col-6">
+              <span class="text-dark text-subtitle1 text-weight-medium">
+                L2 ระดับ ผู้ช่วยผู้อำนวยการเขต
+              </span>
+            </q-card-section>
+            <q-card-section class="q-pa-none col-6">
+              <div class="q-py-md q-mr-md">
+                <q-editor
+                  v-model="L1Editor"
+                  :dense="$q.screen.lt.md"
+                  min-height="5rem"
+                  :toolbar="[
+                    [
+                      'bold',
+                      'italic',
+                      'strike',
+                      'underline',
+                      'subscript',
+                      'superscript',
+                    ],
+
+                    ['unordered', 'ordered'],
+                  ]"
+                  :fonts="{
+                    arial: 'Arial',
+                    arial_black: 'Arial Black',
+                    comic_sans: 'Comic Sans MS',
+                    courier_new: 'Courier New',
+                    impact: 'Impact',
+                    lucida_grande: 'Lucida Grande',
+                    times_new_roman: 'Times New Roman',
+                    verdana: 'Verdana',
+                  }"
+                />
+              </div>
+            </q-card-section>
+          </div>
+          <div class="row items-center">
+            <q-card-section class="q-pa-none q-pl-xl col-6">
+              <span class="text-dark text-subtitle1 text-weight-medium">
+                L3 ระดับ ผู้อำนวยการเขต
+              </span>
+            </q-card-section>
+            <q-card-section class="q-pa-none col-6">
+              <div class="q-py-md q-mr-md">
+                <q-editor
+                  v-model="L1Editor"
+                  :dense="$q.screen.lt.md"
+                  min-height="5rem"
+                  :toolbar="[
+                    [
+                      'bold',
+                      'italic',
+                      'strike',
+                      'underline',
+                      'subscript',
+                      'superscript',
+                    ],
+
+                    ['unordered', 'ordered'],
+                  ]"
+                  :fonts="{
+                    arial: 'Arial',
+                    arial_black: 'Arial Black',
+                    comic_sans: 'Comic Sans MS',
+                    courier_new: 'Courier New',
+                    impact: 'Impact',
+                    lucida_grande: 'Lucida Grande',
+                    times_new_roman: 'Times New Roman',
+                    verdana: 'Verdana',
+                  }"
+                />
+              </div>
+            </q-card-section>
+          </div>
+        </q-card>
+        <q-separator color="grey-4" />
+        <q-toolbar class="fit row wrap justify-end items-start content-start">
+          <q-btn
+            dense
+            unelevated
+            label="บันทึก"
+            id="onSubmit"
+            type="submit"
+            color="public"
+            class="q-px-md"
+          >
+            <q-tooltip>บันทึกข้อมูล</q-tooltip>
+          </q-btn>
+        </q-toolbar>
+      </div>
+    </q-form>
+  </div>
+</template>
diff --git a/src/modules/14_KPI/components/competency/Forms/05_FormExecutiveLevel.vue b/src/modules/14_KPI/components/competency/Forms/05_FormExecutiveLevel.vue
index 55efbd5f5..a4a0f6b24 100644
--- a/src/modules/14_KPI/components/competency/Forms/05_FormExecutiveLevel.vue
+++ b/src/modules/14_KPI/components/competency/Forms/05_FormExecutiveLevel.vue
@@ -1,5 +1,173 @@
+<script setup lang="ts">
+import { ref } from "vue";
+import type { QTableProps } from "quasar";
+import { useCounterMixin } from "@/stores/mixin";
+import { useQuasar } from "quasar";
+import { useRouter } from "vue-router";
+
+import http from "@/plugins/http";
+import config from "@/app.config";
+const router = useRouter();
+
+const mixin = useCounterMixin();
+const $q = useQuasar();
+const mode = ref<string>("table");
+const {
+  dialogRemove,
+  dialogConfirm,
+  showLoader,
+  hideLoader,
+  messageError,
+  success,
+  date2Thai,
+} = mixin;
+const L1Editor = ref<string>("");
+const competencyName = ref<string>("");
+async function onSubmit() {
+  dialogConfirm($q, async () => {});
+}
+</script>
+
 <template>
-    <div>
-        สมรรถนะเฉพาะสำหรับตำแหน่งผู้ตรวจราชการ กทม. และผู้ตรวจราชการ
-    </div>
-</template>
\ No newline at end of file
+  <div class="full-width">
+    <q-form @submit.prevent greedy @validation-success="onSubmit()">
+      <div class="col-12">
+        <q-input outlined v-model="competencyName" dense label="ชื่อสมรรถนะ" />
+      </div>
+      <q-card-section class="col-12 q-px-none">
+        <div>
+          <q-editor
+            v-model="L1Editor"
+            :dense="$q.screen.lt.md"
+            min-height="7rem"
+            placeholder="คำจำกัดความ"
+            :toolbar="[
+              [
+                'bold',
+                'italic',
+                'strike',
+                'underline',
+                'subscript',
+                'superscript',
+              ],
+
+              ['unordered', 'ordered'],
+            ]"
+            :fonts="{
+              arial: 'Arial',
+              arial_black: 'Arial Black',
+              comic_sans: 'Comic Sans MS',
+              courier_new: 'Courier New',
+              impact: 'Impact',
+              lucida_grande: 'Lucida Grande',
+              times_new_roman: 'Times New Roman',
+              verdana: 'Verdana',
+            }"
+          />
+        </div>
+      </q-card-section>
+      <div class="col-12">
+        <q-card flat bordered>
+          <q-card-section class="bg-grey-4 q-py-sm">
+            <div class="row text-dark text-body2 text-weight-medium">
+              <div class="col-6 q-pl-xl">ระบบตำแหน่ง</div>
+              <div class="col-6">
+                คำอธิบายระดับ/พฤติกรรมที่คาดหวัง/พฤติกรรมย่อย
+              </div>
+            </div>
+          </q-card-section>
+          <div class="row items-center">
+            <q-card-section class="q-pa-none q-pl-xl col-6">
+              <span class="text-dark text-subtitle1 text-weight-medium">
+                L1 ประเภทอำนวยการ ระดับสูง
+              </span>
+            </q-card-section>
+            <q-card-section class="q-pa-none col-6">
+              <div class="q-py-md q-mr-md">
+                <q-editor
+                  v-model="L1Editor"
+                  :dense="$q.screen.lt.md"
+                  min-height="5rem"
+                  :toolbar="[
+                    [
+                      'bold',
+                      'italic',
+                      'strike',
+                      'underline',
+                      'subscript',
+                      'superscript',
+                    ],
+
+                    ['unordered', 'ordered'],
+                  ]"
+                  :fonts="{
+                    arial: 'Arial',
+                    arial_black: 'Arial Black',
+                    comic_sans: 'Comic Sans MS',
+                    courier_new: 'Courier New',
+                    impact: 'Impact',
+                    lucida_grande: 'Lucida Grande',
+                    times_new_roman: 'Times New Roman',
+                    verdana: 'Verdana',
+                  }"
+                />
+              </div>
+            </q-card-section>
+          </div>
+          <div class="row items-center">
+            <q-card-section class="q-pa-none q-pl-xl col-6">
+              <span class="text-dark text-subtitle1 text-weight-medium">
+                L2 ประเภทบริหาร ระดับสูง
+              </span>
+            </q-card-section>
+            <q-card-section class="q-pa-none col-6">
+              <div class="q-py-md q-mr-md">
+                <q-editor
+                  v-model="L1Editor"
+                  :dense="$q.screen.lt.md"
+                  min-height="5rem"
+                  :toolbar="[
+                    [
+                      'bold',
+                      'italic',
+                      'strike',
+                      'underline',
+                      'subscript',
+                      'superscript',
+                    ],
+
+                    ['unordered', 'ordered'],
+                  ]"
+                  :fonts="{
+                    arial: 'Arial',
+                    arial_black: 'Arial Black',
+                    comic_sans: 'Comic Sans MS',
+                    courier_new: 'Courier New',
+                    impact: 'Impact',
+                    lucida_grande: 'Lucida Grande',
+                    times_new_roman: 'Times New Roman',
+                    verdana: 'Verdana',
+                  }"
+                />
+              </div>
+            </q-card-section>
+          </div>
+        </q-card>
+        <q-separator color="grey-4" />
+        <q-toolbar class="fit row wrap justify-end items-start content-start">
+          <q-btn
+            dense
+            unelevated
+            label="บันทึก"
+            id="onSubmit"
+            type="submit"
+            color="public"
+            class="q-px-md"
+          >
+            <q-tooltip>บันทึกข้อมูล</q-tooltip>
+          </q-btn>
+        </q-toolbar>
+      </div>
+    </q-form>
+  </div>
+</template>

From 4824e2a9257d0e58d927e18d15be4171c03ad97a Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Wed, 10 Apr 2024 16:04:17 +0700
Subject: [PATCH 3/5] =?UTF-8?q?UI=20=20=E0=B8=AA=E0=B8=A1=E0=B8=A3?=
 =?UTF-8?q?=E0=B8=A3=E0=B8=96=E0=B8=99=E0=B8=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../14_KPI/components/competency/AddPage.vue  |  61 ++--
 .../competency/Forms/01_FormMain.vue          | 161 +++++++++-
 .../competency/Forms/03_FormExecutive.vue     | 276 +++++++++++++++++-
 .../components/scholarship/DetailView.vue     |   5 +
 .../interface/request/Scholarship.ts          |   1 +
 5 files changed, 467 insertions(+), 37 deletions(-)

diff --git a/src/modules/14_KPI/components/competency/AddPage.vue b/src/modules/14_KPI/components/competency/AddPage.vue
index bb02d44a5..ec5f9284e 100644
--- a/src/modules/14_KPI/components/competency/AddPage.vue
+++ b/src/modules/14_KPI/components/competency/AddPage.vue
@@ -86,33 +86,33 @@ function onSubmit() {
     <span class="toptitle text-dark">เพิ่มสมรรถนะ</span>
   </div>
   <q-card flat bordered>
-    <q-form greedy @submit.prevent @validation-success="onSubmit">
-      <q-card-section>
-        <div class="row q-col-gutter-sm">
-          <div class="col-12">
-            <q-select
-              v-model="formData.competencyType"
-              outlined
-              label="เลือกประเภทสมรรถนะ"
-              dense
-              option-label="name"
-              option-value="id"
-              :options="competencyTypeOp"
-              emit-value
-              map-options
-              :rules="[(val:string) => !!val || `${'กรุณาเลือกประเภทสมรรถนะ'}`,]"
-              hide-bottom-space
-            />
-          </div>
-          <FormMain v-if="formData.competencyType === 'ID1'" />
-          <FormGroup v-else-if="formData.competencyType === 'ID2'" />
-          <FormExecutive v-else-if="formData.competencyType === 'ID3'" />
-          <FormExecutivePosition
-            v-else-if="formData.competencyType === 'ID4'"
+    <!-- @submit.prevent @validation-success="onSubmit" -->
+    <!-- <q-form greedy> -->
+    <q-card-section>
+      <div class="row q-col-gutter-sm">
+        <div class="col-12">
+          <q-select
+            v-model="formData.competencyType"
+            outlined
+            label="เลือกประเภทสมรรถนะ"
+            dense
+            option-label="name"
+            option-value="id"
+            :options="competencyTypeOp"
+            emit-value
+            map-options
+            :rules="[(val:string) => !!val || `${'กรุณาเลือกประเภทสมรรถนะ'}`,]"
+            hide-bottom-space
           />
-          <FormExecutiveLevel v-else-if="formData.competencyType === 'ID5'" />
+        </div>
 
-          <!-- <div class="col-12">
+        <FormMain v-if="formData.competencyType === 'ID1'" />
+        <FormGroup v-else-if="formData.competencyType === 'ID2'" />
+        <FormExecutive v-else-if="formData.competencyType === 'ID3'" />
+        <FormExecutivePosition v-else-if="formData.competencyType === 'ID4'" />
+        <FormExecutiveLevel v-else-if="formData.competencyType === 'ID5'" />
+
+        <!-- <div class="col-12">
             <q-input
               v-model="formData.competencyName"
               dense
@@ -208,7 +208,7 @@ function onSubmit() {
             </q-card>
           </div> -->
 
-          <!-- <div class="col-12">
+        <!-- <div class="col-12">
             <q-input
               v-model="formData.definition"
               label="กำหนดเกณฑ์การประเมิน"
@@ -219,10 +219,9 @@ function onSubmit() {
               hide-bottom-space
             />
           </div> -->
-        </div>
-      </q-card-section>
-      <q-separator />
-      <!-- <div class="text-right q-pa-sm">
+      </div>
+    </q-card-section>
+    <!-- <div class="text-right q-pa-sm">
         <q-btn
           dense
           unelevated
@@ -235,6 +234,6 @@ function onSubmit() {
           <q-tooltip>บันทึกข้อมูล</q-tooltip>
         </q-btn>
       </div> -->
-    </q-form>
+    <!-- </q-form> -->
   </q-card>
 </template>
diff --git a/src/modules/14_KPI/components/competency/Forms/01_FormMain.vue b/src/modules/14_KPI/components/competency/Forms/01_FormMain.vue
index d2fe1fd39..ff81b77d8 100644
--- a/src/modules/14_KPI/components/competency/Forms/01_FormMain.vue
+++ b/src/modules/14_KPI/components/competency/Forms/01_FormMain.vue
@@ -1,5 +1,160 @@
+div
+<script setup lang="ts">
+import { ref, reactive } from "vue";
+const formData = reactive({
+  competencyType: "",
+  competencyName: "",
+  definition: "",
+  levels: [
+    {
+      level: "1",
+      description: "",
+    },
+  ],
+
+  evaluation: "",
+});
+
+function ocClickAdd() {
+  if (formData.levels.length !== 6) {
+    const levelName = formData.levels.length + 1;
+    const data = {
+      level: levelName.toString(),
+      description: "",
+    };
+    formData.levels.push(data);
+  }
+}
+
+function onSubmit() {
+  console.log(formData);
+}
+</script>
+
 <template>
-    <div>
-        สมรรถนะหลัก
+  <q-form greedy @submit.prevent @validation-success="onSubmit" class="col-12">
+    <div class="row q-col-gutter-sm">
+      <div class="col-12">
+        <q-input
+          v-model="formData.competencyName"
+          dense
+          outlined
+          label="ชื่อสมรรถนะ"
+          :rules="[(val:string) => !!val || `${'กรุณากรอกชื่อสมรรถนะ'}`,]"
+          hide-bottom-space
+        />
+      </div>
+      <div class="col-12">
+        <q-input
+          v-model="formData.definition"
+          label="คำจำกัดความ"
+          dense
+          type="textarea"
+          outlined
+          :rules="[(val:string) => !!val || `${'กรุณากรอกคำจำกัดความ'}`,]"
+          hide-bottom-space
+        />
+      </div>
+      <div class="col-12">
+        <q-card flat bordered>
+          <q-card-section class="bg-grey-4">
+            <div
+              class="row items-center text-dark text-body2 text-weight-medium"
+            >
+              <div class="col-3">
+                <div class="row items-center">
+                  <div class="col-1">
+                    <q-btn
+                      dense
+                      flat
+                      round
+                      color="primary"
+                      icon="add"
+                      @click="ocClickAdd"
+                    >
+                      <q-tooltip>เพิ่ม</q-tooltip></q-btn
+                    >
+                  </div>
+                  <div class="col-11 text-center">
+                    <span>ระดับสมรรถนะ</span>
+                  </div>
+                </div>
+              </div>
+              <div class="col-4">
+                <span>คำอธิบายระดับ/พฤติกรรมที่คาดหวัง/พฤติกรรมย่อย</span>
+              </div>
+            </div>
+          </q-card-section>
+          <q-card-section>
+            <div
+              class="row q-pa-sm"
+              v-for="(items, index) in formData.levels"
+              key="index"
+            >
+              <div
+                class="col-3 text-center self-center text-body1 text-weight-medium"
+              >
+                <span>{{ items.level }}</span>
+              </div>
+              <div class="col-9">
+                <q-editor
+                  v-model="formData.levels[index].description"
+                  :dense="$q.screen.lt.md"
+                  min-height="5rem"
+                  :toolbar="[
+                    [
+                      'bold',
+                      'italic',
+                      'strike',
+                      'underline',
+                      'subscript',
+                      'superscript',
+                    ],
+
+                    ['unordered', 'ordered'],
+                  ]"
+                  :fonts="{
+                    arial: 'Arial',
+                    arial_black: 'Arial Black',
+                    comic_sans: 'Comic Sans MS',
+                    courier_new: 'Courier New',
+                    impact: 'Impact',
+                    lucida_grande: 'Lucida Grande',
+                    times_new_roman: 'Times New Roman',
+                    verdana: 'Verdana',
+                  }"
+                />
+              </div>
+            </div>
+          </q-card-section>
+        </q-card>
+      </div>
+      <div class="col-12">
+        <q-input
+          v-model="formData.evaluation"
+          label="กำหนดเกณฑ์การประเมิน"
+          dense
+          type="textarea"
+          outlined
+          :rules="[(val:string) => !!val || `${'กรุณากรอกกำหนดเกณฑ์การประเมิน'}`,]"
+          hide-bottom-space
+        />
+      </div>
+      <div class="col-12"><q-separator /></div>
+      <div class="col-12 row justify-end">
+        <q-btn
+          dense
+          unelevated
+          label="บันทึก"
+          color="public"
+          class="q-px-md"
+          type="submit"
+        >
+          <q-tooltip>บันทึกข้อมูล</q-tooltip>
+        </q-btn>
+      </div>
     </div>
-</template>
\ No newline at end of file
+  </q-form>
+</template>
+
+<style scoped></style>
diff --git a/src/modules/14_KPI/components/competency/Forms/03_FormExecutive.vue b/src/modules/14_KPI/components/competency/Forms/03_FormExecutive.vue
index c170c3da3..68d522f34 100644
--- a/src/modules/14_KPI/components/competency/Forms/03_FormExecutive.vue
+++ b/src/modules/14_KPI/components/competency/Forms/03_FormExecutive.vue
@@ -1,5 +1,275 @@
+<script setup lang="ts">
+import { ref, reactive, onMounted } from "vue";
+import { useQuasar } from "quasar";
+import http from "@/plugins/http";
+import config from "@/app.config";
+
+import { useCounterMixin } from "@/stores/mixin";
+
+const $q = useQuasar();
+const { dialogConfirm, showLoader, success, hideLoader, messageError } =
+  useCounterMixin();
+
+const formData = reactive({
+  competencyType: "",
+  competencyName: "",
+  definition: "",
+  level: ["", "", "", "", "", ""],
+  form: [
+    {
+      posType: "",
+      posLevel: "",
+      description: "",
+      description2: "",
+    },
+  ],
+  evaluation: "",
+});
+
+const dataLevel = ref<any>([]);
+const typeOp = ref<any>([]);
+const levelOp = ref<any>([]);
+const typeOpsMain = ref<any>([]);
+const levelOpsMain = ref<any>([]);
+
+function ocClickAdd() {
+  if (formData.form.length !== 6) {
+    const data = {
+      posType: "",
+      posLevel: "",
+      description: "",
+      description2: "",
+    };
+    formData.form.push(data);
+  }
+}
+
+/** function เรียกรายการประเภทตำแหน่ง */
+function fetchType() {
+  showLoader();
+  http
+    .get(config.API.orgPosType)
+    .then((res) => {
+      const data = res.data.result;
+      dataLevel.value = data;
+      typeOpsMain.value = data.map((e: any) => ({
+        id: e.id,
+        name: e.posTypeName,
+      }));
+      typeOp.value = typeOpsMain.value;
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+}
+
+function updateSelectType(val: string, index: number) {
+  const listLevel = dataLevel.value.find((e: any) => e.id === val);
+  levelOpsMain.value = listLevel.posLevels.map((e: any) => ({
+    id: e.id,
+    name: e.posLevelName,
+  }));
+  levelOp.value = levelOpsMain.value;
+  formData.form[index].posLevel = "";
+}
+
+function onSubmit() {
+  dialogConfirm($q, () => {
+    console.log(formData);
+  });
+}
+
+onMounted(() => {
+  fetchType();
+});
+</script>
+
 <template>
-    <div>
-        สมรรถนะประจำผู้บริหารกรุงเทพมหานคร
+  <q-form greedy @submit.prevent @validation-success="onSubmit" class="col-12">
+    <div class="row q-col-gutter-sm">
+      <div class="col-12">
+        <q-input
+          v-model="formData.competencyName"
+          dense
+          outlined
+          label="ชื่อสมรรถนะ"
+          :rules="[(val:string) => !!val || `${'กรุณากรอกชื่อสมรรถนะ'}`,]"
+          hide-bottom-space
+        />
+      </div>
+      <div class="col-12">
+        <q-input
+          v-model="formData.definition"
+          label="คำจำกัดความ"
+          dense
+          type="textarea"
+          outlined
+          :rules="[(val:string) => !!val || `${'กรุณากรอกคำจำกัดความ'}`,]"
+          hide-bottom-space
+        />
+      </div>
+      <div class="col-12">
+        <q-card flat bordered>
+          <q-card-section class="bg-grey-4">
+            <div
+              class="row items-center text-dark text-body2 text-weight-medium"
+            >
+              <div class="col-3">
+                <div class="row items-center">
+                  <div class="col-1">
+                    <q-btn
+                      dense
+                      flat
+                      round
+                      color="primary"
+                      icon="add"
+                      @click="ocClickAdd"
+                    >
+                      <q-tooltip>เพิ่ม</q-tooltip></q-btn
+                    >
+                  </div>
+                  <div class="col-11 text-center">
+                    <span>ประเภทตำแหน่ง</span>
+                  </div>
+                </div>
+              </div>
+              <div class="col-3 text-center">
+                <span>ระดับตำแห่นง</span>
+              </div>
+              <div class="col-6">
+                <span>คำอธิบายระดับ/พฤติกรรมที่คาดหวัง/พฤติกรรมย่อย</span>
+              </div>
+            </div>
+          </q-card-section>
+          <q-card-section>
+            <div
+              class="row q-pa-sm q-col-gutter-sm"
+              v-for="(items, index) in formData.form"
+              key="index"
+            >
+              <div class="col-3 text-center">
+                <q-select
+                  v-model="formData.form[index].posType"
+                  outlined
+                  label="ประเภทตำแหน่ง"
+                  dense
+                  option-label="name"
+                  option-value="id"
+                  :options="typeOp"
+                  emit-value
+                  map-options
+                  :rules="[(val:string) => !!val || `${'กรุณาเลือกประเภทตำแหน่ง'}`,]"
+                  hide-bottom-space
+                  @update:model-value="
+                    updateSelectType(formData.form[index].posType, index)
+                  "
+                />
+              </div>
+              <div class="col-3 text-center">
+                <q-select
+                  v-model="formData.form[index].posLevel"
+                  outlined
+                  label="ระดับตำแหน่ง"
+                  dense
+                  option-label="name"
+                  option-value="id"
+                  :options="levelOp"
+                  emit-value
+                  map-options
+                  :rules="[(val:string) => !!val || `${'กรุณาเลือกระดับตำแหน่ง'}`,]"
+                  hide-bottom-space
+                />
+              </div>
+              <div class="col-6">
+                <q-editor
+                  v-model="formData.form[index].description"
+                  :dense="$q.screen.lt.md"
+                  min-height="5rem"
+                  :toolbar="[
+                    [
+                      'bold',
+                      'italic',
+                      'strike',
+                      'underline',
+                      'subscript',
+                      'superscript',
+                    ],
+
+                    ['unordered', 'ordered'],
+                  ]"
+                  :fonts="{
+                    arial: 'Arial',
+                    arial_black: 'Arial Black',
+                    comic_sans: 'Comic Sans MS',
+                    courier_new: 'Courier New',
+                    impact: 'Impact',
+                    lucida_grande: 'Lucida Grande',
+                    times_new_roman: 'Times New Roman',
+                    verdana: 'Verdana',
+                  }"
+                />
+                <q-editor
+                  v-model="formData.form[index].description2"
+                  :dense="$q.screen.lt.md"
+                  min-height="5rem"
+                  :toolbar="[
+                    [
+                      'bold',
+                      'italic',
+                      'strike',
+                      'underline',
+                      'subscript',
+                      'superscript',
+                    ],
+
+                    ['unordered', 'ordered'],
+                  ]"
+                  :fonts="{
+                    arial: 'Arial',
+                    arial_black: 'Arial Black',
+                    comic_sans: 'Comic Sans MS',
+                    courier_new: 'Courier New',
+                    impact: 'Impact',
+                    lucida_grande: 'Lucida Grande',
+                    times_new_roman: 'Times New Roman',
+                    verdana: 'Verdana',
+                  }"
+                />
+              </div>
+              <div class="col-12"><q-separator /></div>
+            </div>
+          </q-card-section>
+        </q-card>
+      </div>
+      <div class="col-12">
+        <q-input
+          v-model="formData.evaluation"
+          label="กำหนดเกณฑ์การประเมิน"
+          dense
+          type="textarea"
+          outlined
+          :rules="[(val:string) => !!val || `${'กรุณากรอกกำหนดเกณฑ์การประเมิน'}`,]"
+          hide-bottom-space
+        />
+      </div>
+      <div class="col-12"><q-separator /></div>
+      <div class="col-12 row justify-end">
+        <q-btn
+          dense
+          unelevated
+          label="บันทึก"
+          color="public"
+          class="q-px-md"
+          type="submit"
+        >
+          <q-tooltip>บันทึกข้อมูล</q-tooltip>
+        </q-btn>
+      </div>
     </div>
-</template>
\ No newline at end of file
+  </q-form>
+</template>
+
+<style scoped></style>
diff --git a/src/modules/15_development/components/scholarship/DetailView.vue b/src/modules/15_development/components/scholarship/DetailView.vue
index e2f05f71f..11d0173d6 100644
--- a/src/modules/15_development/components/scholarship/DetailView.vue
+++ b/src/modules/15_development/components/scholarship/DetailView.vue
@@ -85,6 +85,7 @@ const dataGuarantor = reactive({
 });
 
 const formBody = reactive<FormsSholarship>({
+  profileId: "",
   rank: "", //ยศ
   prefix: "", //คำนำหน้าชื่อ
   firstName: "", //ชื่อ
@@ -346,6 +347,9 @@ function onSelectGov(isGov: boolean) {
 
 function upDate(data: DataPerson) {
   if (isSelectGov.value) {
+    console.log(data);
+    formBody.profileId = data.id;
+    formBody.rank = data.rank;
     formBody.prefix = data.prefix;
     formBody.firstName = data.firstName;
     formBody.lastName = data.lastName;
@@ -364,6 +368,7 @@ function upDate(data: DataPerson) {
     dataPerson.positionSide = data.positionSide ? data.positionSide : "-";
     isGov.value = true;
   } else {
+    formBody.guarantorRank = data.rank;
     formBody.guarantorPrefix = data.prefix;
     formBody.guarantorFirstName = data.firstName;
     formBody.guarantorLastName = data.lastName;
diff --git a/src/modules/15_development/interface/request/Scholarship.ts b/src/modules/15_development/interface/request/Scholarship.ts
index 4c02f519d..226105b54 100644
--- a/src/modules/15_development/interface/request/Scholarship.ts
+++ b/src/modules/15_development/interface/request/Scholarship.ts
@@ -1,4 +1,5 @@
 interface FormsSholarship {
+  profileId: string;
   rank: string; //ยศ
   prefix: string; //คำนำหน้าชื่อ
   firstName: string; //ชื่อ

From 2e5fd500a3bd81de0cd1815f14e6bf50153e68ec Mon Sep 17 00:00:00 2001
From: waruneeauy <warunee.auy@gmail.com>
Date: Wed, 10 Apr 2024 16:27:45 +0700
Subject: [PATCH 4/5] updated

---
 src/modules/13_salary/store/SalaryListsStore.ts  | 6 +++---
 src/modules/15_development/views/Scholarship.vue | 3 ++-
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/modules/13_salary/store/SalaryListsStore.ts b/src/modules/13_salary/store/SalaryListsStore.ts
index c601e168b..d94245e00 100644
--- a/src/modules/13_salary/store/SalaryListsStore.ts
+++ b/src/modules/13_salary/store/SalaryListsStore.ts
@@ -134,15 +134,15 @@ export const useSalaryListSDataStore = defineStore("salaryListStore", () => {
       name: "แบบ 3 กท บัญชีแสดงวันลาครึ่งปี ขรก. (เกษียณอายุราชการ)",
     },
     {
-      id: "gov-07",
+      id: "gov-07-01",
       name: "แนบท้ายคำสั่งเลื่อนเงินเดือนข้าราชการเกษียณ",
     },
     {
-      id: "gov-08",
+      id: "gov-07",
       name: "แนบท้ายคำสั่งเลื่อนเงินเดือน รอบตุลาคม",
     },
     {
-      id: "gov-09",
+      id: "gov-08",
       name: "แนบท้ายคำสั่งค่าตอบแทนพิเศษ และผู้ไม่ได้เลื่อนเงินเดือน รอบตุลาคม",
     },
   ]);
diff --git a/src/modules/15_development/views/Scholarship.vue b/src/modules/15_development/views/Scholarship.vue
index 646d2f1c6..c9cf3cfbd 100644
--- a/src/modules/15_development/views/Scholarship.vue
+++ b/src/modules/15_development/views/Scholarship.vue
@@ -217,6 +217,7 @@ onMounted(() => {
       <div class="row q-gutter-sm">
         <div>
           <datepicker
+          style="width: 150px;"
             menu-class-name="modalfix"
             v-model="formQuery.year"
             :locale="'th'"
@@ -272,7 +273,7 @@ onMounted(() => {
             option-label="name"
             label="เลือกประเภททุน"
             @update:model-value="fetchNewList"
-            style="width: 400px;"
+            style="width: 350px;"
           />
         </div>
       </div>

From e97d99ae4dccb0d51dbba0ddf9e994eb948131d2 Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Wed, 10 Apr 2024 16:31:26 +0700
Subject: [PATCH 5/5] =?UTF-8?q?=E0=B8=A3=E0=B8=B2=E0=B8=A2=E0=B8=81?=
 =?UTF-8?q?=E0=B8=B2=E0=B8=A3=E0=B9=82=E0=B8=84=E0=B8=A3=E0=B8=87=E0=B8=81?=
 =?UTF-8?q?=E0=B8=B2=E0=B8=A3/=E0=B8=AB=E0=B8=A5=E0=B8=B1=E0=B8=81?=
 =?UTF-8?q?=E0=B8=AA=E0=B8=B9=E0=B8=95=E0=B8=A3=E0=B8=81=E0=B8=B2=E0=B8=A3?=
 =?UTF-8?q?=E0=B8=9D=E0=B8=B6=E0=B8=81=E0=B8=AD=E0=B8=9A=E0=B8=A3=E0=B8=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../15_development/components/MainTab.vue     |  8 +++--
 .../components/ProjectDetail.vue              | 36 +++++++++----------
 .../15_development/interface/request/Main.ts  |  1 -
 .../15_development/interface/response/Main.ts |  2 +-
 4 files changed, 23 insertions(+), 24 deletions(-)

diff --git a/src/modules/15_development/components/MainTab.vue b/src/modules/15_development/components/MainTab.vue
index e0dbba93f..7d4c29b18 100644
--- a/src/modules/15_development/components/MainTab.vue
+++ b/src/modules/15_development/components/MainTab.vue
@@ -54,7 +54,7 @@ function fetchDataProject(id: string) {
       store.formAddProject.reason = data.reason;
       store.formAddProject.objective = data.objective;
       /**เป้าหมาย*/
-      const plannedGoals = data.plannedGoals.map((e: ResPlannedGoals) => ({
+      const plannedGoals = data.plannedGoals.map((e: any) => ({
         groupTarget: e.groupTarget,
         groupTargetSub: e.groupTargetSub,
         positions: e.plannedGoalPositions.map((v: any) => ({
@@ -117,7 +117,11 @@ function fetchDataProject(id: string) {
       store.formAddProject.dateEnd = data.dateEnd;
       store.formAddProject.totalDate = data.totalDate;
       store.formAddProject.address = data.address;
-      store.formAddProject.provinceIds = data.provinceIds;
+
+      const provinces = data.provinces.map((e: any) => e.id);
+      const provincesId = [...provinces];
+      store.formAddProject.provinceIds = provincesId;
+
       store.formAddProject.budget = data.budget;
       store.formAddProject.accept = data.accept;
       store.formAddProject.receive = data.receive;
diff --git a/src/modules/15_development/components/ProjectDetail.vue b/src/modules/15_development/components/ProjectDetail.vue
index a564464ac..d3f44a818 100644
--- a/src/modules/15_development/components/ProjectDetail.vue
+++ b/src/modules/15_development/components/ProjectDetail.vue
@@ -9,30 +9,26 @@ import { useDevelopmentDataStore } from "@/modules/15_development/store/developm
 const store = useDevelopmentDataStore();
 
 const projectTypeOp = ref<DataOption[]>([
-  { id: "1", name: "โครงการตามยุทธศาสตร์" },
-  { id: "2", name: "โครงการตามภารกิจประจำของหน่วยงาน" },
-  { id: "3", name: "โครงการใหม่" },
-  { id: "4", name: "โครงการต่อเนื่อง" },
+  { id: "STRATEGIC_PROJECT", name: "โครงการตามยุทธศาสตร์" },
+  { id: "MISSION_PROJECT", name: "โครงการตามภารกิจประจำของหน่วยงาน" },
+  { id: "NEW_PROJECT", name: "โครงการใหม่" },
+  { id: "ONGOING_PROJEC", name: "โครงการต่อเนื่อง" },
 ]);
 const projectCharacteristicsOp = ref<DataOption[]>([
-  { id: "1", name: "ไป-กลับ" },
-  { id: "2", name: "พักค้าง" },
-  { id: "3", name: "ไป-กลับและพักค้าง" },
+  { id: "GO_BACK", name: "ไป-กลับ" },
+  { id: "HOLD", name: "พักค้าง" },
+  { id: "GO_BACK_HOLD", 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: "การฝึกศึกษา" },
+  { id: "TRAINING", name: "การอบรม" },
+  { id: "MEETING", name: "การประชุม" },
+  { id: "SEMINAR", name: "การสัมมนา" },
+  { id: "STUDY_TOUR", name: "การศึกษาดูงาน" },
+  { id: "ACADEMIC_SEMINAR", name: "การสัมมนาทางวิชาการ" },
+  { id: "WORKSHOP", name: "การสัมมนาเชิงปฏิบัติการ" },
+  { id: "SPECIAL_LECTURE", name: "การบรรยายพิเศษ" },
+  { id: "STUDY_TRAINING", name: "การฝึกศึกษา" },
 ]);
-
-onMounted(() => {
-  console.log("ลักษณะโครงการ");
-});
 </script>
 <template>
   <div class="row q-pa-md q-col-gutter-sm">
@@ -74,7 +70,7 @@ onMounted(() => {
     </div>
     <div class="col-12 col-sm-6 col-md-2">
       <q-input
-        v-if="store.formAddProject.projectCharacteristics !== '1'"
+        v-if="store.formAddProject.projectCharacteristics !== 'GO_BACK'"
         dense
         outlined
         v-model="store.formAddProject.projectNigth"
diff --git a/src/modules/15_development/interface/request/Main.ts b/src/modules/15_development/interface/request/Main.ts
index 3d262f021..ffa383090 100644
--- a/src/modules/15_development/interface/request/Main.ts
+++ b/src/modules/15_development/interface/request/Main.ts
@@ -39,7 +39,6 @@ interface FormGroupTargetPlannedGoal {
       posLevelPlannedId: string;
     }
   ];
-
   groupTarget: string;
   groupTargetSub: string;
   position: string;
diff --git a/src/modules/15_development/interface/response/Main.ts b/src/modules/15_development/interface/response/Main.ts
index 392510085..66346ba53 100644
--- a/src/modules/15_development/interface/response/Main.ts
+++ b/src/modules/15_development/interface/response/Main.ts
@@ -43,7 +43,7 @@ interface ResDataProject {
   dateEnd: Date | null;
   totalDate: number | null;
   address: string;
-  provinceIds: any;
+  provinces: any;
   budget: string;
   accept: number | string | null;
   receive: number | string | null;