สิทธ์ ทดลองงาน

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

@@ -8,13 +8,14 @@ import { useQuasar } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
 import PopupPersonal from "@/components/Dialogs/PopupPersonalNew.vue";
+import { checkPermission } from "@/utils/permissions";
 
 const modalPersonal = ref<boolean>(false);
 const personId = ref<string>("");
 const router = useRouter();
 const route = useRoute();
 const personalId = ref<string>(route.params.id as string);
-
+const checkRoutePermisson = ref<boolean>(route.name == "probationDetailOnly");
 const $q = useQuasar(); //ใช้ noti quasar
 const rows = ref<FormProbationDetail[]>([]);
 const name = ref<string>("");
@@ -220,7 +221,11 @@ async function selectStatus() {
  * @param id personal id
  */
 function clickSelect(id: string) {
-  router.push(`${route.fullPath}/${id}`);
+  if (checkRoutePermisson.value) {
+    router.push(`/probation/detail-view/${personalId.value}/${id}`);
+  } else {
+    router.push(`/probation/detail/${personalId.value}/${id}`);
+  }
 }
 
 /** รีเซ็ตค่าในช่อง input */
@@ -335,6 +340,7 @@ onMounted(async () => {
             <div class="col-12 text-detail">
               <q-select
                 :disable="
+                  checkRoutePermisson ||
                   probation_status == 2 ||
                   probation_status == 3 ||
                   probation_status == 7 ||
@@ -361,8 +367,8 @@ onMounted(async () => {
       <div class="row col-12 q-col-gutter-sm">
         <div>
           <q-btn
+            v-if="!checkRoutePermisson"
             @click="router.push(`/probation/add/${personalId}`)"
-            size="12px"
             flat
             round
             color="add"
@@ -428,18 +434,46 @@ onMounted(async () => {
         >
           <template v-slot:header="props">
             <q-tr :props="props">
+              <q-th 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>
-              <q-th auto-width />
             </q-tr>
           </template>
           <template v-slot:body="props">
-            <q-tr
-              :props="props"
-              class="cursor-pointer"
-              @click="clickSelect(props.row.id)"
-            >
+            <q-tr :props="props">
+              <q-td auto-width>
+                <q-btn
+                  v-if="checkPermission($route)?.attrIsGet"
+                  flat
+                  dense
+                  round
+                  color="info"
+                  icon="mdi-eye"
+                  @click="
+                    router.push(
+                      `/probation/detail-view/${personalId}/${props.row.id}`
+                    )
+                  "
+                >
+                  <q-tooltip>รายละเอียด</q-tooltip>
+                </q-btn>
+                <q-btn
+                  v-if="
+                    checkPermission($route)?.attrIsGet &&
+                    checkPermission($route)?.attrIsUpdate &&
+                    !checkRoutePermisson
+                  "
+                  flat
+                  dense
+                  round
+                  color="edit"
+                  icon="edit"
+                  @click="clickSelect(props.row.id)"
+                >
+                  <q-tooltip>แก้ไขข้อมูล</q-tooltip>
+                </q-btn>
+              </q-td>
               <q-td v-for="col in props.cols" :key="col.name" :props="props">
                 <div v-if="col.name == 'no'">
                   {{ props.rowIndex + 1 }}
@@ -448,7 +482,6 @@ onMounted(async () => {
                   {{ col.value }}
                 </div>
               </q-td>
-              <q-td auto-width> </q-td>
             </q-tr>
           </template>
           <template v-slot:pagination="scope">