Refactor #4190 - For Dock

pull/4208/head
Tuğçe Küçükoğlu 2023-07-25 12:11:01 +03:00
parent 5130a1e9db
commit 6d2f17501e
2 changed files with 12 additions and 7 deletions

View File

@ -104,6 +104,10 @@ export interface DockContext {
* Current index of the menuitem.
*/
index: number;
/**
* Current menuitem
*/
item: any;
/**
* Current active state of menuitem as a boolean.
* @defaultValue false

View File

@ -25,11 +25,11 @@
:aria-disabled="disabled(processedItem)"
@click="onItemClick($event, processedItem)"
@mouseenter="onItemMouseEnter(index)"
v-bind="getPTOptions('menuitem', index)"
v-bind="getPTOptions('menuitem', processedItem, index)"
:data-p-focused="isItemActive(getItemId(index))"
:data-p-disabled="disabled(processedItem) || false"
>
<div :class="cx('content')" v-bind="getPTOptions('content', index)">
<div :class="cx('content')" v-bind="getPTOptions('content', processedItem, index)">
<template v-if="!templates['item']">
<router-link v-if="processedItem.to && !disabled(processedItem)" v-slot="{ navigate, href, isActive, isExactActive }" :to="processedItem.to" custom>
<a
@ -40,10 +40,10 @@
tabindex="-1"
aria-hidden="true"
@click="onItemActionClick($event, processedItem, navigate)"
v-bind="getPTOptions('action', index)"
v-bind="getPTOptions('action', processedItem, index)"
>
<template v-if="!templates['icon']">
<span v-ripple :class="[cx('icon'), processedItem.icon]" v-bind="getPTOptions('icon', index)"></span>
<span v-ripple :class="[cx('icon'), processedItem.icon]" v-bind="getPTOptions('icon', processedItem, index)"></span>
</template>
<component v-else :is="templates['icon']" :item="processedItem" :class="cx('icon')"></component>
</a>
@ -56,10 +56,10 @@
:target="processedItem.target"
tabindex="-1"
aria-hidden="true"
v-bind="getPTOptions('action', index)"
v-bind="getPTOptions('action', processedItem, index)"
>
<template v-if="!templates['icon']">
<span v-ripple :class="[cx('icon'), processedItem.icon]" v-bind="getPTOptions('icon', index)"></span>
<span v-ripple :class="[cx('icon'), processedItem.icon]" v-bind="getPTOptions('icon', processedItem, index)"></span>
</template>
<component v-else :is="templates['icon']" :item="processedItem" :class="cx('icon')"></component>
</a>
@ -141,10 +141,11 @@ export default {
getItemProp(processedItem, name) {
return processedItem && processedItem.item ? ObjectUtils.getItemValue(processedItem.item[name]) : undefined;
},
getPTOptions(key, index) {
getPTOptions(key, item, index) {
return this.ptm(key, {
context: {
index,
item,
active: this.isItemActive(this.getItemId(index))
}
});