fastlion-amis
Version:
一种MIS页面生成工具
82 lines (81 loc) • 4.43 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.Progress = void 0;
var tslib_1 = require("tslib");
var react_1 = (0, tslib_1.__importDefault)(require("react"));
var rc_progress_1 = require("rc-progress");
var theme_1 = require("../theme");
var Progress = /** @class */ (function (_super) {
(0, tslib_1.__extends)(Progress, _super);
function Progress() {
return _super !== null && _super.apply(this, arguments) || this;
}
Progress.prototype.autoClassName = function (value) {
var map = this.props.map;
if (!map || !map.length) {
return '';
}
var index = Math.floor((value * map.length) / 100);
index = Math.max(0, Math.min(map.length - 1, index));
return map[index];
};
Progress.prototype.getLabel = function (prefixCls) {
var _a = this.props, value = _a.value, format = _a.format, showLabel = _a.showLabel, cx = _a.classnames;
if (!showLabel) {
return null;
}
var textFormatter = format || (function (value) { return value + "%"; });
var content = textFormatter(value);
return (react_1.default.createElement("span", { className: cx(prefixCls + "-text"), key: "value" }, content));
};
Progress.prototype.render = function () {
var _a, _b, _c, _d;
var _e = this.props, classNames = _e.classNames, progressClassName = _e.progressClassName, progressBarClassName = _e.progressBarClassName, type = _e.type, value = _e.value, placeholder = _e.placeholder, stripe = _e.stripe, animate = _e.animate, showLabel = _e.showLabel, gapDegree = _e.gapDegree, gapPosition = _e.gapPosition, strokeWidth = _e.strokeWidth, cx = _e.classnames;
var isLineType = type === 'line';
var prefixCls = isLineType ? 'Progress-line' : 'Progress-circle';
var viewValue = (react_1.default.createElement("span", { className: "text-muted" }, placeholder));
if (type === 'line') {
viewValue = [
react_1.default.createElement("div", { key: "progress", className: cx(prefixCls, progressClassName, (_a = {},
_a[prefixCls + "-no-label"] = !showLabel,
_a)) },
react_1.default.createElement("div", { className: cx(prefixCls + "-inter") },
react_1.default.createElement("div", { className: cx(prefixCls + "-bar", progressBarClassName || this.autoClassName(value), (_b = {}, _b[prefixCls + "-bar--stripe"] = stripe, _b), (_c = {}, _c[prefixCls + "-bar--animate"] = animate && !stripe, _c), (_d = {}, _d[prefixCls + "-bar--stripe-animate"] = animate && stripe, _d)), title: value + "%", style: {
width: value + "%"
} }))),
this.getLabel(prefixCls)
];
}
else if (type === 'circle' || type === 'dashboard') {
var circleWidth = strokeWidth || 6;
var gapPos = gapPosition || (type === 'dashboard' && 'bottom') || 'top';
var getGapDegree = function () {
if (gapDegree || gapDegree === 0) {
return gapDegree;
}
if (type === 'dashboard') {
return 75;
}
return undefined;
};
viewValue = [
react_1.default.createElement("div", { className: cx(prefixCls), key: "circle" },
react_1.default.createElement(rc_progress_1.Circle, { percent: value, strokeColor: "", strokeWidth: circleWidth, trailWidth: circleWidth, prefixCls: this.autoClassName(value), gapDegree: getGapDegree(), gapPosition: gapPos }),
this.getLabel(prefixCls))
];
}
return react_1.default.createElement("div", { className: cx('Progress', classNames) }, viewValue);
};
Progress.defaultProps = {
type: 'line',
placeholder: '-',
progressClassName: '',
progressBarClassName: '',
map: ['bg-danger', 'bg-warning', 'bg-info', 'bg-success', 'bg-success'],
showLabel: true
};
return Progress;
}(react_1.default.Component));
exports.Progress = Progress;
exports.default = (0, theme_1.themeable)(Progress);
//# sourceMappingURL=./components/Progress.js.map