@burh/nuxt-core 1.0.409 → 1.0.410

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