@burh/nuxt-core 1.0.359 → 1.0.361

package/components/burh-ds/Curriculum/UserCurriculum/UserCvRightSide.vue

@@ -114,12 +114,10 @@
 								<img class="archive-img" src="../../../../assets/images/icons/icon3.svg" >
 							</div>
 							<div class="archive-name">
-								<p>
-									<span>{{item.name}}</span>
+								<span>{{item.name}}</span>
 								<div class="archive-icon">
 									<i @click.stop.prevent="openRemoveSection(item, (index+1))" class="far fa-trash-alt"></i>
 								</div>
-								</p>
 							</div>
 						</div>
 						<div v-if="hasRemove && hasRemove == (index+1)" class="archive-remove">
@@ -166,6 +164,114 @@
 				</div>
 			</el-tab-pane>
 
+			<el-tab-pane name="reports" class="ml-2" v-if="isReportsActived">
+				<span class="tab__icon-pane" slot="label">
+					<img
+						class="img__icon-pane img__icon--reports"
+						src="../../../../assets/images/icons/icon5.svg"
+					/>
+				</span>
+
+				<upgrade-plan @send-contact="sendContact" v-show="isLocked" />
+
+				<p class="notes-title mb-0">Laudo do Candidato</p>
+				<div class="line mb-3"></div>
+
+				<div class="input-container" v-if="!isLocked && !userReportData.annex">
+					<dropzone-file-upload
+						disabled
+						ref="Mydropzone"
+						v-model="reportFileUpload"
+						:options="reportsDropdownzoneOptions"
+						@error="showMessageError"
+					/>
+
+					<div class="archive-buttons" v-if="reportFileUpload.length > 0">
+						<base-button @click="saveReport" size="sm" class="btn-outline-primary btn-rounded col-12">Salvar</base-button>
+					</div>
+				</div>
+
+				<div class="archive-content" v-else-if="userReportData.annex">
+					<div @click="openArchive(userReportData.annex)" class="archive-container">
+						<div>
+							<img class="archive-img" src="../../../../assets/images/icons/icon6.svg" >
+						</div>
+						<div class="archive-name">
+							<span>{{ userReportData.annex.name }}</span>
+							<div class="archive-icon">
+								<i @click.stop.prevent="openReportRemoveSection(userReportData.annex)" class="far fa-trash-alt"></i>
+							</div>
+						</div>
+					</div>
+					<div v-if="hasReportRemove" class="archive-remove">
+						<p>Você tem certeza que deseja apagar este arquivo?</p>
+						<div class="d-flex">
+							<base-button
+								@click="removeReportArchive(currentRemoveItem)"
+								size="sm"
+								class="btn-outline-primary col-6 p-1"
+							>
+								Apagar
+							</base-button>
+							<base-button
+								@click="hasRemove = false"
+								size="sm"
+								class="btn-outline-danger col-6 p-1"
+							>
+								Cancelar
+							</base-button>
+						</div>
+					</div>
+				</div>
+
+				<p class="notes-title mb-0">Comentários Recrutador</p>
+				<div class="line mb-3"></div>
+
+				<div v-if="!isLocked && userReportData.comment">
+					<div class="notes-baloon fullsize">
+						<div class="notes-text mx-3 pt-1">
+							<p class="mt-3">{{ userReportData.comment.comment }}</p>
+						</div>
+						<div
+							class="d-flex justify-content-end align-items-center mr-3"
+						>
+							<p class="notes-date">
+								{{ userReportData.comment.created_at | convertDate }}
+							</p>
+						</div>
+					</div>
+					<div class="notes-owner d-flex mt-2">
+						<img
+							v-if="userReportData.comment.user.urlAvatar"
+							:src="userReportData.comment.user.urlAvatar"
+							:alt="userReportData.comment.user.name"
+						/>
+						<div
+							v-else
+							class="notes-avatar"
+						></div>
+						<p class="ml-1">
+							{{ userReportData.comment.user.name }}
+						</p>
+					</div>
+				</div>
+
+				<div class="input-container" v-show="!isLocked && !userReportData.comment">
+					<input
+						class="notes-new pl-4 mt-3 mb-3 form-rounded"
+						type="text"
+						placeholder="Escrever anotação"
+						v-model="newReportNote"
+						@change="handleNewReportNoteSubmit"
+						v-on:change="cleatInput()"
+					/>
+					<i
+						@click="handleNewReportNoteSubmit"
+						class="fas fa-paper-plane input-icon"
+					></i>
+				</div>
+			</el-tab-pane>
+
 			<!-- <el-tab-pane :disabled="true">
 				<span class="tab__icon-pane cursor-disabled" slot="label">
 					<img
@@ -201,6 +307,14 @@ export default {
 			if(value.length > 0 && value[0].accepted) {
 				this.isError = false;
 			}
+		},
+		reportFileUpload(value){
+			if(value.length > 0 && value[0].accepted) {
+				this.isError = false;
+			}
+		},
+		archives() {
+			this.getUserFolderData();
 		}
 	},
 	components: {
@@ -212,6 +326,7 @@ export default {
 	data(){
 		return {
 			newNote: '',
+			newReportNote: '',
 			active: this.activeName,
 			hasRemove: null,
 			isError: true,
@@ -225,6 +340,17 @@ export default {
 				dictMaxFilesExceeded: 'Não é permitido mais de um arquivo por vez.',
 				acceptedFiles: 'image/*, application/pdf',
 			},
+			reportFileUpload: [],
+			reportsDropdownzoneOptions: {
+				maxFilesize: 1,
+				dictFileTooBig:'Seu arquivo é poderoso demais (Máximo 5mb).',
+				dictDefaultMessage: 'Clique ou arraste seu arquivo aqui.',
+				dictInvalidFileType: 'Arquivo invalido.',
+				dictMaxFilesExceeded: 'Não é permitido mais de um arquivo por vez.',
+				acceptedFiles: 'image/*, application/pdf',
+			},
+			userReportData: [],
+			hasReportRemove: false,
 			isLocked: !this.companyHasProduct(
 				this.$store.state.loja && this.$store.state.loja.showableProducts && this.$store.state.loja.showableProducts['HISTORICO_USUARIO'] || false
 			),
@@ -235,19 +361,33 @@ export default {
 		userData: Object,
 		notes: Array,
 		activeName: String,
+		userFolderId: String || Number,
 		isNotesActived: {
 			type: Boolean,
 			default: true
 		},
+		isReportsActived: {
+			type: Boolean,
+			default: false
+		},
 	},
 	mounted() {
 		this.companyHistory();
+		this.getUserFolderData();
 	},
 	methods: {
+		handleNewReportNoteSubmit() {
+			this.$emit('new-report-note', this.newReportNote, this.userFolderId, this.userData.id);
+			this.newReportNote = '';
+		},
 		openRemoveSection(item, index) {
 			this.hasRemove = index;
 			this.currentRemoveItem = item;
 		},
+		openReportRemoveSection(item) {
+			this.hasReportRemove = true;
+			this.currentRemoveItem = item;
+		},
 
 		showToast(type, title){
 			const Toast = swal.mixin({
@@ -291,12 +431,33 @@ export default {
 			}
 		},
 
+		saveReport() {
+			if (!this.isError) {
+				this.$emit('save-report', this.reportFileUpload[0], this.userFolderId);
+				this.$refs.Mydropzone.removeAllFiles();
+				this.showToast('success', 'Arquivo enviado com sucesso.');
+
+			} else {
+				if (this.reportFileUpload.length > 0) {
+					this.showToast('error', 'Arquivo invalido.');
+				} else {
+					this.showToast('warning', 'Selecione um arquivo.');
+				}
+			}
+		},
+
 		removeArchive(archive, index){
-			console.log(archive);
 			this.$emit('remove-archive', archive.user_id, archive.id, archive.company_id, index);
 			this.hasRemove = null;
 		},
 
+		removeReportArchive(archive) {
+			this.userReportData.annex = undefined;
+
+			this.$emit('remove-report', archive.id);
+			this.hasReportRemove = false;
+		},
+
 		cleatInput() {
 			this.newNote = '';
 		},
@@ -338,6 +499,28 @@ export default {
 		},
 		sendContact() {
 			this.$emit('open-contact');
+		},
+
+		async getUserFolderData() {
+			const apiUrl = `${process.env.baseApiUrlV2}/company/buffer/folder/user/${this.userFolderId}`;
+
+			const data = await this.$axios(apiUrl)
+				.then(res => res.data)
+				.catch(() => {});
+
+			if (!data) return;
+
+			this.mountUserReport(data.data);
+		},
+
+		mountUserReport(userData) {
+			const annex = userData.annex[0] || undefined;
+			const comment = userData.comments[0] || undefined;
+
+			this.userReportData = {
+				annex,
+				comment
+			};
 		}
 	},
 };
@@ -348,7 +531,7 @@ export default {
 }
 
     .el-tabs__active-bar {
-        width: 34px !important;
+        width: 30px !important;
         height: 4px !important;
         border-radius: 10px 10px 0px 0px;
     }
@@ -440,7 +623,7 @@ export default {
 
 			&:hover{
 				background-color: #f6f9fc;
-    			border-radius: 5px;
+                border-radius: 5px;
 			}
 
 			.archive-img {
@@ -493,15 +676,17 @@ export default {
 
 /deep/ .el-tabs__nav-scroll {
 	display: flex;
-	justify-content: space-around;
+    justify-content: stretch;
+    align-items: flex-start;
 }
 
 /deep/ .el-tabs__item {
-	padding: 0 2.5rem !important;
+	padding: 0 1.60rem !important;
 }
 
 /deep/ .el-tabs__nav {
 	width: 100% !important;
+    user-select: none;
 }
 
 @media (max-width: 1520px) {
@@ -545,6 +730,11 @@ export default {
 
     background: #eff5fd;
     border-radius: 10px 10px 10px 0px;
+
+    &.fullsize {
+        width: 80%!important;
+        min-width: 280px;
+    }
 }
 
 .notes-text {

package/components/burh-ds/Curriculum/UserCurriculum/UserCvRightSideNotAuth.vue

@@ -0,0 +1,377 @@
+<template>
+	<div class="bg-white content-right tabs ">
+		<el-tabs
+			:class="active"
+			class="mt-3 handle-icon-color"
+			v-model="active"
+		>
+			<el-tab-pane name="reports" class="ml-2">
+				<span class="tab__icon-pane" slot="label">
+					<img
+						class="img__icon-pane img__icon--reports"
+						src="../../../../assets/images/icons/icon5.svg"
+					/>
+				</span>
+
+				<p class="notes-title mb-0">Laudo do Candidato</p>
+				<div class="line mb-3"></div>
+
+				<p v-show="!userReportData.annex" class="history-text">
+					Nenhum arquivo vinculado a este usuário.
+				</p>
+
+				<div class="archive-content" v-if="userReportData.annex">
+					<div @click="openArchive(userReportData.annex)" class="archive-container">
+						<div>
+							<img class="archive-img" src="../../../../assets/images/icons/icon6.svg" >
+						</div>
+						<div class="archive-name">
+							<span>{{ userReportData.annex.name }}</span>
+						</div>
+					</div>
+				</div>
+
+				<p class="notes-title mb-0">Comentários Recrutador</p>
+				<div class="line mb-3"></div>
+
+				<p v-show="!userReportData.annex" class="history-text">
+					Nenhum comentário vinculado a este usuário.
+				</p>
+
+				<div v-if="userReportData.comment">
+					<div class="notes-baloon fullsize">
+						<div class="notes-text mx-3 pt-1">
+							<p class="mt-3">{{ userReportData.comment.comment }}</p>
+						</div>
+						<div
+							class="d-flex justify-content-end align-items-center mr-3"
+						>
+							<p class="notes-date">
+								{{ userReportData.comment.created_at | convertDate }}
+							</p>
+						</div>
+					</div>
+					<div class="notes-owner d-flex mt-2">
+						<img
+							v-if="userReportData.comment.user.urlAvatar"
+							:src="userReportData.comment.user.urlAvatar"
+							:alt="userReportData.comment.user.name"
+						/>
+						<div
+							v-else
+							class="notes-avatar"
+						></div>
+						<p class="ml-1">
+							{{ userReportData.comment.user.name }}
+						</p>
+					</div>
+				</div>
+			</el-tab-pane>
+		</el-tabs>
+	</div>
+</template>
+
+<script>
+import { Tabs, TabPane } from 'element-ui';
+
+export default {
+	name: 'user-cv-right-side',
+	filters: {
+		convertDate(data) {
+			if (typeof data !== 'string') {
+				data = '2020-01-01 12:00:00';
+			}
+			let d = new Date(data);
+			let options = { hour: '2-digit', minute: '2-digit' };
+			return d.toLocaleDateString('pt-BR', options);
+		}
+	},
+	components: {
+		[Tabs.name]: Tabs,
+		[TabPane.name]: TabPane,
+	},
+	data(){
+		return {
+			newNote: '',
+			newReportNote: '',
+			active: 'reports',
+			userReportData: [],
+		};
+	},
+	props: {
+		userData: Object,
+		userFolderId: String || Number,
+	},
+	mounted() {
+		this.getUserFolderData();
+	},
+	methods: {
+		async getUserFolderData() {
+			const apiUrl = `${process.env.baseApiUrlV2}/company/buffer/folder/user/${this.userFolderId}`;
+
+			const data = await this.$axios(apiUrl)
+				.then(res => res.data)
+				.catch(() => {});
+
+			if (!data) return;
+
+			this.mountUserReport(data.data);
+		},
+
+		mountUserReport(userData) {
+			console.log(userData);
+
+			const annex = userData.annex[0] || undefined;
+			const comment = userData.comments[0] || undefined;
+
+			this.userReportData = {
+				annex,
+				comment
+			};
+		}
+	},
+};
+</script>
+<style>
+    .el-tabs__nav-wrap::after {
+	background: #fff !important;
+}
+
+    .el-tabs__active-bar {
+        width: 30px !important;
+        height: 4px !important;
+        border-radius: 10px 10px 0px 0px;
+    }
+</style>
+
+<style lang="scss" scoped>
+@import '@burh/nuxt-core/assets/sass/burh-ds/variables/_colors.scss';
+
+/deep/ .el-tab-pane {
+    height: 760px;
+    max-height: 760px;
+    overflow: hidden;
+    overflow-y: auto;
+    position: relative;
+
+    > .notes-title {
+        position: sticky;
+        position: -webkit-sticky;
+        top: 0;
+        background: white;
+        padding: 10px 0;
+    }
+
+    > .input-container {
+        position: sticky;
+        position: -webkit-sticky;
+        bottom: 0;
+        background: white;
+        > .input-icon {
+            cursor: pointer;
+            position: absolute;
+            top: 50%;
+            right: 30px;
+            transform: translateY(-50%);
+            color: #c8c8c8;
+        }
+    }
+
+    &::-webkit-scrollbar {
+        width: 8px;
+    }
+
+    &::-webkit-scrollbar-track {
+        background: #f5f5f5;
+    }
+
+    &::-webkit-scrollbar-thumb {
+        background: #e9e8e8;
+        border-radius: 10px;
+    }
+
+	.archive-content {
+		width: 95%;
+
+		p {
+			margin-bottom: 0;
+			font-size: 0.875rem;
+			padding: .3rem .6rem 0 .6rem;
+		}
+
+		.archive-container {
+			display: flex;
+			align-items: center;
+			padding: 0.5rem 0.5rem 0.438rem;
+			cursor: pointer;
+			user-select: none;
+
+			&:hover{
+				background-color: #f6f9fc;
+                border-radius: 5px;
+			}
+
+			.archive-img {
+				background-color: #f5f5f5;
+				border-radius: 6px;
+				padding: 7px;
+			}
+
+			.archive-name {
+				display: flex;
+				margin-left: .8rem;
+				width: 145%;
+				justify-content: space-between !important;
+
+				.archive-icon {
+					margin-left: 1.5rem;
+				}
+
+				p {
+					margin: 0;
+					padding: 0;
+					width: 13rem;
+					white-space: nowrap;
+					overflow: hidden;
+					text-overflow: ellipsis;
+				}
+			}
+
+			.upload-container {
+				position: sticky;
+				position: -webkit-sticky;
+				bottom: 0;
+				background: white;
+				width: 231px;
+			}
+		}
+	}
+
+	.archive-buttons {
+		display: flex;
+		margin-top: -1rem;
+		width: 95%;
+	}
+
+	.archive-remove {
+		width: 90%;
+		word-break: break-word;
+	}
+}
+
+/deep/ .el-tabs__nav-scroll {
+	display: flex;
+    justify-content: stretch;
+    align-items: flex-start;
+}
+
+/deep/ .el-tabs__item {
+	padding: 0 1.60rem !important;
+}
+
+/deep/ .el-tabs__nav {
+	width: 100% !important;
+    user-select: none;
+}
+
+@media (max-width: 1520px) {
+	/deep/ .el-tabs__item {
+		padding: 0 1.8rem !important;
+	}
+}
+
+.readmore {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-line-clamp: 3;
+    -webkit-box-orient: vertical;
+}
+
+.tab__icon-pane {
+    .img__icon-pane {
+        background-color: #f5f5f5 !important;
+        border-radius: 30%;
+        padding: 7px;
+        margin-bottom: 1rem;
+    }
+}
+
+.content-right {
+    width: 25%;
+}
+
+.notes-title {
+    font-size: 14px;
+    color: #1d364b;
+    font-weight: bold;
+	background-color: white;
+	z-index: 500;
+}
+
+.notes-baloon {
+    width: 231px;
+    height: auto;
+
+    background: #eff5fd;
+    border-radius: 10px 10px 10px 0px;
+
+    &.fullsize {
+        width: 80%!important;
+        min-width: 280px;
+    }
+}
+
+.notes-text {
+    p {
+        font-size: 13px;
+        color: #62778c;
+    }
+}
+
+.notes-date {
+    font-size: 11px;
+    text-align: right;
+
+    color: #8da2b5;
+    top: calc(50% - 17px / 2 - 444.5px);
+}
+
+.notes-owner {
+    img {
+        width: 23px;
+        height: 23px;
+        border-radius: 50%;
+    }
+
+    .notes-avatar {
+        width: 23px;
+        height: 23px;
+        border-radius: 50%;
+        background-color: #adb5bd;
+    }
+
+    p {
+        font-size: 13px;
+        font-weight: 600;
+        text-transform: uppercase;
+
+        color: #62778c;
+    }
+}
+
+.line {
+    width: 221px;
+    height: 0px;
+
+    border: 1px solid #ececec5c;
+}
+
+.history-text {
+    font-size: 13px;
+    color: #62778c;
+}
+.cursor-disabled {
+    cursor: no-drop;
+}
+</style>