Файловый менеджер - Редактировать - D:/Inetpub/vhosts/itgrupoeuromotors.com/httpdocs/AUDI/LibroDeReclamos.html
Назад
<!DOCTYPE html> <html> <head> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous"> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script> <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script> <link rel="stylesheet" type="text/css" href="jquery.datetimepicker.min.css"> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous"> <script src="https://cdn.jsdelivr.net/npm/signature_pad@4.1.7/dist/signature_pad.umd.min.js"></script> <meta lang="es"> <meta charset="utf-8"> <meta https-equiv=”Content-Type” content=”text/html; charset=UTF-8″ /> <meta https-equiv=”Content-Type” content=”text/html; charset=ISO-8859-1″ /> <title>Audi Perú</title> <link rel="shortcut icon" href="http://landing.contactoaudi.com.pe/postventa/bateria/imagenes/pinfavicon.svg" type="image/x-icon" /> <!-- Invocar Recursos de Ajax --> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script> <script type="text/javascript"> document.addEventListener("DOMContentLoaded", function () { document.getElementById("contactoaudi_postventa_240720").addEventListener("submit", function (e) { e.preventDefault(); e.stopPropagation(); let btnEnviar = document.getElementById("btn-enviar"); btnEnviar.disabled = true; btnEnviar.innerHTML = "... Enviando"; console.log('API CRM'); // Capturar valores del formulario let formData = new FormData(this); let result = {}; formData.forEach((value, key) => { result[key] = value; }); let urlGracias = "https://sistemas.euromotors.com.pe/Euromotors/Formularios/repuestos/TYPGracias.html"; urlGracias = urlGracias + "?nombre=" + result.clienteNombre + "&apellido=" + result.clienteApellidoPaterno; // Crear JSON con los datos let data_json = { 'cliente_name': result.clienteNombre, 'cliente_lastName': result.clienteApellidoPaterno, 'cliente_secondSurname': result.clienteApellidoMaterno, 'cliente_address': result.clienteDomicilio, 'cliente_identificationType': result.clienteTipoDoc, 'cliente_identificationNumber': result.clienteNumDoc, 'cliente_phone': "+51" + result.clienteTelefono, 'cliente_email': result.clienteCorreo, 'sr_underAge': result.clienteMenorEdad, 'cliente_district': result.clienteCiudad, 'sr_plateNumber': result.clientePlaca, 'sr_representativeName': result.apoderadoNombre, 'sr_representativeLastName': result.apoderadoApellidos, 'sr_representativePhone': result.apoderadoTelefono, 'sr_representativeEmail': result.apoderadoCorreo, 'sr_contractedAssetType': result.bienTipo, 'sr_currencyCode': result.bienTipoMoneda, 'sr_amount': result.bienMonto, 'sr_description': result.bienDescripcion, 'sr_detalleReclamacion': result.reclamoTipo, 'sr_consumerRequest': result.reclamoPedido, 'sr_firma': result.clienteFirma, 'sr_company': "EUROMOTORS", 'cliente_customerType': "ZCA_CUSTOMER", 'cliente_country': "PE", "sr_channelCode": "CUS_SVC_INTEGR", "sr_categoryCode": "GESTION_DE_RECLAMOS_ES_", "sr_brand": "AUDI" }; console.log("Enviando datos:", data_json); axios.post("https://leadapi.itgrupoeuromotors.com/api/v1/OracleCRM/ServiceRequest/RegistrarSR", data_json, { headers: { "Content-Type": "application/json", "Accept": "application/json" } } ) .then(function (response) { console.log("Envío exitoso:", response.data); window.location.href = urlGracias; }) .catch(function (error) { console.error("Error en el envío:", error); window.location.href = "https://sistemas.euromotors.com.pe/Euromotors/Formularios/repuestos/TYPGracias.html"; }); }); }); </script> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous"> <style type="text/css"> body { color: #E1DBDB; background-color: #000; font-size: 13px; } hr { border: 0.4px solid #0a2257; margin-bottom: 5px; } .button { background: 0 0; font: inherit; line-height: normal; overflow: visible; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; outline: 0; border-radius: 0; text-decoration: none; border: 1px solid #fff; color: #E1DBDB; cursor: pointer; padding: 15px; cursor: pointer; } .is-disabled { opacity: .5; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=50); } .button--next { font-size: 1em; max-width: 200px; padding: 12px; width: 100%; } .button--next { font-size: 12px; } .button--center { font-weight: 600; text-align: center; } button:hover { background-color: #DBDDE2; cursor: pointer; color: #000; } .full-height { height: 100vh; /* Asegura que la imagen ocupe toda la altura de la pantalla */ object-fit: cover; /* Mantiene la relación de aspecto y cubre el área del contenedor */ width: 100%; /* La imagen ocupa todo el ancho */ } .fondo-fijo { position: fixed; top: 0; left: 0; width: 50%; height: 100vh; background-image: url('https://sistemas.euromotors.com.pe/Audi/imagenfondoreclamosaudi.jpg'); background-size: cover; background-position: center; } .formulario-scroll { position: absolute; right: 0; width: 50%; height: 100vh; overflow-y: auto; padding: 20px; background-color: black; } </style> </head> <script type="text/javascript"> var i = 1; var l = 0; var urlGracias = 'https://sistemas.euromotors.com.pe/Euromotors/Formularios/repuestos/TYPGracias.html?nombre='; </script> <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script> <body> <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment-with-locales.min.js"></script> <script src="jquery.datetimepicker.full.min.js"></script> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <div class="container-fluid" style="background-color: #000;"> <form id="contactoaudi_postventa_240720" name="contactoaudi_postventa_240720" target=""> <div class="form-row"> <div class="fondo-fijo"></div> <div class="formulario-scroll"> <div class="form-row"> <div class="form-group col-md-12" style="text-align:center;"> <img src="https://sistemas.euromotors.com.pe/Audi/AudiLogoreclamo.png" alt="Audi Logo" style="width:150px;height:auto;display:block;margin:15px auto;"> <label style="font-family:Helvetica Neue,Arial,Noto Sans,sans-serif;font-size:26px;line-height:1em;color:#fff;display:block;margin-top:2px;"> Libro De Reclamaciones </label> <div style="background-color:#636161;padding:0.5rem;border-radius:5px;padding-left:1rem;"> <p style="margin:2px 0;">RAZÓN SOCIAL: EURO MOTORS S.A.</p> <p style="margin:2px 0;">RUC: 20168544252</p> <p style="margin:2px 0;">DIRECCIÓN: Av. Domingo Orue Nro. 973</p> <p id="euroDate" style="margin:2px 0;"></p> </div> </div> </div> <div> <h6>1. IDENTIFICACIÓN DEL CONSUMIDOR RECLAMANTE</h2> <div class="form-row"> <div class="form-group col-md-4"> <label for="clienteNombre">Nombre: </label> <input style="font-size: 12px; height: 28px;" name="clienteNombre" type="text" class="form-control inputFormu" id="clienteNombre" required> </div> <div class="form-group col-md-4"> <label for="clienteApellidoPaterno">Apellido Paterno: </label> <input style="font-size: 12px; height: 28px;" name="clienteApellidoPaterno" type="text" class="form-control inputFormu" id="clienteApellidoPaterno" required> </div> <div class="form-group col-md-4"> <label for="clienteApellidoMaterno">Apellido Materno: </label> <input style="font-size: 12px; height: 28px;" name="clienteApellidoMaterno" type="text" class="form-control inputFormu" id="clienteApellidoMaterno" required> </div> </div> <div class="form-row"> <div class="form-group col-md-4"> <label for="clienteDomicilio">Domicilio: </label> <input style="font-size: 12px; height: 28px;" name="clienteDomicilio" type="text" class="form-control inputFormu" id="clienteDomicilio" required> </div> <div class="form-group col-md-4"> <label for="clienteTipoDoc">Tipo de Documento: </label> <select class="form-control" id="clienteTipoDoc" style="font-size: 12px; height: 30px;" name="clienteTipoDoc"> <option value="01">DNI</option> <option value="07">Pasaporte</option> <option value="04">C.E</option> </select> </div> <div class="form-group col-md-4"> <label for="clienteNumDoc">N. de Documento: </label> <input style="font-size: 12px; height: 28px;" name="clienteNumDoc" type="number" class="form-control inputFormu" id="clienteNumDoc" required> </div> </div> <div class="form-row"> <div class="form-group col-md-4"> <label for="clienteTelefono">Teléfono: </label> <input style="font-size: 12px; height: 28px;" name="clienteTelefono" type="text" class="form-control inputFormu" id="clienteTelefono" required> </div> <div class="form-group col-md-4"> <label for="clienteCorreo">Correo electrónico: </label> <input style="font-size: 12px; height: 28px;" name="clienteCorreo" type="email" class="form-control inputFormu" id="clienteCorreo" required> </div> <div class="form-group col-md-4"> <label for="clienteMenorEdad">¿Es menor de edad?: </label> <select class="form-control" id="clienteMenorEdad" style="font-size: 12px; height: 30px; " onchange="onSelectChange()" name="clienteMenorEdad"> <option value="" selected disabled>Seleccione una opción</option> <option value="Sí">SI</option> <option value="No">NO</option> </select> </div> </div> <div> <div id="datosApoderado"> </div> </div> <div class="form-row"> <div class="form-group col-md-4"> <label for="clienteCiudad">Ciudad: </label> <input style="font-size: 12px; height: 28px;" name="clienteCiudad" type="text" class="form-control inputFormu" id="clienteCiudad" required> </div> <div class="form-group col-md-4"> <label for="clientePlaca">Placa: </label> <input style="font-size: 12px; height: 28px;" name="clientePlaca" type="text" class="form-control inputFormu" id="clientePlaca" required> </div> <div class="form-group col-md-4"> <label for="clienteMotivosReclamo">Motivos de reclamo: </label> <select class="form-control" id="clienteMotivosReclamo" style="font-size: 12px; height: 30px;" name="TipoDocumento"> <option value="" selected disabled>Seleccione una opción</option> <option value="Venta">Venta de vehiculos</option> <option value="PostVenta">Venta de Repuestos</option> <option value="Repuestos">Servicio tecnico</option> </select> </div> <hr style="border: 1px solid #ccc; width: 100%;"> </div> <br> <h6>2. IDENTIFICACIÓN DEL BIEN CONTRATADO</h6> <div class="form-row"> <div class="form-group col-md-4"> <label for="bienTipo">Tipo de Bien Contratado: </label> <select class="form-control" id="bienTipo" style="font-size: 12px; height: 30px;" name="bienTipo"> <option value="" selected disabled>Seleccione una opción</option> <option value="Producto">Producto</option> <option value="Servicio">Servicio</option> </select> </div> <div class="form-group col-md-4"> <label for="bienTipoMoneda">Tipo de Moneda: </label> <select class="form-control" id="bienTipoMoneda" style="font-size: 12px; height: 30px;" name="bienTipoMoneda"> <option value="" selected disabled>Seleccione una opción</option> <option value="Soles">Soles</option> <option value="Dolares">Dolares</option> </select> </div> <div class="form-group col-md-4"> <label for="bienMonto">Monto: </label> <input style="font-size: 12px; height: 28px;" name="bienMonto" type="text" class="form-control inputFormu" id="bienMonto" required> </div> </div> <div class="form-row"> <div class="form-group col-md-12"> <label for="bienDescripcion">Descripción:</label> <textarea name="bienDescripcion" id="bienDescripcion" class="form-control" style="font-size: 12px; height: 50px;width: 100%;"></textarea> </div> </div> <hr style="border: 1px solid #ccc; width: 100%;"> <br> <h6>3. DETALLE DE LA RECLAMACIÓN Y PEDIDO DEL CONSUMIDOR</h6> <br> <div class="form-row"> <div class="form-group col-md-4"> <label for="reclamoTipo">Tipo: </label> <select class="form-control" id="reclamoTipo" style="font-size: 12px; height: 30px;" name="reclamoTipo"> <option value="" selected disabled>Seleccione una opción</option> <option value="Reclamo">Reclamo</option> <option value="Queja">Queja</option> </select> </div> <div class="form-group col-md-8" style="border: solid 1px #ccc;border-radius: 5px;"> <div> <strong>Reclamo:</strong> Disconformidad relacionada a los productos o servicios <br> <strong>Queja:</strong> Disconformidad no relacionada a los productos o servicios o malestar o descontento respecto a la atención al público. </div> </div> </div> <div class="form-row"> <div class="form-group col-md-12"> <label for="reclamoDetalle">Detalle:</label> <textarea name="reclamoDetalle" id="reclamoDetalle" class="form-control" style="font-size: 12px; height: 50px;width: 100%;"></textarea> </div> </div> <div class="form-row"> <div class="form-group col-md-12"> <label for="reclamoPedido">Pedido:</label> <textarea name="reclamoPedido" id="reclamoPedido" class="form-control" style="font-size: 12px; height: 50px;width: 100%;"></textarea> </div> </div> <div class="form-row"> <div class="form-group col-md-12"> <label for="clienteFirmaValue">Firma del Consumidor:</label> <div id="clienteFirma" class="border" style="width: 200px; height: 66px; background-size: cover; background-position: center; background-repeat: no-repeat;background-color: white;" onclick="onOpenModal()"> <input type="hidden" id="clienteFirmaValue" name="clienteFirmaValue" value="" required /> </div> </div> </div> <div class="modal" id="signatureModal" tabindex="-1"> <div class="modal-dialog" style="min-width: 650px;"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title">Firma de consumidor</h5> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> </div> <div class="modal-body"> <canvas width="600" height="200" class="border" style="touch-action: none; user-select: none;"></canvas> </div> <div class="modal-footer"> <button type="button" class="btn btn-secondary" onclick="onClearCanvas()">Limpiar</button> <button type="button" class="btn btn-primary" onclick="onSaveSignature()">Guardar</button> </div> </div> </div> </div> <hr style="border: 1px solid #ccc; width: 100%;"> <br> <h6>4. OBSERVACIONES Y ACCIONES ADOPTADAS POR EL PROVEEDOR</h6> <br> <div class="form-row"> <div class="form-group col-md-12"> <label for="bienDescripcion">Fecha de comunicación de la respuesta:</label> <input type="date" class="form-control" id="bienDescripcion" required disabled> </div> <div class="form-group col-md-12"> <textarea name="reclamoDetalle" id="reclamoDetalle" class="form-control" style="font-size: 12px; height: 50px;width: 100%;" disabled></textarea> </div> </div> <div class="form-row"> <div class="form-group col-md-12" align="center"> <button id="btn-enviar" type="submit" data-toggle="modal" data-target="#exampleModal" class="button button--center button--next is-disabled"> <span style="font-size: 15px;">Enviar Reclamo</span> </button> </div> </div> </div> <footer class="u-clearfix u-footer u-grey-80" id="sec-1c24" style="padding-bottom: 2rem; background-color: #333; text-align: center;justify-content: center;display: flex;"> <div class="u-clearfix u-sheet u-sheet-1"> <p class="u-text u-text-default u-text-1" style="color: white;">©2024 Euromotors </p> <!-- <a href="http://127.0.0.1:3000/libro-de-reclamaciones.html"> <img src="images/reclamaciones.jpg" class="u-logo-image u-logo-image-1" width="200" /> </a> --> </div> </footer> </div> </form> </div> <!--hora y fecha actual--> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script> <script> var currentDateTime = new Date(); var currentDay = currentDateTime.getDate(); var currentYear = currentDateTime.getFullYear(); euroDate.innerHTML = `FECHA: ${currentDateTime.toLocaleString('es-ES', { weekday: 'long' })}, ${currentDay} de ${currentDateTime.toLocaleString('es-ES', { month: 'long' })} del ${currentYear}`; </script> <script> // Instanciamos SignaturePad solo una vez let signaturePad; // Función que maneja el cambio de selección en el dropdown function onSelectChange() { var menorEdad = document.getElementById('clienteMenorEdad').value; var datosApoderado = document.getElementById('datosApoderado'); var datosApoderadoHTML = ` <p style="text-align: justify" class="mb-0"> <span style="font-size: 1rem">DATOS DEL APODERADO [EN CASO SEA MENOR DE EDAD]</span> </p> <div class="form-row"> <div class="form-group col-md-4"> <label for="apoderadoNombre" class="form-label">Nombre</label> <input style="font-size: 12px; height: 28px;" name="apoderadoNombre" type="text" class="form-control inputFormu" id="apoderadoNombre" required> </div> <div class="form-group col-md-4"> <label for="apoderadoApellidos" class="form-label">Apellidos</label> <input style="font-size: 12px; height: 28px;" name="apoderadoApellidos" type="text" class="form-control inputFormu" id="apoderadoApellidos" required> </div> <div class="form-group col-md-4"> <label for="apoderadoTipoDoc" class="form-label">Tipo de Documento</label> <select class="form-control" id="apoderadoTipoDoc" style="font-size: 12px; height: 30px;" name="TipoDocumento"> <option value="" selected disabled>Seleccione una opción</option> <option value="DNI">DNI</option> <option value="Pasaporte">PASAPORTE</option> <option value="C.E">C.E</option> </select> </div> </div> <div class="form-row"> <div class="form-group col-md-4"> <label for="apoderadoNumDoc">N. de Documento:</label> <input style="font-size: 12px; height: 28px;" name="apoderadoNumDoc" type="number" class="form-control inputFormu" id="apoderadoNumDoc" required> </div> <div class="form-group col-md-4"> <label for="apoderadoTelefono">Teléfono:</label> <input style="font-size: 12px; height: 28px;" name="apoderadoTelefono" type="text" class="form-control inputFormu" id="apoderadoTelefono" required> </div> <div class="form-group col-md-4"> <label for="apoderadoCorreo">Correo electrónico:</label> <input style="font-size: 12px; height: 28px;" name="apoderadoCorreo" type="email" class="form-control inputFormu" id="apoderadoCorreo" required> </div> </div> `; if (menorEdad === 'Sí') { datosApoderado.innerHTML = datosApoderadoHTML; } else { datosApoderado.innerHTML = ''; } } // Función para iniciar el canvas con SignaturePad function initializeSignaturePad() { const canvas = document.querySelector("canvas"); signaturePad = new SignaturePad(canvas); } // Llamamos a la función solo cuando se carga la página window.onload = initializeSignaturePad; // Función para limpiar el canvas function onClearCanvas() { signaturePad.clear(); } // Función para abrir el modal de la firma function onOpenModal() { $('#signatureModal').modal('show'); } // Función para guardar la firma function onSaveSignature() { var clienteFirma = document.getElementById('clienteFirma'); var clienteFirmaValue = document.getElementById('clienteFirmaValue'); var dataURL = signaturePad.toDataURL(); clienteFirma.style.backgroundImage = `url(${dataURL})`; clienteFirmaValue.value = dataURL; $('#signatureModal').modal('hide'); } </script> </body> </html>
| ver. 1.4 |
Github
|
.
| PHP 7.4.33 | Генерация страницы: 0.03 |
proxy
|
phpinfo
|
Настройка