fixing พัฒนาเป้าหมาย

src/modules/15_development/components/Target.vue

@@ -184,15 +184,15 @@ const formGroupTarget = reactive<FormGroupTargetPlannedGoal>({
   groupTarget: "",
   groupTargetSub: "",
   position: "",
-  posType: "",
-  posLevel: "",
+  posType: null,
+  posLevel: null,
   type: null,
   amount: null,
   positions: [
     {
       position: "",
-      posTypeId: "",
-      posLevelId: "",
+      posTypeId: null,
+      posLevelId: null,
     },
   ],
 });
@@ -210,8 +210,8 @@ const posTypeMain = ref<ResGroup[]>([]);
 const addGroupTargetData = async () => {
   formGroupTarget.positions.push({
     position: "",
-    posTypeId: "",
-    posLevelId: "",
+    posTypeId: null,
+    posLevelId: null,
   });
 };
 
@@ -262,8 +262,8 @@ function onClickOpenDialog(type: string, target: string) {
       (formGroupTarget.positions = [
         {
           position: "",
-          posTypeId: "",
-          posLevelId: "",
+          posTypeId: null,
+          posLevelId: null,
         },
       ]),
         (newModalGroupTarget.value = true);
@@ -323,8 +323,12 @@ function onSubmitGroup() {
             groupTarget: formGroupTarget.groupTarget,
             groupTargetSub: formGroupTarget.groupTargetSub,
             position: formGroupTarget.position,
-            posTypeActualId: formGroupTarget.posType,
-            posLevelActualId: formGroupTarget.posLevel,
+            posTypeActualId: formGroupTarget.posType
+              ? formGroupTarget.posType
+              : null,
+            posLevelActualId: formGroupTarget.posLevel
+              ? formGroupTarget.posLevel
+              : null,
             type: formGroupTarget.type,
             amount: formGroupTarget.amount,
           }
@@ -404,8 +408,8 @@ function cleanFormData() {
   formGroupTarget.groupTarget = "";
   formGroupTarget.groupTargetSub = "";
   formGroupTarget.position = "";
-  formGroupTarget.posType = "";
-  formGroupTarget.posLevel = "";
+  formGroupTarget.posType = null;
+  formGroupTarget.posLevel = null;
   formGroupTarget.type = "";
   formGroupTarget.amount = null;
   formGroupRelate.relate = "";
@@ -556,8 +560,8 @@ onMounted(() => {
                     {{ `- ${row.position}`
                     }}{{
                       row.posType !== null || row.posLevel !== null
-                        ? `(${row.posType ? row.posType : ""} ${
-                            row.posLevel ? row.posLevel : ""
+                        ? ` (${row.posType ? row.posType : ""}${
+                            row.posLevel ? " " + row.posLevel : ""
                           })`
                         : ""
                     }}
@@ -717,8 +721,13 @@ onMounted(() => {
               <q-td v-for="col in props.cols" :key="col.name" :props="props">
                 <div v-if="col.name === 'posTypeActualId'">
                   <div v-if="props.row.groupTarget !== 'OUTSIDERS'">
-                    {{
-                      `${props.row.position} (${props.row.posType} ${props.row.posLevel})`
+                    {{ `- ${props.row.position}`
+                    }}{{
+                      props.row.posType !== null || props.row.posLevel !== null
+                        ? ` (${props.row.posType ? props.row.posType : ""}${
+                            props.row.posLevel ? " " + props.row.posLevel : ""
+                          })`
+                        : ""
                     }}
                   </div>
                   <div v-else>
@@ -878,23 +887,6 @@ onMounted(() => {
               />
             </div>
 
-            <div
-              class="col-xs-6 col-sm-4 col-md-4"
-              v-if="formGroupTarget.groupTarget !== 'OUTSIDERS'"
-            >
-              <q-input
-                outlined
-                dense
-                hide-bottom-space
-                class="inputgreen"
-                v-model="formGroupTarget.position"
-                label="ตำแหน่ง"
-                :rules="[
-                (val:string) =>
-                  !!val || `${'กรุณากรอกตำแหน่ง'}`,
-              ]"
-              />
-            </div>
             <div
               class="col-xs-6 col-sm-4 col-md-4"
               v-if="formGroupTarget.groupTarget !== 'OUTSIDERS'"
@@ -913,11 +905,8 @@ onMounted(() => {
                 map-options
                 input-class="text-red"
                 label="ประเภทตำแหน่ง"
+                clearable
                 @update:model-value="updatePosTypeName"
-                :rules="[
-          (val:string) =>
-            !!val || `${'กรุณาเลือกประเภทตำแหน่ง'}`,
-        ]"
               />
             </div>
             <div
@@ -941,10 +930,24 @@ onMounted(() => {
                 map-options
                 input-class="text-red"
                 label="ระดับตำแหน่ง"
+                clearable
+              />
+            </div>
+            <div
+              class="col-xs-6 col-sm-4 col-md-4"
+              v-if="formGroupTarget.groupTarget !== 'OUTSIDERS'"
+            >
+              <q-input
+                outlined
+                dense
+                hide-bottom-space
+                class="inputgreen"
+                v-model="formGroupTarget.position"
+                label="ตำแหน่ง"
                 :rules="[
-        (val:string) =>
-          !!val || `${'กรุณาเลือกระดับ'}`,
-      ]"
+                (val:string) =>
+                  !!val || `${'กรุณากรอกตำแหน่ง'}`,
+              ]"
               />
             </div>
             <div
@@ -1127,6 +1130,7 @@ onMounted(() => {
                   map-options
                   input-class="text-red"
                   label="ประเภทตำแหน่ง"
+                  clearable
                   @update:model-value="updatePosTypeName"
                 />
               </div>
@@ -1149,6 +1153,7 @@ onMounted(() => {
                   map-options
                   input-class="text-red"
                   label="ระดับตำแหน่ง"
+                  clearable
                 />
               </div>
               <div

src/modules/15_development/interface/request/Main.ts

@@ -33,8 +33,8 @@ interface FormGroupTargetPlannedGoal {
   positions: [
     {
       position: string;
-      posTypeId: string;
-      posLevelId: string;
+      posTypeId: string | null;
+      posLevelId: string | null;
     }
   ];
   plannedGoalPositions?: [