@burh/nuxt-core 1.0.203 → 1.0.205

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.
@@ -28,23 +28,44 @@
28
28
  em contato.
29
29
  </p>
30
30
 
31
- <form>
32
- <input
33
- type="text"
34
- v-model="name"
35
- placeholder="Nome Completo"
36
- />
37
-
38
- <input
39
- type="text"
40
- v-model="phone"
41
- placeholder="Telefone"
42
- />
43
-
44
- <button type="button" @click="sendContact()">
45
- Solicitar Contato
46
- </button>
47
- </form>
31
+ <validation-observer ref="sendTest">
32
+ <section>
33
+ <validation-provider
34
+ tag="div"
35
+ name="Nome"
36
+ rules="required"
37
+ v-slot="{ errors }"
38
+ >
39
+ <base-input
40
+ type="text"
41
+ v-model="name"
42
+ :error="errors[0]"
43
+ :valid="errors.length ? true : false"
44
+ placeholder="Nome Completo"
45
+ />
46
+ </validation-provider>
47
+
48
+ <validation-provider
49
+ tag="div"
50
+ name="Telefone"
51
+ rules="required"
52
+ v-slot="{ errors }"
53
+ >
54
+ <base-input
55
+ type="text"
56
+ v-model="phone"
57
+ id="phone"
58
+ :error="errors[0]"
59
+ :valid="errors.length ? true : false"
60
+ placeholder="Telefone"
61
+ />
62
+ </validation-provider>
63
+
64
+ <button type="button" @click="sendContact()">
65
+ Solicitar Contato
66
+ </button>
67
+ </section>
68
+ </validation-observer>
48
69
  </section>
49
70
  </div>
50
71
  </div>
@@ -79,10 +100,14 @@ export default {
79
100
  };
80
101
  },
81
102
  methods: {
82
- sendContact() {
83
- if (this.name || this.phone) {
84
- this.$emit('send-contact', this.name, this.phone);
103
+ async sendContact() {
104
+ const pass = await this.$refs.sendTest.validate();
105
+ if (!pass) {
106
+ return;
85
107
  }
108
+
109
+ this.$emit('send-contact', this.name, this.phone);
110
+ this.$emit('close');
86
111
  }
87
112
  }
88
113
  };
@@ -172,7 +197,7 @@ export default {
172
197
  color: #1d364b;
173
198
  }
174
199
 
175
- form {
200
+ section {
176
201
  input {
177
202
  margin: 0.4rem 0;
178
203
  padding: 0.75rem;
@@ -0,0 +1,285 @@
1
+ <template>
2
+ <el-dialog
3
+ :visible.sync="isActive"
4
+ width="45%"
5
+ custom-class="position-relative"
6
+ @close="$emit('close')"
7
+ >
8
+ <template>
9
+ <div class="modal-request">
10
+ <h3>Requisição de Vagas</h3>
11
+
12
+ <validation-observer ref="sendTest">
13
+ <section>
14
+ <label for="job">Escolha a vaga desejada</label>
15
+ <el-select
16
+ filterable
17
+ no-match-text="Nenhuma vaga encontrada"
18
+ no-data-text="Nenhuma vaga encontrada"
19
+ placeholder="Escolha"
20
+ v-model="job"
21
+ class="w-100"
22
+ >
23
+ <el-option
24
+ v-for="(job, index) in allJobs"
25
+ class="select-danger"
26
+ :value="job.id"
27
+ :label="job.title"
28
+ :key="index"
29
+ ></el-option>
30
+ </el-select>
31
+
32
+ <label for="reason" class="mt-4">Motivo</label>
33
+ <el-select
34
+ filterable
35
+ no-match-text="Nenhum dado encontrado"
36
+ no-data-text="Nenhum dado encontrado"
37
+ placeholder="Escolha"
38
+ v-model="reason"
39
+ class="w-100"
40
+ >
41
+ <el-option
42
+ v-for="(reas, index) in allReasons"
43
+ class="select-danger"
44
+ :value="reas.value"
45
+ :label="reas.label"
46
+ :key="index"
47
+ ></el-option>
48
+ </el-select>
49
+
50
+ <validation-provider
51
+ tag="div"
52
+ name="Salário"
53
+ rules="required"
54
+ v-slot="{ errors }"
55
+ >
56
+ <base-input
57
+ v-model="salary"
58
+ class="w-100 mt-4"
59
+ id="salary"
60
+ :error="errors[0]"
61
+ :valid="errors.length ? true : false"
62
+ label="Salário"
63
+ v-on:input="setSalary($event)"
64
+ placeholder="R$ 1.500,00"
65
+ />
66
+ </validation-provider>
67
+
68
+ <el-checkbox v-model="confidential">
69
+ Confidencial
70
+ </el-checkbox>
71
+
72
+ <label for="observations" class="mt-4"
73
+ >Observações</label
74
+ >
75
+ <textarea
76
+ id="observations"
77
+ class="form-control"
78
+ v-model="observations"
79
+ ></textarea>
80
+
81
+ <button
82
+ type="button"
83
+ @click="sendRequest"
84
+ class="btn btn-primary"
85
+ >
86
+ Solicitar Abertura
87
+ </button>
88
+ </section>
89
+ </validation-observer>
90
+ </div>
91
+
92
+ <span class="tool tool-close" @click="$emit('close')">
93
+ Fechar
94
+ <font-awesome-icon
95
+ :icon="['fas', 'times']"
96
+ class="text-white ml-1"
97
+ />
98
+ </span>
99
+ </template>
100
+ </el-dialog>
101
+ </template>
102
+
103
+ <script>
104
+ import { Dialog, Select, Option, Checkbox } from 'element-ui';
105
+
106
+ export default {
107
+ name: 'request-modal',
108
+ components: {
109
+ [Dialog.name]: Dialog,
110
+ [Select.name]: Select,
111
+ [Option.name]: Option,
112
+ [Checkbox.name]: Checkbox
113
+ },
114
+ props: {
115
+ isActive: Boolean,
116
+ allJobs: Array,
117
+ userId: String
118
+ },
119
+ data() {
120
+ return {
121
+ name: '',
122
+ job: '',
123
+ reason: '',
124
+ salary: '',
125
+ confidential: false,
126
+ observations: '',
127
+ allReasons: [
128
+ {
129
+ value: 'Aumento de quadro',
130
+ label: 'Aumento de quadro'
131
+ },
132
+ {
133
+ value: 'Outra coisa que não sei ainda',
134
+ label: 'Outra coisa que não sei ainda'
135
+ }
136
+ ],
137
+ mask: ''
138
+ };
139
+ },
140
+ methods: {
141
+ async sendRequest() {
142
+ const pass = await this.$refs.sendTest.validate();
143
+ if (!pass) {
144
+ return;
145
+ }
146
+
147
+ let salary = this.salary;
148
+ salary = this.replaceAll(salary, '.', '');
149
+ salary = salary
150
+ .replace(',', '.')
151
+ .replace('R$', '')
152
+ .trim();
153
+
154
+ let payload = {
155
+ job_id: this.job,
156
+ user_id: parseInt(this.userId),
157
+ reason: this.reason,
158
+ salary: parseInt(salary),
159
+ private: this.confidential,
160
+ note: this.observations
161
+ };
162
+
163
+ this.$emit('send-request', payload);
164
+ this.$emit('close');
165
+ },
166
+ setSalary(e, onlyMasking = false) {
167
+ let value = e
168
+ .replace(/\s/g, '')
169
+ .replace('R$', '')
170
+ .replace('.', '')
171
+ .replace(',', '');
172
+
173
+ if (value.trim() == '') {
174
+ this.salary = 'R$ 0,00';
175
+ return;
176
+ }
177
+
178
+ if (value.length > 2) {
179
+ let position = value.length - 2;
180
+ value = [
181
+ value.slice(0, position),
182
+ '.',
183
+ value.slice(position)
184
+ ].join('');
185
+ } else {
186
+ value = '0.' + value;
187
+ }
188
+
189
+ while (value.charAt(0) === '0' && value.length >= 5) {
190
+ value = value.substr(1);
191
+ }
192
+
193
+ if (!onlyMasking) {
194
+ this.salary = parseFloat(value).toLocaleString('pt-BR', {
195
+ style: 'currency',
196
+ currency: 'BRL'
197
+ });
198
+ } else {
199
+ return parseFloat(value).toLocaleString('pt-BR', {
200
+ style: 'currency',
201
+ currency: 'BRL'
202
+ });
203
+ }
204
+ },
205
+ replaceAll(str, find, replace) {
206
+ return str.replace(
207
+ new RegExp(find.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&'), 'g'),
208
+ replace
209
+ );
210
+ }
211
+ },
212
+ watch: {
213
+ isActive(newValue) {
214
+ !newValue && this.$emit('close-modal');
215
+ }
216
+ }
217
+ };
218
+ </script>
219
+
220
+ <style lang="scss" scoped>
221
+ @import '@burh/nuxt-core/assets/sass/burh-ds/variables/_colors.scss';
222
+
223
+ /deep/ .el-dialog__body {
224
+ padding: 2rem 5rem 2rem;
225
+ }
226
+
227
+ /deep/ .el-dialog__header {
228
+ display: none;
229
+ }
230
+
231
+ /deep/ .el-dialog {
232
+ overflow: hidden;
233
+ border-radius: 0.625rem;
234
+ padding-bottom: 3.125rem;
235
+ max-width: 38.375rem;
236
+ min-width: 38.375rem;
237
+ margin-top: 5vh !important;
238
+ }
239
+
240
+ .modal-request {
241
+ section {
242
+ display: flex;
243
+ flex-direction: column;
244
+ margin-top: 1.5rem;
245
+
246
+ label {
247
+ text-transform: uppercase;
248
+ color: #8898aa;
249
+ font-weight: 600;
250
+ font-size: 0.8rem;
251
+ }
252
+
253
+ button {
254
+ width: 55%;
255
+ margin-left: auto;
256
+ }
257
+ }
258
+ }
259
+
260
+ .tool {
261
+ position: absolute;
262
+ top: 1rem;
263
+ z-index: 10;
264
+ color: $primary;
265
+ cursor: pointer;
266
+
267
+ &-close {
268
+ position: absolute;
269
+ width: 5.5rem;
270
+ height: 1.687rem;
271
+ right: 7px;
272
+ top: 7px;
273
+ display: flex;
274
+ justify-content: center;
275
+ align-items: center;
276
+
277
+ font-size: 0.687rem;
278
+
279
+ font-weight: 500;
280
+ background: rgba(0, 0, 0, 0.2);
281
+ border-radius: 1.09rem;
282
+ color: #fff;
283
+ }
284
+ }
285
+ </style>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@burh/nuxt-core",
3
- "version": "1.0.203",
3
+ "version": "1.0.205",
4
4
  "description": "Design System and Components.",
5
5
  "author": "Burh",
6
6
  "scripts": {