Learn more or give us feedback import { Controller } from "stimulus" import Inputmask from 'inputmask'; export default class extends Controller { static targets = ['employees', 'amount', 'fullresult', 'result', 'economy', 'resultContent', 'calculator', 'id', 'emailBtn', 'leadBtn'] connect(){ this.params = ['employees', 'amount', 'fullresult', 'result', 'economy', 'id'] var _component = this this.state = 'valid' var im = new Inputmask('999,99') im.mask(this.amountTarget) this.amountTarget.value = '230,00' this.employeesTarget.value = '10' if (sessionStorage.getItem('simulatorLeadId') != null) { this.idTarget.value = sessionStorage.getItem('simulatorLeadId') } } calculate(){ let amount = parseFloat(this.amountTarget.value) let employees = parseInt(this.employeesTarget.value) if (this.state == 'valid') { let fullResult = (amount * employees).toFixed(2) let result = (fullResult * 0.7).toFixed(2) let economy = (fullResult - result).toFixed(2) this.fullresultTarget.textContent = fullResult.replace(/\./,',') this.resultTarget.textContent = result.replace(/\./,',') this.economyTarget.textContent = economy.replace(/\./,',') this.resultContentTarget.classList.remove('d-none') this.resultContentTarget.classList.add('animated', 'bounceInDown') this.calculatorTarget.classList.add('d-none') } } reset() { this.calculatorTarget.classList.remove('d-none') this.calculatorTarget.classList.add('animated', 'bounceInDown') this.resultContentTarget.classList.add('d-none') this.emailBtnTarget.classList.add('btn-primary') this.emailBtnTarget.classList.remove('btn-success') $(this.emailBtnTarget).html(' Enviar simulação para o meu e-mail.').attr('disabled', false) } validate() { let element = event.target let value = parseInt(element.value) if (value <= 0 || Number.isNaN(value)) { $(element).addClass('is-invalid') $(element).siblings('.invalid-feedback').text('Preencha corretamente o campo') this.state = 'invalid' } else { $(element).removeClass('is-invalid').addClass('is-valid') $(element).siblings('.invalid-feedback').text('') this.state = 'valid' } } sendEmail() { var token = document.getElementsByName('csrf-token')[0].content let values = { } var _component = this $(this.params).each(function(){ values[this] = _component[this+'Target'].value || _component[this+'Target'].textContent }) let url = this.idTarget.dataset.path $.ajax(url, { data: { lead: values }, method: "POST", headers: { "X-CSRF-Token": token }, beforeSend: function(response) { $(_component.emailBtnTarget).attr('disabled', true) }, success: function(response) { _component.emailBtnTarget.classList.remove('btn-primary') _component.emailBtnTarget.classList.add('btn-success') $(_component.emailBtnTarget).html(' ' + response.message).attr('disabled', true) } } ) } leadForm() { let target_top = $('#cotacao').offset().top if (target_top < 0) { target_top = 0 } $('html, body').animate({scrollTop:target_top}, 1500) let $name_field = $('#new_lead').find('input[name="lead[name]"]') let $email_field = $('#new_lead').find('input[name="lead[email]"]') $name_field.val(window.sessionStorage.getItem('simulatorLeadName')) $('#new_lead').find('input[name="lead[email]"]') $email_field.val(window.sessionStorage.getItem('simulatorEmail')) } }