Circle.js 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  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 _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
  9. var _colors = require("@ant-design/colors");
  10. var _vcProgress = require("../vc-progress");
  11. var _utils = require("./utils");
  12. var _props = require("./props");
  13. function getPercentage(_ref) {
  14. var percent = _ref.percent,
  15. success = _ref.success,
  16. successPercent = _ref.successPercent;
  17. var realSuccessPercent = (0, _utils.validProgress)((0, _utils.getSuccessPercent)({
  18. success: success,
  19. successPercent: successPercent
  20. }));
  21. return [realSuccessPercent, (0, _utils.validProgress)((0, _utils.validProgress)(percent) - realSuccessPercent)];
  22. }
  23. function getStrokeColor(_ref2) {
  24. var _ref2$success = _ref2.success,
  25. success = _ref2$success === void 0 ? {} : _ref2$success,
  26. strokeColor = _ref2.strokeColor;
  27. var successColor = success.strokeColor;
  28. return [successColor || _colors.presetPrimaryColors.green, strokeColor || null];
  29. }
  30. var _default = (0, _vue.defineComponent)({
  31. compatConfig: {
  32. MODE: 3
  33. },
  34. name: 'Circle',
  35. inheritAttrs: false,
  36. props: (0, _props.progressProps)(),
  37. setup: function setup(props, _ref3) {
  38. var slots = _ref3.slots;
  39. var gapDeg = (0, _vue.computed)(function () {
  40. // Support gapDeg = 0 when type = 'dashboard'
  41. if (props.gapDegree || props.gapDegree === 0) {
  42. return props.gapDegree;
  43. }
  44. if (props.type === 'dashboard') {
  45. return 75;
  46. }
  47. return undefined;
  48. });
  49. var circleStyle = (0, _vue.computed)(function () {
  50. var circleSize = props.width || 120;
  51. return {
  52. width: typeof circleSize === 'number' ? "".concat(circleSize, "px") : circleSize,
  53. height: typeof circleSize === 'number' ? "".concat(circleSize, "px") : circleSize,
  54. fontSize: "".concat(circleSize * 0.15 + 6, "px")
  55. };
  56. });
  57. var circleWidth = (0, _vue.computed)(function () {
  58. return props.strokeWidth || 6;
  59. });
  60. var gapPos = (0, _vue.computed)(function () {
  61. return props.gapPosition || props.type === 'dashboard' && 'bottom' || 'top';
  62. });
  63. // using className to style stroke color
  64. var percent = (0, _vue.computed)(function () {
  65. return getPercentage(props);
  66. });
  67. var isGradient = (0, _vue.computed)(function () {
  68. return Object.prototype.toString.call(props.strokeColor) === '[object Object]';
  69. });
  70. var strokeColor = (0, _vue.computed)(function () {
  71. return getStrokeColor({
  72. success: props.success,
  73. strokeColor: props.strokeColor
  74. });
  75. });
  76. var wrapperClassName = (0, _vue.computed)(function () {
  77. var _ref4;
  78. return _ref4 = {}, (0, _defineProperty2.default)(_ref4, "".concat(props.prefixCls, "-inner"), true), (0, _defineProperty2.default)(_ref4, "".concat(props.prefixCls, "-circle-gradient"), isGradient.value), _ref4;
  79. });
  80. return function () {
  81. var _slots$default;
  82. return (0, _vue.createVNode)("div", {
  83. "class": wrapperClassName.value,
  84. "style": circleStyle.value
  85. }, [(0, _vue.createVNode)(_vcProgress.Circle, {
  86. "percent": percent.value,
  87. "strokeWidth": circleWidth.value,
  88. "trailWidth": circleWidth.value,
  89. "strokeColor": strokeColor.value,
  90. "strokeLinecap": props.strokeLinecap,
  91. "trailColor": props.trailColor,
  92. "prefixCls": props.prefixCls,
  93. "gapDegree": gapDeg.value,
  94. "gapPosition": gapPos.value
  95. }, null), (_slots$default = slots.default) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots)]);
  96. };
  97. }
  98. });
  99. exports.default = _default;