@nixweb/nixloc-ui 0.0.119 → 0.0.122

package/src/component/template/ModeloRelatorioListaView.vue

@@ -1,59 +1,59 @@
 <template>
   <div>
     <Painel
-      :modulo="painel.modulo"
-      :titulo="painel.titulo"
-      :mostrarFiltroVertical="painel.mostrarFiltroVertical"
-      :mostrarPesquisa="painel.mostrarPesquisa"
-      :mostrarBotoes="painel.mostrarBotoes"
+      :module="panel.module"
+      :title="panel.title"
+      :showVerticalFilter="panel.showVerticalFilter"
+      :showSearch="panel.showSearch"
+      :showButtons="panel.showButtons"
     >
-      <div slot="conteudo-principal">
+      <div slot="content-main">
         <b-row>
           <b-col xs="12" sm="12" md="12" lg="6" xl="6" v-if="todos.salvo.length > 0">
-            <div><i class="fas fa-file-alt icone-salvo"></i></i> Personalizado</div>
+            <div><i class="fas fa-file-alt icon-salvo"></i></i> Personalizado</div>
             <hr class="hr" />
-            <div class="div-moldura" v-for="relatorio in todos.salvo">
+            <div class="div-molded" v-for="report in todos.salvo">
               <div>
-                <Moldura :bordaArredondada="12">
+                <Molded :borderRadius="12">
                   <b-row>
                     <b-col sm="1">
-                      <i class="fas fa-file-alt icone-report"></i>
+                      <i class="fas fa-file-alt icon-report"></i>
                     </b-col>
-                    <b-col sm="10" @click="navegarPara(relatorio)">
-                      <div>{{ relatorio.nome }}</div>
+                    <b-col sm="10" @click="navegateTo(report)">
+                      <div>{{ report.nome }}</div>
                     </b-col>
                     <b-col sm="1">
                       <Confirmacao
-                        titulo="Deseja excluir?"
-                        tipo="perigo"
-                        :dados="relatorio"
+                        title="Deseja excluir?"
+                        type="danger"
+                        :data="report"
                         :confirmado="excluir"
                       >
                         <div class="text-right">
-                          <i class="fas fa-times-circle icone-remover"></i>
+                          <i class="fas fa-times-circle icon-remover"></i>
                         </div>
                       </Confirmacao>
                     </b-col>
                   </b-row>
-                </Moldura>
+                </Molded>
               </div>
             </div>
           </b-col>
           <b-col xs="12" sm="12" md="12" lg="6" xl="6">
             <div><i class="fas fa-file-chart-line"></i> Padrão</div>
             <hr class="hr" />
-            <div class="div-moldura" v-for="relatorio in todos.padrao">
+            <div class="div-molded" v-for="report in todos.padrao">
               <div>
-                <Moldura :bordaArredondada="12">
+                <Molded :borderRadius="12">
                   <b-row>
                     <b-col sm="1">
-                      <i class="fas fa-file-alt icone-report"></i>
+                      <i class="fas fa-file-alt icon-report"></i>
                     </b-col>
-                    <b-col sm="11" @click="navegarPara(relatorio)">
-                      <div class="lado-a-lado">{{ relatorio.nome }}</div>
+                    <b-col sm="11" @click="navegateTo(report)">
+                      <div class="side-by-side">{{ report.nome }}</div>
                     </b-col>
                   </b-row>
-                </Moldura>
+                </Molded>
               </div>
             </div>
           </b-col>
@@ -65,77 +65,80 @@
 
 <script>
 import Painel from "@nixweb/nixloc-ui/src/component/layout/Painel.vue";
-import Moldura from "@nixweb/nixloc-ui/src/component/layout/Moldura";
+import Molded from "@nixweb/nixloc-ui/src/component/layout/Molded";
 import Confirmacao from "@nixweb/nixloc-ui/src/component/shared/Confirmacao";
 
 import { mapState, mapGetters, mapActions, mapMutations } from "vuex";
 
 export default {
   name: "ModeloRelatorioListaView",
-  components: { Painel, Moldura, Confirmacao },
+  components: { Painel, Molded, Confirmacao },
   props: {
-    painel: Object,
+    panel: Object,
     relatorios: Object,
   },
   data() {
     return {
-      todos: {},
-      urlObterTodos: "/api/v1/shared/relatorio/obter-todos",
-      urlRemover: "/api/v1/shared/relatorio/remover",
+      todos: { salvo: [] },
+      urlObterTodos: "/api/v1/shared/report/obter-todos",
+      urlRemover: "/api/v1/shared/report/remover",
     };
   },
   computed: {
-    ...mapState("generic", ["pesquisa", "buscouPesquisa", "limpouPesquisa"]),
+    ...mapState("generic", ["search", "buscouPesquisa", "limpouPesquisa"]),
   },
   mounted() {
-    this.obterTodos();
+    this.getAll();
     this.todos = JSON.parse(JSON.stringify(this.relatorios)); // remove observable
   },
   methods: {
-    ...mapMutations("generic", ["removeCarregando"]),
-    ...mapMutations("relatorio", [
+    ...mapMutations("generic", ["removeLoading"]),
+    ...mapMutations("report", [
       "atualizaFiltroSelecionado",
       "atualizaCampoOrdenado",
-      "atualizaOpcoesValorInicial",
+      "updateOptionsInitValue",
+      "atualizaConsultaFiltro"
     ]),
     ...mapActions("generic", ["getApi", "deleteAllApi"]),
-    obterTodos() {
-      let obj = { modulo: this.painel.modulo };
+    getAll() {
+      let obj = { module: this.panel.module };
       let params = { url: this.urlObterTodos, obj: obj };
       this.getApi(params).then((response) => {
         this.todos.salvo = [];
         let self = this;
-        response.conteudo.dados.forEach((item) => {
+        response.content.data.forEach((item) => {
           const consulta = JSON.parse(item.consulta);
           let obj = {
             id: item.id,
             nome: item.nome,
-            nomeRota: consulta.nomeRota,
-            filtro: consulta.filtro,
-            campo: consulta.campo,
+            routeName: consulta.routeName,
+            filter: consulta.filter,
+            field: consulta.field,
             ordenacao: consulta.ordenacao,
           };
           self.todos.salvo.push(obj);
         });
-        this.removeCarregando(["painel"]);
+        this.removeLoading(["panel"]);
       });
     },
-    navegarPara(relatorio) {
-      if (relatorio.filtro) {
-        let filtroSelecionado = { logicalOperator: "all", children: relatorio.filtro };
-        this.atualizaOpcoesValorInicial(relatorio.campo);
-        this.atualizaCampoOrdenado(relatorio.ordenacao);
+    navegateTo(report) {
+      if (report.filter) {
+        let filtroSelecionado = { logicalOperator: "all", children: report.filter };
+        this.updateOptionsInitValue(report.field);
+        this.atualizaCampoOrdenado(report.ordenacao);
         this.atualizaFiltroSelecionado(filtroSelecionado);
+        this.atualizaConsultaFiltro(filtroSelecionado);
       } else {
-        this.atualizaOpcoesValorInicial([]);
+        this.updateOptionsInitValue([]);
       }
       this.$router.push({
-        name: relatorio.nomeRota,
+        name: report.routeName,
+        params: { id: report.id, nome: report.nome },
       });
     },
-    excluir(dados) {
+    excluir(data) {
       let selecionados = [];
-      selecionados.push(dados.id);
+      selecionados.push(data.id);
 
       let params = {
         url: this.urlRemover,
@@ -143,7 +146,7 @@ export default {
       };
 
       this.deleteAllApi(params).then((reponse) => {
-        if (reponse.sucesso) this.obterTodos();
+        if (reponse.success) this.getAll();
       });
     },
   },
@@ -154,37 +157,37 @@ export default {
       let self = this;
       setTimeout(function () {
         self.todos.padrao.forEach(function (item) {
-          if (self.pesquisa.filtro.conteudo == "igual") {
-            if (item.nome == self.pesquisa.conteudo) padrao.push(item);
+          if (self.search.filter.content == "igual") {
+            if (item.nome == self.search.content) padrao.push(item);
           }
 
-          if (self.pesquisa.filtro.conteudo == "contem") {
-            if (item.nome.includes(self.pesquisa.conteudo)) padrao.push(item);
+          if (self.search.filter.content == "contem") {
+            if (item.nome.includes(self.search.content)) padrao.push(item);
           }
         });
 
         self.todos.salvo.forEach(function (item) {
-          if (self.pesquisa.filtro.conteudo == "igual") {
-            if (item.nome == self.pesquisa.conteudo) salvo.push(item);
+          if (self.search.filter.content == "igual") {
+            if (item.nome == self.search.content) salvo.push(item);
           }
 
-          if (self.pesquisa.filtro.conteudo == "contem") {
-            if (item.nome.includes(self.pesquisa.conteudo)) salvo.push(item);
+          if (self.search.filter.content == "contem") {
+            if (item.nome.includes(self.search.content)) salvo.push(item);
           }
         });
 
         self.todos.salvo = salvo;
         self.todos.padrao = padrao;
 
-        self.removeCarregando(["pesquisar", "limpar"]);
+        self.removeLoading(["pesquisar", "limpar"]);
       }, 300);
     },
     limpouPesquisa: function () {
       let self = this;
       setTimeout(function () {
         self.todos = self.relatorios;
-        self.obterTodos();
-        self.removeCarregando(["pesquisar", "limpar"]);
+        self.getAll();
+        self.removeLoading(["pesquisar", "limpar"]);
       }, 300);
     },
   },
@@ -192,30 +195,30 @@ export default {
 </script>
 
 <style scoped>
-.icone-salvo {
+.icon-salvo {
   color: #94aa2a;
 }
 
-.icone-remover {
+.icon-remover {
   color: red;
 }
 
-.icone-report {
+.icon-report {
   font-size: 25px;
   opacity: 0.2;
   color: #577696;
 }
 
-.div-moldura {
+.div-molded {
   margin-bottom: 10px;
   cursor: pointer;
 }
 
-.div-moldura:hover {
+.div-molded:hover {
   background-color: #fafafc;
 }
 
-.descricao {
+.description {
   font-size: 13.5px;
   color: rgb(117, 117, 117);
 }