From 38dcbb3428d2f6145d18d930d6d6faf14967707e Mon Sep 17 00:00:00 2001
From: waruneeauy <warunee.auy@gmail.com>
Date: Thu, 11 Apr 2024 17:51:03 +0700
Subject: [PATCH 1/7] =?UTF-8?q?=E0=B8=9B=E0=B8=A3=E0=B8=B1=E0=B8=9A?=
 =?UTF-8?q?=E0=B8=AA=E0=B8=A1=E0=B8=A3=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

---
 .../competency/01ListCompetency.vue           |   7 +-
 .../14_KPI/components/competency/AddPage.vue  |  14 +-
 .../competency/Forms/01_FormMain.vue          |   4 +-
 .../competency/Forms/02_FormGroup.vue         | 175 +++++++++++-------
 .../competency/Forms/03_FormExecutive.vue     |   4 +-
 .../Forms/04_FormExecutivePosition.vue        |   9 +-
 .../Forms/05_FormExecutiveLevel.vue           |   6 +-
 src/modules/14_KPI/store/KPIStore.ts          |   7 +-
 8 files changed, 138 insertions(+), 88 deletions(-)

diff --git a/src/modules/14_KPI/components/competency/01ListCompetency.vue b/src/modules/14_KPI/components/competency/01ListCompetency.vue
index 0b182794f..15a4da022 100644
--- a/src/modules/14_KPI/components/competency/01ListCompetency.vue
+++ b/src/modules/14_KPI/components/competency/01ListCompetency.vue
@@ -5,10 +5,14 @@ import { useCounterMixin } from "@/stores/mixin";
 import { useQuasar } from "quasar";
 import { useRouter } from "vue-router";
 
+import { useKPIDataStore } from "@/modules/14_KPI/store/KPIStore";
+
 import type { DataOption } from "@/modules/14_KPI/interface/index/Main";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
+const store = useKPIDataStore();
+
 const router = useRouter();
 const rows = ref<any>();
 
@@ -52,7 +56,6 @@ const $q = useQuasar();
 const mixin = useCounterMixin();
 const { dialogRemove, messageError, showLoader, hideLoader, success } = mixin;
 
-const competencyType = ref<string>("ID1");
 const filterKeyword = ref<string>("");
 
 const visibleColumns = ref<string[]>(["competency"]);
@@ -130,7 +133,7 @@ onMounted(async () => {
 <template>
   <q-toolbar style="padding: 0">
     <q-select
-      v-model="competencyType"
+      v-model="store.competencyType"
       outlined
       label="ประเภทสมรรถนะ"
       dense
diff --git a/src/modules/14_KPI/components/competency/AddPage.vue b/src/modules/14_KPI/components/competency/AddPage.vue
index ec5f9284e..dd408e6f9 100644
--- a/src/modules/14_KPI/components/competency/AddPage.vue
+++ b/src/modules/14_KPI/components/competency/AddPage.vue
@@ -7,11 +7,13 @@ import FormGroup from "@/modules/14_KPI/components/competency/Forms/02_FormGroup
 import FormExecutive from "@/modules/14_KPI/components/competency/Forms/03_FormExecutive.vue";
 import FormExecutivePosition from "@/modules/14_KPI/components/competency/Forms/04_FormExecutivePosition.vue";
 import FormExecutiveLevel from "@/modules/14_KPI/components/competency/Forms/05_FormExecutiveLevel.vue";
+import { useKPIDataStore } from "@/modules/14_KPI/store/KPIStore";
 
 import type { DataOption } from "@/modules/14_KPI/interface/index/Main";
 import type { FormCompetency } from "@/modules/14_KPI/interface/request/Main";
 
 const router = useRouter();
+const store = useKPIDataStore();
 
 const formData = reactive<FormCompetency>({
   competencyType: "",
@@ -92,7 +94,7 @@ function onSubmit() {
       <div class="row q-col-gutter-sm">
         <div class="col-12">
           <q-select
-            v-model="formData.competencyType"
+            v-model="store.competencyType"
             outlined
             label="เลือกประเภทสมรรถนะ"
             dense
@@ -106,11 +108,11 @@ function onSubmit() {
           />
         </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'" />
-        <FormExecutiveLevel v-else-if="formData.competencyType === 'ID5'" />
+        <FormMain v-if="store.competencyType === 'ID1'" />
+        <FormGroup v-else-if="store.competencyType === 'ID2'" />
+        <FormExecutive v-else-if="store.competencyType === 'ID3'" />
+        <FormExecutivePosition v-else-if="store.competencyType === 'ID4'" />
+        <FormExecutiveLevel v-else-if="store.competencyType === 'ID5'" />
 
         <!-- <div class="col-12">
             <q-input
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 ff81b77d8..fb01b5b5f 100644
--- a/src/modules/14_KPI/components/competency/Forms/01_FormMain.vue
+++ b/src/modules/14_KPI/components/competency/Forms/01_FormMain.vue
@@ -76,12 +76,12 @@ function onSubmit() {
                     >
                   </div>
                   <div class="col-11 text-center">
-                    <span>ระดับสมรรถนะ</span>
+                    <span>ระดับ</span>
                   </div>
                 </div>
               </div>
               <div class="col-4">
-                <span>คำอธิบายระดับ/พฤติกรรมที่คาดหวัง/พฤติกรรมย่อย</span>
+                <span>คำอธิบายระดับ</span>
               </div>
             </div>
           </q-card-section>
diff --git a/src/modules/14_KPI/components/competency/Forms/02_FormGroup.vue b/src/modules/14_KPI/components/competency/Forms/02_FormGroup.vue
index be54053d0..72cc3e0f3 100644
--- a/src/modules/14_KPI/components/competency/Forms/02_FormGroup.vue
+++ b/src/modules/14_KPI/components/competency/Forms/02_FormGroup.vue
@@ -13,6 +13,7 @@ interface FormGroup {
   name: string;
   definition: string;
   detailLevel: DetailLevelType[];
+  evaluation: string;
 }
 
 const fieldLabels = {
@@ -35,76 +36,112 @@ const formData = reactive<FormGroup>({
   name: "",
   definition: "",
   detailLevel: [],
+  evaluation: "",
 });
-</script>
-<template>
-  <div class="col-12">
-    <q-input label="ชื่อสมรรถนะ" outlined v-model="formData.name" dense />
-  </div>
-  <div class="col-12">
-    <q-input
-      label="คำจำกัดความ"
-      outlined
-      v-model="formData.definition"
-      dense
-      type="textarea"
-    />
-  </div>
-  <div class="col-12">
-    <q-card flat bordered>
-      <q-card-section class="bg-grey-4 q-pa-sm">
-        <div class="row text-dark text-body2 text-weight-medium">
-          <div class="text-center col-4">ระดับสมรรถนะ</div>
-          <div class="col-8">คำอธิบายระดับ</div>
-        </div>
-      </q-card-section>
-      <q-card-section class="q-pa-none">
-        <div
-          v-for="(field, index) in Object.keys(fieldLabels)"
-          :key="index + 1"
-        >
-          <div class="row q-pa-sm">
-            <div class="col-4 text-center text-body1 text-weight-bold self-center">
-              {{ fieldLabels[field as keyof typeof fieldLabels] }}
-            </div>
-            <div class="col-8 text-left">
-              <q-editor
-                v-model="formScore[field]"
-                :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',
-                }"
-              />
+function onSubmit() {
+  console.log(formData);
+}
+</script>
+
+<template>
+  <q-form greedy @submit.prevent @validation-success="onSubmit" class="col-12">
+    <div class="row q-col-gutter-sm">
+      <div class="col-12">
+        <q-input label="ชื่อสมรรถนะ" outlined v-model="formData.name" dense />
+      </div>
+      <div class="col-12">
+        <q-input
+          label="คำจำกัดความ"
+          outlined
+          v-model="formData.definition"
+          dense
+          type="textarea"
+        />
+      </div>
+      <div class="col-12">
+        <q-card flat bordered>
+          <q-card-section class="bg-grey-4 q-pa-sm">
+            <div class="row text-dark text-body2 text-weight-medium">
+              <div class="text-center col-4">ระดับ</div>
+              <div class="col-8">มาตรฐานพฤติกรรม</div>
             </div>
-          </div>
-          <div
-            class="col-12"
-            v-if="index !== Object.keys(fieldLabels).length - 1"
-          >
-            <q-separator />
-          </div>
-        </div>
-      </q-card-section>
-    </q-card>
-  </div>
+          </q-card-section>
+          <q-card-section class="q-pa-none">
+            <div
+              v-for="(field, index) in Object.keys(fieldLabels)"
+              :key="index + 1"
+            >
+              <div class="row q-pa-sm">
+                <div
+                  class="col-4 text-center text-body1 text-weight-bold self-center"
+                >
+                  {{ fieldLabels[field as keyof typeof fieldLabels] }}
+                </div>
+                <div class="col-8 text-left">
+                  <q-editor
+                    v-model="formScore[field]"
+                    :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>
+              <div
+                class="col-12"
+                v-if="index !== Object.keys(fieldLabels).length - 1"
+              >
+                <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>
+  </q-form>
 </template>
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 68d522f34..09085cba9 100644
--- a/src/modules/14_KPI/components/competency/Forms/03_FormExecutive.vue
+++ b/src/modules/14_KPI/components/competency/Forms/03_FormExecutive.vue
@@ -137,10 +137,10 @@ onMounted(() => {
                 </div>
               </div>
               <div class="col-3 text-center">
-                <span>ระดับตำแห่นง</span>
+                <span>ระดับ</span>
               </div>
               <div class="col-6">
-                <span>คำอธิบายระดับ/พฤติกรรมที่คาดหวัง/พฤติกรรมย่อย</span>
+                <span>มาตรฐานพฤติกรรม</span>
               </div>
             </div>
           </q-card-section>
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 25eb3a087..76b513cad 100644
--- a/src/modules/14_KPI/components/competency/Forms/04_FormExecutivePosition.vue
+++ b/src/modules/14_KPI/components/competency/Forms/04_FormExecutivePosition.vue
@@ -105,7 +105,8 @@ async function onSubmit() {
                   label-slot
                   borderless
                   :rules="[
-                    (val) => !!val || 'กรุณากรอก L1 ระดับ หัวหน้าฝ่ายในสังกัด',
+                    (val) =>
+                      !!val || 'กรุณาระบุคำอธิบาย L1 ระดับ หัวหน้าฝ่ายในสังกัด',
                   ]"
                   hide-bottom-space
                 >
@@ -158,7 +159,8 @@ async function onSubmit() {
                   borderless
                   :rules="[
                     (val) =>
-                      !!val || 'กรุณากรอก L2 ระดับ ผู้ช่วยผู้อำนวยการเขต',
+                      !!val ||
+                      'กรุณาระบุคำอธิบาย L2 ระดับ ผู้ช่วยผู้อำนวยการเขต',
                   ]"
                   hide-bottom-space
                 >
@@ -210,7 +212,8 @@ async function onSubmit() {
                   label-slot
                   borderless
                   :rules="[
-                    (val) => !!val || 'กรุณากรอก L3 ระดับ ผู้อำนวยการเขต',
+                    (val) =>
+                      !!val || 'กรุณาระบุคำอธิบาย L3 ระดับ ผู้อำนวยการเขต',
                   ]"
                   hide-bottom-space
                 >
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 68a3e829d..51940f818 100644
--- a/src/modules/14_KPI/components/competency/Forms/05_FormExecutiveLevel.vue
+++ b/src/modules/14_KPI/components/competency/Forms/05_FormExecutiveLevel.vue
@@ -105,7 +105,8 @@ async function onSubmit() {
                   label-slot
                   borderless
                   :rules="[
-                    (val) => !!val || 'กรุณากรอก L1 ประเภทอำนวยการ ระดับสูง',
+                    (val) =>
+                      !!val || 'กรุณาระบุคำอธิบาย L1 ประเภทอำนวยการ ระดับสูง',
                   ]"
                   hide-bottom-space
                 >
@@ -157,7 +158,8 @@ async function onSubmit() {
                   label-slot
                   borderless
                   :rules="[
-                    (val) => !!val || 'กรุณากรอก L2 ประเภทบริหาร ระดับสูง',
+                    (val) =>
+                      !!val || 'กรุณาระบุคำอธิบาย L2 ประเภทบริหาร ระดับสูง',
                   ]"
                   hide-bottom-space
                 >
diff --git a/src/modules/14_KPI/store/KPIStore.ts b/src/modules/14_KPI/store/KPIStore.ts
index b1d37a987..58894b277 100644
--- a/src/modules/14_KPI/store/KPIStore.ts
+++ b/src/modules/14_KPI/store/KPIStore.ts
@@ -1,6 +1,9 @@
 import { defineStore } from "pinia";
+import { ref } from "vue";
 
-// store 
+// store
 export const useKPIDataStore = defineStore("KPIDataStore", () => {
-  return {};
+  const competencyType = ref<string>("ID1");
+
+  return { competencyType };
 });

From 12f32976887cfa32a1c1c85b969052832dc4df13 Mon Sep 17 00:00:00 2001
From: oat_dev <nattapon@frappet.com>
Date: Thu, 11 Apr 2024 18:08:12 +0700
Subject: [PATCH 2/7] =?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=B8=9B=E0=B8=A3?=
 =?UTF-8?q?=E0=B8=B1=E0=B8=9A=E0=B9=81=E0=B8=81=E0=B9=89=E0=B9=84=E0=B8=82?=
 =?UTF-8?q?=E0=B8=9A=E0=B8=B1=E0=B8=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/modules/15_development/components/Target.vue | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

diff --git a/src/modules/15_development/components/Target.vue b/src/modules/15_development/components/Target.vue
index f1eee1af3..e41b2cd14 100644
--- a/src/modules/15_development/components/Target.vue
+++ b/src/modules/15_development/components/Target.vue
@@ -54,7 +54,7 @@ const columnsPlannedGoals = ref<QTableProps["columns"]>([
   {
     name: "posTypePlannedId",
     align: "left",
-    label: "ประเภท",
+    label: "ตำแหน่ง",
     sortable: true,
     field: "posTypePlannedId",
     headerStyle: "font-size: 14px",
@@ -87,7 +87,7 @@ const columnsActualGoals = ref<QTableProps["columns"]>([
   {
     name: "posTypeActualId",
     align: "left",
-    label: "ประเภท",
+    label: "ตำแหน่ง",
     sortable: true,
     field: "posTypeActualId",
     headerStyle: "font-size: 14px",
@@ -200,6 +200,7 @@ function fetchType() {
           id: e.id,
           name: e.posTypeName,
         }));
+        console.log(data);
       })
       .catch((err) => {
         messageError($q, err);
@@ -542,7 +543,6 @@ onMounted(() => {
                     () => {
                       isEdit = true;
                       isTarget = 'planned';
-
                       editId = props.row.id;
                       formGroupTarget.type = props.row.type;
                       formGroupTarget.groupTarget = props.row.groupTarget;
@@ -550,6 +550,7 @@ onMounted(() => {
                       formGroupTarget.amount = props.row.amount;
                       formGroupTarget.positions =
                         props.row.plannedGoalPositions;
+
                       newModalGroupTarget = true;
                     }
                   "
@@ -686,7 +687,6 @@ onMounted(() => {
                   @click="
                     () => {
                       isEdit = true;
-
                       isTarget = 'actual';
                       editId = props.row.id;
                       formGroupTarget.type = props.row.type;
@@ -1106,8 +1106,11 @@ onMounted(() => {
                   lazy-rules
                   class="inputgreen"
                   v-model="items.posLevelPlannedId"
-                  :options="posLevelOp"
-                  option-label="name"
+                  :options="
+                    posTypeMain.find((v) => items.posTypePlannedId === v.id)
+                      ?.posLevels || []
+                  "
+                  option-label="posLevelName"
                   option-value="id"
                   emit-value
                   map-options

From 239d5476a92f3c07d355afe0bf566137d15f214e Mon Sep 17 00:00:00 2001
From: "STW_TTTY\\stwtt" <trx.setthawut@gmail.com>
Date: Wed, 17 Apr 2024 10:55:23 +0700
Subject: [PATCH 3/7] muti

---
 .../14_KPI/components/competency/03ListLinkGroup.vue        | 6 ++++--
 .../15_development/components/scholarship/DetailView.vue    | 1 +
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/modules/14_KPI/components/competency/03ListLinkGroup.vue b/src/modules/14_KPI/components/competency/03ListLinkGroup.vue
index 72393cce5..e1719bc27 100644
--- a/src/modules/14_KPI/components/competency/03ListLinkGroup.vue
+++ b/src/modules/14_KPI/components/competency/03ListLinkGroup.vue
@@ -16,8 +16,8 @@ const router = useRouter();
 const rows = ref<any>();
 const editStatus = ref<boolean>(false);
 const groupName = ref<string>("");
-const position = ref<string>("");
-const competency = ref<string>("");
+const position = ref<any>(null);
+const competency = ref<any>(null);
 
 const groupNameOp = ref<DataOption[]>([
   {
@@ -428,6 +428,7 @@ onMounted(async () => {
                 v-model="position"
                 label="ตำแหน่ง"
                 outlined
+                multiple
                 emit-value
                 map-options
                 option-label="name"
@@ -452,6 +453,7 @@ onMounted(async () => {
                 label="สมรรถนะประจำกลุ่ม"
                 outlined
                 emit-value
+                multiple
                 map-options
                 option-label="name"
                 option-value="id"
diff --git a/src/modules/15_development/components/scholarship/DetailView.vue b/src/modules/15_development/components/scholarship/DetailView.vue
index e6962b825..b3db73264 100644
--- a/src/modules/15_development/components/scholarship/DetailView.vue
+++ b/src/modules/15_development/components/scholarship/DetailView.vue
@@ -188,6 +188,7 @@ function fetchDataDetail(id: string) {
       formBody.reportBackNo = data.reportBackNo;
       formBody.reportBackNoDate = data.reportBackNoDate;
       formBody.reportBackDate = data.reportBackDate;
+      
       formBody.degreeLevel = data.degreeLevel;
       formBody.course = data.course;
       formBody.field = data.field;

From 687366b0daa452850ab15634ce6e0715e81bc998 Mon Sep 17 00:00:00 2001
From: waruneeauy <warunee.auy@gmail.com>
Date: Wed, 17 Apr 2024 12:32:15 +0700
Subject: [PATCH 4/7] =?UTF-8?q?=E0=B9=80=E0=B8=AD=E0=B8=B2=20action=20?=
 =?UTF-8?q?=E0=B9=81=E0=B8=81=E0=B9=89=E0=B9=84=E0=B8=82=E0=B9=82=E0=B8=84?=
 =?UTF-8?q?=E0=B8=A3=E0=B8=87=E0=B8=81=E0=B8=B2=E0=B8=A3/=E0=B8=AB?=
 =?UTF-8?q?=E0=B8=A5=E0=B8=B1=E0=B8=81=E0=B8=AA=E0=B8=B9=E0=B8=95=E0=B8=A3?=
 =?UTF-8?q?=E0=B8=81=E0=B8=B2=E0=B8=A3=E0=B8=9D=E0=B8=B6=E0=B8=81=E0=B8=AD?=
 =?UTF-8?q?=E0=B8=9A=E0=B8=A3=E0=B8=A1=20=20tab=20=E0=B8=9A=E0=B8=B1?=
 =?UTF-8?q?=E0=B8=99=E0=B8=97=E0=B8=B6=E0=B8=81=E0=B8=9C=E0=B8=A5=E0=B8=AD?=
 =?UTF-8?q?=E0=B8=AD=E0=B8=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../15_development/components/Record.vue       | 18 ------------------
 1 file changed, 18 deletions(-)

diff --git a/src/modules/15_development/components/Record.vue b/src/modules/15_development/components/Record.vue
index 24ab0c1ba..fe7123234 100644
--- a/src/modules/15_development/components/Record.vue
+++ b/src/modules/15_development/components/Record.vue
@@ -340,7 +340,6 @@ onMounted(() => {
         <q-th v-for="col in props.cols" :key="col.name" :props="props">
           <span class="text-weight-medium">{{ col.label }}</span>
         </q-th>
-        <q-th auto-width />
       </q-tr>
     </template>
     <template v-slot:body="props">
@@ -357,23 +356,6 @@ onMounted(() => {
           </div>
           <div v-else>{{ col.value ? col.value : "-" }}</div>
         </q-td>
-        <q-td auto-width>
-          <q-btn
-            color="primary"
-            flat
-            dense
-            round
-            class="q-mr-xs"
-            size="14px"
-            icon="mdi-pencil-outline"
-            clickable
-          >
-            <q-tooltip>แก้ไขข้อมูล</q-tooltip>
-          </q-btn>
-          <q-btn color="info" flat dense round size="14px" icon="mdi-history">
-            <q-tooltip>ประวัติบันทึกผล</q-tooltip>
-          </q-btn>
-        </q-td>
       </q-tr>
     </template>
   </d-table>

From d3dbc4f491dc3dfd62cac67c6d591a024ca30a5b Mon Sep 17 00:00:00 2001
From: waruneeauy <warunee.auy@gmail.com>
Date: Wed, 17 Apr 2024 13:34:11 +0700
Subject: [PATCH 5/7] =?UTF-8?q?=E0=B8=9B=E0=B8=A3=E0=B8=B1=E0=B8=9A?=
 =?UTF-8?q?=E0=B8=A5=E0=B8=B1=E0=B8=81=E0=B8=A9=E0=B8=93=E0=B8=B0=E0=B9=82?=
 =?UTF-8?q?=E0=B8=84=E0=B8=A3=E0=B8=87=E0=B8=81=E0=B8=B2=E0=B8=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/ProjectDetail.vue              | 494 ++++++++++--------
 .../15_development/interface/index/Main.ts    |   2 +
 2 files changed, 274 insertions(+), 222 deletions(-)

diff --git a/src/modules/15_development/components/ProjectDetail.vue b/src/modules/15_development/components/ProjectDetail.vue
index b4bc80565..b9bb2b8b3 100644
--- a/src/modules/15_development/components/ProjectDetail.vue
+++ b/src/modules/15_development/components/ProjectDetail.vue
@@ -64,6 +64,8 @@ const formData = reactive<FormProjectDetail>({
   projectDayHoldActual: null,
   projectNigthHoldActual: null,
   developmentProjectTechniqueActuals: [],
+  projectModalActual: null,
+  projectModalPlanneds: null,
 });
 
 const nodes = ref<any>([
@@ -162,7 +164,7 @@ onMounted(() => {
 
 <template>
   <q-form greedy @submit.prevent @validation-success="onSubmit">
-    <div class="row q-pa-md q-col-gutter-sm">
+    <div class="row">
       <div class="col-12">
         <q-select
           dense
@@ -177,260 +179,308 @@ onMounted(() => {
           multiple
         />
       </div>
-      <div class="col-12 col-sm-6 col-md-4">
-        <q-input
-          dense
-          outlined
-          v-model="formData.projectModal"
-          label="จำนวน (รุ่น)"
-          mask="#"
-          reverse-fill-mask
-        />
+    </div>
+
+    <q-card bordered class="col-12 q-my-sm">
+      <div
+        class="col-xs-12 col-sm-12 text-weight-medium bg-grey-3 q-py-xs q-px-md"
+      >
+        ความสอดคล้องหรือเชื่อมโยงกับยุทธศาสตร์ / แผน
       </div>
+      <q-separator />
 
-      <div class="col-12"><q-separator class="q-my-md" /></div>
+      <q-card-section>
+        <div class="row col-12 q-col-gutter-sm">
+          <div class="col-6">
+            <q-card bordered class="col-12">
+              <div
+                class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md"
+              >
+                ยุทธศาสตร์ / แผน
+              </div>
+              <q-separator />
 
-      <div class="row">
-        <div
-          :class="
-            store.projectStatus === 'FINISH'
-              ? 'col-6 q-col-gutter-sm'
-              : 'col-12 q-col-gutter-sm'
-          "
-        >
-          <div class="col-12 text-bold">รูปแบบโครงการตามแผน</div>
-
-          <div class="col-12 q-py-md">
-            <q-label class="q-mb-sm">เทคนิควิธีการที่ใช้ในการพัฒนา</q-label>
-            <q-option-group
-              :disable="store.projectStatus === 'FINISH'"
-              keep-color
-              color="primary"
-              dense
-              v-model="formData.developmentProjectTechniquePlanneds"
-              :options="projectTechniquesOp"
-              type="checkbox"
-            />
+              <q-card-section class="q-pa-sm">
+                <q-input dense outlined v-model="filter" label="ค้นหา">
+                  <template v-slot:append>
+                    <q-icon
+                      v-if="filter !== ''"
+                      name="clear"
+                      class="cursor-pointer"
+                      @click="filter = ''"
+                    />
+                    <q-icon v-else name="search" color="grey-5" />
+                  </template>
+                </q-input>
+                <q-tree
+                  dense
+                  :nodes="nodes"
+                  selected-color="primary"
+                  node-key="orgTreeName"
+                  label-key="orgTreeName"
+                  :filter="filter"
+                  :no-results-label="notFound"
+                  :no-nodes-label="noData"
+                  v-model:expanded="expanded"
+                >
+                  <template v-slot:default-header="prop">
+                    <q-item
+                      clickable
+                      @click.stop="updateSelected(prop.node, '1')"
+                      :active="nodeId == prop.node.orgTreeName"
+                      active-class="my-list-link text-white text-weight-medium bg-primary"
+                      class="row col-12 items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
+                    >
+                      <div>
+                        <div class="text-weight-medium">
+                          {{ prop.node.orgTreeName }}
+                        </div>
+                      </div>
+                    </q-item>
+                  </template>
+                </q-tree>
+              </q-card-section>
+            </q-card>
           </div>
+          <div class="col-6">
+            <q-card bordered class="col-12">
+              <div
+                class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md"
+              >
+                ยุทธศาสตร์ / แผน
+              </div>
+              <q-separator />
 
-          <div class="row col-12 q-col-gutter-sm">
-            <div class="col-12 col-md-3">
-              <q-checkbox
+              <q-card-section class="q-pa-sm">
+                <q-input dense outlined v-model="filter2" label="ค้นหา">
+                  <template v-slot:append>
+                    <q-icon
+                      v-if="filter2 !== ''"
+                      name="clear"
+                      class="cursor-pointer"
+                      @click="filter2 = ''"
+                    />
+                    <q-icon v-else name="search" color="grey-5" />
+                  </template>
+                </q-input>
+                <q-tree
+                  dense
+                  :nodes="nodes"
+                  node-key="orgTreeName"
+                  label-key="orgTreeName"
+                  :filter="filter2"
+                  :no-results-label="notFound"
+                  :no-nodes-label="noData"
+                  v-model:expanded="expanded2"
+                >
+                  <template v-slot:default-header="prop">
+                    <q-item
+                      clickable
+                      @click.stop="updateSelected(prop.node, '2')"
+                      :active="nodeId2 == prop.node.orgTreeName"
+                      active-class="my-list-link text-white text-weight-medium bg-primary"
+                      class="row col-12 items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
+                    >
+                      <div>
+                        <div class="text-weight-medium">
+                          {{ prop.node.orgTreeName }}
+                        </div>
+                      </div>
+                    </q-item>
+                  </template>
+                </q-tree>
+              </q-card-section>
+            </q-card>
+          </div>
+        </div>
+      </q-card-section>
+    </q-card>
+
+    <q-card bordered class="col-12 q-my-sm">
+      <div
+        class="col-xs-12 col-sm-12 text-weight-medium bg-grey-3 q-py-xs q-px-md"
+      >
+        รูปแบบโครงการ
+      </div>
+      <q-separator />
+
+      <q-card-section>
+        <div class="row col-12 q-col-gutter-sm">
+          <div class="col-6 q-col-gutter-sm">
+            <div class="col-12 text-bold">ตามแผน</div>
+
+            <div class="row col-12 q-col-gutter-sm">
+              <div class="col-12 col-md-3">
+                <q-checkbox
+                  :disable="store.projectStatus === 'FINISH'"
+                  keep-color
+                  color="primary"
+                  dense
+                  value="GO_BLACK"
+                  label="ไป-กลับ"
+                  v-model="formData.isBackPlanned"
+                ></q-checkbox>
+              </div>
+              <div class="col-12 col-md-4">
+                <q-input
+                  :readonly="store.projectStatus === 'FINISH'"
+                  dense
+                  outlined
+                  v-model="formData.projectDayBackPlanned"
+                  label="จำนวน (วัน)"
+                  mask="#"
+                  reverse-fill-mask
+                />
+              </div>
+            </div>
+            <div class="row col-12 q-col-gutter-sm">
+              <div class="col-12 col-md-3">
+                <q-checkbox
+                  :disable="store.projectStatus === 'FINISH'"
+                  keep-color
+                  color="primary"
+                  dense
+                  value="HOLD"
+                  label="พักค้าง"
+                  v-model="formData.isHoldPlanned"
+                ></q-checkbox>
+              </div>
+              <div class="col-12 col-md-4">
+                <q-input
+                  :readonly="store.projectStatus === 'FINISH'"
+                  dense
+                  outlined
+                  v-model="formData.projectDayHoldPlanned"
+                  label="จำนวน (วัน)"
+                  mask="#"
+                  reverse-fill-mask
+                />
+              </div>
+              <div class="col-12 col-md-4">
+                <q-input
+                  :readonly="store.projectStatus === 'FINISH'"
+                  dense
+                  outlined
+                  v-model="formData.projectNigthHoldPlanned"
+                  label="จำนวน (คืน)"
+                  mask="#"
+                  reverse-fill-mask
+                />
+              </div>
+            </div>
+
+            <div class="col-12 q-py-md">
+              <q-label class="q-mb-sm">เทคนิควิธีการที่ใช้ในการพัฒนา</q-label>
+              <q-option-group
                 :disable="store.projectStatus === 'FINISH'"
                 keep-color
                 color="primary"
                 dense
-                value="GO_BLACK"
-                label="ไป-กลับ"
-                v-model="formData.isBackPlanned"
-              ></q-checkbox>
+                v-model="formData.developmentProjectTechniquePlanneds"
+                :options="projectTechniquesOp"
+                type="checkbox"
+              />
             </div>
-            <div class="col-12 col-md-4">
+
+            <div class="col-12 col-sm-6 col-md-4">
               <q-input
-                :readonly="store.projectStatus === 'FINISH'"
+                :disable="store.projectStatus === 'FINISH'"
                 dense
                 outlined
-                v-model="formData.projectDayBackPlanned"
-                label="จำนวน (วัน)"
+                v-model="formData.projectModalPlanneds"
+                label="จำนวน (รุ่น)"
                 mask="#"
                 reverse-fill-mask
               />
             </div>
           </div>
-          <div class="row col-12 q-col-gutter-sm">
-            <div class="col-12 col-md-3">
-              <q-checkbox
-                :disable="store.projectStatus === 'FINISH'"
+
+          <div
+            v-if="store.projectStatus === 'FINISH'"
+            class="col-6 q-col-gutter-sm"
+          >
+            <div class="col-12 text-bold">รูปแบบโครงการตามจริง</div>
+            <div class="col-12 q-py-md">
+              <q-label class="q-mb-sm">เทคนิควิธีการที่ใช้ในการพัฒนา</q-label>
+              <q-option-group
                 keep-color
                 color="primary"
                 dense
-                value="HOLD"
-                label="พักค้าง"
-                v-model="formData.isHoldPlanned"
-              ></q-checkbox>
-            </div>
-            <div class="col-12 col-md-4">
-              <q-input
-                :readonly="store.projectStatus === 'FINISH'"
-                dense
-                outlined
-                v-model="formData.projectDayHoldPlanned"
-                label="จำนวน (วัน)"
-                mask="#"
-                reverse-fill-mask
+                v-model="formData.developmentProjectTechniqueActuals"
+                :options="projectTechniquesOp"
+                type="checkbox"
               />
             </div>
-            <div class="col-12 col-md-4">
+
+            <div class="row col-12 q-col-gutter-sm">
+              <div class="col-md-3">
+                <q-checkbox
+                  keep-color
+                  color="primary"
+                  dense
+                  value="GO_BLACK"
+                  label="ไป-กลับ"
+                  v-model="formData.isBackActual"
+                ></q-checkbox>
+              </div>
+              <div class="col-12 col-md-4">
+                <q-input
+                  dense
+                  outlined
+                  v-model="formData.projectDayBackActual"
+                  label="จำนวน (วัน)"
+                  mask="#"
+                  reverse-fill-mask
+                />
+              </div>
+            </div>
+            <div class="row col-12 q-col-gutter-sm">
+              <div class="col-12 col-md-3">
+                <q-checkbox
+                  keep-color
+                  color="primary"
+                  dense
+                  value="HOLD"
+                  label="พักค้าง"
+                  v-model="formData.isHoldActual"
+                ></q-checkbox>
+              </div>
+              <div class="col-12 col-md-4">
+                <q-input
+                  dense
+                  outlined
+                  v-model="formData.projectDayHoldActual"
+                  label="จำนวน (วัน)"
+                  mask="#"
+                  reverse-fill-mask
+                />
+              </div>
+              <div class="col-12 col-md-4">
+                <q-input
+                  dense
+                  outlined
+                  v-model="formData.projectNigthHoldActual"
+                  label="จำนวน (คืน)"
+                  mask="#"
+                  reverse-fill-mask
+                />
+              </div>
+            </div>
+            <div class="col-12 col-sm-6 col-md-4">
               <q-input
-                :readonly="store.projectStatus === 'FINISH'"
                 dense
                 outlined
-                v-model="formData.projectNigthHoldPlanned"
-                label="จำนวน (คืน)"
+                v-model="formData.projectModalActual"
+                label="จำนวน (รุ่น)"
                 mask="#"
                 reverse-fill-mask
               />
             </div>
           </div>
         </div>
+      </q-card-section>
+    </q-card>
 
-        <div
-          v-if="store.projectStatus === 'FINISH'"
-          class="col-6 q-col-gutter-sm"
-        >
-          <div class="col-12 text-bold">รูปแบบโครงการตามจริง</div>
-          <div class="col-12 q-py-md">
-            <q-label class="q-mb-sm">เทคนิควิธีการที่ใช้ในการพัฒนา</q-label>
-            <q-option-group
-              keep-color
-              color="primary"
-              dense
-              v-model="formData.developmentProjectTechniqueActuals"
-              :options="projectTechniquesOp"
-              type="checkbox"
-            />
-          </div>
-
-          <div class="row col-12 q-col-gutter-sm">
-            <div class="col-md-3">
-              <q-checkbox
-                keep-color
-                color="primary"
-                dense
-                value="GO_BLACK"
-                label="ไป-กลับ"
-                v-model="formData.isBackActual"
-              ></q-checkbox>
-            </div>
-            <div class="col-12 col-md-4">
-              <q-input
-                dense
-                outlined
-                v-model="formData.projectDayBackActual"
-                label="จำนวน (วัน)"
-                mask="#"
-                reverse-fill-mask
-              />
-            </div>
-          </div>
-          <div class="row col-12 q-col-gutter-sm">
-            <div class="col-12 col-md-3">
-              <q-checkbox
-                keep-color
-                color="primary"
-                dense
-                value="HOLD"
-                label="พักค้าง"
-                v-model="formData.isHoldActual"
-              ></q-checkbox>
-            </div>
-            <div class="col-12 col-md-4">
-              <q-input
-                dense
-                outlined
-                v-model="formData.projectDayHoldActual"
-                label="จำนวน (วัน)"
-                mask="#"
-                reverse-fill-mask
-              />
-            </div>
-            <div class="col-12 col-md-4">
-              <q-input
-                dense
-                outlined
-                v-model="formData.projectNigthHoldActual"
-                label="จำนวน (คืน)"
-                mask="#"
-                reverse-fill-mask
-              />
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <q-separator />
-    <div class="row">
-      <div class="col-6 q-pa-md">
-        <q-input dense outlined v-model="filter" label="ค้นหา">
-          <template v-slot:append>
-            <q-icon
-              v-if="filter !== ''"
-              name="clear"
-              class="cursor-pointer"
-              @click="filter = ''"
-            />
-            <q-icon v-else name="search" color="grey-5" />
-          </template>
-        </q-input>
-        <q-tree
-          dense
-          :nodes="nodes"
-          selected-color="primary"
-          node-key="orgTreeName"
-          label-key="orgTreeName"
-          :filter="filter"
-          :no-results-label="notFound"
-          :no-nodes-label="noData"
-          v-model:expanded="expanded"
-        >
-          <template v-slot:default-header="prop">
-            <q-item
-              clickable
-              @click.stop="updateSelected(prop.node, '1')"
-              :active="nodeId == prop.node.orgTreeName"
-              active-class="my-list-link text-white text-weight-medium bg-primary"
-              class="row col-12 items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
-            >
-              <div>
-                <div class="text-weight-medium">
-                  {{ prop.node.orgTreeName }}
-                </div>
-              </div>
-            </q-item>
-          </template>
-        </q-tree>
-      </div>
-      <div class="col-6 q-pa-md">
-        <q-input dense outlined v-model="filter2" label="ค้นหา">
-          <template v-slot:append>
-            <q-icon
-              v-if="filter2 !== ''"
-              name="clear"
-              class="cursor-pointer"
-              @click="filter2 = ''"
-            />
-            <q-icon v-else name="search" color="grey-5" />
-          </template>
-        </q-input>
-        <q-tree
-          dense
-          :nodes="nodes"
-          node-key="orgTreeName"
-          label-key="orgTreeName"
-          :filter="filter2"
-          :no-results-label="notFound"
-          :no-nodes-label="noData"
-          v-model:expanded="expanded2"
-        >
-          <template v-slot:default-header="prop">
-            <q-item
-              clickable
-              @click.stop="updateSelected(prop.node, '2')"
-              :active="nodeId2 == prop.node.orgTreeName"
-              active-class="my-list-link text-white text-weight-medium bg-primary"
-              class="row col-12 items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
-            >
-              <div>
-                <div class="text-weight-medium">
-                  {{ prop.node.orgTreeName }}
-                </div>
-              </div>
-            </q-item>
-          </template>
-        </q-tree>
-      </div>
-    </div>
     <q-separator />
     <div class="text-right q-pa-sm">
       <q-btn
diff --git a/src/modules/15_development/interface/index/Main.ts b/src/modules/15_development/interface/index/Main.ts
index e5a713896..85250e452 100644
--- a/src/modules/15_development/interface/index/Main.ts
+++ b/src/modules/15_development/interface/index/Main.ts
@@ -77,6 +77,8 @@ interface FormProjectDetail {
   projectDayHoldActual: string | null;
   projectNigthHoldActual: string | null;
   developmentProjectTechniqueActuals: [];
+  projectModalActual?: string | null;
+  projectModalPlanneds?: string | null;
 }
 
 export type {

From 68156e5d33a5258b222e71ee1c846d84153d98f9 Mon Sep 17 00:00:00 2001
From: waruneeauy <warunee.auy@gmail.com>
Date: Wed, 17 Apr 2024 13:35:54 +0700
Subject: [PATCH 6/7] =?UTF-8?q?=E0=B8=9B=E0=B8=A3=E0=B8=B1=E0=B8=9A?=
 =?UTF-8?q?=E0=B8=A5=E0=B8=B1=E0=B8=81=E0=B8=A9=E0=B8=93=E0=B8=B0=E0=B9=82?=
 =?UTF-8?q?=E0=B8=84=E0=B8=A3=E0=B8=87=E0=B8=81=E0=B8=B2=E0=B8=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/ProjectDetail.vue              | 24 +++++++++----------
 1 file changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/modules/15_development/components/ProjectDetail.vue b/src/modules/15_development/components/ProjectDetail.vue
index b9bb2b8b3..579de44b6 100644
--- a/src/modules/15_development/components/ProjectDetail.vue
+++ b/src/modules/15_development/components/ProjectDetail.vue
@@ -307,7 +307,7 @@ onMounted(() => {
       <q-card-section>
         <div class="row col-12 q-col-gutter-sm">
           <div class="col-6 q-col-gutter-sm">
-            <div class="col-12 text-bold">ตามแผน</div>
+            <div class="col-12 text-bold">รูปแบบโครงการตามแผน</div>
 
             <div class="row col-12 q-col-gutter-sm">
               <div class="col-12 col-md-3">
@@ -400,17 +400,6 @@ onMounted(() => {
             class="col-6 q-col-gutter-sm"
           >
             <div class="col-12 text-bold">รูปแบบโครงการตามจริง</div>
-            <div class="col-12 q-py-md">
-              <q-label class="q-mb-sm">เทคนิควิธีการที่ใช้ในการพัฒนา</q-label>
-              <q-option-group
-                keep-color
-                color="primary"
-                dense
-                v-model="formData.developmentProjectTechniqueActuals"
-                :options="projectTechniquesOp"
-                type="checkbox"
-              />
-            </div>
 
             <div class="row col-12 q-col-gutter-sm">
               <div class="col-md-3">
@@ -466,6 +455,17 @@ onMounted(() => {
                 />
               </div>
             </div>
+            <div class="col-12 q-py-md">
+              <q-label class="q-mb-sm">เทคนิควิธีการที่ใช้ในการพัฒนา</q-label>
+              <q-option-group
+                keep-color
+                color="primary"
+                dense
+                v-model="formData.developmentProjectTechniqueActuals"
+                :options="projectTechniquesOp"
+                type="checkbox"
+              />
+            </div>
             <div class="col-12 col-sm-6 col-md-4">
               <q-input
                 dense

From abde02ba6482465242171558bbe98e68002feb32 Mon Sep 17 00:00:00 2001
From: oat_dev <nattapon@frappet.com>
Date: Wed, 17 Apr 2024 13:37:33 +0700
Subject: [PATCH 7/7] =?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=B8=9B=E0=B8=A3?=
 =?UTF-8?q?=E0=B8=B1=E0=B8=9A=E0=B8=81=E0=B8=B2=E0=B8=A3=E0=B9=81=E0=B8=AA?=
 =?UTF-8?q?=E0=B8=94=E0=B8=87=E0=B8=9C=E0=B8=A5+=E0=B9=81=E0=B8=81?=
 =?UTF-8?q?=E0=B9=89=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/Target.vue      | 70 +++++++++++++++----
 1 file changed, 57 insertions(+), 13 deletions(-)

diff --git a/src/modules/15_development/components/Target.vue b/src/modules/15_development/components/Target.vue
index e41b2cd14..e9fab0556 100644
--- a/src/modules/15_development/components/Target.vue
+++ b/src/modules/15_development/components/Target.vue
@@ -59,7 +59,7 @@ const columnsPlannedGoals = ref<QTableProps["columns"]>([
     field: "posTypePlannedId",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    format: (val) => convertTypeGoals(val),
+    // format: (val) => convertTypeGoals(val),
   },
 
   {
@@ -92,7 +92,7 @@ const columnsActualGoals = ref<QTableProps["columns"]>([
     field: "posTypeActualId",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    format: (val) => convertTypeGoals(val),
+    // format: (val) => convertTypeGoals(val),
   },
 
   {
@@ -200,7 +200,6 @@ function fetchType() {
           id: e.id,
           name: e.posTypeName,
         }));
-        console.log(data);
       })
       .catch((err) => {
         messageError($q, err);
@@ -214,6 +213,7 @@ async function fetchData(id: string) {
     .get(config.API.developmentMainTab("tab2", id))
     .then(async (res) => {
       const data = res.data.result;
+
       actualGoals.value = data.actualGoals;
       actualPeoples.value = data.actualPeoples;
       plannedGoals.value = data.plannedGoals;
@@ -259,9 +259,9 @@ async function onSubmitGroup() {
           groupTarget: formGroupTarget.groupTarget,
           groupTargetSub: formGroupTarget.groupTargetSub,
           positions: formGroupTarget.positions.map((v) => ({
-            position: v.position,
-            posTypePlannedId: v.posTypePlannedId,
-            posLevelPlannedId: v.posLevelPlannedId,
+            position: v.position ? v.position : "",
+            posTypePlannedId: v.posTypePlannedId ? v.posTypePlannedId : "",
+            posLevelPlannedId: v.posLevelPlannedId ? v.posLevelPlannedId : "",
           })),
           type: formGroupTarget.type ? formGroupTarget.type : "",
           amount: formGroupTarget.amount,
@@ -431,9 +431,16 @@ function convertNamePeoples(id: string) {
   return data && data?.name;
 }
 
-function convertTypeGoals(id: string) {
-  const data = posTypeMain.value.find((e: ResGroup) => e.id === id);
-  return data && data?.posTypeName;
+function convertTypeGoals(row: ResActualGoals) {
+  const posTypeName = posTypeMain.value.find(
+    (e: ResGroup) => e.id === row.posTypeActualId
+  );
+  const posLevelName = posTypeName?.posLevels.find(
+    (e: any) => e.id === row.posLevelActualId
+  );
+  const fullName = posTypeName?.posTypeName + " " + posLevelName?.posLevelName;
+  // return posTypeName && posTypeName?.posTypeName;
+  return fullName;
 }
 
 const addGroupTargetData = async () => {
@@ -528,7 +535,18 @@ onMounted(() => {
           <template v-slot:body="props">
             <q-tr :props="props" class="cursor-pointer">
               <q-td v-for="col in props.cols" :key="col.name" :props="props">
-                <div class="table_ellipsis">
+                <div v-if="col.name === 'posTypePlannedId'">
+                  <div
+                    v-if="props.row.groupTarget !== 'OUTSIDERS'"
+                    v-for="row in props.row.plannedGoalPositions"
+                  >
+                    {{ `- ${row.position} (${row.posType} ${row.posLevel})` }}
+                  </div>
+                  <div v-else>
+                    {{ props.row.type ? props.row.type : "-" }}
+                  </div>
+                </div>
+                <div v-else class="table_ellipsis">
                   {{ col.value ? col.value : "-" }}
                 </div>
               </q-td>
@@ -673,7 +691,30 @@ onMounted(() => {
           <template v-slot:body="props">
             <q-tr :props="props" class="cursor-pointer">
               <q-td v-for="col in props.cols" :key="col.name" :props="props">
-                <div class="table_ellipsis">
+                <div v-if="col.name === 'posTypeActualId'">
+                  <div v-if="props.row.groupTarget !== 'OUTSIDERS'">
+                    {{
+                      `${props.row.position} (${props.row.posType} ${props.row.posLevel})`
+                    }}
+                  </div>
+                  <div v-else>
+                    {{ props.row.type ? props.row.type : "-" }}
+                  </div>
+                </div>
+                <div v-else class="table_ellipsis">
+                  {{ col.value ? col.value : "-" }}
+                </div>
+                <!-- <div
+                  v-if="col.name === 'posTypeActualId'"
+                  class="table_ellipsis"
+                >
+                  {{
+                    props.row.posTypeActualId !== null
+                      ? convertTypeGoals(props.row)
+                      : props.row.type
+                  }}
+                </div> -->
+                <div v-else class="table_ellipsis">
                   {{ col.value ? col.value : "-" }}
                 </div>
               </q-td>
@@ -876,8 +917,11 @@ onMounted(() => {
                 lazy-rules
                 class="inputgreen"
                 v-model="formGroupTarget.level"
-                :options="posLevelOp"
-                option-label="name"
+                :options="
+                  posTypeMain.find((v) => formGroupTarget.posType === v.id)
+                    ?.posLevels || []
+                "
+                option-label="posLevelName"
                 option-value="id"
                 emit-value
                 map-options