no message

src/modules/15_development/components/history/AddPage.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, reactive } from "vue";
+import { ref, reactive,onMounted} from "vue";
 import { useRoute, useRouter } from "vue-router";
 import type {
   FormAddHistory,
@@ -213,6 +213,10 @@ function getClass() {
 }
 /** save */
 function onSubmit() {
+  const url = store.status
+      ? config.API.developmentHistoryList('officer')+`${id.value}`
+      : config.API.developmentHistoryAdd('officer')
+
   const body = {
   rank:null,
   prefix:formMain.prefix,
@@ -230,12 +234,11 @@ function onSubmit() {
     }
     dialogConfirm($q,()=>{
       showLoader()
-      http
-      .post(config.API.developmentHistoryAdd('officer'),body)
+      http[store.status ? 'put':'post'](url,body)
       .then((res)=>{
         console.log(res)
         router.push(`/development/history`)
-      }).catch((e)=>{
+              }).catch((e)=>{
         messageError($q,e)
       }).finally(()=>{
         hideLoader()
@@ -264,6 +267,26 @@ function upDateProject(data: any) {
   formMainProject.project = data.project;
   formMainProject.year = data.year;
 }
+
+function getDataEdit(){
+  showLoader()
+  http
+  .get(config.API.developmentHistoryList('officer')+`${id.value}`)
+  .then((res)=>{
+    console.log(res)
+  }).catch((e)=>{
+    messageError($q,e)
+  }).finally(()=>{
+    hideLoader()
+  })
+}
+
+onMounted(()=>{
+  if(store.status == true){
+    console.log(1)
+    // getDataEdit()
+  }
+})
 </script>
 <template>
   <div class="toptitle text-dark">
@@ -277,7 +300,7 @@ function upDateProject(data: any) {
       class="q-mr-sm"
       @click="router.go(-1)"
     />
-    <span>{{ id ? `แก้ไขประวัติการฝึกอบรม/ดูงานของข้าราชการกรุงเทพมหานครสามัญ`:`เพิ่มประวัติการฝึกอบรม/ดูงานของข้าราชการกรุงเทพมหานครสามัญ`}}</span
+    <span>{{ store.status ? `แก้ไขประวัติการฝึกอบรม/ดูงานของข้าราชการกรุงเทพมหานครสามัญ`:`เพิ่มประวัติการฝึกอบรม/ดูงานของข้าราชการกรุงเทพมหานครสามัญ`}}</span
     >
   </div>
   <q-card flat bordered>
@@ -285,13 +308,13 @@ function upDateProject(data: any) {
       <q-card-section>
         <q-card flat bordered style="border: 1px solid #d6dee1">
           <div class="col-12 text-weight-bold bg-grey-1 q-py-sm q-px-md">
-            ข้อมูลข้าราชการ
+            ข้อมูลข้าราชการฯ
 
             <q-btn
               flat
               class="btn-fixed-width"
               color="teal"
-              label="เลือกข้าราชการ"
+              label="เลือกข้าราชการฯ"
               icon="add"
               @click="openDialogGov()"
             />
@@ -363,9 +386,8 @@ function upDateProject(data: any) {
                   }}</span>
                 </div>
                 <div class="col-12 col-sm-12 col-md-8">
-                  <span>{{
-                    formMainProject[field] ? formMainProject[field] : "-"
-                  }}</span>
+                  <span v-if='index == 1 '>{{ formMainProject[field] ? formMainProject[field] + 543 : "-" }}</span>
+                  <span v-else>{{ formMainProject[field] ? formMainProject[field] : "-" }}</span>
                 </div>
               </div>
             </div>

src/modules/15_development/components/history/DialogGov.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { ref, watch, computed,reactive } from "vue";
 import Header from "@/components/DialogHeader.vue";
-import type { DataOption,FormFilter } from "@/modules/15_development/interface/index/Main";
+import type { DataOption,FormFilter,NewPagination } from "@/modules/15_development/interface/index/Main";
 import { useDevelopmentDataStoreHistory } from "@/modules/15_development/store/developmentStoreHistory";
 import { useCounterMixin } from "@/stores/mixin";
 import { useQuasar } from "quasar";
@@ -33,7 +33,7 @@ const formFilter = reactive<FormFilter>({
 
 const pagination = ref({
   page: 1,
-  rowsPerPage: 10,
+  rowsPerPage: 20,
 });
 
 const $q = useQuasar();
@@ -143,11 +143,28 @@ function searchFilter() {
       hideLoader();
     });
 }
+
+function updatePage(val:number){
+  formFilter.page = val;
+  searchFilter();
+}
+
+function updatePageSize(newPagination: NewPagination) {
+  formFilter.page = 1;
+  formFilter.pageSize = newPagination.rowsPerPage;
+}
+
+watch(
+  () => formFilter.pageSize,
+  () => {
+    searchFilter();
+  }
+);
 </script>
 <template>
   <q-dialog v-model="modal" persistent>
     <q-card class="col-12" style="width: 60%">
-      <Header :tittle="'เลือกข้าราชการ'" :close="closeDialog" />
+      <Header :tittle="'เลือกข้าราชการฯ'" :close="closeDialog" />
       <q-separator />
 
       <q-card-section>
@@ -180,7 +197,7 @@ function searchFilter() {
           <div class="col-2">
             <q-btn
               label="ค้นหา"
-              class="full-width full-height"
+              class="full-width"
               unelevated
               color="teal"
               @click="searchFilter()"
@@ -205,7 +222,8 @@ function searchFilter() {
             class="custom-header-table"
             :visible-columns="store.visibleColumns"
             v-model:pagination="pagination"
-            :rows-per-page-options="[10, 25, 50, 100]"
+            :rows-per-page-options="[20, 25, 50, 100]"
+            @update:pagination="updatePageSize"
           >
             <template v-slot:pagination="scope">
               <q-pagination
@@ -217,6 +235,7 @@ function searchFilter() {
                 size="sm"
                 boundary-links
                 direction-links
+                @update:model-value="updatePage"
               ></q-pagination>
             </template>
             <template v-slot:header="props">

src/modules/15_development/components/history/DialogProject.vue

@@ -4,6 +4,7 @@ import Header from "@/components/DialogHeader.vue";
 import type {
   DataOption,
   FormFilter,
+  NewPagination,
 } from "@/modules/15_development/interface/index/Main";
 import { useDevelopmentDataStoreHistory } from "@/modules/15_development/store/developmentStoreHistory";
 import { useCounterMixin } from "@/stores/mixin";
@@ -33,7 +34,7 @@ const modal = defineModel<boolean>("modal", { required: true });
 const maxPage = ref<number>(1);
 const pagination = ref({
   page: 1,
-  rowsPerPage: 10,
+  rowsPerPage: 20,
 });
 
 const formFilter = reactive<FormFilter>({
@@ -135,6 +136,23 @@ function searchFilter() {
       hideLoader();
     });
 }
+
+function updatePage(val:number){
+  formFilter.page = val;
+  searchFilter();
+}
+
+function updatePageSize(newPagination: NewPagination) {
+  formFilter.page = 1;
+  formFilter.pageSize = newPagination.rowsPerPage;
+}
+
+watch(
+  () => formFilter.pageSize,
+  () => {
+    searchFilter();
+  }
+);
 </script>
 <template>
   <q-dialog v-model="modal" persistent>
@@ -212,7 +230,7 @@ function searchFilter() {
           <div class="col-2">
             <q-btn
               label="ค้นหา"
-              class="full-width full-height"
+              class="full-width"
               unelevated
               color="teal"
               @click="searchFilter()"
@@ -235,7 +253,8 @@ function searchFilter() {
             class="custom-header-table"
             :visible-columns="store.visibleColumns"
             v-model:pagination="pagination"
-            :rows-per-page-options="[10, 25, 50, 100]"
+            :rows-per-page-options="[20, 25, 50, 100]"
+            @update:pagination="updatePageSize"
           >
             <template v-slot:pagination="scope">
               <q-pagination
@@ -247,6 +266,7 @@ function searchFilter() {
                 size="sm"
                 boundary-links
                 direction-links
+                @update:model-value="updatePage"
               ></q-pagination>
             </template>
             <template v-slot:header="props">