fastlion-amis
Version:
一种MIS页面生成工具
120 lines (119 loc) • 8.47 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.PlainRenderer = exports.Plain = void 0;
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importDefault(require("react"));
var factory_1 = require("../factory");
var tpl_1 = require("../utils/tpl");
var helper_1 = require("../utils/helper");
var icons_1 = require("../components/icons");
var antd_1 = require("antd");
var lodash_1 = require("lodash");
var setting_1 = require("../utils/setting");
var Plain = /** @class */ (function (_super) {
tslib_1.__extends(Plain, _super);
function Plain() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.state = {
visible: false,
openHtml: false,
};
// 数据格式化
_this.formatter = function (value) {
var _a = _this.props, kilobitSeparator = _a.kilobitSeparator, $schema = _a.$schema;
// 增加千分分隔
if (kilobitSeparator) {
value = (value + '').replaceAll(',', '');
value = value.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
}
return ($schema.prefix ? $schema.prefix : '') + value + ($schema.suffix ? $schema.suffix : '');
};
return _this;
}
Plain.prototype.htmlPopovers = function (pop) {
this.pop = pop;
this._poprender();
};
Plain.prototype._poprender = function () {
if (!this.pop) {
return;
}
var value = (0, helper_1.getPropValue)(this.props);
this.pop.innerHTML = value ? this.props.env.filterHtml(value) : '-';
};
Plain.prototype.render = function () {
var _this = this;
var _a, _b, _c, _d;
var _e = this.props, className = _e.className, wrapperComponent = _e.wrapperComponent, text = _e.text, data = _e.data, tpl = _e.tpl, inline = _e.inline, placeholder = _e.placeholder, cx = _e.classnames, popOverContainer = _e.popOverContainer, defaultOpen = _e.defaultOpen, domicile = _e.domicile, name = _e.name, env = _e.env;
var _f = this.state, visible = _f.visible, openHtml = _f.openHtml;
var value = (0, helper_1.getPropValue)(this.props);
var primaryField = (_a = this.props.store) === null || _a === void 0 ? void 0 : _a.primaryField;
var primaryVlaue = domicile ? (_c = (_b = domicile === null || domicile === void 0 ? void 0 : domicile.data) === null || _b === void 0 ? void 0 : _b[primaryField]) !== null && _c !== void 0 ? _c : '' : '';
var primarylable = domicile ? domicile.label : '';
var Component = wrapperComponent || (inline ? 'span' : 'div');
var placement = !(0, helper_1.isMobile)() ? 'rightTop' : 'bottomRight';
var open = (0, helper_1.isMobile)() && defaultOpen;
var wrap = this.props.format === 'autoHeight' && !!this.props.width;
var style = {};
var textRowStyle = {};
if (this.props.format === 'autoHeight' && this.props.textRow) {
textRowStyle = {
overflow: 'hidden',
textOverflow: 'ellipsis',
display: '-webkit-box',
'-webkit-box-orient': 'vertical',
'WebkitLineClamp': this.props.textRow + '',
};
}
if (localStorage.getItem('textControlInput') && typeof localStorage.getItem('textControlInput') == 'string') {
var textControlInput = JSON.parse(localStorage.getItem('textControlInput'));
if (textControlInput && Array.isArray(textControlInput) && textControlInput.some(function (item) { return item.name == name; })) {
style = textControlInput.find(function (item) { return item.name == name; }).style;
}
}
var renderComponent = react_1.default.createElement(Component, { style: tslib_1.__assign({ whiteSpace: wrap ? 'pre-wrap' : undefined }, textRowStyle), className: cx('PlainField', defaultOpen && 'TplOpen', className), onClick: function () {
open && _this.setState({ openHtml: true });
} }, tpl || text ? ((0, tpl_1.filter)(tpl || text, data)) : typeof value === 'undefined' || value === '' || value === null ? (react_1.default.createElement("span", { className: "text-muted" }, placeholder)) : (this.formatter(value)));
var popoverComponent = (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement("div", { className: cx('Tpltab'), style: { width: '100%' } },
react_1.default.createElement("span", { onClick: function (e) { return e.stopPropagation(); }, ref: this.htmlPopovers.bind(this), className: cx('PlainField', className), style: tslib_1.__assign({ whiteSpace: 'break-spaces' }, style) })),
!(0, helper_1.isMobile)() && react_1.default.createElement("div", { className: cx('Footer-tplPop'), onClick: function (e) { return e.stopPropagation(); } },
react_1.default.createElement(antd_1.Button, { size: 'small', style: { borderRadius: 5 }, onClick: function () { return _this.setState({ visible: false }); } }, this.props.translate('Dialog.close')))));
return (react_1.default.createElement(react_1.default.Fragment, null,
defaultOpen && !wrap ?
react_1.default.createElement("div", { className: cx('Tpltab') },
renderComponent,
!(0, helper_1.isMobile)() &&
react_1.default.createElement(antd_1.Popover, { content: popoverComponent, trigger: 'click', visible: visible, overlayClassName: cx('TplPop'), getPopupContainer: env.getModalContainer, autoAdjustOverflow: true, placement: placement, destroyTooltipOnHide: true, onVisibleChange: function (visible) { _this.setState({ visible: visible }); }, title: react_1.default.createElement("div", { className: cx('Title-tplPop'), onClick: function (e) { return e.stopPropagation(); } },
react_1.default.createElement("div", null, primarylable + ": " + ((0, lodash_1.isNil)(primaryVlaue) ? '' : primaryVlaue)),
react_1.default.createElement("div", null,
" ",
react_1.default.createElement(icons_1.Icon, { icon: "close", className: "icon", onClick: function () { return _this.setState({ visible: false }); }, style: { cursor: 'pointer' } }))) },
react_1.default.createElement(icons_1.Icon, { onClick: function (e) { return e.stopPropagation(); }, icon: "provincial", className: [cx('TplSaving'), 'icon'] }))) : renderComponent,
(0, helper_1.isMobile)() &&
react_1.default.createElement(antd_1.Drawer, { visible: openHtml, width: "100%", className: "textarea-drawer", closeIcon: react_1.default.createElement(icons_1.Icon, { icon: 'title-left', className: "icon", style: { width: '16px', height: '16px' } }), onClose: function () { return _this.setState({ openHtml: false }); }, destroyOnClose: true, mask: false, getContainer: this.props.env.getModalContainer, zIndex: 1011, title: (_d = domicile === null || domicile === void 0 ? void 0 : domicile.label) !== null && _d !== void 0 ? _d : '', extra: react_1.default.createElement(react_1.default.Fragment, null), footer: react_1.default.createElement("div", { className: 'textarea-drawer-footer' },
react_1.default.createElement(antd_1.Button, { type: "primary", onClick: function () { return _this.setState({ openHtml: false }); } }, this.props.translate('Dialog.close'))) }, popoverComponent)));
};
Plain.defaultProps = {
wrapperComponent: '',
inline: true,
placeholder: setting_1.UserSetting.tableEmptyValueSetting
};
return Plain;
}(react_1.default.Component));
exports.Plain = Plain;
var PlainRenderer = /** @class */ (function (_super) {
tslib_1.__extends(PlainRenderer, _super);
function PlainRenderer() {
return _super !== null && _super.apply(this, arguments) || this;
}
PlainRenderer = tslib_1.__decorate([
(0, factory_1.Renderer)({
test: /(^|\/)(?:plain|text)$/,
name: 'plain'
})
], PlainRenderer);
return PlainRenderer;
}(Plain));
exports.PlainRenderer = PlainRenderer;
//# sourceMappingURL=./renderers/Plain.js.map