Progress.js 2.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. var __defProp = Object.defineProperty;
  2. var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
  3. var __getOwnPropNames = Object.getOwnPropertyNames;
  4. var __hasOwnProp = Object.prototype.hasOwnProperty;
  5. var __export = (target, all) => {
  6. for (var name2 in all)
  7. __defProp(target, name2, { get: all[name2], enumerable: true });
  8. };
  9. var __copyProps = (to, from, except, desc) => {
  10. if (from && typeof from === "object" || typeof from === "function") {
  11. for (let key of __getOwnPropNames(from))
  12. if (!__hasOwnProp.call(to, key) && key !== except)
  13. __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  14. }
  15. return to;
  16. };
  17. var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
  18. var stdin_exports = {};
  19. __export(stdin_exports, {
  20. default: () => stdin_default
  21. });
  22. module.exports = __toCommonJS(stdin_exports);
  23. var import_vue = require("vue");
  24. var import_vue2 = require("vue");
  25. var import_utils = require("../utils");
  26. const [name, bem] = (0, import_utils.createNamespace)("progress");
  27. const progressProps = {
  28. color: String,
  29. inactive: Boolean,
  30. pivotText: String,
  31. textColor: String,
  32. showPivot: import_utils.truthProp,
  33. pivotColor: String,
  34. trackColor: String,
  35. strokeWidth: import_utils.numericProp,
  36. percentage: {
  37. type: import_utils.numericProp,
  38. default: 0,
  39. validator: (value) => value >= 0 && value <= 100
  40. }
  41. };
  42. var stdin_default = (0, import_vue2.defineComponent)({
  43. name,
  44. props: progressProps,
  45. setup(props) {
  46. const background = (0, import_vue2.computed)(() => props.inactive ? void 0 : props.color);
  47. const renderPivot = () => {
  48. const {
  49. textColor,
  50. pivotText,
  51. pivotColor,
  52. percentage
  53. } = props;
  54. const text = pivotText != null ? pivotText : `${percentage}%`;
  55. if (props.showPivot && text) {
  56. const style = {
  57. color: textColor,
  58. left: `${+percentage}%`,
  59. transform: `translate(-${+percentage}%,-50%)`,
  60. background: pivotColor || background.value
  61. };
  62. return (0, import_vue.createVNode)("span", {
  63. "style": style,
  64. "class": bem("pivot", {
  65. inactive: props.inactive
  66. })
  67. }, [text]);
  68. }
  69. };
  70. return () => {
  71. const {
  72. trackColor,
  73. percentage,
  74. strokeWidth
  75. } = props;
  76. const rootStyle = {
  77. background: trackColor,
  78. height: (0, import_utils.addUnit)(strokeWidth)
  79. };
  80. const portionStyle = {
  81. width: `${percentage}%`,
  82. background: background.value
  83. };
  84. return (0, import_vue.createVNode)("div", {
  85. "class": bem(),
  86. "style": rootStyle
  87. }, [(0, import_vue.createVNode)("span", {
  88. "class": bem("portion", {
  89. inactive: props.inactive
  90. }),
  91. "style": portionStyle
  92. }, null), renderPivot()]);
  93. };
  94. }
  95. });