Gava/agenciapsilmno
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

components tag order added

Browse Source
This commit is contained in:
Bahadır Sofuoğlu
2022-11-07 15:13:51 +03:00
parent 98f567478e
commit 001de2be44
41 changed files with 1677 additions and 1695 deletions
Download Patch File Download Diff File Expand all files Collapse all files

178
src/views/uikit/Menu.vue
View File

@@ -1,92 +1,3 @@
<template>
<div class="grid p-fluid">
<div class="col-12">
<div class="card card-w-title">
<h5>Menubar</h5>
<Menubar :model="nestedMenuitems">
<template #end>
<span class="p-input-icon-left">
<i class="pi pi-search" />
<InputText type="text" placeholder="Search" />
</span>
</template>
</Menubar>
</div>
</div>
<div class="col-12">
<div class="card card-w-title">
<h5>Breadcrumb</h5>
<Breadcrumb :home="breadcrumbHome" :model="breadcrumbItems" />
</div>
</div>
<div class="col-12 md:col-6">
<div class="card card-w-title">
<h5>Steps</h5>
<p>Steps and TabMenu are integrated with the same child routes.</p>
<Steps :model="nestedRouteItems" :readonly="false" />
<router-view />
</div>
</div>
<div class="col-12 md:col-6">
<div class="card card-w-title">
<h5>TabMenu</h5>
<p>Steps and TabMenu are integrated with the same child routes.</p>
<TabMenu :model="nestedRouteItems" />
<router-view />
</div>
</div>
<div class="col-12 md:col-4">
<div class="card">
<h5>Tiered Menu</h5>
<TieredMenu :model="tieredMenuItems" />
</div>
</div>
<div class="col-12 md:col-4">
<div class="card">
<h5>Plain Menu</h5>
<Menu :model="menuitems" />
</div>
</div>
<div class="col-12 md:col-4">
<div class="card">
<h5>Overlay Menu</h5>
<Menu ref="menu" :model="overlayMenuItems" :popup="true" />
<Button type="button" label="Options" icon="pi pi-angle-down" @click="toggleMenu" style="width: auto" />
</div>
<div class="card" @contextmenu="onContextRightClick">
<h5>ContextMenu</h5>
Right click to display.
<ContextMenu ref="contextMenu" :model="contextMenuItems" />
</div>
</div>
<div class="col-12 md:col-6">
<div class="card">
<h5>MegaMenu - Horizontal</h5>
<MegaMenu :model="megamenuItems" />
<h5 style="margin-top: 1.55em">MegaMenu - Vertical</h5>
<MegaMenu :model="megamenuItems" orientation="vertical" />
</div>
</div>
<div class="col-12 md:col-6">
<div class="card">
<h5>PanelMenu</h5>
<PanelMenu :model="panelMenuitems" />
</div>
</div>
</div>
</template>
<script setup>
import { ref } from 'vue';
@@ -527,3 +438,92 @@ const onContextRightClick = (event) => {
contextMenu.value.show(event);
};
</script>
<template>
<div class="grid p-fluid">
<div class="col-12">
<div class="card card-w-title">
<h5>Menubar</h5>
<Menubar :model="nestedMenuitems">
<template #end>
<span class="p-input-icon-left">
<i class="pi pi-search" />
<InputText type="text" placeholder="Search" />
</span>
</template>
</Menubar>
</div>
</div>
<div class="col-12">
<div class="card card-w-title">
<h5>Breadcrumb</h5>
<Breadcrumb :home="breadcrumbHome" :model="breadcrumbItems" />
</div>
</div>
<div class="col-12 md:col-6">
<div class="card card-w-title">
<h5>Steps</h5>
<p>Steps and TabMenu are integrated with the same child routes.</p>
<Steps :model="nestedRouteItems" :readonly="false" />
<router-view />
</div>
</div>
<div class="col-12 md:col-6">
<div class="card card-w-title">
<h5>TabMenu</h5>
<p>Steps and TabMenu are integrated with the same child routes.</p>
<TabMenu :model="nestedRouteItems" />
<router-view />
</div>
</div>
<div class="col-12 md:col-4">
<div class="card">
<h5>Tiered Menu</h5>
<TieredMenu :model="tieredMenuItems" />
</div>
</div>
<div class="col-12 md:col-4">
<div class="card">
<h5>Plain Menu</h5>
<Menu :model="menuitems" />
</div>
</div>
<div class="col-12 md:col-4">
<div class="card">
<h5>Overlay Menu</h5>
<Menu ref="menu" :model="overlayMenuItems" :popup="true" />
<Button type="button" label="Options" icon="pi pi-angle-down" @click="toggleMenu" style="width: auto" />
</div>
<div class="card" @contextmenu="onContextRightClick">
<h5>ContextMenu</h5>
Right click to display.
<ContextMenu ref="contextMenu" :model="contextMenuItems" />
</div>
</div>
<div class="col-12 md:col-6">
<div class="card">
<h5>MegaMenu - Horizontal</h5>
<MegaMenu :model="megamenuItems" />
<h5 style="margin-top: 1.55em">MegaMenu - Vertical</h5>
<MegaMenu :model="megamenuItems" orientation="vertical" />
</div>
</div>
<div class="col-12 md:col-6">
<div class="card">
<h5>PanelMenu</h5>
<PanelMenu :model="panelMenuitems" />
</div>
</div>
</div>
</template>