API รายการการประเมินผลการปฏิบัติราชการระดับบุคคล

src/modules/08_KPI/components/Tab/04_File.vue

@@ -25,6 +25,8 @@ interface ArrayFileList {
   fileName: string;
 }
 
+const isReadonly = <boolean>(route.name === "KPIEditEvaluator" ? true : false);
+
 const documentFile = ref<any>(null);
 const fileList = ref<ArrayFileList[]>([]);
 
@@ -156,7 +158,7 @@ onMounted(() => {
       </div>
       <div class="col-12"><q-separator /></div>
       <div class="row col-12 q-col-gutter-y-sm q-pa-sm">
-        <div class="col-12 row">
+        <div class="col-12 row" v-if="!isReadonly">
           <q-file
             for="inputFiles"
             class="col-12"

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

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { ref, reactive, watch } from "vue";
 import { useQuasar } from "quasar";
+import { useRoute } from "vue-router";
 import config from "@/app.config";
 import http from "@/plugins/http";
 
@@ -10,6 +11,7 @@ import { useCounterMixin } from "@/stores/mixin";
 import { useKpiDataStore } from "@/modules/08_KPI/store";
 
 const $q = useQuasar();
+const route = useRoute();
 const mixin = useCounterMixin();
 const store = useKpiDataStore();
 

src/modules/08_KPI/components/Tab/TabMain.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { ref } from "vue";
 import { useKpiDataStore } from "@/modules/08_KPI/store";
+import { useRoute } from "vue-router";
 
 import Assessment from "@/modules/08_KPI/components/Tab/01_Assessment.vue";
 import CommanderAbove from "@/modules/08_KPI/components/Tab/02_CommanderAbove.vue";
@@ -8,6 +9,8 @@ import CommanderAboveOneStep from "@/modules/08_KPI/components/Tab/03_CommanderA
 import File from "@/modules/08_KPI/components/Tab/04_File.vue";
 
 const store = useKpiDataStore();
+const route = useRoute();
+const isReadonly = <boolean>(route.name === "KPIEditEvaluator" ? true : false);
 
 const itemsTab = ref<any>([
   {
@@ -30,7 +33,6 @@ const itemsTab = ref<any>([
 
 const splitterModel = ref<number>(12);
 </script>
-
 <template>
   <q-splitter v-model="splitterModel" disable>
     <template v-slot:before>

src/modules/08_KPI/components/Tab/Topic/01_Indicator.vue

@@ -26,6 +26,7 @@ const {
   success,
 } = useCounterMixin();
 
+const isReadonly = <boolean>(route.name === "KPIEditEvaluator" ? true : false);
 const title = defineModel<string>("title", { required: true });
 const rows = defineModel<any>("data", { required: true });
 const numpage = defineModel<number>("page", { required: true });
@@ -190,6 +191,7 @@ watch(
         <div class="col">
           <span class="text-weight-medium">{{ title }}</span>
           <q-btn
+            v-if="!isReadonly"
             class="q-ml-xs"
             flat
             round
@@ -204,6 +206,7 @@ watch(
         </div>
         <div class="col-auto">
           <q-btn
+            v-if="!isReadonly"
             flat
             round
             icon="mdi-clipboard-check-outline"
@@ -239,7 +242,7 @@ watch(
             <q-th v-for="col in props.cols" :key="col.name" :props="props">
               <span class="text-weight-medium">{{ col.label }}</span>
             </q-th>
-            <q-th auto-width />
+            <q-th auto-width v-if="!isReadonly" />
           </q-tr>
         </template>
         <template v-slot:body="props">
@@ -286,7 +289,7 @@ watch(
                 {{ col.value ? col.value : "-" }}
               </div>
             </q-td>
-            <td>
+            <td v-if="!isReadonly">
               <q-btn
                 flat
                 round

src/modules/08_KPI/components/Tab/Topic/02_Competency.vue

@@ -15,7 +15,9 @@ import type {
   ListCriteria,
 } from "@/modules/08_KPI/interface/request/index";
 
-const dataListCriteria = defineModel<ListCriteria[]>("dataListCriteria", { required: true, });
+const dataListCriteria = defineModel<ListCriteria[]>("dataListCriteria", {
+  required: true,
+});
 
 const sortedDataListCriteria = computed(() => {
   return dataListCriteria.value.sort((a, b) => a.level - b.level);
@@ -26,6 +28,8 @@ const store = useKpiDataStore();
 
 const route = useRoute();
 const id = ref<string>(route.params.id as string);
+const isReadonly = <boolean>(route.name === "KPIEditEvaluator" ? true : false);
+
 const idCapacity = ref<string | null>(null);
 
 const $q = useQuasar();
@@ -203,6 +207,7 @@ onMounted(() => {
           <div class="col">
             <span class="text-weight-medium">{{ item.name }}</span>
             <q-btn
+              v-if="!isReadonly"
               class="q-ml-xs"
               flat
               round
@@ -218,6 +223,7 @@ onMounted(() => {
 
           <q-space />
           <q-btn
+            v-if="!isReadonly"
             flat
             round
             icon="mdi-clipboard-check-outline"
@@ -249,7 +255,7 @@ onMounted(() => {
               <q-th v-for="col in props.cols" :key="col.name" :props="props">
                 <span class="text-weight-medium">{{ col.label }}</span>
               </q-th>
-              <q-th auto-width />
+              <q-th auto-width v-if="!isReadonly" />
             </q-tr>
           </template>
           <template v-slot:body="props">
@@ -295,7 +301,7 @@ onMounted(() => {
                   {{ col.value }}
                 </div>
               </q-td>
-              <q-td auto-width>
+              <q-td v-if="!isReadonly">
                 <q-btn
                   flat
                   round
@@ -335,7 +341,6 @@ onMounted(() => {
     v-model:type="typeCompetency"
     v-model:dataListCriteria="dataListCriteria"
     :get-data="getData"
-    
   />
 
   <div class="row text-body2 text-weight-bold justify-center">