@burh/nuxt-core 1.0.366 → 1.0.367

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.
@@ -1,817 +1,817 @@
1
- <template>
2
- <div class="bg-white content-right tabs ">
3
- <el-tabs
4
- :class="active"
5
- class="mt-3 handle-icon-color"
6
- v-model="active"
7
- >
8
- <el-tab-pane class="history ml-2" name="history">
9
- <span class="tab__icon-pane" slot="label">
10
- <img
11
- class="img__icon-pane img__icon--history"
12
- src="../../../../assets/images/icons/historicCv.svg"
13
- />
14
- </span>
15
- <upgrade-plan @send-contact="sendContact" v-show="isLocked" />
16
- <p class="notes-title mb-0">Histórico com sua empresa</p>
17
- <div class="line mb-3"></div>
18
-
19
- <div
20
- class="mt-3"
21
- v-for="(item, index) in orderByDate(companyHistory())"
22
- :key="index"
23
- >
24
- <p class="history-text mb-0">
25
- {{ item.text }}
26
- </p>
27
- <span>{{ item.date | convertDate }}</span>
28
- </div>
29
- <p v-show="companyHistory().length === 0" class="history-text">
30
- Histórico vazio.
31
- </p>
32
- </el-tab-pane>
33
-
34
- <el-tab-pane name="notes" class="ml-2" v-if="isNotesActived">
35
- <span class="tab__icon-pane" slot="label">
36
- <img
37
- class="img__icon-pane img__icon--notes"
38
- src="../../../../assets/images/icons/notesCv.svg"
39
- />
40
- </span>
41
- <upgrade-plan @send-contact="sendContact" v-show="isLocked" />
42
- <p class="notes-title mb-0">Notas da equipe</p>
43
- <div class="line mb-3"></div>
44
- <div
45
- v-show="notes.length > 0"
46
- v-for="(note, index) in notes.slice(0, 5)"
47
- :key="index"
48
- >
49
- <div class="notes-baloon">
50
- <div class="notes-text ml-3 pt-1">
51
- <p class="mt-3">{{ note.text }}</p>
52
- </div>
53
- <div
54
- class="d-flex justify-content-end align-items-center mr-3"
55
- >
56
- <p class="notes-date">
57
- {{ note.created_at | convertDate }}
58
- </p>
59
- </div>
60
- </div>
61
- <div class="notes-owner d-flex mt-2">
62
- <img
63
- v-show="note.user.urlAvatar"
64
- :src="note.user.urlAvatar"
65
- :alt="note.user.name"
66
- />
67
- <div
68
- v-show="!note.user.urlAvatar"
69
- class="notes-avatar"
70
- ></div>
71
- <p class="ml-1">
72
- {{ note.user.name }}
73
- </p>
74
- </div>
75
- </div>
76
- <div class="notes-text" v-show="notes.length === 0">
77
- <p>Nenhuma nota criada.</p>
78
- </div>
79
-
80
- <div class="input-container" v-show="!isLocked">
81
- <input
82
- class="notes-new pl-4 mt-3 mb-3 form-rounded"
83
- type="text"
84
- placeholder="Escrever anotação"
85
- v-model="newNote"
86
- @change="$emit('new-note', newNote, userData.id)"
87
- v-on:change="cleatInput()"
88
- />
89
- <i
90
- @click="
91
- newNote.length > 0 &&
92
- $emit('new-note', newNote, userData.id)
93
- "
94
- class="fas fa-paper-plane input-icon"
95
- ></i>
96
- </div>
97
- </el-tab-pane>
98
-
99
- <el-tab-pane name="documents" class="ml-2">
100
- <span class="tab__icon-pane" slot="label">
101
- <img
102
- class="img__icon-pane img__icon--documents"
103
- src="../../../../assets/images/icons/icon3.svg"
104
- />
105
- </span>
106
- <upgrade-plan @send-contact="sendContact" v-show="isLocked" />
107
- <p class="notes-title mb-0">Documentos anexados</p>
108
- <div class="line mb-3"></div>
109
-
110
- <div class="archive-content">
111
- <div v-for="(item, index) in archives" :key="index">
112
- <div @click="openArchive(item)" class="archive-container">
113
- <div>
114
- <img class="archive-img" src="../../../../assets/images/icons/icon3.svg" >
115
- </div>
116
- <div class="archive-name">
117
- <span>{{item.name}}</span>
118
- <div class="archive-icon">
119
- <i @click.stop.prevent="openRemoveSection(item, (index+1))" class="far fa-trash-alt"></i>
120
- </div>
121
- </div>
122
- </div>
123
- <div v-if="hasRemove && hasRemove == (index+1)" class="archive-remove">
124
- <p>Você tem certeza que deseja apagar este arquivo?</p>
125
- <div class="d-flex">
126
- <base-button
127
- @click="removeArchive(currentRemoveItem, index)"
128
- size="sm"
129
- class="btn-outline-primary col-6 p-1"
130
- >
131
- Apagar
132
- </base-button>
133
- <base-button
134
- @click="hasRemove = false"
135
- size="sm"
136
- class="btn-outline-danger col-6 p-1"
137
- >
138
- Cancelar
139
- </base-button>
140
- </div>
141
- </div>
142
- </div>
143
-
144
- </div>
145
- <div class="notes-text" v-show="archives == null">
146
- <p>Nenhum arquvio anexado.</p>
147
- </div>
148
-
149
- <div class="input-container" v-show="!isLocked">
150
- <div class="mt-5">
151
-
152
- <dropzone-file-upload
153
- disabled
154
- @error="showMessageError"
155
- ref="Mydropzone"
156
- :options="dropzoneOptions"
157
- v-model="fileToUpload"
158
- />
159
- </div>
160
-
161
- <div class="archive-buttons">
162
- <base-button @click="saveImage" size="sm" class="btn-outline-primary btn-rounded col-12">Salvar</base-button>
163
- </div>
164
- </div>
165
- </el-tab-pane>
166
-
167
- <el-tab-pane name="reports" class="ml-2" v-if="isReportsActived">
168
- <span class="tab__icon-pane" slot="label">
169
- <img
170
- class="img__icon-pane img__icon--reports"
171
- src="../../../../assets/images/icons/icon5.svg"
172
- />
173
- </span>
174
-
175
- <upgrade-plan @send-contact="sendContact" v-show="isLocked" />
176
-
177
- <p class="notes-title mb-0">Laudo do Candidato</p>
178
- <div class="line mb-3"></div>
179
-
180
- <div class="input-container" v-if="!isLocked && !userReportData.annex">
181
- <dropzone-file-upload
182
- disabled
183
- ref="Mydropzone"
184
- v-model="reportFileUpload"
185
- :options="reportsDropdownzoneOptions"
186
- @error="showMessageError"
187
- />
188
-
189
- <div class="archive-buttons" v-if="reportFileUpload.length > 0">
190
- <base-button @click="saveReport" size="sm" class="btn-outline-primary btn-rounded col-12">Salvar</base-button>
191
- </div>
192
- </div>
193
-
194
- <div class="archive-content" v-else-if="userReportData.annex">
195
- <div @click="openArchive(userReportData.annex)" class="archive-container">
196
- <div>
197
- <img class="archive-img" src="../../../../assets/images/icons/icon6.svg" >
198
- </div>
199
- <div class="archive-name">
200
- <span>{{ userReportData.annex.name }}</span>
201
- <div class="archive-icon">
202
- <i @click.stop.prevent="openReportRemoveSection(userReportData.annex)" class="far fa-trash-alt"></i>
203
- </div>
204
- </div>
205
- </div>
206
- <div v-if="hasReportRemove" class="archive-remove">
207
- <p>Você tem certeza que deseja apagar este arquivo?</p>
208
- <div class="d-flex">
209
- <base-button
210
- @click="removeReportArchive(currentRemoveItem)"
211
- size="sm"
212
- class="btn-outline-primary col-6 p-1"
213
- >
214
- Apagar
215
- </base-button>
216
- <base-button
217
- @click="hasRemove = false"
218
- size="sm"
219
- class="btn-outline-danger col-6 p-1"
220
- >
221
- Cancelar
222
- </base-button>
223
- </div>
224
- </div>
225
- </div>
226
-
227
- <p class="notes-title mb-0">Comentários Recrutador</p>
228
- <div class="line mb-3"></div>
229
-
230
- <div v-if="!isLocked && userReportData.comment">
231
- <div class="notes-baloon fullsize">
232
- <div class="notes-text mx-3 pt-1">
233
- <p class="mt-3">{{ userReportData.comment.comment }}</p>
234
- </div>
235
- <div
236
- class="d-flex justify-content-end align-items-center mr-3"
237
- >
238
- <p class="notes-date">
239
- {{ userReportData.comment.created_at | convertDate }}
240
- </p>
241
- </div>
242
- </div>
243
- <div class="notes-owner d-flex mt-2">
244
- <img
245
- v-if="userReportData.comment.user.urlAvatar"
246
- :src="userReportData.comment.user.urlAvatar"
247
- :alt="userReportData.comment.user.name"
248
- />
249
- <div
250
- v-else
251
- class="notes-avatar"
252
- ></div>
253
- <p class="ml-1">
254
- {{ userReportData.comment.user.name }}
255
- </p>
256
- </div>
257
- </div>
258
-
259
- <div class="input-container" v-show="!isLocked && !userReportData.comment">
260
- <input
261
- class="notes-new pl-4 mt-3 mb-3 form-rounded"
262
- type="text"
263
- placeholder="Escrever anotação"
264
- v-model="newReportNote"
265
- @change="handleNewReportNoteSubmit"
266
- v-on:change="cleatInput()"
267
- />
268
- <i
269
- @click="handleNewReportNoteSubmit"
270
- class="fas fa-paper-plane input-icon"
271
- ></i>
272
- </div>
273
- </el-tab-pane>
274
-
275
- <!-- <el-tab-pane :disabled="true">
276
- <span class="tab__icon-pane cursor-disabled" slot="label">
277
- <img
278
- class="img__icon-pane"
279
- src="../../../../assets/images/icons/icon4.svg"
280
- />
281
- </span>
282
- </el-tab-pane> -->
283
- </el-tabs>
284
- </div>
285
- </template>
286
-
287
- <script>
288
- import { Tabs, TabPane } from 'element-ui';
289
- import DropzoneFileUpload from '@burh/nuxt-core/components/argon-core/Inputs/DropzoneFileUpload.vue';
290
- import swal from 'sweetalert2';
291
- import UpgradePlan from './UpgradePlan.vue';
292
-
293
- export default {
294
- name: 'user-cv-right-side',
295
- filters: {
296
- convertDate(data) {
297
- if (typeof data !== 'string') {
298
- data = '2020-01-01 12:00:00';
299
- }
300
- let d = new Date(data);
301
- let options = { hour: '2-digit', minute: '2-digit' };
302
- return d.toLocaleDateString('pt-BR', options);
303
- }
304
- },
305
- watch:{
306
- fileToUpload(value){
307
- if(value.length > 0 && value[0].accepted) {
308
- this.isError = false;
309
- }
310
- },
311
- reportFileUpload(value){
312
- if(value.length > 0 && value[0].accepted) {
313
- this.isError = false;
314
- }
315
- },
316
- archives() {
317
- this.getUserFolderData();
318
- }
319
- },
320
- components: {
321
- [Tabs.name]: Tabs,
322
- [TabPane.name]: TabPane,
323
- DropzoneFileUpload,
324
- UpgradePlan
325
- },
326
- data(){
327
- return {
328
- newNote: '',
329
- newReportNote: '',
330
- active: this.activeName,
331
- hasRemove: null,
332
- isError: true,
333
- currentRemoveItem: null,
334
- fileToUpload: [],
335
- dropzoneOptions: {
336
- maxFilesize: 5,
337
- dictFileTooBig:'Seu arquivo é poderoso demais (Máximo 5mb).',
338
- dictDefaultMessage: 'Clique ou arraste seu arquivo aqui.',
339
- dictInvalidFileType: 'Arquivo invalido.',
340
- dictMaxFilesExceeded: 'Não é permitido mais de um arquivo por vez.',
341
- acceptedFiles: 'image/*, application/pdf',
342
- },
343
- reportFileUpload: [],
344
- reportsDropdownzoneOptions: {
345
- maxFilesize: 1,
346
- dictFileTooBig:'Seu arquivo é poderoso demais (Máximo 5mb).',
347
- dictDefaultMessage: 'Clique ou arraste seu arquivo aqui.',
348
- dictInvalidFileType: 'Arquivo invalido.',
349
- dictMaxFilesExceeded: 'Não é permitido mais de um arquivo por vez.',
350
- acceptedFiles: 'image/*, application/pdf',
351
- },
352
- userReportData: [],
353
- hasReportRemove: false,
354
- isLocked: !this.companyHasProduct(
355
- this.$store.state.loja && this.$store.state.loja.showableProducts && this.$store.state.loja.showableProducts['HISTORICO_USUARIO'] || false
356
- ),
357
- };
358
- },
359
- props: {
360
- archives: Array,
361
- userData: Object,
362
- notes: Array,
363
- activeName: String,
364
- userFolderId: String,
365
- isNotesActived: {
366
- type: Boolean,
367
- default: true
368
- },
369
- isReportsActived: {
370
- type: Boolean,
371
- default: false
372
- },
373
- },
374
- mounted() {
375
- this.companyHistory();
376
- this.getUserFolderData();
377
- },
378
- methods: {
379
- handleNewReportNoteSubmit() {
380
- if (this.newReportNote.length > 3) {
381
- this.$emit('new-report-note', this.newReportNote, this.userFolderId, this.userData.id);
382
- this.newReportNote = '';
383
- }
384
- },
385
- openRemoveSection(item, index) {
386
- this.hasRemove = index;
387
- this.currentRemoveItem = item;
388
- },
389
- openReportRemoveSection(item) {
390
- this.hasReportRemove = true;
391
- this.currentRemoveItem = item;
392
- },
393
-
394
- showToast(type, title){
395
- const Toast = swal.mixin({
396
- toast: true,
397
- position: 'top-end',
398
- showConfirmButton: false,
399
- timer: 3100,
400
- });
401
-
402
- return Toast.fire({
403
- type: type,
404
- title: title
405
- });
406
- },
407
-
408
- showMessageError(file, message) {
409
- this.isError = true;
410
- this.$refs.Mydropzone.removeAllFiles();
411
-
412
- if (file.status !== 'canceled'){
413
- this.showToast('error', message);
414
- }
415
- },
416
-
417
- openArchive(item) {
418
- window.open(item.annex_url, '_blank');
419
- },
420
-
421
- saveImage(){
422
- if (!this.isError) {
423
- this.$emit('save-archive', this.fileToUpload[0], this.userData.id);
424
- this.$refs.Mydropzone.removeAllFiles();
425
- this.showToast('success', 'Arquivo enviado com sucesso.');
426
-
427
- } else {
428
- if (this.fileToUpload.length > 0) {
429
- this.showToast('error', 'Arquivo invalido.');
430
- } else {
431
- this.showToast('warning', 'Selecione um arquivo.');
432
- }
433
- }
434
- },
435
-
436
- saveReport() {
437
- if (!this.isError) {
438
- this.$emit('save-report', this.reportFileUpload[0], this.userFolderId);
439
- this.$refs.Mydropzone.removeAllFiles();
440
- this.showToast('success', 'Arquivo enviado com sucesso.');
441
-
442
- } else {
443
- if (this.reportFileUpload.length > 0) {
444
- this.showToast('error', 'Arquivo invalido.');
445
- } else {
446
- this.showToast('warning', 'Selecione um arquivo.');
447
- }
448
- }
449
- },
450
-
451
- removeArchive(archive, index){
452
- this.$emit('remove-archive', archive.user_id, archive.id, archive.company_id, index);
453
- this.hasRemove = null;
454
- },
455
-
456
- removeReportArchive(archive) {
457
- this.userReportData.annex = undefined;
458
-
459
- this.$emit('remove-report', archive.id);
460
- this.hasReportRemove = false;
461
- },
462
-
463
- cleatInput() {
464
- this.newNote = '';
465
- },
466
- companyHistory() {
467
- let sms = this.userData.company_sms.map(x => ({
468
- date: x.created_at,
469
- text: 'Recebeu um SMS'
470
- }));
471
- let tests = this.userData.tests.map(x => {
472
- if (x.finished_at) {
473
- return {
474
- date: x.finished_at,
475
- text: `Finalizou o teste ${x.test.name.toUpperCase()}`
476
- };
477
- } else {
478
- return {
479
- date: x.created_at,
480
- text: `Recebeu o teste ${x.test.name.toUpperCase()}`
481
- };
482
- }
483
-
484
- });
485
- let discs = this.userData.solides.map(x => ({
486
- date: x.end,
487
- text: 'Realizou um teste DISC'
488
- }));
489
-
490
- return sms.concat(tests, discs);
491
- },
492
- orderByDate(data) {
493
- let sortedArray = data.sort((a, b) => {
494
- a = a.date || '2020-01-01 12:00:00';
495
- b = b.date || '2020-01-01 12:00:00';
496
-
497
- return new Date(b).getTime() - new Date(a).getTime();
498
- });
499
-
500
- return sortedArray;
501
- },
502
- sendContact() {
503
- this.$emit('open-contact');
504
- },
505
-
506
- async getUserFolderData() {
507
- const apiUrl = `${process.env.baseApiUrlV2}/company/buffer/folder/user/${this.userFolderId}`;
508
-
509
- const data = await this.$axios(apiUrl)
510
- .then(res => res.data)
511
- .catch(() => {});
512
-
513
- if (!data) return;
514
-
515
- this.mountUserReport(data.data);
516
- },
517
-
518
- mountUserReport(userData) {
519
- const annex = userData.annex[0] || undefined;
520
- const comment = userData.comments[0] || undefined;
521
-
522
- this.userReportData = {
523
- annex,
524
- comment
525
- };
526
- }
527
- },
528
- };
529
- </script>
530
- <style>
531
- .el-tabs__nav-wrap::after {
532
- background: #fff !important;
533
- }
534
-
535
- .el-tabs__active-bar {
536
- width: 30px !important;
537
- height: 4px !important;
538
- border-radius: 10px 10px 0px 0px;
539
- }
540
- </style>
541
-
542
- <style lang="scss">
543
- .swal2-title {
544
- font-size: 1rem !important;
545
- }
546
- .swal2-container {
547
- z-index: 5000 !important;
548
- }
549
- </style>
550
-
551
- <style lang="scss" scoped>
552
- @import '@burh/nuxt-core/assets/sass/burh-ds/variables/_colors.scss';
553
-
554
- /deep/.dropzone {
555
- width: 95%;
556
-
557
- .dz-message {
558
- padding: 2rem 1rem !important;
559
- }
560
-
561
- button.dz-button {
562
- background-color: transparent;
563
- border: 0;
564
- }
565
- }
566
-
567
- /deep/ .el-tab-pane {
568
- height: 760px;
569
- max-height: 760px;
570
- overflow: hidden;
571
- overflow-y: auto;
572
- position: relative;
573
-
574
- > .notes-title {
575
- position: sticky;
576
- position: -webkit-sticky;
577
- top: 0;
578
- background: white;
579
- padding: 10px 0;
580
- }
581
-
582
- > .input-container {
583
- position: sticky;
584
- position: -webkit-sticky;
585
- bottom: 0;
586
- background: white;
587
- > .input-icon {
588
- cursor: pointer;
589
- position: absolute;
590
- top: 50%;
591
- right: 30px;
592
- transform: translateY(-50%);
593
- color: #c8c8c8;
594
- }
595
- }
596
-
597
- &::-webkit-scrollbar {
598
- width: 8px;
599
- }
600
-
601
- &::-webkit-scrollbar-track {
602
- background: #f5f5f5;
603
- }
604
-
605
- &::-webkit-scrollbar-thumb {
606
- background: #e9e8e8;
607
- border-radius: 10px;
608
- }
609
-
610
- .archive-content {
611
- width: 95%;
612
-
613
- p {
614
- margin-bottom: 0;
615
- font-size: 0.875rem;
616
- padding: .3rem .6rem 0 .6rem;
617
- }
618
-
619
- .archive-container {
620
- display: flex;
621
- align-items: center;
622
- padding: 0.5rem 0.5rem 0.438rem;
623
- cursor: pointer;
624
- user-select: none;
625
-
626
- &:hover{
627
- background-color: #f6f9fc;
628
- border-radius: 5px;
629
- }
630
-
631
- .archive-img {
632
- background-color: #f5f5f5;
633
- border-radius: 6px;
634
- padding: 7px;
635
- }
636
-
637
- .archive-name {
638
- display: flex;
639
- margin-left: .8rem;
640
- width: 145%;
641
- justify-content: space-between !important;
642
-
643
- .archive-icon {
644
- margin-left: 1.5rem;
645
- }
646
-
647
- p {
648
- margin: 0;
649
- padding: 0;
650
- width: 13rem;
651
- white-space: nowrap;
652
- overflow: hidden;
653
- text-overflow: ellipsis;
654
- }
655
- }
656
-
657
- .upload-container {
658
- position: sticky;
659
- position: -webkit-sticky;
660
- bottom: 0;
661
- background: white;
662
- width: 231px;
663
- }
664
- }
665
- }
666
-
667
- .archive-buttons {
668
- display: flex;
669
- margin-top: -1rem;
670
- width: 95%;
671
- }
672
-
673
- .archive-remove {
674
- width: 90%;
675
- word-break: break-word;
676
- }
677
- }
678
-
679
- /deep/ .el-tabs__nav-scroll {
680
- display: flex;
681
- justify-content: stretch;
682
- align-items: flex-start;
683
- }
684
-
685
- /deep/ .el-tabs__item {
686
- padding: 0 1.60rem !important;
687
- }
688
-
689
- /deep/ .el-tabs__nav {
690
- width: 100% !important;
691
- user-select: none;
692
- }
693
-
694
- @media (max-width: 1520px) {
695
- /deep/ .el-tabs__item {
696
- padding: 0 1.8rem !important;
697
- }
698
- }
699
-
700
- .readmore {
701
- overflow: hidden;
702
- text-overflow: ellipsis;
703
- display: -webkit-box;
704
- -webkit-line-clamp: 3;
705
- -webkit-box-orient: vertical;
706
- }
707
-
708
- .tab__icon-pane {
709
- .img__icon-pane {
710
- background-color: #f5f5f5 !important;
711
- border-radius: 30%;
712
- padding: 7px;
713
- margin-bottom: 1rem;
714
- }
715
- }
716
-
717
- .content-right {
718
- width: 25%;
719
- }
720
-
721
- .notes-title {
722
- font-size: 14px;
723
- color: #1d364b;
724
- font-weight: bold;
725
- background-color: white;
726
- z-index: 500;
727
- }
728
-
729
- .notes-baloon {
730
- width: 231px;
731
- height: auto;
732
-
733
- background: #eff5fd;
734
- border-radius: 10px 10px 10px 0px;
735
-
736
- &.fullsize {
737
- width: 80%!important;
738
- min-width: 280px;
739
- }
740
- }
741
-
742
- .notes-text {
743
- p {
744
- font-size: 13px;
745
- color: #62778c;
746
- }
747
- }
748
-
749
- .notes-date {
750
- font-size: 11px;
751
- text-align: right;
752
-
753
- color: #8da2b5;
754
- top: calc(50% - 17px / 2 - 444.5px);
755
- }
756
-
757
- .notes-owner {
758
- img {
759
- width: 23px;
760
- height: 23px;
761
- border-radius: 50%;
762
- }
763
-
764
- .notes-avatar {
765
- width: 23px;
766
- height: 23px;
767
- border-radius: 50%;
768
- background-color: #adb5bd;
769
- }
770
-
771
- p {
772
- font-size: 13px;
773
- font-weight: 600;
774
- text-transform: uppercase;
775
-
776
- color: #62778c;
777
- }
778
- }
779
-
780
- .notes-new {
781
- width: 95%;
782
- height: 33px;
783
-
784
- background: #f5f5f5;
785
- border-radius: 16.5px;
786
- border: none;
787
-
788
- outline: 0;
789
- }
790
-
791
- .line {
792
- width: 221px;
793
- height: 0px;
794
-
795
- border: 1px solid #ececec5c;
796
- }
797
-
798
- .history {
799
- word-break: break-word;
800
-
801
- .history-text {
802
- font-size: 13px;
803
- color: #62778c;
804
- }
805
-
806
- span {
807
- font-size: 11px;
808
- line-height: 16px;
809
-
810
- color: #8da2b5;
811
- }
812
- }
813
-
814
- .cursor-disabled {
815
- cursor: no-drop;
816
- }
817
- </style>
1
+ <template>
2
+ <div class="bg-white content-right tabs ">
3
+ <el-tabs
4
+ :class="active"
5
+ class="mt-3 handle-icon-color"
6
+ v-model="active"
7
+ >
8
+ <el-tab-pane class="history ml-2" name="history">
9
+ <span class="tab__icon-pane" slot="label">
10
+ <img
11
+ class="img__icon-pane img__icon--history"
12
+ src="../../../../assets/images/icons/historicCv.svg"
13
+ />
14
+ </span>
15
+ <upgrade-plan @send-contact="sendContact" v-show="isLocked" />
16
+ <p class="notes-title mb-0">Histórico com sua empresa</p>
17
+ <div class="line mb-3"></div>
18
+
19
+ <div
20
+ class="mt-3"
21
+ v-for="(item, index) in orderByDate(companyHistory())"
22
+ :key="index"
23
+ >
24
+ <p class="history-text mb-0">
25
+ {{ item.text }}
26
+ </p>
27
+ <span>{{ item.date | convertDate }}</span>
28
+ </div>
29
+ <p v-show="companyHistory().length === 0" class="history-text">
30
+ Histórico vazio.
31
+ </p>
32
+ </el-tab-pane>
33
+
34
+ <el-tab-pane name="notes" class="ml-2" v-if="isNotesActived">
35
+ <span class="tab__icon-pane" slot="label">
36
+ <img
37
+ class="img__icon-pane img__icon--notes"
38
+ src="../../../../assets/images/icons/notesCv.svg"
39
+ />
40
+ </span>
41
+ <upgrade-plan @send-contact="sendContact" v-show="isLocked" />
42
+ <p class="notes-title mb-0">Notas da equipe</p>
43
+ <div class="line mb-3"></div>
44
+ <div
45
+ v-show="notes.length > 0"
46
+ v-for="(note, index) in notes.slice(0, 5)"
47
+ :key="index"
48
+ >
49
+ <div class="notes-baloon">
50
+ <div class="notes-text ml-3 pt-1">
51
+ <p class="mt-3">{{ note.text }}</p>
52
+ </div>
53
+ <div
54
+ class="d-flex justify-content-end align-items-center mr-3"
55
+ >
56
+ <p class="notes-date">
57
+ {{ note.created_at | convertDate }}
58
+ </p>
59
+ </div>
60
+ </div>
61
+ <div class="notes-owner d-flex mt-2">
62
+ <img
63
+ v-show="note.user.urlAvatar"
64
+ :src="note.user.urlAvatar"
65
+ :alt="note.user.name"
66
+ />
67
+ <div
68
+ v-show="!note.user.urlAvatar"
69
+ class="notes-avatar"
70
+ ></div>
71
+ <p class="ml-1">
72
+ {{ note.user.name }}
73
+ </p>
74
+ </div>
75
+ </div>
76
+ <div class="notes-text" v-show="notes.length === 0">
77
+ <p>Nenhuma nota criada.</p>
78
+ </div>
79
+
80
+ <div class="input-container" v-show="!isLocked">
81
+ <input
82
+ class="notes-new pl-4 mt-3 mb-3 form-rounded"
83
+ type="text"
84
+ placeholder="Escrever anotação"
85
+ v-model="newNote"
86
+ @change="$emit('new-note', newNote, userData.id)"
87
+ v-on:change="cleatInput()"
88
+ />
89
+ <i
90
+ @click="
91
+ newNote.length > 0 &&
92
+ $emit('new-note', newNote, userData.id)
93
+ "
94
+ class="fas fa-paper-plane input-icon"
95
+ ></i>
96
+ </div>
97
+ </el-tab-pane>
98
+
99
+ <el-tab-pane name="documents" class="ml-2">
100
+ <span class="tab__icon-pane" slot="label">
101
+ <img
102
+ class="img__icon-pane img__icon--documents"
103
+ src="../../../../assets/images/icons/icon3.svg"
104
+ />
105
+ </span>
106
+ <upgrade-plan @send-contact="sendContact" v-show="isLocked" />
107
+ <p class="notes-title mb-0">Documentos anexados</p>
108
+ <div class="line mb-3"></div>
109
+
110
+ <div class="archive-content">
111
+ <div v-for="(item, index) in archives" :key="index">
112
+ <div @click="openArchive(item)" class="archive-container">
113
+ <div>
114
+ <img class="archive-img" src="../../../../assets/images/icons/icon3.svg" >
115
+ </div>
116
+ <div class="archive-name">
117
+ <span>{{item.name}}</span>
118
+ <div class="archive-icon">
119
+ <i @click.stop.prevent="openRemoveSection(item, (index+1))" class="far fa-trash-alt"></i>
120
+ </div>
121
+ </div>
122
+ </div>
123
+ <div v-if="hasRemove && hasRemove == (index+1)" class="archive-remove">
124
+ <p>Você tem certeza que deseja apagar este arquivo?</p>
125
+ <div class="d-flex">
126
+ <base-button
127
+ @click="removeArchive(currentRemoveItem, index)"
128
+ size="sm"
129
+ class="btn-outline-primary col-6 p-1"
130
+ >
131
+ Apagar
132
+ </base-button>
133
+ <base-button
134
+ @click="hasRemove = false"
135
+ size="sm"
136
+ class="btn-outline-danger col-6 p-1"
137
+ >
138
+ Cancelar
139
+ </base-button>
140
+ </div>
141
+ </div>
142
+ </div>
143
+
144
+ </div>
145
+ <div class="notes-text" v-show="archives == null">
146
+ <p>Nenhum arquvio anexado.</p>
147
+ </div>
148
+
149
+ <div class="input-container" v-show="!isLocked">
150
+ <div class="mt-5">
151
+
152
+ <dropzone-file-upload
153
+ disabled
154
+ @error="showMessageError"
155
+ ref="Mydropzone"
156
+ :options="dropzoneOptions"
157
+ v-model="fileToUpload"
158
+ />
159
+ </div>
160
+
161
+ <div class="archive-buttons">
162
+ <base-button @click="saveImage" size="sm" class="btn-outline-primary btn-rounded col-12">Salvar</base-button>
163
+ </div>
164
+ </div>
165
+ </el-tab-pane>
166
+
167
+ <el-tab-pane name="reports" class="ml-2" v-if="isReportsActived">
168
+ <span class="tab__icon-pane" slot="label">
169
+ <img
170
+ class="img__icon-pane img__icon--reports"
171
+ src="../../../../assets/images/icons/icon5.svg"
172
+ />
173
+ </span>
174
+
175
+ <upgrade-plan @send-contact="sendContact" v-show="isLocked" />
176
+
177
+ <p class="notes-title mb-0">Laudo do Candidato</p>
178
+ <div class="line mb-3"></div>
179
+
180
+ <div class="input-container" v-if="!isLocked && !userReportData.annex">
181
+ <dropzone-file-upload
182
+ disabled
183
+ ref="Mydropzone"
184
+ v-model="reportFileUpload"
185
+ :options="reportsDropdownzoneOptions"
186
+ @error="showMessageError"
187
+ />
188
+
189
+ <div class="archive-buttons" v-if="reportFileUpload.length > 0">
190
+ <base-button @click="saveReport" size="sm" class="btn-outline-primary btn-rounded col-12">Salvar</base-button>
191
+ </div>
192
+ </div>
193
+
194
+ <div class="archive-content" v-else-if="userReportData.annex">
195
+ <div @click="openArchive(userReportData.annex)" class="archive-container">
196
+ <div>
197
+ <img class="archive-img" src="../../../../assets/images/icons/icon6.svg" >
198
+ </div>
199
+ <div class="archive-name">
200
+ <span>{{ userReportData.annex.name }}</span>
201
+ <div class="archive-icon">
202
+ <i @click.stop.prevent="openReportRemoveSection(userReportData.annex)" class="far fa-trash-alt"></i>
203
+ </div>
204
+ </div>
205
+ </div>
206
+ <div v-if="hasReportRemove" class="archive-remove">
207
+ <p>Você tem certeza que deseja apagar este arquivo?</p>
208
+ <div class="d-flex">
209
+ <base-button
210
+ @click="removeReportArchive(currentRemoveItem)"
211
+ size="sm"
212
+ class="btn-outline-primary col-6 p-1"
213
+ >
214
+ Apagar
215
+ </base-button>
216
+ <base-button
217
+ @click="hasRemove = false"
218
+ size="sm"
219
+ class="btn-outline-danger col-6 p-1"
220
+ >
221
+ Cancelar
222
+ </base-button>
223
+ </div>
224
+ </div>
225
+ </div>
226
+
227
+ <p class="notes-title mb-0">Comentários Recrutador</p>
228
+ <div class="line mb-3"></div>
229
+
230
+ <div v-if="!isLocked && userReportData.comment">
231
+ <div class="notes-baloon fullsize">
232
+ <div class="notes-text mx-3 pt-1">
233
+ <p class="mt-3">{{ userReportData.comment.comment }}</p>
234
+ </div>
235
+ <div
236
+ class="d-flex justify-content-end align-items-center mr-3"
237
+ >
238
+ <p class="notes-date">
239
+ {{ userReportData.comment.created_at | convertDate }}
240
+ </p>
241
+ </div>
242
+ </div>
243
+ <div class="notes-owner d-flex mt-2">
244
+ <img
245
+ v-if="userReportData.comment.user.urlAvatar"
246
+ :src="userReportData.comment.user.urlAvatar"
247
+ :alt="userReportData.comment.user.name"
248
+ />
249
+ <div
250
+ v-else
251
+ class="notes-avatar"
252
+ ></div>
253
+ <p class="ml-1">
254
+ {{ userReportData.comment.user.name }}
255
+ </p>
256
+ </div>
257
+ </div>
258
+
259
+ <div class="input-container" v-show="!isLocked && !userReportData.comment">
260
+ <input
261
+ class="notes-new pl-4 mt-3 mb-3 form-rounded"
262
+ type="text"
263
+ placeholder="Escrever anotação"
264
+ v-model="newReportNote"
265
+ @change="handleNewReportNoteSubmit"
266
+ v-on:change="cleatInput()"
267
+ />
268
+ <i
269
+ @click="handleNewReportNoteSubmit"
270
+ class="fas fa-paper-plane input-icon"
271
+ ></i>
272
+ </div>
273
+ </el-tab-pane>
274
+
275
+ <!-- <el-tab-pane :disabled="true">
276
+ <span class="tab__icon-pane cursor-disabled" slot="label">
277
+ <img
278
+ class="img__icon-pane"
279
+ src="../../../../assets/images/icons/icon4.svg"
280
+ />
281
+ </span>
282
+ </el-tab-pane> -->
283
+ </el-tabs>
284
+ </div>
285
+ </template>
286
+
287
+ <script>
288
+ import { Tabs, TabPane } from 'element-ui';
289
+ import DropzoneFileUpload from '@burh/nuxt-core/components/argon-core/Inputs/DropzoneFileUpload.vue';
290
+ import swal from 'sweetalert2';
291
+ import UpgradePlan from './UpgradePlan.vue';
292
+
293
+ export default {
294
+ name: 'user-cv-right-side',
295
+ filters: {
296
+ convertDate(data) {
297
+ if (typeof data !== 'string') {
298
+ data = '2020-01-01 12:00:00';
299
+ }
300
+ let d = new Date(data);
301
+ let options = { hour: '2-digit', minute: '2-digit' };
302
+ return d.toLocaleDateString('pt-BR', options);
303
+ }
304
+ },
305
+ watch:{
306
+ fileToUpload(value){
307
+ if(value.length > 0 && value[0].accepted) {
308
+ this.isError = false;
309
+ }
310
+ },
311
+ reportFileUpload(value){
312
+ if(value.length > 0 && value[0].accepted) {
313
+ this.isError = false;
314
+ }
315
+ },
316
+ archives() {
317
+ this.getUserFolderData();
318
+ }
319
+ },
320
+ components: {
321
+ [Tabs.name]: Tabs,
322
+ [TabPane.name]: TabPane,
323
+ DropzoneFileUpload,
324
+ UpgradePlan
325
+ },
326
+ data(){
327
+ return {
328
+ newNote: '',
329
+ newReportNote: '',
330
+ active: this.activeName,
331
+ hasRemove: null,
332
+ isError: true,
333
+ currentRemoveItem: null,
334
+ fileToUpload: [],
335
+ dropzoneOptions: {
336
+ maxFilesize: 5,
337
+ dictFileTooBig:'Seu arquivo é poderoso demais (Máximo 5mb).',
338
+ dictDefaultMessage: 'Clique ou arraste seu arquivo aqui.',
339
+ dictInvalidFileType: 'Arquivo invalido.',
340
+ dictMaxFilesExceeded: 'Não é permitido mais de um arquivo por vez.',
341
+ acceptedFiles: 'image/*, application/pdf',
342
+ },
343
+ reportFileUpload: [],
344
+ reportsDropdownzoneOptions: {
345
+ maxFilesize: 1,
346
+ dictFileTooBig:'Seu arquivo é poderoso demais (Máximo 5mb).',
347
+ dictDefaultMessage: 'Clique ou arraste seu arquivo aqui.',
348
+ dictInvalidFileType: 'Arquivo invalido.',
349
+ dictMaxFilesExceeded: 'Não é permitido mais de um arquivo por vez.',
350
+ acceptedFiles: 'image/*, application/pdf',
351
+ },
352
+ userReportData: [],
353
+ hasReportRemove: false,
354
+ isLocked: !this.companyHasProduct(
355
+ this.$store.state.loja && this.$store.state.loja.showableProducts && this.$store.state.loja.showableProducts['HISTORICO_USUARIO'] || false
356
+ ),
357
+ };
358
+ },
359
+ props: {
360
+ archives: Array,
361
+ userData: Object,
362
+ notes: Array,
363
+ activeName: String,
364
+ userFolderId: String,
365
+ isNotesActived: {
366
+ type: Boolean,
367
+ default: true
368
+ },
369
+ isReportsActived: {
370
+ type: Boolean,
371
+ default: false
372
+ },
373
+ },
374
+ mounted() {
375
+ this.companyHistory();
376
+ this.getUserFolderData();
377
+ },
378
+ methods: {
379
+ handleNewReportNoteSubmit() {
380
+ if (this.newReportNote.length > 3) {
381
+ this.$emit('new-report-note', this.newReportNote, this.userFolderId, this.userData.id);
382
+ this.newReportNote = '';
383
+ }
384
+ },
385
+ openRemoveSection(item, index) {
386
+ this.hasRemove = index;
387
+ this.currentRemoveItem = item;
388
+ },
389
+ openReportRemoveSection(item) {
390
+ this.hasReportRemove = true;
391
+ this.currentRemoveItem = item;
392
+ },
393
+
394
+ showToast(type, title){
395
+ const Toast = swal.mixin({
396
+ toast: true,
397
+ position: 'top-end',
398
+ showConfirmButton: false,
399
+ timer: 3100,
400
+ });
401
+
402
+ return Toast.fire({
403
+ type: type,
404
+ title: title
405
+ });
406
+ },
407
+
408
+ showMessageError(file, message) {
409
+ this.isError = true;
410
+ this.$refs.Mydropzone.removeAllFiles();
411
+
412
+ if (file.status !== 'canceled'){
413
+ this.showToast('error', message);
414
+ }
415
+ },
416
+
417
+ openArchive(item) {
418
+ window.open(item.annex_url, '_blank');
419
+ },
420
+
421
+ saveImage(){
422
+ if (!this.isError) {
423
+ this.$emit('save-archive', this.fileToUpload[0], this.userData.id);
424
+ this.$refs.Mydropzone.removeAllFiles();
425
+ this.showToast('success', 'Arquivo enviado com sucesso.');
426
+
427
+ } else {
428
+ if (this.fileToUpload.length > 0) {
429
+ this.showToast('error', 'Arquivo invalido.');
430
+ } else {
431
+ this.showToast('warning', 'Selecione um arquivo.');
432
+ }
433
+ }
434
+ },
435
+
436
+ saveReport() {
437
+ if (!this.isError) {
438
+ this.$emit('save-report', this.reportFileUpload[0], this.userFolderId);
439
+ this.$refs.Mydropzone.removeAllFiles();
440
+ this.showToast('success', 'Arquivo enviado com sucesso.');
441
+
442
+ } else {
443
+ if (this.reportFileUpload.length > 0) {
444
+ this.showToast('error', 'Arquivo invalido.');
445
+ } else {
446
+ this.showToast('warning', 'Selecione um arquivo.');
447
+ }
448
+ }
449
+ },
450
+
451
+ removeArchive(archive, index){
452
+ this.$emit('remove-archive', archive.user_id, archive.id, archive.company_id, index);
453
+ this.hasRemove = null;
454
+ },
455
+
456
+ removeReportArchive(archive) {
457
+ this.userReportData.annex = undefined;
458
+
459
+ this.$emit('remove-report', archive.id);
460
+ this.hasReportRemove = false;
461
+ },
462
+
463
+ cleatInput() {
464
+ this.newNote = '';
465
+ },
466
+ companyHistory() {
467
+ let sms = this.userData.company_sms.map(x => ({
468
+ date: x.created_at,
469
+ text: 'Recebeu um SMS'
470
+ }));
471
+ let tests = this.userData.tests.map(x => {
472
+ if (x.finished_at) {
473
+ return {
474
+ date: x.finished_at,
475
+ text: `Finalizou o teste ${x.test.name.toUpperCase()}`
476
+ };
477
+ } else {
478
+ return {
479
+ date: x.created_at,
480
+ text: `Recebeu o teste ${x.test.name.toUpperCase()}`
481
+ };
482
+ }
483
+
484
+ });
485
+ let discs = this.userData.solides.map(x => ({
486
+ date: x.end,
487
+ text: 'Realizou um teste DISC'
488
+ }));
489
+
490
+ return sms.concat(tests, discs);
491
+ },
492
+ orderByDate(data) {
493
+ let sortedArray = data.sort((a, b) => {
494
+ a = a.date || '2020-01-01 12:00:00';
495
+ b = b.date || '2020-01-01 12:00:00';
496
+
497
+ return new Date(b).getTime() - new Date(a).getTime();
498
+ });
499
+
500
+ return sortedArray;
501
+ },
502
+ sendContact() {
503
+ this.$emit('open-contact');
504
+ },
505
+
506
+ async getUserFolderData() {
507
+ const apiUrl = `${process.env.baseApiUrlV2}/company/buffer/folder/user/${this.userFolderId}`;
508
+
509
+ const data = await this.$axios(apiUrl)
510
+ .then(res => res.data)
511
+ .catch(() => {});
512
+
513
+ if (!data) return;
514
+
515
+ this.mountUserReport(data.data);
516
+ },
517
+
518
+ mountUserReport(userData) {
519
+ const annex = userData.annex[0] || undefined;
520
+ const comment = userData.comments[0] || undefined;
521
+
522
+ this.userReportData = {
523
+ annex,
524
+ comment
525
+ };
526
+ }
527
+ },
528
+ };
529
+ </script>
530
+ <style>
531
+ .el-tabs__nav-wrap::after {
532
+ background: #fff !important;
533
+ }
534
+
535
+ .el-tabs__active-bar {
536
+ width: 30px !important;
537
+ height: 4px !important;
538
+ border-radius: 10px 10px 0px 0px;
539
+ }
540
+ </style>
541
+
542
+ <style lang="scss">
543
+ .swal2-title {
544
+ font-size: 1rem !important;
545
+ }
546
+ .swal2-container {
547
+ z-index: 5000 !important;
548
+ }
549
+ </style>
550
+
551
+ <style lang="scss" scoped>
552
+ @import '@burh/nuxt-core/assets/sass/burh-ds/variables/_colors.scss';
553
+
554
+ /deep/.dropzone {
555
+ width: 95%;
556
+
557
+ .dz-message {
558
+ padding: 2rem 1rem !important;
559
+ }
560
+
561
+ button.dz-button {
562
+ background-color: transparent;
563
+ border: 0;
564
+ }
565
+ }
566
+
567
+ /deep/ .el-tab-pane {
568
+ height: 760px;
569
+ max-height: 760px;
570
+ overflow: hidden;
571
+ overflow-y: auto;
572
+ position: relative;
573
+
574
+ > .notes-title {
575
+ position: sticky;
576
+ position: -webkit-sticky;
577
+ top: 0;
578
+ background: white;
579
+ padding: 10px 0;
580
+ }
581
+
582
+ > .input-container {
583
+ position: sticky;
584
+ position: -webkit-sticky;
585
+ bottom: 0;
586
+ background: white;
587
+ > .input-icon {
588
+ cursor: pointer;
589
+ position: absolute;
590
+ top: 50%;
591
+ right: 30px;
592
+ transform: translateY(-50%);
593
+ color: #c8c8c8;
594
+ }
595
+ }
596
+
597
+ &::-webkit-scrollbar {
598
+ width: 8px;
599
+ }
600
+
601
+ &::-webkit-scrollbar-track {
602
+ background: #f5f5f5;
603
+ }
604
+
605
+ &::-webkit-scrollbar-thumb {
606
+ background: #e9e8e8;
607
+ border-radius: 10px;
608
+ }
609
+
610
+ .archive-content {
611
+ width: 95%;
612
+
613
+ p {
614
+ margin-bottom: 0;
615
+ font-size: 0.875rem;
616
+ padding: .3rem .6rem 0 .6rem;
617
+ }
618
+
619
+ .archive-container {
620
+ display: flex;
621
+ align-items: center;
622
+ padding: 0.5rem 0.5rem 0.438rem;
623
+ cursor: pointer;
624
+ user-select: none;
625
+
626
+ &:hover{
627
+ background-color: #f6f9fc;
628
+ border-radius: 5px;
629
+ }
630
+
631
+ .archive-img {
632
+ background-color: #f5f5f5;
633
+ border-radius: 6px;
634
+ padding: 7px;
635
+ }
636
+
637
+ .archive-name {
638
+ display: flex;
639
+ margin-left: .8rem;
640
+ width: 145%;
641
+ justify-content: space-between !important;
642
+
643
+ .archive-icon {
644
+ margin-left: 1.5rem;
645
+ }
646
+
647
+ p {
648
+ margin: 0;
649
+ padding: 0;
650
+ width: 13rem;
651
+ white-space: nowrap;
652
+ overflow: hidden;
653
+ text-overflow: ellipsis;
654
+ }
655
+ }
656
+
657
+ .upload-container {
658
+ position: sticky;
659
+ position: -webkit-sticky;
660
+ bottom: 0;
661
+ background: white;
662
+ width: 231px;
663
+ }
664
+ }
665
+ }
666
+
667
+ .archive-buttons {
668
+ display: flex;
669
+ margin-top: -1rem;
670
+ width: 95%;
671
+ }
672
+
673
+ .archive-remove {
674
+ width: 90%;
675
+ word-break: break-word;
676
+ }
677
+ }
678
+
679
+ /deep/ .el-tabs__nav-scroll {
680
+ display: flex;
681
+ justify-content: stretch;
682
+ align-items: flex-start;
683
+ }
684
+
685
+ /deep/ .el-tabs__item {
686
+ padding: 0 1.60rem !important;
687
+ }
688
+
689
+ /deep/ .el-tabs__nav {
690
+ width: 100% !important;
691
+ user-select: none;
692
+ }
693
+
694
+ @media (max-width: 1520px) {
695
+ /deep/ .el-tabs__item {
696
+ padding: 0 1.8rem !important;
697
+ }
698
+ }
699
+
700
+ .readmore {
701
+ overflow: hidden;
702
+ text-overflow: ellipsis;
703
+ display: -webkit-box;
704
+ -webkit-line-clamp: 3;
705
+ -webkit-box-orient: vertical;
706
+ }
707
+
708
+ .tab__icon-pane {
709
+ .img__icon-pane {
710
+ background-color: #f5f5f5 !important;
711
+ border-radius: 30%;
712
+ padding: 7px;
713
+ margin-bottom: 1rem;
714
+ }
715
+ }
716
+
717
+ .content-right {
718
+ width: 25%;
719
+ }
720
+
721
+ .notes-title {
722
+ font-size: 14px;
723
+ color: #1d364b;
724
+ font-weight: bold;
725
+ background-color: white;
726
+ z-index: 500;
727
+ }
728
+
729
+ .notes-baloon {
730
+ width: 231px;
731
+ height: auto;
732
+
733
+ background: #eff5fd;
734
+ border-radius: 10px 10px 10px 0px;
735
+
736
+ &.fullsize {
737
+ width: 80%!important;
738
+ min-width: 280px;
739
+ }
740
+ }
741
+
742
+ .notes-text {
743
+ p {
744
+ font-size: 13px;
745
+ color: #62778c;
746
+ }
747
+ }
748
+
749
+ .notes-date {
750
+ font-size: 11px;
751
+ text-align: right;
752
+
753
+ color: #8da2b5;
754
+ top: calc(50% - 17px / 2 - 444.5px);
755
+ }
756
+
757
+ .notes-owner {
758
+ img {
759
+ width: 23px;
760
+ height: 23px;
761
+ border-radius: 50%;
762
+ }
763
+
764
+ .notes-avatar {
765
+ width: 23px;
766
+ height: 23px;
767
+ border-radius: 50%;
768
+ background-color: #adb5bd;
769
+ }
770
+
771
+ p {
772
+ font-size: 13px;
773
+ font-weight: 600;
774
+ text-transform: uppercase;
775
+
776
+ color: #62778c;
777
+ }
778
+ }
779
+
780
+ .notes-new {
781
+ width: 95%;
782
+ height: 33px;
783
+
784
+ background: #f5f5f5;
785
+ border-radius: 16.5px;
786
+ border: none;
787
+
788
+ outline: 0;
789
+ }
790
+
791
+ .line {
792
+ width: 221px;
793
+ height: 0px;
794
+
795
+ border: 1px solid #ececec5c;
796
+ }
797
+
798
+ .history {
799
+ word-break: break-word;
800
+
801
+ .history-text {
802
+ font-size: 13px;
803
+ color: #62778c;
804
+ }
805
+
806
+ span {
807
+ font-size: 11px;
808
+ line-height: 16px;
809
+
810
+ color: #8da2b5;
811
+ }
812
+ }
813
+
814
+ .cursor-disabled {
815
+ cursor: no-drop;
816
+ }
817
+ </style>