usite-sas-bic/rips_manager
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix: esquema no expandía tablas — JSON.stringify con comillas rompía el onclick

Browse Source 
Reemplazado innerHTML con template literals por createElement + addEventListener.
Eliminado JSON embebido en atributos HTML. selectAll ahora busca en el array global.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Lizandro Guarnizo
2026-06-18 14:31:04 -05:00
co-authored by Claude Sonnet 4.6
parent 122d21df09
commit a212578b37
1 changed files with 41 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/templates/queries.html
+41 -23
View File
@@ -247,27 +247,43 @@ function renderSchemaTree(tablas) {
const key = t.tabla.replace(/\W/g, '_'); const key = t.tabla.replace(/\W/g, '_');
const wrap = document.createElement('div'); const wrap = document.createElement('div');
wrap.className = 'mb-0.5'; wrap.className = 'mb-0.5';
wrap.innerHTML = `
<div class="schema-table-row flex items-center gap-1 px-2 py-1 rounded cursor-pointer group select-none" // fila de la tabla
onclick="toggleCols('${key}')"> const row = document.createElement('div');
<i id="chev-${key}" class="fas fa-chevron-right text-gray-300 text-xs transition-transform duration-150" style="width:10px"></i> row.className = 'schema-table-row flex items-center gap-1 px-2 py-1 rounded cursor-pointer group select-none';
<i class="fas fa-table text-blue-400 text-xs"></i> row.innerHTML = `
<span class="font-semibold text-gray-700 flex-1 text-xs">${t.tabla}</span> <i id="chev-${key}" class="fas fa-chevron-right text-gray-300 text-xs transition-transform duration-150" style="width:10px"></i>
<span class="text-gray-300 text-xs">${t.columnas.length}</span> <i class="fas fa-table text-blue-400 text-xs"></i>
<button onclick="event.stopPropagation();selectAll('${t.tabla}',${JSON.stringify(t.columnas.map(c=>c.nombre))})" <span class="font-semibold text-gray-700 flex-1 text-xs">${t.tabla}</span>
title="SELECT *" class="hidden group-hover:inline text-blue-400 hover:text-blue-600 text-xs ml-0.5"> <span class="text-gray-300 text-xs">${t.columnas.length}</span>`;
<i class="fas fa-code"></i> row.addEventListener('click', () => toggleCols(key));
</button>
</div> // botón SELECT * — sin JSON en atributo
<div id="cols-${key}" class="hidden ml-4 border-l border-gray-200 pl-2"> const btnSelect = document.createElement('button');
${t.columnas.map(c => ` btnSelect.title = 'SELECT *';
<div class="schema-col flex items-center gap-1 px-1 py-0.5 rounded cursor-pointer text-xs" btnSelect.className = 'hidden group-hover:inline text-blue-400 hover:text-blue-600 text-xs ml-0.5';
onclick="insertarTexto('${c.nombre}')" title="Insertar ${c.nombre}"> btnSelect.innerHTML = '<i class="fas fa-code"></i>';
<i class="fas fa-columns text-gray-300" style="font-size:9px;width:10px"></i> btnSelect.addEventListener('click', e => { e.stopPropagation(); selectAll(t.tabla); });
<span class="text-gray-700 flex-1">${c.nombre}</span> row.appendChild(btnSelect);
<span class="text-gray-400" style="font-size:10px">${c.tipo}</span>
</div>`).join('')} // columnas
</div>`; const colsDiv = document.createElement('div');
colsDiv.id = 'cols-' + key;
colsDiv.className = 'hidden ml-4 border-l border-gray-200 pl-2';
t.columnas.forEach(c => {
const colRow = document.createElement('div');
colRow.className = 'schema-col flex items-center gap-1 px-1 py-0.5 rounded cursor-pointer text-xs';
colRow.title = `Insertar ${c.nombre}`;
colRow.innerHTML = `
<i class="fas fa-columns text-gray-300" style="font-size:9px;width:10px"></i>
<span class="text-gray-700 flex-1">${c.nombre}</span>
<span class="text-gray-400" style="font-size:10px">${c.tipo}</span>`;
colRow.addEventListener('click', () => insertarTexto(c.nombre));
colsDiv.appendChild(colRow);
});
wrap.appendChild(row);
wrap.appendChild(colsDiv);
tree.appendChild(wrap); tree.appendChild(wrap);
}); });
} }
@@ -286,8 +302,10 @@ function insertarTexto(texto) {
editor.focus(); editor.focus();
} }
function selectAll(tabla, columnas) { function selectAll(tabla) {
const cols = columnas.map(c => ` ${c}`).join(',\n'); const t = esquema.find(e => e.tabla === tabla);
if (!t) return;
const cols = t.columnas.map(c => ` ${c.nombre}`).join(',\n');
const sql = `SELECT\n${cols}\nFROM ${tabla}\nROWS 50`; const sql = `SELECT\n${cols}\nFROM ${tabla}\nROWS 50`;
editor.setValue(sql); editor.setValue(sql);
editor.focus(); editor.focus();