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

一种MIS页面生成工具

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.TreeControlRenderer = void 0;
var tslib_1 = require("tslib");
var react_1 = (0, tslib_1.__importDefault)(require("react"));
var classnames_1 = (0, tslib_1.__importDefault)(require("classnames"));
var Tree_1 = (0, tslib_1.__importDefault)(require("../../components/Tree"));
var Options_1 = require("./Options");
var components_1 = require("../../components");
var react_dom_1 = require("react-dom");
var Scoped_1 = require("../../Scoped");
var TreeControl = /** @class */ (function (_super) {
    (0, tslib_1.__extends)(TreeControl, _super);
    function TreeControl(props) {
        var _this = _super.call(this, props) || this;
        /**
          * @author:Chencicsy
          * @description:控制input-tree高度根据treeControl自适应
          * @param:selfAdaption
        **/
        _this.calcTreeHeight = function (dom) {
            var _a, _b, _c, _d, _e, _f, _g, _h, _j;
            var ns = _this.props.classPrefix;
            if (!dom) {
                dom = (0, react_dom_1.findDOMNode)(_this);
            }
            // 获取treeControl的父节点
            var _parentDom = dom === null || dom === void 0 ? void 0 : dom.parentElement;
            // 获取form下的所有formItem
            var _silingDom = (_a = _parentDom === null || _parentDom === void 0 ? void 0 : _parentDom.parentElement) === null || _a === void 0 ? void 0 : _a.children;
            var _bodyDom = (_c = (_b = _parentDom === null || _parentDom === void 0 ? void 0 : _parentDom.parentElement) === null || _b === void 0 ? void 0 : _b.parentElement) === null || _c === void 0 ? void 0 : _c.parentElement;
            // 要是form设置头部需要减去form的头部高度
            var headingHeight = (_d = document.querySelector("." + (0, classnames_1.default)(ns + "Panel-heading"))) === null || _d === void 0 ? void 0 : _d.clientHeight;
            // 获取页面的高度
            var _treeHeight = ((_e = document.querySelector('.ant-tabs-content')) === null || _e === void 0 ? void 0 : _e.clientHeight) - 16 - 20 - (((_f = document.querySelector('.ant-tabs-content')) === null || _f === void 0 ? void 0 : _f.querySelector('.antd-Tabs-links')) ? 32 : 0) - (headingHeight ? headingHeight : 0);
            if (_this.props.inModal) {
                _treeHeight = ((_g = document.querySelector('.ant-tabs-content')) === null || _g === void 0 ? void 0 : _g.clientHeight) - 16 - 20 - (headingHeight ? headingHeight : 0) - ((_j = (_h = _parentDom === null || _parentDom === void 0 ? void 0 : _parentDom.parentElement) === null || _h === void 0 ? void 0 : _h.getBoundingClientRect()) === null || _j === void 0 ? void 0 : _j.top);
            }
            // 计算formItem的兄弟节点占据的高度
            [].slice.call(_silingDom).forEach(function (_ele) {
                if (_ele !== _parentDom) {
                    var _eleCss = window.getComputedStyle(_ele);
                    var _eleHeight = (_ele === null || _ele === void 0 ? void 0 : _ele.clientHeight) + (+_eleCss.marginTop.replace('px', '')) + (+_eleCss.marginBottom.replace('px', ''));
                    _treeHeight -= _eleHeight;
                }
            });
            // 计算treeControl的兄弟节点占据的高度
            [].slice.call(_parentDom === null || _parentDom === void 0 ? void 0 : _parentDom.children).forEach(function (_ele) {
                var _eleCss = window.getComputedStyle(_ele);
                if (_ele === dom) {
                    _treeHeight -= ((+_eleCss.paddingTop.replace('px', '')) + (+_eleCss.paddingBottom.replace('px', '')));
                }
                else {
                    var _eleHeight = (_ele === null || _ele === void 0 ? void 0 : _ele.clientHeight) + (+_eleCss.marginTop.replace('px', '')) + (+_eleCss.marginBottom.replace('px', ''));
                    _treeHeight -= _eleHeight;
                }
            });
            _this.setState({
                height: _treeHeight
            });
        };
        _this.MonitorFormResize = function (e) {
            _this.calcTreeHeight();
        };
        // Aug
        _this.state = {
            spread: undefined,
            height: (document === null || document === void 0 ? void 0 : document.querySelector(props.treeContainerClassName)) ? _this.calcTreeHeight(document === null || document === void 0 ? void 0 : document.querySelector(props.treeContainerClassName)) : 300
            // treeContainerClassName
        };
        return _this;
    }
    TreeControl.prototype.reload = function () {
        var reload = this.props.reloadOptions;
        reload && reload();
    };
    // Aug
    TreeControl.prototype.handleKeepSqread = function (spread) {
        this.setState({ spread: spread });
    };
    TreeControl.prototype.componentDidMount = function () {
        this.calcTreeHeight();
        window.addEventListener('resize', this.MonitorFormResize);
    };
    TreeControl.prototype.componentWillUnmount = function () {
        window.removeEventListener('resize', this.MonitorFormResize);
    };
    // Aug 发送target数据
    TreeControl.prototype.handleChange = function (value, node) {
        var _a = this.props, onChange = _a.onChange, name = _a.name;
        var result = false;
        if (node && node.target) {
            var scoped = this.context;
            result = scoped.send(node.target, value, name);
        }
        onChange && onChange(value);
        return result;
    };
    TreeControl.prototype.render = function () {
        var _a;
        var _b = this.props, className = _b.className, treeContainerClassName = _b.treeContainerClassName, ns = _b.classPrefix, value = _b.value, enableNodePath = _b.enableNodePath, _c = _b.pathSeparator, pathSeparator = _c === void 0 ? '/' : _c, onChange = _b.onChange, disabled = _b.disabled, joinValues = _b.joinValues, extractValue = _b.extractValue, delimiter = _b.delimiter, placeholder = _b.placeholder, options = _b.options, multiple = _b.multiple, valueField = _b.valueField, initiallyOpen = _b.initiallyOpen, unfoldedLevel = _b.unfoldedLevel, withChildren = _b.withChildren, onlyChildren = _b.onlyChildren, onlyLeaf = _b.onlyLeaf, loading = _b.loading, hideRoot = _b.hideRoot, rootLabel = _b.rootLabel, cascade = _b.cascade, rootValue = _b.rootValue, showIcon = _b.showIcon, showRadio = _b.showRadio, showOutline = _b.showOutline, onAdd = _b.onAdd, creatable = _b.creatable, createTip = _b.createTip, addControls = _b.addControls, onEdit = _b.onEdit, editable = _b.editable, editTip = _b.editTip, editControls = _b.editControls, removable = _b.removable, removeTip = _b.removeTip, onDelete = _b.onDelete, rootCreatable = _b.rootCreatable, rootCreateTip = _b.rootCreateTip, labelField = _b.labelField, iconField = _b.iconField, nodePath = _b.nodePath, deferLoad = _b.deferLoad, expandTreeOptions = _b.expandTreeOptions, __ = _b.translate, selfAdaption = _b.selfAdaption, loadFirst = _b.loadFirst;
        return (react_1.default.createElement("div", { style: (_a = {
                    height: this.state.height
                },
                _a[selfAdaption ? 'maxHeight' : ''] = 'unset',
                _a), className: (0, classnames_1.default)(ns + "TreeControl", className, treeContainerClassName) },
            react_1.default.createElement(components_1.Spinner, { size: "sm", key: "info", show: loading }),
            loading ? null : (react_1.default.createElement(Tree_1.default, { classPrefix: ns, loadFirst: loadFirst, labelField: labelField, valueField: valueField, iconField: iconField, disabled: disabled, 
                // onChange={onChange}
                onChange: this.handleChange.bind(this), joinValues: joinValues, extractValue: extractValue, delimiter: delimiter, placeholder: __(placeholder), options: options, multiple: multiple, initiallyOpen: initiallyOpen, unfoldedLevel: unfoldedLevel, withChildren: withChildren, onlyChildren: onlyChildren, onlyLeaf: onlyLeaf, hideRoot: hideRoot, rootLabel: __(rootLabel), rootValue: rootValue, showIcon: showIcon, showRadio: showRadio, showOutline: showOutline, cascade: cascade, foldedField: "collapsed", value: value || '', nodePath: nodePath, enableNodePath: enableNodePath, pathSeparator: pathSeparator, selfDisabledAffectChildren: false, onAdd: onAdd, creatable: creatable, createTip: createTip, rootCreatable: rootCreatable, rootCreateTip: rootCreateTip, onEdit: onEdit, editable: editable, editTip: editTip, removable: removable, removeTip: removeTip, onDelete: onDelete, bultinCUD: !addControls && !editControls, onDeferLoad: deferLoad, onExpandTree: expandTreeOptions, 
                // Aug
                onKeepSqread: this.handleKeepSqread.bind(this), spread: this.state.spread }))));
    };
    TreeControl.defaultProps = {
        placeholder: 'placeholder.noData',
        multiple: false,
        rootLabel: '顶级',
        rootValue: '',
        showIcon: true,
        enableNodePath: false,
        pathSeparator: '/'
    };
    return TreeControl;
}(react_1.default.Component));
exports.default = TreeControl;
var TreeControlRenderer = /** @class */ (function (_super) {
    (0, tslib_1.__extends)(TreeControlRenderer, _super);
    function TreeControlRenderer(props, context) {
        var _this = _super.call(this, props) || this;
        var scoped = context;
        scoped.registerComponent(_this);
        return _this;
    }
    TreeControlRenderer.prototype.componentWillMount = function () {
        var scoped = this.context;
        scoped.registerComponent(this);
    };
    TreeControlRenderer.prototype.componentWillUnmount = function () {
        var scoped = this.context;
        scoped.unRegisterComponent(this);
        _super.prototype.componentWillUnmount.call(this);
    };
    var _a;
    // Aug -- 注册scoped对象
    TreeControlRenderer.contextType = Scoped_1.ScopedContext;
    TreeControlRenderer = (0, tslib_1.__decorate)([
        (0, Options_1.OptionsControl)({
            type: 'input-tree'
        }),
        (0, tslib_1.__metadata)("design:paramtypes", [Object, typeof (_a = typeof Scoped_1.IScopedContext !== "undefined" && Scoped_1.IScopedContext) === "function" ? _a : Object])
    ], TreeControlRenderer);
    return TreeControlRenderer;
}(TreeControl));
exports.TreeControlRenderer = TreeControlRenderer;
//# sourceMappingURL=./renderers/Form/InputTree.js.map