Mudanças entre as edições de "Adicionar atributo volume com cálculo automático"

De Tek-System Wiki
Ir para navegação Ir para pesquisar
(Criou página com 'Este tutorial cria um atributo Volume para os produtos e realiza o cálculo automático do mesmo preenchendo as dimensões largura, altura e comprimento. Na administração do M...')
 
 
(4 revisões intermediárias pelo mesmo usuário não estão sendo mostradas)
Linha 19: Linha 19:
e adicione o seguinte código no final do arquivo:
e adicione o seguinte código no final do arquivo:


  <script type="text/javascript">
  <nowiki><script type="text/javascript">


setTimeout(function(){   
    setTimeout(function(){   


    function calculaVolume(){
var lg = document.getElementsByName("product[largura]")[0].value;
         var volume = 0;
        var at = document.getElementsByName("product[altura]")[0].value;
         var cm = document.getElementsByName("product[comprimento]")[0].value;


        var largura = parseFloat(document.getElementsByName("product[largura]")[0].value);
        var altura = parseFloat(document.getElementsByName("product[altura]")[0].value);
        var comprimento = parseFloat(document.getElementsByName("product[comprimento]")[0].value);


        if (largura != null && altura != null && comprimento != null) {
    document.getElementsByName("product[largura]")[0].value = parseFloat(lg);
            volume = largura*altura*comprimento;
    document.getElementsByName("product[altura]")[0].value = parseFloat(at);
            document.getElementsByName("product[volume]")[0].value = volume;
    document.getElementsByName("product[comprimento]")[0].value = parseFloat(cm);
 
        if (isNaN(document.getElementsByName("product[largura]")[0].value)) {
        document.getElementsByName("product[largura]")[0].value = "";
        }
 
        if (isNaN(document.getElementsByName("product[altura]")[0].value)) {
        document.getElementsByName("product[altura]")[0].value = "";
        }
 
        if (isNaN(document.getElementsByName("product[comprimento]")[0].value)) {
        document.getElementsByName("product[comprimento]")[0].value = "";
        }
 
        if (isNaN(document.getElementsByName("product[volume]")[0].value)) {
        document.getElementsByName("product[volume]")[0].value = "";
         }
         }
    }


     document.getElementsByName("product[largura]")[0].onchange = function() {calculaVolume();};
        function blockLetters(evt) {
    document.getElementsByName("product[altura]")[0].onchange = function() {calculaVolume();};
    if(evt.which < 46 || evt.which > 59) {
    document.getElementsByName("product[comprimento]")[0].onchange = function() {calculaVolume();};
        evt.preventDefault();
    }
 
    if(evt.which == 46 && document.getElementsByName("product[largura]")[0].value.indexOf('.') != -1
    && document.getElementsByName("product[altura]")[0].value.indexOf('.') != -1
    && document.getElementsByName("product[comprimento]")[0].value.indexOf('.') != -1) {
        evt.preventDefault();
    }      
        }
 
 
 
        document.getElementsByName("product[largura]")[0].onkeypress = function() {return blockLetters(event);};
    document.getElementsByName("product[altura]")[0].onkeypress = function() {return blockLetters(event);};
    document.getElementsByName("product[comprimento]")[0].onkeypress = function() {return blockLetters(event);};
 
 
 
    function calculaVolume(){
        var volume = 0;
 
        var largura = parseFloat(document.getElementsByName("product[largura]")[0].value);
        var altura = parseFloat(document.getElementsByName("product[altura]")[0].value);
        var comprimento = parseFloat(document.getElementsByName("product[comprimento]")[0].value);
 
        if (largura != null && altura != null && comprimento != null) {
            volume = largura*altura*comprimento;
            document.getElementsByName("product[volume]")[0].value = parseFloat(Math.round(volume * 100) / 100).toFixed(2);
            // document.getElementsByName("product[volume]")[0].onload = function() {fireKeyboardEvent("keyup", 32);};
           
        }
    }
 
    document.getElementsByName("product[largura]")[0].onchange = function() {calculaVolume();};
    document.getElementsByName("product[altura]")[0].onchange = function() {calculaVolume();};
    document.getElementsByName("product[comprimento]")[0].onchange = function() {calculaVolume();};


}, 3000);
}, 3000);


  </script>
  </script></nowiki>
 
Este código também faz o ajuste das casas decimais e limita o os campos para aceitar somente Float e pontos.

Edição atual tal como às 16h47min de 14 de março de 2018

Este tutorial cria um atributo Volume para os produtos e realiza o cálculo automático do mesmo preenchendo as dimensões largura, altura e comprimento.

Na administração do Magento 2 vá até

Loja > Atributos > Produto

Crie um novo atributo. Preenche com as mesmas informações de comprimento, largura ou altura, somente alterando o nome para Volume.

Vá até

Loja > Atributos > Definir Atributo

E adicione o atributo Volume que você acabou de criar ao conjunto de atributos padrão.

Vá até

vendor/magento/module-backend/view/adminhtml/templates/widget/form.phtml

e adicione o seguinte código no final do arquivo:

<script type="text/javascript">

    setTimeout(function(){  

	var lg = document.getElementsByName("product[largura]")[0].value;
        var at = document.getElementsByName("product[altura]")[0].value;
        var cm = document.getElementsByName("product[comprimento]")[0].value;


    	document.getElementsByName("product[largura]")[0].value = parseFloat(lg);
    	document.getElementsByName("product[altura]")[0].value = parseFloat(at);
    	document.getElementsByName("product[comprimento]")[0].value = parseFloat(cm);

        if (isNaN(document.getElementsByName("product[largura]")[0].value)) {
        	document.getElementsByName("product[largura]")[0].value = "";
        }

        if (isNaN(document.getElementsByName("product[altura]")[0].value)) {
        	document.getElementsByName("product[altura]")[0].value = "";
        }

        if (isNaN(document.getElementsByName("product[comprimento]")[0].value)) {
        	document.getElementsByName("product[comprimento]")[0].value = "";
        }

        if (isNaN(document.getElementsByName("product[volume]")[0].value)) {
        	document.getElementsByName("product[volume]")[0].value = "";
        }

        function blockLetters(evt) {
		    if(evt.which < 46 || evt.which > 59) {
		        evt.preventDefault();
		    } 

		    if(evt.which == 46 && document.getElementsByName("product[largura]")[0].value.indexOf('.') != -1 
		    	&& document.getElementsByName("product[altura]")[0].value.indexOf('.') != -1 
		    	&& document.getElementsByName("product[comprimento]")[0].value.indexOf('.') != -1) {
		        evt.preventDefault();
		    }     
        }



        document.getElementsByName("product[largura]")[0].onkeypress = function() {return blockLetters(event);};
	    document.getElementsByName("product[altura]")[0].onkeypress = function() {return blockLetters(event);};
	    document.getElementsByName("product[comprimento]")[0].onkeypress = function() {return blockLetters(event);};



	    function calculaVolume(){
	        var volume = 0;

	        var largura = parseFloat(document.getElementsByName("product[largura]")[0].value);
	        var altura = parseFloat(document.getElementsByName("product[altura]")[0].value);
	        var comprimento = parseFloat(document.getElementsByName("product[comprimento]")[0].value);

	        if (largura != null && altura != null && comprimento != null) {
	            volume = largura*altura*comprimento;
	            document.getElementsByName("product[volume]")[0].value = parseFloat(Math.round(volume * 100) / 100).toFixed(2);
	            // document.getElementsByName("product[volume]")[0].onload = function() {fireKeyboardEvent("keyup", 32);};
	            
	        }
	    }

	    document.getElementsByName("product[largura]")[0].onchange = function() {calculaVolume();};
	    document.getElementsByName("product[altura]")[0].onchange = function() {calculaVolume();};
	    document.getElementsByName("product[comprimento]")[0].onchange = function() {calculaVolume();};

	}, 3000);

 </script>

Este código também faz o ajuste das casas decimais e limita o os campos para aceitar somente Float e pontos.