circle.js 2.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. 'use strict';
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
  6. var _defineProperty3 = _interopRequireDefault(_defineProperty2);
  7. var _vcProgress = require('../vc-progress');
  8. var _utils = require('./utils');
  9. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
  10. var statusColorMap = {
  11. normal: '#108ee9',
  12. exception: '#ff5500',
  13. success: '#87d068'
  14. };
  15. function getPercentage(_ref) {
  16. var percent = _ref.percent,
  17. successPercent = _ref.successPercent;
  18. var ptg = (0, _utils.validProgress)(percent);
  19. if (!successPercent) return ptg;
  20. var successPtg = (0, _utils.validProgress)(successPercent);
  21. return [successPercent, (0, _utils.validProgress)(ptg - successPtg)];
  22. }
  23. function getStrokeColor(_ref2) {
  24. var progressStatus = _ref2.progressStatus,
  25. successPercent = _ref2.successPercent,
  26. strokeColor = _ref2.strokeColor;
  27. var color = strokeColor || statusColorMap[progressStatus];
  28. if (!successPercent) return color;
  29. return [statusColorMap.success, color];
  30. }
  31. var Circle = {
  32. functional: true,
  33. render: function render(h, context) {
  34. var _wrapperClassName;
  35. var props = context.props,
  36. children = context.children;
  37. var prefixCls = props.prefixCls,
  38. width = props.width,
  39. strokeWidth = props.strokeWidth,
  40. trailColor = props.trailColor,
  41. strokeLinecap = props.strokeLinecap,
  42. gapPosition = props.gapPosition,
  43. gapDegree = props.gapDegree,
  44. type = props.type;
  45. var circleSize = width || 120;
  46. var circleStyle = {
  47. width: typeof circleSize === 'number' ? circleSize + 'px' : circleSize,
  48. height: typeof circleSize === 'number' ? circleSize + 'px' : circleSize,
  49. fontSize: circleSize * 0.15 + 6
  50. };
  51. var circleWidth = strokeWidth || 6;
  52. var gapPos = gapPosition || type === 'dashboard' && 'bottom' || 'top';
  53. var gapDeg = gapDegree || type === 'dashboard' && 75;
  54. var strokeColor = getStrokeColor(props);
  55. var isGradient = Object.prototype.toString.call(strokeColor) === '[object Object]';
  56. var wrapperClassName = (_wrapperClassName = {}, (0, _defineProperty3['default'])(_wrapperClassName, prefixCls + '-inner', true), (0, _defineProperty3['default'])(_wrapperClassName, prefixCls + '-circle-gradient', isGradient), _wrapperClassName);
  57. return h(
  58. 'div',
  59. { 'class': wrapperClassName, style: circleStyle },
  60. [h(_vcProgress.Circle, {
  61. attrs: {
  62. percent: getPercentage(props),
  63. strokeWidth: circleWidth,
  64. trailWidth: circleWidth,
  65. strokeColor: strokeColor,
  66. strokeLinecap: strokeLinecap,
  67. trailColor: trailColor,
  68. prefixCls: prefixCls,
  69. gapDegree: gapDeg,
  70. gapPosition: gapPos
  71. }
  72. }), children]
  73. );
  74. }
  75. };
  76. exports['default'] = Circle;