chowa
Version:
UI component library based on React
79 lines (78 loc) • 3.83 kB
JavaScript
/**
* @license chowa v1.1.3
*
* Copyright (c) Chowa Techonlogies Co.,Ltd.(http://www.chowa.cn).
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
;
Object.defineProperty(exports, "__esModule", { value: true });
const React = require("react");
const moment = require("moment");
const classnames_1 = require("classnames");
const i18n_1 = require("../../i18n");
const utils_1 = require("../../utils");
const tool_1 = require("../tool");
const row_event_layout_1 = require("./row-event-layout");
class FullYear extends React.PureComponent {
constructor(props) {
super(props);
this.state = Object.assign({}, this.compileRenderParams(props.value, props.events));
}
componentDidUpdate(preProps) {
if (!utils_1.isSameMoment(preProps.value, this.props.value)
|| !utils_1.isEqual(preProps.events, this.props.events)) {
this.setState(Object.assign({}, this.compileRenderParams(this.props.value, this.props.events)));
}
}
compileRenderParams(value, events) {
const renderMoms = [];
const renderLunars = [];
const renderEvents = [];
for (let i = 0; i < 4; i++) {
const rowMoms = [];
const startIndex = i * 3;
for (let j = 0; j < 3; j++) {
const mom = value.clone().date(1).month(startIndex + j);
rowMoms.push(mom);
}
renderMoms.push(rowMoms);
renderEvents.push(tool_1.compileRowEvents(events, rowMoms, 'month'));
}
return {
renderMoms,
renderLunars,
renderEvents,
activeMonth: undefined,
activeEvent: undefined
};
}
renderMonth(mom, key) {
const { appendable, onContextMenu } = this.props;
const currentValue = moment();
const monthClass = classnames_1.default({
[utils_1.preClass('full-calendar-num')]: true,
[utils_1.preClass('full-calendar-active')]: mom.isSame(currentValue, 'month')
});
return (React.createElement("div", { onContextMenu: appendable ? onContextMenu.bind(this, mom, undefined) : null, className: utils_1.preClass('full-calendar-mode-detail-wrapper'), key: key },
React.createElement("div", { className: utils_1.preClass('full-calendar-mode-detail') },
React.createElement("span", { className: monthClass },
React.createElement(i18n_1.I18nReceiver, { module: 'Calendar' }, (i18n) => i18n.months[mom.month()])))));
}
render() {
const { renderMoms, renderEvents } = this.state;
const { editable, onContextMenu } = this.props;
const wrapperClass = classnames_1.default({
[utils_1.preClass('full-calendar-mode-wrapper')]: true,
[utils_1.preClass('full-calendar-mode-year')]: true
});
return (React.createElement("div", { className: wrapperClass },
React.createElement("div", { className: utils_1.preClass('full-calendar-header') }),
React.createElement("div", { className: utils_1.preClass('full-calendar-body') }, renderMoms.map((row, key) => (React.createElement("div", { className: utils_1.preClass('full-calendar-row-wrapper'), key: key },
React.createElement("div", { className: utils_1.preClass('full-calendar-row-bg') }, row.map((mom, colKey) => (this.renderMonth(mom, colKey)))),
React.createElement("div", { className: utils_1.preClass('full-calendar-row-content') },
React.createElement(row_event_layout_1.default, { onContextMenu: onContextMenu, eventsMatrix: renderEvents[key], colAmount: 3, editable: editable }))))))));
}
}
exports.default = FullYear;