permission => โครงสร้างอัตรากำลัง,อัตรากำลังลูกจ้างประจำ,ทะเบียนประวัติ, ทะเบียนประวัติลูกจ้าง,ตั้งค่าเว็บสรรหา, สอบแข่งขัน

src/modules/04_registryPerson/components/detail/Employee/02_Employment.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { ref, reactive, onMounted } from "vue";
+import { checkPermission } from "@/utils/permissions";
 import { useRoute } from "vue-router";
 import { useQuasar } from "quasar";
 import http from "@/plugins/http";
@@ -226,6 +227,7 @@ onMounted(() => {
   <div class="flex items-center">
     <div class="q-gutter-sm">
       <q-btn
+        v-if="checkPermission($route)?.attrIsUpdate"
         size="12px"
         flat
         round
@@ -288,9 +290,9 @@ onMounted(() => {
     >
       <template v-slot:header="props">
         <q-tr :props="props">
-          <q-th auto-width></q-th>
-          <q-th auto-width></q-th>
-          <q-th auto-width></q-th>
+          <q-th auto-width v-if="checkPermission($route)?.attrIsUpdate" />
+          <q-th auto-width v-if="checkPermission($route)?.attrIsDelete" />
+          <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>
@@ -298,7 +300,7 @@ onMounted(() => {
       </template>
       <template v-slot:body="props">
         <q-tr :props="props" class="cursor-pointer" style="height: 40px">
-          <q-td>
+          <q-td v-if="checkPermission($route)?.attrIsUpdate">
             <q-btn
               dense
               flat
@@ -310,7 +312,7 @@ onMounted(() => {
               <q-tooltip>แก้ไขข้อมูล</q-tooltip>
             </q-btn>
           </q-td>
-          <q-td>
+          <q-td v-if="checkPermission($route)?.attrIsDelete">
             <q-btn
               dense
               flat