UNPKG

ant-design-vue

Version:

An enterprise-class UI design language and Vue-based implementation

209 lines (186 loc) 8.72 kB
import { isVNode as _isVNode, createVNode as _createVNode } from "vue"; function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } import PropTypes, { withUndefined } from '../_util/vue-types'; import { getOptionProps, getComponent } from '../_util/props-util'; import BaseMixin from '../_util/BaseMixin'; import { defineComponent } from 'vue'; function _isSlot(s) { return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !_isVNode(s); } function isString(str) { return typeof str === 'string'; } function noop() {} export default defineComponent({ name: 'Step', mixins: [BaseMixin], props: { prefixCls: PropTypes.string, wrapperStyle: PropTypes.object, itemWidth: PropTypes.string, active: PropTypes.looseBool, disabled: PropTypes.looseBool, status: PropTypes.string, iconPrefix: PropTypes.string, icon: PropTypes.any, adjustMarginRight: PropTypes.string, stepNumber: PropTypes.string, stepIndex: PropTypes.number, description: PropTypes.any, title: PropTypes.any, subTitle: PropTypes.any, progressDot: withUndefined(PropTypes.oneOfType([PropTypes.looseBool, PropTypes.func])), tailContent: PropTypes.any, icons: PropTypes.shape({ finish: PropTypes.any, error: PropTypes.any }).loose, onClick: PropTypes.func, onStepClick: PropTypes.func }, methods: { onItemClick: function onItemClick() { for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { args[_key] = arguments[_key]; } this.__emit.apply(this, ['click'].concat(args)); this.__emit('stepClick', this.stepIndex); }, renderIconNode: function renderIconNode() { var _iconClassName; var _getOptionProps = getOptionProps(this), prefixCls = _getOptionProps.prefixCls, stepNumber = _getOptionProps.stepNumber, status = _getOptionProps.status, iconPrefix = _getOptionProps.iconPrefix, icons = _getOptionProps.icons, progressDot = _getOptionProps.progressDot; var icon = getComponent(this, 'icon'); var title = getComponent(this, 'title'); var description = getComponent(this, 'description'); var iconNode; var iconClassName = (_iconClassName = {}, _defineProperty(_iconClassName, "".concat(prefixCls, "-icon"), true), _defineProperty(_iconClassName, "".concat(iconPrefix, "icon"), true), _defineProperty(_iconClassName, "".concat(iconPrefix, "icon-").concat(icon), icon && isString(icon)), _defineProperty(_iconClassName, "".concat(iconPrefix, "icon-check"), !icon && status === 'finish' && icons && !icons.finish), _defineProperty(_iconClassName, "".concat(iconPrefix, "icon-close"), !icon && status === 'error' && icons && !icons.error), _iconClassName); var iconDot = _createVNode("span", { "class": "".concat(prefixCls, "-icon-dot") }, null); // `progressDot` enjoy the highest priority if (progressDot) { if (typeof progressDot === 'function') { iconNode = _createVNode("span", { "class": "".concat(prefixCls, "-icon") }, [progressDot({ index: stepNumber - 1, status: status, title: title, description: description, prefixCls: prefixCls })]); } else { iconNode = _createVNode("span", { "class": "".concat(prefixCls, "-icon") }, _isSlot(iconDot) ? iconDot : { default: function _default() { return [iconDot]; } }); } } else if (icon && !isString(icon)) { iconNode = _createVNode("span", { "class": "".concat(prefixCls, "-icon") }, _isSlot(icon) ? icon : { default: function _default() { return [icon]; } }); } else if (icons && icons.finish && status === 'finish') { iconNode = _createVNode("span", { "class": "".concat(prefixCls, "-icon") }, [icons.finish]); } else if (icons && icons.error && status === 'error') { iconNode = _createVNode("span", { "class": "".concat(prefixCls, "-icon") }, [icons.error]); } else if (icon || status === 'finish' || status === 'error') { iconNode = _createVNode("span", { "class": iconClassName }, null); } else { iconNode = _createVNode("span", { "class": "".concat(prefixCls, "-icon") }, _isSlot(stepNumber) ? stepNumber : { default: function _default() { return [stepNumber]; } }); } return iconNode; } }, render: function render() { var _classString; var _getOptionProps2 = getOptionProps(this), prefixCls = _getOptionProps2.prefixCls, itemWidth = _getOptionProps2.itemWidth, active = _getOptionProps2.active, _getOptionProps2$stat = _getOptionProps2.status, status = _getOptionProps2$stat === void 0 ? 'wait' : _getOptionProps2$stat, tailContent = _getOptionProps2.tailContent, adjustMarginRight = _getOptionProps2.adjustMarginRight, disabled = _getOptionProps2.disabled, onClick = _getOptionProps2.onClick, onStepClick = _getOptionProps2.onStepClick; var title = getComponent(this, 'title'); var subTitle = getComponent(this, 'subTitle'); var description = getComponent(this, 'description'); var classString = (_classString = {}, _defineProperty(_classString, "".concat(prefixCls, "-item"), true), _defineProperty(_classString, "".concat(prefixCls, "-item-").concat(status), true), _defineProperty(_classString, "".concat(prefixCls, "-item-custom"), getComponent(this, 'icon')), _defineProperty(_classString, "".concat(prefixCls, "-item-active"), active), _defineProperty(_classString, "".concat(prefixCls, "-item-disabled"), disabled === true), _classString); var stepProps = { class: classString }; var stepItemStyle = {}; if (itemWidth) { stepItemStyle.width = itemWidth; } if (adjustMarginRight) { stepItemStyle.marginRight = adjustMarginRight; } var accessibilityProps = { onClick: onClick || noop }; if (onStepClick && !disabled) { accessibilityProps.role = 'button'; accessibilityProps.tabindex = 0; accessibilityProps.onClick = this.onItemClick; } return _createVNode("div", _objectSpread(_objectSpread({}, stepProps), {}, { "style": stepItemStyle }), [_createVNode("div", _objectSpread(_objectSpread({}, accessibilityProps), {}, { "class": "".concat(prefixCls, "-item-container") }), [_createVNode("div", { "class": "".concat(prefixCls, "-item-tail") }, _isSlot(tailContent) ? tailContent : { default: function _default() { return [tailContent]; } }), _createVNode("div", { "class": "".concat(prefixCls, "-item-icon") }, [this.renderIconNode()]), _createVNode("div", { "class": "".concat(prefixCls, "-item-content") }, [_createVNode("div", { "class": "".concat(prefixCls, "-item-title") }, [title, subTitle && _createVNode("div", { "title": subTitle, "class": "".concat(prefixCls, "-item-subtitle") }, _isSlot(subTitle) ? subTitle : { default: function _default() { return [subTitle]; } })]), description && _createVNode("div", { "class": "".concat(prefixCls, "-item-description") }, _isSlot(description) ? description : { default: function _default() { return [description]; } })])])]); } });