@burh/nuxt-core 1.1.23 → 1.1.26

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.
Files changed (4) hide show
  1. package/components/burh-ds/Curriculum/UserCurriculum/UserCvLeftSide.vue +623 -624
  2. package/components/burh-ds/Headings/AppHeader.vue +403 -403
  3. package/components/burh-ds/Img/ImageWithFallback.vue +73 -73
  4. package/package.json +1 -1
package/components/burh-ds/Curriculum/UserCurriculum/UserCvLeftSide.vue CHANGED
@@ -1,624 +1,623 @@
1
- <template>
2
- <div class="bg-white content-left">
3
- <div class="profile w-100 text-center">
4
- <div class="avatar">
5
- <image-with-fallback
6
- :src="userData.urlAvatar"
7
- :alt="userData.name"
8
- :fallbackText="userData.name"
9
- fallbackSize="1024"
10
- />
11
- </div>
12
-
13
- <slot name="compatibilityTag" />
14
-
15
- <h5
16
- class="mb-0 text-wrap"
17
- v-html="
18
- highlightText(
19
- search,
20
- `${userData.name} ${userData.last_name}`
21
- )
22
- "
23
- />
24
- <h6
25
- v-if="userData && userData.user_complementary_information && userData.user_complementary_information.birth && getAge() > 0 || false"
26
- >
27
- {{ getAge() }} {{ $t('user_cv.left_side.years_old') }}
28
- </h6>
29
-
30
- <p
31
- class="user-info"
32
- v-if="userData && userData.user_experience && userData.user_experience.length || 0"
33
- v-html="
34
- highlightText(
35
- search,
36
- `${userData.user_experience[0].job_title} em ${userData.user_experience[0].company}`
37
- )
38
- "
39
- ></p>
40
-
41
- <span v-if="userData.user_address">
42
- <i class="fas fa-map-marker-alt"></i>
43
- {{ userData.user_address.city_name }} -
44
- {{ userData.user_address.region_code }} <br>
45
- {{ userData.user_address.neighborhood }}
46
- </span><br />
47
-
48
- <span
49
- v-if="
50
- userData && userData.user_complementary_information && userData.user_complementary_information.wage_pretension && userData.user_complementary_information.wage_pretension > 1
51
- "
52
- >{{ $t('user_cv.left_side.salary_expectation') }}
53
- {{
54
- userData.user_complementary_information.wage_pretension
55
- | convertMoney
56
- }}</span
57
- >
58
- </div>
59
-
60
- <template
61
- v-if="hasAboutme && userData && userData.profile"
62
- >
63
- <div class="aboutme title-block mt-3 ml-4">
64
- <h6 class="mb-0">
65
- {{ $t('user_cv.left_side.disc_profile_title') }}
66
-
67
- <el-tooltip
68
- class="ml-1"
69
- placement="top"
70
- >
71
- <div slot="content" style="max-width: 250px">
72
- {{ $t('user_cv.left_side.disc_tooltip') }}
73
- </div>
74
-
75
- <i class="fas fa-info-circle"></i>
76
- </el-tooltip>
77
- </h6>
78
- <div class="line"></div>
79
-
80
- <div class="aboutme__resume">
81
- <profile
82
- :profile="userData.profile"
83
- :size="48"
84
- />
85
-
86
- <button
87
- @click="handleAboutmeDownloadClick"
88
- >
89
- <template
90
- v-if="!isAboutmeUnlocked"
91
- >
92
- {{ $t('user_cv.left_side.unlock_report') }}
93
- <i class="fas fa-unlock"></i>
94
- </template>
95
-
96
- <template v-else>
97
- {{ $t('user_cv.left_side.download_report') }}
98
- <i class="fas fa-file-download"></i>
99
- </template>
100
- </button>
101
- </div>
102
- </div>
103
- </template>
104
-
105
- <div
106
- class="deficiency title-block mt-3 ml-4"
107
- v-if="!!(userData.deficiency && userData.deficiency.id)"
108
- >
109
- <div class="d-flex align-items-center">
110
- <i class="fas fa-wheelchair"></i>
111
- <h6 class="mb-0 ml-2">{{ $t('user_cv.left_side.disability_title') }}</h6>
112
- </div>
113
- <div class="line"></div>
114
- <p>
115
- {{ userData && userData.deficiency && userData.deficiency && userData.deficiency.deficiency_id | allDeficiencies }}
116
-
117
- <template> - </template>
118
-
119
- {{ userData && userData.deficiency && userData.deficiency && userData.deficiency.cid | formatCid }}
120
- </p>
121
-
122
- <p v-if="!!(userData && userData.deficiency && userData.deficiency.appliance)">
123
- {{ $t('user_cv.left_side.accessory_label') }} {{ userData.deficiency.appliance }}
124
- </p>
125
-
126
- <p v-if="!!(userData && userData.deficiency && userData.deficiency.apparatus)">
127
- {{ $t('user_cv.left_side.necessity_label') }} {{ userData.deficiency.apparatus }}
128
- </p>
129
-
130
- <p v-if="!!(userData && userData.deficiency && userData.deficiency.course)">
131
- {{ $t('user_cv.left_side.course_label') }} {{ userData.deficiency.course }}
132
- </p>
133
-
134
- <p v-if="!!(userData && userData.deficiency && userData.deficiency.note)">
135
- {{ $t('user_cv.left_side.notes_label') }} {{ userData.deficiency.note }}
136
- </p>
137
-
138
- <p v-if="!!(userData && userData.deficiency && userData.deficiency.transport === 1)">
139
- {{ $t('user_cv.left_side.uses_public_transport') }}
140
- </p>
141
-
142
- <p v-if="!!(userData && userData.deficiency && userData.deficiency.vehicle === 1)">
143
- {{ $t('user_cv.left_side.has_adapted_vehicle') }}
144
- </p>
145
-
146
- <p v-if="!!(userData && userData.deficiency && userData.deficiency.escort === 1)">
147
- {{ $t('user_cv.left_side.needs_companion') }}
148
- </p>
149
- </div>
150
-
151
- <div
152
- v-show="userData && userData.user_desired_job && userData.user_desired_job.length || 0"
153
- class="desidered title-block mt-3 ml-4"
154
- >
155
- <h6 class="mb-0">{{ $t('user_cv.left_side.desired_positions') }}</h6>
156
- <div class="line"></div>
157
-
158
- <p
159
- v-for="(des, index) in userData.user_desired_job"
160
- :key="`skill-${index}`"
161
- class="ml-1 mt-1 mb-0 text-capitalize"
162
- v-html="highlightText(search, des.occupation)"
163
- ></p>
164
- </div>
165
-
166
- <div
167
- v-show="userData && userData.user_language && userData.user_language.length || 0"
168
- class="languages title-block mt-3 ml-4"
169
- >
170
- <h6 class="mb-0">{{ $t('user_cv.left_side.languages') }}</h6>
171
- <div class="line"></div>
172
-
173
- <p
174
- class="mb-1 text-capitalize"
175
- v-for="(lan, index) in userData.user_language"
176
- :key="index"
177
- v-html="
178
- highlightText(
179
- search,
180
- `${lan.language[0].name} ${languageLevel(lan.level)}`
181
- )
182
- "
183
- ></p>
184
- </div>
185
-
186
- <div
187
- v-show="userData&&userData.user_skill &&userData.user_skill.length > 0"
188
- class="skills title-block ml-4"
189
- >
190
- <h6 class="mb-0">{{ $t('user_cv.left_side.skills') }}</h6>
191
- <div class="line"></div>
192
-
193
- <p
194
- v-for="(skill, index) in userData.user_skill"
195
- :key="`skill-${index}`"
196
- class="ml-1 mt-1 mb-0 text-capitalize"
197
- v-html="highlightText(search, skill.skill_word)"
198
- ></p>
199
- </div>
200
-
201
- <div class="socials text-center mt-5">
202
- <a
203
- :href="baseUrl + '/' + userData.slug.slug"
204
- class="text-center"
205
- target="_blank"
206
- rel="noopener noreferrer"
207
- >
208
- <img
209
- class="no-social"
210
- src="../../../../assets/images/burhCv.svg"
211
- alt="Burh"
212
- />
213
- </a>
214
- <a
215
- v-if="userData && userData.user_complementary_information && userData.user_complementary_information.facebook_url || false"
216
- :href="userData.user_complementary_information.facebook_url"
217
- target="_blank"
218
- class="ml-2"
219
- rel="noopener noreferrer"
220
- >
221
- <img
222
- class="no-social"
223
- src="../../../../assets/images/facebookCv.svg"
224
- alt="Facebook"
225
- />
226
- </a>
227
- <a
228
- v-if="userData && userData.user_complementary_information && userData.user_complementary_information.linkedin_url || false"
229
- :href="userData.user_complementary_information.linkedin_url"
230
- target="_blank"
231
- class="ml-2"
232
- rel="noopener noreferrer"
233
- >
234
- <img
235
- class="no-social"
236
- src="../../../../assets/images/linkedinCv.svg"
237
- alt="Linkdin"
238
- />
239
- </a>
240
- <a
241
- v-if="userData && userData.user_complementary_information && userData.user_complementary_information.website || false"
242
- :href="userData.user_complementary_information.website"
243
- class="text-center ml-2"
244
- target="_blank"
245
- rel="noopener noreferrer"
246
- >
247
- <img
248
- class="no-social"
249
- src="../../../../assets/images/webCv.svg"
250
- alt="Web"
251
- />
252
- </a>
253
- </div>
254
-
255
- <div class="burh-code text-center mt-4">
256
- <vue-qrcode
257
- :value="baseUrl + '/' + userData.slug.slug"
258
- :options="{ width: 98, height: 98 }"
259
- class="border qr-code"
260
- ></vue-qrcode>
261
- <p class="mb-0">{{ $t('user_cv.left_side.burh_code') }}</p>
262
- <span class="qr-id">{{ userData.id }}</span
263
- ><br />
264
- <div class="teste-block">
265
- <span class="font-weight-normal mt-2 d-block" v-if="!isLocked"
266
- >{{ $t('user_cv.left_side.update_date') }}
267
- {{ $moment(userData.updated_at).format('DD/MM/YYYY H:mm') }}
268
- </span>
269
- </div>
270
- </div>
271
- </div>
272
- </template>
273
-
274
- <script>
275
- import getPrefixes from '~/util/getPrefixes.js';
276
- import VueQrcode from '@chenfengyuan/vue-qrcode';
277
- import moment from 'moment';
278
-
279
- import Profile from '../../Aboutme/Profile.vue';
280
-
281
- export default {
282
- name: 'user-cv-left-side',
283
- components: {
284
- VueQrcode,
285
- Profile
286
- },
287
- computed: {
288
- isAboutmeUnlocked() {
289
- const userData = this.userData || {};
290
- const isUnlocked = userData['is_aboutme_unlocked'] || false;
291
- return isUnlocked;
292
- },
293
- currentCompany() {
294
- return this.$store.state.company.currentCompany;
295
- }
296
- },
297
- props: {
298
- userData: {
299
- type: Object,
300
- required: true
301
- },
302
- baseUrl: String,
303
- search: {
304
- type: String,
305
- default: ''
306
- },
307
- hasAboutme: {
308
- type: Boolean,
309
- default: false
310
- }
311
- },
312
- data() {
313
- return {
314
- isLocked: !this.companyHasProduct(
315
- this.$store.state.loja && this.$store.state.loja.showableProducts && this.$store.state.loja.showableProducts['BUSCA_AVANCADA'] || false
316
- )
317
- };
318
- },
319
- methods: {
320
- handleAboutmeDownloadClick() {
321
- this.$emit('aboutme-download');
322
- },
323
- getAge(){
324
- const userAge = this.userData.user_complementary_information.birth;
325
- return moment().diff(userAge, 'years');
326
- },
327
- highlightText(search, text) {
328
- if (search.length < 2) return text;
329
-
330
- const regex = new RegExp(search.toLowerCase(), 'gmi');
331
- return String(text || '').replace(
332
- regex,
333
- `<span class="search-highlight">${search}</span>`
334
- );
335
- },
336
- getTime(
337
- { start_year = null, end_year = null, start_month, end_month },
338
- textHappening = null
339
- ) {
340
- const isHappening = !end_month && !end_year;
341
- const happeningText = textHappening || this.$t('user_cv.left_side.studying');
342
-
343
- if (isHappening) {
344
- return happeningText;
345
- }
346
-
347
- const dateInitial = this.$moment(
348
- ['1', start_month.toString(), start_year.toString()],
349
- 'DD/MM/YYYY'
350
- );
351
- const dateDone = this.$moment(
352
- ['1', end_month.toString(), end_year.toString()],
353
- 'DD/MM/YYYY'
354
- );
355
- const diffDuration = this.$moment.duration(
356
- dateDone.diff(dateInitial)
357
- );
358
- const years = diffDuration.years();
359
- const months = diffDuration.months();
360
-
361
- if (years) {
362
- return years > 1 ? `(${years} ${this.$t('user_cv.left_side.years_plural')})` : `(${years} ${this.$t('user_cv.left_side.year_singular')})`;
363
- }
364
-
365
- return months > 1
366
- ? `(${months} ${this.$t('user_cv.left_side.months_plural')})`
367
- : months == 1
368
- ? `(${months} ${this.$t('user_cv.left_side.month_singular')})`
369
- : '';
370
- },
371
- languageLevel(level) {
372
- switch (parseInt(level)) {
373
- case 1:
374
- return this.$t('user_cv.left_side.language_level_beginner');
375
- case 2:
376
- return this.$t('user_cv.left_side.language_level_elementary');
377
- case 3:
378
- return this.$t('user_cv.left_side.language_level_pre_intermediate');
379
- case 4:
380
- return this.$t('user_cv.left_side.language_level_intermediate');
381
- case 5:
382
- return this.$t('user_cv.left_side.language_level_upper_intermediate');
383
- case 6:
384
- return this.$t('user_cv.left_side.language_level_advanced');
385
- case 7:
386
- return this.$t('user_cv.left_side.language_level_fluent');
387
- default:
388
- return '';
389
- }
390
- },
391
- treatPhone(phone) {
392
- if (phone) {
393
- if (phone == '0' || phone.length < 9 || !phone) {
394
- return this.$t('user_cv.left_side.phone_not_registered');
395
- }
396
- }
397
-
398
- return phone;
399
- },
400
- treatCellphone(cellphone) {
401
- if (cellphone) {
402
- if (cellphone == '0' || cellphone.length < 11 || !cellphone) {
403
- return this.$t('user_cv.left_side.cellphone_not_registered');
404
- }
405
- }
406
-
407
- return cellphone;
408
- },
409
- handleGetPrefixes(name = '') {
410
- return getPrefixes(name);
411
- },
412
- treatEndDate(end_month, end_year) {
413
- if (end_month && end_year) {
414
- return `${end_month}/${end_year}`;
415
- }
416
- return '';
417
- }
418
- },
419
- filters: {
420
- allDeficiencies(idList) {
421
- const typeDeficiency = {
422
- 1: this.$t('user_cv.left_side.disability_physical'),
423
- 2: this.$t('user_cv.left_side.disability_visual'),
424
- 3: this.$t('user_cv.left_side.disability_mental'),
425
- 4: this.$t('user_cv.left_side.disability_auditory'),
426
- 5: this.$t('user_cv.left_side.disability_phonological'),
427
- 6: this.$t('user_cv.left_side.disability_multiple')
428
- };
429
-
430
- return idList && idList.length && idList.map(id => typeDeficiency[id] || null).filter(id => id).join(' | ') || '';
431
- },
432
- formatCid(cidList) {
433
- return cidList && cidList.length && cidList.filter(cid => cid).join(' | ') || '';
434
- },
435
- convertMoney(money) {
436
- let moneyAux = parseFloat(money);
437
- let m = moneyAux.toLocaleString('pt-BR', {
438
- style: 'currency',
439
- currency: 'BRL'
440
- });
441
- return m;
442
- }
443
- }
444
- };
445
- </script>
446
- <style lang="scss" scoped>
447
- @import '@burh/nuxt-core/assets/sass/burh-ds/variables/_colors.scss';
448
-
449
- /deep/ .search-highlight {
450
- background: rgb(255, 252, 61);
451
- color: #000;
452
- }
453
-
454
- .aboutme {
455
- display: flex;
456
- flex-direction: column;
457
- margin: 1rem 0;
458
-
459
- &__resume {
460
- display: flex;
461
- flex-direction: row;
462
- align-items: center;
463
- gap: 1rem;
464
-
465
- > button {
466
- padding: 0.25rem 0.5rem;
467
- border: 0;
468
- margin: 0;
469
- color: #5865f2;
470
- background: transparent;
471
- font-weight: 500;
472
- font-size: 0.875rem;
473
-
474
- transition: color 0.25s;
475
-
476
- &:hover {
477
- color: darken(#5865f2, 10);
478
- }
479
-
480
- i {
481
- margin-left: 0.5rem;
482
- }
483
- }
484
- }
485
- }
486
-
487
- .teste-block {
488
- display: inline !important;
489
- }
490
- .qr-id {
491
- color: #32325d !important;
492
- }
493
-
494
- .bg-light--darken {
495
- background-color: $gray-100 !important;
496
- }
497
-
498
- .profile {
499
- display: flex;
500
- flex-direction: column;
501
- align-items: center;
502
-
503
- .avatar {
504
- width: initial!important;
505
- height: initial!important;
506
- margin-top: -48px;
507
- background: transparent !important;
508
- img {
509
- width: 163px;
510
- height: 163px;
511
- border-radius: 50%;
512
- top: 75%;
513
- background: #adb5bd;
514
- border: 4px solid #fff;
515
- }
516
-
517
- .no-image {
518
- display: flex;
519
- justify-content: center;
520
- align-items: center;
521
-
522
- position: absolute;
523
- background-color: #adb5bd;
524
- width: 163px;
525
- height: 163px;
526
- top: 120;
527
- border-radius: 50%;
528
- margin-bottom: 20px;
529
- border: 4px solid #fff;
530
- }
531
- }
532
-
533
- .user-info {
534
- padding: 0 20px;
535
- margin-top: 5px;
536
- }
537
-
538
- p {
539
- font-size: 13px;
540
- font-weight: 400;
541
- color: #62778c;
542
- line-height: 0.85rem;
543
- margin-bottom: 2rem;
544
- }
545
-
546
- span {
547
- font-size: 14px;
548
- color: #8da2b5;
549
- }
550
- }
551
-
552
- .skills {
553
- margin-top: 2.3rem;
554
- margin-bottom: 2.3rem;
555
- }
556
-
557
- .desidered {
558
- margin-bottom: 2.3rem;
559
- }
560
-
561
- .deficiency {
562
- p {
563
- margin-top: 0.25rem;
564
- margin-bottom: 0;
565
- text-transform: capitalize;
566
- }
567
- }
568
-
569
- .languages {
570
- margin-bottom: 2.3rem;
571
- }
572
-
573
- .title-block {
574
- .line {
575
- width: 235px;
576
- height: 0px;
577
- border: 1px solid #ececec5c;
578
- margin-bottom: 0.75rem;
579
- }
580
-
581
- p {
582
- font-size: 13px;
583
- }
584
- }
585
-
586
- .burh-code {
587
- .qr-code {
588
- box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
589
- border-radius: 10px;
590
- }
591
-
592
- p {
593
- font-size: 8px;
594
- font-weight: bold;
595
- }
596
-
597
- span {
598
- font-size: 12px;
599
- font-weight: bold;
600
- }
601
- }
602
-
603
- .socials {
604
- .no-social {
605
- height: 1.39rem;
606
- }
607
- }
608
-
609
- .cv-left {
610
- word-break: initial;
611
- }
612
-
613
- .disable-none {
614
- user-select: none;
615
- }
616
-
617
- .content-left {
618
- width: 25%;
619
- height: auto;
620
- padding: 0 20px;
621
- word-break: break-word !important;
622
- color: #62778c !important;
623
- }
624
- </style>
1
+ <template>
2
+ <div class="bg-white content-left">
3
+ <div class="profile w-100 text-center">
4
+ <div class="avatar">
5
+ <image-with-fallback
6
+ :src="userData.urlAvatar"
7
+ :alt="userData.name"
8
+ :fallbackText="userData.name"
9
+ fallbackSize="1024"
10
+ />
11
+ </div>
12
+
13
+ <slot name="compatibilityTag" />
14
+
15
+ <h5
16
+ class="mb-0 text-wrap"
17
+ v-html="
18
+ highlightText(
19
+ search,
20
+ `${userData.name} ${userData.last_name}`
21
+ )
22
+ "
23
+ />
24
+ <h6
25
+ v-if="userHasBirthDate"
26
+ >
27
+ {{ getAge() }} {{ $t('user_cv.left_side.years_old') }}
28
+ </h6>
29
+
30
+ <p
31
+ class="user-info"
32
+ v-if="userData && userData.user_experience && userData.user_experience.length || 0"
33
+ v-html="
34
+ highlightText(
35
+ search,
36
+ `${userData.user_experience[0].job_title} em ${userData.user_experience[0].company}`
37
+ )
38
+ "
39
+ ></p>
40
+
41
+ <span v-if="userData.user_address">
42
+ <i class="fas fa-map-marker-alt"></i>
43
+ {{ userData.user_address.city_name }} -
44
+ {{ userData.user_address.region_code }} <br>
45
+ {{ userData.user_address.neighborhood }}
46
+ </span><br />
47
+
48
+ <span
49
+ v-if="
50
+ userData && userData.user_complementary_information && userData.user_complementary_information.wage_pretension && userData.user_complementary_information.wage_pretension > 1
51
+ "
52
+ >{{ $t('user_cv.left_side.salary_expectation') }}
53
+ {{
54
+ convertMoney(userData.user_complementary_information.wage_pretension)
55
+ }}</span
56
+ >
57
+ </div>
58
+
59
+ <template
60
+ v-if="hasAboutme && userData && userData.profile"
61
+ >
62
+ <div class="aboutme title-block mt-3 ml-4">
63
+ <h6 class="mb-0">
64
+ {{ $t('user_cv.left_side.disc_profile_title') }}
65
+
66
+ <el-tooltip
67
+ class="ml-1"
68
+ placement="top"
69
+ >
70
+ <div slot="content" style="max-width: 250px">
71
+ {{ $t('user_cv.left_side.disc_tooltip') }}
72
+ </div>
73
+
74
+ <i class="fas fa-info-circle"></i>
75
+ </el-tooltip>
76
+ </h6>
77
+ <div class="line"></div>
78
+
79
+ <div class="aboutme__resume">
80
+ <profile
81
+ :profile="userData.profile"
82
+ :size="48"
83
+ />
84
+
85
+ <button
86
+ @click="handleAboutmeDownloadClick"
87
+ >
88
+ <template
89
+ v-if="!isAboutmeUnlocked"
90
+ >
91
+ {{ $t('user_cv.left_side.unlock_report') }}
92
+ <i class="fas fa-unlock"></i>
93
+ </template>
94
+
95
+ <template v-else>
96
+ {{ $t('user_cv.left_side.download_report') }}
97
+ <i class="fas fa-file-download"></i>
98
+ </template>
99
+ </button>
100
+ </div>
101
+ </div>
102
+ </template>
103
+
104
+ <div
105
+ class="deficiency title-block mt-3 ml-4"
106
+ v-if="!!(userData.deficiency && userData.deficiency.id)"
107
+ >
108
+ <div class="d-flex align-items-center">
109
+ <i class="fas fa-wheelchair"></i>
110
+ <h6 class="mb-0 ml-2">{{ $t('user_cv.left_side.disability_title') }}</h6>
111
+ </div>
112
+ <div class="line"></div>
113
+ <p>
114
+ {{ allDeficiencies(userData && userData.deficiency && userData.deficiency && userData.deficiency.deficiency_id) }}
115
+
116
+ <template> - </template>
117
+
118
+ {{ formatCid(userData && userData.deficiency && userData.deficiency && userData.deficiency.cid) }}
119
+ </p>
120
+
121
+ <p v-if="!!(userData && userData.deficiency && userData.deficiency.appliance)">
122
+ {{ $t('user_cv.left_side.accessory_label') }} {{ userData.deficiency.appliance }}
123
+ </p>
124
+
125
+ <p v-if="!!(userData && userData.deficiency && userData.deficiency.apparatus)">
126
+ {{ $t('user_cv.left_side.necessity_label') }} {{ userData.deficiency.apparatus }}
127
+ </p>
128
+
129
+ <p v-if="!!(userData && userData.deficiency && userData.deficiency.course)">
130
+ {{ $t('user_cv.left_side.course_label') }} {{ userData.deficiency.course }}
131
+ </p>
132
+
133
+ <p v-if="!!(userData && userData.deficiency && userData.deficiency.note)">
134
+ {{ $t('user_cv.left_side.notes_label') }} {{ userData.deficiency.note }}
135
+ </p>
136
+
137
+ <p v-if="!!(userData && userData.deficiency && userData.deficiency.transport === 1)">
138
+ {{ $t('user_cv.left_side.uses_public_transport') }}
139
+ </p>
140
+
141
+ <p v-if="!!(userData && userData.deficiency && userData.deficiency.vehicle === 1)">
142
+ {{ $t('user_cv.left_side.has_adapted_vehicle') }}
143
+ </p>
144
+
145
+ <p v-if="!!(userData && userData.deficiency && userData.deficiency.escort === 1)">
146
+ {{ $t('user_cv.left_side.needs_companion') }}
147
+ </p>
148
+ </div>
149
+
150
+ <div
151
+ v-show="userData && userData.user_desired_job && userData.user_desired_job.length || 0"
152
+ class="desidered title-block mt-3 ml-4"
153
+ >
154
+ <h6 class="mb-0">{{ $t('user_cv.left_side.desired_positions') }}</h6>
155
+ <div class="line"></div>
156
+
157
+ <p
158
+ v-for="(des, index) in userData.user_desired_job"
159
+ :key="`skill-${index}`"
160
+ class="ml-1 mt-1 mb-0 text-capitalize"
161
+ v-html="highlightText(search, des.occupation)"
162
+ ></p>
163
+ </div>
164
+
165
+ <div
166
+ v-show="userData && userData.user_language && userData.user_language.length || 0"
167
+ class="languages title-block mt-3 ml-4"
168
+ >
169
+ <h6 class="mb-0">{{ $t('user_cv.left_side.languages') }}</h6>
170
+ <div class="line"></div>
171
+
172
+ <p
173
+ class="mb-1 text-capitalize"
174
+ v-for="(lan, index) in userData.user_language"
175
+ :key="index"
176
+ v-html="
177
+ highlightText(
178
+ search,
179
+ `${lan.language[0].name} ${languageLevel(lan.level)}`
180
+ )
181
+ "
182
+ ></p>
183
+ </div>
184
+
185
+ <div
186
+ v-show="userData&&userData.user_skill &&userData.user_skill.length > 0"
187
+ class="skills title-block ml-4"
188
+ >
189
+ <h6 class="mb-0">{{ $t('user_cv.left_side.skills') }}</h6>
190
+ <div class="line"></div>
191
+
192
+ <p
193
+ v-for="(skill, index) in userData.user_skill"
194
+ :key="`skill-${index}`"
195
+ class="ml-1 mt-1 mb-0 text-capitalize"
196
+ v-html="highlightText(search, skill.skill_word)"
197
+ ></p>
198
+ </div>
199
+
200
+ <div class="socials text-center mt-5">
201
+ <a
202
+ :href="baseUrl + '/' + userData.slug.slug"
203
+ class="text-center"
204
+ target="_blank"
205
+ rel="noopener noreferrer"
206
+ >
207
+ <img
208
+ class="no-social"
209
+ src="../../../../assets/images/burhCv.svg"
210
+ alt="Burh"
211
+ />
212
+ </a>
213
+ <a
214
+ v-if="userData && userData.user_complementary_information && userData.user_complementary_information.facebook_url || false"
215
+ :href="userData.user_complementary_information.facebook_url"
216
+ target="_blank"
217
+ class="ml-2"
218
+ rel="noopener noreferrer"
219
+ >
220
+ <img
221
+ class="no-social"
222
+ src="../../../../assets/images/facebookCv.svg"
223
+ alt="Facebook"
224
+ />
225
+ </a>
226
+ <a
227
+ v-if="userData && userData.user_complementary_information && userData.user_complementary_information.linkedin_url || false"
228
+ :href="userData.user_complementary_information.linkedin_url"
229
+ target="_blank"
230
+ class="ml-2"
231
+ rel="noopener noreferrer"
232
+ >
233
+ <img
234
+ class="no-social"
235
+ src="../../../../assets/images/linkedinCv.svg"
236
+ alt="Linkdin"
237
+ />
238
+ </a>
239
+ <a
240
+ v-if="userData && userData.user_complementary_information && userData.user_complementary_information.website || false"
241
+ :href="userData.user_complementary_information.website"
242
+ class="text-center ml-2"
243
+ target="_blank"
244
+ rel="noopener noreferrer"
245
+ >
246
+ <img
247
+ class="no-social"
248
+ src="../../../../assets/images/webCv.svg"
249
+ alt="Web"
250
+ />
251
+ </a>
252
+ </div>
253
+
254
+ <div class="burh-code text-center mt-4">
255
+ <vue-qrcode
256
+ :value="baseUrl + '/' + userData.slug.slug"
257
+ :options="{ width: 98, height: 98 }"
258
+ class="border qr-code"
259
+ ></vue-qrcode>
260
+ <p class="mb-0">{{ $t('user_cv.left_side.burh_code') }}</p>
261
+ <span class="qr-id">{{ userData.id }}</span
262
+ ><br />
263
+ <div class="teste-block">
264
+ <span class="font-weight-normal mt-2 d-block" v-if="!isLocked"
265
+ >{{ $t('user_cv.left_side.update_date') }}
266
+ {{ $moment(userData.updated_at).format('DD/MM/YYYY H:mm') }}
267
+ </span>
268
+ </div>
269
+ </div>
270
+ </div>
271
+ </template>
272
+
273
+ <script>
274
+ import getPrefixes from '~/util/getPrefixes.js';
275
+ import VueQrcode from '@chenfengyuan/vue-qrcode';
276
+
277
+ import Profile from '../../Aboutme/Profile.vue';
278
+
279
+ export default {
280
+ name: 'user-cv-left-side',
281
+ components: {
282
+ VueQrcode,
283
+ Profile
284
+ },
285
+ computed: {
286
+ isAboutmeUnlocked() {
287
+ const userData = this.userData || {};
288
+ const isUnlocked = userData['is_aboutme_unlocked'] || false;
289
+ return isUnlocked;
290
+ },
291
+ currentCompany() {
292
+ return this.$store.state.company.currentCompany;
293
+ },
294
+ userHasBirthDate() {
295
+ return !!(this.userData && this.userData.user_complementary_information && this.userData.user_complementary_information.birth);
296
+ }
297
+ },
298
+ props: {
299
+ userData: {
300
+ type: Object,
301
+ required: true
302
+ },
303
+ baseUrl: String,
304
+ search: {
305
+ type: String,
306
+ default: ''
307
+ },
308
+ hasAboutme: {
309
+ type: Boolean,
310
+ default: false
311
+ }
312
+ },
313
+ data() {
314
+ return {
315
+ isLocked: !this.companyHasProduct(
316
+ this.$store.state.loja && this.$store.state.loja.showableProducts && this.$store.state.loja.showableProducts['BUSCA_AVANCADA'] || false
317
+ )
318
+ };
319
+ },
320
+ methods: {
321
+ handleAboutmeDownloadClick() {
322
+ this.$emit('aboutme-download');
323
+ },
324
+ getAge(){
325
+ const userAge = this.userData.user_complementary_information.birth;
326
+ return this.$moment().diff(userAge, 'years');
327
+ },
328
+ highlightText(search, text) {
329
+ if (search.length < 2) return text;
330
+
331
+ const regex = new RegExp(search.toLowerCase(), 'gmi');
332
+ return String(text || '').replace(
333
+ regex,
334
+ `<span class="search-highlight">${search}</span>`
335
+ );
336
+ },
337
+ getTime(
338
+ { start_year = null, end_year = null, start_month, end_month },
339
+ textHappening = null
340
+ ) {
341
+ const isHappening = !end_month && !end_year;
342
+ const happeningText = textHappening || this.$t('user_cv.left_side.studying');
343
+
344
+ if (isHappening) {
345
+ return happeningText;
346
+ }
347
+
348
+ const dateInitial = this.$moment(
349
+ ['1', start_month.toString(), start_year.toString()],
350
+ 'DD/MM/YYYY'
351
+ );
352
+ const dateDone = this.$moment(
353
+ ['1', end_month.toString(), end_year.toString()],
354
+ 'DD/MM/YYYY'
355
+ );
356
+ const diffDuration = this.$moment.duration(
357
+ dateDone.diff(dateInitial)
358
+ );
359
+ const years = diffDuration.years();
360
+ const months = diffDuration.months();
361
+
362
+ if (years) {
363
+ return years > 1 ? `(${years} ${this.$t('user_cv.left_side.years_plural')})` : `(${years} ${this.$t('user_cv.left_side.year_singular')})`;
364
+ }
365
+
366
+ return months > 1
367
+ ? `(${months} ${this.$t('user_cv.left_side.months_plural')})`
368
+ : months == 1
369
+ ? `(${months} ${this.$t('user_cv.left_side.month_singular')})`
370
+ : '';
371
+ },
372
+ languageLevel(level) {
373
+ switch (parseInt(level)) {
374
+ case 1:
375
+ return this.$t('user_cv.left_side.language_level_beginner');
376
+ case 2:
377
+ return this.$t('user_cv.left_side.language_level_elementary');
378
+ case 3:
379
+ return this.$t('user_cv.left_side.language_level_pre_intermediate');
380
+ case 4:
381
+ return this.$t('user_cv.left_side.language_level_intermediate');
382
+ case 5:
383
+ return this.$t('user_cv.left_side.language_level_upper_intermediate');
384
+ case 6:
385
+ return this.$t('user_cv.left_side.language_level_advanced');
386
+ case 7:
387
+ return this.$t('user_cv.left_side.language_level_fluent');
388
+ default:
389
+ return '';
390
+ }
391
+ },
392
+ treatPhone(phone) {
393
+ if (phone) {
394
+ if (phone == '0' || phone.length < 9 || !phone) {
395
+ return this.$t('user_cv.left_side.phone_not_registered');
396
+ }
397
+ }
398
+
399
+ return phone;
400
+ },
401
+ treatCellphone(cellphone) {
402
+ if (cellphone) {
403
+ if (cellphone == '0' || cellphone.length < 11 || !cellphone) {
404
+ return this.$t('user_cv.left_side.cellphone_not_registered');
405
+ }
406
+ }
407
+
408
+ return cellphone;
409
+ },
410
+ handleGetPrefixes(name = '') {
411
+ return getPrefixes(name);
412
+ },
413
+ treatEndDate(end_month, end_year) {
414
+ if (end_month && end_year) {
415
+ return `${end_month}/${end_year}`;
416
+ }
417
+ return '';
418
+ },
419
+ allDeficiencies(idList) {
420
+ const typeDeficiency = {
421
+ 1: this.$t('user_cv.left_side.disability_physical'),
422
+ 2: this.$t('user_cv.left_side.disability_visual'),
423
+ 3: this.$t('user_cv.left_side.disability_mental'),
424
+ 4: this.$t('user_cv.left_side.disability_auditory'),
425
+ 5: this.$t('user_cv.left_side.disability_phonological'),
426
+ 6: this.$t('user_cv.left_side.disability_multiple')
427
+ };
428
+
429
+ return idList && idList.length && idList.map(id => typeDeficiency[id] || null).filter(id => id).join(' | ') || '';
430
+ },
431
+ formatCid(cidList) {
432
+ return cidList && cidList.length && cidList.filter(cid => cid).join(' | ') || '';
433
+ },
434
+ convertMoney(money) {
435
+ let moneyAux = parseFloat(money);
436
+ let m = moneyAux.toLocaleString('pt-BR', {
437
+ style: 'currency',
438
+ currency: 'BRL'
439
+ });
440
+ return m;
441
+ }
442
+ },
443
+ };
444
+ </script>
445
+ <style lang="scss" scoped>
446
+ @import '@burh/nuxt-core/assets/sass/burh-ds/variables/_colors.scss';
447
+
448
+ /deep/ .search-highlight {
449
+ background: rgb(255, 252, 61);
450
+ color: #000;
451
+ }
452
+
453
+ .aboutme {
454
+ display: flex;
455
+ flex-direction: column;
456
+ margin: 1rem 0;
457
+
458
+ &__resume {
459
+ display: flex;
460
+ flex-direction: row;
461
+ align-items: center;
462
+ gap: 1rem;
463
+
464
+ > button {
465
+ padding: 0.25rem 0.5rem;
466
+ border: 0;
467
+ margin: 0;
468
+ color: #5865f2;
469
+ background: transparent;
470
+ font-weight: 500;
471
+ font-size: 0.875rem;
472
+
473
+ transition: color 0.25s;
474
+
475
+ &:hover {
476
+ color: darken(#5865f2, 10);
477
+ }
478
+
479
+ i {
480
+ margin-left: 0.5rem;
481
+ }
482
+ }
483
+ }
484
+ }
485
+
486
+ .teste-block {
487
+ display: inline !important;
488
+ }
489
+ .qr-id {
490
+ color: #32325d !important;
491
+ }
492
+
493
+ .bg-light--darken {
494
+ background-color: $gray-100 !important;
495
+ }
496
+
497
+ .profile {
498
+ display: flex;
499
+ flex-direction: column;
500
+ align-items: center;
501
+
502
+ .avatar {
503
+ width: initial!important;
504
+ height: initial!important;
505
+ margin-top: -48px;
506
+ background: transparent !important;
507
+ img {
508
+ width: 163px;
509
+ height: 163px;
510
+ border-radius: 50%;
511
+ top: 75%;
512
+ background: #adb5bd;
513
+ border: 4px solid #fff;
514
+ }
515
+
516
+ .no-image {
517
+ display: flex;
518
+ justify-content: center;
519
+ align-items: center;
520
+
521
+ position: absolute;
522
+ background-color: #adb5bd;
523
+ width: 163px;
524
+ height: 163px;
525
+ top: 120;
526
+ border-radius: 50%;
527
+ margin-bottom: 20px;
528
+ border: 4px solid #fff;
529
+ }
530
+ }
531
+
532
+ .user-info {
533
+ padding: 0 20px;
534
+ margin-top: 5px;
535
+ }
536
+
537
+ p {
538
+ font-size: 13px;
539
+ font-weight: 400;
540
+ color: #62778c;
541
+ line-height: 0.85rem;
542
+ margin-bottom: 2rem;
543
+ }
544
+
545
+ span {
546
+ font-size: 14px;
547
+ color: #8da2b5;
548
+ }
549
+ }
550
+
551
+ .skills {
552
+ margin-top: 2.3rem;
553
+ margin-bottom: 2.3rem;
554
+ }
555
+
556
+ .desidered {
557
+ margin-bottom: 2.3rem;
558
+ }
559
+
560
+ .deficiency {
561
+ p {
562
+ margin-top: 0.25rem;
563
+ margin-bottom: 0;
564
+ text-transform: capitalize;
565
+ }
566
+ }
567
+
568
+ .languages {
569
+ margin-bottom: 2.3rem;
570
+ }
571
+
572
+ .title-block {
573
+ .line {
574
+ width: 235px;
575
+ height: 0px;
576
+ border: 1px solid #ececec5c;
577
+ margin-bottom: 0.75rem;
578
+ }
579
+
580
+ p {
581
+ font-size: 13px;
582
+ }
583
+ }
584
+
585
+ .burh-code {
586
+ .qr-code {
587
+ box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
588
+ border-radius: 10px;
589
+ }
590
+
591
+ p {
592
+ font-size: 8px;
593
+ font-weight: bold;
594
+ }
595
+
596
+ span {
597
+ font-size: 12px;
598
+ font-weight: bold;
599
+ }
600
+ }
601
+
602
+ .socials {
603
+ .no-social {
604
+ height: 1.39rem;
605
+ }
606
+ }
607
+
608
+ .cv-left {
609
+ word-break: initial;
610
+ }
611
+
612
+ .disable-none {
613
+ user-select: none;
614
+ }
615
+
616
+ .content-left {
617
+ width: 25%;
618
+ height: auto;
619
+ padding: 0 20px;
620
+ word-break: break-word !important;
621
+ color: #62778c !important;
622
+ }
623
+ </style>