@znap/components-vue2 1.0.7 → 1.0.9

package/README.md

@@ -64,7 +64,7 @@ import * as ZnapComponents from '@znap/components-vue2';
     @update:row="updateRow"
   >
   <template v-slot:footer-prepend>
-    
+    Slot para adicionar elementos do lado esquerdo dos componentes de paginaçao.
   </template>
   </ZnapBaseCrudView>
 </template>
@@ -190,8 +190,8 @@ export default {
       // Modelo inicial do formulario
     });
 
-    this.viewSettings = crudViewConfigs.viewConfigs;
-    this.viewMethods = crudViewConfigs.viewMethods;
+    this.viewSettings = crudViewConfigs.viewConfigs; // Retorna o objeto de configuraçoes da classe (Se tornara o state do componente)
+    this.viewMethods = crudViewConfigs.viewMethods; // Retorna os metodos pre prontos disponiveis da classe.
 
    
     // Pode usar os metodos das classe CrudViewConfigs ou entao criar os proprios de acordo com a necessidade.
@@ -211,10 +211,10 @@ export default {
   },
   methods: {
     updateRowsChanged() {
-       this.viewSettings.rowsChanged = new Set(this.viewSettings.rowsChanged);
+       this.viewSettings.rowsChanged = new Set(this.viewSettings.rowsChanged); // Importante para o Vue detectar que o rowsChanged alterou e exibir o elemento em destaque na tabela.
     }
     updateRow() {
-      this.$set(this.viewSettings.apiData, rowIndex, data);
+      this.$set(this.viewSettings.apiData, rowIndex, data); // Importante para o vue detectar que teve alteraçao no elemento da tabela.
     }
     async onReload() {
       // Logica de como sera tratado o evento de reload.
@@ -222,15 +222,21 @@ export default {
     async onExportFile() {
        // Logica de como sera tratado o evento de exportaçao de arquivo.
     }
-    async onImportFile(event) {
+    async onImportFile(
+      event // evento contendo o elemento do input de arquivo
+      ) {
       // Logica de como sera tratado o evento de importaçao de arquivo.
     }
-    async onSave() {
+    async onSave({
+    reload = true, // variavel retornada do comoponente para verificar se deve ou nao realizar o reload (Fica a cargo do desenvolvedor)
+    itemData = null  // Se for um item proveniente da modal (Criaçao/Ediçao) os dados virão aqui
+    }) {
       // Logica de como sera tratado o evento de salvamento de registro(s)
     }
-    async onDelete() {
+    async onDelete(
+      rows // Array com as linhas que devem ser excluidas
+    ) {
       // Logica de como sera tratado o evento de exclusao de registro(s)
-
     }
     async fetchData() {
       // Logica de busca de dados principais
@@ -242,3 +248,10 @@ export default {
 ```
 
 
+### Utilizaçao da Classe Auxiliar **CrudViewConfigs**
+
+O intuito dessa classe é fornecer ao desenvolvedor uma interface padronizada de criaçao de telas, tornando o processo padronizado e de facil aprendizado.
+
+A classe retorna metodos e um objeto padrao de estado para ser utilizado para manipular o componente **ZnapBaseCrudView** por meio dos getters **viewConfigs** e **viewMethods**, alem disso, pussui diversos metodos/interfaces para o desenvolvedor adicionar elementos na tela de maneira padronizada evitando refazer a roda toda vez que for construir uma nova tela.
+
+

package/dist/index.common.js

@@ -49191,6 +49191,7 @@ class CrudViewConfigs {
     const optionsPromises = [];
     tableOptions.forEach(option => {
       if (!option?.endpoint[0]) return optionsPromises.push(null);
+      if (option?.ignoreOnFetchFunction) return optionsPromises.push(null);
       optionsPromises.push(httpFetcher.post(option.endpoint[0], option.endpoint[1] ?? null));
     });
     const optionsData = await Promise.all(optionsPromises);
@@ -49202,6 +49203,7 @@ class CrudViewConfigs {
     const optionsPromises = [];
     formOptions.forEach(option => {
       option.loading = true;
+      if (option?.ignoreOnFetchFunction) return optionsPromises.push(null);
       optionsPromises.push(httpFetcher.post(option.endpoint[0], option.endpoint[1] ?? null));
     });
     const optionsData = await Promise.all(optionsPromises);
@@ -49213,14 +49215,16 @@ class CrudViewConfigs {
   async fetchFiltersData(filters, httpFetcher) {
     const primaryFiltersPromises = filters?.primary.flatMap(async (filter, index) => {
       if (!filter.endpoint?.length || !filter.endpoint[0]) return [index, null];
+      if (filter.ignoreOnFetchFunction) return [index, null];
       filter.props.loading = true;
-      const response = await httpFetcher.post(`${filter.endpoint[0]}`, filter.conditions);
+      const response = await httpFetcher.post(filter.endpoint[0], filter.endpoint[1] ?? {});
       return [index, response?.data];
     }) ?? [];
     const secondaryFiltersPromises = filters?.secondary?.flatMap(async (filter, index) => {
       if (!filter.endpoint?.length || !filter.endpoint[0]) return [index, null];
+      if (filter.ignoreOnFetchFunction) return [index, null];
       filter.props.loading = true;
-      const response = await httpFetcher.post(`${filter.endpoint[0]}`, filter.conditions);
+      const response = await httpFetcher.post(filter.endpoint[0], filter.endpoint[1] ?? {});
       return [index, response?.data];
     }) ?? [];
     const [primaryFiltersData, secondaryFiltersData] = await Promise.all([Promise.all(primaryFiltersPromises), Promise.all(secondaryFiltersPromises)]);
@@ -49271,7 +49275,8 @@ class CrudViewConfigs {
     endpoint = [],
     componentProps = {},
     hooks = {},
-    dependsOn = ""
+    dependsOn = "",
+    ignoreOnFetchFunction = false
   } = {}) {
     if (!this.avalibleFilterComponents.has(filterComponent)) throw new Error("O componente escolhido para o filtro não é um componente valido!");
     const hooksKeys = Object.keys(hooks);
@@ -49291,7 +49296,8 @@ class CrudViewConfigs {
         returnObject: false,
         ...componentProps
       },
-      hooks
+      hooks,
+      ignoreOnFetchFunction
     });
     return this;
   }
@@ -49315,7 +49321,8 @@ class CrudViewConfigs {
     endpoint = [],
     componentProps = {},
     hooks = {},
-    dependsOn = ""
+    dependsOn = "",
+    ignoreOnFetchFunction = false
   } = {}) {
     if (!this.avalibleFilterComponents.has(filterComponent)) throw new Error("O componente escolhido para o filtro não é um componente valido!");
     const hooksKeys = Object.keys(hooks);
@@ -49335,7 +49342,8 @@ class CrudViewConfigs {
         ...componentProps
       },
       dependsOn,
-      hooks
+      hooks,
+      ignoreOnFetchFunction
     });
     return this;
   }
@@ -49348,14 +49356,16 @@ class CrudViewConfigs {
     itemsArray = [],
     endpoint = [],
     formatter = null,
-    filterFunction = null
+    filterFunction = null,
+    ignoreOnFetchFunction = false
   } = {}) {
     this.tableOptions.push({
       column: this.isValidColumn(column) ? column : "",
       endpoint: this.isValidEndpoint(endpoint) ? endpoint : CrudViewConfigs.generateEndpoint(),
       items: this.isValidItemsArray(itemsArray) ? itemsArray : [],
       formatter,
-      filterFunction
+      filterFunction,
+      ignoreOnFetchFunction
     });
     return this;
   }