devextreme
Version:
JavaScript/TypeScript Component Suite for Responsive Web Development
142 lines (140 loc) • 6.17 kB
JavaScript
/**
* DevExtreme (cjs/__internal/scheduler/appointments_new/appointment/base_appointment.js)
* Version: 25.2.8
* Build date: Mon Jun 08 2026
*
* Copyright (c) 2012 - 2026 Developer Express Inc. ALL RIGHTS RESERVED
* Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
*/
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.BaseAppointmentView = void 0;
var _message = _interopRequireDefault(require("../../../../common/core/localization/message"));
var _component_registrator = _interopRequireDefault(require("../../../../core/component_registrator"));
var _renderer = _interopRequireDefault(require("../../../../core/renderer"));
var _events_engine = _interopRequireDefault(require("../../../../events/core/events_engine"));
var _utils = require("../../../../events/utils");
var _m_element = require("../../../core/m_element");
var _m_empty_template = require("../../../core/templates/m_empty_template");
var _m_function_template = require("../../../core/templates/m_function_template");
var _m_short = require("../../../events/m_short");
var _const = require("../const");
var _get_date_text = require("../utils/get_date_text");
var _view_item = require("../view_item");
function _interopRequireDefault(e) {
return e && e.__esModule ? e : {
default: e
}
}
const DOUBLE_CLICK_EVENT_NAME = (0, _utils.addNamespace)("dxdblclick", _view_item.EVENTS_NAMESPACE.namespace);
class BaseAppointmentView extends _view_item.ViewItem {
get targetedAppointmentData() {
return this.option().targetedAppointmentData
}
get appointmentData() {
return this.option().appointmentData
}
_setOptionsByReference() {
super._setOptionsByReference();
this._optionsByReference = Object.assign({}, this._optionsByReference, {
appointmentData: true,
targetedAppointmentData: true
})
}
_init() {
super._init();
this.defaultAppointmentTemplate = new _m_function_template.FunctionTemplate(options => {
this.defaultAppointmentContent((0, _renderer.default)(options.container))
})
}
_initMarkup() {
super._initMarkup();
this.resize();
this.applyElementClasses();
this.applyAria();
this.attachFocusEvents();
this.attachClickEvent();
this.attachDblClickEvent();
this.attachKeydownEvents();
this.renderContentTemplate()
}
_dispose() {
super._dispose();
_m_short.dxClick.off(this.$element(), _view_item.EVENTS_NAMESPACE);
_events_engine.default.off(this.$element(), DOUBLE_CLICK_EVENT_NAME)
}
applyElementClasses() {
this.$element().addClass(_const.APPOINTMENT_CLASSES.CONTAINER).toggleClass(_const.APPOINTMENT_TYPE_CLASSES.RECURRING, this.isRecurring()).toggleClass(_const.APPOINTMENT_TYPE_CLASSES.ALL_DAY, this.isAllDay())
}
applyAria() {
this.$element().attr("role", "button").attr("tabindex", this.option().tabIndex)
}
attachClickEvent() {
_m_short.dxClick.off(this.$element(), _view_item.EVENTS_NAMESPACE);
_m_short.dxClick.on(this.$element(), event => this.option().onClick(this, event), _view_item.EVENTS_NAMESPACE)
}
attachDblClickEvent() {
_events_engine.default.off(this.$element(), DOUBLE_CLICK_EVENT_NAME);
_events_engine.default.on(this.$element(), DOUBLE_CLICK_EVENT_NAME, event => this.option().onDblClick(this, event))
}
onFocusIn() {
this.$element().addClass(_const.FOCUSED_STATE_CLASS);
super.onFocusIn()
}
onFocusOut(e) {
this.$element().removeClass(_const.FOCUSED_STATE_CLASS);
super.onFocusOut(e)
}
setTabIndex(tabIndex) {
super.setTabIndex(tabIndex);
this.$element().attr("tabindex", tabIndex ?? null)
}
getTitleText() {
const dataAccessor = this.option().getDataAccessor();
const titleText = dataAccessor.get("text", this.targetedAppointmentData);
if (!titleText) {
return _message.default.format("dxScheduler-noSubject")
}
return titleText
}
getDateText() {
const dateText = (0, _get_date_text.getDateTextFromTargetAppointment)(this.targetedAppointmentData, this.isAllDay() ? _get_date_text.DateFormatType.DATE : _get_date_text.DateFormatType.TIME);
return dateText
}
isRecurring() {
const dataAccessor = this.option().getDataAccessor();
const recurrenceRule = dataAccessor.get("recurrenceRule", this.targetedAppointmentData);
return Boolean(recurrenceRule)
}
isAllDay() {
const dataAccessor = this.option().getDataAccessor();
const allDay = dataAccessor.get("allDay", this.targetedAppointmentData);
return Boolean(allDay)
}
renderContentTemplate() {
const $content = (0, _renderer.default)("<div>").addClass(_const.APPOINTMENT_CLASSES.CONTENT).appendTo(this.$element());
const template = this.option().appointmentTemplate instanceof _m_empty_template.EmptyTemplate ? this.defaultAppointmentTemplate : this.option().appointmentTemplate;
template.render({
container: (0, _m_element.getPublicElement)($content),
model: {
appointmentData: this.appointmentData,
targetedAppointmentData: this.targetedAppointmentData
},
index: this.option().index,
onRendered: () => {
this.option().onRendered({
appointmentElement: (0, _m_element.getPublicElement)(this.$element()),
appointmentData: this.appointmentData,
targetedAppointmentData: this.targetedAppointmentData
})
}
})
}
defaultAppointmentContent($container) {
return $container
}
}
exports.BaseAppointmentView = BaseAppointmentView;
(0, _component_registrator.default)("dxSchedulerNewAppointment", BaseAppointmentView);