<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>LOJAS by Finops</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet">
    <style>
        img.kuna-logo {
            width: 150px;
            content: url(data:image/png;base64,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);
        }

        hr {
            border-top: 5px solid;
        }

        .is-required:after {
          content: '*';
          margin-left: 3px;
          color: red;
          font-weight: bold;
        }

        input::placeholder {
          font-weight: bold;
          opacity: 0.4 !important;
        }

    </style>
</head>

<body>
    <div class="container mt-5">
        <div class="text-center mb-3"><img class="kuna-logo" alt="KUNA"></div>
        <h1 class="text-center mb-4"><b>LOJAS to BMP</b> <i>by Finops</i></h1>
        <form id="dataForm" class="needs-validation" novalidate>
            <!-- Datos Personales -->
            <fieldset class="mb-4">
                <legend>1 - Dados Pessoais</legend>
                <div class="row mb-3">
                    <div class="col-md-6">
                        <label for="Nome" class="form-label is-required">Nome</label>
                        <input type="text" class="form-control" id="Nome" name="Nome" required>
                    </div>
                    <div class="col-md-2">
                        <label for="DocumentoFederal" class="form-label is-required">Documento Federal</label>
                        <input type="text" class="form-control" id="DocumentoFederal" name="DocumentoFederal" required>
                    </div>
                    <div class="col-md-2">
                        <label for="Sexo" class="form-label is-required">Sexo</label>
                        <select class="form-control" name="Sexo" id="Sexo">
                            <option value="F">Fememino</option>
                            <option value="M">Masculino</option>
                        </select>
                    </div>
                    <div class="col-md-2">
                        <label for="DtNasc" class="form-label is-required">Data de Nascimento</label>
                        <input type="date" class="form-control" id="DtNasc" name="DtNasc" value="2000-12-31" required>
                    </div>
                </div>
                <div class="row mb-3">
                    <div class="col-md-3">
                        <label for="Email" class="form-label is-required">Email</label>
                        <input type="email" class="form-control" id="Email" name="Email" required>
                    </div>
                    <div class="col-md-3">
                        <label for="EstadoCivil" class="form-label is-required">Estado Civil</label>
                        <select class="form-control" name="EstadoCivil" id="EstadoCivil">
                            <option value="1">SINGLE</option>
                            <option value="2">MARRIED</option>
                            <option value="3">DETACHED</option>
                            <option value="4">DIVORCED</option>
                            <option value="5">SEPARATE</option>
                            <option value="6">WIDOWER</option>
                            <option value="7">OTHERS</option>
                            <option value="8">UNINFORMED</option>
                            <option value="9">MARITAL BOND</option>
                        </select>
                    </div>
                    <div class="col-md-2">
                        <label for="Nacionalidade" class="form-label is-required">Nacionalidade</label>
                        <input type="text" class="form-control" id="Nacionalidade" name="Nacionalidade"
                            value="Brasileiro" required>
                    </div>
                    <div class="col-md-2">
                        <label for="TelefoneFixo1" class="form-label is-required">Telefone Fixo</label>
                        <input type="text" class="form-control" id="TelefoneFixo1" name="TelefoneFixo1" required>
                    </div>
                    <div class="col-md-2">
                        <label for="TelefoneCelular1" class="form-label is-required">Telefone Celular</label>
                        <input type="text" class="form-control" id="TelefoneCelular1" name="TelefoneCelular1" required>
                    </div>
                </div>
                <div class="text-center">
                    <button type="button" class="btn btn-primary" onclick="sendRequest1()">Send Customer</button>
                </div>
                <div id="response1" class="mt-2 p-3 text-center"></div>
            </fieldset>
            <hr>
            <!-- Dirección -->
            <fieldset class="mb-4">
                <legend>2 - Endereço</legend>
                <div class="row mb-3">
                    <div class="col-md-3">
                        <label for="UF" class="form-label is-required">UF</label>
                        <input type="text" class="form-control" id="UF" name="UF" placeholder="SÃO PAULO" required>
                    </div>
                    <div class="col-md-3">
                        <label for="CEP" class="form-label is-required">CEP</label>
                        <input type="text" class="form-control" id="CEP" name="CEP" placeholder="12345678" required>
                    </div>
                    <div class="col-md-3">
                        <label for="Cidade" class="form-label is-required">Ciudad</label>
                        <input type="text" class="form-control" id="Cidade" name="Cidade" placeholder="SÃO PAULO"
                            required>
                    </div>
                    <div class="col-md-3">
                        <label for="Logradouro" class="form-label is-required">Logradouro</label>
                        <input type="text" class="form-control" id="Logradouro" name="Logradouro" required>
                    </div>
                </div>
                <div class="text-center">
                    <button type="button" class="btn btn-primary" onclick="sendRequest2()">Send Address</button>
                </div>
                <div id="response2" class="mt-2 p-3 text-center"></div>
            </fieldset>
            <hr>
            <!-- Datos de Propuesta -->
            <fieldset class="mb-4">
                <legend>3 - Datos de Propuesta</legend>
                <div class="row mb-3">
                    <div class="col-md-2">
                        <label for="CodigoOperacao" class="form-label is-required">Codigo Operacao</label>
                        <input type="text" class="form-control" id="CodigoOperacao" name="CodigoOperacao" required>
                    </div>
                    <div class="col-md-2">
                        <label for="Prazo" class="form-label is-required">Prazo</label>
                        <input type="number" class="form-control" id="Prazo" name="Prazo" required>
                    </div>
                    <div class="col-md-3">
                        <label for="DtPrimeiroVencto" class="form-label is-required">Primeira Data de Vencim.</label>
                        <input type="date" class="form-control" id="DtPrimeiroVencto" name="DtPrimeiroVencto"
                            value="2025-01-01" required>
                    </div>
                    <div class="col-md-2">
                        <label for="VlrParcela" class="form-label is-required">Parcela</label>
                        <input type="number" step="0.01" class="form-control" id="VlrParcela" name="VlrParcela"
                            required>
                    </div>
                    <div class="col-md-2">
                        <label for="VlrSolicitado" class="form-label is-required">Valor Solicitado</label>
                        <input type="number" step="0.01" class="form-control" id="VlrSolicitado" name="VlrSolicitado"
                            required>
                    </div>
                </div>
                <div class="row mb-3">
                    <div class="col-md-2">
                        <label for="VlrIOF" class="form-label is-required">Valor IOF</label>
                        <input type="number" step="0.01" class="form-control" id="VlrIOF" name="VlrIOF" required>
                    </div>
                    <div class="col-md-2">
                        <label for="PercIOF" class="form-label is-required">Perc IOF</label>
                        <input type="number" step="0.01" class="form-control" id="PercIOF" name="PercIOF" required>
                    </div>
                    <div class="col-md-2">
                        <label for="VlrTAC" class="form-label is-required">Valor TAC</label>
                        <input type="number" step="0.01" class="form-control" id="VlrTAC" name="VlrTAC" required>
                    </div>
                    <div class="col-md-2">
                        <label for="PercIOFAdicional" class="form-label is-required">Perc IOF Adicional</label>
                        <input type="number" step="0.01" class="form-control" id="PercIOFAdicional"
                            name="PercIOFAdicional" required>
                    </div>
                    <div class="col-md-2">
                        <label for="PercJurosNegociado" class="form-label is-required">Perc Juros Negociado</label>
                        <input type="number" step="0.01" class="form-control" id="PercJurosNegociado"
                            name="PercJurosNegociado" required>
                    </div>
                </div>
                <div class="row mb-3">
                    <div class="col-md-2">
                        <label for="TipoConta" class="form-label">Tipo Conta</label>
                        <input type="number" step="1" class="form-control" id="TipoConta"
                            name="TipoConta">
                    </div>
                    <div class="col-md-2">
                        <label for="Agencia" class="form-label">Agencia</label>
                        <input type="number" step="1" class="form-control" id="Agencia"
                            name="Agencia">
                    </div>
                    <div class="col-md-2">
                        <label for="AgenciaDig" class="form-label">Agencia Dig</label>
                        <input type="number" step="1" class="form-control" id="AgenciaDig"
                            name="AgenciaDig">
                    </div>
                    <div class="col-md-2">
                        <label for="Conta" class="form-label">Conta</label>
                        <input type="number" step="1" class="form-control" id="Conta"
                            name="Conta">
                    </div>
                    <div class="col-md-2">
                        <label for="ContaDig" class="form-label">Conta Dig</label>
                        <input type="number" step="1" class="form-control" id="ContaDig"
                            name="ContaDig">
                    </div>
                    <div class="col-md-2">
                        <label for="NumeroBanco" class="form-label">Numero Banco</label>
                        <input type="number" step="1" class="form-control" id="NumeroBanco"
                            name="NumeroBanco">
                    </div>
                </div>
                <div class="text-center">
                    <button type="button" class="btn btn-primary" onclick="sendRequest3()">Send Contract</button>
                </div>
                <div id="response3" class="mt-2 p-3 text-center"></div>
                <div id="response3a" class="mt-2 p-3 text-center"></div>
            </fieldset>
            <hr>
            <!-- Datos del Vehículo (Request 4) -->
            <fieldset class="mb-4">
                <legend>4 - Dados do veículo</legend>
                <div class="row mb-3">
                    <div class="col-md-2">
                        <label for="Marca" class="form-label is-required">Marca</label>
                        <input type="text" class="form-control" id="Marca" name="Marca" required>
                    </div>
                    <div class="col-md-3">
                        <label for="Modelo" class="form-label is-required">Modelo</label>
                        <input type="text" class="form-control" id="Modelo" name="Modelo" required>
                    </div>
                    <div class="col-md-3">
                        <label for="VersaoModelo" class="form-label is-required">Versao</label>
                        <input type="text" class="form-control" id="VersaoModelo" name="VersaoModelo" required>
                    </div>
                    <div class="col-md-2">
                        <label for="AnoFab" class="form-label is-required">Ano de Fabricação</label>
                        <input type="number" class="form-control" id="AnoFab" name="AnoFab" placeholder="1980" required>
                    </div>
                    <div class="col-md-2">
                        <label for="AnoMod" class="form-label is-required">Ano Modelo</label>
                        <input type="number" class="form-control" id="AnoMod" name="AnoMod" placeholder="1980" required>
                    </div>
                </div>
                <div class="row mb-3">
                    <div class="col-md-3">
                        <label for="Placa" class="form-label is-required">Placa</label>
                        <input type="text" class="form-control" id="Placa" name="Placa" required>
                    </div>
                    <div class="col-md-3">
                        <label for="Cor" class="form-label is-required">Cor</label>
                        <input type="text" class="form-control" id="Cor" name="Cor" required>
                    </div>
                    <div class="col-md-3">
                        <label for="Chassis" class="form-label is-required">Chasis</label>
                        <input type="text" class="form-control" id="Chassis" name="Chassis" required>
                    </div>
                    <div class="col-md-3">
                        <label for="Proprietario" class="form-label is-required">Propietario</label>
                        <input type="text" class="form-control" id="Proprietario" name="Proprietario" required>
                    </div>
                </div>
                <div class="text-center">
                    <button type="button" class="btn btn-primary" onclick="sendRequest4()">Send Car</button>
                </div>
                <div id="response4" class="mt-2 p-3 text-center"></div>
            </fieldset>
            <hr>
            <!-- Subir Archivo PDF -->
            <fieldset class="mb-4">
                <legend>5 - CCB</legend>
                <div class="mb-3">
                    <label for="pdfFile" class="form-label is-required">Arquivo PDF</label>
                    <input type="file" class="form-control" id="pdfFile" accept=".pdf" required>
                </div>
                <div class="text-center">
                    <button type="button" class="btn btn-primary" onclick="sendRequest5()">Send CCB</button>
                </div>
                <div id="response5" class="mt-2 p-3 text-center"></div>
            </fieldset>

            <div class="text-center">
                <button type="button" class="btn btn-primary" onclick="sendRequest6()">Finalize Proposal</button>
            </div>
            <div id="response6" class="mt-2 p-3 text-center"></div>
        </form>

        <div id="response" class="mt-4"></div>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.bundle.min.js"></script>
    <script>
        let codigoProposta = "";
        // Request 1: CreateUpdatePessoa
        async function sendRequest1() {
            const formData = new FormData(document.getElementById("dataForm"));
            const payload = {
                dto: {
                    PF: {
                        Sexo: formData.get("Sexo"),
                        DtNasc: formData.get("DtNasc"),
                        EstadoCivil: parseInt(formData.get("EstadoCivil")),
                        Nacionalidade: formData.get("Nacionalidade")
                    },
                    Nome: formData.get("Nome"),
                    DocumentoFederal: formData.get("DocumentoFederal"),
                    PessoaDadosContato: {
                        Email: formData.get("Email"),
                        TelefoneFixo1: formData.get("TelefoneFixo1"),
                        TelefoneCelular1: formData.get("TelefoneCelular1")
                    }
                }
            };
            const response = await makePostRequest("CreateUpdatePessoa", payload);
            setResponse(document.getElementById("response1"), response);
        }

        // Request 2: CreateUpdatePessoaEndereco
        async function sendRequest2() {
            const formData = new FormData(document.getElementById("dataForm"));
            const payload = {
                param: {
                    DocumentoCliente: formData.get("DocumentoFederal")
                },
                dto: {
                    UF: formData.get("UF"),
                    CEP: formData.get("CEP"),
                    Cidade: formData.get("Cidade"),
                    Logradouro: formData.get("Logradouro")
                }
            };
            const response = await makePostRequest("CreateUpdatePessoaEndereco", payload);
            setResponse(document.getElementById("response2"), response);
        }

        // Request 3: IncluirPropostaManualSimplificado
        async function sendRequest3() {
            const formData = new FormData(document.getElementById("dataForm"));
            const payload = {
                dto: {
                    DocumentoCliente: formData.get("DocumentoFederal"),
                    CodigoOperacao: formData.get("CodigoOperacao"),
                    Prazo: parseInt(formData.get("Prazo")),
                    VlrTAC: parseFloat(formData.get("VlrTAC")),
                    PercIOF: parseFloat(formData.get("PercIOF")),
                    VlrIOF: parseFloat(formData.get("VlrIOF")),
                    VlrSolicitado: parseFloat(formData.get("VlrSolicitado")),
                    VlrParcela: parseFloat(formData.get("VlrParcela")),
                    DtPrimeiroVencto: formData.get("DtPrimeiroVencto"),
                    PercIOFAdicional: parseFloat(formData.get("PercIOFAdicional")),
                    PercJurosNegociado: parseFloat(formData.get("PercJurosNegociado")),
                }
            };

            const tipoConta = parseInt(formData.get("TipoConta"));
            const agencia = formData.get("Agencia");
            const agenciaDig = formData.get("AgenciaDig");
            const conta = formData.get("Conta");
            const contaDig = formData.get("ContaDig");
            const numeroBanco = formData.get("numeroBanco");

            console.log(tipoConta);

            if (tipoConta || agencia || conta || numeroBanco) {
                payload.dto = {
                    ...payload.dto,
                    PropostaContaPagamentoDTO: {
                        TipoConta: tipoConta,
                        Agencia: agencia,
                        AgenciaDig: agenciaDig,
                        Conta: conta,
                        ContaDig: contaDig,
                        NumeroBanco: numeroBanco
                    }
                }
            }
            const response = await makePostRequest("IncluirPropostaManualSimplificado", payload);
            setResponse(document.getElementById("response3"), response);
            codigoProposta = response.Codigo;
            setResponse(document.getElementById("response3a"), codigoProposta);
        }

        // Request 4: IncluirPropostaDadosVeiculo
        async function sendRequest4() {
            const formData = new FormData(document.getElementById("dataForm"));
            const payload = {
                dto: {
                    CodigoOperacao: formData.get("CodigoOperacao"),
                    CodigoProposta: codigoProposta
                },
                dadosVeiculoDTO: {
                    AnoFab: parseInt(formData.get("AnoFab")),
                    AnoMod: parseInt(formData.get("AnoMod")),
                    Marca: formData.get("Marca"),
                    Modelo: formData.get("Modelo"),
                    VersaoModelo: formData.get("VersaoModelo"),
                    Cor: formData.get("Cor"),
                    Placa: formData.get("Placa"),
                    Chassis: formData.get("Chassis"),
                    Proprietario: formData.get("Proprietario"),
                    TipoPlaca: 1,
                    Financiado: true,
                    TipoVeiculo: 1,
                    SaldoFinanciamento: 0,
                    DocumentoFederalProprietario: "",
                    TipoChassi: 2,
                    TipoRestricao: 3
                }
            };
            const response = await makePostRequest("IncluirPropostaDadosVeiculo", payload);
            setResponse(document.getElementById("response4"), response);
        }

        // Request 5: UploadDocumentoProposta
        async function sendRequest5() {
            const formData = new FormData(document.getElementById("dataForm"));
            const pdfFile = document.getElementById("pdfFile").files[0];
            if (!pdfFile) {
                setResponse(document.getElementById("response5"), JSON.parse('{"Msg":"Error: missing file.","HasError":true}'));
                return
            }
            const base64Pdf = await toBase64(pdfFile);
            if (!base64Pdf) {
                setResponse(document.getElementById("response5"), JSON.parse('{"Msg":"Error: converting to base64.","HasError":true}'));
                return
            }
            const payload = {
                dto: {
                    CodigoOperacao: formData.get("CodigoOperacao"),
                    CodigoProposta: codigoProposta
                },
                documento: {
                    TipoDocumento: 30,
                    NomeArquivo: "CCB",
                    Extensao: "pdf",
                    Arquivo: base64Pdf
                }
            };
            const response = await makePostRequest("UploadDocumentoProposta", payload);
            setResponse(document.getElementById("response5"), response);
        }

        // Request 6: PropostaFinalizar
        async function sendRequest6() {
            const formData = new FormData(document.getElementById("dataForm"));
            const payload = {
                dto: {
                    CodigoOperacao: formData.get("CodigoOperacao"),
                    CodigoProposta: codigoProposta
                },
                parametros: [
                    {
                        Nome: "IP_ADDRESS",
                        Valor: "54.232.52.249"
                    },
                    {
                        Nome: "FINALIZACAO_VALIDARPARCELAS",
                        Valor: "false"
                    }
                ]
            };
            const response = await makePostRequest("PropostaFinalizar", payload);
            setResponse(document.getElementById("response6"), response);
        }

        async function makePostRequest(url, p) {
            const BASE = "https://bmpdigital.moneyp.com.br/api/BMPDigital/";
            console.log(url, p);
            const auth = {
                auth: {
                    Usuario: atob("anVhbi5yb3NzaUBrYXZhay5jb20="),  // encoded with btoa()
                    Senha: atob("T3FOUkVDMiM="),
                    CodigoParametro: atob("S0FWQUtfU0NE"),
                    Chave: atob("MjllZTE5NTYtYjdkMi00MTJmLWFjNDItOTU2NWU1MzU5ODRh")
                }
            };
            const response = await fetch(BASE + url, {
                method: "POST",
                headers: { "Content-Type": "application/json" },
                body: JSON.stringify({ ...auth, ...p })
            });
            if (!response.ok) throw new Error(`Error calling ${url}: ${response.statusText}`);
            return await response.json({});
        }

        function setResponse(e, response) {
            if (response.Msg) {
                e.innerText = response.Msg;
            } else {
                e.innerText = response;
            }
            e.classList.remove("bg-danger");
            e.classList.remove("bg-success");
            e.classList.add("text-white");

            if (!response.HasError) {
                e.classList.add("bg-success");
            } else {
                e.classList.add("bg-danger");
            }
        }

        function toBase64(file) {
            return new Promise((resolve, reject) => {
                const reader = new FileReader();
                reader.onload = () => resolve(reader.result.split(",")[1]);
                reader.onerror = reject;
                reader.readAsDataURL(file);
            });
        }
    </script>
</body>

</html>