fastlion-amis/lib/components/Timeline.js

一种MIS页面生成工具

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Timeline = void 0;
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importStar(require("react"));
var theme_1 = require("../theme");
var TimelineItem_1 = tslib_1.__importDefault(require("./TimelineItem"));
var helper_1 = require("../utils/helper");
var types_1 = require("../types");
var lodash_1 = require("lodash");
var antd_1 = require("antd");
function Timeline(props) {
    var items = props.items, cx = props.classnames, _a = props.direction, direction = _a === void 0 ? 'vertical' : _a, _b = props.reverse, reverse = _b === void 0 ? false : _b, _c = props.mode, mode = _c === void 0 ? 'right' : _c;
    var timelineRef = (0, react_1.useRef)(null);
    var timelineDatasource = items === null || items === void 0 ? void 0 : items.slice();
    var TimelineUniqueKey = "".concat(types_1.ResizeEvent.TIME_LINE_COMPONENT_RESIZE_END, "-").concat(Date.now());
    reverse && (timelineDatasource === null || timelineDatasource === void 0 ? void 0 : timelineDatasource.reverse());
    var handleTimelineWrapperResize = (0, lodash_1.throttle)(function () {
        var _a;
        (_a = document.body) === null || _a === void 0 ? void 0 : _a.dispatchEvent(new Event(TimelineUniqueKey));
    }, 200);
    (0, react_1.useEffect)(function () {
        // 只有纵向的时候才触发
        if (timelineRef.current && direction === 'vertical') {
            window === null || window === void 0 ? void 0 : window.addEventListener('resize', handleTimelineWrapperResize);
        }
        return function () {
            window === null || window === void 0 ? void 0 : window.removeEventListener('resize', handleTimelineWrapperResize);
        };
    }, []);
    // 所有横向数据都没有主标题的时候，把高度占位给去掉
    var allDataHasNoLabel = (0, react_1.useMemo)(function () {
        return direction === 'horizontal' ? (timelineDatasource === null || timelineDatasource === void 0 ? void 0 : timelineDatasource.every(function (item) { return !item.title; })) : false;
    }, [timelineDatasource, direction]);
    return (react_1.default.createElement("div", { ref: timelineRef, className: cx('Timeline', "Timeline-".concat(direction), "Timeline-".concat(mode), "Timeline--".concat((0, helper_1.isMobile)() ? 'mobile' : 'pc')) }, (timelineDatasource === null || timelineDatasource === void 0 ? void 0 : timelineDatasource.length) ? timelineDatasource === null || timelineDatasource === void 0 ? void 0 : timelineDatasource.map(function (item, index) { return (react_1.default.createElement(TimelineItem_1.default, tslib_1.__assign({}, tslib_1.__assign(tslib_1.__assign({}, item), { direction: direction, TimelineUniqueKey: TimelineUniqueKey, allDataHasNoLabel: allDataHasNoLabel }), { key: "TimelineItem-".concat(index) }))); }) : react_1.default.createElement(antd_1.Empty, { description: "\u6682\u65E0\u6570\u636E" })));
}
exports.Timeline = Timeline;
exports.default = (0, theme_1.themeable)(Timeline);
//# sourceMappingURL=./components/Timeline.js.map