tntd
Version:
tntd是基于 TNT Design 设计体系的 React UI 组件库，主要用于研发企业级中后台产品。
311 lines (309 loc) • 11.4 kB
JavaScript
;
function _typeof(o) {
"@babel/helpers - typeof";
return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
return typeof o;
} : function (o) {
return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
}, _typeof(o);
}
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = exports.PreviewText = void 0;
var _isFunction2 = _interopRequireDefault(require("lodash/isFunction"));
var _isNull2 = _interopRequireDefault(require("lodash/isNull"));
var _isArray2 = _interopRequireDefault(require("lodash/isArray"));
var _isUndefined2 = _interopRequireDefault(require("lodash/isUndefined"));
var _react = _interopRequireWildcard(require("react"));
var _tag = _interopRequireDefault(require("../tag"));
var _classnames = _interopRequireDefault(require("classnames"));
var _context = require("../tntd-form/context");
function _getRequireWildcardCache(e) {
if ("function" != typeof WeakMap) return null;
var r = new WeakMap(),
t = new WeakMap();
return (_getRequireWildcardCache = function _getRequireWildcardCache(e) {
return e ? t : r;
})(e);
}
function _interopRequireWildcard(e, r) {
if (!r && e && e.__esModule) return e;
if (null === e || "object" != _typeof(e) && "function" != typeof e) return {
"default": e
};
var t = _getRequireWildcardCache(r);
if (t && t.has(e)) return t.get(e);
var n = {
__proto__: null
},
a = Object.defineProperty && Object.getOwnPropertyDescriptor;
for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) {
var i = a ? Object.getOwnPropertyDescriptor(e, u) : null;
i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u];
}
return n["default"] = e, t && t.set(e, n), n;
}
function _interopRequireDefault(e) {
return e && e.__esModule ? e : {
"default": e
};
}
var prefixCls = 'tnt-preview-text';
var isValid = function isValid(value) {
return !(0, _isUndefined2["default"])(value) && !(0, _isNull2["default"])(value) && value !== '';
};
var usePlaceholder = function usePlaceholder(value) {
var _useContext = (0, _react.useContext)(_context.FormContext),
placeholder = _useContext.placeholder;
return isValid(value) ? value : placeholder;
};
var Input = function Input(props) {
return _react["default"].createElement("div", {
className: (0, _classnames["default"])([props.className]),
style: props.style
}, props.addonBefore, props.prefix, usePlaceholder(props.value), props.suffix, props.addonAfter);
};
var Select = function Select(_ref) {
var options = _ref.options,
mode = _ref.mode,
value = _ref.value,
labelInValue = _ref.labelInValue,
className = _ref.className,
style = _ref.style;
var dataSource = options || [];
var placeholder = usePlaceholder();
var isMultiple = ['multiple', 'tags'].includes(mode !== null && mode !== void 0 ? mode : '') || (0, _isArray2["default"])(value);
var getSelected = function getSelected() {
if (isMultiple) {
if (labelInValue) {
return (0, _isArray2["default"])(value) ? value : [];
} else {
return (0, _isArray2["default"])(value) ? value.map(function (val) {
return {
label: val,
value: val
};
}) : [];
}
} else {
if (labelInValue) {
return isValid(value) ? [value] : [];
} else {
return isValid(value) ? [{
label: value,
value: value
}] : [];
}
}
};
var getLabels = function getLabels() {
var selected = getSelected();
if (!selected.length) return placeholder;
return selected.map(function (_ref2, key) {
var label = _ref2.label,
value = _ref2.value;
var _a;
var text = ((_a = dataSource === null || dataSource === void 0 ? void 0 : dataSource.find(function (item) {
return item.value === value;
})) === null || _a === void 0 ? void 0 : _a.label) || label;
return isMultiple ? _react["default"].createElement(_tag["default"], {
key: key
}, text || placeholder) : text || placeholder;
});
};
return _react["default"].createElement("div", {
className: (0, _classnames["default"])([prefixCls, className]),
style: style
}, getLabels());
};
var TreeSelect = function TreeSelect(_ref3) {
var value = _ref3.value,
multiple = _ref3.multiple,
labelInValue = _ref3.labelInValue,
treeData = _ref3.treeData,
className = _ref3.className,
style = _ref3.style;
var placeholder = usePlaceholder();
var dataSource = treeData || [];
var getSelected = function getSelected() {
if (multiple) {
if (labelInValue) {
return (0, _isArray2["default"])(value) ? value : [];
} else {
return (0, _isArray2["default"])(value) ? value.map(function (val) {
return {
label: val,
value: val
};
}) : [];
}
} else {
if (labelInValue) {
return value ? [value] : [];
} else {
return value ? [{
label: value,
value: value
}] : [];
}
}
};
var _findLabel = function findLabel(value, dataSource) {
for (var i = 0; i < (dataSource === null || dataSource === void 0 ? void 0 : dataSource.length); i++) {
var item = dataSource[i];
if ((item === null || item === void 0 ? void 0 : item.value) === value || (item === null || item === void 0 ? void 0 : item.key) === value) {
return item === null || item === void 0 ? void 0 : item.title;
} else {
var childLabel = _findLabel(value, item === null || item === void 0 ? void 0 : item.children);
if (childLabel) return childLabel;
}
}
};
var getLabels = function getLabels() {
var selected = getSelected();
if (!(selected === null || selected === void 0 ? void 0 : selected.length)) return _react["default"].createElement(_tag["default"], null, placeholder);
return selected.map(function (_ref4, key) {
var value = _ref4.value,
label = _ref4.label;
return _react["default"].createElement(_react["default"].Fragment, null, multiple ? _react["default"].createElement(_tag["default"], {
key: key
}, _findLabel(value, dataSource) || label || placeholder) : _findLabel(value, dataSource) || label || placeholder);
});
};
return _react["default"].createElement("div", {
className: (0, _classnames["default"])([prefixCls, className]),
style: style
}, getLabels());
};
var Cascader = function Cascader(_ref5) {
var options = _ref5.options,
value = _ref5.value,
className = _ref5.className,
style = _ref5.style;
var placeholder = usePlaceholder();
var dataSource = options || [];
var getSelected = function getSelected() {
return (0, _isArray2["default"])(value) ? value : [];
};
var _findLabel2 = function findLabel(value, dataSource) {
for (var i = 0; i < (dataSource === null || dataSource === void 0 ? void 0 : dataSource.length); i++) {
var item = dataSource[i];
if ((item === null || item === void 0 ? void 0 : item.value) === value) {
return item === null || item === void 0 ? void 0 : item.label;
} else {
var childLabel = _findLabel2(value, item === null || item === void 0 ? void 0 : item.children);
if (childLabel) return childLabel;
}
}
};
var getLabels = function getLabels() {
var selected = getSelected();
if (!(selected === null || selected === void 0 ? void 0 : selected.length)) {
return placeholder;
}
return selected.map(function (value) {
return _findLabel2(value, dataSource) || placeholder;
}).join('/');
};
return _react["default"].createElement("div", {
className: (0, _classnames["default"])([prefixCls, className]),
style: style
}, getLabels());
};
var formatMomentValue = function formatMomentValue(value, format, placeholder) {
var formatDate = function formatDate(date, format) {
var i = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
if (!date) return placeholder;
if ((0, _isArray2["default"])(format)) {
var _format = format[i];
if ((0, _isFunction2["default"])(_format)) {
return _format(date);
}
return (date === null || date === void 0 ? void 0 : date.format) ? date.format(_format) : date;
} else {
if ((0, _isFunction2["default"])(format)) {
return format(date);
}
return (date === null || date === void 0 ? void 0 : date.format) ? date.format(format) : date;
}
};
if ((0, _isArray2["default"])(value)) {
return value.map(function (val, index) {
return formatDate(val, format, index);
});
} else {
return value ? formatDate(value, format) : value || placeholder;
}
};
var DatePicker = function DatePicker(_ref6) {
var value = _ref6.value,
format = _ref6.format,
showTime = _ref6.showTime,
placeholder = _ref6.placeholder,
className = _ref6.className;
var getLabels = function getLabels() {
var labels = formatMomentValue(value, format || "YYYY-MM-DD".concat(showTime ? ' HH:mm:ss' : ''), placeholder);
return (0, _isArray2["default"])(labels) ? labels.join('~') : labels;
};
return _react["default"].createElement("div", {
className: (0, _classnames["default"])([prefixCls, className])
}, getLabels());
};
var TimePicker = function TimePicker(_ref7) {
var value = _ref7.value,
format = _ref7.format,
placeholder = _ref7.placeholder,
className = _ref7.className,
style = _ref7.style;
var getLabels = function getLabels() {
var labels = formatMomentValue(value, format || 'HH:mm:ss', placeholder);
return (0, _isArray2["default"])(labels) ? labels.join('~') : labels;
};
return _react["default"].createElement("div", {
className: (0, _classnames["default"])(prefixCls, className),
style: style
}, getLabels());
};
var MonthPicker = function MonthPicker(_ref8) {
var value = _ref8.value,
format = _ref8.format,
placeholder = _ref8.placeholder,
className = _ref8.className,
style = _ref8.style;
var getLabels = function getLabels() {
var labels = formatMomentValue(value, format || 'YYYY-MM', placeholder);
return (0, _isArray2["default"])(labels) ? labels.join('~') : labels;
};
return _react["default"].createElement("div", {
className: (0, _classnames["default"])(prefixCls, className),
style: style
}, getLabels());
};
var WeekPicker = function WeekPicker(_ref9) {
var value = _ref9.value,
format = _ref9.format,
placeholder = _ref9.placeholder,
className = _ref9.className,
style = _ref9.style;
var getLabels = function getLabels() {
var labels = formatMomentValue(value, format || 'gggg-wo', placeholder);
return (0, _isArray2["default"])(labels) ? labels.join('~') : labels;
};
return _react["default"].createElement("div", {
className: (0, _classnames["default"])(prefixCls, className),
style: style
}, getLabels());
};
var PreviewText = exports.PreviewText = {
Input: Input,
Select: Select,
TreeSelect: TreeSelect,
Cascader: Cascader,
DatePicker: DatePicker,
TimePicker: TimePicker,
MonthPicker: MonthPicker,
WeekPicker: WeekPicker,
usePlaceholder: usePlaceholder
};
var _default = exports["default"] = PreviewText;