react-form-ui-y/lib/form/date/dateField.js

'use strict';

Object.defineProperty(exports, "__esModule", {
    value: true
});

var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _reactRedux = require('react-redux');

var _reactUtilsY = require('react-utils-y');

var _themeY = require('theme-y');

var _index = require('../../actions/index');

var _dateStyle = require('./dateStyle');

var _subpage = require('./subpage');

var _publicField = require('../publicField');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
// import {Theme} from '../../../theme/index';

var propTypes = {
    designationTheme: _propTypes2.default.string,
    formType: _propTypes2.default.string,
    inputName: _propTypes2.default.string.isRequired,
    formText: _propTypes2.default.string,
    disabled: _propTypes2.default.bool,
    required: _propTypes2.default.bool,
    hintText: _propTypes2.default.string,
    textWidth: _propTypes2.default.string,
    valueWidth: _propTypes2.default.string,
    changeValue: _propTypes2.default.func,
    errorText: _propTypes2.default.string,
    dataType: _propTypes2.default.string,
    // remarks  无规则 自定义传参
    // regex:PropTypes.number,//正则 input特有
    regexText: _propTypes2.default.string //input特有
};

var date = void 0,
    year = void 0,
    month = void 0,
    day = void 0,
    monthFirstWeek = void 0,
    monthDays = void 0,
    monthMaxDay = void 0;
var isLeap = function isLeap(year) {
    return year % 100 == 0 ? year % 400 == 0 ? 1 : 0 : year % 4 == 0 ? 1 : 0;
},
    //平年 瑞年
//算个数  9-->09  12-->12
formatTen = function formatTen(num) {
    return num > 9 ? num + "" : "0" + num;
},

//当月的上月计算
hiddenDayUp = function hiddenDayUp(year, month, i) {
    var yearU = month == 1 ? year - 1 : year,
        monthU = month == 1 ? 12 : month - 1,
        datU = [31, 28 + isLeap(yearU), 31, 30, 31, 30, 31, 31, 30, 31, 30, 31],
        monthFirstWeekU = new Date(year + '/' + month + '/' + 1 + " 00:00:00").getDay(),
        dayU = datU[monthU - 1] - (monthFirstWeekU - 1 - i);
    return {
        day: dayU,
        month: monthU,
        year: yearU,
        flag: "up"
    };
},

//当月的下月计算
hiddenDayNext = function hiddenDayNext(year, month, dayNumN) {
    var monthN = month == 12 ? 1 : month + 1,
        yearN = month == 12 ? year + 1 : year;
    return {
        day: dayNumN,
        month: monthN,
        year: yearN,
        flag: "next"
    };
};

//遍历渲染的日期数据集合
var setDateData = function setDateData(_date, _this) {

    /*date*/
    var date = _date;
    year = date.getFullYear(); //2018
    month = date.getMonth() + 1; //0-11   +1
    day = date.getDate(); //1,2,
    monthFirstWeek = new Date(year + '/' + month + '/1').getDay(); //获取这个月分第一天是星期几。 0-6 0是星期日
    monthMaxDay = new Date(year, month, 0).getDate();

    var iNum = monthMaxDay + monthFirstWeek < 36 ? 35 : 42;
    var listDomDays = iNum == 35 ? [[], [], [], [], []] : [[], [], [], [], [], []],
        thisDay = 0,
        nextDay = 0,
        rows = 0;
    for (var i = 0; i < iNum; i++) {
        rows = parseInt(i / 7);
        //renderType  日期渲染重 星期日开始 还是星期一开始
        var flag = _this.props.renderType == "ch" ? i + 1 : i;
        if (flag < monthFirstWeek) {
            //上月
            listDomDays[rows].push(hiddenDayUp(year, month, i));
            continue;
        }
        if (flag >= monthFirstWeek && thisDay < monthMaxDay) {
            //这个月
            listDomDays[rows].push({
                day: thisDay + 1,
                month: month,
                year: year,
                flag: "now"
            });
            thisDay++;
            continue;
        }
        if (flag > parseInt(monthMaxDay + monthFirstWeek) - 1) {
            //下个月
            if (monthMaxDay + monthFirstWeek > 35) {
                nextDay++;
                listDomDays[rows].push(hiddenDayNext(year, month, nextDay));
            } else {
                if (i + 1 > 35) {
                    listDomDays[rows].push(0);
                } else {
                    nextDay++;
                    listDomDays[rows].push(hiddenDayNext(year, month, nextDay));
                }
            }
            continue;
        }
    }

    if (_this.props.schedule == "1" || _this.props.schedule == "2") {
        var beginDate = listDomDays[0][0].year + "-" + formatTen(listDomDays[0][0].month) + "-" + formatTen(listDomDays[0][0].day);
        var endDate = listDomDays[listDomDays.length - 1][6].year + "-" + formatTen(listDomDays[listDomDays.length - 1][6].month) + "-" + formatTen(listDomDays[listDomDays.length - 1][6].day);
        // _this.setState({
        //     loading: true
        // });
        // _this.getScheduleListFn(beginDate, endDate);
        _this.props.getScheduleFn && _this.props.getScheduleFn(beginDate, endDate);
    }
    return {
        year: year,
        month: month,
        day: day,
        listDomDays: listDomDays
    };
};

var DateField = function (_Theme) {
    _inherits(DateField, _Theme);

    function DateField(props) {
        _classCallCheck(this, DateField);

        var _this2 = _possibleConstructorReturn(this, (DateField.__proto__ || Object.getPrototypeOf(DateField)).call(this, props));

        _this2.initScroll = function () {
            _this2.setState({ shouldUpdate: false });
        };

        _this2.getScheduleListFn = function (beginDate, endDate) {

            // this.props.getScheduleFn && this.props.getScheduleFn(beginDate, endDate);
            // let _this = this;
            // this.props.getScheduleList(this.props.userId, beginDate, endDate, function (res) {
            //     _this.setState({
            //         scheduleData: res.errorCode == "0" ? res.data : [],
            //         loading: false
            //     })
            // })
        };

        _this2.handleHead = function (type) {
            if (type == "year") {
                _this2.setState({
                    showMonth: false,
                    showYear: true
                });
            } else {
                _this2.setState({
                    showMonth: true,
                    showYear: false
                });
            }
        };

        _this2.moveYear = function (value, type) {
            if (type == "year") {
                _this2.setState({ chooseYear: value });
            } else {
                _this2.setState({ chooseMonth: value });
            }
        };

        _this2.handleYear = function (value, type) {
            if (type == "year") {
                _this2.setState({
                    showYear: false,
                    showMonth: false,
                    date: new Date(value + "/01/01"),
                    renderDateData: setDateData(new Date(value + "/01/01"), _this2),
                    handleDay: '1\u67081\u65E5'
                });
            } else {
                _this2.setState({
                    showYear: false,
                    showMonth: false,
                    date: new Date(_this2.state.date.getFullYear() + "/" + formatTen(value) + "/01"),
                    renderDateData: setDateData(new Date(_this2.state.date.getFullYear() + "/" + formatTen(value) + "/01"), _this2),
                    handleDay: value + '\u67081\u65E5'
                });
            }
        };

        _this2.colseSelest = function (year) {
            _this2.setState({
                showYear: false,
                showMonth: false
            });
        };

        _this2.showDate = function (e) {
            var _this = _this2;

            if (_this2.props.disabled) return;

            _this2.setState({ dateOpen: true });

            var formDataValue = _this.props.formData[_this.props.dataType || "default"];
            var inputData = formDataValue && formDataValue[_this.props.inputName];

            var minDate = _this.props.minDate,
                maxDate = _this.props.maxDate,
                minDateTimes = void 0,
                maxDateTimes = void 0,
                dateValue = inputData && inputData.text ? inputData.text : ""; //_this.props.dataObj[_this.props.inputName];

            if (minDate) {
                minDateTimes = new Date(_this.props.minDate.replace(/-/g, "/")).getTime();
            }

            if (maxDate) {
                maxDateTimes = new Date(_this.props.maxDate.replace(/-/g, "/")).getTime();
            }

            if (dateValue) {
                if (minDateTimes > new Date(dateValue).getTime() || new Date(dateValue).getTime() > maxDateTimes) {
                    _this.setState({
                        dayActive: dateValue.replace(/-/g, "/")
                    });
                }
            } else {
                if (minDateTimes > new Date().getTime() || new Date().getTime() > maxDateTimes) {
                    _this.setState({
                        dayActive: ""
                    });
                }
            }

            _this.setState({
                handleDay: dateValue ? dateValue.split("-")[1] + '\u6708' + dateValue.split("-")[2] + '\u65E5' : "",
                renderDateData: setDateData(dateValue ? new Date(dateValue) : _this.props.setDate ? new Date(_this.props.setDate) : new Date(), _this)
            });

            (0, _publicField.setLocationFn)(_this, e);

            // let dateP = dateValue.split("-");
            // let year = dateP[0];
            // let month = dateP[1];
            // let day = dateP[2];
            // this.setState({
            //     date: new Date(year + '/' + month + '/' + day),
            //     scheduleData: [],
            //     renderDateData: setDateData(new Date(year + '/' + month + '/' + day), this)
            // });
        };

        _this2.lastMonth = function (year, month) {
            var yearL = month == 1 ? year - 1 : year,
                monthL = month == 1 ? 12 : month - 1;
            _this2.setState({
                date: new Date(yearL + '/' + monthL + '/' + 1),
                // scheduleData: [],
                renderDateData: setDateData(new Date(yearL + '/' + monthL + '/' + 1), _this2)
            });
        };

        _this2.nextMonth = function (year, month) {
            var yearN = month == 12 ? year + 1 : year,
                monthN = month == 12 ? 1 : month + 1;
            _this2.setState({
                date: new Date(yearN + '/' + monthN + '/' + 1),
                // scheduleData: [],
                renderDateData: setDateData(new Date(yearN + '/' + monthN + '/' + 1), _this2)
            });
        };

        _this2.handleDayMoveFn = function (value, flag) {
            if (flag == "disabled") {
                return false;
            }
            _this2.setState({
                dayMoveOn: value.year + '/' + formatTen(value.month) + '/' + formatTen(value.day)
            });
        };

        _this2.handleDayActiveFn = function (value, flag) {
            if (flag == "disabled") {
                return false;
            }
            _this2.setState({
                dayActive: value.year + '/' + formatTen(value.month) + '/' + formatTen(value.day),
                handleDay: value.month + '\u6708' + formatTen(value.day) + '\u65E5'
            });
        };

        _this2.handleDayCloseSelect = function () {
            _this2.setState({ dateOpen: false, initFocusState: 1 });
            if (_this2.state.dayActive) {
                _this2.setState({
                    dateOpen: false
                });
                var value = _this2.state.dayActive.replace(/\//g, "-");
                var obj = [{
                    type: "date", //type 类型
                    name: _this2.props.inputName, //name input名称
                    text: value, //text input值
                    value: value,
                    obj: {},
                    remarks: _this2.props.remarks, //备注
                    other: {
                        required: _this2.props.required
                    }
                }];
                _this2.props.setFormData(obj, _this2.props.dataType);
                _this2.props.changeValue && _this2.props.changeValue(obj[0]);
            }
        };

        _this2.handleDaySubmit = function () {
            if (_this2.state.dayActive) {
                _this2.setState({
                    dateOpen: false
                });
                var value = _this2.state.dayActive.replace(/\//g, "-");
                var obj = [{
                    type: "date", //type 类型
                    name: _this2.props.inputName, //name input名称
                    text: value, //text input值
                    value: value,
                    obj: {},
                    remarks: _this2.props.remarks, //备注
                    other: {
                        required: _this2.props.required
                    }
                }];
                _this2.props.setFormData(obj, _this2.props.dataType);
                _this2.props.changeValue && _this2.props.changeValue(obj[0]);
            }
        };

        _this2.handleDayCloseDialog = function () {
            _this2.setState({ dateOpen: false, initFocusState: 1 });
        };

        var _state = {
            focusState: false, //处理点击的样式
            initFocusState: 0, //是否触发过 0 未触发  1 已经触发
            errorState: false, //是否显示报错提示框，  true  显示报错  false  不显示

            dateOpen: false, //是否显示日期弹出框

            shouldUpdate: true, //选择年份或者月份滚动分页状态
            showYear: false, //显示年份下拉
            chooseYear: new Date().getFullYear(), //显示选择的年份值
            showMonth: false, //显示月份下拉
            chooseMonth: new Date().getMonth(), //显示选择的月份值

            date: new Date(), //当前日期

            dayActive: _reactUtilsY._Date.format(new Date(), "yyyy-MM-dd").replace(/-/g, "/"), //默认选中今天

            // loading: false,
            // scheduleData: [],
            renderDateData: { year: 0, month: 0, day: 0, listDomDays: [] },

            selLocationH: "bottom", // selLocation:"bottom"  // top  bottom
            selLocationW: "right" // left   right
        };
        _this2.state = _reactUtilsY._Object.merge(_this2.state || {}, _state);
        return _this2;
    }

    //年份的下拉滚动条

    //请求日期排班

    //选择年份 月份

    //移动年份 月份

    //选择年份 月份

    //点旁边关闭下拉

    /*显示日历控件*/

    //上个月点击

    //下个月点击

    //移动日期

    //选中日期

    //下拉点击旁边关闭下拉  设置date值

    //数据提交

    //返回 关闭弹出框


    _createClass(DateField, [{
        key: 'componentWillMount',
        value: function componentWillMount() {
            var props = this.props;
            var flag = "set";
            try {
                //已经存在数据 就不 重新赋值
                flag = props.formData[props.dataType || "default"][props.inputName] ? "none" : "set";
            } catch (ex) {
                flag = "set";
            } finally {
                if (props.inputName && flag == "set") {
                    var obj = [{
                        type: "date", //type 类型
                        name: this.props.inputName, //name input名称
                        text: "", //text input值
                        value: "",
                        obj: {},
                        remarks: this.props.remarks, //备注
                        other: {
                            required: this.props.required
                        }
                    }];
                    props.setFormData(obj, props.dataType);
                }
            }
        }
    }, {
        key: 'componentDidMount',
        value: function componentDidMount() {}
    }, {
        key: 'componentWillUnmount',
        value: function componentWillUnmount() {
            this.props.delFormData(this.props.inputName || "", this.props.dataType);
        }
    }, {
        key: 'render',
        value: function render() {
            return (0, _publicField.renderBox)(this, _dateStyle.dateSty, _subpage.formTypeDom, _subpage.verifyFn);
        }
    }]);

    return DateField;
}(_themeY.Theme);

DateField.propTypes = propTypes;

var mapStateToProps = function mapStateToProps(state) {
    return {
        formData: state.formData,
        subVerifyRes: state.subVerifyRes,
        theme: state.theme
    };
};

var mapDispatchToProps = function mapDispatchToProps(dispatch) {
    return {
        setFormData: function setFormData(data, dataType) {
            return dispatch((0, _index.setFormData)(data, dataType));
        },
        delFormData: function delFormData(inputName, dataType) {
            return dispatch((0, _index.delFormData)(inputName, dataType));
        }
    };
};

exports.default = (0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps)(DateField);
//# sourceMappingURL=dateField.js.map