<script setup>
// 常用属性：
//    items - [ 条目1, 条目2, ... ]
//    home - 开始的条目定义，比如 :home="{icon: 'pi pi-home'}"

// 单个item条目常用属性：
//    name - 标签名,
//    icon - 图标
//    url - 链接
//    target - 链接Target
//    disabled - 是否禁用
//    command - 点击触发的函数命令
//    class - 样式表class
//    style - 样式表

import Breadcrumb from "primevue/breadcrumb";
import T from "./T.js"
import {getCurrentInstance, provide} from "vue";

const props = defineProps({
	items: {
		type: Array,
		default: []
	}
})

if (props.items instanceof Array && props.items.length > 0) {
	props.items.forEach(item => {
		if (item !== null && typeof item === "object") {
			if (T.isNull(item.label) && typeof item.name === "string") {
				item.label = item.name
			}
		}
	})
}

const instance = getCurrentInstance()
provide("$breadcrumb", instance)

</script>

<template>
	<Breadcrumb :model="items">
		<template #item="slotProps" v-if="$slots.item">
			<slot name="item" v-bind="slotProps"></slot>
		</template>
		<template #separator v-if="$slots.separator">
			<slot name="separator"></slot>
		</template>
		<template #itemicon="slotProps" v-if="$slots.itemicon">
			<slot name="itemicon" v-bind="slotProps"></slot>
		</template>
	</Breadcrumb>
</template>

<style scoped>

</style>