2022-09-06 12:03:37 +00:00
|
|
|
<template>
|
2023-05-29 09:19:55 +00:00
|
|
|
<nav :class="cx('root')" v-bind="ptm('root')" data-pc-name="breadcrumb">
|
2023-05-29 07:05:29 +00:00
|
|
|
<ol :class="cx('menu')" v-bind="ptm('menu')">
|
2023-11-08 12:47:48 +00:00
|
|
|
<BreadcrumbItem v-if="home" :item="home" :class="cx('home')" :templates="$slots" :pt="pt" :unstyled="unstyled" v-bind="ptm('home')" />
|
2023-09-06 11:50:21 +00:00
|
|
|
<template v-for="(item, i) of model" :key="item.label + '_' + i">
|
2023-05-29 07:05:29 +00:00
|
|
|
<li v-if="home || i !== 0" :class="cx('separator')" v-bind="ptm('separator')">
|
2023-04-05 11:55:26 +00:00
|
|
|
<slot name="separator">
|
2023-04-26 09:57:16 +00:00
|
|
|
<ChevronRightIcon aria-hidden="true" v-bind="ptm('separatorIcon')" />
|
2023-04-05 11:55:26 +00:00
|
|
|
</slot>
|
2022-12-08 11:04:25 +00:00
|
|
|
</li>
|
2023-11-08 12:47:48 +00:00
|
|
|
<BreadcrumbItem :item="item" :index="i" :templates="$slots" :pt="pt" :unstyled="unstyled" />
|
2022-09-06 12:03:37 +00:00
|
|
|
</template>
|
2022-12-08 11:04:25 +00:00
|
|
|
</ol>
|
2022-09-06 12:03:37 +00:00
|
|
|
</nav>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
2023-04-18 12:53:43 +00:00
|
|
|
import ChevronRightIcon from 'primevue/icons/chevronright';
|
2023-05-29 07:05:29 +00:00
|
|
|
import BaseBreadcrumb from './BaseBreadcrumb.vue';
|
2022-09-06 12:03:37 +00:00
|
|
|
import BreadcrumbItem from './BreadcrumbItem.vue';
|
|
|
|
|
|
|
|
export default {
|
|
|
|
name: 'Breadcrumb',
|
2023-05-29 07:05:29 +00:00
|
|
|
extends: BaseBreadcrumb,
|
2022-09-06 12:03:37 +00:00
|
|
|
components: {
|
2023-04-05 11:55:26 +00:00
|
|
|
BreadcrumbItem: BreadcrumbItem,
|
|
|
|
ChevronRightIcon: ChevronRightIcon
|
2022-09-06 12:03:37 +00:00
|
|
|
}
|
2022-09-14 11:26:01 +00:00
|
|
|
};
|
2022-09-06 12:03:37 +00:00
|
|
|
</script>
|