Ir para conteúdo

wanderval

Members
  • Total de itens

    409
  • Registro em

  • Última visita

  • Dias vencidos

    2

Posts postados por wanderval


  1. 4 horas atrás, acneto.frc disse:

    Boa noite a todos! Em especial ao Wanderval!

    Modifiquei o código mas ainda sem sucesso.

    Agora recebo de retorno a resposta:

    undefined

     

    abaixo o controllers:

    
    const segurosController = require('../models/segurosModels.js');
    
    module.exports = {
        segurosGetAll,
    }
    
    async function segurosGetAll(req, res) {
        console.log('Acessando Models!!!')
        try{
            const retorno = await segurosController.getAll()
            console.log(JSON.stringify(retorno))
        }catch (err){
            console.log(err)
        }
    }

     

    abaixo a model.

    conexão é a instância mysql

     

    
    const conexao = require('../../config/conexao.js');
    module.exports = {
      getAll,
    }  
    
    function getAll() {
      m_sql = 'select * from seguros ';
    
      console.log("SQL em Model Seguros...."+'\n'+m_sql)
    
      conexao.query(m_sql); 
    
      console.log("GetAll Sql retornando: ")
    
    }

     

     

     

    Pelo que percebi essa aplicação é node.js e não uma aplicação front-end

    está aparecendo undefined pq você não esta retornando nada no response, isso é uma API náo pode deixar de usar response e request.

     

    Essa é uma chamada de APi para rota como foi delegado para outro método manipular response(res) ou request(req) como é um get deve ter um response populado.

    Segundo seu Model não está fazendo nada além de fazer console.log então mesmo chegando resposta do banco nada voltara para o controller.

    app.get('/estagio/movimentacoes/cadastroSeguros', segurosRoutes.segurosGetAll);

     

    Como você pode ver em nenhum momento foi utilizado o "res"nesse método

    =====CONTROLLER

    const segurosController = require('../models/segurosModels.js');
    
    module.exports = {
        segurosGetAll,
    }
    
    async function segurosGetAll(req, res) {
        console.log('Acessando Models!!!')
        try{
            const retorno = await segurosController.getAll()
            console.log(JSON.stringify(retorno))
        }catch (err){
            console.log(err)
        }
    }

    =====ALTERACAO CONTROLLER

    const segurosController = require("../models/segurosModels.js");
    
    module.exports = {
      segurosGetAll
    };
    
    async function segurosGetAll(req, res) {
      console.log("=========SEGUROS GET ALL CONTROLLER========");
      try {
        const retorno = await segurosController.getAll();
        console.log(JSON.stringify(retorno));
    
        res.json(retorno);
      } catch (err) {
        console.log(err);
        res.json({ error: true });
      }
    }

    ======MODEL======

    const conexao = require('../../config/conexao.js');
    module.exports = {
      getAll,
    }  
    
    function getAll() {
      m_sql = 'select * from seguros ';
    
      console.log("SQL em Model Seguros...."+'\n'+m_sql)
    
      conexao.query(m_sql); 
    
      console.log("GetAll Sql retornando: ")
    
    }

    =====ALTERACAO MODEL=======

    // const client = require("../../config/conexao.js");
    // const moment = require("moment"); // comentei pq nao vi nenhuma utilizacao
    
    // APENAS TEST MOCK
    const client = require("../config/conexao.js");
    
    module.exports = {
      getAll
    };
    
    async function getAll() {
      console.log("=========GET ALL MODEL========");
      const m_sql =
        "select A.*, B.seg_razaosocial, B.seg_nomefantasia, C.alu_nome, D.usu_username from seguros A left join seguradora B on A.seg_codigo = B.seg_codigo left join usuarios D on A.usu_codigo = D.usu_codigo left join alunos C on A.alu_codigo = C.alu_codigo ";
    
      let retorno;
      try {
        retorno = await client.query(m_sql);
      } catch (error) {
        throw new Error(error);
      }
    
      return retorno;
    }

     

    tenta acessar essa plataforma: https://codesandbox.io/s/zealous-brahmagupta-mqhxd?file=/src/index.js


  2. Tenta assim
    <script
            src="https://www.mercadopago.com.br/integrations/v1/web-payment-checkout.js"
            data-preference-id="<?php echo json_encode($preference2->id); ?>" data-elements-color="#0D55E7"  data-button-label-color="#0D55E7"
            data-button-label="CONTINUAR" >
    </script>
    
     

  3. function myFunction() {
      // Corrija essa linha
      // var test = document.getElementsByClassName("entrada"); // atualmente
      var test = document.getElementsByClassName("entrada")[0].innerHTML; // maneira correta
    
      function getMoney( str )
      {console.log(str);
              return parseInt( str.replace(/[\D]+/g,'') );
      }
      function formatReal( int )
      {
              var tmp = int+'';
              tmp = tmp.replace(/([0-9]{2})$/g, ",$1");
              if( tmp.length > 6 )
                      tmp = tmp.replace(/([0-9]{3}),([0-9]{2}$)/g, ".$1,$2");
              return tmp;
      }
    
    
      var int = getMoney( test );
      document.getElementById("saida").innerHTML = (formatReal( int ));
    }

    JsBin: https://jsbin.com/dujevafuri/edit?html,js,output


  4. 1 ponto: Você deveria ter colocado tb o html

    2 ponto: no seu script você define claramente 4 items, então acredito que o que esteja ocorrendo e apenas exibir as imagesn novamente devido o loop.

     

    Obs: não ficou muito clara sua dúvida, você quer exibir 4 imagens diferentes tendo menos de 4?

     

    JsBin: https://jsbin.com/jerahopipe/edit?html,js,output

     

     

    $(".owl-carousel").owlCarousel({
      loop: true,
      nav: true,
      items: 4, // Define o numero de items
      dots: false,
      navText: ["<i class='fa fa-angle-left'></i>", "<i class='fa fa-angle-right'></i>"],
      smartSpeed: 1200,
      autoplayTimeout: 5000,        
      autoHeight: false,
      autoplay: true,
      responsive: {
        // acredito que defina o espaçamento entre os itens, logo se houver apenas 2 imagesn e no attributo items for igual 2(items:2) a biblioteca ira considerar essa definiçao agora se essa definiçao não existir passa a vvalor o valor de (items) seguindo a configuracao da biblioteca para exibir a cada loop o numero igual aos itens definidos
        0: {
          items: 1
        },
        480: {
          items: 2
        },
        768: {
          items: 3
        },
        992: {
          items: 4
        }
      }
    });

     


  5. 2 horas atrás, acneto.frc disse:

    Olá Wanderval obrigado por esta nos ajudando! Somos iniciantes no uso dessas funções por isso nossa insegurança.

    Ficou um pouco confuso/perdido onde deveremos fazer as modificações. Quais serão no controllers e quais na Model. Também me perdi onde será inserido async e onde será o await. Como assyn-await são para usar em funções assíncronas só fizemos referência a estas funções na Model que é onde efetivamente será feito o acesso assíncrono (mysql/servidor) no controller nada foi declarado.

    Obrigado!

    Neto

     

     

     

    O que eu fiz foi criar um cenário, eu fiz uma pergunta pra você no post anterior sobre o que a query retorna, certo? Na maioria de libs Javascrip o client.post client.get retornam uma Promise, quando eu falo isso, eu digo o tipo do retorno não o conteudo em si.

     

    Então se você ver eu criei o metodo query retornando como async torna o metodo uma promise. procure ler a respeito assim vai entender e ficar mais seguro. mas basicamente você so precisaria alterar a sua variavel que está errada ja que a chamada do metodo já está com o "then()".

     

    Faça tentativas use o then  na chamda do getAll e corrija o que apontei relacionado a variavel retorno.

    entao caso haja problema coloque a sua tentativa aqui


  6. 2 horas atrás, acneto.frc disse:

    Retorna a mensagem do console.log dentro da model..Entrando.... depois a instrução executada em outro console.log, passa um traço e mostra [object Object] do outro console.log...É como se o retorno fosse indefinido

     

    Entrando em Controllers Seguros:
    SQL em Seguros....select A.*, B.seg_razaosocial, B.seg_nomefantasia, C.alu_nome, D.usu_username from seguros A left join seguradora B on A.seg_codigo = B.seg_codigo left join usuarios D on A.usu_codigo = D.usu_codigo left join alunos C on A.alu_codigo = C.alu_codigo
    -----------------------
    Retornando da SQL: [object Object]

    // Seu Cenario
    async function query(sql) {
      return {data:"sucess"};
    }
    
    async function getAll() {
      m_sql = 'select A.*, B.seg_razaosocial, B.seg_nomefantasia, C.alu_nome, D.usu_username from seguros A left join seguradora B on A.seg_codigo = B.seg_codigo left join usuarios D on A.usu_codigo = D.usu_codigo left join alunos C on A.alu_codigo = C.alu_codigo ';
      console.log("SQL em Seguros...."+m_sql)
      console.log("-----------------------")
    
      let retorno
      try{
        retorno = await query(m_sql);
        console.log("Retornando da SQL: "+retorno.data)
      } catch(erro) {
        console.log(erro)
        retorno = erro;   
      } 
      return retorno;
    }
    
    getAll().then((result) => {
      console.log('Result: ', result);
    })

    Seu erro está sendo o seguinte você está declarando uma variavel const retorno dentro do try e retornando let retorno


  7. 7 minutos atrás, acneto.frc disse:

    retorna um erro! Acusa erro no ponto(.) antes do then

    16v é a linha do código que inicia a declaração da função.

     

    /home/acneto/0-SistemasWeb/PjEstagio/CodigoFonte/0_2020_2/10-Out/v_3.7.0.3-6-get_set/api/models/segurosModels.js:16
    async function getAll().then((err, result) => {

    mas seu metodo getAll não retorna uma promise?

    const retorno = await client.query(m_sql);

     

    oque retorna query?

     

    // modifica essa linha

    segurosController.getAll().then((result) => {

  8. Acho que você  deveria estar usando o then do promise ou o await afinal você declarou a funçao como async

     

    segurosController.getAll().then((err, result) => {
      if(err) {
        console.log("Erro: " + err) throw err;
      }else{ console.log("Resultado "+result)}
    })
    
    // await
    let result = await segurosController.getAll();

     


  9. Mas o que não ficou muito claro, porque você precisa do position:fixed; afinal com a propria div você ja tem esse comportamento, e dessa forma você torna os elementos anexados em diferentes referencias, viewport e elemento parent.

     

    Seguindo o seu css a unica forma seria emum cenario onde a primeira div não tivesse seu height alterado assim daria pra colocar a diferença em uma margin top na segunda div.

     

    EX: essas divs por si so já executam esse comportamento, pq são por definição display: block então sempre ocuparam 100% dentro do container

    <div>div_1</div>

    <div>div_2</div>


  10. seu problema é muito simples, você está usando aparentemente jquery ($) e não adicionou a mesma no header do html, o codigo está funcional.

     

    HTML

    <!DOCTYPE html>
    <html>
    <head>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width">
      <title>JS Bin</title>
      <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
    </head>
    <body>
      <select class="seleciona_nome">
        <option value="Joao">Joao</option>
        <option value="Julio">Julio</option>
        <option value="Pedro">Pedro</option>
      </select>
      <input type="text"
             class="opcaoSelect"
             autocomplete="off"
             disabled="disabled">
    </body>
    </html>

    link JsBin: https://jsbin.com/wafuduliwi/edit?html,js,output


  11.  

     

    HTML: 

    <!--My option-->
      
    <div class="container-cards">  
      <div class="box-container">
        <section class=box-image>
          <img src="https://e7.pngegg.com/pngimages/755/939/png-clipart-red-and-gold-shield-illustration-shield-icon-shield-heart-shields.png" width="130" height="130"  />
        </section>
        <section class=box-content>
          <label class="title">Perm. e Segurança</label>
          <span class="description">Aplique permissões e proteja pastas</span>
        </section>
      </div>
      
      <div class="box-container">
        <section class=box-image>
          <img src="https://e7.pngegg.com/pngimages/755/939/png-clipart-red-and-gold-shield-illustration-shield-icon-shield-heart-shields.png" width="130" height="130"  />
        </section>
        <section class=box-content>
          <label class="title">Perm. e Segurança</label>
          <span class="description">Aplique permissões e proteja pastas</span>
        </section>
      </div>
      
      <div class="box-container">
        <section class=box-image>
          <img src="https://e7.pngegg.com/pngimages/755/939/png-clipart-red-and-gold-shield-illustration-shield-icon-shield-heart-shields.png" width="130" height="130"  />
        </section>
        <section class=box-content>
          <label class="title">Perm. e Segurança</label>
          <span class="description">Aplique permissões e proteja pastas</span>
        </section>
      </div>
      
    </div>

    CSS:

    fieldset{
      width:100%;
      height:100%;
      padding: 1em;
      font:80%/1 sans-serif;
      border-radius: 10px;
      padding: 5px;
      min-height:1px;
      background: -webkit-linear-gradient(90deg, #CCCCCC, #FFFFFF) repeat scroll 0 0 transparent;
      background: -moz-linear-gradient(90deg, #CCCCCC, #FFFFFF) repeat scroll 0 0 transparent;
      border: 1px solid #AAAAAA;
      border-radius: 10px 10px 10px 10px;
      box-shadow: 0 0 15px #AAAAAA;
      font-size: 15px;
      color: #000;
      text-transform: uppercase;
      text-align: center;
      }
    div.box {
      width: 250px;
      display: inline-block;
      padding: 15px;
      min-height:1px;  
    }
    
    /* My opinion */
    
    body {
      background: #ededed;
    }
    
    
    .container-cards {
      flex-wrap: wrap;
      display: inline-flex;
        width: 100%;
    }
    
    .box-container {
      /*border: 1px solid red;*/
      display: flex;
      background: #fcfcfc;
      font:80%/1 sans-serif;
      font-size: 14px;
      border-radius: 5px;
      align-items: center;
      width: 280px;
      height: 80px;
      border: 1px solid #AAAAAA;
      margin: 10px;
    }
    
    .box-container .box-image {
      width: 25%;
      background: -webkit-linear-gradient(90deg, #CCCCCC, #FFFFFF) repeat scroll 0 0;
      align-items: center;
      display: flex;
      height: 100%;
      justify-content: center;
      border-right: 1px solid #AAAAAA;
    
    }
    .box-container .box-image img {
      width: 40px;
      height: 40px;
    }
    
    .box-container .box-content {
      display: flex;
      flex-direction: column;
      padding: 10px;
      .title {
        margin-bottom: 10px;
        font-size: 14px
        font-weight: bold;
      }
      
      .description {
        font-size: 12px;
        color: #8a8686;
      }
    }

     

    JsBin: https://jsbin.com/rowuvamaxu/edit?html,css,output


  12. Acredito que o problema seja pq sempre cria uma nova instancia e nunca destroy a instancia anterior.

     

    JS

    // declara variavel fora para armazenar instancia
    var myChart;
    
    function montaGraficoProducao(option) {
      var ctx = document.getElementById('prodChart').getContext('2d');
      var graphType = document.getElementById('graph-type').value;
      var data = getData(option)
      var labels = data.labels;
      var series = data.series;
      
      // checa a existencia de uma instancia e destroy
      if(myChart) {
        myChart.destroy();
      }
      
      myChart = new Chart(ctx, {
        type: graphType,
        responsive: true,
        hoverMode: 'index',
        stacked: true,
        data: {
          labels: labels,
          datasets: [{
            label: 'Ton/Mês',
            fill: false,
            backgroundColor: "rgba(1, 150, 249, 1)",
            borderColor: "rgba(1, 150, 249, 1)",
            data: series
          }]
        }
      });
      
      
    }
    
    function getData(option) {
      const obj = {
        '1': {
          'labels': ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
          'series': [0, 10, 5, 2, 20, 30, 45]
        },
        '2': {
          'labels': ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
          'series': [0, 3, 1, 10, 13, 22, 17]
        }
      };
      
      return obj[option];
    }

    Jsbin: https://jsbin.com/payepiyuga/edit?html,js,output


  13. Mas pelo que entendi da sua dúvida, é mais uma dúvida de Usabilidade.

    1- na primeira opção você tem uma rotina que realiza um pull notification

    2- é uma requisição do cliente

     

    então o que você deveria analisar e se é necessário e se a usabilidade exige isso, um pull request é o ideal caso você tenha vários clientes dependendo desse serviço ai você teria uma sincronização de dados.

    mas se você tem um cenário onde é um dado isolado e onde a usabilidade pode ficar comprometida com os dados sendo atualizados o reflesh pode sim ser uma opção imagina uma table data sendo atualizada a todo momento pelo push notification, alem de nao ter uma boa usabilidade ainda consumiria muita memória do browser pra renderizar no dom. mas é clara uma tabela de mercado financeira nesse caso é emocionante é imprescindível essa atualização. 


  14. Outra opção seria usar uma lib especifica para manipulação de datas caso essa manipulação possa ficar mais ampla, assim terá um suporte maior, envolvendo dias, mês, ano e locale caso precise tratar dados com fuso horário diferente, e mais simples de manipular formatos diferentes como timestamps.

     

    uma delas é o day.js

    url cdn:https://cdnjs.cloudflare.com/ajax/libs/dayjs/1.9.1/dayjs.min.js

    // Acresncentando Meses
    console.log(dayjs().add(2, 'month').format('DD-MM-YYYY'));
    
    // Acrescentando Dias
    console.log(dayjs('2020-10-12').add(5, 'day').format('DD-MM-YYYY'));

    link JSbin: https://jsbin.com/negavetove/edit?html,js,console

     


  15. Somente complementando @Omar~ na verdade tem uma forma de resetar o audio mantendo os elementos usando a propriedade currentTime = 0

    no caso seria apenas uma linha adicionada ao seu método.

     

    function tocarAudio(e) {
      var alvo = (e.target).dataset.alvo;
      if (variavelGlobal) {
        document.getElementById(variavelGlobal).pause();
        document.getElementById(variavelGlobal).currentTime = 0;
      }
      document.getElementById(alvo).play();
      variavelGlobal = alvo;
    }

    link JsBin:https://jsbin.com/liyerayewi/edit?html,js,output


  16. Bom amigo acho que @Omar~ te deu um caminho, na sugestão dele ele mencionou o que me parece um caminho de pastas onde você deve realizar alterações e relatou sobre "classificadores" que me parece poder ser um script que manipula um tipo especifico de conteúdo. Acho deveria olhar e tentar fazer alguma coisa e posta o que não conseguir.

     

    Observação:

     - aprenda a usar o inspect element por ele você consegue identificar os elementos do html no caso esse que  está sendo utilizado como container da imagem , vai descobrir que o valor 140 x 76 é proporcional a 184 x 100, isso quer dizer que o elemento da imagem usa 100% em um container com tamanhos fixos ou background utilizando cover, mas aparentemente você está querendo que o layout se adapte a sua imagem e não a imagem ao layout.

     

    Questions:

    1- A sua imagem não está com margens transparentes?

    2- Você tem algum designer com essa imagem no tamanho esperado?

     

    Não existe uma forma fácil existe soluções mas todas precisam de algum tipo de esforço, então poste códigos aqui, template pq se você simplesmente quiser uma solução baseada nessa descrição. Pense se você com todo o seu código tem dificuldade em resolver, imagina todos aqui que não possuem nada para analisar.

     

    JSbin: https://jsbin.com/gusaqoxelu/edit?html,css,output


  17. Seu problema é que você ao selecionar o item triga o evento onChange chamando o metodo "submit" que da o reflesh, você então deve substituir o metodo submit por algum metodo javascript comum que ira chamar a lógica de request ajax;

     

    Mas você está fazendo request para a mesma pagina o ajax faria sentido se fosse fazer para um script especifico de backend que não é o caso então deve tentar diminuir a logica de PHP e aumentar o uso da lógica com a linguagem javascript

     

    ex: Note a diferença foi dividida a responsabilidade das linguagens

    <?php
     @$_POST['itemSelecionado'] = 'item1';
     $itemSelected = @$_POST['itemSelecionado'];
    ?>
    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>PhpFiddle Initial Code</title>
    
    <!--     
        http://phpfiddle.org
    -->
    </head>
    <body>
    <form  method="post">
       <select id="selectItem" name="itemSelecionado" required size="2" onChange="changeItem(this)">
          <option value="item1">item1</option>
          <option value="item2">item2</option>
       </select> 
       
       <div class="inputs" name="container-inputA">
          <label>input A - digite qualquer coisa</label>
          <input type="text" name="inputA" value="inputA"/> 
       </div>
        
       <div class="inputs" name="container-inputB">
          <label>input B - digite qualquer coisa</label>
          <input type="text" name="inputB" value="inputB"/> 
       </div>
    </form>
    <script type="text/javascript">
        function setItem(itemSelected) {
            console.log(itemSelected);
          hideFieldsByClass(".inputs");
          displayField(getFieldToDisplay(itemSelected));
        }
        
        function changeItem() {
          var e = document.getElementById("selectItem");
          var itemSelected = e.options[e.selectedIndex].value;
      
          console.log(itemSelected);
          hideFieldsByClass(".inputs");
          displayField(getFieldToDisplay(itemSelected)); 
        }
    
        function hideFieldsByClass(className) {
          var fields = document.querySelectorAll(className);
          fields.forEach(field => field.style.display = "none");
        }
    
        function getFieldToDisplay(itemSelected) {
          const inputToShow = {
           "item1": "container-inputA",
           "item2": "container-inputB"
          };
      
          return inputToShow[itemSelected];
        }
    
        function displayField(itemSelected) {
          var fields = document.querySelectorAll(".inputs");
          fields = Array.from(fields);
          let itemFounded = fields.filter(field => field.getAttribute("name") === itemSelected);
      
          itemFounded[0].style.display = 'block';
        }
        
        document.addEventListener('DOMContentLoaded', function() {
          setItem(<?php echo json_encode($itemSelected) ?>);
        }, false);
    </script>
    </body>
    </html>

    Link Jsbin: https://jsbin.com/qukiwegoru/edit?html,js,output

    PHPFiddle: http://phpfiddle.org/main/code/41wn-ub66


  18. Sim @Omar~ no caso da leitura essa seria uma ótima solução, quando fiz a solução confesso que fiquei um pouco confuso com a descrição mas entendi que ele queria fazer uma chain pra setar valores usando uma única referência de html. No caso o Ex1 seria o que ele deseja o Ex2 o que ele queria evitar, mas confesso que um builder nessa situação é um exagero rs.

     

    Obs: e percebo que o @Biel. está cometendo um equivoco porque está declarando a mesma variável 2 vezes no Ex2 sem reutilizar a referência. talvez sejá esse um dos pontos que gerou a dúvida dele.

    // Erro declarar a mesma variavel 2 vezes
    var tete = document.getElementById("id_1").style.display="none" ; 
    var tete = document.getElementById("id_1").disabled=true;
    
    //Solução
    var tete = document.getElementById("id_1");
    tete.style.display="none";
    tete.disabled=true;
    

     

     


  19. Isso que você quer tem um preço, não tem como você colocar em uma única linha sem haver uma lógica de manipulação, o motivo é muito simples, os métodos e propriedades pertencem a uma hierarquia, então tendo diferentes níveis isso se torna impossível, nesse exemplo abaixo você tem esse comportamento mas a manipulação continua sendo feita internamente dentro do objeto AttributeBuilder

     

     

    const attribute = AttributeBuilder()
      .setElement('id_1')
      .setDisplay('block')
      .setDisabled(false)
      .setValue('aprendiz')
      .setName('joao')
      .build();
    
    const attribute2 = AttributeBuilder()
      .setElement('id_2')
      .setValue('other field')
      .setName('Euclides')
      .build();
    
    
    function AttributeBuilder() {
      return {
        setElement: function(elementId){
          this.element = document.getElementById(elementId);
          return this;
        },
        setDisplay: function(style) {
          this.element.style.display = style;
          return this;
        },
        
        setDisabled: function(status) {
          this.element.disabled = status;
          return this;
        },
        
        setValue: function(value) {
          this.element.value = value;
          return this;
        },
        
        setName: function(name) {
          this.element.name = name;
          return this;
        },
        
        build: function() {
          console.log("Building object...");
          return this.element;   
        }
      }
    }

    Link Jsbin: https://jsbin.com/vokoyinico/edit?html,js,output

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.