@nixweb/nixloc-ui 0.0.121 → 0.0.124

package/src/component/forms/TextoEditor.vue

@@ -1,123 +0,0 @@
-<template>
-  <div>
-    <label>
-      <span class="titulo">{{ titulo }}</span>
-      <span class="requerido" v-if="requerido">*</span>
-      <Dica :campo="campo" :formNome="formNome" />
-    </label>
-    <div class="inner-addon right-addon">
-      <i
-        v-if="notificacoes.length > 0 && formSujo"
-        class="requerido glyphicon fas fa-exclamation-triangle"
-      ></i>
-      <vue-editor v-model.trim="value" :editorToolbar="customToolbar"></vue-editor>
-    </div>
-
-    <div v-if="formSujo">
-      <div v-for="mensagem in notificacoes" :key="mensagem">
-        <span class="invalido">{{ mensagem }}</span>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import Dica from "../shared/Dica.vue";
-import { VueEditor } from "vue2-editor";
-
-import { mapState, mapMutations } from "vuex";
-
-export default {
-  components: { Dica, VueEditor },
-  name: "TextoEditor",
-  mixins: [],
-  props: {
-    titulo: String,
-    campo: String,
-    formNome: String,
-    requerido: Boolean,
-    tamanhoMaximo: Number,
-    value: String,
-  },
-  data() {
-    return {
-      notificacoes: [],
-      formSujo: false,
-      textoEditor: "",
-      customToolbar: [
-        ["bold", "italic", "underline"],
-        [{ list: "ordered" }, { list: "bullet" }],
-        [{ align: "" }, { align: "center" }, { align: "right" }, { align: "justify" }],
-        [{ header: [false] }],
-      ],
-    };
-  },
-  created() {
-    this.valida();
-  },
-  methods: {
-    ...mapMutations("validation", ["insereValidacao", "removeValidacao"]),
-    valida() {
-      this.notificacoes = [];
-
-      if (this.requerido && this.value.length == 0) {
-        var mensagem = `${this.titulo} não pode ser vazio!`;
-        this.notificacoes.push(mensagem);
-      }
-
-      if (this.tamanhoMaximo > 0) {
-        if (this.value.length > this.tamanhoMaximo) {
-          var mensagem = `Máximo de ${this.tamanhoMaximo} caracteres!`;
-          this.notificacoes.push(mensagem);
-        }
-      }
-    },
-  },
-  computed: {
-    ...mapState("validation", ["reiniciaForm", "validacao"]),
-  },
-  watch: {
-    value() {
-      this.valida();
-      this.formSujo = true;
-      this.$emit("input", this.value);
-    },
-    notificacoes() {
-      let self = this;
-      this.notificacoes.forEach(function (notificacao) {
-        let obj = {
-          chave: self.campo + "&" + self.formNome,
-          formNome: self.formNome,
-          notificacao: notificacao,
-        };
-        self.insereValidacao(obj);
-      });
-
-      if (this.notificacoes.length == 0) {
-        let obj = {
-          chave: self.campo + "&" + self.formNome,
-          formNome: self.formNome,
-        };
-        self.removeValidacao(obj);
-      }
-    },
-    reiniciaForm: {
-      handler(form) {
-        if (form.nome == this.formNome) this.formSujo = false;
-      },
-      deep: true,
-    },
-  },
-};
-</script>
-
-<style scoped>
-.sucesso {
-  color: #94aa2a;
-  font-size: 14px;
-}
-.invalido {
-  color: #f0134d;
-  font-size: 14px;
-}
-</style>

package/src/component/layout/Painel.vue

@@ -1,142 +0,0 @@
-<template>
-  <div class="painel">
-    <Toast />
-    <Carregando v-show="carregando('painel')" />
-    <div v-show="!carregando('painel')">
-      <div v-show="mostrarFiltroVertical">
-        <FiltroVertical>
-          <slot name="conteudo-filtro"></slot>
-        </FiltroVertical>
-      </div>
-      <div class="c-container">
-        <Mensagem v-if="!modal.abrir" />
-        <div class="row">
-          <div class="col-10">
-            <div class="div-titulo">
-              <span class="modulo">
-                <span class="icone"><i class="fas fa-compass"></i></span> {{ modulo }} |</span
-              >
-              <span class="titulo"> {{ titulo }}</span>
-            </div>
-          </div>
-          <div class="col-2 text-right" v-show="rotaAtual != 'Dashboard'">
-            <div class="c-voltar" @click="voltar()">
-              <span class="g-espaco-esquerda">Voltar</span>
-            </div>
-          </div>
-        </div>
-        <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 v-show="mostrarBotoes || mostrarPesquisa" />
-        <div v-show="mostrarBotoes || mostrarPesquisa">
-          <div>
-            <div v-show="mostrarPesquisa"><Pesquisa /></div>
-          </div>
-        </div>
-        <br v-show="mostrarPesquisa" />
-        <div>
-          <slot name="conteudo-principal"></slot>
-        </div>
-      </div>
-    </div>
-    <br /><br /><br />
-  </div>
-</template>
-
-<script>
-import Toast from "../shared/Toast.vue";
-import Mensagem from "../shared/Mensagem.vue";
-import Pesquisa from "../shared/Pesquisa.vue";
-import Carregando from "../shared/Carregando.vue";
-import FiltroVertical from "../shared/FiltroVertical";
-
-import { mapState, mapGetters, mapMutations } from "vuex";
-
-export default {
-  name: "Painel",
-  components: {
-    Carregando,
-    FiltroVertical,
-    Pesquisa,
-    Mensagem,
-    Toast,
-  },
-  props: {
-    modulo: String,
-    titulo: String,
-    mostrarFiltroVertical: Boolean,
-    mostrarPesquisa: Boolean,
-    mostrarBotoes: Boolean,
-  },
-  data() {
-    return {
-      rotaAtual: this.$route.name,
-    };
-  },
-  created() {
-    this.insereCarregando("painel");
-  },
-  updated() {
-    this.rotaAtual = this.$route.name;
-  },
-  computed: {
-    ...mapGetters("generic", ["carregando"]),
-    ...mapState("generic", ["modal"]),
-  },
-  methods: {
-    ...mapMutations("generic", ["insereCarregando"]),
-    voltar() {
-      window.history.back();
-    },
-  },
-};
-</script>
-<style scoped>
-.c-container {
-  margin: auto;
-  padding-left: 110px;
-  max-width: 1400px;
-}
-
-.div-titulo {
-  margin-top: 15px;
-}
-
-.modulo {
-  font-size: 16px;
-  font-weight: 400;
-}
-
-.titulo {
-  font-size: 18px;
-  font-weight: 400;
-  line-height: 34px;
-  color: #577696;
-}
-
-.icone{
-  opacity: 0.8;
-  font-size: 20px;
-}
-
-
-.c-voltar {
-  margin-top: 20px;
-  margin-right: 12px;
-  font-size: 16px;
-  cursor: pointer;
-  color: #8ca1b7;
-}
-
-.c-voltar:hover {
-  color: #8ca1b7;
-}
-
-.painel {
-  padding: 25px;
-}
-</style>

package/src/component/shared/BotaoCarregarMais.vue

@@ -1,23 +0,0 @@
-<template>
-  <div>
-    <Botao
-      chave="carregarMais"
-      nomeEvento="carregarMais"
-      tipo="alerta"
-      titulo="Carregar mais..."
-      classeIcone="fas fa-redo"
-      tamanho="medio"
-    />
-  </div>
-</template>
-<script>
-import Botao from "../forms/Botao.vue";
-export default {
-  name: "BotaoCarregarMais",
-  components: { Botao },
-  data() {
-    return {};
-  },
-  methods: {},
-};
-</script>

package/src/component/shared/CabecalhoImpressao.vue

@@ -1,36 +0,0 @@
-<template>
-  <div class="div-cabecalho somente-impressao">
-    <div class="titulo">{{ nomeArquivo }}</div>
-    <div class="lado-a-lado div-tag" v-for="tag in tags" :key="tag.id">
-      <span>{{ tag.titulo }}</span> <span>{{ tag.valor }}</span>
-      <span>,</span>
-    </div>
-  </div>
-</template>
-
-<script>
-import { mapGetters, mapMutations } from "vuex";
-
-export default {
-  name: "CabecalhoImpressao",
-  computed: {
-    ...mapGetters("relatorio", ["tags"]),
-    nomeArquivo() {
-      return this.$route.matched[0].props.default.relatorio;
-    },
-  },
-};
-</script>
-<style scoped>
-.div-cabecalho {
-  margin: 20px;
-}
-
-.div-tag {
-  margin-right: 10px;
-}
-
-.titulo {
-  font-size: 18px;
-}
-</style>

package/src/component/shared/Confirmacao.vue

@@ -1,80 +0,0 @@
-<template>
-  <div>
-    <div @click="executar()">
-      <slot></slot>
-    </div>
-    <Modal
-      :titulo="titulo"
-      :largura="450"
-      :altura="250"
-      v-show="mostrarModal(`confirmacao${dados.id}`)"
-    >
-      <b-col sm="12">
-        <div class="div-botao text-center">
-          <Botao
-            chave="confirmacaoNao"
-            tipo="editar"
-            titulo="cancelar"
-            tamanho="pequeno"
-            :clique="cancelar"
-          />
-          <Botao
-            chave="confirmacaoSim"
-            :tipo="tipo"
-            titulo="Sim, confirmar"
-            tamanho="medio"
-            :clique="confirmar"
-          />
-        </div>
-      </b-col>
-    </Modal>
-  </div>
-</template>
-
-<script>
-import Botao from "@nixweb/nixloc-ui/src/component/forms/Botao";
-import Modal from "@nixweb/nixloc-ui/src/component/forms/Modal";
-
-import { mapGetters, mapMutations } from "vuex";
-
-export default {
-  name: "Confirmacao",
-  components: {
-    Botao,
-    Modal,
-  },
-  props: {
-    titulo: String,
-    tipo: String,
-    dados: Object,
-    confirmado: Function,
-  },
-  methods: {
-    ...mapMutations("generic", ["abrirModal", "fecharModal", "removeCarregando"]),
-    executar() {
-      this.abrirModal(`confirmacao${this.dados.id}`);
-    },
-    confirmar() {
-      let self = this;
-      setTimeout(function () {
-        if (self.confirmado) self.confirmado(self.dados);
-        self.removeCarregando(["confirmacaoSim"]);
-        self.fecharModal();
-      }, 200);
-    },
-    cancelar() {
-      this.removeCarregando(["confirmacaoNao"]);
-      this.fecharModal();
-    },
-  },
-  computed: {
-    ...mapGetters("generic", ["mostrarModal", "evento"]),
-  },
-};
-</script>
-<style scoped>
-.div-botao {
-  padding-top: 20px;
-  height: 100px;
-}
-</style>

package/src/component/shared/Dica.vue

@@ -1,42 +0,0 @@
-<template>
-  <span class="dica" v-if="titulo">
-    <i
-      class="fal fa-exclamation-circle"
-      :title="titulo"
-      v-b-popover.hover.top="descricao"
-    ></i>
-  </span>
-</template>
-<script>
-import { mapGetters } from "vuex";
-
-export default {
-  name: "Dica",
-  props: {
-    campo: String,
-    formNome: String,
-  },
-  data() {
-    return {
-      titulo: "",
-      descricao: "",
-    };
-  },
-  mounted() {
-    let dica = this.dica({ campo: this.campo, formNome: this.formNome });
-    if (dica) {
-      this.titulo = dica.titulo;
-      this.descricao = dica.descricao;
-    }
-  },
-  computed: {
-    ...mapGetters("generic", ["dica"]),
-  },
-};
-</script>
-
-<style scoped>
-.dica {
-  cursor: pointer;
-}
-</style>

package/src/component/shared/EsconderMostrar.vue

@@ -1,131 +0,0 @@
-<template>
-  <div>
-    <div class="linha-seta" v-if="tipo == 'seta'">
-      <div class="seta" @click="mostrar" v-if="!mostrarCollapse">
-        <b-row>
-          <b-col sm="6" class="text-left">
-            <span class="titulo">{{ titulo }}</span>
-          </b-col>
-          <b-col sm="6" class="text-right">
-            <i class="far fa-plus"></i>
-          </b-col>
-        </b-row>
-      </div>
-      <div class="seta" @click="esconder" v-if="mostrarCollapse">
-        <b-row>
-          <b-col sm="6" class="text-left">
-            <span class="titulo">{{ titulo }}</span>
-          </b-col>
-          <b-col sm="6" class="text-right">
-            <i class="far fa-minus"></i>
-          </b-col>
-        </b-row>
-      </div>
-    </div>
-    <b-collapse id="collapse-4" v-model="mostrarCollapse" class="mt-2">
-      <slot></slot>
-    </b-collapse>
-    <div v-if="tipo == 'botao'">
-      <b-row>
-        <b-col sm="12">
-          <div class="text-center">
-            <Botao
-              v-if="!mostrarCollapse"
-              :titulo="botaoMostrar.titulo"
-              :classeIcone="botaoMostrar.icone"
-              :tipo="botaoMostrar.tipo"
-              tamanho="pequeno"
-              :clique="mostrar"
-            />
-          </div>
-        </b-col>
-      </b-row>
-      <b-row>
-        <b-col>
-          <div class="text-center">
-            <Botao
-              v-if="mostrarCollapse"
-              chave="esconderCollapse"
-              :titulo="botaoEsconder.titulo"
-              :classeIcone="botaoEsconder.icone"
-              :tipo="botaoEsconder.tipo"
-              tamanho="pequeno"
-              :clique="esconder"
-            />
-          </div>
-        </b-col>
-      </b-row>
-    </div>
-  </div>
-</template>
-
-<script>
-import Botao from "../forms/Botao.vue";
-
-import { mapMutations } from "vuex";
-
-export default {
-  components: { Botao },
-  name: "EsconderMostrar",
-  props: {
-    botaoMostrar: Object,
-    botaoEsconder: Object,
-    tipo: {
-      type: String,
-      default: "botao",
-    },
-    titulo: String,
-    iniciarAberto: {
-      type: Boolean,
-      default: false,
-    },
-  },
-  data() {
-    return {
-      mostrarCollapse: false,
-    };
-  },
-  created() {
-    this.mostrarCollapse = this.iniciarAberto;
-  },
-  methods: {
-    ...mapMutations("generic", ["removeCarregando"]),
-    mostrar() {
-      let self = this;
-      setTimeout(function () {
-        self.mostrarCollapse = true;
-      }, 200);
-      this.removeCarregandoBotao();
-    },
-    esconder() {
-      let self = this;
-      setTimeout(function () {
-        self.mostrarCollapse = false;
-      }, 200);
-      this.removeCarregandoBotao();
-    },
-    removeCarregandoBotao() {
-      this.removeCarregando(["mostrarCollapse", "esconderCollapse"]);
-    },
-  },
-};
-</script>
-<style scoped>
-.seta {
-  font-size: 14px;
-  color: #577696;
-  cursor: pointer;
-  margin-bottom: 10px;
-}
-
-.titulo {
-  font-size: 16px;
-  margin-left: 5px;
-}
-
-.linha-seta {
-  border-top: solid 1px #dbdfe9;
-  margin-top: 10px;
-  padding-top: 10px;
-}
-</style>

package/src/component/shared/ExportarExcel.vue

@@ -1,67 +0,0 @@
-<template>
-  <div>
-    <download-excel
-      :fields="coluna"
-      :data="dados"
-      :before-finish="exportacaoFinalizada"
-      worksheet="Planilha"
-      :name="`${nomeArquivo}.xls`"
-    >
-      <Botao
-        chave="exportarExcel"
-        :tipo="botao.tipo"
-        :titulo="botao.titulo"
-        classeIcone="fas fa-file-excel"
-        :tamanho="botao.tamanho"
-      />
-    </download-excel>
-  </div>
-</template>
-
-<script>
-import Botao from "@nixweb/nixloc-ui/src/component/forms/Botao";
-
-import { mapState, mapGetters, mapActions, mapMutations } from "vuex";
-
-export default {
-  name: "ExportarExcel",
-  props: {
-    botao: Object,
-    cabecalho: Array,
-    dados: Array,
-  },
-  components: {
-    Botao,
-  },
-  data() {
-    return {
-      json_meta: [
-        [
-          {
-            key: "charset",
-            value: "utf-8",
-          },
-        ],
-      ],
-    };
-  },
-  methods: {
-    ...mapMutations("generic", ["removeCarregando"]),
-    exportacaoFinalizada() {
-      this.removeCarregando(["exportarExcel"]);
-    },
-  },
-  computed: {
-    coluna() {
-      var object = this.cabecalho.reduce(
-        (obj, item) => Object.assign(obj, { [item.titulo]: item.campo }),
-        {}
-      );
-      return object;
-    },
-    nomeArquivo() {
-      return this.$route.matched[0].props.default.relatorio;
-    },
-  },
-};
-</script>

package/src/component/shared/FiltroHorizontal.vue

@@ -1,59 +0,0 @@
-<template>
-  <div class="filtro-horizontal">
-    <EsconderMostrar
-      :botaoMostrar="{
-        titulo: 'Mais filtros',
-        icone: 'fas fa-arrow-alt-circle-down',
-        tipo: 'info',
-      }"
-      :botaoEsconder="{
-        titulo: 'Menos filtros',
-        icone: 'fas fa-arrow-alt-circle-up',
-        tipo: 'alerta',
-      }"
-    >
-      <b-row>
-        <b-col :sm="mostrarTotalPorPagina ? 10 : 12">
-          <slot name="conteudo-filtro-horizontal"></slot>
-        </b-col>
-        <b-col xs="12" sm="12" md="12" lg="2" xl="2" v-if="mostrarTotalPorPagina">
-          <EscolherEstatico
-            titulo="Mostrar"
-            campoAlvo="totalPorPagina"
-            :valorInicial="{ conteudo: '10', id: 10 }"
-            :dados="[
-              { conteudo: '10', id: 10 },
-              { conteudo: '20', id: 20 },
-              { conteudo: '30', id: 30 },
-              { conteudo: '50', id: 50 },
-              { conteudo: '100', id: 100 },
-            ]"
-          />
-        </b-col>
-      </b-row>
-    </EsconderMostrar>
-  </div>
-</template>
-
-<script>
-import EsconderMostrar from "./EsconderMostrar.vue";
-import EscolherEstatico from "../forms/EscolherEstatico.vue";
-import Escolher from "../forms/Escolher";
-
-export default {
-  name: "ModeloLista",
-  components: { Escolher, EscolherEstatico, EsconderMostrar },
-  props: {
-    mostrarTotalPorPagina: {
-      type: Boolean,
-      default: true,
-    },
-  },
-};
-</script>
-
-<style scoped>
-.filtro-horizontal {
-  margin-bottom: 5px;
-}
-</style>