Verum/pg-adminus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

21312

Browse Source
This commit is contained in:
Verum
2026-03-18 17:03:38 +07:00
parent c9b8be54c5
commit 9f9d41f14a
1 changed files with 57 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
index.html
View File

@@ -412,6 +412,8 @@ SELECT * FROM users LIMIT 10;"></textarea>
<option value="DATE">DATE</option>
<option value="TIMESTAMP">TIMESTAMP</option>
<option value="UUID">UUID</option>
<option value="JSON">JSON</option>
<option value="JSONB">JSONB</option>
</select>
</div>
<div class="flex items-center gap-2">
@@ -626,7 +628,14 @@ SELECT * FROM users LIMIT 10;"></textarea>
// Generate rows
body.innerHTML = records.map(record => {
const pkValue = this.primaryKey ? record[this.primaryKey] : null;
const cells = columns.map(col => `<td class="p-3 border-b border-slate-100">${record[col] || ''}</td>`).join('');
const cells = columns.map(col => {
const colDef = this.tableStructure.find(c => c.name === col);
let displayValue = record[col] || '';
if (colDef && colDef.type.toLowerCase() === 'boolean') {
displayValue = record[col] === true || record[col] === 'true' ? '✓' : '✗';
}
return `<td class="p-3 border-b border-slate-100">${displayValue}</td>`;
}).join('');
const actions = pkValue ? `
<td class="p-3 border-b border-slate-100">
<button onclick="app.editRecord('${pkValue}')" class="text-blue-600 hover:underline mr-2">Редактировать</button>
@@ -674,11 +683,35 @@ SELECT * FROM users LIMIT 10;"></textarea>
// Generate form fields based on table structure
form.innerHTML = this.tableStructure.map(col => {
const value = isEdit && this.editingRecord ? '' : ''; // We'll need to load the record data
const value = isEdit && this.editingRecord ? '' : '';
let inputHtml = '';
if (col.type.toLowerCase() === 'boolean') {
inputHtml = `<input type="checkbox" name="${col.name}" class="w-4 h-4 text-blue-600 rounded focus:ring-blue-500">`;
} else if (col.type.toLowerCase().includes('json')) {
inputHtml = `<textarea name="${col.name}" rows="3" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent outline-none" placeholder='{"key": "value"}'></textarea>`;
} else {
let inputType = 'text';
let step = '';
if (col.type.toLowerCase().includes('int')) {
inputType = 'number';
} else if (col.type.toLowerCase().includes('decimal') || col.type.toLowerCase().includes('numeric')) {
inputType = 'number';
step = 'step="0.01"';
} else if (col.type.toLowerCase() === 'date') {
inputType = 'date';
} else if (col.type.toLowerCase().includes('timestamp')) {
inputType = 'datetime-local';
}
inputHtml = `<input type="${inputType}" name="${col.name}" value="${value}" ${step} class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent outline-none" placeholder="${col.type}">`;
}
return `
<div>
<label class="block text-sm font-medium text-slate-700 mb-1">${col.name}</label>
<input type="text" name="${col.name}" value="${value}" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent outline-none" placeholder="${col.type}">
<label class="block text-sm font-medium text-slate-700 mb-1">${col.name} (${col.type})</label>
${inputHtml}
</div>
`;
}).join('');
@@ -701,10 +734,14 @@ SELECT * FROM users LIMIT 10;"></textarea>
const record = data.data.find(r => r[this.primaryKey] == pkValue);
if (record) {
this.tableStructure.forEach(col => {
const input = document.querySelector(`input[name="${col.name}"]`);
const input = document.querySelector(`[name="${col.name}"]`);
if (input) {
if (col.type.toLowerCase() === 'boolean') {
input.checked = record[col.name] === true || record[col.name] === 'true';
} else {
input.value = record[col.name] || '';
}
}
});
}
} catch (err) {
@@ -713,12 +750,18 @@ SELECT * FROM users LIMIT 10;"></textarea>
}
async saveRecord() {
const formData = new FormData(document.getElementById('recordForm'));
const data = {};
for (let [key, value] of formData.entries()) {
data[key] = value;
this.tableStructure.forEach(col => {
const input = document.querySelector(`[name="${col.name}"]`);
if (input) {
if (col.type.toLowerCase() === 'boolean') {
data[col.name] = input.checked;
} else {
data[col.name] = input.value;
}
}
});
try {
let response;
@@ -743,7 +786,7 @@ SELECT * FROM users LIMIT 10;"></textarea>
this.loadTableData();
this.editingRecord = null;
} else {
this.showToast('Ошибка сохранения', 'error');
this.showToast(result.error || 'Ошибка сохранения', 'error');
}
} catch (err) {
this.showToast('Ошибка сохранения', 'error');
@@ -884,6 +927,9 @@ SELECT * FROM users LIMIT 10;"></textarea>
<option value="BOOLEAN">BOOLEAN</option>
<option value="DATE">DATE</option>
<option value="TIMESTAMP">TIMESTAMP</option>
<option value="UUID">UUID</option>
<option value="JSON">JSON</option>
<option value="JSONB">JSONB</option>
</select>
<label class="flex items-center gap-1 text-sm">
<input type="checkbox" class="w-4 h-4 text-blue-600 rounded focus:ring-blue-500"> PK