aloha-vue 1.0.110 → 1.0.112

package/docs/src/views/PageTable/PageTable.js

@@ -56,6 +56,12 @@ export default {
           hide: true,
           footerPath: "hola",
         },
+        {
+          label: "Slot",
+          id: "slot",
+          slot: "slot1",
+          // hide: true,
+        },
         {
           label: "Obj",
           id: "obj",
@@ -98,12 +104,7 @@ export default {
           path: "geld",
           footerPath: "geld",
         },
-        {
-          label: "Slot",
-          id: "slot",
-          slot: "slot1",
-          // hide: true,
-        },
+
         {
           label: "Slot2",
           id: "slot2",

package/docs/src/views/PageTable/PageTable.pug

@@ -24,7 +24,9 @@ div
     template(
       v-slot:slot1="vm"
     )
-      pre {{ vm.column }}
+      router-link(
+        :to="{ name: 'PageTabs' }"
+      ) Tabs
 
     template(
       v-slot:tableDetailsLabel="vm"

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "aloha-vue",
   "description": "Project aloha",
-  "version": "1.0.110",
+  "version": "1.0.112",
   "author": "Ilia Brykin",
   "scripts": {
     "build-icons": "node scriptsNode/iconsSvgToJs.js bootstrap3 && node scriptsNode/iconsSvgToJs.js bootstrap-1-9-1"

package/src/AAccordion/AAccordion.js

@@ -17,6 +17,7 @@ export default {
   provide() {
     return {
       classBody: computed(() => this.classBody),
+      classHeader: computed(() => this.classHeader),
       classButton: computed(() => this.classButton),
       disabled: computed(() => this.disabled),
       id: computed(() => this.id),
@@ -26,6 +27,7 @@ export default {
       keyLabel: computed(() => this.keyLabel),
       keyContent: computed(() => this.keyContent),
       keyClassBody: computed(() => this.keyClassBody),
+      keyClassHeader: computed(() => this.keyClassHeader),
       keyIsRender: computed(() => this.keyIsRender),
       readonly: computed(() => this.readonly),
       withGap: computed(() => this.withGap),
@@ -73,6 +75,11 @@ export default {
       required: false,
       default: undefined,
     },
+    keyClassHeader: {
+      type: String,
+      required: false,
+      default: undefined,
+    },
     keyIsRender: {
       type: String,
       required: false,
@@ -101,6 +108,11 @@ export default {
       required: false,
       default: "",
     },
+    classHeader: {
+      type: [String, Object],
+      required: false,
+      default: "",
+    },
     withGap: {
       type: Boolean,
       required: false,

package/src/AAccordion/AAccordionItem.js

@@ -35,6 +35,7 @@ export default {
   emits: ["toggle"],
   inject: [
     "classBody",
+    "classHeader",
     "classButton",
     "disabled",
     "id",
@@ -53,6 +54,7 @@ export default {
     const parentIndexes = toRef(props, "parentIndexes");
 
     const keyClassBody = inject("keyClassBody");
+    const keyClassHeader = inject("keyClassHeader");
     const keyIsRender = inject("keyIsRender");
 
     const classBodyLocal = computed(() => {
@@ -62,6 +64,13 @@ export default {
       return undefined;
     });
 
+    const classHeaderLocal = computed(() => {
+      if (keyClassHeader.value) {
+        return get(item.value, keyClassHeader.value);
+      }
+      return undefined;
+    });
+
     const indexesForOpen = inject("indexesForOpen");
     const parentIndexesString = computed(() => {
       return parentIndexes.value.join(".");
@@ -90,6 +99,7 @@ export default {
 
     return {
       classBodyLocal,
+      classHeaderLocal,
       currentIndex,
       isOpen,
       isRender,
@@ -173,7 +183,7 @@ export default {
       class: "a_accordion__item",
     }, [
       h("div", {
-        class: "a_accordion__header",
+        class: ["a_accordion__header", this.classHeader, this.classHeaderLocal],
       }, [
         h(this.buttonTag, this.buttonAttributes, [
           this.$slots.accordionButton && this.$slots.accordionButton({

package/src/ATable/ATableTd/ATableTd.js

@@ -5,12 +5,16 @@ import {
 
 import ColumnStylesAPI from "../compositionAPI/ColumnStylesAPI";
 
+import {
+  isClickOnLinkOrButton
+} from "../utils/utils";
 import {
   cloneDeep,
   forEach,
   get,
   isPlainObject,
-  isString, isUndefined,
+  isString,
+  isUndefined,
 } from "lodash-es";
 
 
@@ -114,10 +118,15 @@ export default {
         style: this.columnsStyles,
       };
       if (this.hasPreview && !this.isFooter) {
-        ATTRIBUTES.onClick = () => this.onTogglePreview({
-          row: this.row,
-          rowIndex: this.rowIndex,
-        });
+        ATTRIBUTES.onClick = $event => {
+          if (isClickOnLinkOrButton($event)) {
+            return;
+          }
+          this.onTogglePreview({
+            row: this.row,
+            rowIndex: this.rowIndex,
+          });
+        };
       }
       return ATTRIBUTES;
     },

package/src/ATable/utils/utils.js

@@ -1,3 +1,7 @@
+import {
+  forEach,
+} from "lodash-es";
+
 export function getModelColumnsVisibleDefault(columns) {
   const MODEL_COLUMNS_VISIBLE = [];
   columns.forEach(column => {
@@ -11,3 +15,19 @@ export function getModelColumnsVisibleDefault(columns) {
 export function getModelColumnsOrderingDefault(columns) {
   return columns.map(column => column.id);
 }
+
+export function isClickOnLinkOrButton($event) {
+  if ($event && $event.path) {
+    let isLink = false;
+    forEach($event.path, item => {
+      if (item.tagName === "A" || item.tagName === "BUTTON") {
+        isLink = true;
+        return false;
+      } else if (item.tagName === "TD") {
+        return false;
+      }
+    });
+
+    return isLink;
+  }
+}