บันทึกผล

src/modules/15_development/views/MainPage.vue

@@ -6,8 +6,6 @@ import genReportXLSX from "@/plugins/genreportxlsx";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
-import DialogHeader from "@/components/DialogHeader.vue";
-
 /**importType*/
 import type {
   DataOption,
@@ -22,12 +20,19 @@ import type {
   DataTree,
 } from "@/modules/15_development/interface/response/Main";
 
+/**
+ * importComponents
+ */
+import DialogHeader from "@/components/DialogHeader.vue";
+import { useDevelopmentDataStore } from "@/modules/15_development/store/developmentStore";
+
 /** importStore*/
 import { useCounterMixin } from "@/stores/mixin";
 
 /** use*/
 const $q = useQuasar();
 const router = useRouter();
+const store = useDevelopmentDataStore();
 const {
   showLoader,
   hideLoader,
@@ -144,13 +149,17 @@ function onAdd() {
   modal.value = true;
 }
 
-/** function fetchข้อมูลหน้าแรกใหม่*/
+/**
+ * function fetchข้อมูลหน้าแรกใหม่
+ */
 function fetchListProjectNew() {
   formQuery.page = 1;
   fetchListProject();
 }
 
-/** function Download รายการโครงการ*/
+/**
+ * function Download รายการโครงการ
+ */
 function onDownload() {
   showLoader();
   http
@@ -170,7 +179,9 @@ function onDownload() {
     });
 }
 
-/** function ปิด Dialog เพิ่มโครงการ/หลักสูตรการฝึกอบรม*/
+/**
+ * function ปิด Dialog เพิ่มโครงการ/หลักสูตรการฝึกอบรม
+ */
 function closeDialog() {
   modal.value = false;
   formProject.year = null;
@@ -179,12 +190,14 @@ function closeDialog() {
   formProject.nodeId = "";
 }
 
-/** dialog submit */
-async function onSubmit() {
+/**
+ * dialog submit
+ */
+function onSubmit() {
   if (formProject.nodeId) {
     dialogConfirm($q, async () => {
-      await showLoader();
-      await http
+      showLoader();
+      http
         .post(config.API.developmentMain, formProject)
         .then(async (res) => {
           await closeDialog();
@@ -235,14 +248,18 @@ function fetchTree(id: string) {
     });
 }
 
-/** function เลือกหน่วยงานที่รับผิดชอบ*/
+/**
+ * function เลือกหน่วยงานที่รับผิดชอบ
+ */
 function updateSelected(data: DataTree) {
   formProject.node = data.orgLevel;
   formProject.nodeId = data.orgTreeId;
   formProject.orgRevisionId = data.orgRevisionId;
 }
 
-/** function เลือกหน่วยงานที่จะค้นหาโครงการ */
+/**
+ * function เลือกหน่วยงานที่จะค้นหาโครงกา
+ */
 function updateSelectedTreeMain(data: DataTree) {
   if (formQuery.node === data.orgLevel && formQuery.nodeId === data.orgTreeId) {
     formQuery.node = null;
@@ -263,6 +280,14 @@ function updatePagination(newPagination: NewPagination) {
   formQuery.pageSize = newPagination.rowsPerPage;
 }
 
+/**
+ * function redirect หน้าบันทึกผล
+ * @param id โครงการ
+ */
+function onRedirectToRecordPage(id: string) {
+  router.push(`/development/record/${id}`);
+}
+
 /** callbackFunction ทำเมื่อมีการอัปเดท pageSize*/
 watch(
   () => formQuery.pageSize,
@@ -274,6 +299,7 @@ watch(
 /** ดึงข้อมูลเมื่อโหลดหน้าเสร็จสิ้น */
 onMounted(() => {
   fetchActive();
+  formQuery.status = store.projectStatus;
 });
 </script>
 
@@ -282,6 +308,7 @@ onMounted(() => {
     รายการโครงการ/หลักสูตรการฝึกอบรมที่หน่วยงานของกรุงเทพมหานครเป็นผู้จัด
   </div>
   <q-card bordered class="col-12 row caedNone">
+    <!-- หน่วยงาน/ส่วนราชการ -->
     <div class="col-xs-12 col-sm-3 row">
       <div class="col-12 row no-wrap">
         <div class="col-12 q-py-sm q-px-sm">
@@ -342,6 +369,8 @@ onMounted(() => {
         </div>
       </div>
     </div>
+
+    <!-- รายการโครงการ -->
     <div class="col-xs-12 col-sm-9 q-pa-md row">
       <div class="col-12">
         <q-toolbar class="row col-8 q-pa-none q-gutter-x-sm" style="padding: 0">
@@ -479,6 +508,7 @@ onMounted(() => {
           >
             <template v-slot:header="props">
               <q-tr :props="props">
+                <q-th v-if="formQuery.status === 'FINISH'" auto-width />
                 <q-th v-for="col in props.cols" :key="col.name" :props="props">
                   <span class="text-weight-medium">{{ col.label }}</span>
                 </q-th>
@@ -486,11 +516,23 @@ onMounted(() => {
             </template>
             <template v-slot:body="props">
               <q-tr :props="props" class="cursor-pointer">
+                <q-td v-if="formQuery.status === 'FINISH'">
+                  <q-btn
+                    flat
+                    round
+                    color="public"
+                    icon="mdi-content-save-edit-outline"
+                    size="12px"
+                    @click.pervent="onRedirectToRecordPage(props.row.id)"
+                  >
+                    <q-tooltip>บันทึกผล</q-tooltip></q-btn
+                  >
+                </q-td>
                 <q-td
                   v-for="col in props.cols"
                   :key="col.name"
                   :props="props"
-                  @click="onClickAddOrView(true, props.row.id)"
+                  @click.pervent="onClickAddOrView(true, props.row.id)"
                 >
                   <div class="table_ellipsis">
                     {{ col.value ? col.value : "-" }}
@@ -518,6 +560,7 @@ onMounted(() => {
     </div>
   </q-card>
 
+  <!-- Popup เพิ่มโครงการ/หลักสูตรการฝึกอบรม -->
   <q-dialog persistent v-model="modal">
     <q-card flat bordered style="min-width: 60vw">
       <q-form greedy @submit.prevent @validation-success="onSubmit()">