ukelli-ui/core/date-shortcut/date-shortcut.js

Base on React's UI lib. Make frontend's dev simpler and faster.

var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
        return extendStatics(d, b);
    };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
import React from 'react';
import { Call, DateFormat } from 'basic-helper';
import { DateRange, ToUTC } from 'basic-helper/datetime-helper';
import { DropdownWrapper } from '../selector';
import { $T_UKE } from '../config';
import { DateBasic } from '../date-basic';
function getHalfMouthDate(type, format, timeDefaultStr) {
    var today = new Date();
    var currYear = today.getFullYear();
    var currMonth = today.getMonth();
    var dayInMouth = new Date(currYear, currMonth + 1, 0);
    var lastDay = dayInMouth.getDate();
    var _a = timeDefaultStr[0], s = _a === void 0 ? '' : _a, _b = timeDefaultStr[1], e = _b === void 0 ? '' : _b;
    var upStartDate = DateFormat(new Date(currYear, currMonth, 1), format) + s;
    var upEndDate = DateFormat(new Date(currYear, currMonth, 15), format) + e;
    var downStartDate = DateFormat(new Date(currYear, currMonth, 16), format) + s;
    var downEndDate = DateFormat(new Date(currYear, currMonth, lastDay), format) + e;
    var result = [];
    switch (type) {
        case 'up':
            result = [ToUTC(upStartDate), ToUTC(upEndDate)];
            break;
        case 'down':
            result = [ToUTC(downStartDate), ToUTC(downEndDate)];
            break;
    }
    return result;
}
/**
 * 独立的快捷时间选择器
 *
 * @export
 * @class DateShortcut
 * @extends {DateBasic}
 */
var DateShortcut = /** @class */ (function (_super) {
    __extends(DateShortcut, _super);
    function DateShortcut(props) {
        var _this = _super.call(this, props) || this;
        _this.value = {};
        _this.state = {
            activeIdx: -1,
        };
        var needTime = props.needTime;
        var basicFormat = 'YYYY-MM-DD';
        // const timeFormat = 'hh:ss:mm';
        var timeDefaultStr = needTime ? [' 00:00:00', ' 23:59:59'] : [];
        // const format = basicFormat + (needTime ? (' ' + timeFormat) : '');
        var dateRangeOptions = { extendFormat: timeDefaultStr };
        _this.defaultDateHelperInfo = [
            {
                filter: function () {
                    return [];
                },
                t: '清空'
            },
            {
                filter: function () {
                    return DateRange(0, 0, dateRangeOptions);
                },
                t: '今天'
            }, {
                filter: function () {
                    return DateRange(1, -1, dateRangeOptions);
                },
                t: '昨天'
            }, {
                filter: function () {
                    return getHalfMouthDate('up', basicFormat, timeDefaultStr);
                },
                t: '前半月'
            }, {
                filter: function () {
                    return getHalfMouthDate('down', basicFormat, timeDefaultStr);
                },
                t: '后半月'
            }
        ];
        return _this;
    }
    DateShortcut.prototype.generateDate = function (itemConfig, idx) {
        var onClick = this.props.onClick;
        var dateInfo = itemConfig.filter();
        var emitRes = this.emitChangeValue(dateInfo);
        this.value = emitRes;
        Call(onClick, emitRes);
        this.setState({
            activeIdx: idx
        });
    };
    DateShortcut.prototype.render = function () {
        var _this = this;
        var activeIdx = this.state.activeIdx;
        var _a = this.props, dateHelperInfo = _a.dateHelperInfo, style = _a.style, position = _a.position;
        var _dateHelperInfo = !!dateHelperInfo && dateHelperInfo.length > 0
            ? dateHelperInfo : this.defaultDateHelperInfo;
        return (React.createElement(DropdownWrapper, { outside: true, trigger: "hover", overlay: function (_a) {
                var hide = _a.hide;
                return (React.createElement("div", { className: "date-helper-group", style: style },
                    React.createElement("div", { className: "date-helper" }, _dateHelperInfo.map(function (item, idx) {
                        var text = item.t;
                        return (React.createElement("span", { className: (idx === activeIdx ? 'active ' : '') + "date-helper-btn", onClick: function (e) {
                                hide();
                                _this.generateDate(item, idx);
                            }, key: text }, $T_UKE(text)));
                    }))));
            }, position: position }, function () { return _this.$T_UKE('快捷'); }));
    };
    DateShortcut.defaultProps = {
        needTime: true,
        toUTC: true,
        position: 'left',
        outputAsString: false,
        defaultTimes: ['00:00:00', '23:59:59'],
    };
    return DateShortcut;
}(DateBasic));
export default DateShortcut;