85004

app/Treo/Resources/metadata/app/clientClassReplaceMap.json

@@ -212,6 +212,9 @@
   "views/edit": [
     "treo-core"
   ],
+  "views/modals/detail": [
+    "treo-core"
+  ],
   "views/modals/edit": [
     "treo-core"
   ],

client/modules/treo-core/css/treo/treo-dark-theme.css

@@ -19233,9 +19233,15 @@ ul.dropdown-menu > li.checkbox {
 
 .page-header .header-buttons .filter-cell .field .selected-element {
     cursor: default;
-    -moz-appearance: menulist;
-    -webkit-appearance: menulist;
     padding: 6px 12px 6px 6px;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    appearance: none;
+    background-image: url(../../img/arrow-down.png) !important;
+    background-position: center right 5px;
+    background-repeat: no-repeat;
+    background-size: 12px;
+    padding-right: 20px !important;
 }
 
 .page-header .header-buttons .filter-cell .field .selected-element span {
@@ -19829,6 +19835,65 @@ button.category:focus {
 }
 
 @media screen and (max-width: 767px) {
+    html, body {
+        height: 100%;
+    }
+
+    body {
+        height: calc(100% - 44px);
+    }
+
+    .container.content {
+        height: calc(100% + calc(44px - 28px))
+    }
+
+    header + .container.content {
+        height: auto;
+        min-height: calc(100% - 28px);
+    }
+
+    #navbar > div > div.navbar-header > a > img {
+        padding: 5px 5px 5px 0;
+    }
+
+    #main .catalog-tree-panel-hidden > button.collapse-panel {
+        z-index: auto;
+    }
+
+    .record .detail .bottom .panel .group-container {
+        margin: 0 -14px;
+    }
+
+    .record .detail .panel .panel-heading {
+        height: 28px !important;
+    }
+
+    .record .detail .bottom .panel .panel-heading > .btn-group {
+        top: -5px;
+    }
+
+    .record .detail .panel .panel-body.panel-collapse.collapse.in > .list-container {
+        position: relative;
+        top: -7px;
+        padding-top: 7px;
+    }
+
+    .record .detail .panel .panel-body.panel-body-form .form-group {
+        margin-top: 5px;
+    }
+
+    .overview.col-md-8 .panel-body.panel-body-form {
+        padding: 5px 0;
+    }
+
+    .side > .panel.panel-default {
+        margin: 0 -15px;
+    }
+
+    .side > .panel.panel-default .panel-heading {
+        margin: 0;
+    }
+
     #content {
         margin-top: 44px;
     }
@@ -21100,64 +21165,3 @@ select {
     box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.175);
     background-color: white;
 }
-
-@media screen and (max-width: 767px) {
-    html, body {
-        height: 100%;
-    }
-
-    body {
-        height: calc(100% - 44px);
-    }
-
-    .container.content {
-        height: calc(100% + calc(44px - 28px))
-    }
-
-    header + .container.content {
-        height: auto;
-        min-height: calc(100% - 28px);
-    }
-
-    #navbar > div > div.navbar-header > a > img {
-        padding: 5px 5px 5px 0;
-    }
-
-    #main .catalog-tree-panel-hidden > button.collapse-panel {
-        z-index: auto;
-    }
-
-    .record .detail .bottom .panel .group-container {
-        margin: 0px -14px;
-    }
-
-    .record .detail .panel .panel-heading {
-        height: 28px !important;
-    }
-
-    .record .detail .bottom .panel .panel-heading > .btn-group {
-        top: -5px;
-    }
-
-    .record .detail .panel .panel-body.panel-collapse.collapse.in > .list-container {
-        position: relative;
-        top: -7px;
-        padding-top: 7px;
-    }
-
-    .record .detail .panel .panel-body.panel-body-form .form-group {
-        margin-top: 5px;
-    }
-
-    .overview.col-md-8 .panel-body.panel-body-form {
-        padding: 5px 0px;
-    }
-
-    .side > .panel.panel-default {
-        margin: 0px -15px;
-    }
-
-    .side > .panel.panel-default .panel-heading {
-        margin: 0;
-    }
-}

client/modules/treo-core/res/templates/fields/disposable-varchar/edit.tpl

@@ -0,0 +1,7 @@
+<div class="input-group">
+    <input type="text" class="form-control main-element" name="{{name}}" value="{{value}}" {{#if params.maxLength}} maxlength="{{params.maxLength}}"{{/if}}
+           autocomplete="off" placeholder="{{translate 'typeAndPressEnter' category='messages' scope='Global'}}">
+    <div class="input-group-btn">
+        <button type="button" class="btn btn-default btn-icon" data-name="{{name}}" data-action="removeField"><span class="fas fa-times"></span></button>
+    </div>
+</div>

client/modules/treo-core/src/view.js

@@ -92,5 +92,16 @@ Espo.define('treo-core:view', 'class-replace!treo-core:view',
             }
         },
 
+        getParentView(level) {
+            let parent = this;
+            level = parseInt(level) || 1;
+
+            for (let i = 0; i < level; i++) {
+                parent = Dep.prototype.getParentView.call(parent);
+            }
+
+            return parent;
+        }
+
     })
 );

client/modules/treo-core/src/views/detail.js

@@ -52,6 +52,12 @@ Espo.define('treo-core:views/detail', 'class-replace!treo-core:views/detail',
             return data;
         },
 
+        setup() {
+            this.headerView = this.getMetadata().get(['clientDefs', this.model.name, 'views', 'header']) || this.headerView;
+
+            Dep.prototype.setup.call(this);
+        },
+
         actionSelectRelatedEntity(data) {
             let link = data.link;
             let scope = data.scope || this.model.defs['links'][link].entity;

client/modules/treo-core/src/views/fields/disposable-varchar.js

@@ -0,0 +1,71 @@
+/*
+ * This file is part of EspoCRM and/or TreoCore, and/or KennerCore.
+ *
+ * EspoCRM - Open Source CRM application.
+ * Copyright (C) 2014-2020 Yuri Kuznetsov, Taras Machyshyn, Oleksiy Avramenko
+ * Website: http://www.espocrm.com
+ *
+ * TreoCore is EspoCRM-based Open Source application.
+ * Copyright (C) 2017-2020 TreoLabs GmbH
+ * Website: https://treolabs.com
+ *
+ * KennerCore is TreoCore-based Open Source application.
+ * Copyright (C) 2020 Kenner Soft Service GmbH
+ * Website: https://kennersoft.de
+ *
+ * KennerCore as well as TreoCore and EspoCRM is free software:
+ * you can redistribute it and/or modify it under the terms of
+ * the GNU General Public License as published by the Free Software Foundation,
+ * either version 3 of the License, or (at your option) any later version.
+ *
+ * KennerCore as well as TreoCore and EspoCRM 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 General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with EspoCRM. If not, see http://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 General Public License version 3.
+ *
+ * In accordance with Section 7(b) of the GNU General Public License version 3,
+ * these Appropriate Legal Notices must retain the display of
+ * the "KennerCore", "EspoCRM" and "TreoCore" words.
+ */
+
+Espo.define('treo-core:views/fields/disposable-varchar', 'views/fields/varchar',
+    Dep => Dep.extend({
+
+        editTemplate: 'treo-core:fields/disposable-varchar/edit',
+
+        events: {
+            'click [data-action="removeField"]': function (e) {
+                this.actionRemoveField();
+            },
+            'keypress .main-element': function (e) {
+                if (e.keyCode === 13) {
+                    let value = this.$element.val();
+                    if (this.params.trim || this.forceTrim) {
+                        if (typeof value.trim === 'function') {
+                            value = value.trim();
+                        }
+                    }
+                    this.trigger('value-saved', value);
+                }
+            }
+        },
+
+        setup() {
+            Dep.prototype.setup.call(this);
+
+            this.listenTo(this, 'disposable-close', () => this.actionRemoveField());
+            this.listenTo(this.model, 'disposable-close', () => this.actionRemoveField());
+        },
+
+        actionRemoveField() {
+            this.remove();
+        },
+    })
+);

client/modules/treo-core/src/views/modals/detail.js

@@ -0,0 +1,116 @@
+/*
+ * This file is part of EspoCRM and/or TreoCore, and/or KennerCore.
+ *
+ * EspoCRM - Open Source CRM application.
+ * Copyright (C) 2014-2020 Yuri Kuznetsov, Taras Machyshyn, Oleksiy Avramenko
+ * Website: http://www.espocrm.com
+ *
+ * TreoCore is EspoCRM-based Open Source application.
+ * Copyright (C) 2017-2020 TreoLabs GmbH
+ * Website: https://treolabs.com
+ *
+ * KennerCore is TreoCore-based Open Source application.
+ * Copyright (C) 2020 Kenner Soft Service GmbH
+ * Website: https://kennersoft.de
+ *
+ * KennerCore as well as TreoCore and EspoCRM is free software:
+ * you can redistribute it and/or modify it under the terms of
+ * the GNU General Public License as published by the Free Software Foundation,
+ * either version 3 of the License, or (at your option) any later version.
+ *
+ * KennerCore as well as TreoCore and EspoCRM 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 General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with EspoCRM. If not, see http://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 General Public License version 3.
+ *
+ * In accordance with Section 7(b) of the GNU General Public License version 3,
+ * these Appropriate Legal Notices must retain the display of
+ * the "KennerCore", "EspoCRM" and "TreoCore" words.
+ */
+
+Espo.define('treo-core:views/modals/detail', 'class-replace!treo-core:views/modals/detail',
+    Dep => Dep.extend({
+
+        createRecordView: function (callback) {
+            var model = this.model;
+            var scope = this.getScope();
+
+            this.header = '';
+            var iconHtml = this.getHelper().getScopeColorIconHtml(this.scope);
+
+            this.header += this.getLanguage().translate(scope, 'scopeNames');
+
+            if (model.get('name')) {
+                this.header += ' » ' + Handlebars.Utils.escapeExpression(model.get('name'));
+            }
+            if (!this.fullFormDisabled) {
+                this.header = '<a href="#' + scope + '/view/' + this.id+'" class="action" title="'+this.translate('Full Form')+'" data-action="fullForm">' + this.header + '</a>';
+            }
+
+            this.header = iconHtml + this.header;
+
+            if (!this.editDisabled) {
+                var editAccess = this.getAcl().check(model, 'edit', true);
+                if (editAccess) {
+                    this.showButton('edit');
+                } else {
+                    this.hideButton('edit');
+                    if (editAccess === null) {
+                        this.listenToOnce(model, 'sync', function() {
+                            if (this.getAcl().check(model, 'edit')) {
+                                this.showButton('edit');
+                            }
+                        }, this);
+                    }
+                }
+            }
+
+            if (!this.removeDisabled) {
+                var removeAccess = this.getAcl().check(model, 'delete', true);
+                if (removeAccess) {
+                    this.showButton('remove');
+                } else {
+                    this.hideButton('remove');
+                    if (removeAccess === null) {
+                        this.listenToOnce(model, 'sync', function() {
+                            if (this.getAcl().check(model, 'delete')) {
+                                this.showButton('remove');
+                            }
+                        }, this);
+                    }
+                }
+            }
+
+            var viewName =
+                this.detailViewName ||
+                this.detailView ||
+                this.getMetadata().get(['clientDefs', model.name, 'recordViews', 'detailSmall']) ||
+                this.getMetadata().get(['clientDefs', model.name, 'recordViews', 'detailQuick']) ||
+                'views/record/detail-small';
+            var options = {
+                model: model,
+                el: this.containerSelector + ' .record-container',
+                type: 'detailSmall',
+                layoutName: this.layoutName || 'detailSmall',
+                columnCount: this.columnCount,
+                buttonsDisabled: true,
+                inlineEditDisabled: true,
+                sideDisabled: this.sideDisabled,
+                bottomDisabled: this.bottomDisabled,
+                exit: function () {}
+            };
+            this.handleRecordViewOptions(options);
+            this.createView('record', viewName, options, callback);
+        },
+
+        handleRecordViewOptions: function (options) {},
+
+    })
+);