fastlion-amis/lib/renderers/Form/StaticHoc.js

一种MIS页面生成工具

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.supportStatic = void 0;
var tslib_1 = require("tslib");
var react_1 = (0, tslib_1.__importDefault)(require("react"));
var helper_1 = require("../../utils/helper");
var tpl_builtin_1 = require("../../utils/tpl-builtin");
function renderCommonStatic(props, defaultValue) {
    var type = props.type, render = props.render, staticSchema = props.staticSchema, precision = props.precision, prefix = props.prefix, suffix = props.suffix, percent = props.percent, kilobitSeparator = props.kilobitSeparator, affix = props.affix;
    var staticProps = (0, tslib_1.__assign)((0, tslib_1.__assign)({}, props), staticSchema);
    switch (type) {
        case 'select':
        case 'checkboxes':
        case 'button-group-select':
        case 'input-tree':
        case 'tree-select':
        case 'nested-select':
        case 'cascader-select':
        case 'radios':
        case 'multi-select':
        case 'transfer':
        case 'transfer-picker':
        case 'tabs-transfer':
        case 'tabs-transfer-picker':
            return render('static-select', { type: 'words' }, staticProps);
        case 'input-date':
        case 'input-datetime':
        case 'input-time':
        case 'input-month':
        case 'input-quarter':
        case 'input-year':
            return renderStaticDateTypes(staticProps);
        case 'input-date-range':
        case 'input-datetime-range':
        case 'input-time-range':
        case 'input-month-range':
        case 'input-quarter-range':
        case 'input-year-range':
            return render('static-input-date-range', { type: 'date-range' }, (0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({}, props), { valueFormat: props.format, format: props.inputFormat }), staticSchema));
        case 'input-password':
            return render('static-input-password', { type: 'password' }, staticProps);
        case 'input-color':
            return render('static-color', { type: 'color' }, staticProps);
        case 'input-tag':
            return render('static-input-tag', { type: 'tags' }, staticProps);
        case 'input-url':
            return render('static-input-url', { type: 'link', href: defaultValue }, staticProps);
        case 'input-number':
            var viewValue = void 0;
            if (defaultValue != 0 && !defaultValue) {
                viewValue = react_1.default.createElement("span", { className: "text-muted" }, "-");
            }
            else {
                var value = defaultValue;
                // 设置了精度，但是原始数据是字符串，需要转成 float 之后再处理
                if (typeof value === 'string' && precision) {
                    value = (0, tpl_builtin_1.stripNumber)(parseFloat(value));
                }
                if (typeof value == 'number' && isNaN(value)) {
                    viewValue = false;
                }
                else if (percent) {
                    // 如果是百分比展示
                    value = parseFloat(value) || 0;
                    var decimals = typeof percent === 'number' ? percent : 0;
                    var whole = value * 100;
                    var multiplier = Math.pow(10, decimals);
                    value =
                        (Math.round(whole * multiplier) / multiplier).toFixed(decimals) + '%';
                    viewValue = react_1.default.createElement("span", null, value);
                }
                else {
                    if (typeof value === 'number' && precision) {
                        value = value.toFixed(precision);
                    }
                    if (kilobitSeparator) {
                        value = (value + '').replaceAll(',', '');
                        value = value.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
                    }
                    viewValue = react_1.default.createElement("span", null, value);
                }
            }
            return react_1.default.createElement(react_1.default.Fragment, null,
                prefix,
                viewValue, affix !== null && affix !== void 0 ? affix : suffix);
        default:
            return defaultValue;
    }
}
/**
 * 表单项类成员render支持静态展示装饰器
 */
function supportStatic() {
    return function (target, name, descriptor) {
        var original = descriptor.value;
        descriptor.value = function () {
            var args = [];
            for (var _i = 0; _i < arguments.length; _i++) {
                args[_i] = arguments[_i];
            }
            var props = this.props;
            if (props.staticShow) {
                var render = props.render, staticSchema = props.staticSchema, ns = props.classPrefix, cx = props.classnames, className = props.className, _a = props.staticPlaceholder, staticPlaceholder = _a === void 0 ? '-' : _a;
                var body = void 0;
                var displayValue = (0, helper_1.getPropValue)(props);
                var isValueEmpty = displayValue == null || displayValue === '';
                if (staticSchema && (staticSchema.type
                    || Array.isArray(staticSchema)
                    || typeof staticSchema === 'string'
                    || typeof staticSchema === 'number')) {
                    // 有自定义schema 且schema有type 时，展示schema
                    body = render('form-static-schema', staticSchema, props);
                }
                else if (target.renderStatic) {
                    // 特殊组件，control有 renderStatic 时，特殊处理
                    body = target.renderStatic.apply(this, (0, tslib_1.__spreadArray)((0, tslib_1.__spreadArray)([], args, true), [isValueEmpty ? staticPlaceholder : displayValue], false));
                }
                else if (isValueEmpty) {
                    // 空值时，展示 staticPlaceholder
                    body = staticPlaceholder;
                }
                else {
                    // 可复用组件 统一处理
                    body = renderCommonStatic(props, displayValue);
                }
                return react_1.default.createElement("div", { className: cx(ns + "Form-static", className), style: { padding: '5px 0' } }, body);
            }
            return original.apply(this, args);
        };
        return descriptor;
    };
}
exports.supportStatic = supportStatic;
function renderStaticDateTypes(props) {
    var render = props.render, type = props.type, inputFormat = props.inputFormat, timeFormat = props.timeFormat, format = props.format, value = props.value;
    return render('static-input-date', {
        type: 'date',
        value: value,
        format: type === 'time' && timeFormat ? timeFormat : inputFormat,
        valueFormat: format
    });
}
//# sourceMappingURL=./renderers/Form/StaticHoc.js.map