@nixweb/nixloc-ui 0.0.116 → 0.0.119

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nixweb/nixloc-ui",
3
- "version": "0.0.116",
3
+ "version": "0.0.119",
4
4
  "description": "Componentes UI",
5
5
  "author": "Fábio Ávila <fabio@nixweb.com.br>",
6
6
  "private": false,
@@ -3,7 +3,7 @@
3
3
  <label>
4
4
  <span class="titulo">{{ titulo }}</span>
5
5
  </label>
6
- <div class="selecione">
6
+ <div class="selecione" :class="{ borda: mostrarBorda }">
7
7
  <multiselect
8
8
  @open="aoAbrir"
9
9
  @select="aoSelecionar"
@@ -64,6 +64,10 @@ export default {
64
64
  type: Boolean,
65
65
  default: false,
66
66
  },
67
+ mostrarBorda: {
68
+ type: Boolean,
69
+ default: true,
70
+ },
67
71
  dados: Array,
68
72
  value: Object,
69
73
  },
@@ -124,9 +128,12 @@ div.antes-lista {
124
128
  }
125
129
 
126
130
  .selecione {
127
- height: 34px;
128
- border-bottom: 1px solid #d6d6d6;
129
- border-radius: 2px !important;
131
+ height: 38px;
132
+ border-radius: 5px !important;
130
133
  margin-bottom: 20px;
131
134
  }
135
+
136
+ .borda {
137
+ border: 1px solid #dbdee0 !important;
138
+ }
132
139
  </style>
@@ -50,7 +50,7 @@ export default {
50
50
  toolbarContainer.appendChild(editor.ui.view.toolbar.element);
51
51
  },
52
52
  modificou() {
53
- this.insereEvento({ nome: "documentoEditoFocus" });
53
+ this.insereEvento({ nome: "documentoEditorFocus" });
54
54
  },
55
55
  },
56
56
  };
@@ -19,7 +19,7 @@ export default {
19
19
  methods: {
20
20
  sMg(grN) {
21
21
  let total = "";
22
- this.dados.produto.forEach((x) => {
22
+ this.d.produto.forEach((x) => {
23
23
  if (x.pGp === grN) return (total = x.pGpT);
24
24
  });
25
25
  return total;
@@ -28,7 +28,7 @@ export default {
28
28
  computed: {
29
29
  ...mapGetters("generic", ["agruparPor"]),
30
30
  produtoAgrupado() {
31
- return this.agruparPor({ array: this.dados.produto, key: "grupoNome" });
31
+ return this.agruparPor({ array: this.d.produto, key: "pGp" });
32
32
  },
33
33
  },
34
34
  };
@@ -1,56 +1,97 @@
1
1
  <template>
2
2
  <div>
3
- <div class="div-alerta">
4
- <Alerta tipo="info">
5
- <span> Utilize os parâmetros conforme descrição abaixo!</span>
6
- </Alerta>
7
- </div>
8
- <table class="table table-responsive-xs">
9
- <thead>
10
- <tr>
11
- <th><span class="titulo-cabecalho">Parâmetro</span></th>
12
- <th><span class="titulo-cabecalho">Descrição</span></th>
13
- <th><span class="titulo-cabecalho">Exemplo</span></th>
14
- </tr>
15
- </thead>
16
- <tbody v-for="(legenda, grupoNome) in agrupado">
17
- <td class="grupo text-center" colspan="8">
18
- <div>{{ grupoNome }}</div>
19
- </td>
20
- <tr v-for="item in legenda">
21
- <td class="parametro">
22
- <span> {{ item.parametro }}</span>
3
+ <Pesquisa />
4
+ <br />
5
+ <BarraRolagem :alturaMinima="400" :alturaMaxima="400">
6
+ <table class="table table-responsive-xs">
7
+ <thead>
8
+ <tr>
9
+ <th><span class="titulo-cabecalho">Parâmetro</span></th>
10
+ <th><span class="titulo-cabecalho">Descrição</span></th>
11
+ <th><span class="titulo-cabecalho">Exemplo</span></th>
12
+ </tr>
13
+ </thead>
14
+ <tbody v-for="(legendaLocal, grupoNome) in agrupado">
15
+ <td class="grupo text-center" colspan="8">
16
+ <div>{{ grupoNome.toUpperCase() }}</div>
23
17
  </td>
24
- <td>
25
- <span> {{ item.descricao }}</span>
26
- </td>
27
- <td>
28
- <span class="exemplo"> {{ item.exemplo }}</span>
29
- </td>
30
- </tr>
31
- </tbody>
32
- </table>
18
+ <tr v-for="item in legendaLocal">
19
+ <td class="parametro">
20
+ <span> {{ item.parametro }}</span>
21
+ </td>
22
+ <td>
23
+ <span> {{ item.descricao }}</span>
24
+ </td>
25
+ <td>
26
+ <span class="exemplo"> {{ item.exemplo }}</span>
27
+ </td>
28
+ </tr>
29
+ </tbody>
30
+ </table>
31
+ </BarraRolagem>
33
32
  </div>
34
33
  </template>
35
34
  <script>
36
- import Alerta from "@nixweb/nixloc-ui/src/component/layout/Alerta";
35
+ import Pesquisa from "@nixweb/nixloc-ui/src/component/shared/Pesquisa.vue";
36
+ import BarraRolagem from "@nixweb/nixloc-ui/src/component/layout/BarraRolagem.vue";
37
37
 
38
- import { mapGetters } from "vuex";
38
+ import { mapGetters, mapState, mapMutations } from "vuex";
39
39
 
40
40
  export default {
41
41
  name: "LegendaParametro",
42
42
  components: {
43
- Alerta,
43
+ BarraRolagem,
44
+ Pesquisa,
44
45
  },
45
46
  props: {
46
47
  legenda: [],
47
48
  },
49
+ data() {
50
+ return {
51
+ legendaLocal: [],
52
+ };
53
+ },
54
+ mounted() {
55
+ this.legendaLocal = this.legenda;
56
+ },
57
+ methods: {
58
+ ...mapMutations("generic", ["removeCarregando"]),
59
+ },
48
60
  computed: {
49
61
  ...mapGetters("generic", ["agruparPor"]),
62
+ ...mapState("generic", ["pesquisa", "buscouPesquisa", "limpouPesquisa"]),
50
63
  agrupado() {
51
- var teste = this.agruparPor({ array: this.legenda, key: "grupoNome" });
52
- console.log(teste);
53
- return teste;
64
+ var lista = this.agruparPor({ array: this.legendaLocal, key: "grupoNome" });
65
+ return lista;
66
+ },
67
+ },
68
+ watch: {
69
+ buscouPesquisa: function () {
70
+ let legenda = [];
71
+
72
+ let self = this;
73
+ setTimeout(function () {
74
+ self.legenda.forEach(function (item) {
75
+ if (self.pesquisa.filtro.conteudo == "igual") {
76
+ if (item.descricao == self.pesquisa.conteudo) legenda.push(item);
77
+ }
78
+
79
+ if (self.pesquisa.filtro.conteudo == "contem") {
80
+ if (item.descricao.includes(self.pesquisa.conteudo)) legenda.push(item);
81
+ }
82
+ });
83
+
84
+ self.legendaLocal = legenda;
85
+
86
+ self.removeCarregando(["pesquisar", "limpar"]);
87
+ }, 300);
88
+ },
89
+ limpouPesquisa: function () {
90
+ let self = this;
91
+ setTimeout(function () {
92
+ self.legendaLocal = self.legenda;
93
+ self.removeCarregando(["pesquisar", "limpar"]);
94
+ }, 300);
54
95
  },
55
96
  },
56
97
  };
@@ -89,6 +130,6 @@ export default {
89
130
 
90
131
  .exemplo {
91
132
  font-size: 14px;
92
- color:rgb(82, 74, 74);
133
+ color: rgb(31, 31, 82);
93
134
  }
94
135
  </style>
@@ -1,29 +1,37 @@
1
1
  <template>
2
2
  <b-row>
3
- <b-col xs="12" sm="12" md="12" lg="5" xl="5">
3
+ <b-col xs="12" sm="12" md="12" lg="7" xl="6">
4
4
  <div class="margem">
5
- <input
6
- type="text"
7
- name="pesquisar"
8
- placeholder="Pesquisar ..."
9
- @keyup="verificaLimpaPesquisa()"
10
- @keyup.enter.prevent="buscaPesquisa()"
11
- v-model="pesquisa.conteudo"
12
- />
5
+ <div class="moldura">
6
+ <b-row>
7
+ <b-col sm="9">
8
+ <input
9
+ type="text"
10
+ name="pesquisar"
11
+ placeholder="Pesquisar ..."
12
+ @keyup="verificaLimpaPesquisa()"
13
+ @keyup.enter.prevent="buscaPesquisa()"
14
+ v-model="pesquisa.conteudo"
15
+ /></b-col>
16
+ <b-col sm="3">
17
+ <div class="div-escolher">
18
+ <EscolherEstatico
19
+ campoAlvo="filtro"
20
+ :somenteConsulta="true"
21
+ :valorInicial="{ conteudo: 'Contém', id: 'contem' }"
22
+ v-model="pesquisa.filtro"
23
+ :mostrarBorda="false"
24
+ :dados="[
25
+ { conteudo: 'Contém', id: 'contem' },
26
+ { conteudo: 'Igual', id: 'igual' },
27
+ ]"
28
+ />
29
+ </div>
30
+ </b-col>
31
+ </b-row>
32
+ </div>
13
33
  </div>
14
34
  </b-col>
15
- <b-col xs="12" sm="12" md="12" lg="2" xl="2">
16
- <EscolherEstatico
17
- campoAlvo="filtro"
18
- :somenteConsulta="true"
19
- :valorInicial="{ conteudo: 'Contém', id: 'contem' }"
20
- v-model="pesquisa.filtro"
21
- :dados="[
22
- { conteudo: 'Contém', id: 'contem' },
23
- { conteudo: 'Igual', id: 'igual' },
24
- ]"
25
- />
26
- </b-col>
27
35
  <b-col xs="4" sm="4" md="4" lg="4" xl="4">
28
36
  <div class="div-botao">
29
37
  <Botao
@@ -103,16 +111,16 @@ export default {
103
111
  }
104
112
 
105
113
  .div-botao {
106
- padding-top: 30px;
114
+ padding-top: 33px;
107
115
  }
108
116
 
109
117
  ::placeholder {
110
118
  color: #b8c4d2;
111
119
  }
112
120
 
113
- input[type="text"] {
121
+ .moldura {
114
122
  width: 100%;
115
- height: 40px;
123
+ height: 45px;
116
124
  font-size: 14px;
117
125
  padding: 5px 8px 6px 15px;
118
126
  background-color: rgb(255, 255, 255);
@@ -125,7 +133,22 @@ input[type="text"] {
125
133
  transition: background-color 0.1s ease-in 0s, border 0.1s ease-in 0s;
126
134
  }
127
135
 
136
+ input[type="text"] {
137
+ width: 100%;
138
+ height: 30px;
139
+ font-size: 14px;
140
+ border: 0px solid white;
141
+ background-color: rgb(255, 255, 255);
142
+ margin-bottom: 50px;
143
+ }
144
+
128
145
  input[type="text"]:focus {
129
146
  outline: none;
130
147
  }
148
+
149
+ .div-escolher {
150
+ margin-top: -30px;
151
+ margin-right: 5px;
152
+ }
153
+
131
154
  </style>
@@ -72,15 +72,13 @@
72
72
  <Modal titulo="Salvar" :largura="500" v-show="mostrarModal('salvarDocumento')">
73
73
  <slot></slot>
74
74
  </Modal>
75
- <Modal titulo="Parâmetros" :largura="1000" v-if="mostrarModal('legenda')">
76
- <BarraRolagem :alturaMinima="400" :alturaMaxima="400">
77
- <LegendaParametro :legenda="legenda" />
78
- </BarraRolagem>
75
+ <Modal titulo="Parâmetros" :largura="1100" v-if="mostrarModal('legenda')">
76
+ <LegendaParametro v-if="modal.abrir" :legenda="legenda" />
79
77
  </Modal>
80
78
  <Modal titulo="Editor de Código" :largura="900" v-if="mostrarModal('codigo')">
81
79
  <CodigoEditor v-if="modal.abrir" />
82
80
  </Modal>
83
- <Modal titulo="Visualizar" :largura="1100" v-if="mostrarModal('visualizar')">
81
+ <Modal titulo="Visualizar" :largura="1200" v-if="mostrarModal('visualizar')">
84
82
  <div v-if="modal.abrir">
85
83
  <b-row>
86
84
  <b-col class="text-center">
@@ -96,10 +94,12 @@
96
94
  </b-col>
97
95
  </b-row>
98
96
  <br />
99
- <BarraRolagem :alturaMinima="300" :alturaMaxima="500">
100
- <div class="a4">
101
- <div id="printMe">
102
- <DocumentoPreview :template="documentoPreview" :d="dados" />
97
+ <BarraRolagem :alturaMinima="500" :alturaMaxima="500">
98
+ <div>
99
+ <div class="a4">
100
+ <div id="printMe">
101
+ <DocumentoPreview :template="documentoPreview" :d="dados" />
102
+ </div>
103
103
  </div>
104
104
  </div>
105
105
  </BarraRolagem>
@@ -199,7 +199,7 @@ export default {
199
199
  evento: {
200
200
  handler(evento) {
201
201
  if (evento.nome == "documentoEditorModificado") this.salvarDesabilitado = true;
202
- if (evento.nome == "documentoEditoFocus") this.salvarDesabilitado = false;
202
+ if (evento.nome == "documentoEditorFocus") this.salvarDesabilitado = false;
203
203
  },
204
204
  deep: true,
205
205
  },
@@ -214,7 +214,7 @@ export default {
214
214
  margin-top: 25px;
215
215
  }
216
216
  .a4 {
217
- width: 22cm;
217
+ max-width: 1140px;
218
218
  min-height: 21cm;
219
219
  padding: 20px;
220
220
  border: 1px hsl(0, 0%, 82.7%) solid;
@@ -223,4 +223,5 @@ export default {
223
223
  box-shadow: 0 0 5px hsl(0deg 0% 0% / 10%);
224
224
  margin: 0 auto;
225
225
  }
226
+
226
227
  </style>
@@ -275,6 +275,8 @@ export default {
275
275
  });
276
276
  });
277
277
 
278
+ if (this.filtroObrigatorio.length == 0) retorno = false;
279
+
278
280
  return retorno;
279
281
  },
280
282
  tamanhoDados() {
@@ -28,7 +28,7 @@ export default {
28
28
  tipo: undefined,
29
29
  },
30
30
  ids: undefined,
31
- pesquisa: { conteudo: "", filtro: { conteudo: "contem", id: "contem" } },
31
+ pesquisa: { conteudo: "", filtro: { text: "Contém", value: "contem" } },
32
32
  documentoHtml: "",
33
33
  EscolherEstatico: { dataHora: undefined, campoAlvo: undefined, valor: undefined },
34
34
  buscouPesquisa: false,
@@ -94,17 +94,17 @@ export default {
94
94
  let ehPagamento = th.innerText.includes("n.pagamento");
95
95
 
96
96
  if (ehProduto) {
97
- obj.vForSimples = "v-for='p in dados.produto'";
97
+ obj.vForSimples = "v-for='p in d.produto'";
98
98
  config.push(obj);
99
99
  } else if (ehPeriodo) {
100
- obj.vForSimples = "v-for='pe in dados.periodo'";
100
+ obj.vForSimples = "v-for='pe in d.periodo'";
101
101
  config.push(obj);
102
102
  } else if (ehPagamento) {
103
- obj.vForSimples = "v-for='n in dados.pagamento'";
103
+ obj.vForSimples = "v-for='pg in d.pagamento'";
104
104
  config.push(obj);
105
105
  } else if (ehPorGrupo) {
106
106
  obj.vForAgrupado = "v-for='(produto, grN) in produtoAgrupado'";
107
- obj.vForSimples = "v-for='p in produto'";
107
+ obj.vForSimples = "v-for='p in d.produto'";
108
108
 
109
109
  var posicaoInicio = documentoHtml.split("<tbody>", sequencial + 1).join("<tbody>").length;
110
110
  var posicaoFim = documentoHtml.split("</tbody>", sequencial + 1).join("</tbody>").length;
@@ -132,6 +132,10 @@ export default {
132
132
  replace += `.replace("<tbody>${x.nomeGrupo}<tr>", "<tbody ${x.vForAgrupado}>${x.nomeGrupoReplace}<tr ${x.vForSimples}>")`;
133
133
  });
134
134
 
135
+
136
+ console.log(config);
137
+
138
+
135
139
  var ret = retorno.replaceAll("\"", "'");
136
140
  ret = eval(`ret${replace}`);
137
141
 
@@ -140,7 +144,6 @@ export default {
140
144
  .replaceAll("n.produto", "")
141
145
  .replaceAll("n.periodo", "")
142
146
  .replaceAll("n.pagamento", "")
143
- .replaceAll(";", "!important;")
144
147
  .replaceAll("<p>&nbsp!important;</p>", "<p>&nbsp</p>");
145
148
 
146
149
  return classeImportant;