@burh/nuxt-core 1.0.90 → 1.0.91

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

@@ -1,232 +1,232 @@
-<template>
-	<modal :show="isModalOpen" v-on:close="closeModal" size="xl" class="modal">
-		<template slot="header">
-			<h2 class="display-4 px-4">
-				Insira os e-mail que deseja enviar o treinamento
-			</h2>
-		</template>
-		<div class="row px-4">
-			<div class="col-4">
-				<label for="name">Nome Completo</label>
-			</div>
-			<div class="col-4">
-				<label for="email">E-mail</label>
-			</div>
-			<div class="col-4">
-				<label for="email">Cargo</label>
-			</div>
-		</div>
-		<validation-observer ref="sendCourse">
-			<div class="row px-4" v-for="(slot, idx) in slots" :key="idx">
-				<validation-provider
-					tag="div"
-					class="col-4"
-					:vid="`send-name-${idx}`"
-					name="Nome"
-					rules="required|regex:\w+\s+\w+"
-					v-slot="{ errors }"
-				>
-					<base-input
-						v-model="slot.name"
-						:error="errors[0]"
-						:valid="errors.length ? true : false"
-					/>
-				</validation-provider>
-
-				<validation-provider
-					tag="div"
-					class="col-4"
-					: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"
-					/>
-				</validation-provider>
-				<div
-					tag="div"
-					class="col-3"
-					name="role"
-				>
-					<el-select
-					class="select-danger"
-					v-model="slot.role"
-					:placeholder="''"
-					>
-						<el-option
-						v-for="role in corporativeRole"
-						:key="role.id"
-						:label="role.name"
-						:value="role.id"
-						>
-						</el-option>
-					</el-select>
-				</div>
-				<div class="col-1">
-					<i
-						v-if="idx !== slots.length - 1"
-						class="fa fa-trash pointer"
-						@click="removeSlot(slot.email)"
-					></i>
-					<i v-else class="fa fa-plus pointer" @click="addSlot"></i>
-				</div>
-			</div>
-		</validation-observer>
-
-		<hr />
-
-		<div class="row px-4">
-			<div class="col-12">
-				<label for="courses">Acesso aos Treinamentos</label>
-				
-			</div>
-		</div>
-		<div class="row px-4">
-			<div class="col-12">
-				<el-select
-					v-model="coursesToSend"
-					multiple
-					style="width: 100%;"
-					placeholder="Treinamentos"
-					name="courses">
-					<el-option
-						v-for="item in courses"
-						:key="item.id"
-						:label="item.name"
-						:value="item.id">
-					</el-option>
-				</el-select>
-			</div>
-		</div>
-        
-		<div class="row">
-			<base-button class="mx-auto" type="primary" @click="sendTest"
-			>Enviar</base-button
-			>
-		</div>
-	</modal>
-</template>
-
-<script>
-import { Select, Option } from 'element-ui';
-
-export default {
-	name: 'send-course',
-	components: {
-		[Select.name]: Select,
-		[Option.name]: Option
-	},
-	props: {
-		isModalOpen: {
-			type: Boolean,
-			default: false
-		},
-		selectedCourse: Number,
-		corporativeRole: null,
-		courses: Array,
-	},
-	methods: {
-		closeModal(e) {
-			this.$emit('closemodal', e);
-		},
-
-		removeSlot(email) {
-			console.log(email, this.slots)
-			this.slots = this.slots.filter(slot => slot.email !== email);
-			console.log(this.slots)
-		},
-
-		addSlot() {
-			const newSlot = {
-				name: '',
-				email: '',
-				role: ''
-			};
-
-			this.slots = [...this.slots, newSlot];
-		},
-
-		async sendTest() {
-			const pass = await this.$refs.sendCourse.validate();
-
-			if (!pass) {
-				return;
-			}
-
-			const filterSlots = slot => slot.email !== '';
-
-			const formatRequest = () => {
-				let formattedCourses = this.coursesToSend.map(course => ({
-					course_id: course
-				}));
-
-				let formattedSlots = this.slots.filter(filterSlots).map(slot => ({
-					name: slot.name.substring(slot.name.indexOf(' '), 0),
-					last_name: slot.name.substring(slot.name.indexOf(' ')+1),
-					email: slot.email,
-					courses: formattedCourses,
-					role_id: slot.role
-				}));
-
-				return {
-					...formattedSlots,
-				};
-			};
-
-			let params = {
-				users: formatRequest()
-			};
-            this.resetSlots();
-			this.$emit('send-course', params);
-        },
-        resetSlots() {
-            this.slots = [
-				{
-					name: '',
-					email: '',
-					role: ''
-				}
-			];
-        }
-	},
-	watch: {
-		selectedCourse(newValue) {
-			this.coursesToSend = newValue ? [newValue] : [];
-		},
-	},
-	data() {
-		return {
-			slots: [
-				{
-					name: '',
-					email: '',
-					role: ''
-				}
-			],
-			coursesToSend: []
-		};
-	},
-};
-</script>
-<style lang="scss" scoped>
-.send-test-modal {
-    position: fixed;
-    overflow-y: scroll;
-    overflow-x: hidden;
-    width: 60%;
-    height: 50%;
-    background-color: #ffffff;
-    z-index: 999 !important;
-    top: 20% !important;
-    left: 20% !important;
-    box-sizing: border-box;
-}
-
-.pointer {
-    cursor: pointer;
-}
-</style>
+<template>
+	<modal :show="isModalOpen" v-on:close="closeModal" size="xl" class="modal">
+		<template slot="header">
+			<h2 class="display-4 px-4">
+				Insira os e-mail que deseja enviar o treinamento
+			</h2>
+		</template>
+		<div class="row px-4">
+			<div class="col-4">
+				<label for="name">Nome Completo</label>
+			</div>
+			<div class="col-4">
+				<label for="email">E-mail</label>
+			</div>
+			<div class="col-4">
+				<label for="email">Cargo</label>
+			</div>
+		</div>
+		<validation-observer ref="sendCourse">
+			<div class="row px-4" v-for="(slot, idx) in slots" :key="idx">
+				<validation-provider
+					tag="div"
+					class="col-4"
+					:vid="`send-name-${idx}`"
+					name="Nome"
+					rules="required|regex:\w+\s+\w+"
+					v-slot="{ errors }"
+				>
+					<base-input
+						v-model="slot.name"
+						:error="errors[0]"
+						:valid="errors.length ? true : false"
+					/>
+				</validation-provider>
+
+				<validation-provider
+					tag="div"
+					class="col-4"
+					: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"
+					/>
+				</validation-provider>
+				<div
+					tag="div"
+					class="col-3"
+					name="role"
+				>
+					<el-select
+					class="select-danger"
+					v-model="slot.role"
+					:placeholder="''"
+					>
+						<el-option
+						v-for="role in corporativeRole"
+						:key="role.id"
+						:label="role.name"
+						:value="role.id"
+						>
+						</el-option>
+					</el-select>
+				</div>
+				<div class="col-1">
+					<i
+						v-if="idx !== slots.length - 1"
+						class="fa fa-trash pointer"
+						@click="removeSlot(slot.email)"
+					></i>
+					<i v-else class="fa fa-plus pointer" @click="addSlot"></i>
+				</div>
+			</div>
+		</validation-observer>
+
+		<hr />
+
+		<div class="row px-4">
+			<div class="col-12">
+				<label for="courses">Acesso aos Treinamentos</label>
+				
+			</div>
+		</div>
+		<div class="row px-4">
+			<div class="col-12">
+				<el-select
+					v-model="coursesToSend"
+					multiple
+					style="width: 100%;"
+					placeholder="Treinamentos"
+					name="courses">
+					<el-option
+						v-for="item in courses"
+						:key="item.id"
+						:label="item.name"
+						:value="item.id">
+					</el-option>
+				</el-select>
+			</div>
+		</div>
+        
+		<div class="row">
+			<base-button class="mx-auto" type="primary" @click="sendTest"
+			>Enviar</base-button
+			>
+		</div>
+	</modal>
+</template>
+
+<script>
+import { Select, Option } from 'element-ui';
+
+export default {
+	name: 'send-course',
+	components: {
+		[Select.name]: Select,
+		[Option.name]: Option
+	},
+	props: {
+		isModalOpen: {
+			type: Boolean,
+			default: false
+		},
+		selectedCourse: Number,
+		corporativeRole: null,
+		courses: Array,
+	},
+	methods: {
+		closeModal(e) {
+			this.$emit('closemodal', e);
+		},
+
+		removeSlot(email) {
+			console.log(email, this.slots)
+			this.slots = this.slots.filter(slot => slot.email !== email);
+			console.log(this.slots)
+		},
+
+		addSlot() {
+			const newSlot = {
+				name: '',
+				email: '',
+				role: ''
+			};
+
+			this.slots = [...this.slots, newSlot];
+		},
+
+		async sendTest() {
+			const pass = await this.$refs.sendCourse.validate();
+
+			if (!pass) {
+				return;
+			}
+
+			const filterSlots = slot => slot.email !== '';
+
+			const formatRequest = () => {
+				let formattedCourses = this.coursesToSend.map(course => ({
+					course_id: course
+				}));
+
+				let formattedSlots = this.slots.filter(filterSlots).map(slot => ({
+					name: slot.name.substring(slot.name.indexOf(' '), 0),
+					last_name: slot.name.substring(slot.name.indexOf(' ')+1),
+					email: slot.email,
+					courses: formattedCourses,
+					role_id: slot.role
+				}));
+
+				return {
+					...formattedSlots,
+				};
+			};
+
+			let params = {
+				users: formatRequest()
+			};
+            this.resetSlots();
+			this.$emit('send-course', params);
+        },
+        resetSlots() {
+            this.slots = [
+				{
+					name: '',
+					email: '',
+					role: ''
+				}
+			];
+        }
+	},
+	watch: {
+		selectedCourse(newValue) {
+			this.coursesToSend = newValue ? [newValue] : [];
+		},
+	},
+	data() {
+		return {
+			slots: [
+				{
+					name: '',
+					email: '',
+					role: ''
+				}
+			],
+			coursesToSend: []
+		};
+	},
+};
+</script>
+<style lang="scss" scoped>
+.send-test-modal {
+    position: fixed;
+    overflow-y: scroll;
+    overflow-x: hidden;
+    width: 60%;
+    height: 50%;
+    background-color: #ffffff;
+    z-index: 999 !important;
+    top: 20% !important;
+    left: 20% !important;
+    box-sizing: border-box;
+}
+
+.pointer {
+    cursor: pointer;
+}
+</style>