progress.js 6.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. Object.defineProperty(exports, "__esModule", {
  4. value: true
  5. });
  6. exports.default = void 0;
  7. var _vue = require("vue");
  8. var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
  9. var _initDefaultProps = _interopRequireDefault(require("../_util/props-util/initDefaultProps"));
  10. var _CloseOutlined = _interopRequireDefault(require("@ant-design/icons-vue/lib/icons/CloseOutlined"));
  11. var _CheckOutlined = _interopRequireDefault(require("@ant-design/icons-vue/lib/icons/CheckOutlined"));
  12. var _CheckCircleFilled = _interopRequireDefault(require("@ant-design/icons-vue/lib/icons/CheckCircleFilled"));
  13. var _CloseCircleFilled = _interopRequireDefault(require("@ant-design/icons-vue/lib/icons/CloseCircleFilled"));
  14. var _Line = _interopRequireDefault(require("./Line"));
  15. var _Circle = _interopRequireDefault(require("./Circle"));
  16. var _Steps = _interopRequireDefault(require("./Steps"));
  17. var _utils = require("./utils");
  18. var _useConfigInject = _interopRequireDefault(require("../config-provider/hooks/useConfigInject"));
  19. var _devWarning = _interopRequireDefault(require("../vc-util/devWarning"));
  20. var _props = require("./props");
  21. var _style = _interopRequireDefault(require("./style"));
  22. var __rest = void 0 && (void 0).__rest || function (s, e) {
  23. var t = {};
  24. for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  25. if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
  26. if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  27. }
  28. return t;
  29. };
  30. var _default = exports.default = (0, _vue.defineComponent)({
  31. compatConfig: {
  32. MODE: 3
  33. },
  34. name: 'AProgress',
  35. inheritAttrs: false,
  36. props: (0, _initDefaultProps.default)((0, _props.progressProps)(), {
  37. type: 'line',
  38. percent: 0,
  39. showInfo: true,
  40. // null for different theme definition
  41. trailColor: null,
  42. size: 'default',
  43. strokeLinecap: 'round'
  44. }),
  45. slots: Object,
  46. setup(props, _ref) {
  47. let {
  48. slots,
  49. attrs
  50. } = _ref;
  51. const {
  52. prefixCls,
  53. direction
  54. } = (0, _useConfigInject.default)('progress', props);
  55. const [wrapSSR, hashId] = (0, _style.default)(prefixCls);
  56. if (process.env.NODE_ENV !== 'production') {
  57. (0, _devWarning.default)('successPercent' in props, 'Progress', '`successPercent` is deprecated. Please use `success.percent` instead.');
  58. (0, _devWarning.default)('width' in props, 'Progress', '`width` is deprecated. Please use `size` instead.');
  59. }
  60. const strokeColorNotArray = (0, _vue.computed)(() => Array.isArray(props.strokeColor) ? props.strokeColor[0] : props.strokeColor);
  61. const percentNumber = (0, _vue.computed)(() => {
  62. const {
  63. percent = 0
  64. } = props;
  65. const successPercent = (0, _utils.getSuccessPercent)(props);
  66. return parseInt(successPercent !== undefined ? successPercent.toString() : percent.toString(), 10);
  67. });
  68. const progressStatus = (0, _vue.computed)(() => {
  69. const {
  70. status
  71. } = props;
  72. if (!_props.progressStatuses.includes(status) && percentNumber.value >= 100) {
  73. return 'success';
  74. }
  75. return status || 'normal';
  76. });
  77. const classString = (0, _vue.computed)(() => {
  78. const {
  79. type,
  80. showInfo,
  81. size
  82. } = props;
  83. const pre = prefixCls.value;
  84. return {
  85. [pre]: true,
  86. [`${pre}-inline-circle`]: type === 'circle' && (0, _utils.getSize)(size, 'circle').width <= 20,
  87. [`${pre}-${type === 'dashboard' && 'circle' || type}`]: true,
  88. [`${pre}-status-${progressStatus.value}`]: true,
  89. [`${pre}-show-info`]: showInfo,
  90. [`${pre}-${size}`]: size,
  91. [`${pre}-rtl`]: direction.value === 'rtl',
  92. [hashId.value]: true
  93. };
  94. });
  95. const strokeColorNotGradient = (0, _vue.computed)(() => typeof props.strokeColor === 'string' || Array.isArray(props.strokeColor) ? props.strokeColor : undefined);
  96. const renderProcessInfo = () => {
  97. const {
  98. showInfo,
  99. format,
  100. type,
  101. percent,
  102. title
  103. } = props;
  104. const successPercent = (0, _utils.getSuccessPercent)(props);
  105. if (!showInfo) return null;
  106. let text;
  107. const textFormatter = format || (slots === null || slots === void 0 ? void 0 : slots.format) || (val => `${val}%`);
  108. const isLineType = type === 'line';
  109. if (format || (slots === null || slots === void 0 ? void 0 : slots.format) || progressStatus.value !== 'exception' && progressStatus.value !== 'success') {
  110. text = textFormatter((0, _utils.validProgress)(percent), (0, _utils.validProgress)(successPercent));
  111. } else if (progressStatus.value === 'exception') {
  112. text = isLineType ? (0, _vue.createVNode)(_CloseCircleFilled.default, null, null) : (0, _vue.createVNode)(_CloseOutlined.default, null, null);
  113. } else if (progressStatus.value === 'success') {
  114. text = isLineType ? (0, _vue.createVNode)(_CheckCircleFilled.default, null, null) : (0, _vue.createVNode)(_CheckOutlined.default, null, null);
  115. }
  116. return (0, _vue.createVNode)("span", {
  117. "class": `${prefixCls.value}-text`,
  118. "title": title === undefined && typeof text === 'string' ? text : undefined
  119. }, [text]);
  120. };
  121. return () => {
  122. const {
  123. type,
  124. steps,
  125. title
  126. } = props;
  127. const {
  128. class: cls
  129. } = attrs,
  130. restAttrs = __rest(attrs, ["class"]);
  131. const progressInfo = renderProcessInfo();
  132. let progress;
  133. // Render progress shape
  134. if (type === 'line') {
  135. progress = steps ? (0, _vue.createVNode)(_Steps.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
  136. "strokeColor": strokeColorNotGradient.value,
  137. "prefixCls": prefixCls.value,
  138. "steps": steps
  139. }), {
  140. default: () => [progressInfo]
  141. }) : (0, _vue.createVNode)(_Line.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
  142. "strokeColor": strokeColorNotArray.value,
  143. "prefixCls": prefixCls.value,
  144. "direction": direction.value
  145. }), {
  146. default: () => [progressInfo]
  147. });
  148. } else if (type === 'circle' || type === 'dashboard') {
  149. progress = (0, _vue.createVNode)(_Circle.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
  150. "prefixCls": prefixCls.value,
  151. "strokeColor": strokeColorNotArray.value,
  152. "progressStatus": progressStatus.value
  153. }), {
  154. default: () => [progressInfo]
  155. });
  156. }
  157. return wrapSSR((0, _vue.createVNode)("div", (0, _objectSpread2.default)((0, _objectSpread2.default)({
  158. "role": "progressbar"
  159. }, restAttrs), {}, {
  160. "class": [classString.value, cls],
  161. "title": title
  162. }), [progress]));
  163. };
  164. }
  165. });