mirror of
https://github.com/primefaces/primevue.git
synced 2025-05-09 00:42:36 +00:00
Fixed #5179 - Improve data-pc- structure in components
This commit is contained in:
mertsincan
parent
3b72308226
commit
4836654f7b
85 changed files with 128 additions and 242 deletions
|
|
@ -2,37 +2,28 @@
|
|||
<div :class="cx('root')" v-bind="ptm('root')">
|
||||
<div v-if="showSourceControls" :class="cx('sourceControls')" v-bind="ptm('sourceControls')" data-pc-group-section="controls">
|
||||
<slot name="sourcecontrolsstart"></slot>
|
||||
<PLButton :aria-label="moveUpAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveUp($event, 0)" v-bind="moveUpButtonProps" :pt="ptm('sourceMoveUpButton')" :unstyled="unstyled" data-pc-section="sourcemoveupbutton">
|
||||
<PLButton :aria-label="moveUpAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveUp($event, 0)" v-bind="moveUpButtonProps" :pt="ptm('sourceMoveUpButton')" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="moveupicon">
|
||||
<AngleUpIcon v-bind="ptm('sourceMoveUpButton')['icon']" data-pc-section="moveupicon" />
|
||||
</slot>
|
||||
</template>
|
||||
</PLButton>
|
||||
<PLButton :aria-label="moveTopAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveTop($event, 0)" v-bind="moveTopButtonProps" :pt="ptm('sourceMoveTopButton')" :unstyled="unstyled" data-pc-section="sourcemovetopbutton">
|
||||
<PLButton :aria-label="moveTopAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveTop($event, 0)" v-bind="moveTopButtonProps" :pt="ptm('sourceMoveTopButton')" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movetopicon">
|
||||
<AngleDoubleUpIcon v-bind="ptm('sourceMoveTopButton')['icon']" data-pc-section="movetopicon" />
|
||||
</slot>
|
||||
</template>
|
||||
</PLButton>
|
||||
<PLButton :aria-label="moveDownAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveDown($event, 0)" v-bind="moveDownButtonProps" :pt="ptm('sourceMoveDownButton')" :unstyled="unstyled" data-pc-section="sourcemovedownbutton">
|
||||
<PLButton :aria-label="moveDownAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveDown($event, 0)" v-bind="moveDownButtonProps" :pt="ptm('sourceMoveDownButton')" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movedownicon">
|
||||
<AngleDownIcon v-bind="ptm('sourceMoveDownButton')['icon']" data-pc-section="movedownicon" />
|
||||
</slot>
|
||||
</template>
|
||||
</PLButton>
|
||||
<PLButton
|
||||
:aria-label="moveBottomAriaLabel"
|
||||
:disabled="moveDisabled(0)"
|
||||
type="button"
|
||||
@click="moveBottom($event, 0)"
|
||||
v-bind="moveBottomButtonProps"
|
||||
:pt="ptm('sourceMoveBottomButton')"
|
||||
:unstyled="unstyled"
|
||||
data-pc-section="sourcemovebottombutton"
|
||||
>
|
||||
<PLButton :aria-label="moveBottomAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveBottom($event, 0)" v-bind="moveBottomButtonProps" :pt="ptm('sourceMoveBottomButton')" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movebottomicon">
|
||||
<AngleDoubleDownIcon v-bind="ptm('sourceMoveBottomButton')['icon']" data-pc-section="movebottomicon" />
|
||||
|
|
@ -85,46 +76,28 @@
|
|||
</div>
|
||||
<div :class="cx('buttons')" v-bind="ptm('buttons')" data-pc-group-section="controls">
|
||||
<slot name="movecontrolsstart"></slot>
|
||||
<PLButton :aria-label="moveToTargetAriaLabel" type="button" @click="moveToTarget" :disabled="moveDisabled(0)" v-bind="moveToTargetProps" :pt="ptm('moveToTargetButton')" :unstyled="unstyled" data-pc-section="movetotargetbuton">
|
||||
<PLButton :aria-label="moveToTargetAriaLabel" type="button" @click="moveToTarget" :disabled="moveDisabled(0)" v-bind="moveToTargetProps" :pt="ptm('moveToTargetButton')" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movetotargeticon" :viewChanged="viewChanged">
|
||||
<component :is="viewChanged ? 'AngleDownIcon' : 'AngleRightIcon'" v-bind="ptm('moveToTargetButton')['icon']" data-pc-section="movetotargeticon" />
|
||||
</slot>
|
||||
</template>
|
||||
</PLButton>
|
||||
<PLButton
|
||||
:aria-label="moveAllToTargetAriaLabel"
|
||||
type="button"
|
||||
@click="moveAllToTarget"
|
||||
:disabled="moveAllDisabled('sourceList')"
|
||||
v-bind="moveAllToTargetProps"
|
||||
:pt="ptm('moveAllToTargetButton')"
|
||||
:unstyled="unstyled"
|
||||
data-pc-section="movealltotargetbuton"
|
||||
>
|
||||
<PLButton :aria-label="moveAllToTargetAriaLabel" type="button" @click="moveAllToTarget" :disabled="moveAllDisabled('sourceList')" v-bind="moveAllToTargetProps" :pt="ptm('moveAllToTargetButton')" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movealltotargeticon" :viewChanged="viewChanged">
|
||||
<component :is="viewChanged ? 'AngleDoubleDownIcon' : 'AngleDoubleRightIcon'" v-bind="ptm('moveAllToTargetButton')['icon']" data-pc-section="movealltotargeticon" />
|
||||
</slot>
|
||||
</template>
|
||||
</PLButton>
|
||||
<PLButton :aria-label="moveToSourceAriaLabel" type="button" @click="moveToSource" :disabled="moveDisabled(1)" v-bind="moveToSourceProps" :pt="ptm('moveToSourceButton')" :unstyled="unstyled" data-pc-section="movetosourcebuton">
|
||||
<PLButton :aria-label="moveToSourceAriaLabel" type="button" @click="moveToSource" :disabled="moveDisabled(1)" v-bind="moveToSourceProps" :pt="ptm('moveToSourceButton')" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movetosourceicon" :viewChanged="viewChanged">
|
||||
<component :is="viewChanged ? 'AngleUpIcon' : 'AngleLeftIcon'" v-bind="ptm('moveToSourceButton')['icon']" data-pc-section="movetosourceicon" />
|
||||
</slot>
|
||||
</template>
|
||||
</PLButton>
|
||||
<PLButton
|
||||
:aria-label="moveAllToSourceAriaLabel"
|
||||
type="button"
|
||||
@click="moveAllToSource"
|
||||
:disabled="moveAllDisabled('targetList')"
|
||||
v-bind="moveAllToSourceProps"
|
||||
:pt="ptm('moveAllToSourceButton')"
|
||||
data-pc-section="movealltosourcebuton"
|
||||
:unstyled="unstyled"
|
||||
>
|
||||
<PLButton :aria-label="moveAllToSourceAriaLabel" type="button" @click="moveAllToSource" :disabled="moveAllDisabled('targetList')" v-bind="moveAllToSourceProps" :pt="ptm('moveAllToSourceButton')" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movealltosourceicon" :viewChanged="viewChanged">
|
||||
<component :is="viewChanged ? 'AngleDoubleUpIcon' : 'AngleDoubleLeftIcon'" v-bind="ptm('moveAllToSourceButton')['icon']" data-pc-section="movealltosourceicon" />
|
||||
|
|
@ -178,37 +151,28 @@
|
|||
</div>
|
||||
<div v-if="showTargetControls" :class="cx('targetControls')" v-bind="ptm('targetControls')" data-pc-group-section="controls">
|
||||
<slot name="targetcontrolsstart"></slot>
|
||||
<PLButton :aria-label="moveUpAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveUp($event, 1)" v-bind="moveUpButtonProps" :pt="ptm('targetMoveUpButton')" :unstyled="unstyled" data-pc-section="targetmoveupbutton">
|
||||
<PLButton :aria-label="moveUpAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveUp($event, 1)" v-bind="moveUpButtonProps" :pt="ptm('targetMoveUpButton')" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="moveupicon">
|
||||
<AngleUpIcon v-bind="ptm('targetMoveUpButton')['icon']" data-pc-section="moveupicon" />
|
||||
</slot>
|
||||
</template>
|
||||
</PLButton>
|
||||
<PLButton :aria-label="moveTopAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveTop($event, 1)" v-bind="moveTopButtonProps" :pt="ptm('targetMoveTopButton')" :unstyled="unstyled" data-pc-section="targetmovetopbutton">
|
||||
<PLButton :aria-label="moveTopAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveTop($event, 1)" v-bind="moveTopButtonProps" :pt="ptm('targetMoveTopButton')" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movetopicon">
|
||||
<AngleDoubleUpIcon v-bind="ptm('targetMoveTopButton')['icon']" data-pc-section="movetopicon" />
|
||||
</slot>
|
||||
</template>
|
||||
</PLButton>
|
||||
<PLButton :aria-label="moveDownAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveDown($event, 1)" v-bind="moveDownButtonProps" :pt="ptm('targetMoveDownButton')" :unstyled="unstyled" data-pc-section="targetmovedownbutton">
|
||||
<PLButton :aria-label="moveDownAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveDown($event, 1)" v-bind="moveDownButtonProps" :pt="ptm('targetMoveDownButton')" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movedownicon">
|
||||
<AngleDownIcon v-bind="ptm('targetMoveDownButton')['icon']" data-pc-section="movedownicon" />
|
||||
</slot>
|
||||
</template>
|
||||
</PLButton>
|
||||
<PLButton
|
||||
:aria-label="moveBottomAriaLabel"
|
||||
:disabled="moveDisabled(1)"
|
||||
type="button"
|
||||
@click="moveBottom($event, 1)"
|
||||
v-bind="moveBottomButtonProps"
|
||||
:pt="ptm('targetMoveBottomButton')"
|
||||
:unstyled="unstyled"
|
||||
data-pc-section="targetmovebottombutton"
|
||||
>
|
||||
<PLButton :aria-label="moveBottomAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveBottom($event, 1)" v-bind="moveBottomButtonProps" :pt="ptm('targetMoveBottomButton')" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movebottomicon">
|
||||
<AngleDoubleDownIcon v-bind="ptm('targetMoveBottomButton')['icon']" data-pc-section="movebottomicon" />
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue