permissionsMenu
This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490
parent
cc36f52e55
commit
007df38109
4 changed files with 204 additions and 73 deletions
|
|
@ -6,6 +6,7 @@ import { useDataStore } from "@/stores/data";
|
|||
import { storeToRefs } from "pinia";
|
||||
import { scroll, useQuasar } from "quasar";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useMenuDataStore } from "@/stores/menuList";
|
||||
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
|
@ -28,6 +29,7 @@ const route = useRoute();
|
|||
const router = useRouter();
|
||||
const link = ref<string>("");
|
||||
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
|
||||
const storeMenu = useMenuDataStore();
|
||||
const {
|
||||
showLoader,
|
||||
hideLoader,
|
||||
|
|
@ -230,10 +232,13 @@ const activeBtn = () => {
|
|||
* ยังจับ boolean ผิด จึงต้อง set
|
||||
*/
|
||||
onMounted(async () => {
|
||||
await fetchSys();
|
||||
|
||||
if (keycloak.tokenParsed) {
|
||||
await fetchroleUser(keycloak.tokenParsed.role);
|
||||
}
|
||||
await fetchmsgNoread();
|
||||
|
||||
// await getDataNotification(1, "NOMAL");
|
||||
myEventHandler(null, false);
|
||||
window.addEventListener("resize", (e: any) => {
|
||||
|
|
@ -499,6 +504,20 @@ const handleButtonClick = () => {
|
|||
console.log("No manual available for this page:", currentPath);
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* function fetch รายการเมนูทั้งหมด
|
||||
*/
|
||||
function fetchSys() {
|
||||
http
|
||||
.get(config.API.orgPermissions)
|
||||
.then((res) => {
|
||||
storeMenu.fetchListMenu(res.data.result);
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- โครงเว็บ -->
|
||||
|
|
@ -762,28 +781,15 @@ const handleButtonClick = () => {
|
|||
<q-separator color="grey-9" />
|
||||
<!-- เมนูย่อย ตอนย่อ -->
|
||||
<q-list padding>
|
||||
<div v-for="(menuItem, index) in menuList" :key="index">
|
||||
<div v-if="role.includes(menuItem.role)">
|
||||
<div v-for="(menuItem, index) in storeMenu.menuList" :key="index">
|
||||
<div>
|
||||
<q-item
|
||||
clickable
|
||||
v-ripple
|
||||
:active="link === menuItem.label"
|
||||
@click="link = menuItem.label"
|
||||
:active="link === menuItem.sysName"
|
||||
@click="link = menuItem.sysName"
|
||||
active-class="text-primary menuActiveMini text-weight-medium"
|
||||
v-if="
|
||||
menuItem.key == 2 ||
|
||||
menuItem.key == 0 ||
|
||||
menuItem.key == 7 ||
|
||||
menuItem.key == 8 ||
|
||||
menuItem.key == 9 ||
|
||||
menuItem.key == 10 ||
|
||||
menuItem.key == 11 ||
|
||||
menuItem.key == 12 ||
|
||||
menuItem.key == 13 ||
|
||||
menuItem.key == 14 ||
|
||||
menuItem.key == 15 ||
|
||||
menuItem.key == 16
|
||||
"
|
||||
v-if="menuItem.children && menuItem.children.length !== 0"
|
||||
>
|
||||
<div class="row items-center no-wrap">
|
||||
<q-icon :name="menuItem.icon" size="20px" class="q-ml-md" />
|
||||
|
|
@ -798,7 +804,7 @@ const handleButtonClick = () => {
|
|||
self="center left"
|
||||
:offset="[10, 10]"
|
||||
>
|
||||
{{ menuItem.label }}
|
||||
{{ menuItem.sysName }}
|
||||
</q-tooltip>
|
||||
<q-menu
|
||||
anchor="top right"
|
||||
|
|
@ -815,24 +821,25 @@ const handleButtonClick = () => {
|
|||
<!-- เมนูย่อย 2 ชั้น -->
|
||||
<div
|
||||
v-if="
|
||||
menuItem.key == 2 ||
|
||||
menuItem.key == 7 ||
|
||||
menuItem.key == 12 ||
|
||||
menuItem.key == 13
|
||||
menuItem.id == 'SYS_EVA_METADATA' ||
|
||||
menuItem.id == 'SYS_EXAM' ||
|
||||
menuItem.id == 'SYS_DISCIPLINE' ||
|
||||
menuItem.id == 'SYS_EVA'
|
||||
"
|
||||
>
|
||||
<q-item
|
||||
dense
|
||||
clickable
|
||||
v-if="
|
||||
subMenu.key !== 2.0 &&
|
||||
subMenu.key !== 7.1 &&
|
||||
subMenu.key !== 12.0 &&
|
||||
subMenu.key !== 13.0
|
||||
subMenu.id == 'SYS_EVA_INDICATOR' ||
|
||||
subMenu.id == 'SYS_EXAM_CONTEST' ||
|
||||
subMenu.id == 'SYS_EXAM_SELECT' ||
|
||||
subMenu.id == 'SYS_DISCIPLINE_INFO' ||
|
||||
subMenu.id == 'SYS_EVA_INFO'
|
||||
"
|
||||
>
|
||||
<q-item-section
|
||||
>{{ subMenu.label }}
|
||||
>{{ subMenu.sysName }}
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-icon name="keyboard_arrow_right" />
|
||||
|
|
@ -847,7 +854,7 @@ const handleButtonClick = () => {
|
|||
<q-list class="text-white q-py-sm">
|
||||
<q-item
|
||||
v-for="subMenu2 in subMenu.children"
|
||||
:key="subMenu2.label"
|
||||
:key="subMenu2.sysName"
|
||||
:to="{ name: `${subMenu2.path}` }"
|
||||
dense
|
||||
class="q-pl-md text-body2"
|
||||
|
|
@ -856,7 +863,7 @@ const handleButtonClick = () => {
|
|||
>
|
||||
<q-item-section>
|
||||
<q-item-label>{{
|
||||
subMenu2.label
|
||||
subMenu2.sysName
|
||||
}}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
|
@ -873,7 +880,7 @@ const handleButtonClick = () => {
|
|||
:to="{ name: `${subMenu.path}` }"
|
||||
>
|
||||
<q-item-section>
|
||||
<q-item-label>{{ subMenu.label }}</q-item-label>
|
||||
<q-item-label>{{ subMenu.sysName }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</div>
|
||||
|
|
@ -887,7 +894,7 @@ const handleButtonClick = () => {
|
|||
:to="{ name: `${subMenu.path}` }"
|
||||
>
|
||||
<q-item-section>
|
||||
<q-item-label>{{ subMenu.label }}</q-item-label>
|
||||
<q-item-label>{{ subMenu.sysName }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</div>
|
||||
|
|
@ -899,8 +906,8 @@ const handleButtonClick = () => {
|
|||
clickable
|
||||
v-ripple
|
||||
:to="{ name: `${menuItem.path}` }"
|
||||
:active="link === menuItem.label"
|
||||
@click="link = menuItem.label"
|
||||
:active="link === menuItem.sysName"
|
||||
@click="link = menuItem.sysName"
|
||||
active-class="text-primary menuActiveMini"
|
||||
v-else
|
||||
>
|
||||
|
|
@ -914,7 +921,7 @@ const handleButtonClick = () => {
|
|||
self="center left"
|
||||
:offset="[10, 10]"
|
||||
>
|
||||
{{ menuItem.label }}
|
||||
{{ menuItem.sysName }}
|
||||
</q-tooltip>
|
||||
</q-item>
|
||||
</div>
|
||||
|
|
@ -946,28 +953,15 @@ const handleButtonClick = () => {
|
|||
</q-toolbar>
|
||||
<q-separator inset color="grey-9" />
|
||||
<q-list padding>
|
||||
<div v-for="(menuItem, index) in menuList" :key="index">
|
||||
<div v-for="(menuItem, index) in storeMenu.menuList" :key="index">
|
||||
<!-- เมนูย่อย -->
|
||||
<div v-if="role.includes(menuItem.role)">
|
||||
<div>
|
||||
<q-expansion-item
|
||||
group="somegroup"
|
||||
class="menuSub"
|
||||
expand-icon="mdi-chevron-down"
|
||||
expanded-icon="mdi-chevron-up"
|
||||
v-if="
|
||||
menuItem.key == 2 ||
|
||||
menuItem.key == 0 ||
|
||||
menuItem.key == 7 ||
|
||||
menuItem.key == 8 ||
|
||||
menuItem.key == 9 ||
|
||||
menuItem.key == 10 ||
|
||||
menuItem.key == 11 ||
|
||||
menuItem.key == 12 ||
|
||||
menuItem.key == 13 ||
|
||||
menuItem.key == 14 ||
|
||||
menuItem.key == 15 ||
|
||||
menuItem.key == 16
|
||||
"
|
||||
v-if="menuItem.children && menuItem.children.length !== 0"
|
||||
>
|
||||
<template v-slot:header>
|
||||
<q-item-section avatar>
|
||||
|
|
@ -977,28 +971,29 @@ const handleButtonClick = () => {
|
|||
font-size="20px"
|
||||
/>
|
||||
</q-item-section>
|
||||
<q-item-section>{{ menuItem.label }}</q-item-section>
|
||||
<q-item-section>{{ menuItem.sysName }}</q-item-section>
|
||||
</template>
|
||||
|
||||
<!-- เมนูย่อย 2 ชั้น (สรรหา) -->
|
||||
<div
|
||||
v-if="
|
||||
menuItem.key == 2 ||
|
||||
menuItem.key == 7 ||
|
||||
menuItem.key == 12 ||
|
||||
menuItem.key == 13
|
||||
menuItem.id == 'SYS_EVA_METADATA' ||
|
||||
menuItem.id == 'SYS_EXAM' ||
|
||||
menuItem.id == 'SYS_DISCIPLINE' ||
|
||||
menuItem.id == 'SYS_EVA'
|
||||
"
|
||||
>
|
||||
<div v-for="(subMenu, i) in menuItem.children" :key="i">
|
||||
<q-expansion-item
|
||||
switch-toggle-side
|
||||
dense-toggle
|
||||
:label="subMenu.label"
|
||||
:label="subMenu.sysName"
|
||||
v-if="
|
||||
subMenu.key !== 2.0 &&
|
||||
subMenu.key !== 7.1 &&
|
||||
subMenu.key !== 12.0 &&
|
||||
subMenu.key !== 13.0
|
||||
subMenu.id == 'SYS_EVA_INDICATOR' ||
|
||||
subMenu.id == 'SYS_EXAM_CONTEST' ||
|
||||
subMenu.id == 'SYS_EXAM_SELECT' ||
|
||||
subMenu.id == 'SYS_DISCIPLINE_INFO' ||
|
||||
subMenu.id == 'SYS_EVA_INFO'
|
||||
"
|
||||
class="expan2"
|
||||
dense
|
||||
|
|
@ -1009,12 +1004,12 @@ const handleButtonClick = () => {
|
|||
active-class="text-primary active-item text-weight-bold menuSubAct"
|
||||
clickable
|
||||
v-for="subMenu2 in subMenu.children"
|
||||
:key="subMenu2.key"
|
||||
:key="subMenu2.id"
|
||||
:to="{ name: `${subMenu2.path}` }"
|
||||
>
|
||||
<q-item-section>
|
||||
<q-item-label class="font-400 subLabel"
|
||||
>{{ subMenu2.label }}
|
||||
>{{ subMenu2.sysName }}
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
|
@ -1028,7 +1023,7 @@ const handleButtonClick = () => {
|
|||
:to="{ name: `${subMenu.path}` }"
|
||||
>
|
||||
<q-item-section>
|
||||
<q-item-label>{{ subMenu.label }} </q-item-label>
|
||||
<q-item-label>{{ subMenu.sysName }} </q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</div>
|
||||
|
|
@ -1046,7 +1041,7 @@ const handleButtonClick = () => {
|
|||
>
|
||||
<q-item-section>
|
||||
<q-item-label class="font-400">{{
|
||||
subMenu.label
|
||||
subMenu.sysName
|
||||
}}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
|
@ -1066,18 +1061,12 @@ const handleButtonClick = () => {
|
|||
>
|
||||
<q-item-section avatar>
|
||||
<q-avatar size="md" font-size="20px">
|
||||
<q-icon
|
||||
:name="
|
||||
menuItem.key === active
|
||||
? menuItem.activeIcon
|
||||
: menuItem.icon
|
||||
"
|
||||
/>
|
||||
<q-icon :name="menuItem.icon" />
|
||||
</q-avatar>
|
||||
</q-item-section>
|
||||
|
||||
<q-item-section>
|
||||
<q-item-label>{{ menuItem.label }}</q-item-label>
|
||||
<q-item-label>{{ menuItem.sysName }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue