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

refactor: #7090 for PanelMenu

pull/7064/merge
Mert Sincan 2025-01-14 11:12:15 +00:00
parent 0be05110a8
commit 1095fecced
1 changed files with 5 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
packages/primevue/src/panel/Panel.vue
View File

@ -1,17 +1,17 @@
<template>
<div :class="cx('root')" v-bind="ptmi('root')">
<div :class="cx('header')" v-bind="ptm('header')">
<slot :id="id + '_header'" name="header" :class="cx('title')">
<span v-if="header" :id="id + '_header'" :class="cx('title')" v-bind="ptm('title')">{{ header }}</span>
<slot :id="$id + '_header'" name="header" :class="cx('title')">
<span v-if="header" :id="$id + '_header'" :class="cx('title')" v-bind="ptm('title')">{{ header }}</span>
</slot>
<div :class="cx('headerActions')" v-bind="ptm('headerActions')">
<slot name="icons"></slot>
<Button
v-if="toggleable"
:id="id + '_header'"
:id="$id + '_header'"
:class="cx('pcToggleButton')"
:aria-label="buttonAriaLabel"
:aria-controls="id + '_content'"
:aria-controls="$id + '_content'"
:aria-expanded="!d_collapsed"
:unstyled="unstyled"
@click="toggle"
@ -29,7 +29,7 @@
</div>
</div>
<transition name="p-toggleable-content" v-bind="ptm('transition')">
<div v-show="!d_collapsed" :id="id + '_content'" :class="cx('contentContainer')" role="region" :aria-labelledby="id + '_header'" v-bind="ptm('contentContainer')">
<div v-show="!d_collapsed" :id="$id + '_content'" :class="cx('contentContainer')" role="region" :aria-labelledby="$id + '_header'" v-bind="ptm('contentContainer')">
<div :class="cx('content')" v-bind="ptm('content')">
<slot></slot>
</div>
@ -42,7 +42,6 @@
</template>
<script>
import { UniqueComponentId } from '@primevue/core/utils';
import MinusIcon from '@primevue/icons/minus';
import PlusIcon from '@primevue/icons/plus';
import Button from 'primevue/button';
@ -56,21 +55,14 @@ export default {
emits: ['update:collapsed', 'toggle'],
data() {
return {
id: this.$attrs.id,
d_collapsed: this.collapsed
};
},
watch: {
'$attrs.id': function (newValue) {
this.id = newValue || UniqueComponentId();
},
collapsed(newValue) {
this.d_collapsed = newValue;
}
},
mounted() {
this.id = this.id || UniqueComponentId();
},
methods: {
toggle(event) {
this.d_collapsed = !this.d_collapsed;