From d1be4b077bb3227e28f4bfa78569dc8b33de1ee3 Mon Sep 17 00:00:00 2001
From: waruneeauy <warunee.auy@gmail.com>
Date: Mon, 5 Aug 2024 10:20:48 +0700
Subject: [PATCH] set permission menu master data of evaluation

---
 .../Indicators/indicatorByPlan/DetailView.vue |   8 +-
 .../indicatorByPlan/IndicatorByPlan.vue       |   9 +-
 .../Indicators/indicatorByRole/DetailView.vue |  17 ++-
 .../competency/01ListCompetency.vue           |  17 +--
 .../competency/02ListLinkPosition.vue         |  61 +++++----
 .../components/competency/03ListLinkGroup.vue |  22 ++--
 .../components/competency/04ListCriteria.vue  |  20 ++-
 src/modules/01_masterdata/router.ts           |  20 +++
 .../01_masterdata/views/Assignment.vue        |  19 +--
 src/modules/01_masterdata/views/Strategic.vue |  67 +++++-----
 src/modules/01_masterdata/views/calendar.vue  | 108 ----------------
 .../01_masterdata/views/indicatorByPlan.vue   | 114 +++++++++++------
 .../01_masterdata/views/indicatorByRole.vue   | 121 ++++++++++++------
 src/modules/01_masterdata/views/insignia.vue  |  12 --
 src/modules/01_masterdata/views/personal.vue  |  89 -------------
 src/modules/01_masterdata/views/position.vue  |  64 ---------
 .../01_masterdata/views/positionEmployee.vue  |  62 ---------
 17 files changed, 322 insertions(+), 508 deletions(-)
 delete mode 100644 src/modules/01_masterdata/views/calendar.vue
 delete mode 100644 src/modules/01_masterdata/views/insignia.vue
 delete mode 100644 src/modules/01_masterdata/views/personal.vue
 delete mode 100644 src/modules/01_masterdata/views/position.vue
 delete mode 100644 src/modules/01_masterdata/views/positionEmployee.vue

diff --git a/src/modules/01_masterdata/components/Indicators/indicatorByPlan/DetailView.vue b/src/modules/01_masterdata/components/Indicators/indicatorByPlan/DetailView.vue
index 25d99ade7..1189ffea8 100644
--- a/src/modules/01_masterdata/components/Indicators/indicatorByPlan/DetailView.vue
+++ b/src/modules/01_masterdata/components/Indicators/indicatorByPlan/DetailView.vue
@@ -8,7 +8,13 @@ import IndicatorByPlan from "@/modules/01_masterdata/components/Indicators/indic
 const router = useRouter();
 const route = useRoute();
 
-const title = ref<string>(route.params.id ? "แก้ไข" : "เพิ่ม");
+const title = ref<string>(
+  route.params.id
+    ? route.name == "KPIIndicatorByPlanView"
+      ? "รายละเอียด"
+      : "แก้ไข"
+    : "เพิ่ม"
+);
 </script>
 <template>
   <div class="toptitle text-dark col-12 row items-center">
diff --git a/src/modules/01_masterdata/components/Indicators/indicatorByPlan/IndicatorByPlan.vue b/src/modules/01_masterdata/components/Indicators/indicatorByPlan/IndicatorByPlan.vue
index 3ac2966ff..8ee20c2cd 100644
--- a/src/modules/01_masterdata/components/Indicators/indicatorByPlan/IndicatorByPlan.vue
+++ b/src/modules/01_masterdata/components/Indicators/indicatorByPlan/IndicatorByPlan.vue
@@ -29,6 +29,7 @@ const {
 
 const id = ref<string>(route.params.id ? route.params.id.toLocaleString() : "");
 const editCheck = ref<boolean>(route.params.id ? true : false);
+const isView = ref<boolean>(route.name === "KPIIndicatorByPlanView");
 
 /**form ตัวชี้วัดตามแผนฯ*/
 const planData = reactive({
@@ -671,7 +672,13 @@ onMounted(() => {
       </q-card-section>
       <q-separator color="grey-4" />
       <q-card-actions align="right">
-        <q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
+        <q-btn
+          v-if="!isView"
+          label="บันทึก"
+          id="onSubmit"
+          type="submit"
+          color="public"
+        >
           <q-tooltip>บันทึกข้อมูล</q-tooltip>
         </q-btn>
       </q-card-actions>
diff --git a/src/modules/01_masterdata/components/Indicators/indicatorByRole/DetailView.vue b/src/modules/01_masterdata/components/Indicators/indicatorByRole/DetailView.vue
index 7309cb168..58b142080 100644
--- a/src/modules/01_masterdata/components/Indicators/indicatorByRole/DetailView.vue
+++ b/src/modules/01_masterdata/components/Indicators/indicatorByRole/DetailView.vue
@@ -30,7 +30,14 @@ const {
   dialogConfirm,
   dialogMessageNotify,
 } = useCounterMixin();
-const title = ref<string>(route.params.id ? "แก้ไข" : "เพิ่ม");
+const title = ref<string>(
+  route.params.id
+    ? route.name == "KPIIndicatorByRoleView"
+      ? "รายละเอียด"
+      : "แก้ไข"
+    : "เพิ่ม"
+);
+const isView = ref<boolean>(route.name === "KPIIndicatorByRoleView");
 
 const modalDialogSelect = ref<boolean>(false);
 const form = reactive<FormDataRole>({
@@ -621,7 +628,13 @@ onMounted(() => {
       </q-card-section>
       <q-separator />
       <q-card-actions align="right">
-        <q-btn color="public" label="บันทึก" type="submit" unelevated>
+        <q-btn
+          v-if="!isView"
+          color="public"
+          label="บันทึก"
+          type="submit"
+          unelevated
+        >
           <q-tooltip>บันทึกข้อมูล</q-tooltip>
         </q-btn>
       </q-card-actions>
diff --git a/src/modules/01_masterdata/components/competency/01ListCompetency.vue b/src/modules/01_masterdata/components/competency/01ListCompetency.vue
index baf4ec8b0..486c116de 100644
--- a/src/modules/01_masterdata/components/competency/01ListCompetency.vue
+++ b/src/modules/01_masterdata/components/competency/01ListCompetency.vue
@@ -3,7 +3,7 @@ import { ref, onMounted, reactive, watch } from "vue";
 import type { QTableProps } from "quasar";
 import { useCounterMixin } from "@/stores/mixin";
 import { useQuasar } from "quasar";
-import { useRouter } from "vue-router";
+import { useRoute, useRouter } from "vue-router";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
@@ -20,6 +20,7 @@ import { checkPermission } from "@/utils/permissions";
 const total = ref<number>();
 const store = useKPIDataStore();
 const router = useRouter();
+const route = useRoute();
 const $q = useQuasar();
 const mixin = useCounterMixin();
 const { dialogRemove, messageError, showLoader, hideLoader, success } = mixin;
@@ -143,7 +144,7 @@ watch(
 );
 
 onMounted(() => {
-  fetchList();
+  if (checkPermission(route)?.attrIsList) fetchList();
 });
 </script>
 
@@ -231,7 +232,7 @@ onMounted(() => {
       </q-tr>
     </template>
     <template v-slot:body="props">
-      <q-tr :props="props" class="cursor-pointer">
+      <q-tr :props="props">
         <q-td auto-width>
           <q-btn
             v-if="checkPermission($route)?.attrIsGet"
@@ -239,7 +240,6 @@ onMounted(() => {
             flat
             dense
             round
-            size="12px"
             icon="mdi-eye"
             clickable
             @click.stop="onViewDetailPage(props.row.id)"
@@ -248,18 +248,20 @@ onMounted(() => {
             <q-tooltip>รายละเอียด</q-tooltip>
           </q-btn>
           <q-btn
-            v-if="checkPermission($route)?.attrIsUpdate"
+            v-if="
+              checkPermission($route)?.attrIsGet &&
+              checkPermission($route)?.attrIsUpdate
+            "
             color="edit"
             flat
             dense
             round
-            size="12px"
             icon="edit"
             clickable
             @click.stop="onViewDetail(props.row.id)"
             v-close-popup
           >
-            <q-tooltip>แก้ไข</q-tooltip>
+            <q-tooltip>แก้ไขข้อมูล</q-tooltip>
           </q-btn>
           <q-btn
             v-if="checkPermission($route)?.attrIsDelete"
@@ -267,7 +269,6 @@ onMounted(() => {
             flat
             dense
             round
-            size="12px"
             icon="mdi-delete"
             clickable
             @click.stop="deleteData(props.row.id)"
diff --git a/src/modules/01_masterdata/components/competency/02ListLinkPosition.vue b/src/modules/01_masterdata/components/competency/02ListLinkPosition.vue
index b0630dece..b780e1c13 100644
--- a/src/modules/01_masterdata/components/competency/02ListLinkPosition.vue
+++ b/src/modules/01_masterdata/components/competency/02ListLinkPosition.vue
@@ -14,36 +14,38 @@ import http from "@/plugins/http";
 import config from "@/app.config";
 
 import { checkPermission } from "@/utils/permissions";
+import { useRoute } from "vue-router";
 
 const total = ref<number>();
 const modal = ref<boolean>(false);
 const rows = ref<any[]>([]);
 const groupName = ref<string>("");
+const route = useRoute();
 
 const editStatus = ref<boolean>(false);
 const editId = ref<string>("");
-const competencyTypeOp = ref<DataOption[]>([
-  {
-    id: "ID1",
-    name: "สมรรถนะหลัก",
-  },
-  {
-    id: "ID2",
-    name: "สมรรถนะประจำกลุ่มงาน",
-  },
-  {
-    id: "ID3",
-    name: "สมรรถนะประจำผู้บริหารกรุงเทพมหานคร",
-  },
-  {
-    id: "ID4",
-    name: "สมรรถนะเฉพาะสำหรับตำแหน่ง ผอ.เขต ผช.ผอ.เขต และหัวหน้าฝ่ายในสังกัด สนง.เขต",
-  },
-  {
-    id: "ID5",
-    name: "สมรรถนะเฉพาะสำหรับตำแหน่งผู้ตรวจราชการ กทม. และผู้ตรวจราชการ",
-  },
-]);
+// const competencyTypeOp = ref<DataOption[]>([
+//   {
+//     id: "ID1",
+//     name: "สมรรถนะหลัก",
+//   },
+//   {
+//     id: "ID2",
+//     name: "สมรรถนะประจำกลุ่มงาน",
+//   },
+//   {
+//     id: "ID3",
+//     name: "สมรรถนะประจำผู้บริหารกรุงเทพมหานคร",
+//   },
+//   {
+//     id: "ID4",
+//     name: "สมรรถนะเฉพาะสำหรับตำแหน่ง ผอ.เขต ผช.ผอ.เขต และหัวหน้าฝ่ายในสังกัด สนง.เขต",
+//   },
+//   {
+//     id: "ID5",
+//     name: "สมรรถนะเฉพาะสำหรับตำแหน่งผู้ตรวจราชการ กทม. และผู้ตรวจราชการ",
+//   },
+// ]);
 const columns = ref<QTableProps["columns"]>([
   {
     name: "nameGroupKPI",
@@ -200,7 +202,7 @@ watch(
 );
 
 onMounted(async () => {
-  fetchData();
+  if (checkPermission(route)?.attrIsList) fetchData();
 });
 </script>
 
@@ -274,16 +276,18 @@ onMounted(async () => {
       </q-tr>
     </template>
     <template v-slot:body="props">
-      <q-tr :props="props" class="cursor-pointer">
+      <q-tr :props="props">
         <q-td auto-width>
           <q-btn
-            v-if="checkPermission($route)?.attrIsUpdate"
+            v-if="
+              checkPermission($route)?.attrIsGet &&
+              checkPermission($route)?.attrIsUpdate
+            "
             color="edit"
             flat
             dense
             round
             class="q-mr-xs"
-            size="12px"
             icon="edit"
             clickable
             @click="onEdit(props.row)"
@@ -296,7 +300,6 @@ onMounted(async () => {
             flat
             dense
             round
-            size="12px"
             icon="mdi-delete"
             clickable
             @click.stop="
@@ -355,7 +358,9 @@ onMounted(async () => {
             class="q-px-md items-center"
             color="public"
             label="บันทึก"
-          />
+          >
+            <q-tooltip>บันทึกข้อมูล</q-tooltip>
+          </q-btn>
         </q-card-actions>
       </q-form>
     </q-card>
diff --git a/src/modules/01_masterdata/components/competency/03ListLinkGroup.vue b/src/modules/01_masterdata/components/competency/03ListLinkGroup.vue
index d12b5d0a3..5379097e6 100644
--- a/src/modules/01_masterdata/components/competency/03ListLinkGroup.vue
+++ b/src/modules/01_masterdata/components/competency/03ListLinkGroup.vue
@@ -3,7 +3,7 @@ import { ref, onMounted, reactive, watch } from "vue";
 import type { QTableProps } from "quasar";
 import { useCounterMixin } from "@/stores/mixin";
 import { useQuasar } from "quasar";
-import { useRouter } from "vue-router";
+import { useRoute, useRouter } from "vue-router";
 
 import Header from "@/components/DialogHeader.vue";
 
@@ -24,6 +24,7 @@ const editStatus = ref<boolean>(false);
 const groupName = ref<any>();
 const position = ref<any>();
 const competency = ref<any>();
+const route = useRoute();
 
 const groupNameOp = ref<DataOption[]>([]);
 const groupNameOpMain = ref<DataOption[]>([]);
@@ -339,7 +340,7 @@ watch(
 );
 
 onMounted(async () => {
-  getData();
+  if (checkPermission(route)?.attrIsList) getData();
 });
 </script>
 
@@ -407,23 +408,25 @@ onMounted(async () => {
   >
     <template v-slot:header="props">
       <q-tr :props="props">
-        <q-th auto-width v-if="checkPermission($route)?.attrIsUpdate || 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>
       </q-tr>
     </template>
     <template v-slot:body="props">
-      <q-tr :props="props" class="cursor-pointer">
-        <q-td auto-width v-if="checkPermission($route)?.attrIsUpdate || checkPermission($route)?.attrIsDelete ">
+      <q-tr :props="props">
+        <q-td auto-width>
           <q-btn
-            v-if="checkPermission($route)?.attrIsUpdate"
+            v-if="
+              checkPermission($route)?.attrIsGet &&
+              checkPermission($route)?.attrIsUpdate
+            "
             color="edit"
             flat
             dense
             round
             class="q-mr-xs"
-            size="12px"
             icon="edit"
             clickable
             @click="onEdit(props.row.id)"
@@ -436,7 +439,6 @@ onMounted(async () => {
             flat
             dense
             round
-            size="12px"
             icon="mdi-delete"
             clickable
             @click.stop="
@@ -589,7 +591,9 @@ onMounted(async () => {
             class="q-px-md items-center"
             color="public"
             label="บันทึก"
-          />
+          >
+            <q-tooltip>บันทึกข้อมูล</q-tooltip>
+          </q-btn>
         </q-card-actions>
       </q-form>
     </q-card>
diff --git a/src/modules/01_masterdata/components/competency/04ListCriteria.vue b/src/modules/01_masterdata/components/competency/04ListCriteria.vue
index 31b719199..15bc13d1c 100644
--- a/src/modules/01_masterdata/components/competency/04ListCriteria.vue
+++ b/src/modules/01_masterdata/components/competency/04ListCriteria.vue
@@ -7,9 +7,11 @@ import config from "@/app.config";
 import { useQuasar } from "quasar";
 
 import { checkPermission } from "@/utils/permissions";
+import { useRoute } from "vue-router";
 
 const $q = useQuasar();
 const dataLevel = ref<any>();
+const route = useRoute();
 const { showLoader, hideLoader, success } = useCounterMixin();
 const fieldLabels = {
   score5: "5",
@@ -64,7 +66,7 @@ function getData() {
     });
 }
 onMounted(() => {
-  getData();
+  if (checkPermission(route)?.attrIsGet) getData();
 });
 </script>
 
@@ -94,7 +96,9 @@ onMounted(() => {
                   >
                     <template #control>
                       <q-editor
-                        :readonly="checkPermission($route)?.attrIsUpdate == false"
+                        :readonly="
+                          checkPermission($route)?.attrIsUpdate == false
+                        "
                         class="full-width"
                         v-model="field.description"
                         :dense="$q.screen.lt.md"
@@ -154,9 +158,17 @@ onMounted(() => {
       <q-separator />
 
       <q-card-actions align="right">
-        <q-btn v-if="checkPermission($route)?.attrIsUpdate" label="บันทึก" color="secondary" type="submit"
-          ><q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn
+        <q-btn
+          v-if="
+            checkPermission($route)?.attrIsGet &&
+            checkPermission($route)?.attrIsUpdate
+          "
+          label="บันทึก"
+          color="secondary"
+          type="submit"
         >
+          <q-tooltip>บันทึกข้อมูล</q-tooltip>
+        </q-btn>
       </q-card-actions>
     </q-form>
   </q-card>
diff --git a/src/modules/01_masterdata/router.ts b/src/modules/01_masterdata/router.ts
index ee09ee181..5ef15c068 100644
--- a/src/modules/01_masterdata/router.ts
+++ b/src/modules/01_masterdata/router.ts
@@ -57,6 +57,16 @@ export default [
       Role: "STAFF",
     },
   },
+  {
+    path: "/masterdata/indicator-plan/view/:id",
+    name: "KPIIndicatorByPlanView",
+    component: IndicatorByPlanDetail,
+    meta: {
+      Auth: true,
+      Key: "SYS_EVA_INDICATOR",
+      Role: "STAFF",
+    },
+  },
   {
     path: "/masterdata/indicator-role",
     name: "KPIIndicatorByRole",
@@ -87,6 +97,16 @@ export default [
       Role: "STAFF",
     },
   },
+  {
+    path: "/masterdata/indicator-role/view/:id",
+    name: "KPIIndicatorByRoleView",
+    component: IndicatorByRoleDetail,
+    meta: {
+      Auth: true,
+      Key: "SYS_EVA_INDICATOR",
+      Role: "STAFF",
+    },
+  },
   {
     path: "/masterdata/competency",
     name: "KPICompetency",
diff --git a/src/modules/01_masterdata/views/Assignment.vue b/src/modules/01_masterdata/views/Assignment.vue
index 48bad150d..cd52a23c5 100644
--- a/src/modules/01_masterdata/views/Assignment.vue
+++ b/src/modules/01_masterdata/views/Assignment.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { ref, onMounted, reactive, watch } from "vue";
-import { useRouter } from "vue-router";
+import { useRouter, useRoute } from "vue-router";
 import { useQuasar, type QTableProps } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
@@ -20,6 +20,7 @@ import { checkPermission } from "@/utils/permissions";
 
 const $q = useQuasar();
 const router = useRouter();
+const route = useRoute();
 const { showLoader, hideLoader, dialogRemove, success, messageError } =
   useCounterMixin();
 
@@ -122,7 +123,7 @@ watch(
 );
 
 onMounted(() => {
-  fetchList();
+  if (checkPermission(route)?.attrIsList) fetchList();
 });
 </script>
 
@@ -257,32 +258,32 @@ onMounted(() => {
       >
         <template v-slot:header="props">
           <q-tr :props="props">
-            <q-th auto-width v-if="checkPermission($route)?.attrIsGet || 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>
           </q-tr>
         </template>
         <template v-slot:body="props">
-          <q-tr :props="props" class="cursor-pointer">
-            <q-td auto-width v-if="checkPermission($route)?.attrIsGet || checkPermission($route)?.attrIsDelete">
+          <q-tr :props="props">
+            <q-td auto-width>
               <q-btn
                 v-if="checkPermission($route)?.attrIsGet"
                 flat
                 round
-                color="primary"
-                size="14px"
+                dense
+                color="info"
                 icon="mdi-eye"
                 @click.pervent="onClickView(props.row.id)"
               >
-                <q-tooltip>ดูข้อมูล</q-tooltip>
+                <q-tooltip>รายละเอียด</q-tooltip>
               </q-btn>
               <q-btn
                 v-if="checkPermission($route)?.attrIsDelete"
                 flat
+                dense
                 round
                 color="red"
-                size="14px"
                 icon="mdi-delete "
                 @click.pervent="onClickDelete(props.row.id)"
               >
diff --git a/src/modules/01_masterdata/views/Strategic.vue b/src/modules/01_masterdata/views/Strategic.vue
index f562726d8..d77c97952 100644
--- a/src/modules/01_masterdata/views/Strategic.vue
+++ b/src/modules/01_masterdata/views/Strategic.vue
@@ -4,13 +4,14 @@ import { useQuasar } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
-import type { ItemsMenu } from "@/modules/01_masterdata/interface/index/Main";
+// import type { ItemsMenu } from "@/modules/01_masterdata/interface/index/Main";
 import type { DataStrategic } from "@/modules/01_masterdata/interface/response/Strategic";
 
 import DialogHeader from "@/components/DialogHeader.vue";
 
 import { useCounterMixin } from "@/stores/mixin";
 import { checkPermission } from "@/utils/permissions";
+import { useRoute } from "vue-router";
 const $q = useQuasar();
 const {
   showLoader,
@@ -21,27 +22,28 @@ const {
   success,
 } = useCounterMixin();
 
-const ListMenu = ref<ItemsMenu[]>([
-  {
-    label: "เพิ่ม",
-    icon: "add",
-    value: "ADD",
-    color: "primary",
-  },
-  {
-    label: "แก้ไข",
-    icon: "edit",
-    value: "EDIT",
-    color: "edit",
-  },
-  {
-    label: "ลบ",
-    icon: "delete",
-    value: "DEL",
-    color: "red",
-  },
-]);
+// const ListMenu = ref<ItemsMenu[]>([
+//   {
+//     label: "เพิ่ม",
+//     icon: "add",
+//     value: "ADD",
+//     color: "primary",
+//   },
+//   {
+//     label: "แก้ไข",
+//     icon: "edit",
+//     value: "EDIT",
+//     color: "edit",
+//   },
+//   {
+//     label: "ลบ",
+//     icon: "delete",
+//     value: "DEL",
+//     color: "red",
+//   },
+// ]);
 
+const route = useRoute();
 const nodes = ref<any[]>([]);
 const filter = ref<string>("");
 const expanded = ref<Array<string>>([]);
@@ -189,7 +191,7 @@ function onDelete(data: DataStrategic) {
 
 /** ดึงข้อมูลเมื่ออยู่ในหน้า */
 onMounted(() => {
-  fetchDataTree();
+  if (checkPermission(route)?.attrIsList) fetchDataTree();
 });
 </script>
 <template>
@@ -248,12 +250,16 @@ onMounted(() => {
               </div>
             </div>
             <q-btn
+              v-if="
+                checkPermission($route)?.attrIsCreate ||
+                checkPermission($route)?.attrIsGet ||
+                checkPermission($route)?.attrIsUpdate ||
+                checkPermission($route)?.attrIsDelete
+              "
               flat
               dense
-              icon="mdi-dots-vertical"
-              class="q-ml-xs"
-              color="grey-13"
-              size="12px"
+              color="secondary"
+              icon="mdi-dots-horizontal-circle-outline"
               round
             >
               <q-menu>
@@ -282,7 +288,10 @@ onMounted(() => {
                     </q-item-section>
                   </q-item>
                   <q-item
-                    v-if="checkPermission($route)?.attrIsUpdate"
+                    v-if="
+                      checkPermission($route)?.attrIsUpdate &&
+                      checkPermission($route)?.attrIsGet
+                    "
                     clickable
                     v-close-popup
                     @click.stop="onClickAction('EDIT', prop.node)"
@@ -312,9 +321,7 @@ onMounted(() => {
                     <q-item-section avatar style="min-width: 20px">
                       <q-icon size="17px" :color="'red'" :name="'delete'" />
                     </q-item-section>
-                    <q-item-section>
-                      {{ `ลบข้อมูล` }}
-                    </q-item-section>
+                    <q-item-section> ลบข้อมูล </q-item-section>
                   </q-item>
                 </q-list>
               </q-menu>
diff --git a/src/modules/01_masterdata/views/calendar.vue b/src/modules/01_masterdata/views/calendar.vue
deleted file mode 100644
index 0048c4a01..000000000
--- a/src/modules/01_masterdata/views/calendar.vue
+++ /dev/null
@@ -1,108 +0,0 @@
-<script setup lang="ts">
-import { ref, onMounted } from "vue";
-import { useQuasar } from "quasar";
-import http from "@/plugins/http";
-import config from "@/app.config";
-
-import type { DataSumCalendarObject } from "@/modules/01_masterdata/interface/index/Calendar";
-
-import calendarComponent from "@/modules/01_masterdata/components/calendar/calendarMain.vue";
-
-import { useCounterMixin } from "@/stores/mixin";
-
-const mixin = useCounterMixin();
-const $q = useQuasar();
-
-const { showLoader, hideLoader, messageError, genColor15 } = mixin;
-
-const listsSumCalendar = ref<DataSumCalendarObject[]>([]);
-const year = ref<number>(new Date().getFullYear());
-
-/** function เรียกข้อมูลสรุปวันหยุด */
-async function fetchDataSummaryCalendar() {
-  showLoader();
-  await http
-    .get(config.API.summaryHolidayHistoryYear(year.value))
-    .then((res) => {
-      let data = res.data.result;
-      listsSumCalendar.value = [];
-      data.map((e: DataSumCalendarObject) => {
-        listsSumCalendar.value.push({
-          id: e.id,
-          monthFull: e.monthFull,
-          count: e.count,
-          color: genColor15(e.id),
-        });
-      });
-    })
-    .catch(async (e) => {
-      // await defaultListsSumCalendar;
-      messageError($q, e);
-    })
-    .finally(() => {
-      hideLoader();
-    });
-}
-
-onMounted(async () => {
-  await fetchDataSummaryCalendar();
-});
-</script>
-<template>
-  <div class="toptitle text-dark col-12 row items-center">
-    ข้อมูลปฏิทินวันหยุด
-  </div>
-  <div class="row col-12 q-col-gutter-sm">
-    <div class="col-3">
-      <q-card bordered style="height: 100%">
-        <div class="text-grey-9 items-center q-pa-md">
-          <div class="row no-wrap items-center">
-            <div class="text-dark text-weight-medium q-pb-sm q-px-xs">
-              สรุปวันหยุดในแต่ละเดือนประจำปี
-              <span class="text-weight-bold text-primary q-pl-sm">
-                {{ year + 543 }}</span
-              >
-            </div>
-            <q-space />
-          </div>
-          <div class="col-12 row">
-            <div
-              class="col-xs-4 col-md-6 row q-pa-xs"
-              v-for="(list, index) in listsSumCalendar"
-              :key="index"
-            >
-              <q-card bordered class="col-12">
-                <div
-                  class="col-12 text-subtitle2 row q-px-sm items-center q-px-sm"
-                >
-                  <span :class="'text-weight-medium text-' + `${list.color}`">{{
-                    list.monthFull
-                  }}</span>
-                  <q-space />
-                  <q-badge
-                    color="white"
-                    :class="
-                      'text-weight-bold text-subtitle1 text-' + `${list.color}`
-                    "
-                    :label="list.count"
-                    rounded
-                  />
-                </div>
-              </q-card>
-            </div>
-          </div>
-        </div>
-      </q-card>
-    </div>
-    <div class="col-9">
-      <q-card bordered class="q-pa-md">
-        <calendarComponent
-          v-model:dateYear="year"
-          :fetchDataSummaryCalendar="fetchDataSummaryCalendar"
-        />
-      </q-card>
-    </div>
-  </div>
-</template>
-
-<style scoped></style>
diff --git a/src/modules/01_masterdata/views/indicatorByPlan.vue b/src/modules/01_masterdata/views/indicatorByPlan.vue
index b3408c407..79707f649 100644
--- a/src/modules/01_masterdata/views/indicatorByPlan.vue
+++ b/src/modules/01_masterdata/views/indicatorByPlan.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { ref, reactive, onMounted } from "vue";
 import { useQuasar, type QTableProps } from "quasar";
-import { useRouter } from "vue-router";
+import { useRouter, useRoute } from "vue-router";
 
 import http from "@/plugins/http";
 import config from "@/app.config";
@@ -18,6 +18,7 @@ const modalHistory = ref<boolean>(false);
 const isAll = ref<boolean>(false);
 const $q = useQuasar();
 const router = useRouter();
+const route = useRoute();
 const { showLoader, hideLoader, dialogRemove, success, messageError } =
   useCounterMixin();
 
@@ -100,6 +101,10 @@ function onClickAddOrView(status: boolean = false, id: string = "") {
     : router.push("/masterdata/indicator-plan/add");
 }
 
+function onClickView(id: string = "") {
+  router.push(`/masterdata/indicator-plan/view/${id}`);
+}
+
 function fetchActive() {
   showLoader();
   http
@@ -191,7 +196,7 @@ function onClickHistory(id: string) {
 }
 
 onMounted(() => {
-  fetchActive();
+  if (checkPermission(route)?.attrIsList) fetchActive();
 });
 </script>
 
@@ -337,7 +342,7 @@ onMounted(() => {
             color="primary"
             @click="onClickAddOrView()"
           >
-            <q-tooltip>เพิ่ม</q-tooltip>
+            <q-tooltip>เพิ่มข้อมูล</q-tooltip>
           </q-btn>
 
           <q-space />
@@ -412,73 +417,104 @@ onMounted(() => {
               </q-tr>
             </template>
             <template v-slot:body="props">
-              <q-tr :props="props" class="cursor-pointer">
+              <q-tr :props="props">
                 <q-td auto-width>
                   <q-btn
+                    v-if="
+                      checkPermission($route)?.attrIsGet ||
+                      checkPermission($route)?.attrIsUpdate ||
+                      checkPermission($route)?.attrIsDelete
+                    "
                     flat
+                    dense
+                    color="secondary"
+                    icon="mdi-dots-horizontal-circle-outline"
                     round
-                    color="grey"
-                    @click.stop
-                    size="14px"
-                    icon="more_vert"
                   >
                     <q-menu>
-                      <q-list style="min-width: 180px">
+                      <q-list dense style="min-width: 180px">
                         <q-item
-                        v-if="checkPermission($route)?.attrIsUpdate"
+                          v-if="checkPermission($route)?.attrIsGet"
+                          clickable
+                          v-close-popup
+                          @click="onClickHistory(props.row.id)"
+                        >
+                          <q-item-section style="min-width: 0px" avatar>
+                            <q-tooltip>ประวัติการแก้ไข</q-tooltip>
+                            <q-icon
+                              color="deep-purple"
+                              flat
+                              dense
+                              round
+                              name="mdi-history"
+                              size="xs"
+                            />
+                          </q-item-section>
+                          <q-item-section>ประวัติการแก้ไข</q-item-section>
+                        </q-item>
+                        <q-item
+                          v-if="checkPermission($route)?.attrIsGet"
+                          clickable
+                          v-close-popup
+                          @click="onClickView(props.row.id)"
+                        >
+                          <q-item-section style="min-width: 0px" avatar>
+                            <q-tooltip>รายละเอียด</q-tooltip>
+                            <q-icon
+                              flat
+                              dense
+                              round
+                              color="info"
+                              name="mdi-eye"
+                              size="xs"
+                            />
+                          </q-item-section>
+                          <q-item-section>รายละเอียด</q-item-section>
+                        </q-item>
+                        <q-item
+                          v-if="
+                            checkPermission($route)?.attrIsGet &&
+                            checkPermission($route)?.attrIsUpdate
+                          "
                           clickable
                           v-close-popup
                           @click="onClickAddOrView(true, props.row.id)"
                         >
-                          <q-item-section
-                            style="min-width: 0px"
-                            avatar
-                            class="q-py-sm"
-                          >
+                          <q-item-section style="min-width: 0px" avatar>
                             <q-tooltip>แก้ไขข้อมูล</q-tooltip>
                             <q-icon
+                              flat
+                              dense
+                              round
                               color="primary"
+                              name="edit"
                               size="xs"
-                              name="mdi-pencil-outline"
                             />
                           </q-item-section>
                           <q-item-section>แก้ไขข้อมูล</q-item-section>
                         </q-item>
                         <q-item
-                        v-if="checkPermission($route)?.attrIsUpdate"
-                          clickable
-                          v-close-popup
-                          @click="onClickHistory(props.row.id)"
-                        >
-                          <q-item-section
-                            style="min-width: 0px"
-                            avatar
-                            class="q-py-sm"
-                          >
-                            <q-tooltip>ประวัติการแก้ไข</q-tooltip>
-                            <q-icon color="info" size="xs" name="mdi-history" />
-                          </q-item-section>
-                          <q-item-section>ประวัติการแก้ไข</q-item-section>
-                        </q-item>
-                        <q-item
-                        v-if="checkPermission($route)?.attrIsDelete"
+                          v-if="checkPermission($route)?.attrIsDelete"
                           clickable
                           v-close-popup
                           @click.stop.pervent="deleteData(props.row.id)"
                         >
-                          <q-item-section
-                            style="min-width: 0px"
-                            avatar
-                            class="q-py-sm"
-                          >
+                          <q-item-section style="min-width: 0px" avatar>
                             <q-tooltip>ลบข้อมูล</q-tooltip>
-                            <q-icon color="red" size="xs" name="mdi-delete" />
+                            <q-icon
+                              color="red"
+                              flat
+                              round
+                              name="mdi-delete"
+                              size="xs"
+                            />
                           </q-item-section>
                           <q-item-section>ลบข้อมูล</q-item-section>
                         </q-item>
                       </q-list>
                     </q-menu>
                   </q-btn>
+                  <!-- </q-btn> -->
                 </q-td>
                 <q-td v-for="col in props.cols" :key="col.name" :props="props">
                   <div class="table_ellipsis">
diff --git a/src/modules/01_masterdata/views/indicatorByRole.vue b/src/modules/01_masterdata/views/indicatorByRole.vue
index d8acda9b0..de7f47fd1 100644
--- a/src/modules/01_masterdata/views/indicatorByRole.vue
+++ b/src/modules/01_masterdata/views/indicatorByRole.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { ref, reactive, onMounted, watch } from "vue";
 import { useQuasar, type QTableProps } from "quasar";
-import { useRouter } from "vue-router";
+import { useRouter, useRoute } from "vue-router";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
@@ -23,6 +23,7 @@ const modalHistory = ref<boolean>(false);
 const total = ref<number>();
 const $q = useQuasar();
 const router = useRouter();
+const route = useRoute();
 const { showLoader, hideLoader, dialogRemove, success, messageError } =
   useCounterMixin();
 
@@ -108,6 +109,10 @@ function onClickAddOrView(status: boolean = false, id: string = "") {
     : router.push("/masterdata/indicator-role/add");
 }
 
+function onClickView(id: string = "") {
+  router.push(`/masterdata/indicator-role/view/${id}`);
+}
+
 function onClickDelete(id: number) {
   dialogRemove($q, () => {
     showLoader();
@@ -216,8 +221,10 @@ function onClickHistory(id: string) {
 }
 
 onMounted(async () => {
-  await getOptions();
-  await fetchList();
+  if (checkPermission(route)?.attrIsList) {
+    await getOptions();
+    await fetchList();
+  }
 });
 </script>
 
@@ -331,7 +338,7 @@ onMounted(async () => {
       </q-select>
 
       <q-btn
-      v-if="checkPermission($route)?.attrIsCreate"
+        v-if="checkPermission($route)?.attrIsCreate"
         flat
         round
         dense
@@ -339,7 +346,7 @@ onMounted(async () => {
         color="primary"
         @click="onClickAddOrView()"
       >
-        <q-tooltip>เพิ่ม</q-tooltip>
+        <q-tooltip>เพิ่มข้อมูล</q-tooltip>
       </q-btn>
 
       <q-space />
@@ -418,67 +425,97 @@ onMounted(async () => {
           </q-tr>
         </template>
         <template v-slot:body="props">
-          <q-tr :props="props" class="cursor-pointer">
+          <q-tr :props="props">
             <q-td auto-width>
               <q-btn
+                v-if="
+                  checkPermission($route)?.attrIsGet ||
+                  checkPermission($route)?.attrIsUpdate ||
+                  checkPermission($route)?.attrIsDelete
+                "
                 flat
+                dense
+                color="secondary"
+                icon="mdi-dots-horizontal-circle-outline"
                 round
-                color="grey"
-                @click.stop
-                size="14px"
-                icon="more_vert"
               >
                 <q-menu>
-                  <q-list style="min-width: 180px">
+                  <q-list dense style="min-width: 180px">
                     <q-item
-                      v-if="checkPermission($route)?.attrIsUpdate"
+                      v-if="checkPermission($route)?.attrIsGet"
                       clickable
                       v-close-popup
-                      @click.stop.pervent="onClickAddOrView(true, props.row.id)"
+                      @click="onClickHistory(props.row.id)"
                     >
-                      <q-item-section
-                        style="min-width: 0px"
-                        avatar
-                        class="q-py-sm"
-                      >
+                      <q-item-section style="min-width: 0px" avatar>
+                        <q-tooltip>ประวัติการแก้ไข</q-tooltip>
+                        <q-icon
+                          color="deep-purple"
+                          flat
+                          dense
+                          round
+                          name="mdi-history"
+                          size="xs"
+                        />
+                      </q-item-section>
+                      <q-item-section>ประวัติการแก้ไข</q-item-section>
+                    </q-item>
+                    <q-item
+                      v-if="checkPermission($route)?.attrIsGet"
+                      clickable
+                      v-close-popup
+                      @click="onClickView(props.row.id)"
+                    >
+                      <q-item-section style="min-width: 0px" avatar>
+                        <q-tooltip>รายละเอียด</q-tooltip>
+                        <q-icon
+                          flat
+                          dense
+                          round
+                          color="info"
+                          name="mdi-eye"
+                          size="xs"
+                        />
+                      </q-item-section>
+                      <q-item-section>รายละเอียด</q-item-section>
+                    </q-item>
+                    <q-item
+                      v-if="
+                        checkPermission($route)?.attrIsGet &&
+                        checkPermission($route)?.attrIsUpdate
+                      "
+                      clickable
+                      v-close-popup
+                      @click="onClickAddOrView(true, props.row.id)"
+                    >
+                      <q-item-section style="min-width: 0px" avatar>
                         <q-tooltip>แก้ไขข้อมูล</q-tooltip>
                         <q-icon
+                          flat
+                          dense
+                          round
                           color="primary"
+                          name="edit"
                           size="xs"
-                          name="mdi-pencil-outline"
                         />
                       </q-item-section>
                       <q-item-section>แก้ไขข้อมูล</q-item-section>
                     </q-item>
                     <q-item
-                    v-if="checkPermission($route)?.attrIsUpdate"
-                      clickable
-                      v-close-popup
-                      @click="onClickHistory(props.row.id)"
-                    >
-                      <q-item-section
-                        style="min-width: 0px"
-                        avatar
-                        class="q-py-sm"
-                      >
-                        <q-tooltip>ประวัติการแก้ไข</q-tooltip>
-                        <q-icon color="info" size="xs" name="mdi-history" />
-                      </q-item-section>
-                      <q-item-section>ประวัติการแก้ไข</q-item-section>
-                    </q-item>
-                    <q-item
-                    v-if="checkPermission($route)?.attrIsDelete"
+                      v-if="checkPermission($route)?.attrIsDelete"
                       clickable
                       v-close-popup
                       @click.stop.pervent="onClickDelete(props.row.id)"
                     >
-                      <q-item-section
-                        style="min-width: 0px"
-                        avatar
-                        class="q-py-sm"
-                      >
+                      <q-item-section style="min-width: 0px" avatar>
                         <q-tooltip>ลบข้อมูล</q-tooltip>
-                        <q-icon color="red" size="xs" name="mdi-delete" />
+                        <q-icon
+                          color="red"
+                          flat
+                          round
+                          name="mdi-delete"
+                          size="xs"
+                        />
                       </q-item-section>
                       <q-item-section>ลบข้อมูล</q-item-section>
                     </q-item>
diff --git a/src/modules/01_masterdata/views/insignia.vue b/src/modules/01_masterdata/views/insignia.vue
deleted file mode 100644
index 10c055f54..000000000
--- a/src/modules/01_masterdata/views/insignia.vue
+++ /dev/null
@@ -1,12 +0,0 @@
-<script setup lang="ts">
-import InsigniaType from "@/modules/01_masterdata/components/insignia/InsigniaType.vue";
-</script>
-<template>
-  <div class="toptitle text-dark col-12 row items-center">
-    ข้อมูลเครื่องราชอิสริยาภรณ์
-  </div>
-
-  <q-card flat bordered class="q-pa-md"> <InsigniaType /> </q-card>
-</template>
-
-<style scoped></style>
diff --git a/src/modules/01_masterdata/views/personal.vue b/src/modules/01_masterdata/views/personal.vue
deleted file mode 100644
index 2a22914b6..000000000
--- a/src/modules/01_masterdata/views/personal.vue
+++ /dev/null
@@ -1,89 +0,0 @@
-<script setup lang="ts">
-import { ref, onMounted } from "vue";
-import { usePersonalDataStore } from "@/modules/01_masterdata/stores/personalStore";
-import ListPrefix from "@/modules/01_masterdata/components/personal/01ListPrefix.vue";
-import ListRank from "@/modules/01_masterdata/components/personal/02ListRank.vue";
-import ListBloodGroup from "@/modules/01_masterdata/components/personal/03ListBloodGroup.vue";
-import ListGender from "@/modules/01_masterdata/components/personal/04ListGender.vue";
-import ListReligion from "@/modules/01_masterdata/components/personal/05ListReligion.vue";
-import ListRelationship from "@/modules/01_masterdata/components/personal/06ListRelationship.vue";
-import ListEducation from "@/modules/01_masterdata/components/personal/07ListEducationLevel.vue";
-import ListProvince from "@/modules/01_masterdata/components/personal/08ListProvince.vue";
-
-const store = usePersonalDataStore();
-const tabs = ref<Array<any>>([]);
-
-onMounted(() => {
-  const tabsPerson = [
-    { label: "คำนำหน้าชื่อ", value: "list_prefix" },
-    { label: "ยศ", value: "list_rank" },
-    { label: "เพศ", value: "list_gender" },
-    { label: "สถานภาพ", value: "list_relationship" },
-    { label: "กลุ่มเลือด", value: "list_bloodGroup" },
-    { label: "ศาสนา", value: "list_religion" },
-    { label: "จังหวัด", value: "list_province" },
-    { label: "ระดับการศึกษา", value: "list_education" },
-  ];
-  tabs.value = tabsPerson;
-});
-</script>
-
-<template>
-  <div class="toptitle text-dark col-12 row items-center">
-    ข้อมูลเกี่ยวกับบุคคล
-  </div>
-
-  <q-card flat bordered>
-    <div class="text-subtitle1 text-grey-9">
-      <q-tabs
-        dense
-        v-model="store.currentTab"
-        align="left"
-        indicator-color="primary"
-        active-color="primary bg-teal-1"
-        inline-label
-        class="text-body2 text-grey-7"
-      >
-        <q-tab
-          v-for="tab in tabs"
-          :key="tab.value"
-          v-on:click="store.currentTab = tab.value"
-          :label="tab.label"
-          :name="tab.value"
-          class="q-py-xs"
-        />
-      </q-tabs>
-      <q-separator />
-      <!-- person -->
-
-      <q-tab-panels v-model="store.currentTab" animated>
-        <q-tab-panel name="list_prefix">
-          <ListPrefix v-if="store.currentTab == 'list_prefix'" />
-        </q-tab-panel>
-        <q-tab-panel name="list_rank">
-          <ListRank v-if="store.currentTab == 'list_rank'" />
-        </q-tab-panel>
-        <q-tab-panel name="list_gender">
-          <ListGender v-if="store.currentTab == 'list_gender'" />
-        </q-tab-panel>
-        <q-tab-panel name="list_relationship">
-          <ListRelationship v-if="store.currentTab == 'list_relationship'" />
-        </q-tab-panel>
-        <q-tab-panel name="list_bloodGroup">
-          <ListBloodGroup v-if="store.currentTab == 'list_bloodGroup'" />
-        </q-tab-panel>
-        <q-tab-panel name="list_religion">
-          <ListReligion v-if="store.currentTab == 'list_religion'" />
-        </q-tab-panel>
-        <q-tab-panel name="list_province">
-          <ListProvince v-if="store.currentTab == 'list_province'" />
-        </q-tab-panel>
-        <q-tab-panel name="list_education">
-          <ListEducation v-if="store.currentTab == 'list_education'" />
-        </q-tab-panel>
-      </q-tab-panels>
-    </div>
-  </q-card>
-</template>
-
-<style scoped></style>
diff --git a/src/modules/01_masterdata/views/position.vue b/src/modules/01_masterdata/views/position.vue
deleted file mode 100644
index a955fb631..000000000
--- a/src/modules/01_masterdata/views/position.vue
+++ /dev/null
@@ -1,64 +0,0 @@
-div
-<script setup lang="ts">
-import { ref, onMounted } from "vue";
-import ListPosition from "@/modules/01_masterdata/components/position/01ListPosition.vue";
-import ListType from "@/modules/01_masterdata/components/position/02ListType.vue";
-import ListExecutive from "@/modules/01_masterdata/components/position/04ListExecutive.vue";
-import { usePositionDataStore } from "../stores/positionListStore";
-// const store.pathLocation = ref<string>("list_position");
-const tabs = ref<Array<any>>([]);
-const store = usePositionDataStore();
-
-onMounted(() => {
-  const tabsPerson = [
-    { label: "ตำแหน่ง", value: "list_position" },
-    { label: "รายการประเภทตำแหน่ง", value: "list_type" },
-    { label: "ตำแหน่งทางการบริหาร", value: "list_executive" },
-  ];
-  tabs.value = tabsPerson;
-});
-</script>
-
-<template>
-  <div class="toptitle text-dark col-12 row items-center">
-    ข้อมูลตำแหน่งข้าราชการ ฯ
-  </div>
-
-  <q-card flat bordered>
-    <q-tabs
-      dense
-      v-model="store.pathLocation"
-      align="left"
-      indicator-color="primary"
-      active-color="primary bg-teal-1"
-      inline-label
-      class="text-body2 text-grey-7"
-    >
-      <q-tab
-        v-for="tab in tabs"
-        :key="tab.value"
-        v-on:click="store.pathLocation = tab.value"
-        :label="tab.label"
-        :name="tab.value"
-        class="q-py-xs"
-      />
-    </q-tabs>
-    <q-separator />
-
-    <q-tab-panels v-model="store.pathLocation" animated>
-      <q-tab-panel name="list_position">
-        <ListPosition v-if="store.pathLocation == 'list_position'" />
-      </q-tab-panel>
-
-      <q-tab-panel name="list_type">
-        <ListType v-if="store.pathLocation == 'list_type'" />
-      </q-tab-panel>
-
-      <q-tab-panel name="list_executive">
-        <ListExecutive v-if="store.pathLocation == 'list_executive'" />
-      </q-tab-panel>
-    </q-tab-panels>
-  </q-card>
-</template>
-
-<style scoped></style>
diff --git a/src/modules/01_masterdata/views/positionEmployee.vue b/src/modules/01_masterdata/views/positionEmployee.vue
deleted file mode 100644
index 894455dee..000000000
--- a/src/modules/01_masterdata/views/positionEmployee.vue
+++ /dev/null
@@ -1,62 +0,0 @@
-div
-<script setup lang="ts">
-import { ref, onMounted } from "vue";
-import ListPosition from "@/modules/01_masterdata/components/position-employee/01ListPosition.vue";
-import ListType from "@/modules/01_masterdata/components/position-employee/02ListType.vue";
-import { usePositionEmployeeDataStore } from "../stores/positionEmployeeStore";
-// const store.pathLocation = ref<string>("list_position");
-const tabs = ref<Array<any>>([]);
-const store = usePositionEmployeeDataStore();
-
-onMounted(() => {
-  const tabsPerson = [
-    { label: "ตำแหน่ง", value: "list_position" },
-    { label: "รายการกลุ่มงาน", value: "list_type" },
-  ];
-  tabs.value = tabsPerson;
-});
-</script>
-
-<template>
-  <div class="toptitle text-dark col-12 row items-center">
-    ข้อมูลตำแหน่งลูกจ้างประจำ
-  </div>
-
-  <q-card flat bordered>
-    <q-tabs
-      dense
-      v-model="store.pathLocation"
-      align="left"
-      indicator-color="primary"
-      active-color="primary bg-teal-1"
-      inline-label
-      class="text-body2 text-grey-7"
-    >
-      <q-tab
-        v-for="tab in tabs"
-        :key="tab.value"
-        v-on:click="store.pathLocation = tab.value"
-        :label="tab.label"
-        :name="tab.value"
-        class="q-py-xs"
-      />
-    </q-tabs>
-    <q-separator />
-
-    <q-tab-panels v-model="store.pathLocation" animated>
-      <q-tab-panel name="list_position">
-        <ListPosition v-if="store.pathLocation == 'list_position'" />
-      </q-tab-panel>
-
-      <q-tab-panel name="list_type">
-        <ListType v-if="store.pathLocation == 'list_type'" />
-      </q-tab-panel>
-
-      <q-tab-panel name="list_executive">
-        <ListExecutive v-if="store.pathLocation == 'list_executive'" />
-      </q-tab-panel>
-    </q-tab-panels>
-  </q-card>
-</template>
-
-<style scoped></style>