Refactor #4149 - For Dock
parent
5cf78eb31e
commit
608e222d60
|
@ -100,6 +100,10 @@ export interface DockState {
|
|||
* Defines current options in Dock component.
|
||||
*/
|
||||
export interface DockContext {
|
||||
/**
|
||||
* Current index of the menuitem.
|
||||
*/
|
||||
index: number;
|
||||
/**
|
||||
* Current active state of menuitem as a boolean.
|
||||
* @defaultValue false
|
||||
|
|
|
@ -25,11 +25,11 @@
|
|||
:aria-disabled="disabled(processedItem)"
|
||||
@click="onItemClick($event, processedItem)"
|
||||
@mouseenter="onItemMouseEnter(index)"
|
||||
v-bind="getPTOptions(getItemId(index), 'menuitem')"
|
||||
v-bind="getPTOptions('menuitem', index)"
|
||||
:data-p-focused="isItemActive(getItemId(index))"
|
||||
:data-p-disabled="disabled(processedItem) || false"
|
||||
>
|
||||
<div :class="cx('content')" v-bind="getPTOptions(getItemId(index), 'content')">
|
||||
<div :class="cx('content')" v-bind="getPTOptions('content', 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(getItemId(index), 'action')"
|
||||
v-bind="getPTOptions('action', index)"
|
||||
>
|
||||
<template v-if="!templates['icon']">
|
||||
<span v-ripple :class="[cx('icon'), processedItem.icon]" v-bind="getPTOptions(getItemId(index), 'icon')"></span>
|
||||
<span v-ripple :class="[cx('icon'), processedItem.icon]" v-bind="getPTOptions('icon', 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(getItemId(index), 'action')"
|
||||
v-bind="getPTOptions('action', index)"
|
||||
>
|
||||
<template v-if="!templates['icon']">
|
||||
<span v-ripple :class="[cx('icon'), processedItem.icon]" v-bind="getPTOptions(getItemId(index), 'icon')"></span>
|
||||
<span v-ripple :class="[cx('icon'), processedItem.icon]" v-bind="getPTOptions('icon', 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(id, key) {
|
||||
getPTOptions(key, index) {
|
||||
return this.ptm(key, {
|
||||
context: {
|
||||
active: this.isItemActive(id)
|
||||
index,
|
||||
active: this.isItemActive(this.getItemId(index))
|
||||
}
|
||||
});
|
||||
},
|
||||
|
|
Loading…
Reference in New Issue