fastlion-amis
Version:
一种MIS页面生成工具
105 lines (104 loc) • 5.24 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.LionTplRenderer = exports.LionTpl = void 0;
var tslib_1 = require("tslib");
var react_1 = (0, tslib_1.__importDefault)(require("react"));
var factory_1 = require("../../../../factory");
var tpl_1 = require("../../../../utils/tpl");
var helper_1 = require("../../../../utils/helper");
var tpl_builtin_1 = require("../../../../utils/tpl-builtin");
var styled_components_1 = (0, tslib_1.__importDefault)(require("styled-components"));
var Wrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n .testTpl{\n box-sizing: border-box;\n border:0;\n margin-top:5px;\n color: #333;\n -webkit-font-smoothing: antialiased;\n .testTpl-item{\n display: flex;\n align-items: center;\n justify-content: flex-end;\n padding: 0 20px;\n font-weight: 700;\n span{\n margin-left: 20px;\n margin-right: 0px;\n }\n }\n }\n\n"], ["\n .testTpl{\n box-sizing: border-box;\n border:0;\n margin-top:5px;\n color: #333;\n -webkit-font-smoothing: antialiased;\n .testTpl-item{\n display: flex;\n align-items: center;\n justify-content: flex-end;\n padding: 0 20px;\n font-weight: 700;\n span{\n margin-left: 20px;\n margin-right: 0px;\n }\n }\n }\n\n"
/**
* tpl 渲染器
*/
])));
var LionTpl = /** @class */ (function (_super) {
(0, tslib_1.__extends)(LionTpl, _super);
function LionTpl(props) {
var _this = _super.call(this, props) || this;
_this.htmlRef = _this.htmlRef.bind(_this);
return _this;
}
LionTpl.prototype.componentDidUpdate = function (prevProps) {
var _this = this;
if ((0, helper_1.anyChanged)(['data', 'tpl', 'html', 'text', 'raw', 'value'], this.props, prevProps)) {
(0, helper_1.functionInOneFrame)(function () {
_this._render();
});
}
};
LionTpl.prototype.componentWillUnmount = function () {
this.dom = null;
};
LionTpl.prototype.htmlRef = function (dom) {
this.dom = dom;
// if (offset(dom?.parentElement)) {
// this.props?.updateAutoFillHeight?.()
// }
this._render();
};
LionTpl.prototype.getContent = function () {
var _a = this.props, tpl = _a.tpl, html = _a.html, text = _a.text, raw = _a.raw, data = _a.data, placeholder = _a.placeholder;
var value = (0, helper_1.getPropValue)(this.props);
if (raw) {
return raw;
}
else if (html) {
return (0, tpl_1.filter)(html, data);
}
else if (tpl) {
return (0, tpl_1.filter)(tpl, data);
}
else if (text) {
return (0, tpl_builtin_1.escapeHtml)((0, tpl_1.filter)(text, data));
}
else {
return value == null || value === ''
? "<span class=\"text-muted\">" + placeholder + "</span>"
: typeof value === 'string'
? value
: JSON.stringify(value);
}
};
LionTpl.prototype._render = function () {
if (!this.dom) {
return;
}
var _html = '';
this.getContent().split(',').map(function (item) {
_html += "<span>" + item + "</span>";
});
this.dom.firstChild.innerHTML = this.props.collect ? _html : this.getContent();
};
LionTpl.prototype.render = function () {
var _a = this.props, className = _a.className, wrapperComponent = _a.wrapperComponent, inline = _a.inline, cx = _a.classnames, style = _a.style, collect = _a.collect;
var Component = collect ? (wrapperComponent || 'div') : wrapperComponent || (inline ? 'span' : 'div');
return (react_1.default.createElement(Wrapper, null,
react_1.default.createElement(Component, { ref: this.htmlRef, className: cx('TplField', collect ? 'testTpl' : '', className), style: style }, collect ? react_1.default.createElement("div", { className: 'testTpl-item' }, this.getContent().split(',').map(function (item) {
return react_1.default.createElement("span", null, item);
})) : react_1.default.createElement("span", null, this.getContent()))));
};
LionTpl.defaultProps = {
inline: true,
placeholder: ''
};
return LionTpl;
}(react_1.default.Component));
exports.LionTpl = LionTpl;
var LionTplRenderer = /** @class */ (function (_super) {
(0, tslib_1.__extends)(LionTplRenderer, _super);
function LionTplRenderer() {
return _super !== null && _super.apply(this, arguments) || this;
}
LionTplRenderer = (0, tslib_1.__decorate)([
(0, factory_1.Renderer)({
test: /(^|\/)(?:lion-tpl|lion-html)$/,
name: 'lion-tpl'
})
], LionTplRenderer);
return LionTplRenderer;
}(LionTpl));
exports.LionTplRenderer = LionTplRenderer;
var templateObject_1;
//# sourceMappingURL=./renderers/Lion/components/LionTpl/LionTpl.js.map