Breadcrumb.js 5.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192
  1. 'use strict';
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. var _toConsumableArray2 = require('babel-runtime/helpers/toConsumableArray');
  6. var _toConsumableArray3 = _interopRequireDefault(_toConsumableArray2);
  7. var _vueTypes = require('../_util/vue-types');
  8. var _vueTypes2 = _interopRequireDefault(_vueTypes);
  9. var _vnode = require('../_util/vnode');
  10. var _propsUtil = require('../_util/props-util');
  11. var _warning = require('../_util/warning');
  12. var _warning2 = _interopRequireDefault(_warning);
  13. var _configConsumerProps = require('../config-provider/configConsumerProps');
  14. var _BreadcrumbItem = require('./BreadcrumbItem');
  15. var _BreadcrumbItem2 = _interopRequireDefault(_BreadcrumbItem);
  16. var _menu = require('../menu');
  17. var _menu2 = _interopRequireDefault(_menu);
  18. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
  19. var Route = _vueTypes2['default'].shape({
  20. path: _vueTypes2['default'].string,
  21. breadcrumbName: _vueTypes2['default'].string,
  22. children: _vueTypes2['default'].array
  23. }).loose;
  24. var BreadcrumbProps = {
  25. prefixCls: _vueTypes2['default'].string,
  26. routes: _vueTypes2['default'].arrayOf(Route),
  27. params: _vueTypes2['default'].any,
  28. separator: _vueTypes2['default'].any,
  29. itemRender: _vueTypes2['default'].func
  30. };
  31. function getBreadcrumbName(route, params) {
  32. if (!route.breadcrumbName) {
  33. return null;
  34. }
  35. var paramsKeys = Object.keys(params).join('|');
  36. var name = route.breadcrumbName.replace(new RegExp(':(' + paramsKeys + ')', 'g'), function (replacement, key) {
  37. return params[key] || replacement;
  38. });
  39. return name;
  40. }
  41. exports['default'] = {
  42. name: 'ABreadcrumb',
  43. props: BreadcrumbProps,
  44. inject: {
  45. configProvider: { 'default': function _default() {
  46. return _configConsumerProps.ConfigConsumerProps;
  47. } }
  48. },
  49. methods: {
  50. defaultItemRender: function defaultItemRender(_ref) {
  51. var route = _ref.route,
  52. params = _ref.params,
  53. routes = _ref.routes,
  54. paths = _ref.paths;
  55. var h = this.$createElement;
  56. var isLastItem = routes.indexOf(route) === routes.length - 1;
  57. var name = getBreadcrumbName(route, params);
  58. return isLastItem ? h('span', [name]) : h(
  59. 'a',
  60. {
  61. attrs: { href: '#/' + paths.join('/') }
  62. },
  63. [name]
  64. );
  65. },
  66. getPath: function getPath(path, params) {
  67. path = (path || '').replace(/^\//, '');
  68. Object.keys(params).forEach(function (key) {
  69. path = path.replace(':' + key, params[key]);
  70. });
  71. return path;
  72. },
  73. addChildPath: function addChildPath(paths, childPath, params) {
  74. var originalPaths = [].concat((0, _toConsumableArray3['default'])(paths));
  75. var path = this.getPath(childPath, params);
  76. if (path) {
  77. originalPaths.push(path);
  78. }
  79. return originalPaths;
  80. },
  81. genForRoutes: function genForRoutes(_ref2) {
  82. var _this = this;
  83. var _ref2$routes = _ref2.routes,
  84. routes = _ref2$routes === undefined ? [] : _ref2$routes,
  85. _ref2$params = _ref2.params,
  86. params = _ref2$params === undefined ? {} : _ref2$params,
  87. separator = _ref2.separator,
  88. _ref2$itemRender = _ref2.itemRender,
  89. itemRender = _ref2$itemRender === undefined ? this.defaultItemRender : _ref2$itemRender;
  90. var h = this.$createElement;
  91. var paths = [];
  92. return routes.map(function (route) {
  93. var path = _this.getPath(route.path, params);
  94. if (path) {
  95. paths.push(path);
  96. }
  97. // generated overlay by route.children
  98. var overlay = null;
  99. if (route.children && route.children.length) {
  100. overlay = h(_menu2['default'], [route.children.map(function (child) {
  101. return h(
  102. _menu2['default'].Item,
  103. { key: child.path || child.breadcrumbName },
  104. [itemRender({
  105. route: child,
  106. params: params,
  107. routes: routes,
  108. paths: _this.addChildPath(paths, child.path, params),
  109. h: _this.$createElement
  110. })]
  111. );
  112. })]);
  113. }
  114. return h(
  115. _BreadcrumbItem2['default'],
  116. {
  117. attrs: {
  118. overlay: overlay,
  119. separator: separator
  120. },
  121. key: path || route.breadcrumbName
  122. },
  123. [itemRender({ route: route, params: params, routes: routes, paths: paths, h: _this.$createElement })]
  124. );
  125. });
  126. }
  127. },
  128. render: function render() {
  129. var h = arguments[0];
  130. var crumbs = void 0;
  131. var customizePrefixCls = this.prefixCls,
  132. routes = this.routes,
  133. _params = this.params,
  134. params = _params === undefined ? {} : _params,
  135. $slots = this.$slots,
  136. $scopedSlots = this.$scopedSlots;
  137. var getPrefixCls = this.configProvider.getPrefixCls;
  138. var prefixCls = getPrefixCls('breadcrumb', customizePrefixCls);
  139. var children = (0, _propsUtil.filterEmpty)($slots['default']);
  140. var separator = (0, _propsUtil.getComponentFromProp)(this, 'separator');
  141. var itemRender = this.itemRender || $scopedSlots.itemRender || this.defaultItemRender;
  142. if (routes && routes.length > 0) {
  143. // generated by route
  144. crumbs = this.genForRoutes({
  145. routes: routes,
  146. params: params,
  147. separator: separator,
  148. itemRender: itemRender
  149. });
  150. } else if (children.length) {
  151. crumbs = children.map(function (element, index) {
  152. (0, _warning2['default'])((0, _propsUtil.getSlotOptions)(element).__ANT_BREADCRUMB_ITEM || (0, _propsUtil.getSlotOptions)(element).__ANT_BREADCRUMB_SEPARATOR, 'Breadcrumb', "Only accepts Breadcrumb.Item and Breadcrumb.Separator as it's children");
  153. return (0, _vnode.cloneElement)(element, {
  154. props: { separator: separator },
  155. key: index
  156. });
  157. });
  158. }
  159. return h(
  160. 'div',
  161. { 'class': prefixCls },
  162. [crumbs]
  163. );
  164. }
  165. };