vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Refactor #3965 - For PickList

pull/4034/head
Tuğçe Küçükoğlu 2023-06-06 16:30:04 +03:00
parent c98ab6e3fc
commit 26d30ab298
2 changed files with 11 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
components/lib/picklist/BasePickList.vue
View File

@ -47,12 +47,13 @@ const classes = {
], ],
sourceControls: 'p-picklist-buttons p-picklist-source-controls', sourceControls: 'p-picklist-buttons p-picklist-source-controls',
sourceWrapper: 'p-picklist-list-wrapper p-picklist-source-wrapper', sourceWrapper: 'p-picklist-list-wrapper p-picklist-source-wrapper',
sourceHeader: 'p-picklist-header',
sourceList: 'p-picklist-list p-picklist-source-list', sourceList: 'p-picklist-list p-picklist-source-list',
item: ({ context }) => [ item: ({ instance, item, id, listIndex }) => [
'p-picklist-item', 'p-picklist-item',
{ {
'p-highlight': context.active, 'p-highlight': instance.isSelected(item, listIndex),
'p-focus': context.focused 'p-focus': id === instance.focusedOptionId
} }
], ],
buttons: 'p-picklist-buttons p-picklist-transfer-buttons', buttons: 'p-picklist-buttons p-picklist-transfer-buttons',

26
components/lib/picklist/PickList.vue
View File

@ -33,7 +33,7 @@
<slot name="sourcecontrolsend"></slot> <slot name="sourcecontrolsend"></slot>
</div> </div>
<div :class="cx('sourceWrapper')" v-bind="ptm('sourceWrapper')"> <div :class="cx('sourceWrapper')" v-bind="ptm('sourceWrapper')">
<div v-if="$slots.sourceheader" class="p-picklist-header" v-bind="ptm('sourceHeader')"> <div v-if="$slots.sourceheader" :class="cx('sourceHeader')" v-bind="ptm('sourceHeader')">
<slot name="sourceheader"></slot> <slot name="sourceheader"></slot>
</div> </div>
<transition-group <transition-group
@ -56,15 +56,7 @@
<li <li
:id="idSource + '_' + i" :id="idSource + '_' + i"
v-ripple v-ripple
:class=" :class="cx('item', { item, id: `${idSource}_${i}`, listIndex: 0 })"
cx('item', {
context: {
active: isSelected(item, 0),
focused: `${idSource}_${i}` === focusedOptionId
}
})
"
:data-p-highlight="isSelected(item, 1)"
@click="onItemClick($event, item, i, 0)" @click="onItemClick($event, item, i, 0)"
@dblclick="onItemDblClick($event, item, 0)" @dblclick="onItemDblClick($event, item, 0)"
@touchend="onItemTouchEnd" @touchend="onItemTouchEnd"
@ -72,6 +64,8 @@
role="option" role="option"
:aria-selected="isSelected(item, 0)" :aria-selected="isSelected(item, 0)"
v-bind="getPTOptions(item, 'item')" v-bind="getPTOptions(item, 'item')"
:data-p-highlight="isSelected(item, 0)"
:data-p-focused="`${id}_${i}` === focusedOptionId"
> >
<slot name="item" :item="item" :index="i"> </slot> <slot name="item" :item="item" :index="i"> </slot>
</li> </li>
@ -134,15 +128,7 @@
<li <li
:id="idTarget + '_' + i" :id="idTarget + '_' + i"
v-ripple v-ripple
:class=" :class="cx('item', { item, id: `${idTarget}_${i}`, listIndex: 1 })"
cx('item', {
context: {
active: isSelected(item, 1),
focused: `${idTarget}_${i}` === focusedOptionId
}
})
"
:data-p-highlight="isSelected(item, 1)"
@click="onItemClick($event, item, i, 1)" @click="onItemClick($event, item, i, 1)"
@dblclick="onItemDblClick($event, item, 1)" @dblclick="onItemDblClick($event, item, 1)"
@keydown="onItemKeyDown($event, 'targetList')" @keydown="onItemKeyDown($event, 'targetList')"
@ -151,6 +137,8 @@
role="option" role="option"
:aria-selected="isSelected(item, 1)" :aria-selected="isSelected(item, 1)"
v-bind="getPTOptions(item, 'item')" v-bind="getPTOptions(item, 'item')"
:data-p-highlight="isSelected(item, 1)"
:data-p-focused="`${id}_${i}` === focusedOptionId"
> >
<slot name="item" :item="item" :index="i"> </slot> <slot name="item" :item="item" :index="i"> </slot>
</li> </li>