aloha-vue 2.75.1 → 2.76.0

package/src/ATableForm/ATableFormRow/compositionAPI/ClassAPI.js

@@ -1,55 +1,55 @@
-import {
-  computed,
-  toRef,
-} from "vue";
-
-import {
-  isFunction,
-} from "lodash-es";
-
-export default function ClassAPI(props, {
-  hasErrors = computed(() => false),
-}) {
-  const hasActiveEditRow = toRef(props, "hasActiveEditRow");
-  const isActiveEditMode = toRef(props, "isActiveEditMode");
-  const isCreateMode = toRef(props, "isCreateMode");
-  const isFooter = toRef(props, "isFooter");
-  const isHeader = toRef(props, "isHeader");
-  const row = toRef(props, "row");
-  const rowClass = toRef(props, "rowClass");
-  const rowIndex = toRef(props, "rowIndex");
-  const trClass = toRef(props, "trClass");
-
-  const rowClassLocal = computed(() => {
-    if (isFunction(rowClass.value)) {
-      return rowClass.value({
-        row: row.value,
-        rowIndex: rowIndex.value,
-        rowindex: rowIndex.value,
-        isCreateMode: isCreateMode.value,
-        isFooter: isFooter.value,
-        isHeader: isHeader.value,
-      });
-    }
-
-    return rowClass.value;
-  });
-
-  const trClassLocal = computed(() => {
-    return [
-      trClass.value,
-      rowClassLocal.value,
-      {
-        a_table_form__row_active: !isHeader.value && !isFooter.value && isActiveEditMode.value,
-        a_table_form__row_errors: !isHeader.value && !isFooter.value && hasErrors.value,
-        a_table_form__row_inactive: !isHeader.value && !isFooter.value &&
-          hasActiveEditRow.value && !isActiveEditMode.value,
-      },
-    ];
-  });
-
-  return {
-    rowClassLocal,
-    trClassLocal,
-  };
-}
+import {
+  computed,
+  toRef,
+} from "vue";
+
+import {
+  isFunction,
+} from "lodash-es";
+
+export default function ClassAPI(props, {
+  hasErrors = computed(() => false),
+}) {
+  const hasActiveEditRow = toRef(props, "hasActiveEditRow");
+  const isActiveEditMode = toRef(props, "isActiveEditMode");
+  const isCreateMode = toRef(props, "isCreateMode");
+  const isFooter = toRef(props, "isFooter");
+  const isHeader = toRef(props, "isHeader");
+  const row = toRef(props, "row");
+  const rowClass = toRef(props, "rowClass");
+  const rowIndex = toRef(props, "rowIndex");
+  const trClass = toRef(props, "trClass");
+
+  const rowClassLocal = computed(() => {
+    if (isFunction(rowClass.value)) {
+      return rowClass.value({
+        row: row.value,
+        rowIndex: rowIndex.value,
+        rowindex: rowIndex.value,
+        isCreateMode: isCreateMode.value,
+        isFooter: isFooter.value,
+        isHeader: isHeader.value,
+      });
+    }
+
+    return rowClass.value;
+  });
+
+  const trClassLocal = computed(() => {
+    return [
+      trClass.value,
+      rowClassLocal.value,
+      {
+        a_table_form__row_active: !isHeader.value && !isFooter.value && isActiveEditMode.value,
+        a_table_form__row_errors: !isHeader.value && !isFooter.value && hasErrors.value,
+        a_table_form__row_inactive: !isHeader.value && !isFooter.value &&
+          hasActiveEditRow.value && !isActiveEditMode.value,
+      },
+    ];
+  });
+
+  return {
+    rowClassLocal,
+    trClassLocal,
+  };
+}

package/src/ATableForm/ATableFormTh/ATableFormTh.js

@@ -1,64 +1,64 @@
-import {
-  h,
-} from "vue";
-
-import ATranslation from "../../ATranslation/ATranslation";
-
-import StylesAPI from "../compositionAPI/StylesAPI";
-
-export default {
-  name: "ATableFormTh",
-  props: {
-    column: {
-      type: Object,
-      required: true,
-    },
-    columnStyle: {
-      type: Object,
-      required: false,
-      default: undefined,
-    },
-    isEditable: {
-      type: Boolean,
-      required: false,
-      default: false,
-    },
-  },
-  setup(props) {
-    const {
-      columnStyles,
-    } = StylesAPI({
-      column: props.column,
-    });
-
-    return {
-      columnStyles,
-    };
-  },
-  render() {
-    return h("th", {
-      class: [
-        "a_table_form__cell",
-        "a_table_form__cell_th",
-        this.column.class,
-      ],
-      style: [
-        this.columnStyles,
-        this.columnStyle,
-      ],
-    }, [
-      (this.column.slotHeader && this.$slots[this.column.slotHeader]) ?
-        this.$slots[this.column.slotHeader]({
-          column: this.column,
-          isEditable: this.isEditable,
-        }) :
-        this.column.label && h(ATranslation, {
-          html: this.column.label,
-          tag: "span",
-        }),
-      this.isEditable && this.column.formElement?.required && h("span", {
-        class: "a_label__required",
-      }, "*"),
-    ]);
-  },
-};
+import {
+  h,
+} from "vue";
+
+import ATranslation from "../../ATranslation/ATranslation";
+
+import StylesAPI from "../compositionAPI/StylesAPI";
+
+export default {
+  name: "ATableFormTh",
+  props: {
+    column: {
+      type: Object,
+      required: true,
+    },
+    columnStyle: {
+      type: Object,
+      required: false,
+      default: undefined,
+    },
+    isEditable: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
+  },
+  setup(props) {
+    const {
+      columnStyles,
+    } = StylesAPI({
+      column: props.column,
+    });
+
+    return {
+      columnStyles,
+    };
+  },
+  render() {
+    return h("th", {
+      class: [
+        "a_table_form__cell",
+        "a_table_form__cell_th",
+        this.column.class,
+      ],
+      style: [
+        this.columnStyles,
+        this.columnStyle,
+      ],
+    }, [
+      (this.column.slotHeader && this.$slots[this.column.slotHeader]) ?
+        this.$slots[this.column.slotHeader]({
+          column: this.column,
+          isEditable: this.isEditable,
+        }) :
+        this.column.label && h(ATranslation, {
+          html: this.column.label,
+          tag: "span",
+        }),
+      this.isEditable && this.column.formElement?.required && h("span", {
+        class: "a_label__required",
+      }, "*"),
+    ]);
+  },
+};

package/src/ATableForm/compositionAPI/ColumnsAPI.js

@@ -1,42 +1,42 @@
-import {
-  computed,
-  toRef,
-} from "vue";
-
-
-export default function ColumnsAPI(props, {
-  isAddRowActive = computed(() => false),
-} = {}) {
-  const columns = toRef(props, "columns");
-  const isDeletable = toRef(props, "isDeletable");
-  const isDeletableConfirm = toRef(props, "isDeletableConfirm");
-  const isDragAndDrop = toRef(props, "isDragAndDrop");
-  const isEditable = toRef(props, "isEditable");
-  const rowView = toRef(props, "rowView");
-
-  const hasActionsColumn = computed(() => {
-    return !!(isEditable.value || isDeletable.value || isDeletableConfirm.value || isAddRowActive.value);
-  });
-
-  const columnsVisible = computed(() => {
-    return columns.value.filter(column => column.isRender !== false);
-  });
-
-  const allColumnsLength = computed(() => {
-    let length = rowView.value === "list" ? 1 : columnsVisible.value.length;
-    if (isDragAndDrop.value) {
-      length += 1;
-    }
-    if (hasActionsColumn.value) {
-      length += 1;
-    }
-
-    return length;
-  });
-
-  return {
-    allColumnsLength,
-    columnsVisible,
-    hasActionsColumn,
-  };
-}
+import {
+  computed,
+  toRef,
+} from "vue";
+
+
+export default function ColumnsAPI(props, {
+  isAddRowActive = computed(() => false),
+} = {}) {
+  const columns = toRef(props, "columns");
+  const isDeletable = toRef(props, "isDeletable");
+  const isDeletableConfirm = toRef(props, "isDeletableConfirm");
+  const isDragAndDrop = toRef(props, "isDragAndDrop");
+  const isEditable = toRef(props, "isEditable");
+  const rowView = toRef(props, "rowView");
+
+  const hasActionsColumn = computed(() => {
+    return !!(isEditable.value || isDeletable.value || isDeletableConfirm.value || isAddRowActive.value);
+  });
+
+  const columnsVisible = computed(() => {
+    return columns.value.filter(column => column.isRender !== false);
+  });
+
+  const allColumnsLength = computed(() => {
+    let length = rowView.value === "list" ? 1 : columnsVisible.value.length;
+    if (isDragAndDrop.value) {
+      length += 1;
+    }
+    if (hasActionsColumn.value) {
+      length += 1;
+    }
+
+    return length;
+  });
+
+  return {
+    allColumnsLength,
+    columnsVisible,
+    hasActionsColumn,
+  };
+}

package/src/ATableForm/compositionAPI/ColumnsGrowAPI.js

@@ -17,10 +17,10 @@ import {
 const TABLE_WIDTH_SAFE_DELTA = 2;
 
 export default function ColumnsGrowAPI(props, {
-  columnsVisible = computed(() => []),
-  hasActionsColumn = computed(() => false),
-  hasActiveEditRow = computed(() => false),
-  widthsLocal = computed(() => ({})),
+  columnsVisible = computed(() => []),
+  hasActionsColumn = computed(() => false),
+  hasActiveEditRow = computed(() => false),
+  widthsLocal = computed(() => ({})),
 }) {
   const id = toRef(props, "id");
   const isColumnsGrow = toRef(props, "isColumnsGrow");
@@ -44,13 +44,13 @@ export default function ColumnsGrowAPI(props, {
       return 0;
     }
 
-    if (hasActiveEditRow.value ||
-      (isEditable.value && (isDeletable.value || isDeletableConfirm.value))) {
-      return widthsLocal.value.actionsColumnDouble;
-    }
+    if (hasActiveEditRow.value ||
+      (isEditable.value && (isDeletable.value || isDeletableConfirm.value))) {
+      return widthsLocal.value.actionsColumnDouble;
+    }
 
-    return widthsLocal.value.actionsColumnSingle;
-  });
+    return widthsLocal.value.actionsColumnSingle;
+  });
 
   const dndColumnWidth = computed(() => {
     return isDragAndDrop.value ? widthsLocal.value.dndColumn : 0;
@@ -123,25 +123,25 @@ export default function ColumnsGrowAPI(props, {
       growSum += Math.max(0, +column.grow || 0);
     });
 
-    if (columnsWidthSum >= tableWidthAvailable || !columnsLocal.length) {
-      columnsStylesGrow.value = {};
-      return;
-    }
-
-    const freeWidth = tableWidthAvailable - columnsWidthSum;
-    const hasConfiguredGrow = growSum > 0;
-    const growSumLocal = hasConfiguredGrow ? growSum : columnsLocal.length;
-    const styles = {};
-
-    columnsLocal.forEach(column => {
-      const columnWidth = parseWidthToPx(column.width);
-      const columnGrow = hasConfiguredGrow ? Math.max(0, +column.grow || 0) : 1;
-
-      if (!column.id || (hasConfiguredGrow && !columnWidth)) {
-        return;
-      }
-
-      const widthPx = columnWidth + (columnGrow > 0 ? freeWidth * columnGrow / growSumLocal : 0);
+    if (columnsWidthSum >= tableWidthAvailable || !columnsLocal.length) {
+      columnsStylesGrow.value = {};
+      return;
+    }
+
+    const freeWidth = tableWidthAvailable - columnsWidthSum;
+    const hasConfiguredGrow = growSum > 0;
+    const growSumLocal = hasConfiguredGrow ? growSum : columnsLocal.length;
+    const styles = {};
+
+    columnsLocal.forEach(column => {
+      const columnWidth = parseWidthToPx(column.width);
+      const columnGrow = hasConfiguredGrow ? Math.max(0, +column.grow || 0) : 1;
+
+      if (!column.id || (hasConfiguredGrow && !columnWidth)) {
+        return;
+      }
+
+      const widthPx = columnWidth + (columnGrow > 0 ? freeWidth * columnGrow / growSumLocal : 0);
       styles[column.id] = toWidthStyle(widthPx);
     });
 
@@ -190,9 +190,9 @@ export default function ColumnsGrowAPI(props, {
   };
 
   watch([
-    columnsVisible,
-    hasActionsColumn,
-    hasActiveEditRow,
+    columnsVisible,
+    hasActionsColumn,
+    hasActiveEditRow,
     isDeletable,
     isDeletableConfirm,
     isDragAndDrop,