123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158 |
- import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
- import _typeof from "@babel/runtime/helpers/esm/typeof";
- import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
- import { createVNode as _createVNode } from "vue";
- import { cloneVNode, defineComponent } from 'vue';
- import PropTypes from '../_util/vue-types';
- import { flattenChildren, getPropsSlot } from '../_util/props-util';
- import warning from '../_util/warning';
- import BreadcrumbItem from './BreadcrumbItem';
- import Menu from '../menu';
- import useConfigInject from '../_util/hooks/useConfigInject';
- export var breadcrumbProps = function breadcrumbProps() {
- return {
- prefixCls: String,
- routes: {
- type: Array
- },
- params: PropTypes.any,
- separator: PropTypes.any,
- itemRender: {
- type: Function
- }
- };
- };
- function getBreadcrumbName(route, params) {
- if (!route.breadcrumbName) {
- return null;
- }
- var paramsKeys = Object.keys(params).join('|');
- var name = route.breadcrumbName.replace(new RegExp(":(".concat(paramsKeys, ")"), 'g'), function (replacement, key) {
- return params[key] || replacement;
- });
- return name;
- }
- function defaultItemRender(opt) {
- var route = opt.route,
- params = opt.params,
- routes = opt.routes,
- paths = opt.paths;
- var isLastItem = routes.indexOf(route) === routes.length - 1;
- var name = getBreadcrumbName(route, params);
- return isLastItem ? _createVNode("span", null, [name]) : _createVNode("a", {
- "href": "#/".concat(paths.join('/'))
- }, [name]);
- }
- export default defineComponent({
- compatConfig: {
- MODE: 3
- },
- name: 'ABreadcrumb',
- props: breadcrumbProps(),
- slots: ['separator', 'itemRender'],
- setup: function setup(props, _ref) {
- var slots = _ref.slots;
- var _useConfigInject = useConfigInject('breadcrumb', props),
- prefixCls = _useConfigInject.prefixCls,
- direction = _useConfigInject.direction;
- var getPath = function getPath(path, params) {
- path = (path || '').replace(/^\//, '');
- Object.keys(params).forEach(function (key) {
- path = path.replace(":".concat(key), params[key]);
- });
- return path;
- };
- var addChildPath = function addChildPath(paths, childPath, params) {
- var originalPaths = _toConsumableArray(paths);
- var path = getPath(childPath || '', params);
- if (path) {
- originalPaths.push(path);
- }
- return originalPaths;
- };
- var genForRoutes = function genForRoutes(_ref2) {
- var _ref2$routes = _ref2.routes,
- routes = _ref2$routes === void 0 ? [] : _ref2$routes,
- _ref2$params = _ref2.params,
- params = _ref2$params === void 0 ? {} : _ref2$params,
- separator = _ref2.separator,
- _ref2$itemRender = _ref2.itemRender,
- itemRender = _ref2$itemRender === void 0 ? defaultItemRender : _ref2$itemRender;
- var paths = [];
- return routes.map(function (route) {
- var path = getPath(route.path, params);
- if (path) {
- paths.push(path);
- }
- var tempPaths = [].concat(paths);
- // generated overlay by route.children
- var overlay = null;
- if (route.children && route.children.length) {
- overlay = _createVNode(Menu, null, {
- default: function _default() {
- return [route.children.map(function (child) {
- return _createVNode(Menu.Item, {
- "key": child.path || child.breadcrumbName
- }, {
- default: function _default() {
- return [itemRender({
- route: child,
- params: params,
- routes: routes,
- paths: addChildPath(tempPaths, child.path, params)
- })];
- }
- });
- })];
- }
- });
- }
- return _createVNode(BreadcrumbItem, {
- "overlay": overlay,
- "separator": separator,
- "key": path || route.breadcrumbName
- }, {
- default: function _default() {
- return [itemRender({
- route: route,
- params: params,
- routes: routes,
- paths: tempPaths
- })];
- }
- });
- });
- };
- return function () {
- var _getPropsSlot, _breadcrumbClassName;
- var crumbs;
- var routes = props.routes,
- _props$params = props.params,
- params = _props$params === void 0 ? {} : _props$params;
- var children = flattenChildren(getPropsSlot(slots, props));
- var separator = (_getPropsSlot = getPropsSlot(slots, props, 'separator')) !== null && _getPropsSlot !== void 0 ? _getPropsSlot : '/';
- var itemRender = props.itemRender || slots.itemRender || defaultItemRender;
- if (routes && routes.length > 0) {
- // generated by route
- crumbs = genForRoutes({
- routes: routes,
- params: params,
- separator: separator,
- itemRender: itemRender
- });
- } else if (children.length) {
- crumbs = children.map(function (element, index) {
- warning(_typeof(element.type) === 'object' && (element.type.__ANT_BREADCRUMB_ITEM || element.type.__ANT_BREADCRUMB_SEPARATOR), 'Breadcrumb', "Only accepts Breadcrumb.Item and Breadcrumb.Separator as it's children");
- return cloneVNode(element, {
- separator: separator,
- key: index
- });
- });
- }
- var breadcrumbClassName = (_breadcrumbClassName = {}, _defineProperty(_breadcrumbClassName, prefixCls.value, true), _defineProperty(_breadcrumbClassName, "".concat(prefixCls.value, "-rtl"), direction.value === 'rtl'), _breadcrumbClassName);
- return _createVNode("div", {
- "class": breadcrumbClassName
- }, [crumbs]);
- };
- }
- });
|