สิทธิ์ / rating เปลี่ยนเป็น btn group

2024-08-01 15:38:46 +07:00 · 2024-08-01 15:38:46 +07:00 · 006a492834
commit 006a492834
parent c6d4f5f0e3
22 changed files with 2248 additions and 2718 deletions
--- a/src/modules/01_masterdata/components/competency/01ListCompetency.vue
+++ b/src/modules/01_masterdata/components/competency/01ListCompetency.vue
@ -95,6 +95,10 @@ async function onViewDetail(id: string) {
  router.push(`/masterdata/competency/${id}`);
 }

+async function onViewDetailPage(id: string) {
+  router.push(`/masterdata/competency-detail/${id}`);
+}
+
 function deleteData(id: string) {
  dialogRemove($q, () => {
    http
@ -229,6 +233,20 @@ onMounted(() => {
    <template v-slot:body="props">
      <q-tr :props="props" class="cursor-pointer">
        <q-td auto-width>
+          <q-btn
+            v-if="checkPermission($route)?.attrIsGet"
+            color="info"
+            flat
+            dense
+            round
+            size="12px"
+            icon="mdi-eye"
+            clickable
+            @click.stop="onViewDetailPage(props.row.id)"
+            v-close-popup
+          >
+            <q-tooltip>รายละเอียด</q-tooltip>
+          </q-btn>
          <q-btn
            v-if="checkPermission($route)?.attrIsUpdate"
            color="edit"
--- a/src/modules/01_masterdata/components/competency/02ListLinkPosition.vue
+++ b/src/modules/01_masterdata/components/competency/02ListLinkPosition.vue
@ -13,6 +13,8 @@ import type {
 import http from "@/plugins/http";
 import config from "@/app.config";

+import { checkPermission } from "@/utils/permissions";
+
 const total = ref<number>();
 const modal = ref<boolean>(false);
 const rows = ref<any[]>([]);
@ -204,7 +206,14 @@ onMounted(async () => {

 <template>
  <q-toolbar style="padding: 0">
-    <q-btn flat round color="primary" icon="add" @click="onAdd()">
+    <q-btn
+      v-if="checkPermission($route)?.attrIsCreate"
+      flat
+      round
+      color="primary"
+      icon="add"
+      @click="onAdd()"
+    >
      <q-tooltip> เพิ่มข้อมูล </q-tooltip>
    </q-btn>
    <q-space />
@ -268,6 +277,7 @@ onMounted(async () => {
      <q-tr :props="props" class="cursor-pointer">
        <q-td auto-width>
          <q-btn
+            v-if="checkPermission($route)?.attrIsUpdate"
            color="edit"
            flat
            dense
@ -281,6 +291,7 @@ onMounted(async () => {
            <q-tooltip>แก้ไขข้อมูล</q-tooltip>
          </q-btn>
          <q-btn
+            v-if="checkPermission($route)?.attrIsDelete"
            color="red"
            flat
            dense
@ -299,7 +310,6 @@ onMounted(async () => {
        <q-td v-for="col in props.cols" :key="col.id">
          {{ col.value }}
        </q-td>
-
      </q-tr>
    </template>
    <template v-slot:pagination="scope">
--- a/src/modules/01_masterdata/components/competency/03ListLinkGroup.vue
+++ b/src/modules/01_masterdata/components/competency/03ListLinkGroup.vue
@ -14,6 +14,8 @@ import type {
 import http from "@/plugins/http";
 import config from "@/app.config";

+import { checkPermission } from "@/utils/permissions";
+
 const total = ref<number>();
 const id = ref<string>("");
 const modal = ref<boolean>(false);
@ -343,7 +345,14 @@ onMounted(async () => {

 <template>
  <q-toolbar style="padding: 0">
-    <q-btn flat round color="primary" icon="add" @click="onAdd()">
+    <q-btn
+      v-if="checkPermission($route)?.attrIsCreate"
+      flat
+      round
+      color="primary"
+      icon="add"
+      @click="onAdd()"
+    >
      <q-tooltip> เพิ่มข้อมูล </q-tooltip>
    </q-btn>
    <q-space />
@ -398,7 +407,7 @@ onMounted(async () => {
  >
    <template v-slot:header="props">
      <q-tr :props="props">
-        <q-th auto-width />
+        <q-th auto-width v-if="checkPermission($route)?.attrIsUpdate || checkPermission($route)?.attrIsDelete "/>
        <q-th v-for="col in props.cols" :key="col.name" :props="props">
          <span class="text-weight-medium">{{ col.label }}</span>
        </q-th>
@ -406,8 +415,9 @@ onMounted(async () => {
    </template>
    <template v-slot:body="props">
      <q-tr :props="props" class="cursor-pointer">
-        <q-td auto-width>
+        <q-td auto-width v-if="checkPermission($route)?.attrIsUpdate || checkPermission($route)?.attrIsDelete ">
          <q-btn
+            v-if="checkPermission($route)?.attrIsUpdate"
            color="edit"
            flat
            dense
@ -421,6 +431,7 @@ onMounted(async () => {
            <q-tooltip>แก้ไขข้อมูล</q-tooltip>
          </q-btn>
          <q-btn
+            v-if="checkPermission($route)?.attrIsDelete"
            color="red"
            flat
            dense
--- a/src/modules/01_masterdata/components/competency/04ListCriteria.vue
+++ b/src/modules/01_masterdata/components/competency/04ListCriteria.vue
@ -6,6 +6,8 @@ import http from "@/plugins/http";
 import config from "@/app.config";
 import { useQuasar } from "quasar";

+import { checkPermission } from "@/utils/permissions";
+
 const $q = useQuasar();
 const dataLevel = ref<any>();
 const { showLoader, hideLoader, success } = useCounterMixin();
@ -92,6 +94,7 @@ onMounted(() => {
                  >
                    <template #control>
                      <q-editor
+                        :readonly="checkPermission($route)?.attrIsUpdate == false"
                        class="full-width"
                        v-model="field.description"
                        :dense="$q.screen.lt.md"
@ -151,7 +154,7 @@ onMounted(() => {
      <q-separator />

      <q-card-actions align="right">
-        <q-btn label="บันทึก" color="secondary" type="submit"
+        <q-btn v-if="checkPermission($route)?.attrIsUpdate" label="บันทึก" color="secondary" type="submit"
          ><q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn
        >
      </q-card-actions>
--- a/src/modules/01_masterdata/components/competency/AddPage.vue
+++ b/src/modules/01_masterdata/components/competency/AddPage.vue
@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { ref, reactive } from "vue";
-import { useRouter } from "vue-router";
+import { useRoute, useRouter } from "vue-router";

 import Main from "@/modules/01_masterdata/components/competency/Forms/Main.vue";

@ -10,8 +10,10 @@ import type { DataOption } from "@/modules/01_masterdata/interface/index/Main";
 import type { FormCompetency } from "@/modules/01_masterdata/interface/request/Main";

 const router = useRouter();
+const route = useRoute();
 const store = useKPIDataStore();

+const checkRoute = ref<boolean>(route.name == "KPICompetencyDetailByid");
 const formData = reactive<FormCompetency>({
  competencyType: "",
  competencyName: "",
@ -82,13 +84,17 @@ function onSubmit() {
      class="q-mr-sm"
      @click="router.go(-1)"
    />
-    <span class="toptitle text-dark">เพิ่ม/แก้ไขสมรรถนะ</span>
+
+    <span class="toptitle text-dark">{{
+      checkRoute ? "รายละเอียดสมรรถนะ" : "เพิ่ม/แก้ไขสมรรถนะ"
+    }}</span>
  </div>
  <q-card>
    <q-card-section>
      <div class="row">
        <div class="col-12">
          <q-select
+            :readonly="checkRoute"
            v-model="store.competencyTypeVal"
            outlined
            label="เลือกประเภทสมรรถนะ"
--- a/src/modules/01_masterdata/components/competency/Forms/Main.vue
+++ b/src/modules/01_masterdata/components/competency/Forms/Main.vue
@ -17,6 +17,7 @@ const router = useRouter();
 const route = useRoute();
 const store = useKPIDataStore();

+const checkRoute = ref<boolean>(route.name == "KPICompetencyDetailByid");
 const competencyId = ref<string>(
  route.params.id ? route.params.id.toString() : ""
 );
@ -110,6 +111,7 @@ onMounted(() => {
      <div class="row q-col-gutter-sm">
        <div class="col-12">
          <q-input
+            :readonly="checkRoute"
            v-model="formData.competencyName"
            dense
            outlined
@ -132,6 +134,7 @@ onMounted(() => {
          >
            <template #control>
              <q-editor
+                :readonly="checkRoute"
                class="full-width"
                v-model="formData.definition"
                :dense="$q.screen.lt.md"
@ -174,6 +177,7 @@ onMounted(() => {
                  <div class="row items-center">
                    <div class="col-1">
                      <q-btn
+                        v-if="!checkRoute"
                        dense
                        flat
                        round
@ -230,6 +234,7 @@ onMounted(() => {
                      >
                        <template #control>
                          <q-editor
+                            :readonly="checkRoute"
                            class="full-width"
                            v-model="formData.levels[index].description"
                            :dense="$q.screen.lt.md"
@ -258,7 +263,7 @@ onMounted(() => {
                        color="red"
                        icon="delete"
                        @click="onDeleteLevels(index)"
-                        v-if="
+                        v-if="!checkRoute &&
                          (store.competencyTypeVal === 'HEAD' && index > 4) ||
                          (store.competencyTypeVal === 'GROUP' && index > 4) ||
                          ((store.competencyTypeVal === 'EXECUTIVE' ||
@ -282,7 +287,13 @@ onMounted(() => {
    <div class="col-12"><q-separator /></div>

    <q-card-actions align="right">
-      <q-btn label="บันทึก" color="public" class="q-px-md" type="submit">
+      <q-btn
+        v-if="!checkRoute"
+        label="บันทึก"
+        color="public"
+        class="q-px-md"
+        type="submit"
+      >
        <q-tooltip>บันทึกข้อมูล</q-tooltip>
      </q-btn>
    </q-card-actions>