snapshot of https://github.com/espocrm/espocrm.git (master, 2026-09-18; blobs > 131072B omitted)

client/modules/crm/src/views/calendar/modals/edit-view.js

@@ -0,0 +1,299 @@
+/************************************************************************
+ * This file is part of EspoCRM.
+ *
+ * EspoCRM – Open Source CRM application.
+ * Copyright (C) 2014-2026 EspoCRM, Inc.
+ * Website: https://www.espocrm.com
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program. If not, see <https://www.gnu.org/licenses/>.
+ *
+ * The interactive user interfaces in modified source and object code versions
+ * of this program must display Appropriate Legal Notices, as required under
+ * Section 5 of the GNU Affero General Public License version 3.
+ *
+ * In accordance with Section 7(b) of the GNU Affero General Public License version 3,
+ * these Appropriate Legal Notices must retain the display of the "EspoCRM" word.
+ ************************************************************************/
+
+import ModalView from 'views/modal';
+import Model from 'model';
+import EditForModalRecordView from 'views/record/edit-for-modal';
+import EnumFieldView from 'views/fields/enum';
+import VarcharFieldView from 'views/fields/varchar';
+import CalendarSharedViewTeamsFieldView from 'crm:views/calendar/fields/teams';
+
+export default class CalendarEditViewModal extends ModalView {
+
+    // language=Handlebars
+    templateContent = `
+        <div class="record-container no-side-margin">{{{record}}}</div>
+    `
+
+    className = 'dialog dialog-record'
+
+    /**
+     * @private
+     * @type {EditForModalRecordView}
+     */
+    recordView
+
+    /**
+     * @param {{
+     *     afterSave?: function({id: string}): void,
+     *     afterRemove?: function(): void,
+     *     id?: string,
+     * }} options
+     */
+    constructor(options) {
+        super();
+
+        this.options = options;
+    }
+
+    setup() {
+        const id = this.options.id;
+
+        this.buttonList = [
+            {
+                name: 'cancel',
+                label: 'Cancel',
+                onClick: () => this.actionCancel(),
+            },
+        ];
+
+        this.isNew = !id;
+
+        const calendarViewDataList = this.getPreferences().get('calendarViewDataList') || [];
+
+        if (this.isNew) {
+            this.buttonList.unshift({
+                name: 'save',
+                label: 'Create',
+                style: 'danger',
+                onClick: () => this.actionSave(),
+            });
+        } else {
+            this.dropdownItemList.push({
+                name: 'remove',
+                label: 'Remove',
+                onClick: () => this.actionRemove(),
+            });
+
+            this.buttonList.unshift({
+                name: 'save',
+                label: 'Save',
+                style: 'primary',
+                onClick: () => this.actionSave(),
+            });
+        }
+
+        const model = new Model();
+
+        model.name = 'CalendarView';
+
+        const modelData = {};
+
+        if (!this.isNew) {
+            calendarViewDataList.forEach(item => {
+                if (id === item.id) {
+                    modelData.teamsIds = item.teamIdList || [];
+                    modelData.teamsNames = item.teamNames || {};
+                    modelData.id = item.id;
+                    modelData.name = item.name;
+                    modelData.mode = item.mode;
+                }
+            });
+        } else {
+            modelData.name = this.translate('Shared', 'labels', 'Calendar');
+
+            let foundCount = 0;
+
+            calendarViewDataList.forEach(item => {
+                if (item.name.indexOf(modelData.name) === 0) {
+                    foundCount++;
+                }
+            });
+
+            if (foundCount) {
+                modelData.name += ' ' + foundCount;
+            }
+
+            modelData.id = id;
+
+            modelData.teamsIds = this.getUser().get('teamsIds') || [];
+            modelData.teamsNames = this.getUser().get('teamsNames') || {};
+        }
+
+        model.set(modelData);
+
+        this.recordView = new EditForModalRecordView({
+            model: model,
+            detailLayout: [
+                {
+                    rows: [
+                        [
+                            {
+                                view: new VarcharFieldView({
+                                    name: 'name',
+                                    labelText: this.translate('name', 'fields'),
+                                    params: {
+                                        required: true,
+                                    },
+                                })
+                            },
+                            {
+                                view: new EnumFieldView({
+                                    name: 'mode',
+                                    labelText: this.translate('mode', 'fields', 'DashletOptions'),
+                                    params: {
+                                        translation: 'DashletOptions.options.mode',
+                                        options: this.getMetadata().get('clientDefs.Calendar.sharedViewModeList') || [],
+                                    },
+                                })
+                            }
+                        ],
+                        [
+                            {
+                                view: new CalendarSharedViewTeamsFieldView({
+                                    name: 'teams',
+                                    labelText: this.translate('teams', 'fields'),
+                                    params: {
+                                        required: true
+                                    },
+                                })
+                            },
+                            false
+                        ]
+                    ]
+                }
+            ]
+        });
+
+        this.assignView('record', this.recordView);
+
+        if (this.isNew) {
+            this.headerText = this.translate('Create Shared View', 'labels', 'Calendar');
+        } else {
+            this.headerText = this.translate('Edit Shared View', 'labels', 'Calendar') + ' · ' +
+                modelData.name;
+        }
+    }
+
+    async actionSave() {
+        if (this.recordView.validate()) {
+            return;
+        }
+
+        const modelData = this.recordView.fetch();
+
+        const calendarViewDataList = this.getPreferences().get('calendarViewDataList') || [];
+
+        const data = {
+            name: modelData.name,
+            teamIdList: modelData.teamsIds,
+            teamNames: modelData.teamsNames,
+            mode: modelData.mode,
+            id: undefined,
+        };
+
+        if (this.isNew) {
+            data.id = Math.random().toString(36).substring(2, 12);
+
+            calendarViewDataList.push(data);
+        } else {
+            data.id = this.getView('record').model.id;
+
+            calendarViewDataList.forEach((item, i) => {
+                if (item.id === data.id) {
+                    calendarViewDataList[i] = data;
+                }
+            });
+        }
+
+        Espo.Ui.notify(this.translate('saving', 'messages'));
+
+        this.disableButton('save');
+        this.disableButton('remove');
+
+        try {
+            await this.getPreferences().save(
+                {
+                    calendarViewDataList: calendarViewDataList,
+                },
+                {patch: true}
+            )
+        } catch (e) {
+            this.enableButton('remove');
+            this.enableButton('save');
+
+            return;
+        }
+
+        Espo.Ui.notify();
+
+        this.trigger('after:save', data);
+
+        if (this.options.afterSave) {
+            this.options.afterSave(data);
+        }
+
+        this.close();
+    }
+
+    async actionRemove() {
+        await this.confirm(this.translate('confirmation', 'messages'));
+
+        this.disableButton('save');
+        this.disableButton('remove');
+
+        const id = this.options.id;
+
+        if (!id) {
+            return;
+        }
+
+        const newCalendarViewDataList = [];
+
+        const calendarViewDataList = this.getPreferences().get('calendarViewDataList') || [];
+
+        calendarViewDataList.forEach(item => {
+            if (item.id !== id) {
+                newCalendarViewDataList.push(item);
+            }
+        });
+
+        Espo.Ui.notifyWait();
+
+        try {
+            await this.getPreferences().save({
+                calendarViewDataList: newCalendarViewDataList,
+            }, {patch: true})
+        } catch (e) {
+            this.enableButton('remove');
+            this.enableButton('save');
+
+            return;
+        }
+
+        Espo.Ui.notify();
+
+        this.trigger('after:remove');
+
+        if (this.options.afterRemove) {
+            this.options.afterRemove();
+        }
+
+        this.close();
+    }
+}

client/modules/crm/src/views/calendar/modals/edit.js

@@ -0,0 +1,280 @@
+/************************************************************************
+ * This file is part of EspoCRM.
+ *
+ * EspoCRM – Open Source CRM application.
+ * Copyright (C) 2014-2026 EspoCRM, Inc.
+ * Website: https://www.espocrm.com
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program. If not, see <https://www.gnu.org/licenses/>.
+ *
+ * The interactive user interfaces in modified source and object code versions
+ * of this program must display Appropriate Legal Notices, as required under
+ * Section 5 of the GNU Affero General Public License version 3.
+ *
+ * In accordance with Section 7(b) of the GNU Affero General Public License version 3,
+ * these Appropriate Legal Notices must retain the display of the "EspoCRM" word.
+ ************************************************************************/
+
+import EditModalView from 'views/modals/edit';
+
+class CalenderEditModalView extends EditModalView {
+
+    template = 'crm:calendar/modals/edit'
+
+    scopeList = [
+        'Meeting',
+        'Call',
+        'Task',
+    ]
+
+    data() {
+        return {
+            scopeList: this.scopeList,
+            scope: this.scope,
+            isNew: !(this.id),
+        };
+    }
+
+    additionalEvents = {
+        /** @this CalenderEditModalView */
+        'change .scope-switcher input[name="scope"]': function () {
+            Espo.Ui.notifyWait();
+
+            const prevScope = this.scope;
+
+            const scope = $('.scope-switcher input[name="scope"]:checked').val();
+            this.scope = scope;
+
+            this.getModelFactory().create(this.scope, model => {
+                model.populateDefaults();
+
+                let attributes = this.getRecordView().fetch();
+
+                attributes = {...attributes, ...this.getRecordView().model.getClonedAttributes()};
+
+                this.filterAttributesForEntityType(attributes, scope, prevScope);
+
+                model.set(attributes);
+
+                this.model = model;
+
+                this.createRecordView(model, (view) => {
+                    view.render();
+                    view.notify(false);
+                });
+
+                this.handleAccess(model);
+            });
+        },
+    }
+
+    /**
+     * @param {Record} attributes
+     * @param {string} entityType
+     * @param {string} previousEntityType
+     */
+    filterAttributesForEntityType(attributes, entityType, previousEntityType) {
+        if (entityType === 'Task' || previousEntityType === 'Task') {
+            delete attributes.reminders;
+        }
+
+        this.getHelper()
+            .fieldManager
+            .getEntityTypeFieldList(entityType, {type: 'enum'})
+            .forEach(field => {
+                if (!(field in attributes)) {
+                    return;
+                }
+
+                const options = this.getMetadata().get(['entityDefs', entityType, 'fields', field, 'options']) || [];
+
+                const value = attributes[field];
+
+                if (!~options.indexOf(value)) {
+                    delete attributes[field];
+                }
+            });
+    }
+
+    createRecordView(model, callback) {
+        if (!this.id && !this.dateIsChanged) {
+            if (this.options.dateStart && this.options.dateEnd) {
+                this.model.set('dateStart', this.options.dateStart);
+                this.model.set('dateEnd', this.options.dateEnd);
+            }
+
+            if (this.options.allDay) {
+                const allDayScopeList = this.getMetadata().get('clientDefs.Calendar.allDayScopeList') || [];
+
+                if (~allDayScopeList.indexOf(this.scope)) {
+                    this.model.set('dateStart', null);
+                    this.model.set('dateEnd', null);
+                    this.model.set('dateStartDate', null);
+                    this.model.set('dateEndDate', this.options.dateEndDate);
+
+                    if (this.options.dateEndDate !== this.options.dateStartDate) {
+                        this.model.set('dateStartDate', this.options.dateStartDate);
+                    }
+                }
+                else if (this.getMetadata().get(['entityDefs', this.scope, 'fields', 'dateStartDate'])) {
+                    this.model.set('dateStart', null);
+                    this.model.set('dateEnd', null);
+                    this.model.set('dateStartDate', this.options.dateStartDate);
+                    this.model.set('dateEndDate', this.options.dateEndDate);
+                    this.model.set('isAllDay', true);
+                }
+                else {
+                    this.model.set('isAllDay', false);
+                    this.model.set('dateStartDate', null);
+                    this.model.set('dateEndDate', null);
+                }
+            }
+        }
+
+        this.listenTo(this.model, 'change:dateStart', (m, value, o) => {
+            if (o.ui) {
+                this.dateIsChanged = true;
+            }
+        });
+
+        this.listenTo(this.model, 'change:dateEnd', (m, value, o) => {
+            if (o.ui || o.updatedByDuration) {
+                this.dateIsChanged = true;
+            }
+        });
+
+
+        super.createRecordView(model, callback);
+    }
+
+    handleAccess(model) {
+        if (
+            this.id &&
+            !this.getAcl().checkModel(model, 'edit') || !this.id &&
+            !this.getAcl().checkModel(model, 'create')
+        ) {
+            this.hideButton('save');
+            this.hideButton('fullForm');
+
+            this.$el.find('button[data-name="save"]').addClass('hidden');
+            this.$el.find('button[data-name="fullForm"]').addClass('hidden');
+        }
+        else {
+            this.showButton('save');
+            this.showButton('fullForm');
+        }
+
+        if (!this.getAcl().checkModel(model, 'delete')) {
+            this.hideButton('remove');
+        } else {
+            this.showButton('remove');
+        }
+    }
+
+    afterRender() {
+        super.afterRender();
+
+        if (this.hasView('edit')) {
+            const model = this.getView('edit').model;
+
+            if (model) {
+                this.handleAccess(model);
+            }
+        }
+    }
+
+    setup() {
+        this.events = {
+            ...this.additionalEvents,
+            ...this.events,
+        };
+
+        this.scopeList = Espo.Utils.clone(this.options.scopeList || this.scopeList);
+        this.enabledScopeList = this.options.enabledScopeList || this.scopeList;
+
+        if (!this.options.id && !this.options.scope) {
+            const scopeList = [];
+
+            this.scopeList.forEach((scope) => {
+                if (this.getAcl().check(scope, 'create')) {
+                    if (~this.enabledScopeList.indexOf(scope)) {
+                        scopeList.push(scope);
+                    }
+                }
+            });
+
+            this.scopeList = scopeList;
+
+            const calendarDefaultEntity = scopeList[0];
+
+            if (calendarDefaultEntity && ~this.scopeList.indexOf(calendarDefaultEntity)) {
+                this.options.scope = calendarDefaultEntity;
+            } else {
+                this.options.scope = this.scopeList[0] || null;
+            }
+
+            if (this.scopeList.length === 0) {
+                this.remove();
+                return;
+            }
+        }
+
+        super.setup();
+
+        if (!this.id) {
+            this.$header = $('<a>')
+                .attr('title', this.translate('Full Form'))
+                .attr('role', 'button')
+                .attr('data-action', 'fullForm')
+                .addClass('action')
+                .text(this.translate('Create', 'labels', 'Calendar'));
+        }
+
+        if (this.id) {
+            this.buttonList.splice(1, 0, {
+                name: 'remove',
+                text: this.translate('Remove'),
+                onClick: () => this.actionRemove(),
+            });
+        }
+
+        this.once('after:save', () => {
+            this.$el.find('.scope-switcher').remove();
+        })
+    }
+
+    actionRemove() {
+        const model = this.getView('edit').model;
+
+        this.confirm(this.translate('removeRecordConfirmation', 'messages'), () => {
+            const $buttons = this.dialog.$el.find('.modal-footer button');
+
+            $buttons.addClass('disabled');
+
+            model.destroy()
+                .then(() => {
+                    this.trigger('after:delete', model);
+
+                    this.dialog.close();
+                })
+                .catch(() => {
+                    $buttons.removeClass('disabled');
+                });
+        });
+    }
+
+    setupActionItems() {}
+}
+
+export default CalenderEditModalView;

client/modules/crm/src/views/calendar/modals/shared-options.js

@@ -0,0 +1,144 @@
+/************************************************************************
+ * This file is part of EspoCRM.
+ *
+ * EspoCRM – Open Source CRM application.
+ * Copyright (C) 2014-2026 EspoCRM, Inc.
+ * Website: https://www.espocrm.com
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program. If not, see <https://www.gnu.org/licenses/>.
+ *
+ * The interactive user interfaces in modified source and object code versions
+ * of this program must display Appropriate Legal Notices, as required under
+ * Section 5 of the GNU Affero General Public License version 3.
+ *
+ * In accordance with Section 7(b) of the GNU Affero General Public License version 3,
+ * these Appropriate Legal Notices must retain the display of the "EspoCRM" word.
+ ************************************************************************/
+
+import ModalView from 'views/modal';
+import Model from 'model';
+import EditForModalRecordView from 'views/record/edit-for-modal';
+import CalendarUsersFieldView from 'crm:views/calendar/fields/users';
+
+export default class TimelineSharedOptionsModalView extends ModalView {
+
+    className = 'dialog dialog-record'
+
+    templateContent = `
+        <div class="record-container no-side-margin">{{{record}}}</div>
+    `
+
+    /**
+     * @private
+     * @type {EditForModalRecordView}
+     */
+    recordView
+
+    /**
+     *
+     * @param {{
+     *     users: {id: string, name: string}[],
+     *     onApply: function({
+     *         users: {id: string, name: string}[],
+     *     }),
+     * }} options
+     */
+    constructor(options) {
+        super(options);
+
+        this.options = options;
+    }
+
+    setup() {
+        this.buttonList = [
+            {
+                name: 'save',
+                label: 'Save',
+                style: 'primary',
+                onClick: () => this.actionSave(),
+            },
+            {
+                name: 'cancel',
+                label: 'Cancel',
+                onClick: () => this.actionClose(),
+            },
+        ];
+
+        this.headerText = this.translate('timeline', 'modes', 'Calendar') + ' · ' +
+            this.translate('Shared Mode Options', 'labels', 'Calendar')
+
+        const users = this.options.users;
+
+        const userIdList = [];
+        const userNames = {};
+
+        users.forEach(item => {
+            userIdList.push(item.id);
+
+            userNames[item.id] = item.name;
+        });
+
+        this.model = new Model({
+            usersIds: userIdList,
+            usersNames: userNames,
+        });
+
+        this.recordView = new EditForModalRecordView({
+            model: this.model,
+            detailLayout: [
+                {
+                    rows: [
+                        [
+                            {
+                                view: new CalendarUsersFieldView({
+                                    name: 'users',
+                                }),
+                            },
+                            false
+                        ]
+                    ]
+                }
+            ]
+        });
+
+        this.assignView('record', this.recordView);
+    }
+
+    /**
+     * @private
+     */
+    actionSave() {
+        const data = this.recordView.processFetch();
+
+        if (this.recordView.validate()) {
+            return;
+        }
+
+        /** @type {{id: string, name: string}[]} */
+        const users = [];
+
+        const userIds = this.model.attributes.usersIds || [];
+
+        userIds.forEach(id => {
+            users.push({
+                id: id,
+                name: (data.usersNames || {})[id] || id
+            });
+        });
+
+        this.options.onApply({users: users})
+
+        this.close();
+    }
+}