html – Criar formulário dinâmico em javascript


Estou a tentar o formulário de forma dinâmica no javascript. Para isso criei primeiro o formulário:

<form class="text-center border border-light largura" action="#!" id="retorno">

</form>

Depois tenho o script da consulta à base de dados:

if(isset($_POST("emp_aman1")))  
 {      
$query = "SELECT Tratamento, DataTermino, B.nome AS Colaborador, raddb.Status.Estado

FROM  raddb.RequesicaoManutencao AS A LEFT OUTER JOIN raddb.TratamentoManutencao

ON raddb.TratamentoManutencao.IdReq = A.Id LEFT OUTER JOIN raddb.Status

ON raddb.Status.Id = TratamentoManutencao.Estado LEFT OUTER JOIN raddb.usuarios AS B

ON B.id = TratamentoManutencao.Colaborador1

WHERE A.Id = '".$_POST("emp_aman1")."' Order By DataTermino ASC"; 

      $result = mysqli_query($conn, $query);
      $array = array();
      while($row = mysqli_fetch_array($result))  
        { 
            $array() = $row;

        }
      echo json_encode($array);  
 } 

Depois tenho o js que contrói o html dinâmico:

 $(document).on('click', '.vie_aman1', function(){  
       var emp_aman1 = $(this).attr("data-tmanu1");

       $.ajax({  
            url:"./consaman1",  
            method:"POST",
            cache: false,               
            data:{emp_aman1:emp_aman1},             
            dataType:"json",  
            success:function(data){
                var linha = ``;
                for (var i = 0; i < data.length; i++) { 
                   
                   Tratamento = data(i)(0);
                   DataTermino = data(i)(1);
                   Colaborador = data(i)(2);
                   Estado = data(i)(3);
                   
                   linha += `<div class="row" style="margin-bottom:2%;">                        
                    <div class="col-md-12 col-xs-12">
                    <div class="form-group1">
                        <textarea rows="3" readonly="true">Tratamento</textarea>
                        <label class="control-label2"><FONT COLOR="#337ab7">Tratamento</FONT></label><i class="bar1"></i>
                    </div>
                    </div>
                    </div>
                    <div class="row" style="margin-bottom:2%;">
                    <div class="col-md-4 col-xs-4">
                        <div class="form-group1">
                            <input type="text" value="DataTermino" readonly="true">
                            <label class="control-label2"><FONT COLOR="#337ab7">Data Término</FONT></label><i class="bar1"></i>
                        </div>
                    </div>
                    `; 
                    }
                    $("#retorno").html(linha);

                }
        
       });
  
  });

Constrói o html, mas com o nome das variáveis e não com os dados que retorna da base de dados