get สถานะ, ปิดโครงการ และลักษณะโครงการ

src/api/15_development/api.development.ts

@@ -29,4 +29,9 @@ export default {
   developmentReportHistoryOfficer: () =>
     `${developmentReport}/history-employee`,
   developmentReportScholarship: () => `${developmentReport}/scholarship`,
+
+  // ปิดโครงการ
+  developmentMainFinish: (id: string) => `${development}/main/finish/${id}`,
+  // ข้อมูล status ของโครงการ
+  developmentMainStatus: (id: string) => `${development}/main/status/${id}`,
 };

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

@@ -40,185 +40,201 @@ const projectId = ref<string>(route.params.id.toLocaleString());
 const tab = ref<string>("BasicInfo");
 
 const status = ref<string>("ONGOING");
-function fetchDataProject(id: string) {
+// function fetchDataProject(id: string) {
+//   showLoader();
+//   http
+//     .get(config.API.developmentMainById(id))
+//     .then((res) => {
+//       const data: ResDataProject = res.data.result;
+//       /** ข้อมูลเบื้องต้น*/
+//       status.value = data.status ? data.status : "ONGOING";
+//       store.formAddProject.year = data.year;
+//       store.formAddProject.projectName = data.projectName;
+//       store.formAddProject.reason = data.reason;
+//       store.formAddProject.objective = data.objective;
+//       /**เป้าหมาย*/
+//       const plannedGoals = data.plannedGoals.map((e: any) => ({
+//         groupTarget: e.groupTarget,
+//         groupTargetSub: e.groupTargetSub,
+//         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) => ({
+//         groupTarget: e.groupTarget,
+//         amount: e.amount,
+//       }));
+//       store.formAddProject.plannedGoals = plannedGoals;
+//       store.formAddProject.plannedPeoples = plannedPeoples;
+
+//       const actualGoals = data.actualGoals.map((e: ResActualGoals) => ({
+//         groupTarget: e.groupTarget,
+//         groupTargetSub: e.groupTargetSub,
+//         position: e.position,
+//         posTypeActualId: e.posTypeActualId,
+//         posLevelActualId: e.posLevelActualId,
+//         type: e.type,
+//         amount: e.amount,
+//       }));
+//       const actualPeoples = data.actualPeoples.map((e: ResPeople) => ({
+//         groupTarget: e.groupTarget,
+//         amount: e.amount,
+//       }));
+//       store.formAddProject.actualGoals = actualGoals;
+//       store.formAddProject.actualPeoples = actualPeoples;
+
+//       // ลักษณะโครงการ
+//       store.formAddProject.projectType = data.projectType;
+//       store.formAddProject.projectCharacteristics = data.projectCharacteristics;
+//       store.formAddProject.projectDay = data.projectDay;
+//       store.formAddProject.projectNigth = data.projectNigth;
+//       store.formAddProject.projectTechniques = data.projectTechniques;
+//       store.formAddProject.projectModal = data.projectModal;
+
+//       /** การติดตามผลดารประเมิน*/
+//       store.formAddProject.metricType = data.metricType;
+//       store.formAddProject.indicators = data.indicators;
+//       store.formAddProject.target = data.target;
+//       store.formAddProject.calculation = data.calculation;
+//       store.formAddProject.measuRement = data.measuRement;
+//       store.formAddProject.results = data.results;
+//       store.formAddProject.obstacles = data.obstacles;
+//       store.formAddProject.suggestions = data.suggestions;
+//       store.formAddProject.project = data.project;
+//       store.formAddProject.isPassAllocate = data.isPassAllocate;
+//       store.formAddProject.isPassNoAllocate = data.isPassNoAllocate;
+//       store.formAddProject.isNoPass = data.isNoPass;
+//       store.formAddProject.isBudget = data.isBudget;
+//       store.formAddProject.isOutBudget = data.isOutBudget;
+
+//       /** อื่นๆ*/
+//       store.formAddProject.dateStart = data.dateStart;
+//       store.formAddProject.dateEnd = data.dateEnd;
+//       store.formAddProject.totalDate = data.totalDate;
+//       store.formAddProject.address = data.address;
+
+//       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;
+//       store.formAddProject.approved = data.approved;
+//       store.formAddProject.budgetPay = data.budgetPay;
+//       store.formAddProject.issues = data.issues;
+//       store.formAddProject.chance = Number(data.chance);
+//       store.formAddProject.effects = Number(data.effects);
+//       store.formAddProject.riskLevel = data.riskLevel;
+//       store.formAddProject.riskManagement = data.riskManagement;
+//       store.formAddProject.expect = data.expect;
+//       store.formAddProject.topicAcademic = data.topicAcademic;
+//       store.formAddProject.addressAcademic = data.addressAcademic;
+//       store.formAddProject.provinceActualId = data.provinceActualId;
+//     })
+//     .catch((err) => {
+//       messageError($q, err);
+//     })
+//     .finally(() => {
+//       setTimeout(() => {
+//         hideLoader();
+//       }, 1000);
+//     });
+// }
+
+// function onSubmit() {
+//   if (store.formAddProject.projectName === "" && tab.value !== "BasicInfo") {
+//     dialogMessageNotify($q, "ชื่อโครงการ/กิจกรรม/หลักสูตร");
+//     tab.value = "BasicInfo";
+//   } else {
+//     dialogConfirm($q, async () => {
+//       showLoader();
+//       /** การติดตามผลดารประเมิน*/
+//       if (store.formAddProject.project === "OFFER") {
+//         store.formAddProject.isBudget = false;
+//         store.formAddProject.isOutBudget = false;
+//       } else {
+//         store.formAddProject.isPassAllocate = false;
+//         store.formAddProject.isPassNoAllocate = false;
+//         store.formAddProject.isNoPass = false;
+//       }
+
+//       // ลักษณะโครงการ;
+//       store.formAddProject.projectDay = store.formAddProject.projectDay
+//         ? Number(store.formAddProject.projectDay)
+//         : null;
+//       store.formAddProject.projectNigth = store.formAddProject.projectNigth
+//         ? Number(store.formAddProject.projectNigth)
+//         : null;
+//       store.formAddProject.projectModal = store.formAddProject.projectModal
+//         ? Number(store.formAddProject.projectModal)
+//         : null;
+
+//       /** อื่นๆ*/
+//       store.formAddProject.totalDate = Number(store.formAddProject.totalDate);
+//       store.formAddProject.accept =
+//         typeof store.formAddProject.accept === "string"
+//           ? Number(store.formAddProject.accept.replace(/,/g, ""))
+//           : store.formAddProject.accept;
+//       store.formAddProject.receive =
+//         typeof store.formAddProject.receive === "string"
+//           ? Number(store.formAddProject.receive.replace(/,/g, ""))
+//           : store.formAddProject.receive;
+//       store.formAddProject.approved =
+//         typeof store.formAddProject.approved === "string"
+//           ? Number(store.formAddProject.approved.replace(/,/g, ""))
+//           : store.formAddProject.approved;
+//       store.formAddProject.budgetPay =
+//         typeof store.formAddProject.budgetPay === "string"
+//           ? Number(store.formAddProject.budgetPay.replace(/,/g, ""))
+//           : store.formAddProject.budgetPay;
+
+//       const url = projectId.value
+//         ? config.API.developmentMainById(projectId.value)
+//         : config.API.developmentMain;
+//       const method = projectId.value ? "put" : "post";
+//       try {
+//         const res = await http[method](url, store.formAddProject);
+//         success($q, "บันทึกข้อมูลสำเร็จ");
+//         !projectId.value && router.push(`/development/${res.data.result}`);
+//         projectId.value && fetchDataProject(projectId.value);
+//       } catch (e) {
+//         messageError($q, e);
+//       } finally {
+//         hideLoader();
+//       }
+//     });
+//   }
+// }
+
+function getStatus(id: string) {
   showLoader();
   http
-    .get(config.API.developmentMainById(id))
+    .get(config.API.developmentMainStatus(id)) // change path
     .then((res) => {
-      const data: ResDataProject = res.data.result;
+      status.value = res.data.result.status;
-      /** ข้อมูลเบื้องต้น*/
-      status.value = data.status ? data.status : "ONGOING";
-      store.formAddProject.year = data.year;
-      store.formAddProject.projectName = data.projectName;
-      store.formAddProject.reason = data.reason;
-      store.formAddProject.objective = data.objective;
-      /**เป้าหมาย*/
-      const plannedGoals = data.plannedGoals.map((e: any) => ({
-        groupTarget: e.groupTarget,
-        groupTargetSub: e.groupTargetSub,
-        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) => ({
-        groupTarget: e.groupTarget,
-        amount: e.amount,
-      }));
-      store.formAddProject.plannedGoals = plannedGoals;
-      store.formAddProject.plannedPeoples = plannedPeoples;
-
-      const actualGoals = data.actualGoals.map((e: ResActualGoals) => ({
-        groupTarget: e.groupTarget,
-        groupTargetSub: e.groupTargetSub,
-        position: e.position,
-        posTypeActualId: e.posTypeActualId,
-        posLevelActualId: e.posLevelActualId,
-        type: e.type,
-        amount: e.amount,
-      }));
-      const actualPeoples = data.actualPeoples.map((e: ResPeople) => ({
-        groupTarget: e.groupTarget,
-        amount: e.amount,
-      }));
-      store.formAddProject.actualGoals = actualGoals;
-      store.formAddProject.actualPeoples = actualPeoples;
-
-      // ลักษณะโครงการ
-      store.formAddProject.projectType = data.projectType;
-      store.formAddProject.projectCharacteristics = data.projectCharacteristics;
-      store.formAddProject.projectDay = data.projectDay;
-      store.formAddProject.projectNigth = data.projectNigth;
-      store.formAddProject.projectTechniques = data.projectTechniques;
-      store.formAddProject.projectModal = data.projectModal;
-
-      /** การติดตามผลดารประเมิน*/
-      store.formAddProject.metricType = data.metricType;
-      store.formAddProject.indicators = data.indicators;
-      store.formAddProject.target = data.target;
-      store.formAddProject.calculation = data.calculation;
-      store.formAddProject.measuRement = data.measuRement;
-      store.formAddProject.results = data.results;
-      store.formAddProject.obstacles = data.obstacles;
-      store.formAddProject.suggestions = data.suggestions;
-      store.formAddProject.project = data.project;
-      store.formAddProject.isPassAllocate = data.isPassAllocate;
-      store.formAddProject.isPassNoAllocate = data.isPassNoAllocate;
-      store.formAddProject.isNoPass = data.isNoPass;
-      store.formAddProject.isBudget = data.isBudget;
-      store.formAddProject.isOutBudget = data.isOutBudget;
-
-      /** อื่นๆ*/
-      store.formAddProject.dateStart = data.dateStart;
-      store.formAddProject.dateEnd = data.dateEnd;
-      store.formAddProject.totalDate = data.totalDate;
-      store.formAddProject.address = data.address;
-
-      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;
-      store.formAddProject.approved = data.approved;
-      store.formAddProject.budgetPay = data.budgetPay;
-      store.formAddProject.issues = data.issues;
-      store.formAddProject.chance = Number(data.chance);
-      store.formAddProject.effects = Number(data.effects);
-      store.formAddProject.riskLevel = data.riskLevel;
-      store.formAddProject.riskManagement = data.riskManagement;
-      store.formAddProject.expect = data.expect;
-      store.formAddProject.topicAcademic = data.topicAcademic;
-      store.formAddProject.addressAcademic = data.addressAcademic;
-      store.formAddProject.provinceActualId = data.provinceActualId;
     })
-    .catch((err) => {
+    .catch((e) => {
-      messageError($q, err);
+      messageError($q, e);
     })
     .finally(() => {
-      setTimeout(() => {
+      hideLoader();
-        hideLoader();
-      }, 1000);
     });
 }
 
-function onSubmit() {
-  if (store.formAddProject.projectName === "" && tab.value !== "BasicInfo") {
-    dialogMessageNotify($q, "ชื่อโครงการ/กิจกรรม/หลักสูตร");
-    tab.value = "BasicInfo";
-  } else {
-    dialogConfirm($q, async () => {
-      showLoader();
-      /** การติดตามผลดารประเมิน*/
-      if (store.formAddProject.project === "OFFER") {
-        store.formAddProject.isBudget = false;
-        store.formAddProject.isOutBudget = false;
-      } else {
-        store.formAddProject.isPassAllocate = false;
-        store.formAddProject.isPassNoAllocate = false;
-        store.formAddProject.isNoPass = false;
-      }
-
-      // ลักษณะโครงการ;
-      store.formAddProject.projectDay = store.formAddProject.projectDay
-        ? Number(store.formAddProject.projectDay)
-        : null;
-      store.formAddProject.projectNigth = store.formAddProject.projectNigth
-        ? Number(store.formAddProject.projectNigth)
-        : null;
-      store.formAddProject.projectModal = store.formAddProject.projectModal
-        ? Number(store.formAddProject.projectModal)
-        : null;
-
-      /** อื่นๆ*/
-      store.formAddProject.totalDate = Number(store.formAddProject.totalDate);
-      store.formAddProject.accept =
-        typeof store.formAddProject.accept === "string"
-          ? Number(store.formAddProject.accept.replace(/,/g, ""))
-          : store.formAddProject.accept;
-      store.formAddProject.receive =
-        typeof store.formAddProject.receive === "string"
-          ? Number(store.formAddProject.receive.replace(/,/g, ""))
-          : store.formAddProject.receive;
-      store.formAddProject.approved =
-        typeof store.formAddProject.approved === "string"
-          ? Number(store.formAddProject.approved.replace(/,/g, ""))
-          : store.formAddProject.approved;
-      store.formAddProject.budgetPay =
-        typeof store.formAddProject.budgetPay === "string"
-          ? Number(store.formAddProject.budgetPay.replace(/,/g, ""))
-          : store.formAddProject.budgetPay;
-
-      const url = projectId.value
-        ? config.API.developmentMainById(projectId.value)
-        : config.API.developmentMain;
-      const method = projectId.value ? "put" : "post";
-      try {
-        const res = await http[method](url, store.formAddProject);
-        success($q, "บันทึกข้อมูลสำเร็จ");
-        !projectId.value && router.push(`/development/${res.data.result}`);
-        projectId.value && fetchDataProject(projectId.value);
-      } catch (e) {
-        messageError($q, e);
-      } finally {
-        hideLoader();
-      }
-    });
-  }
-}
-
 function onFinish(id: string) {
   dialogConfirm(
     $q,
     async () => {
       showLoader();
       http
-        .get(config.API.developmentMainById(id)) // change path
+        .get(config.API.developmentMainFinish(id)) // change path
         .then((res) => {
+          getStatus(id);
           success($q, "บันทึกข้อมูลสำเร็จ");
         })
         .catch((e) => {
@@ -234,7 +250,7 @@ function onFinish(id: string) {
 }
 
 onMounted(() => {
-  projectId.value && fetchDataProject(projectId.value);
+  projectId.value && getStatus(projectId.value);
 });
 
 onUnmounted(() => {

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

@@ -26,15 +26,26 @@ const projectCharacteristicsOp = ref<DataOption[]>([
   { id: "HOLD", name: "พักค้าง" },
   { id: "GO_BACK_HOLD", name: "ไป-กลับและพักค้าง" },
 ]);
-const projectTechniquesOp = ref<DataOption[]>([
+// const projectTechniquesOp = ref<DataOption[]>([
-  { id: "TRAINING", name: "การอบรม" },
+//   { id: "TRAINING", name: "การอบรม" },
-  { id: "MEETING", name: "การประชุม" },
+//   { id: "MEETING", name: "การประชุม" },
-  { id: "SEMINAR", name: "การสัมมนา" },
+//   { id: "SEMINAR", name: "การสัมมนา" },
-  { id: "STUDY_TOUR", name: "การศึกษาดูงาน" },
+//   { id: "STUDY_TOUR", name: "การศึกษาดูงาน" },
-  { id: "ACADEMIC_SEMINAR", name: "การสัมมนาทางวิชาการ" },
+//   { id: "ACADEMIC_SEMINAR", name: "การสัมมนาทางวิชาการ" },
-  { id: "WORKSHOP", name: "การสัมมนาเชิงปฏิบัติการ" },
+//   { id: "WORKSHOP", name: "การสัมมนาเชิงปฏิบัติการ" },
-  { id: "SPECIAL_LECTURE", name: "การบรรยายพิเศษ" },
+//   { id: "SPECIAL_LECTURE", name: "การบรรยายพิเศษ" },
-  { id: "STUDY_TRAINING", name: "การฝึกศึกษา" },
+//   { id: "STUDY_TRAINING", name: "การฝึกศึกษา" },
+// ]);
+
+const projectTechniquesOp = ref<any[]>([
+  { value: "TRAINING", label: "การอบรม" },
+  { value: "MEETING", label: "การประชุม" },
+  { value: "SEMINAR", label: "การสัมมนา" },
+  { value: "STUDY_TOUR", label: "การศึกษาดูงาน" },
+  { value: "ACADEMIC_SEMINAR", label: "การสัมมนาทางวิชาการ" },
+  { value: "WORKSHOP", label: "การสัมมนาเชิงปฏิบัติการ" },
+  { value: "SPECIAL_LECTURE", label: "การบรรยายพิเศษ" },
+  { value: "STUDY_TRAINING", label: "การฝึกศึกษา" },
 ]);
 
 function onSubmit() {
@@ -50,7 +61,7 @@ function onSubmit() {
 <template>
   <q-form greedy @submit.prevent @validation-success="onSubmit">
     <div class="row q-pa-md q-col-gutter-sm">
-      <div class="col-12 col-sm-12 col-md-4">
+      <div class="col-12">
         <q-select
           dense
           outlined
@@ -64,53 +75,6 @@ function onSubmit() {
         />
       </div>
       <div class="col-12 col-sm-6 col-md-4">
-        <q-select
-          dense
-          outlined
-          v-model="store.formAddProject.projectCharacteristics"
-          :options="projectCharacteristicsOp"
-          label="ลักษณะ"
-          option-label="name"
-          option-value="id"
-          emit-value
-          map-options
-        />
-      </div>
-      <div class="col-12 col-sm-6 col-md-2">
-        <q-input
-          dense
-          outlined
-          v-model="store.formAddProject.projectDay"
-          label="จำนวน (วัน)"
-          mask="#"
-          reverse-fill-mask
-        />
-      </div>
-      <div class="col-12 col-sm-6 col-md-2">
-        <q-input
-          v-if="store.formAddProject.projectCharacteristics !== 'GO_BACK'"
-          dense
-          outlined
-          v-model="store.formAddProject.projectNigth"
-          label="จำนวน (คืน)"
-          mask="#"
-          reverse-fill-mask
-        />
-      </div>
-      <div class="col-12 col-sm-6 col-md-4">
-        <q-select
-          dense
-          outlined
-          v-model="store.formAddProject.projectTechniques"
-          :options="projectTechniquesOp"
-          label="เทคนิควิธีการที่ใช้ในการพัฒนา"
-          option-label="name"
-          option-value="id"
-          emit-value
-          map-options
-        />
-      </div>
-      <div class="col-12 col-sm-6 col-md-2">
         <q-input
           dense
           outlined
@@ -120,6 +84,149 @@ function onSubmit() {
           reverse-fill-mask
         />
       </div>
+
+      <div class="col-12"><q-separator class="q-my-md" /></div>
+
+      <div class="col-12 text-bold">รูปแบบโครงการตามแผน</div>
+
+      <div class="col-12 q-py-md">
+        <q-label>เทคนิควิธีการที่ใช้ในการพัฒนา</q-label>
+        <q-option-group
+          keep-color
+          color="primary"
+          dense
+          v-model="store.formAddProject.projectTechniques"
+          :options="projectTechniquesOp"
+          type="checkbox"
+          inline
+        />
+      </div>
+
+      <div class="row col-12 q-col-gutter-sm">
+        <div class="col-12 col-sm-2">
+          <q-checkbox
+            keep-color
+            color="primary"
+            dense
+            value="GO_BLACK"
+            label="ไป-กลับ"
+            v-model="store.formAddProject.projectCharacteristics"
+          ></q-checkbox>
+        </div>
+        <div class="col-12 col-sm-3">
+          <q-input
+            dense
+            outlined
+            v-model="store.formAddProject.projectDay"
+            label="จำนวน (วัน)"
+            mask="#"
+            reverse-fill-mask
+          />
+        </div>
+      </div>
+      <div class="row col-12 q-col-gutter-sm">
+        <div class="col-12 col-sm-2">
+          <q-checkbox
+            keep-color
+            color="primary"
+            dense
+            value="HOLD"
+            label="พักค้าง"
+            v-model="store.formAddProject.projectCharacteristics"
+          ></q-checkbox>
+        </div>
+        <div class="col-12 col-sm-3">
+          <q-input
+            dense
+            outlined
+            v-model="store.formAddProject.projectDay"
+            label="จำนวน (วัน)"
+            mask="#"
+            reverse-fill-mask
+          />
+        </div>
+        <div class="col-12 col-sm-3">
+          <q-input
+            dense
+            outlined
+            v-model="store.formAddProject.projectNigth"
+            label="จำนวน (คืน)"
+            mask="#"
+            reverse-fill-mask
+          />
+        </div>
+      </div>
+
+      <div class="col-12"><q-separator class="q-my-md" /></div>
+
+      <div class="col-12 text-bold">รูปแบบโครงการตามจริง</div>
+      <div class="col-12 q-py-md">
+        <q-label>เทคนิควิธีการที่ใช้ในการพัฒนา</q-label>
+        <q-option-group
+          keep-color
+          color="primary"
+          dense
+          v-model="store.formAddProject.projectTechniques"
+          :options="projectTechniquesOp"
+          type="checkbox"
+          inline
+        />
+      </div>
+
+      <div class="row col-12 q-col-gutter-sm">
+        <div class="col-12 col-sm-2">
+          <q-checkbox
+            keep-color
+            color="primary"
+            dense
+            value="GO_BLACK"
+            label="ไป-กลับ"
+            v-model="store.formAddProject.projectCharacteristics"
+          ></q-checkbox>
+        </div>
+        <div class="col-12 col-sm-3">
+          <q-input
+            dense
+            outlined
+            v-model="store.formAddProject.projectDay"
+            label="จำนวน (วัน)"
+            mask="#"
+            reverse-fill-mask
+          />
+        </div>
+      </div>
+      <div class="row col-12 q-col-gutter-sm">
+        <div class="col-12 col-sm-2">
+          <q-checkbox
+            keep-color
+            color="primary"
+            dense
+            value="HOLD"
+            label="พักค้าง"
+            v-model="store.formAddProject.projectCharacteristics"
+          ></q-checkbox>
+        </div>
+        <div class="col-12 col-sm-3">
+          <q-input
+            dense
+            outlined
+            v-model="store.formAddProject.projectDay"
+            label="จำนวน (วัน)"
+            mask="#"
+            reverse-fill-mask
+          />
+        </div>
+        <div class="col-12 col-sm-3">
+          <q-input
+            dense
+            outlined
+            v-model="store.formAddProject.projectNigth"
+            label="จำนวน (คืน)"
+            mask="#"
+            reverse-fill-mask
+          />
+        </div>
+      </div>
     </div>
     <q-separator />
     <div class="text-right q-pa-sm">