@burh/nuxt-core 1.0.500 → 1.0.502

package/components/burh-ds/Modals/SendTest.vue

@@ -1,362 +1,362 @@
-<template>
-	<modal
-		:show.sync="isModalOpen"
-		:size="'lg'"
-		@close="$emit('close')"
-	>
-		<template>
-			<basics :isLoading="loading" v-if="loading"/>
-			<div class="ml-5 mr-5">
-				<div class="row send send-test mx-0">
-					<h5>Insira o e-mail que deseja enviar o teste</h5>
-				</div>
-				<validation-observer ref="sendTest">
-					<div class="row mt-3 send send-form">
-						<div class="col-6">
-							<span for="vaga" class="form-control-label d-block mb-1">Selecione a vaga
-								<badge
-									rounded
-									size="md"
-									type="primary"
-									class="ml-auto badge-bg-color badge-font">
-									opcional
-								</badge>
-							</span>
-							<el-select
-								filterable
-								clearable
-								no-match-text="Nenhuma vaga encontrada"
-								no-data-text="Nenhuma vaga encontrada"
-								placeholder="Escolha a vaga"
-								id="vaga"
-								v-model="jobid"
-								class="w-100"
-							>
-								<el-option
-									v-for="job in allJobs"
-									class="select-danger"
-									:value="job.id"
-									:label="job.name"
-									:key="job.id"
-								></el-option>
-							</el-select>
-						</div>
-
-						<div class="col-6">
-							<validation-provider
-								tag="div"
-								name="Teste	"
-								rules="required"
-								v-slot="{ errors }"
-							>
-								<span for="teste" class="form-control-label d-block mb-1">Selecione o teste</span>
-								<el-select
-									filterable
-									required
-									clearable
-									no-match-text="Nenhuma teste encontrado"
-									no-data-text="Nenhum teste encontrado"
-									placeholder="Escolha o teste"
-									:class="{'is-invalid': errors[0]}"
-									rules="required"
-									v-model="teste"
-									class="w-100"
-								>
-									<el-option
-										v-for="test in allTests"
-										class="select-danger"
-										:value="test.id"
-										:label="test.name"
-										:key="test.id"
-										:disabled="
-											!categoryIsAllowedToSend(
-												test.category_test_id
-											)
-										"
-									></el-option>
-								</el-select>
-								<div
-									class="invalid-feedback"
-									style="display: block;">
-									{{ errors[0] }}
-								</div>
-							</validation-provider>
-						</div>
-					</div>
-
-					<hr />
-
-					<div
-						class="row mt-3 send send-form"
-						v-for="(slot, idx) in slots"
-						:key="idx"
-					>
-						<div class="col-6">
-							<validation-provider
-								tag="div"
-								:vid="`send-name-${idx}`"
-								name="Nome"
-								rules="required|alpha_spaces|regex:\w+\s+\w+"
-								v-slot="{ errors }"
-							>
-								<base-input
-									v-model="slot.name"
-									:error="errors[0]"
-									:valid="errors.length ? true : false"
-									class="w-100"
-									label="Nome Completo"
-									placeholder="Nome Completo"
-								/>
-							</validation-provider>
-						</div>
-
-						<div class="col-6">
-							<validation-provider
-								tag="div"
-								:vid="`send-email-${idx}`"
-								name="Email"
-								rules="required|email"
-								v-slot="{ errors }"
-							>
-								<base-input
-									v-model="slot.email"
-									:error="errors[0]"
-									:valid="errors.length ? true : false"
-									class="w-100"
-									label="E-mail"
-									placeholder="E-mail"
-								/>
-								<div class="send send-icon">
-									<i
-										v-if="idx !== slots.length - 1"
-										class="fa fa-trash pointer"
-										@click="removeSlot(slot.id)"
-									></i>
-									<i
-										v-else
-										class="fa fa-plus pointer"
-										@click="addSlot"
-									></i>
-								</div>
-							</validation-provider>
-						</div>
-					</div>
-				</validation-observer>
-
-				<div class="col text-right">
-					<base-button
-						class="ml-auto"
-						type="primary"
-						@click="sendTest"
-						:disabled="loading"
-						:class="{'is-loading': loading}"
-					>
-						{{ loading ? 'Enviando' : 'Enviar Teste' }}
-
-					</base-button>
-				</div>
-
-			</div>
-
-			<span class="tool tool-close" @click="closeModal">
-				Fechar
-				<i class="fas fa-times text-white ml-1"/>
-			</span>
-		</template>
-	</modal>
-</template>
-
-<script>
-import Basics from '../Loadings/Basics';
-import { Select, Option } from 'element-ui';
-
-export default {
-	name: 'send-test',
-	components: {
-		[Select.name]: Select,
-		[Option.name]: Option,
-		Basics
-	},
-	props: {
-		hasEnableBadge: Boolean,
-		allTests: Array,
-		allJobs: Array,
-		isModalOpen: {
-			type: Boolean,
-			default: false
-		},
-		selectedTest: {
-			type:Number
-		},
-		categoriesAllowedToSend: {
-			type: Object,
-			default: () => ({})
-		}
-	},
-	methods: {
-		closeModal(e) {
-			this.$emit('closemodal', e);
-		},
-		removeSlot(id) {
-			this.slots = this.slots.filter(slot => slot.id !== id);
-		},
-		addSlot() {
-			const newSlot = {
-				id: new Date().getTime(),
-				name: '',
-				email: '',
-				selected: 8
-			};
-
-			this.slots = [...this.slots, newSlot];
-		},
-		async sendTest() {
-			this.loading = true;
-			const pass = await this.$refs.sendTest.validate();
-			if (!pass) {
-				this.loading = false;
-				return;
-			}
-			const filterSlots = slot => slot.email !== '';
-			const formatRequest = slot => ({
-				...slot,
-				jobid: this.jobid,
-				testid: this.teste
-			});
-			const testRequest = this.slots
-				.filter(filterSlots)
-				.map(formatRequest);
-			setTimeout(() => {
-				this.$emit('send-test', testRequest);
-				this.resetSlots();
-				this.$emit('closemodal');
-				this.loading = false;
-			}, 2000 );
-		},
-		categoryIsAllowedToSend(categoryId) {
-			const categoryIsAllowToSend = Object.values(
-				this.categoriesAllowedToSend
-			).find(id => id == categoryId);
-			return categoryIsAllowToSend ? true : false;
-		},
-		resetSlots(){
-			this.$refs.sendTest && this.$refs.sendTest.reset();
-			this.jobid = '',
-			this.testid = '';
-			this.slots = [
-				{
-					id: 'first',
-					name: '',
-					email: ''
-				}
-			];
-		}
-	},
-	watch: {
-		isModalOpen(newValue) {
-			!newValue && this.closeModal();
-			this.resetSlots();
-		}
-	},
-	computed:{
-		teste:{
-			get(){
-				return !this.testid ? this.selectedTest : this.testid;
-			},
-			set(value){
-				this.testid = value;
-			}
-		}
-	},
-	data() {
-		return {
-			loading: false,
-			jobid: null,
-			testid: this.selectedTest,
-			slots: [
-				{
-					id: 'first',
-					name: '',
-					email: ''
-				}
-			]
-		};
-	},
-};
-</script>
-<style lang="scss" scoped>
-@import '@burh/nuxt-core/assets/sass/burh-ds/variables/_colors.scss';
-
-/deep/ .modal-body {
-	margin: 2rem 0;
-}
-
-/deep/ .mt-2,
-.my-2 {
-    margin-top: 0.7rem !important;
-}
-
-.is-invalid {
-    /deep/ input {
-        border-color: #de214b!important;
-    }
-}
-
-.badge-font {
-    font-size: 10px !important;
-}
-
-.fix-input{
-	margin-top: 4px;
-}
-
-.send {
-    &-test {
-        h5 {
-            font-family: Poppins;
-            font-style: normal;
-            font-weight: 600;
-            font-size: 20px;
-            line-height: 30px;
-            color: #32325d;
-        }
-    }
-
-    &-form {
-        label {
-            font-style: normal;
-            font-weight: normal;
-            font-size: 14px;
-            line-height: 21px;
-
-            color: #525f7f;
-        }
-    }
-
-    &-line {
-        width: 668px;
-        height: 0px;
-
-        border: 1px solid #e9ecef;
-    }
-
-    &-icon {
-        margin-top: 2.5rem;
-        position: absolute;
-        right: -15px;
-        top: 2px;
-    }
-
-    &-button {
-        width: 299px;
-        height: 33px;
-
-        background: #1f8ceb;
-        border-radius: 46px;
-        color: #fff;
-
-        border: none;
-        outline: 0;
-    }
-}
-</style>
+<template>
+	<modal
+		:show.sync="isModalOpen"
+		:size="'lg'"
+		@close="$emit('close')"
+	>
+		<template>
+			<basics :isLoading="loading" v-if="loading"/>
+			<div class="ml-5 mr-5">
+				<div class="row send send-test mx-0">
+					<h5>Insira o e-mail que deseja enviar o teste</h5>
+				</div>
+				<validation-observer ref="sendTest">
+					<div class="row mt-3 send send-form">
+						<div class="col-6">
+							<span for="vaga" class="form-control-label d-block mb-1">Selecione a vaga
+								<badge
+									rounded
+									size="md"
+									type="primary"
+									class="ml-auto badge-bg-color badge-font">
+									opcional
+								</badge>
+							</span>
+							<el-select
+								filterable
+								clearable
+								no-match-text="Nenhuma vaga encontrada"
+								no-data-text="Nenhuma vaga encontrada"
+								placeholder="Escolha a vaga"
+								id="vaga"
+								v-model="jobid"
+								class="w-100"
+							>
+								<el-option
+									v-for="job in allJobs"
+									class="select-danger"
+									:value="job.id"
+									:label="job.name"
+									:key="job.id"
+								></el-option>
+							</el-select>
+						</div>
+
+						<div class="col-6">
+							<validation-provider
+								tag="div"
+								name="Teste	"
+								rules="required"
+								v-slot="{ errors }"
+							>
+								<span for="teste" class="form-control-label d-block mb-1">Selecione o teste</span>
+								<el-select
+									filterable
+									required
+									clearable
+									no-match-text="Nenhuma teste encontrado"
+									no-data-text="Nenhum teste encontrado"
+									placeholder="Escolha o teste"
+									:class="{'is-invalid': errors[0]}"
+									rules="required"
+									v-model="teste"
+									class="w-100"
+								>
+									<el-option
+										v-for="test in allTests"
+										class="select-danger"
+										:value="test.id"
+										:label="test.name"
+										:key="test.id"
+										:disabled="
+											!categoryIsAllowedToSend(
+												test.category_test_id
+											)
+										"
+									></el-option>
+								</el-select>
+								<div
+									class="invalid-feedback"
+									style="display: block;">
+									{{ errors[0] }}
+								</div>
+							</validation-provider>
+						</div>
+					</div>
+
+					<hr />
+
+					<div
+						class="row mt-3 send send-form"
+						v-for="(slot, idx) in slots"
+						:key="idx"
+					>
+						<div class="col-6">
+							<validation-provider
+								tag="div"
+								:vid="`send-name-${idx}`"
+								name="Nome"
+								rules="required|alpha_spaces|regex:\w+\s+\w+"
+								v-slot="{ errors }"
+							>
+								<base-input
+									v-model="slot.name"
+									:error="errors[0]"
+									:valid="errors.length ? true : false"
+									class="w-100"
+									label="Nome Completo"
+									placeholder="Nome Completo"
+								/>
+							</validation-provider>
+						</div>
+
+						<div class="col-6">
+							<validation-provider
+								tag="div"
+								:vid="`send-email-${idx}`"
+								name="Email"
+								rules="required|email"
+								v-slot="{ errors }"
+							>
+								<base-input
+									v-model="slot.email"
+									:error="errors[0]"
+									:valid="errors.length ? true : false"
+									class="w-100"
+									label="E-mail"
+									placeholder="E-mail"
+								/>
+								<div class="send send-icon">
+									<i
+										v-if="idx !== slots.length - 1"
+										class="fa fa-trash pointer"
+										@click="removeSlot(slot.id)"
+									></i>
+									<i
+										v-else
+										class="fa fa-plus pointer"
+										@click="addSlot"
+									></i>
+								</div>
+							</validation-provider>
+						</div>
+					</div>
+				</validation-observer>
+
+				<div class="col text-right">
+					<base-button
+						class="ml-auto"
+						type="primary"
+						@click="sendTest"
+						:disabled="loading"
+						:class="{'is-loading': loading}"
+					>
+						{{ loading ? 'Enviando' : 'Enviar Teste' }}
+
+					</base-button>
+				</div>
+
+			</div>
+
+			<span class="tool tool-close" @click="closeModal">
+				Fechar
+				<i class="fas fa-times text-white ml-1"/>
+			</span>
+		</template>
+	</modal>
+</template>
+
+<script>
+import Basics from '../Loadings/Basics';
+import { Select, Option } from 'element-ui';
+
+export default {
+	name: 'send-test',
+	components: {
+		[Select.name]: Select,
+		[Option.name]: Option,
+		Basics
+	},
+	props: {
+		hasEnableBadge: Boolean,
+		allTests: Array,
+		allJobs: Array,
+		isModalOpen: {
+			type: Boolean,
+			default: false
+		},
+		selectedTest: {
+			type:Number
+		},
+		categoriesAllowedToSend: {
+			type: Object,
+			default: () => ({})
+		}
+	},
+	methods: {
+		closeModal(e) {
+			this.$emit('closemodal', e);
+		},
+		removeSlot(id) {
+			this.slots = this.slots.filter(slot => slot.id !== id);
+		},
+		addSlot() {
+			const newSlot = {
+				id: new Date().getTime(),
+				name: '',
+				email: '',
+				selected: 8
+			};
+
+			this.slots = [...this.slots, newSlot];
+		},
+		async sendTest() {
+			this.loading = true;
+			const pass = await this.$refs.sendTest.validate();
+			if (!pass) {
+				this.loading = false;
+				return;
+			}
+			const filterSlots = slot => slot.email !== '';
+			const formatRequest = slot => ({
+				...slot,
+				jobid: this.jobid,
+				testid: this.teste
+			});
+			const testRequest = this.slots
+				.filter(filterSlots)
+				.map(formatRequest);
+			setTimeout(() => {
+				this.$emit('send-test', testRequest);
+				this.resetSlots();
+				this.$emit('closemodal');
+				this.loading = false;
+			}, 2000 );
+		},
+		categoryIsAllowedToSend(categoryId) {
+			const categoryIsAllowToSend = Object.values(
+				this.categoriesAllowedToSend
+			).find(id => id == categoryId);
+			return categoryIsAllowToSend ? true : false;
+		},
+		resetSlots(){
+			this.$refs.sendTest && this.$refs.sendTest.reset();
+			this.jobid = '',
+			this.testid = '';
+			this.slots = [
+				{
+					id: 'first',
+					name: '',
+					email: ''
+				}
+			];
+		}
+	},
+	watch: {
+		isModalOpen(newValue) {
+			!newValue && this.closeModal();
+			this.resetSlots();
+		}
+	},
+	computed:{
+		teste:{
+			get(){
+				return !this.testid ? this.selectedTest : this.testid;
+			},
+			set(value){
+				this.testid = value;
+			}
+		}
+	},
+	data() {
+		return {
+			loading: false,
+			jobid: null,
+			testid: this.selectedTest,
+			slots: [
+				{
+					id: 'first',
+					name: '',
+					email: ''
+				}
+			]
+		};
+	},
+};
+</script>
+<style lang="scss" scoped>
+@import '@burh/nuxt-core/assets/sass/burh-ds/variables/_colors.scss';
+
+/deep/ .modal-body {
+	margin: 2rem 0;
+}
+
+/deep/ .mt-2,
+.my-2 {
+    margin-top: 0.7rem !important;
+}
+
+.is-invalid {
+    /deep/ input {
+        border-color: #de214b!important;
+    }
+}
+
+.badge-font {
+    font-size: 10px !important;
+}
+
+.fix-input{
+	margin-top: 4px;
+}
+
+.send {
+    &-test {
+        h5 {
+            font-family: Poppins;
+            font-style: normal;
+            font-weight: 600;
+            font-size: 20px;
+            line-height: 30px;
+            color: #32325d;
+        }
+    }
+
+    &-form {
+        label {
+            font-style: normal;
+            font-weight: normal;
+            font-size: 14px;
+            line-height: 21px;
+
+            color: #525f7f;
+        }
+    }
+
+    &-line {
+        width: 668px;
+        height: 0px;
+
+        border: 1px solid #e9ecef;
+    }
+
+    &-icon {
+        margin-top: 2.5rem;
+        position: absolute;
+        right: -15px;
+        top: 2px;
+    }
+
+    &-button {
+        width: 299px;
+        height: 33px;
+
+        background: #1f8ceb;
+        border-radius: 46px;
+        color: #fff;
+
+        border: none;
+        outline: 0;
+    }
+}
+</style>