@nixweb/nixloc-ui 0.0.38 → 0.0.42

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nixweb/nixloc-ui",
-  "version": "0.0.38",
+  "version": "0.0.42",
   "description": "Componentes UI",
   "author": "Fábio Ávila <fabio@nixweb.com.br>",
   "private": false,
@@ -10,19 +10,21 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
-    "bootstrap-vue": "^2.0.0-rc.11",
     "@babel/polyfill": "^7.2.5",
+    "bootstrap-vue": "^2.0.0-rc.11",
     "vodal": "^2.4.0",
     "vue-color": "^2.7.0",
-    "vue-the-mask": "^0.11.1",
-    "vue2-datepicker": "^2.13.0",
-    "vue2-editor": "^2.6.6",
+    "vue-js-toggle-button": "^1.3.0",
     "vue-loading-template": "^1.3.0",
     "vue-moment": "^4.0.0",
     "vue-multiselect": "^2.1.0",
     "vue-numeric": "^2.4.1",
+    "vue-the-mask": "^0.11.1",
     "vue-toasted": "^1.1.28",
-    "vue-upload-file": "^1.1.0"
+    "vue-toggles": "^1.1.4",
+    "vue-upload-file": "^1.1.0",
+    "vue2-datepicker": "^2.13.0",
+    "vue2-editor": "^2.6.6"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "~4.5.0",
@@ -60,4 +62,4 @@
     "type": "git",
     "url": "git+https://github.com/nixweb-sistemas/nixloc-ui.git"
   }
-}
+}

package/src/component/forms/Botao.vue

@@ -27,7 +27,7 @@
         v-if="carregando(this.chave)"
         type="bubbles"
         color="#fff"
-        :size="{ width: '20px', height: '20px' }"
+        :size="{ width: '26px', height: '26px' }"
       ></vue-loading>
     </button>
   </div>
@@ -83,6 +83,7 @@ export default {
   border-radius: 40px !important;
   font-size: 14px;
   font-weight: 400;
+  letter-spacing: 0.5px !important;
   -webkit-box-shadow: 0px 10px 20px -6px rgb(0 0 0 / 12%);
   -moz-box-shadow: 0px 10px 20px -6px rgba(0, 0, 0, 0.12);
   box-shadow: 0px 10px 20px -6px rgb(0 0 0 / 12%);

package/src/component/forms/EscolherEstatico.vue

@@ -11,6 +11,7 @@
         :options="dados"
         v-model.trim="valorAtual"
         :custom-label="rotulo"
+        :disabled="desabilitado"
         placeholder
         :showLabels="true"
         :noResult="false"
@@ -55,6 +56,10 @@ export default {
     formNome: String,
     campoAlvo: String,
     valorInicial: Object,
+    desabilitado: {
+      type: Boolean,
+      default: false,
+    },
     dados: Array,
     value: Object,
   },
@@ -78,20 +83,15 @@ export default {
     aoAbrir() {},
     aoSelecionar(value) {
       this.$emit("input", value);
-      let obj = { campoAlvo: this.campoAlvo, valor: value.valor };
+      let obj = { campoAlvo: this.campoAlvo, valor: value.id };
       this.insereFiltro(obj);
-
-      // antigo
-      this.$store.commit("ADICIONA_TOTAL_REGISTRO_POR_PAGINA", obj.valor);
-      this.$store.commit("CARREGANDO_FULL", true);
-      eventBus.$emit("aoSelecionarTotalRegistroPorPagina", obj.valor);
     },
     aoPesquisar(value) {},
     rotulo(value) {
-      return `${value.titulo}`;
+      return `${value.conteudo}`;
     },
     limpaEscolherEstatico() {
-      let objLimpo = { titulo: "", valor: "" };
+      let objLimpo = { conteudo: "", id: "" };
       this.valorAtual = objLimpo;
       this.$emit("input", objLimpo);
       this.$refs.multiselect.deactivate();
@@ -104,8 +104,11 @@ export default {
     },
   },
   watch: {
-    "value.valor": function () {
-      this.valorAtual = { titulo: this.value.titulo, conteudo: this.value.valor };
+    "value.id": function () {
+      this.valorAtual = { id: this.value.id, conteudo: this.value.conteudo };
+    },
+    "valorInicial.id": function () {
+      this.valorAtual = { id: this.value.id, conteudo: this.value.conteudo };
     },
   },
 };

package/src/component/forms/Opcoes.vue

@@ -4,7 +4,11 @@
     <Dica :campo="campo" :formNome="formNome" />
     <div class="opcoes">
       <b-form-group>
-        <b-form-radio-group v-model="selecionado" :options="opcoes"></b-form-radio-group>
+        <b-form-radio-group
+          v-model="selecionado"
+          :options="opcoes"
+          :disabled="desabilitado"
+        ></b-form-radio-group>
       </b-form-group>
     </div>
   </div>
@@ -15,7 +19,7 @@ import Dica from "../shared/Dica.vue";
 export default {
   components: { Dica },
   name: "Opcoes",
-  props: ["titulo", "opcoes", "value", "alterou", "campo", "formNome"],
+  props: ["titulo", "opcoes", "value", "alterou", "campo", "formNome", "desabilitado"],
   data() {
     return {
       selecionado: this.value,

package/src/component/forms/Toggle.vue

@@ -0,0 +1,20 @@
+<template>
+  <div>
+    <VueToggles
+      height="30"
+      width="90"
+      checkedText="On"
+      uncheckedText="Off"
+      checkedBg="#b4d455"
+      uncheckedBg="lightgrey"
+      :value="value"
+      @click="value = !value"
+    />
+  </div>
+</template>
+
+<script>
+export default {
+  name: "Toggle",
+};
+</script>

package/src/component/layout/Menu.vue

@@ -1,7 +1,7 @@
 <template>
   <div id="page">
     <div id="header" :style="'background-color:' + corTopo">
-      <a href="#menu"><span></span></a>
+      <!-- <a href="#menu"><span></span></a> -->
     </div>
     <nav id="menu">
       <div id="panel-menu">
@@ -64,18 +64,21 @@ export default {
         backButton: {
           close: true,
         },
-
         setSelected: {
-          hover: true,
-          parent: true,
+          hover: false,
+          parent: false,
         },
         counters: {
           add: true,
         },
+        iconbar: {
+          use: "(min-width: 450px)",
+          top: ['<a href="#/"><span class="fas fa-bars"></span></a>'],
+        },
         searchfield: {
           add: true,
           placeholder: "Pesquisar",
-          splash: "<p>O que você está procurando?</p>",
+          splash: "<p>Digite sua pesquisa</p>",
           title: "Pesquisar",
           noResults: "Nenhum resultado",
         },
@@ -85,7 +88,7 @@ export default {
         },
         sidebar: {
           collapsed: {
-            use: false,
+            use: "(min-width: 450px)",
           },
           expanded: {
             use: "(min-width: 1000px)",
@@ -98,7 +101,7 @@ export default {
           {
             type: "tabs",
             content: [
-              '<a href="#panel-menu"><i class="fa fa-bars"></i> <span style="margin-left:5px"> Menu</span></a>',
+              '<a href="#panel-menu"><i class="fas fa-ellipsis-h"></i> <span style="margin-left:5px"> Menu</span></a>',
               '<a href="#panel-account"><i class="fa fa-user"></i> <span style="margin-left:5px"> Conta</span></a>',
             ],
           },

package/src/component/layout/Painel.vue

@@ -25,19 +25,19 @@
             </div>
           </div>
         </div>
-        <br />
+        <br v-show="mostrarBotoes"/>
         <div class="row" v-show="mostrarBotoes">
           <div class="col-12" v-show="mostrarBotoes">
             <slot name="conteudo-botoes"></slot>
           </div>
         </div>
-        <br />
+        <br v-show="mostrarBotoes || mostrarPesquisa"/>
         <div class="row" v-show="mostrarBotoes || mostrarPesquisa">
           <div class="col-8">
             <div v-show="mostrarPesquisa"><Pesquisa /></div>
           </div>
         </div>
-        <br />
+        <br v-show="mostrarPesquisa"/>
         <div>
           <slot name="conteudo-principal"></slot>
         </div>

package/src/component/shared/EsconderMostrar.vue

@@ -96,9 +96,6 @@ export default {
         self.mostrarCollapse = true;
       }, 200);
       this.removeCarregandoBotao();
-
-      // antigo
-      eventBus.$emit("maisFiltros");
     },
     esconder() {
       let self = this;
@@ -106,9 +103,6 @@ export default {
         self.mostrarCollapse = false;
       }, 200);
       this.removeCarregandoBotao();
-
-      // antigo
-      eventBus.$emit("esconderFiltros");
     },
     removeCarregandoBotao() {
       this.removeCarregando(["mostrarCollapse", "esconderCollapse"]);

package/src/component/shared/FiltroHorizontal.vue

@@ -20,13 +20,13 @@
           <EscolherEstatico
             titulo="Mostrar"
             campoAlvo="totalPorPagina"
-            :valorInicial="{ titulo: '10', valor: 10 }"
+            :valorInicial="{ conteudo: '10', id: 10 }"
             :dados="[
-              { titulo: '10', valor: 10 },
-              { titulo: '20', valor: 20 },
-              { titulo: '30', valor: 30 },
-              { titulo: '50', valor: 50 },
-              { titulo: '100', valor: 100 },
+              { conteudo: '10', id: 10 },
+              { conteudo: '20', id: 20 },
+              { conteudo: '30', id: 30 },
+              { conteudo: '50', id: 50 },
+              { conteudo: '100', id: 100 },
             ]"
           />
         </b-col>

package/src/component/template/InserirEditarModeloView.vue

@@ -18,7 +18,8 @@
 </template>
 
 <script>
-import Painel from "@/component/layout/Painel";
+import Painel from "@nixweb/nixloc-ui/src/component/layout/Painel";
+
 
 export default {
   name: "InserirEditarModeloView",