Merge branch 'develop' into devTee

# Conflicts:
#	src/modules/14_KPI/views/02_kpiLists.vue

src/modules/05_placement/components/probation/DialogOrder.vue

@@ -201,7 +201,7 @@ async function getList() {
           commandType.value ? (commandType.value == "C-PM-11" ? 2 : 3) : ""
         }&page=${pagination.value.page}&pageSize=${
           pagination.value.rowsPerPage
-        }&keyword=${filter.value}`
+        }&keyword=${filter.value.trim()}`
     )
     .then(async (res) => {
       const data = await res.data.result.data;

src/modules/05_placement/components/probation/DialogOrder/DialogSendToCommand.vue

@@ -179,7 +179,7 @@ watchEffect(() => {
             <d-table
               :columns="columns"
               :rows="rows"
-              :filter="filterKeyword"
+              :filter="filterKeyword.trim()"
               row-key="id"
               :visible-columns="visibleColumns"
               selection="single"

src/modules/05_placement/components/probation/FormAppoint/FormAppoint.vue

@@ -284,7 +284,7 @@ async function getPerson() {
       isDirector: isDirector.value,
       pageSize: pagination.value.rowsPerPage,
       page: pagination.value.page,
-      keyword: filterKeyword.value,
+      keyword: filterKeyword.value.trim(),
     })
     .then(async (res) => {
       const data = await res.data.result.data;

src/modules/05_placement/components/probation/MainAppoint.vue

@@ -214,7 +214,7 @@ onMounted(async () => {
           ref="table"
           :columns="columns"
           :rows="rows"
-          :filter="filterKeyword"
+          :filter="filterKeyword.trim()"
           row-key="Order"
           flat
           :visible-columns="visibleColumns"

src/modules/05_placement/components/probation/MainProbation.vue

@@ -246,9 +246,9 @@ async function getpersonalList() {
       config.API.probationPersonalList() +
         `?status=${!fillter.value ? "" : fillter.value}&page=${
           pagination.value.page
-        }&pageSize=${pagination.value.rowsPerPage}&keyword=${
+        }&pageSize=${
-          filterKeyword.value
+          pagination.value.rowsPerPage
-        }`
+        }&keyword=${filterKeyword.value.trim()}`
     )
     .then(async (res) => {
       const data = await res.data.result.data;

src/modules/07_insignia/components/2_Manage/Tab1.vue

@@ -750,12 +750,10 @@ function filterSelector(val: string, update: Function, name: string) {
   update(() => {
     const needle = val.toLowerCase();
     if (name === "typeinsigniaOptions") {
-      DataStore.typeinsignia = "";
       typeinsigniaOptions.value = DataStore.typeinsigniaOptions.filter(
         (v: OptionData) => v.name.toLowerCase().indexOf(needle) > -1
       );
     } else if (name === "employeeClassOps") {
-      DataStore.employeeClass = "";
       employeeClassOps.value = DataStore.employeeClassOps.filter(
         (v: OptionData) => v.name.toLowerCase().indexOf(needle) > -1
       );
@@ -832,6 +830,8 @@ onMounted(async () => {
           option-label="name"
           lazy-rules
           use-input
+          hide-selected
+          fill-input
           hide-bottom-space
           :readonly="false"
           :borderless="false"
@@ -846,7 +846,6 @@ onMounted(async () => {
         <q-space />
 
         <q-input
-          class="col-xs-12 col-sm-3 col-md-2"
           standout
           dense
           v-model="filterKeyword"
@@ -856,13 +855,7 @@ onMounted(async () => {
           placeholder="ค้นหา"
         >
           <template v-slot:append>
-            <q-icon v-if="filterKeyword == ''" name="search" />
+            <q-icon name="search" />
-            <q-icon
-              v-if="filterKeyword !== ''"
-              name="clear"
-              class="cursor-pointer"
-              @click="resetFilter"
-            />
           </template>
         </q-input>
 
@@ -878,7 +871,6 @@ onMounted(async () => {
           :options="columns"
           option-value="name"
           style="min-width: 140px"
-          class="col-xs-12 col-sm-3 col-md-2"
         />
       </div>
       <q-card bordered class="q-pa-sm col-12 bg-grey-1 q-mt-sm">
@@ -896,6 +888,8 @@ onMounted(async () => {
             lazy-rules
             hide-bottom-space
             use-input
+            hide-selected
+            fill-input
             :readonly="false"
             :borderless="false"
             :outlined="true"
@@ -940,6 +934,8 @@ onMounted(async () => {
             emit-value
             use-input
             map-options
+            hide-selected
+            fill-input
             option-label="name"
             :options="employeeClassOps"
             option-value="id"

src/modules/07_insignia/components/2_Manage/Tab2.vue

@@ -32,7 +32,6 @@ const props = defineProps({
 });
 
 const organization = ref<string>("1");
-const organizationOptions = ref<OptionData[]>([{ id: "1", name: "ทั้งหมด" }]);
 const filterOrganizationOP = ref<OptionData[]>([]); //หน่วยงาน
 const typeinsigniaOptions = ref<OptionData[]>(DataStore.typeinsigniaOptions); //ประเภทเครื่องราย
 const employeeClassOps = ref<OptionData[]>(DataStore.employeeClassOps); //ประเภทข้ารายกาช
@@ -226,12 +225,10 @@ function filterSelector(val: string, update: Function, name: string) {
   update(() => {
     const needle = val.toLowerCase();
     if (name === "typeinsigniaOptions") {
-      DataStore.typeinsignia = "";
       typeinsigniaOptions.value = DataStore.typeinsigniaOptions.filter(
         (v: OptionData) => v.name.toLowerCase().indexOf(needle) > -1
       );
     } else if (name === "employeeClassOps") {
-      DataStore.employeeClass = "";
       employeeClassOps.value = DataStore.employeeClassOps.filter(
         (v: OptionData) => v.name.toLowerCase().indexOf(needle) > -1
       );
@@ -312,7 +309,6 @@ watch(
         <q-space />
 
         <q-input
-          class="col-xs-12 col-sm-3 col-md-2"
           standout
           dense
           v-model="filterKeyword"
@@ -322,13 +318,7 @@ watch(
           placeholder="ค้นหา"
         >
           <template v-slot:append>
-            <q-icon v-if="filterKeyword == ''" name="search" />
+            <q-icon name="search" />
-            <q-icon
-              v-if="filterKeyword !== ''"
-              name="clear"
-              class="cursor-pointer"
-              @click="resetFilter"
-            />
           </template>
         </q-input>
 
@@ -344,7 +334,6 @@ watch(
           :options="columns"
           option-value="name"
           style="min-width: 140px"
-          class="col-xs-12 col-sm-3 col-md-2"
         />
       </div>
       <q-card bordered class="q-pa-sm col-12 bg-grey-1 q-mt-sm">
@@ -361,6 +350,8 @@ watch(
             lazy-rules
             hide-bottom-space
             use-input
+            hide-selected
+            fill-input
             :readonly="false"
             :borderless="false"
             :outlined="true"
@@ -404,6 +395,8 @@ watch(
             :label="`${'สถานภาพ'}`"
             emit-value
             use-input
+            hide-selected
+            fill-input
             map-options
             option-label="name"
             :options="employeeClassOps"

src/modules/07_insignia/components/2_Manage/Tab3.vue

@@ -3,7 +3,6 @@ import { onMounted, ref, watch } from "vue";
 
 import { checkPermission } from "@/utils/permissions";
 import { useInsigniaDataStore } from "@/modules/07_insignia/store";
-import { useroleUserDataStore } from "@/stores/roleUser";
 
 /** import Type*/
 import type { QTableProps } from "quasar";
@@ -15,7 +14,6 @@ import PopupPersonal from "@/components/Dialogs/PopupPersonalNew.vue";
 
 /** useStore*/
 const DataStore = useInsigniaDataStore();
-const roleDataStore = useroleUserDataStore();
 
 const props = defineProps({
   tab: {
@@ -151,6 +149,7 @@ const visibleColumns = ref<string[]>([
   "insigniaType",
   "insigniaSend",
   "insigniaLevel",
+  "dateSend",
 ]);
 
 /** function เลือกหน่วยงาน */
@@ -185,10 +184,7 @@ function updatemodalPersonal(modal: boolean) {
 /** ข้อมูล Table*/
 const filterKeyword = ref<string>("");
 const filterRef = ref<any>(null);
-const resetFilter = () => {
+
-  filterKeyword.value = "";
-  filterRef.value.focus();
-};
 const pagination = ref({
   sortBy: "name",
   descending: false,
@@ -226,12 +222,10 @@ function filterSelector(val: string, update: Function, name: string) {
   update(() => {
     const needle = val.toLowerCase();
     if (name === "typeinsigniaOptions") {
-      DataStore.typeinsignia = "";
       typeinsigniaOptions.value = DataStore.typeinsigniaOptions.filter(
         (v: OptionData) => v.name.toLowerCase().indexOf(needle) > -1
       );
     } else if (name === "employeeClassOps") {
-      DataStore.employeeClass = "";
       employeeClassOps.value = DataStore.employeeClassOps.filter(
         (v: OptionData) => v.name.toLowerCase().indexOf(needle) > -1
       );
@@ -313,7 +307,6 @@ watch(
         <q-space />
 
         <q-input
-          class="col-xs-12 col-sm-3 col-md-2"
           standout
           dense
           v-model="filterKeyword"
@@ -323,13 +316,7 @@ watch(
           placeholder="ค้นหา"
         >
           <template v-slot:append>
-            <q-icon v-if="filterKeyword == ''" name="search" />
+            <q-icon name="search" />
-            <q-icon
-              v-if="filterKeyword !== ''"
-              name="clear"
-              class="cursor-pointer"
-              @click="resetFilter"
-            />
           </template>
         </q-input>
 
@@ -345,7 +332,6 @@ watch(
           :options="columns"
           option-value="name"
           style="min-width: 140px"
-          class="col-xs-12 col-sm-3 col-md-2"
         />
       </div>
       <q-card bordered class="q-pa-sm col-12 bg-grey-1 q-mt-sm">

src/modules/07_insignia/views/01_RoundMain.vue

@@ -183,6 +183,7 @@ onMounted(async () => {
   await fetchData();
 });
 </script>
+
 <template>
   <div class="toptitle text-dark col-12 row items-center">
     รายการรอบการเสนอขอพระราชทานเครื่องราชอิสริยาภรณ์
@@ -205,7 +206,6 @@ onMounted(async () => {
         <q-space />
 
         <q-input
-          class="col-xs-12 col-sm-3 col-md-2"
           standout
           dense
           v-model="filterKeyword"
@@ -236,9 +236,7 @@ onMounted(async () => {
           map-options
           :options="columns"
           option-value="name"
-          
           style="min-width: 140px"
-          class="col-xs-12 col-sm-3 col-md-2"
         />
       </div>
       <div class="col-12">
@@ -252,7 +250,6 @@ onMounted(async () => {
           bordered
           :paging="true"
           dense
-          class="custom-header-table"
           :visible-columns="visibleColumns"
           v-model:pagination="pagination"
         >
@@ -324,7 +321,7 @@ onMounted(async () => {
 
               <q-td v-for="col in props.cols" :key="col.id">
                 <div>
-                  {{ col.value }}
+                  {{ col.value ?? "-" }}
                 </div>
               </q-td>
               <q-td auto-width>
@@ -360,51 +357,4 @@ onMounted(async () => {
   />
 </template>
 
-<style lang="scss" scope>
+<style lang="scss" scope></style>
-.filter-card {
-  background-color: #f1f1f1b0;
-}
-
-.toggle-expired-account {
-  font-size: 12px;
-  font-weight: 400;
-  font-size: 15px;
-  line-height: 150%;
-  color: #35373c;
-}
-
-.icon-color {
-  color: #4154b3;
-}
-
-.custom-header-table {
-  max-height: 64vh;
-
-  .q-table tr:nth-child(odd) td {
-    background: white;
-  }
-
-  .q-table tr:nth-child(even) td {
-    background: #f8f8f8;
-  }
-
-  .q-table thead tr {
-    background: #ecebeb;
-  }
-
-  .q-table thead tr th {
-    position: sticky;
-    z-index: 1;
-  }
-
-  /* this will be the loading indicator */
-  .q-table thead tr:last-child th {
-    /* height of all previous header rows */
-    top: 48px;
-  }
-
-  .q-table thead tr:first-child th {
-    top: 0;
-  }
-}
-</style>

src/modules/07_insignia/views/02_ManageMain.vue

@@ -5,7 +5,6 @@ import { useQuasar } from "quasar";
 import { useRoute } from "vue-router";
 import { useCounterMixin } from "@/stores/mixin";
 import { useInsigniaDataStore } from "@/modules/07_insignia/store";
-import { useroleUserDataStore } from "@/stores/roleUser";
 import { checkPermission } from "@/utils/permissions";
 import http from "@/plugins/http";
 import config from "@/app.config";

src/modules/14_KPI/components/Tab/Dialog/01_FormIndicator.vue

@@ -108,6 +108,7 @@ function fetchListPlan() {
   formFilter.nodeId = store.dataProfile.nodeId;
   formFilter.node = store.dataProfile.node;
   formFilter.year = formFilter?.year ? formFilter.year.toString() : "";
+  formFilter.keyword = formFilter.keyword.trim();
   // const kpiPeriodId = store.dataEvaluation.kpiPeriodId;
 
   showLoader();
@@ -164,6 +165,8 @@ function fetchListRole() {
   formFilter.node = store.dataProfile.node;
   formFilter.year = formFilter?.year ? formFilter.year.toString() : "";
   formFilter.position = store.dataProfile.position;
+  formFilter.keyword = formFilter.keyword.trim();
+  showLoader();
 
   http
     .post(config.API.kpiRole + `/search-kpi-role`, formFilter)
@@ -218,8 +221,10 @@ function fetchListSpecial() {
   formFilter.node = store.dataProfile.node;
   formFilter.year = formFilter?.year ? formFilter.year.toString() : "";
 
+  showLoader();
+
   const body = {
-    keyword: formFilter.keyword,
+    keyword: formFilter.keyword.trim(),
     period: formFilter.period,
     year: formFilter.year,
     pageSize: formFilter.pageSize,
@@ -575,13 +580,7 @@ watch(
                     @keydown.enter.prevent="fetchNewList()"
                   >
                     <template v-slot:append>
-                      <q-icon v-if="formFilter.keyword == ''" name="search" />
+                      <q-icon name="search" />
-                      <q-icon
-                        v-if="formFilter.keyword !== ''"
-                        name="clear"
-                        class="cursor-pointer"
-                        @click="(formFilter.keyword = ''), fetchNewList()"
-                      />
                     </template>
                   </q-input>
                 </div>

src/modules/14_KPI/components/Tab/Dialog/04_FormCompetency.vue

@@ -212,7 +212,7 @@ function getData() {
 }
 
 /** ฟิลเตอร์ */
-function filterTxt(val: any) {
+function filterTxt(val: string) {
   listTarget.value = listTargetMain.value.filter(
     (v: any) => v.name.indexOf(val) > -1
   );
@@ -320,13 +320,7 @@ watch(
                     @update:model-value="filterTxt"
                   >
                     <template v-slot:append>
-                      <q-icon v-if="search == ''" name="search" />
+                      <q-icon name="search" />
-                      <q-icon
-                        v-if="search !== ''"
-                        name="clear"
-                        class="cursor-pointer"
-                        @click="(search = ''), (listTarget = listTargetMain)"
-                      />
                     </template>
                   </q-input>
                 </div>

src/modules/14_KPI/components/Tab/Dialog/DialogEvalute.vue

@@ -36,14 +36,12 @@ const searchRules = ref<boolean>(false);
 const selected = ref<any[]>([]);
 const personId = ref<string>("");
 const modalPersonal = ref<boolean>(false);
-const searchRef = ref<any>(null);
 const rows = ref<tableType[]>([]);
 const type = ref<string>("citizenId");
 const search = ref<string>("");
 const typeOps = ref<typeOp[]>([
   { id: "citizenId", name: "เลขประจำตัวประชาชน" },
-  { id: "firstname", name: "ชื่อ" },
+  { id: "fullName", name: "ชื่อ-นามสกุล" },
-  { id: "lastname", name: "นามสกุล" },
 ]);
 
 const modalDialog = defineModel<boolean>("modal", { required: true });
@@ -152,6 +150,11 @@ function onCloseDialog() {
   selected.value = [];
   search.value = "";
   type.value = "citizenId";
+  roundDialgOp.value = [];
+  evaluatorIdMainOp.value = [];
+  commanderIdMainOp.value = [];
+  commanderHighMainOp.value = [];
+  isRoundClose.value = false;
 }
 
 /** ดึงข้อมูลตามรอบการประเมิน */
@@ -192,26 +195,26 @@ function fetchRoundOption() {
  * @param update function Quasar
  * @param refData เเยกประเภท
  */
-function filterOption(val: any, update: Function, refData: string) {
+function filterOption(val: string, update: Function, refData: string) {
   switch (refData) {
     case "evaluatorIdOp":
       update(() => {
         evaluatorIdOp.value = evaluatorIdMainOp.value.filter(
-          (v: any) => v.name.indexOf(val) > -1
+          (v: DataOption) => v.name.indexOf(val) > -1
         );
       });
       break;
     case "commanderIdOp":
       update(() => {
         commanderIdOp.value = commanderIdMainOp.value.filter(
-          (v: any) => v.name.indexOf(val) > -1
+          (v: DataOption) => v.name.indexOf(val) > -1
         );
       });
       break;
     case "commanderHighOp":
       update(() => {
         commanderHighOp.value = commanderHighMainOp.value.filter(
-          (v: any) => v.name.indexOf(val) > -1
+          (v: DataOption) => v.name.indexOf(val) > -1
         );
       });
       break;
@@ -229,37 +232,35 @@ function checkClosed() {
 async function searchInput(check: boolean) {
   if (check) {
     searchRules.value = check;
-    searchRef.value.validate();
-    if (!searchRef.value.hasError) {
-      showLoader();
-      const body = {
-        fieldName: type.value,
-        keyword: search.value,
-      };
-      await http
-        .post(
-          config.API.orgSearchPersonal() +
-            `?page=${query.page}&pageSize=${query.pageSize}`,
-          body
-        )
-        .then((res) => {
-          const data = res.data.result;
-          maxPage.value = Math.ceil(data.total / query.pageSize);
-          total.value = data.total;
 
-          rows.value = data.data;
+    showLoader();
-        })
+    const body = {
-        .catch((err) => {
+      fieldName: type.value,
-          messageError($q, err);
+      keyword: search.value.trim(),
-        })
+    };
-        .finally(() => {
+    await http
-          hideLoader();
+      .post(
-        });
+        config.API.orgSearchPersonal() +
-    }
+          `?page=${query.page}&pageSize=${query.pageSize}`,
-    setTimeout(() => {
+        body
-      searchRules.value = false;
+      )
-    }, 100);
+      .then((res) => {
+        const data = res.data.result;
+        maxPage.value = Math.ceil(data.total / query.pageSize);
+        total.value = data.total;
+
+        rows.value = data.data;
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
   }
+  setTimeout(() => {
+    searchRules.value = false;
+  }, 100);
 }
 
 /** update เมื่อเปลี่ยน option */
@@ -356,6 +357,17 @@ async function updatePagination(initialPagination: NewPagination) {
   query.pageSize = initialPagination.rowsPerPage;
 }
 
+/**
+ * class input
+ * @param val
+ */
+function classInput(val: boolean) {
+  return {
+    "full-width cursor-pointer ": val,
+    "full-width cursor-pointer inputgreen": !val,
+  };
+}
+
 watch(
   () => modalDialog.value,
   (n) => {
@@ -380,6 +392,7 @@ watch(
         <q-separator />
         <q-card-section class="q-pa-none scroll" style="max-height: 80vh">
           <div class="row q-col-gutter-sm">
+            <!-- รายชื่อ -->
             <div class="col-12 col-md-9">
               <div class="row q-pa-md q-col-gutter-sm">
                 <div class="col-12 col-sm-6 col-md-3">
@@ -399,19 +412,16 @@ watch(
 
                 <div class="col-12 col-sm-6 col-md-9">
                   <q-input
-                    ref="searchRef"
                     v-model="search"
                     outlined
-                    clearable
                     hide-bottom-space
                     dense
                     label="คำค้น"
-                    :rules="[
+                    @keydown.enter.pervent="(query.page = 1), searchInput(true)"
-                      (val:string) => !!val || !searchRules || `กรุณากรอกคำค้น`,
-                    ]"
                   >
                     <template v-slot:after>
                       <q-btn
+                        outline
                         color="primary"
                         icon="search"
                         label="ค้นหา"
@@ -477,7 +487,7 @@ watch(
                             }}{{
                               props.row.positionLevelName
                                 ? ` (${props.row.positionLevelName})`
-                                : ""
+                                : "-"
                             }}
                           </div>
                           <div
@@ -487,7 +497,7 @@ watch(
                             {{ findOrgName(props.row) }}
                           </div>
                           <div v-else>
-                            {{ col.value }}
+                            {{ col.value ?? "-" }}
                           </div>
                         </q-td>
                       </q-tr>
@@ -510,10 +520,13 @@ watch(
                 </div>
               </div>
             </div>
+
+            <!-- form  -->
             <div class="col-12 col-md-3 bg-grey-2">
               <div class="row q-pa-md q-col-gutter-sm">
                 <div class="col-12">
                   <datepicker
+                    :disable="selected.length === 0"
                     menu-class-name="modalfix"
                     v-model="yearDialog"
                     :locale="'th'"
@@ -521,6 +534,7 @@ watch(
                     year-picker
                     :enableTimePicker="false"
                     @update:model-value="fetchRoundOption()"
+                    :class="classInput(false)"
                   >
                     <template #year="{ year }">{{ year + 543 }}</template>
                     <template #year-overlay-value="{ value }">{{
@@ -528,6 +542,7 @@ watch(
                     }}</template>
                     <template #trigger>
                       <q-input
+                        :disable="selected.length === 0"
                         dense
                         lazy-rules
                         outlined
@@ -555,6 +570,8 @@ watch(
 
                 <div class="col-12">
                   <q-select
+                    :disable="selected.length === 0"
+                    :class="classInput(false)"
                     :readonly="yearDialog === null"
                     v-model="formRound.kpiPeriodId"
                     outlined
@@ -575,6 +592,8 @@ watch(
 
                 <div class="col-12">
                   <q-select
+                    :disable="selected.length === 0"
+                    :class="classInput(false)"
                     v-model="formRound.evaluatorId"
                     outlined
                     label="ผู้ประเมิน"
@@ -592,7 +611,9 @@ watch(
                     !!val || `${'กรุณาเลือกผู้ประเมิน'}`,
                 ]"
                     use-input
-                    @filter="(inputValue:any,
+                    hide-selected
+                    fill-input
+                    @filter="(inputValue:string,
                     doneFn:Function) => filterOption(inputValue, doneFn,'evaluatorIdOp'
                     ) "
                   >
@@ -605,8 +626,11 @@ watch(
                     </template>
                   </q-select>
                 </div>
+
                 <div class="col-12">
                   <q-select
+                    :disable="selected.length === 0"
+                    :class="classInput(false)"
                     v-model="formRound.commanderId"
                     outlined
                     label="ผู้บังคับบัญชาเหนือขึ้นไป"
@@ -618,7 +642,9 @@ watch(
                     emit-value
                     map-options
                     use-input
-                    @filter="(inputValue:any,
+                    hide-selected
+                    fill-input
+                    @filter="(inputValue:string,
                     doneFn:Function) => filterOption(inputValue, doneFn,'commanderIdOp'
                     ) "
                   >
@@ -638,8 +664,11 @@ watch(
                     </template>
                   </q-select>
                 </div>
+
                 <div class="col-12">
                   <q-select
+                    :disable="selected.length === 0"
+                    :class="classInput(false)"
                     v-model="formRound.commanderHighId"
                     outlined
                     label="ผู้บังคับบัญชาเหนือขึ้นไปอีกชั้นหนึ่ง"
@@ -651,7 +680,9 @@ watch(
                     emit-value
                     map-options
                     use-input
-                    @filter="(inputValue:any,
+                    hide-selected
+                    fill-input
+                    @filter="(inputValue:string,
                     doneFn:Function) => filterOption(inputValue, doneFn,'commanderHighOp'
                     ) "
                   >
@@ -683,7 +714,7 @@ watch(
             รอบการประเมินนี้ปิดแล้ว
           </div>
           <q-btn
-            :disable="isRoundClose"
+            :disable="isRoundClose || selected.length === 0"
             label="บันทึก"
             color="secondary"
             type="submit"

src/modules/14_KPI/components/Tab/Dialog/DialogGovernment.vue

@@ -223,7 +223,7 @@ watch(
   (n) => {
     if (n == true) {
       getData();
-    }
+    } else rows.value = [];
   }
 );
 </script>

src/modules/14_KPI/components/results/tableResults.vue

@@ -387,6 +387,8 @@ onMounted(async () => {
               outlined
               @clear="(result = ''), (resultOp = store.resultsOptions)"
               use-input
+              hide-selected
+              fill-input
               :clearable="result !== ''"
               @update:model-value="onSearchData()"
               input-debounce="0"

src/modules/14_KPI/views/01_kpiRound.vue

@@ -356,9 +356,9 @@ onMounted(async () => {
   <div class="toptitle text-dark col-12 row items-center">
     รายการรอบการประเมินผลการปฏิบัติหน้าที่ราชการ
   </div>
-  <q-card flat bordered class="q-pa-md">
+  <q-card flat bordered class="col-12 q-pa-md">
-    <q-toolbar style="padding: 0px">
+    <div class="row q-col-gutter-sm">
-      <div class="row q-gutter-sm">
+      <div class="row col-12">
         <datepicker
           menu-class-name="modalfix"
           v-model="formQuery.year"
@@ -401,21 +401,20 @@ onMounted(async () => {
             </q-input>
           </template>
         </datepicker>
+
         <q-btn
           v-if="checkPermission($route)?.attrIsCreate"
           flat
           round
-          dense
           icon="add"
           color="primary"
           @click="onClickAddOrView()"
         >
           <q-tooltip>เพิ่ม</q-tooltip>
         </q-btn>
-      </div>
 
-      <q-space />
+        <q-space />
-      <div class="row q-gutter-sm">
+
         <q-select
           v-model="visibleColumns"
           multiple
@@ -430,82 +429,82 @@ onMounted(async () => {
           style="min-width: 140px"
         />
       </div>
-    </q-toolbar>
 
-    <div class="col-12">
+      <div class="col-12">
-      <d-table
+        <d-table
-        for="table"
+          for="table"
-        ref="table"
+          ref="table"
-        :columns="columns"
+          :columns="columns"
-        :rows="rows"
+          :rows="rows"
-        row-key="subject"
+          row-key="subject"
-        flat
+          flat
-        bordered
+          bordered
-        dense
+          dense
-        class="custom-header-table"
+          class="custom-header-table"
-        :visible-columns="visibleColumns"
+          :visible-columns="visibleColumns"
-        :rows-per-page-options="[10, 25, 50, 100]"
+          :rows-per-page-options="[10, 25, 50, 100]"
-        @update:pagination="updatePagination"
+          @update:pagination="updatePagination"
-      >
+        >
-        <template v-slot:header="props">
+          <template v-slot:header="props">
-          <q-tr :props="props">
+            <q-tr :props="props">
-            <q-th auto-width />
+              <q-th auto-width />
-            <q-th v-for="col in props.cols" :key="col.name" :props="props">
+              <q-th v-for="col in props.cols" :key="col.name" :props="props">
-              <span class="text-weight-medium">{{ col.label }}</span>
+                <span class="text-weight-medium">{{ col.label }}</span>
-            </q-th>
+              </q-th>
-          </q-tr>
+            </q-tr>
-        </template>
+          </template>
-        <template v-slot:body="props">
+          <template v-slot:body="props">
-          <q-tr :props="props">
+            <q-tr :props="props">
-            <q-td>
+              <q-td>
-              <q-btn
+                <q-btn
-                v-if="checkPermission($route)?.attrIsUpdate !== false"
+                  v-if="checkPermission($route)?.attrIsUpdate !== false"
-                flat
+                  flat
-                round
+                  round
-                dense
+                  dense
-                :disable="!props.row.isActive"
+                  :disable="!props.row.isActive"
-                :color="props.row.isActive ? 'orange' : 'grey'"
+                  :color="props.row.isActive ? 'orange' : 'grey'"
-                icon="mdi-close"
+                  icon="mdi-close"
-                @click="onClickAction('close', props.row.id)"
+                  @click="onClickAction('close', props.row.id)"
-              >
+                >
-                <q-tooltip>ปิดรอบ</q-tooltip>
+                  <q-tooltip>ปิดรอบ</q-tooltip>
-              </q-btn>
+                </q-btn>
-              <q-btn
+                <q-btn
-                v-if="checkPermission($route)?.attrIsDelete !== false"
+                  v-if="checkPermission($route)?.attrIsDelete !== false"
-                clickable
+                  clickable
-                v-close-popup
+                  v-close-popup
-                @click="onClickAction('delete', props.row.id)"
+                  @click="onClickAction('delete', props.row.id)"
-                flat
+                  flat
-                round
+                  round
-                dense
+                  dense
-                color="red"
+                  color="red"
-                icon="mdi-delete"
+                  icon="mdi-delete"
-              >
+                >
-                <q-tooltip>ลบรอบ</q-tooltip>
+                  <q-tooltip>ลบรอบ</q-tooltip>
-              </q-btn>
+                </q-btn>
-            </q-td>
+              </q-td>
-            <q-td v-for="col in props.cols" :key="col.name" :props="props">
+              <q-td v-for="col in props.cols" :key="col.name" :props="props">
-              <div class="table_ellipsis">
+                <div class="table_ellipsis">
-                {{ col.value ? col.value : "-" }}
+                  {{ col.value ? col.value : "-" }}
-              </div>
+                </div>
-            </q-td>
+              </q-td>
-          </q-tr>
+            </q-tr>
-        </template>
+          </template>
-        <template v-slot:pagination="scope">
+          <template v-slot:pagination="scope">
-          ทั้งหมด {{ total }} รายการ
+            ทั้งหมด {{ total }} รายการ
-          <q-pagination
+            <q-pagination
-            v-model="formQuery.page"
+              v-model="formQuery.page"
-            active-color="primary"
+              active-color="primary"
-            color="dark"
+              color="dark"
-            :max="Number(totalList)"
+              :max="Number(totalList)"
-            size="sm"
+              size="sm"
-            boundary-links
+              boundary-links
-            direction-links
+              direction-links
-            :max-pages="5"
+              :max-pages="5"
-            @update:model-value="fetchList"
+              @update:model-value="fetchList"
-          ></q-pagination>
+            ></q-pagination>
-        </template>
+          </template>
-      </d-table>
+        </d-table>
+      </div>
     </div>
   </q-card>
 

src/modules/14_KPI/views/detailView.vue

@@ -409,7 +409,6 @@ async function fetchProfileEvaluator(id: string) {
   http
     .get(config.API.profilePosition + `/${id}`)
     .then((res) => {
-      console.log(res.data.result);
       const data = res.data.result;
       evaluator.value.fullName =
         data.prefix + data.firstName + " " + data.lastName;
@@ -892,7 +891,9 @@ onUnmounted(() => {
                   :rules="[ (val:string) => !!val ||
             `${'กรุณาเลือกผู้ประเมิน'}`, ]"
                   use-input
-                  @filter="(inputValue:any,
+                  hide-selected
+                  fill-input
+                  @filter="(inputValue:string,
             doneFn:Function) => filterOption(inputValue, doneFn,'evaluatorIdOp'
             ) "
                 />
@@ -930,7 +931,9 @@ onUnmounted(() => {
                   map-options
                   class="inputgreen"
                   use-input
-                  @filter="(inputValue:any,
+                  hide-selected
+                  fill-input
+                  @filter="(inputValue:string,
                     doneFn:Function) => filterOption(inputValue, doneFn,'commanderIdOp'
                     ) "
                 >
@@ -983,7 +986,9 @@ onUnmounted(() => {
                   map-options
                   use-input
                   class="inputgreen"
-                  @filter="(inputValue:any,
+                  hide-selected
+                  fill-input
+                  @filter="(inputValue:string,
                     doneFn:Function) => filterOption(inputValue, doneFn,'commanderHighOp'
                     ) "
                 >

src/modules/14_KPI/views/report.vue

@@ -429,6 +429,7 @@ function onCloseModal() {
  * function fetch รายชื่อข้อมูลทะเบียนประวัติ
  */
 function fetchListPerson() {
+  rowsPerson.value = []
   showLoader();
   let queryParams = {
     page: formFilter.page,
@@ -796,13 +797,13 @@ onMounted(() => {
               class="bg-white"
               v-model="formFilter.searchKeyword"
               outlined
-              clearable
               hide-bottom-space
               dense
               label="คำค้น"
             >
               <template v-slot:after>
                 <q-btn
+                  outline
                   color="primary"
                   icon="search"
                   label="ค้นหา"
@@ -811,6 +812,9 @@ onMounted(() => {
                 >
                 </q-btn>
               </template>
+              <template v-slot:append>
+                <q-icon name="search" color="grey-5" />
+              </template>
             </q-input>
           </div>
         </div>