index.js 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149
  1. import _extends from "@babel/runtime/helpers/esm/extends";
  2. import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
  3. import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
  4. import { resolveDirective as _resolveDirective, createVNode as _createVNode } from "vue";
  5. import { computed, defineComponent } from 'vue';
  6. import CloseOutlined from "@ant-design/icons-vue/es/icons/CloseOutlined";
  7. import CheckOutlined from "@ant-design/icons-vue/es/icons/CheckOutlined";
  8. import PropTypes from '../_util/vue-types';
  9. import initDefaultProps from '../_util/props-util/initDefaultProps';
  10. import VcSteps, { Step as VcStep } from '../vc-steps';
  11. import useConfigInject from '../_util/hooks/useConfigInject';
  12. import useBreakpoint from '../_util/hooks/useBreakpoint';
  13. import classNames from '../_util/classNames';
  14. import Progress from '../progress';
  15. import omit from '../_util/omit';
  16. import { VcStepProps } from '../vc-steps/Step';
  17. export var stepsProps = function stepsProps() {
  18. return {
  19. prefixCls: String,
  20. iconPrefix: String,
  21. current: Number,
  22. initial: Number,
  23. percent: Number,
  24. responsive: {
  25. type: Boolean,
  26. default: undefined
  27. },
  28. labelPlacement: String,
  29. status: String,
  30. size: String,
  31. direction: String,
  32. progressDot: {
  33. type: [Boolean, Function],
  34. default: undefined
  35. },
  36. type: String,
  37. onChange: Function,
  38. 'onUpdate:current': Function
  39. };
  40. };
  41. export var stepProps = function stepProps() {
  42. return {
  43. description: PropTypes.any,
  44. icon: PropTypes.any,
  45. status: String,
  46. disabled: {
  47. type: Boolean,
  48. default: undefined
  49. },
  50. title: PropTypes.any,
  51. subTitle: PropTypes.any,
  52. onClick: Function
  53. };
  54. };
  55. var Steps = defineComponent({
  56. compatConfig: {
  57. MODE: 3
  58. },
  59. name: 'ASteps',
  60. inheritAttrs: false,
  61. props: initDefaultProps(stepsProps(), {
  62. current: 0,
  63. responsive: true,
  64. labelPlacement: 'horizontal'
  65. }),
  66. slots: ['progressDot'],
  67. // emits: ['update:current', 'change'],
  68. setup: function setup(props, _ref) {
  69. var attrs = _ref.attrs,
  70. slots = _ref.slots,
  71. emit = _ref.emit;
  72. var _useConfigInject = useConfigInject('steps', props),
  73. prefixCls = _useConfigInject.prefixCls,
  74. rtlDirection = _useConfigInject.direction,
  75. configProvider = _useConfigInject.configProvider;
  76. var screens = useBreakpoint();
  77. var direction = computed(function () {
  78. return props.responsive && screens.value.xs ? 'vertical' : props.direction;
  79. });
  80. var iconPrefix = computed(function () {
  81. return configProvider.getPrefixCls('', props.iconPrefix);
  82. });
  83. var handleChange = function handleChange(current) {
  84. emit('update:current', current);
  85. emit('change', current);
  86. };
  87. var stepIconRender = function stepIconRender(_ref2) {
  88. var node = _ref2.node,
  89. status = _ref2.status;
  90. if (status === 'process' && props.percent !== undefined) {
  91. // currently it's hard-coded, since we can't easily read the actually width of icon
  92. var progressWidth = props.size === 'small' ? 32 : 40;
  93. var iconWithProgress = _createVNode("div", {
  94. "class": "".concat(prefixCls, "-progress-icon")
  95. }, [_createVNode(Progress, {
  96. "type": "circle",
  97. "percent": props.percent,
  98. "width": progressWidth,
  99. "strokeWidth": 4,
  100. "format": function format() {
  101. return null;
  102. }
  103. }, null), node]);
  104. return iconWithProgress;
  105. }
  106. return node;
  107. };
  108. return function () {
  109. var _classNames;
  110. var stepsClassName = classNames((_classNames = {}, _defineProperty(_classNames, "".concat(prefixCls.value, "-rtl"), rtlDirection.value === 'rtl'), _defineProperty(_classNames, "".concat(prefixCls.value, "-with-progress"), props.percent !== undefined), _classNames), attrs.class);
  111. var icons = {
  112. finish: _createVNode(CheckOutlined, {
  113. "class": "".concat(prefixCls, "-finish-icon")
  114. }, null),
  115. error: _createVNode(CloseOutlined, {
  116. "class": "".concat(prefixCls, "-error-icon")
  117. }, null)
  118. };
  119. return _createVNode(VcSteps, _objectSpread(_objectSpread({
  120. "icons": icons
  121. }, omit(props, ['percent', 'responsive'])), {}, {
  122. "direction": direction.value,
  123. "prefixCls": prefixCls.value,
  124. "iconPrefix": iconPrefix.value,
  125. "class": stepsClassName,
  126. "onChange": handleChange
  127. }), _objectSpread(_objectSpread({}, slots), {}, {
  128. stepIcon: stepIconRender
  129. }));
  130. };
  131. }
  132. });
  133. /* istanbul ignore next */
  134. export var Step = defineComponent(_objectSpread(_objectSpread({
  135. compatConfig: {
  136. MODE: 3
  137. }
  138. }, VcStep), {}, {
  139. name: 'AStep',
  140. props: VcStepProps()
  141. }));
  142. export default _extends(Steps, {
  143. Step: Step,
  144. install: function install(app) {
  145. app.component(Steps.name, Steps);
  146. app.component(Step.name, Step);
  147. return app;
  148. }
  149. });