zent
Version:
一套前端设计语言和基于React的实现
47 lines (46 loc) • 2.38 kB
JavaScript
import { __assign, __extends } from "tslib";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Component, createRef } from 'react';
import cx from 'classnames';
var Star = (function (_super) {
__extends(Star, _super);
function Star() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.elRef = createRef();
_this.onHover = function (e) {
var _a = _this.props, onHover = _a.onHover, index = _a.index;
onHover(e, index);
};
_this.onClick = function (e) {
var _a = _this.props, onClick = _a.onClick, index = _a.index;
onClick(e, index);
};
_this.getFloatValue = function () {
var value = _this.props.value;
return (value * 100) % 100 + "%";
};
return _this;
}
Star.prototype.getClassName = function () {
var _a = this.props, index = _a.index, value = _a.value, allowHalf = _a.allowHalf, readOnly = _a.readOnly;
var starValue = index + 1;
var isFull = starValue <= value;
var isZero = starValue > Math.ceil(value);
var isHalf = allowHalf && value + 0.5 === starValue;
var isPart = readOnly && starValue > value && starValue === Math.ceil(value);
return cx('zent-rate-star', {
'zent-rate-star-full': isFull,
'zent-rate-star-zero': isZero,
'zent-rate-star-half': isHalf,
'zent-rate-star-part': isPart,
});
};
Star.prototype.render = function () {
var _a = this, onHover = _a.onHover, onClick = _a.onClick;
var _b = this.props, disabled = _b.disabled, character = _b.character, readOnly = _b.readOnly;
var disableEdit = disabled || readOnly;
return (_jsxs("li", __assign({ ref: this.elRef, className: this.getClassName(), onClick: disableEdit ? undefined : onClick, onMouseMove: disableEdit ? undefined : onHover, "data-zv": '10.0.17' }, { children: [_jsx("div", __assign({ className: "zent-rate-star-first", style: readOnly ? { width: this.getFloatValue() } : undefined, "data-zv": '10.0.17' }, { children: character }), void 0), _jsx("div", __assign({ className: "zent-rate-star-second", "data-zv": '10.0.17' }, { children: character }), void 0)] }), void 0));
};
return Star;
}(Component));
export default Star;