fastlion-amis/lib/renderers/Tpl.js

一种MIS页面生成工具

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.TplRenderer = exports.Tpl = 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 Badge_1 = require("../components/Badge");
var icons_1 = require("../components/icons");
var popover_1 = (0, tslib_1.__importDefault)(require("antd/lib/popover"));
var Tpl = /** @class */ (function (_super) {
    (0, tslib_1.__extends)(Tpl, _super);
    function Tpl(props) {
        var _this = _super.call(this, props) || this;
        _this.htmlRef = _this.htmlRef.bind(_this);
        _this.htmlPopovers = _this.htmlPopovers.bind(_this);
        _this.state = {
            contents: ''
        };
        return _this;
    }
    Tpl.prototype.componentDidUpdate = function (prevProps) {
        if ((0, helper_1.anyChanged)(['data', 'tpl', 'html', 'text', 'raw', 'value'], this.props, prevProps)) {
            this._render();
            this._poprender();
        }
    };
    Tpl.prototype.htmlRef = function (dom) {
        this.dom = dom;
        this._render();
    };
    Tpl.prototype.htmlPopovers = function (pop) {
        this.pop = pop;
        this._poprender();
    };
    Tpl.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);
        }
    };
    Tpl.prototype._render = function () {
        if (!this.dom) {
            return;
        }
        this.dom.firstChild.innerHTML = this.props.env.filterHtml(this.getContent());
        if (this.props.defaultOpen) {
            this.dom.style.height = '16px';
        }
    };
    Tpl.prototype._poprender = function () {
        if (!this.pop) {
            return;
        }
        this.pop.innerHTML = this.props.env.filterHtml(this.getContent());
    };
    Tpl.prototype.tplPopover = function () {
        var cx = this.props.classnames;
        return (react_1.default.createElement("span", { ref: this.htmlPopovers, className: cx('TplPopover') }));
    };
    Tpl.prototype.tplrender = function () {
        var _a;
        var _b = this.props, className = _b.className, wrapperComponent = _b.wrapperComponent, inline = _b.inline, cx = _b.classnames, style = _b.style, defaultOpen = _b.defaultOpen;
        var Component = wrapperComponent || (inline ? 'span' : 'div');
        var value = this.getContent();
        return react_1.default.createElement(Component, { ref: this.htmlRef, className: cx('TplField', defaultOpen && 'TplOpen', className), style: (0, tslib_1.__assign)({}, style) },
            react_1.default.createElement("span", { title: !defaultOpen ? (value.includes('</font>') ? (_a = value.split('</font>')) === null || _a === void 0 ? void 0 : _a[1] : (value.includes('</') ? this.props.value : value)) : "" }, value));
    };
    Tpl.prototype.render = function () {
        var _a = this.props, cx = _a.classnames, defaultOpen = _a.defaultOpen, popOverContainer = _a.popOverContainer;
        var placement = !(0, helper_1.isMobile)() ? 'rightTop' : 'bottomRight';
        return (defaultOpen ?
            react_1.default.createElement("div", { className: cx('Tpltab') },
                this.tplrender(),
                react_1.default.createElement(popover_1.default, { content: this.tplPopover(), trigger: 'click', overlayClassName: cx('TplPop'), getPopupContainer: popOverContainer, autoAdjustOverflow: true, placement: placement },
                    react_1.default.createElement(icons_1.Icon, { icon: "provincial", className: [cx('TplSaving'), 'icon'] })))
            : this.tplrender());
    };
    Tpl.defaultProps = {
        inline: true,
        placeholder: ''
    };
    return Tpl;
}(react_1.default.Component));
exports.Tpl = Tpl;
var TplRenderer = /** @class */ (function (_super) {
    (0, tslib_1.__extends)(TplRenderer, _super);
    function TplRenderer() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    TplRenderer = (0, tslib_1.__decorate)([
        (0, factory_1.Renderer)({
            test: /(^|\/)(?:tpl|html)$/,
            name: 'tpl'
        })
        // @ts-ignore 类型没搞定
        ,
        Badge_1.withBadge
    ], TplRenderer);
    return TplRenderer;
}(Tpl));
exports.TplRenderer = TplRenderer;
//# sourceMappingURL=./renderers/Tpl.js.map