import React from "react"
import { controlKey } from "../config"
import { observer, StateManage } from "zion-ui"

export const KeyPath = observer(function () {
	let keyPath: any = []
	if (StateManage.has(controlKey.tabsCard)) {
		const { dataSource, activeKey } = StateManage.get(controlKey.tabsCard)
		let latestKeyPath = dataSource.find(data => data["key"] == activeKey)
		latestKeyPath = latestKeyPath ? latestKeyPath["label"] : ""
		if (latestKeyPath) {
			keyPath = ["首页"].concat(latestKeyPath.split("."))
		} else {
			keyPath = ["首页"]
		}
	}
	return <div
		style={{ height: "30px", background: "#FAFAFA", fontSize: "12px", paddingLeft: "10px", lineHeight: "30px", marginTop: "5px" }}>
		{keyPath.length == 1 ? keyPath.join(" ") : keyPath.join(" / ")}
	</div>
})