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

Update default example of toolbar

pull/4683/head
Cagatay Civici 2023-10-23 19:17:47 +03:00
parent e7996f40ba
commit 9441f3aed4
1 changed files with 40 additions and 74 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

114
doc/toolbar/BasicDoc.vue
View File

@ -5,17 +5,19 @@
<div class="card">
<Toolbar>
<template #start>
<Button label="New" icon="pi pi-plus" class="mr-2" />
<Button label="Upload" icon="pi pi-upload" severity="success" />
<i class="pi pi-bars p-toolbar-separator mr-2" />
<SplitButton label="Save" icon="pi pi-check" :model="items" severity="warning"></SplitButton>
<Button icon="pi pi-plus" class="mr-2" />
<Button icon="pi pi-print" class="mr-2" />
<Button icon="pi pi-upload" />
</template>
<template #end>
<Button icon="pi pi-search" class="mr-2" />
<Button icon="pi pi-calendar" severity="success" class="mr-2" />
<Button icon="pi pi-times" severity="danger" />
<template #center>
<span class="p-input-icon-left">
<i class="pi pi-search" />
<InputText placeholder="Search" />
</span>
</template>
<template #end> <SplitButton label="Save" icon="pi pi-check" :model="items"></SplitButton></template>
</Toolbar>
</div>
<DocSectionCode :code="code" />
@ -33,37 +35,25 @@ export default {
{
label: 'Delete',
icon: 'pi pi-times'
},
{
label: 'Vue Website',
icon: 'pi pi-external-link',
command: () => {
window.location.href = 'https://vuejs.org/';
}
},
{
label: 'Upload',
icon: 'pi pi-upload',
command: () => {
this.$router.push('fileupload');
}
}
],
code: {
basic: `
<Toolbar>
<template #start>
<Button label="New" icon="pi pi-plus" class="mr-2" />
<Button label="Upload" icon="pi pi-upload" severity="success" />
<i class="pi pi-bars p-toolbar-separator mr-2" />
<SplitButton label="Save" icon="pi pi-check" :model="items" severity="warning"></SplitButton>
<Button icon="pi pi-plus" class="mr-2" />
<Button icon="pi pi-print" class="mr-2" />
<Button icon="pi pi-upload" />
</template>
<template #end>
<Button icon="pi pi-search" class="mr-2" />
<Button icon="pi pi-calendar" severity="success" class="mr-2" />
<Button icon="pi pi-times" severity="danger" />
<template #center>
<span class="p-input-icon-left">
<i class="pi pi-search" />
<InputText placeholder="Search" />
</span>
</template>
<template #end> <SplitButton label="Save" icon="pi pi-check" :model="items"></SplitButton></template>
</Toolbar>
`,
options: `
@ -71,17 +61,19 @@ export default {
<div class="card">
<Toolbar>
<template #start>
<Button label="New" icon="pi pi-plus" class="mr-2" />
<Button label="Upload" icon="pi pi-upload" severity="success" />
<i class="pi pi-bars p-toolbar-separator mr-2" />
<SplitButton label="Save" icon="pi pi-check" :model="items" severity="warning"></SplitButton>
<Button icon="pi pi-plus" class="mr-2" />
<Button icon="pi pi-print" class="mr-2" />
<Button icon="pi pi-upload" />
</template>
<template #end>
<Button icon="pi pi-search" class="mr-2" />
<Button icon="pi pi-calendar" severity="success" class="mr-2" />
<Button icon="pi pi-times" severity="danger" />
<template #center>
<span class="p-input-icon-left">
<i class="pi pi-search" />
<InputText placeholder="Search" />
</span>
</template>
<template #end> <SplitButton label="Save" icon="pi pi-check" :model="items"></SplitButton></template>
</Toolbar>
</div>
</template>
@ -98,20 +90,6 @@ export default {
{
label: 'Delete',
icon: 'pi pi-times'
},
{
label: 'Vue Website',
icon: 'pi pi-external-link',
command: () => {
window.location.href = 'https://vuejs.org/';
}
},
{
label: 'Upload',
icon: 'pi pi-upload',
command: () => {
this.$router.push('fileupload');
}
}
]
};
@ -124,17 +102,19 @@ export default {
<div class="card">
<Toolbar>
<template #start>
<Button label="New" icon="pi pi-plus" class="mr-2" />
<Button label="Upload" icon="pi pi-upload" severity="success" />
<i class="pi pi-bars p-toolbar-separator mr-2" />
<SplitButton label="Save" icon="pi pi-check" :model="items" severity="warning"></SplitButton>
<Button icon="pi pi-plus" class="mr-2" />
<Button icon="pi pi-print" class="mr-2" />
<Button icon="pi pi-upload" />
</template>
<template #end>
<Button icon="pi pi-search" class="mr-2" />
<Button icon="pi pi-calendar" severity="success" class="mr-2" />
<Button icon="pi pi-times" severity="danger" />
<template #center>
<span class="p-input-icon-left">
<i class="pi pi-search" />
<InputText placeholder="Search" />
</span>
</template>
<template #end> <SplitButton label="Save" icon="pi pi-check" :model="items"></SplitButton></template>
</Toolbar>
</div>
</template>
@ -150,20 +130,6 @@ const items = ref([
{
label: 'Delete',
icon: 'pi pi-times'
},
{
label: 'Vue Website',
icon: 'pi pi-external-link',
command: () => {
window.location.href = 'https://vuejs.org/';
}
},
{
label: 'Upload',
icon: 'pi pi-upload',
command: () => {
this.$router.push('fileupload');
}
}
])
<\/script>