@burh/nuxt-core 1.0.351 → 1.0.352

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

@@ -1,327 +1,327 @@
-<template>
-	<modal :show.sync="isModalOpen" v-on:close="closeModal" class="modal sms-modal">
-		<template slot="header">
-			<h2 class="display-4 px-4">
-				Enviar SMS
-			</h2>
-		</template>
-		<validation-observer ref="smsModal" tag="div">
-			<div class="px-3">
-				<div>
-					<base-input
-						v-model="receiver"
-						label="Para"
-						v-mask="['(##) ####-####', '(##) #####-####']"
-						placeholder="Adicionar um número de telefone"
-						:class="'w-100'"
-						@change="addNumber(receiver)"
-					/>
-					<div class="row justify-content-start">
-						<badge
-							v-for="(numbers, index) in allNumbers"
-							:key="index"
-							type="primary"
-							class="col-3 mx-3 px-1"
-						>{{ numbers
-						}}<i
-							class="fas fa-times ml-1 cursor-pointer"
-							@click="deleteNumber(index)"
-						></i
-						></badge>
-					</div>
-				</div>
-
-				<div class="mb-4">
-					<div class="d-flex flex-column">
-						<label for="template" class="form-control-label"
-						>Modelo</label
-						>
-						<div class="d-flex align-items-center form-group">
-							<el-select
-								filterable
-								name="template"
-								no-match-text="Nenhum modelo encontrado"
-								no-data-text="Nenhum modelo encontrado"
-								placeholder="Escolha o modelo"
-								:class="'col-9 px-0'"
-								@change="changeMessage(messageTitle)"
-								v-model="messageTitle"
-								:clearable="true"
-							>
-								<el-option
-									v-for="(templates, index) in models"
-									class="select-danger"
-									:value="templates.title"
-									:key="index"
-								></el-option>
-							</el-select>
-
-							<el-tooltip
-								class="item"
-								effect="dark"
-								:content="'Remover Template'"
-								placement="top"
-							>
-								<i
-									v-if="messageTitle"
-									@click="deleteTemplate(messageTitle)"
-									class="fas fa-trash col-3 ml-5"
-									:class="
-										belongsToUser()
-											? 'text-danger cursor-pointer'
-											: ''
-									"
-								></i>
-							</el-tooltip>
-						</div>
-					</div>
-
-					<validation-provider
-						v-if="isModalOpen"
-						tag="div"
-						class="pb-3"
-						name="Texto da mensagem"
-						rules="required"
-						v-slot="{ errors }"
-					>
-						<label for="message" class="form-control-label"
-						>Mensagem</label
-						>
-						<textarea
-							class="form-control"
-							v-model="message"
-							name="message"
-							:class="{ 'is-invalid': errors.length }"
-							placeholder="Mensagem que será enviada"
-						></textarea>
-						<div
-							v-if="errors.length"
-							class="invalid-feedback"
-							style="display: block;"
-						>
-							{{ errors[0] }}
-						</div>
-					</validation-provider>
-
-					<el-checkbox class="mt-4" v-model="saveModel"
-					>Salvar modelo de mensagem</el-checkbox
-					>
-
-					<validation-provider
-						tag="div"
-						v-if="saveModel"
-						:class="'d-flex align-items-center'"
-						name="Titulo para o modelo"
-						rules="required"
-						v-slot="{ errors }"
-					>
-						<base-input
-							v-model="modelName"
-							placeholder="Titulo para o modelo"
-							:class="'mt-4 col-9 px-0'"
-							:error="errors[0]"
-							:valid="errors.length ? true : false"
-						/>
-
-						<i
-							class="text-primary fas fa-save cursor-pointer col-3 ml-5"
-							@click="saveTemplate()"
-						></i>
-					</validation-provider>
-				</div>
-				<div class="d-flex">
-					<base-button
-						size="md"
-						type="primary"
-						role="button"
-						@click="sendSms()"
-						class="ml-auto"
-					>Enviar
-					</base-button>
-				</div>
-			</div>
-		</validation-observer>
-	</modal>
-</template>
-
-<script>
-import { Select, Option, Checkbox, Tooltip, Button } from 'element-ui';
-import { mask } from 'vue-the-mask';
-import swal from 'sweetalert2';
-import { isConsole } from 'mobile-device-detect';
-import BaseInput from '../../argon-core/Inputs/BaseInput.vue';
-export default {
-	directives: { mask },
-	name: 'send-sms',
-	components: {
-		[Select.name]: Select,
-		[Option.name]: Option,
-		[Checkbox.name]: Checkbox,
-		[Tooltip.name]: Tooltip
-	},
-	computed: {
-		isModalOpen: {
-			get() {
-				return this.show;
-			},
-			set(show) {
-				this.$emit('input', show);
-			}
-		}
-	},
-	props: {
-		show: {
-			type: Boolean,
-			default: false
-		},
-		templates: null
-	},
-	model: {
-		prop: 'show'
-	},
-	watch: {
-		templates(newValue) {
-			this.models = newValue;
-		},
-		isModalOpen(newValue) {
-			if (!newValue) {
-				this.templates = null;
-				this.models = this.templates;
-				this.messageTitle = null;
-				this.receiver = null;
-				this.message = '';
-				this.saveModel = false;
-				this.modelName = null;
-				this.allNumbers = [];
-			}
-		}
-
-	},
-	data() {
-		return {
-			models: this.templates,
-			messageTitle: null,
-			receiver: null,
-			message: '',
-			saveModel: false,
-			modelName: null,
-			allNumbers: []
-		};
-	},
-	methods: {
-		closeModal() {
-			this.$emit('close-modal');
-		},
-		async sendSms() {
-			const pass = await this.$refs.smsModal.validate();
-			if (!pass) {
-				const Toast = swal.mixin({
-					toast: true,
-					position: 'top-end',
-					showConfirmButton: false,
-					timer: 3000
-				});
-
-				Toast.fire({
-					type: 'warning',
-					text: 'Preecha todos os campos corretamente'
-				});
-				return;
-			}
-			if (this.allNumbers.length == 0) {
-				const Toast = swal.mixin({
-					toast: true,
-					position: 'top-end',
-					showConfirmButton: false,
-					timer: 3000
-				});
-
-				Toast.fire({
-					type: 'warning',
-					title: 'Adicione pelo menos um número de telefone para continuar'
-				});
-				return;
-			} else {
-				swal.fire({
-					title: 'Tem certeza?',
-					text: 'Quer mesmo enviar sms para esses números?',
-					icon: 'warning',
-
-					buttonsStyling: false,
-					confirmButtonText: 'Enviar',
-					confirmButtonClass: 'btn btn-primary btn-fill btn-swal-sms',
-					showCancelButton: true,
-					cancelButtonText: 'Cancelar',
-					cancelButtonClass: 'btn btn-outline-default btn-fill',
-					reverseButtons: true,
-				}).then((result) => {
-					if(result.value) {
-						this.$emit('send-sms', this.allNumbers, this.message);
-					} else {
-						swal.close();
-					}
-				});
-			}
-		},
-		saveTemplate() {
-			if (this.saveModel) {
-				this.$emit('save-model', this.modelName, this.message);
-			}
-		},
-		addNumber(number) {
-			if(this.receiver.length < 14){
-				return;
-			}
-
-			this.allNumbers.push(number);
-			this.receiver = '';
-		},
-		
-		deleteNumber(index) {
-			this.allNumbers.splice(index, 1);
-		},
-		changeMessage(messageName) {
-			let message = this.models.find(data => data.title == messageName);
-			this.message = message ? message.message : '';
-		},
-		deleteTemplate(messageName) {
-			let template = this.models.find(data => data.title == messageName);
-			this.$emit('remove-template', template);
-		},
-		belongsToUser() {
-			let template = this.models.find(
-				data => data.title == this.messageTitle
-			);
-
-			if (!template) {
-				this.messageTitle = null;
-				return false;
-			}
-
-			return (
-				parseInt(this.$store.state.user.currentUser.id) ==
-                template.user_id
-			);
-		}
-	},
-
-};
-</script>
-<style lang="scss">
-.btn-swal-sms{
-	background-color:#FFCF02 !important;
-    border-color: #FFCF02 !important;
-}
-</style>
-<style lang="scss" scoped>
-.badge {
-    margin-bottom: 1.5rem;
-}
-.sms-modal {
-    padding: 1.5rem !important;
-}
-
-.top .el-tooltip__popper {
-    padding: 8px 10px;
-}
-</style>
+<template>
+	<modal :show.sync="isModalOpen" v-on:close="closeModal" class="modal sms-modal">
+		<template slot="header">
+			<h2 class="display-4 px-4">
+				Enviar SMS
+			</h2>
+		</template>
+		<validation-observer ref="smsModal" tag="div">
+			<div class="px-3">
+				<div>
+					<base-input
+						v-model="receiver"
+						label="Para"
+						v-mask="['(##) ####-####', '(##) #####-####']"
+						placeholder="Adicionar um número de telefone"
+						:class="'w-100'"
+						@change="addNumber(receiver)"
+					/>
+					<div class="row justify-content-start">
+						<badge
+							v-for="(numbers, index) in allNumbers"
+							:key="index"
+							type="primary"
+							class="col-3 mx-3 px-1"
+						>{{ numbers
+						}}<i
+							class="fas fa-times ml-1 cursor-pointer"
+							@click="deleteNumber(index)"
+						></i
+						></badge>
+					</div>
+				</div>
+
+				<div class="mb-4">
+					<div class="d-flex flex-column">
+						<label for="template" class="form-control-label"
+						>Modelo</label
+						>
+						<div class="d-flex align-items-center form-group">
+							<el-select
+								filterable
+								name="template"
+								no-match-text="Nenhum modelo encontrado"
+								no-data-text="Nenhum modelo encontrado"
+								placeholder="Escolha o modelo"
+								:class="'col-9 px-0'"
+								@change="changeMessage(messageTitle)"
+								v-model="messageTitle"
+								:clearable="true"
+							>
+								<el-option
+									v-for="(templates, index) in models"
+									class="select-danger"
+									:value="templates.title"
+									:key="index"
+								></el-option>
+							</el-select>
+
+							<el-tooltip
+								class="item"
+								effect="dark"
+								:content="'Remover Template'"
+								placement="top"
+							>
+								<i
+									v-if="messageTitle"
+									@click="deleteTemplate(messageTitle)"
+									class="fas fa-trash col-3 ml-5"
+									:class="
+										belongsToUser()
+											? 'text-danger cursor-pointer'
+											: ''
+									"
+								></i>
+							</el-tooltip>
+						</div>
+					</div>
+
+					<validation-provider
+						v-if="isModalOpen"
+						tag="div"
+						class="pb-3"
+						name="Texto da mensagem"
+						rules="required"
+						v-slot="{ errors }"
+					>
+						<label for="message" class="form-control-label"
+						>Mensagem</label
+						>
+						<textarea
+							class="form-control"
+							v-model="message"
+							name="message"
+							:class="{ 'is-invalid': errors.length }"
+							placeholder="Mensagem que será enviada"
+						></textarea>
+						<div
+							v-if="errors.length"
+							class="invalid-feedback"
+							style="display: block;"
+						>
+							{{ errors[0] }}
+						</div>
+					</validation-provider>
+
+					<el-checkbox class="mt-4" v-model="saveModel"
+					>Salvar modelo de mensagem</el-checkbox
+					>
+
+					<validation-provider
+						tag="div"
+						v-if="saveModel"
+						:class="'d-flex align-items-center'"
+						name="Titulo para o modelo"
+						rules="required"
+						v-slot="{ errors }"
+					>
+						<base-input
+							v-model="modelName"
+							placeholder="Titulo para o modelo"
+							:class="'mt-4 col-9 px-0'"
+							:error="errors[0]"
+							:valid="errors.length ? true : false"
+						/>
+
+						<i
+							class="text-primary fas fa-save cursor-pointer col-3 ml-5"
+							@click="saveTemplate()"
+						></i>
+					</validation-provider>
+				</div>
+				<div class="d-flex">
+					<base-button
+						size="md"
+						type="primary"
+						role="button"
+						@click="sendSms()"
+						class="ml-auto"
+					>Enviar
+					</base-button>
+				</div>
+			</div>
+		</validation-observer>
+	</modal>
+</template>
+
+<script>
+import { Select, Option, Checkbox, Tooltip, Button } from 'element-ui';
+import { mask } from 'vue-the-mask';
+import swal from 'sweetalert2';
+import { isConsole } from 'mobile-device-detect';
+import BaseInput from '../../argon-core/Inputs/BaseInput.vue';
+export default {
+	directives: { mask },
+	name: 'send-sms',
+	components: {
+		[Select.name]: Select,
+		[Option.name]: Option,
+		[Checkbox.name]: Checkbox,
+		[Tooltip.name]: Tooltip
+	},
+	computed: {
+		isModalOpen: {
+			get() {
+				return this.show;
+			},
+			set(show) {
+				this.$emit('input', show);
+			}
+		}
+	},
+	props: {
+		show: {
+			type: Boolean,
+			default: false
+		},
+		templates: null
+	},
+	model: {
+		prop: 'show'
+	},
+	watch: {
+		templates(newValue) {
+			this.models = newValue;
+		},
+		isModalOpen(newValue) {
+			if (!newValue) {
+				this.templates = null;
+				this.models = this.templates;
+				this.messageTitle = null;
+				this.receiver = null;
+				this.message = '';
+				this.saveModel = false;
+				this.modelName = null;
+				this.allNumbers = [];
+			}
+		}
+
+	},
+	data() {
+		return {
+			models: this.templates,
+			messageTitle: null,
+			receiver: null,
+			message: '',
+			saveModel: false,
+			modelName: null,
+			allNumbers: []
+		};
+	},
+	methods: {
+		closeModal() {
+			this.$emit('close-modal');
+		},
+		async sendSms() {
+			const pass = await this.$refs.smsModal.validate();
+			if (!pass) {
+				const Toast = swal.mixin({
+					toast: true,
+					position: 'top-end',
+					showConfirmButton: false,
+					timer: 3000
+				});
+
+				Toast.fire({
+					type: 'warning',
+					text: 'Preecha todos os campos corretamente'
+				});
+				return;
+			}
+			if (this.allNumbers.length == 0) {
+				const Toast = swal.mixin({
+					toast: true,
+					position: 'top-end',
+					showConfirmButton: false,
+					timer: 3000
+				});
+
+				Toast.fire({
+					type: 'warning',
+					title: 'Adicione pelo menos um número de telefone para continuar'
+				});
+				return;
+			} else {
+				swal.fire({
+					title: 'Tem certeza?',
+					text: 'Quer mesmo enviar sms para esses números?',
+					icon: 'warning',
+
+					buttonsStyling: false,
+					confirmButtonText: 'Enviar',
+					confirmButtonClass: 'btn btn-primary btn-fill btn-swal-sms',
+					showCancelButton: true,
+					cancelButtonText: 'Cancelar',
+					cancelButtonClass: 'btn btn-outline-default btn-fill',
+					reverseButtons: true,
+				}).then((result) => {
+					if(result.value) {
+						this.$emit('send-sms', this.allNumbers, this.message);
+					} else {
+						swal.close();
+					}
+				});
+			}
+		},
+		saveTemplate() {
+			if (this.saveModel) {
+				this.$emit('save-model', this.modelName, this.message);
+			}
+		},
+		addNumber(number) {
+			if(this.receiver.length < 14){
+				return;
+			}
+
+			this.allNumbers.push(number);
+			this.receiver = '';
+		},
+		
+		deleteNumber(index) {
+			this.allNumbers.splice(index, 1);
+		},
+		changeMessage(messageName) {
+			let message = this.models.find(data => data.title == messageName);
+			this.message = message ? message.message : '';
+		},
+		deleteTemplate(messageName) {
+			let template = this.models.find(data => data.title == messageName);
+			this.$emit('remove-template', template);
+		},
+		belongsToUser() {
+			let template = this.models.find(
+				data => data.title == this.messageTitle
+			);
+
+			if (!template) {
+				this.messageTitle = null;
+				return false;
+			}
+
+			return (
+				parseInt(this.$store.state.user.currentUser.id) ==
+                template.user_id
+			);
+		}
+	},
+
+};
+</script>
+<style lang="scss">
+.btn-swal-sms{
+	background-color:#FFCF02 !important;
+    border-color: #FFCF02 !important;
+}
+</style>
+<style lang="scss" scoped>
+.badge {
+    margin-bottom: 1.5rem;
+}
+.sms-modal {
+    padding: 1.5rem !important;
+}
+
+.top .el-tooltip__popper {
+    padding: 8px 10px;
+}
+</style>