trikoder · niksy · Nov 12, 2024 · Nov 8, 2024 · Nov 12, 2024
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -3,9 +3,6 @@ on:
   push:
     branches:
       - master
-  pull_request:
-    branches:
-      - master
 jobs:
   Documentation:
     permissions:

diff --git a/documentation/changelog.md b/documentation/changelog.md
@@ -1,5 +1,8 @@
 # Changelog
 
+## 0.83.0
+* Allow opening in new tab for common controls
+
 ## 0.82.0
 * Use proper close icon reference
 * Add style presentation as buttton for mass action with only one option

diff --git a/src/js/components/mainNavigation.vue b/src/js/components/mainNavigation.vue
@@ -28,7 +28,7 @@
                                     :href="item.url"
                                     :class="['item', item.icon ? 'icon' + item.icon : '', {selected: item.selected}]"
                                     :title="item.caption"
-                                    @click.prevent="openItem(item)"
+                                    @click="openItem(item, $event)"
                                 >
                                     {{ item.caption }}
                                     <span v-if="!item.icon" class="initials">{{ item.initials }}</span>
@@ -57,7 +57,7 @@
                                             :href="subItem.url"
                                             :class="['item', {selected: subItem.selected}]"
                                             :title="subItem.caption"
-                                            @click.prevent="openItem(subItem)"
+                                            @click="openItem(subItem, $event)"
                                         >
                                             {{ subItem.caption }}
                                         </a>
@@ -83,7 +83,7 @@
                             class="item"
                             :href="item.url"
                             v-html="item.caption"
-                            @click.prevent="openUserItem(item)"
+                            @click="openUserItem(item, $event)"
                         ></a>
                         <button
                             v-else
@@ -107,7 +107,7 @@
 </template>
 
 <script>
-import {pickTo} from '../library/toolkit.js';
+import {pickTo, isNewTabClick} from '../library/toolkit.js';
 import vueDismiss from '../dependencies/vue-dismiss/index.js';
 import serviceContainer from '../library/serviceContainer.js';
 import {GlobalEvents} from 'vue-global-events';
@@ -234,7 +234,15 @@ export default {
 
         },
 
-        openItem(item) {
+        openItem(item, event) {
+
+            if (isNewTabClick(event)) {
+                return;
+            }
+
+            if (event) {
+                event.preventDefault();
+            }
 
             if (item.action) {
                 item.action(this);
@@ -288,7 +296,15 @@ export default {
 
         },
 
-        openUserItem(item) {
+        openUserItem(item, event) {
+
+            if (isNewTabClick(event)) {
+                return;
+            }
+
+            if (event) {
+                event.preventDefault();
+            }
 
             if (item.action) {
                 item.action(this);

diff --git a/src/js/components/resourceControls.vue b/src/js/components/resourceControls.vue
@@ -1,9 +1,8 @@
 <template>
     <nav class="resourceControls" v-if="parsedControls.length">
-        <template v-for="(control, index) in parsedControls">
+        <template v-for="(control, index) in parsedControls" :key="control.caption + index">
             <div
                 v-if="control.isDropdown"
-                :key="control.caption + index"
                 class="dropdownControls"
                 :class="{active: control.active, accentedAdjecent: control.accentedAdjecent}"
                 v-on-dismiss="{callback: () => closeDropdown(control), watch: control.active}"
@@ -31,21 +30,19 @@
             <a
                 v-else-if="control.url"
                 :href="control.url"
-                :key="control.caption + index"
                 :class="control.className"
                 :title="control.caption"
-                @click.prevent="runControlAction(control)"
+                @click="runControlAction(control, $event)"
             >
               <span>{{ control.caption }}</span>
             </a>
             <button
                 v-else
                 class="nBtn"
                 type="button"
-                :key="control.caption + index"
                 :class="control.className"
                 :title="control.caption"
-                @click.prevent="runControlAction(control)"
+                @click="runControlAction(control, $event)"
             >
                 <span>{{ control.caption }}</span>
             </button>
@@ -56,7 +53,7 @@
 <script>
 
 import translate from '../library/translate.js';
-import {assign} from '../library/toolkit.js';
+import {assign, isNewTabClick} from '../library/toolkit.js';
 import vueDismiss from '../dependencies/vue-dismiss/index.js';
 import screenSize from '../mixins/screenSize.js';
 
@@ -119,9 +116,16 @@ export default {
 
         },
 
-        runControlAction(config) {
+        runControlAction(config, event) {
 
-            config.action.call(config.actionContext);
+            if (isNewTabClick(event)) {
+                // do nothing
+            } else {
+                if (event) {
+                    event.preventDefault();
+                }
+                config.action.call(config.actionContext);
+            }
 
         },
 

diff --git a/src/js/components/resourceHeader.vue b/src/js/components/resourceHeader.vue
@@ -2,19 +2,17 @@
     <header class="headerType1" :class={hasBottomBorder}>
         <h1 class="projectCaption">{{ projectCaption }}</h1>
         <h2 v-if="breadcrumbs.length" class="title">
-            <template v-for="(breadcrumb, index) in breadcrumbs">
+            <template v-for="(breadcrumb, index) in breadcrumbs" :key="breadcrumb.caption">
                 <a
                     v-if="breadcrumb.url"
-                    :key="breadcrumb.caption"
                     :href="breadcrumb.url"
                     :class="{iconChevronRight: index + 1 < breadcrumbs.length}"
-                    @click.prevent="clickBreadcrumb(breadcrumb)"
+                    @click="clickBreadcrumb(breadcrumb, $event)"
                 >
                     {{ breadcrumb.caption }}
                 </a>
                 <span
                     v-else
-                    :key="breadcrumb.caption"
                     :class="{iconChevronRight: index + 1 < breadcrumbs.length}"
                 >
                     {{ breadcrumb.caption }}
@@ -26,6 +24,7 @@
 </template>
 
 <script>
+import {isNewTabClick} from '../library/toolkit.js';
 
 export default {
 
@@ -46,11 +45,15 @@ export default {
 
     methods: {
 
-        clickBreadcrumb(breadcrumb) {
+        clickBreadcrumb(breadcrumb, e) {
 
-            if (breadcrumb.action) {
+            if (isNewTabClick(e)) {
+                // do nothing
+            } else if (breadcrumb.action) {
+                e.preventDefault();
                 breadcrumb.action();
             } else if (breadcrumb.url) {
+                e.preventDefault();
                 this.$router.navigateTo(breadcrumb.url);
             }
 

diff --git a/src/js/components/resourcePagination.vue b/src/js/components/resourcePagination.vue
@@ -27,7 +27,7 @@
                     v-if="currentPage !== 1"
                     class="iconArrowLeft icon page icr"
                     :href="getUrlForPage(currentPage - 1)"
-                    @click.prevent="selectPage(currentPage - 1)"
+                    @click="selectPage(currentPage - 1, $event)"
                 >
                     {{ currentPage - 1 }}
                 </a>
@@ -38,7 +38,7 @@
                 <a
                     :class="['page', {selected: 1 == currentPage}]"
                     :href="getUrlForPage(1)"
-                    @click.prevent="selectPage(1)"
+                    @click="selectPage(1, $event)"
                 >1</a>
             </li>
 
@@ -51,7 +51,7 @@
                     <a
                         :class="['page', {selected: page == currentPage}]"
                         :href="getUrlForPage(page)"
-                        @click.prevent="selectPage(page)"
+                        @click="selectPage(page, $event)"
                     >{{ page }}</a>
                 </li>
 
@@ -64,7 +64,7 @@
                 <a
                     :class="['page', {selected: totalPages === currentPage}]"
                     :href="getUrlForPage(totalPages)"
-                    @click.prevent="selectPage(totalPages)"
+                    @click="selectPage(totalPages, $event)"
                 >{{ totalPages }}</a>
             </li>
 
@@ -73,7 +73,7 @@
                     v-if="currentPage < totalPages"
                     class="iconArrowRight page icon icr"
                     :href="getUrlForPage(currentPage + 1)"
-                    @click.prevent="selectPage(currentPage + 1)"
+                    @click="selectPage(currentPage + 1, $event)"
                 >{{ currentPage + 1 }}
                 </a>
                 <button v-else class="iconArrowRight disabled icon icr"></button>
@@ -88,7 +88,7 @@
 
 import userPreferences from '../library/userPreferences.js';
 import translate from '../library/translate.js';
-import {range} from '../library/toolkit.js';
+import {range, isNewTabClick} from '../library/toolkit.js';
 import bootData from '../library/bootData.js';
 import screenSize from '../mixins/screenSize.js';
 
@@ -172,9 +172,16 @@ const Pagination = {
 
         },
 
-        selectPage(page) {
+        selectPage(page, event) {
 
-            this.$emit('pageRequest', page);
+            if (isNewTabClick(event)) {
+                // do nothing
+            } else {
+                if (event) {
+                    event.preventDefault();
+                }
+                this.$emit('pageRequest', page);
+            }
 
         }
 

diff --git a/src/js/layouts/adminDefault.vue b/src/js/layouts/adminDefault.vue
@@ -110,7 +110,7 @@ export default {
                         this.currentControllerType = ControllerType;
                     }
 
-                    if (controller.method) {
+                    if (controller.method && this.$refs.currentController[controller.method]) {
 
                         this.$nextTick(() => {
                             this.$refs.currentController[controller.method](

diff --git a/src/js/library/toolkit.js b/src/js/library/toolkit.js
@@ -329,3 +329,9 @@ export function getComponentInitialValue(Component, options = {}) {
     }
 
 }
+
+export function isNewTabClick(event) {
+    return event
+        ? Boolean(event.ctrlKey || event.metaKey || event.which === 2)
+        : false;
+}
diff --git a/src/js/listElements/link.vue b/src/js/listElements/link.vue
@@ -12,7 +12,7 @@
 <script>
 
 import base from './base.js';
-import {result} from '../library/toolkit.js';
+import {result, isNewTabClick} from '../library/toolkit.js';
 
 export default {
 
@@ -52,7 +52,9 @@ export default {
 
         handleClick(e) {
 
-            if (this.action) {
+            if (isNewTabClick(e)) {
+                // do nothing
+            } else if (this.action) {
                 e.preventDefault();
                 this.action(this.resourceModel, e);
             } else if (!this.isExternalLink) {
@@ -65,7 +67,6 @@ export default {
     }
 
 };
-
 </script>
 
 <style lang="scss" scoped>