vertumnus/primevue-mirror
1
0
Fork 0
mirror of https://github.com/primefaces/primevue.git synced 2025-05-09 00:42:36 +00:00
Code Issues Projects Releases Packages Wiki Activity

PanelMenu & Steps pt demos added

Browse source
This commit is contained in:
Tuğçe Küçükoğlu 2023-04-28 09:58:06 +03:00
parent 3b5bb32bb2
commit 800a39203a
8 changed files with 648 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

128
doc/steps/pt/PTDoc.vue Normal file
View file

@ -0,0 +1,128 @@
<template>
<DocSectionText v-bind="$attrs"></DocSectionText>
<div class="card flex justify-content-center">
<Steps
:model="items"
:readonly="false"
:pt="{
root: { class: 'w-30rem' }
}"
/>
</div>
<DocSectionCode :code="code" />
</template>
<script>
export default {
data() {
return {
items: [
{
label: 'Personal',
to: '/steps'
},
{
label: 'Seat',
to: '/steps/seat'
},
{
label: 'Payment',
to: '/steps/payment'
},
{
label: 'Confirmation',
to: '/steps/confirmation'
}
],
code: {
basic: `
<Steps
:model="items"
:readonly="false"
:pt="{
root: { class: 'w-30rem' }
}"
/>`,
options: `
<template>
<div>
<div class="card">
<Steps
:model="items"
:readonly="false"
:pt="{
root: { class: 'w-30rem' }
}"
/>
</div>
</div>
</template>
<script>
export default {
data() {
return {
items: [
{
label: 'Personal',
to: '/'
},
{
label: 'Seat',
to: '/seat'
},
{
label: 'Payment',
to: '/payment'
},
{
label: 'Confirmation',
to: '/confirmation'
}
]
}
}
}
<\/script>`,
composition: `
<template>
<div>
<div class="card">
<Steps
:model="items"
:readonly="false"
:pt="{
root: { class: 'w-30rem' }
}"
/>
</div>
</div>
</template>
<script setup>
import { ref } from "vue";
const items = ref([
{
label: 'Personal',
to: "/"
},
{
label: 'Seat',
to: "/seat",
},
{
label: 'Payment',
to: "/payment",
},
{
label: 'Confirmation',
to: "/confirmation",
}
]);
<\/script>`
}
};
}
};
</script>