aloha-vue 1.2.98 → 1.2.99

package/package.json

@@ -14,7 +14,7 @@
     "Vue.js"
   ],
   "homepage": "https://github.com/ilia-brykin/aloha/#README.md",
-  "version": "1.2.98",
+  "version": "1.2.99",
   "author": {
     "name": "Ilia Brykin",
     "email": "brykin.ilia@gmail.com"

package/src/AFilters/AFilterCenter/AFilterCenter.js

@@ -7,6 +7,8 @@ import AFilterCenterItem from "./AFilterCenterItem/AFilterCenterItem";
 
 import VisibleFiltersAPI from "./compositionAPI/VisibleFiltersAPI";
 import AButton from "../../AButton/AButton";
+import LoadingFiltersAPI from "./compositionAPI/LoadingFiltersAPI";
+import ASpinner from "../../ASpinner/ASpinner";
 
 export default {
   name: "AFilterCenter",
@@ -50,8 +52,15 @@ export default {
       updateVisibleChildFilters,
     } = VisibleFiltersAPI(props);
 
+    const {
+      isLeastOneChildFilterLoading,
+      updateLoadingChildFilters,
+    } = LoadingFiltersAPI(props);
+
     return {
+      isLeastOneChildFilterLoading,
       styleHide,
+      updateLoadingChildFilters,
       updateVisibleChildFilters,
     };
   },
@@ -75,8 +84,16 @@ export default {
           dataKeyByKeyIdPerFilter: this.dataKeyByKeyIdPerFilter,
           model: this.appliedModel[filter.modelId || filter.id],
           onUpdateVisibleChildFilters: this.updateVisibleChildFilters,
+          onUpdateLoadingChildFilters: this.updateLoadingChildFilters,
         }, this.$slots);
       }),
+      this.isLeastOneChildFilterLoading && h("div", {
+        class: "a_filters_center__item",
+      }, [
+        h(ASpinner, {
+          class: "a_spinner_small",
+        }),
+      ]),
       h("div", {
         class: "a_filters_center__item",
       }, [

package/src/AFilters/AFilterCenter/AFilterCenterItem/AFilterCenterItem.js

@@ -11,6 +11,7 @@ import GoToAPI from "./compositionAPI/GoToAPI";
 import HasFilterAPI from "./compositionAPI/HasFilterAPI";
 import LabelAPI from "./compositionAPI/LabelAPI";
 import ModelValuesAPI from "./compositionAPI/ModelValuesAPI";
+import IsDataLoadingAPI from "./compositionAPI/IsDataLoadingAPI";
 
 export default {
   name: "AFilterCenterItem",
@@ -44,12 +45,18 @@ export default {
   },
   emits: [
     "updateVisibleChildFilters",
+    "updateLoadingChildFilters",
   ],
   setup(props, context) {
     const {
       hasCurrentFilter,
     } = HasFilterAPI(props);
 
+    const {
+      isFilterLoading,
+      updateLoadingChildFilters,
+    } = IsDataLoadingAPI(props, context);
+
     const {
       filterLabel,
     } = LabelAPI(props, {
@@ -83,6 +90,12 @@ export default {
       immediate: true,
     });
 
+    watch(isFilterLoading, () => {
+      updateLoadingChildFilters();
+    }, {
+      immediate: true,
+    });
+
     onBeforeUnmount(() => {
       updateVisibleChildFilters({
         destroy: true,

package/src/AFilters/AFilterCenter/AFilterCenterItem/compositionAPI/IsDataLoadingAPI.js

@@ -0,0 +1,30 @@
+import {
+  computed,
+  toRef,
+} from "vue";
+
+import {
+  isEmpty,
+} from "lodash-es";
+
+export default function IsDataLoadingAPI(props, { emit }) {
+  const filter = toRef(props, "filter");
+  const model = toRef(props, "model");
+  const dataKeyByKeyIdPerFilter = toRef(props, "dataKeyByKeyIdPerFilter");
+
+  const isFilterLoading = computed(() => {
+    return !isEmpty(model.value) && isEmpty(dataKeyByKeyIdPerFilter.value[filter.value.id]);
+  });
+
+  const updateLoadingChildFilters = () => {
+    emit("updateLoadingChildFilters", {
+      id: filter.value.id,
+      isLoading: isFilterLoading.value,
+    });
+  };
+
+  return {
+    isFilterLoading,
+    updateLoadingChildFilters,
+  };
+}

package/src/AFilters/AFilterCenter/compositionAPI/LoadingFiltersAPI.js

@@ -0,0 +1,32 @@
+import {
+  computed,
+  ref,
+} from "vue";
+
+import {
+  forEach,
+} from "lodash-es";
+
+export default function LoadingFiltersAPI() {
+  const loadingChildFilters = ref({});
+
+  const updateLoadingChildFilters = ({ id, isLoading }) => {
+    loadingChildFilters.value[id] = isLoading;
+  };
+
+  const isLeastOneChildFilterLoading = computed(() => {
+    let isLoading = false;
+    forEach(loadingChildFilters.value, _isLoading => {
+      if (_isLoading) {
+        isLoading = true;
+        return false;
+      }
+    });
+    return isLoading;
+  });
+
+  return {
+    isLeastOneChildFilterLoading,
+    updateLoadingChildFilters,
+  };
+}

package/src/ATable/ATable.js

@@ -427,6 +427,8 @@ export default {
     } = SortAPI(props);
 
     const {
+      addRow,
+      deleteRow,
       hasRows,
       limit,
       offset,
@@ -603,6 +605,7 @@ export default {
     initModelSort();
 
     return {
+      addRow,
       allVisibleMobileColumns,
       areAllRowsSelected,
       areAllVisibleRowsSelected,
@@ -617,6 +620,7 @@ export default {
       closePreviewAll,
       columnsFilteredForRender,
       columnsOrdered,
+      deleteRow,
       emptyText,
       hasMultipleActions,
       hasRows,

package/src/ATable/compositionAPI/RowsAPI.js

@@ -73,6 +73,14 @@ export default function RowsAPI(props, {
     rowsLocal.value[rowIndex] = row;
   };
 
+  const addRow = ({ row }) => {
+    rowsLocal.value.unshift(row);
+  };
+
+  const deleteRow = ({ index }) => {
+    rowsLocal.value.splice(index, 1);
+  };
+
   watch(dataPaginated, () => {
     rowsLocal.value = [];
     rowsLocalIndex = 0;
@@ -89,6 +97,8 @@ export default function RowsAPI(props, {
   });
 
   return {
+    addRow,
+    deleteRow,
     hasRows,
     limit,
     offset,