fix view in profile stream field and readme
This commit is contained in:
@@ -47,6 +47,14 @@ HTML = """<!doctype html>
|
||||
[data-view] { display: none; } [data-view].active { display: block; }
|
||||
.split { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(320px, 0.7fr); gap: 12px; }
|
||||
.table-wrap { overflow-x: auto; }
|
||||
#settingsForm label:has(#fieldPicker) { grid-column: 1 / -1; }
|
||||
#fieldPicker { margin-top: 8px; max-height: 460px; overflow: auto; border: 1px solid #d9e0e7; background: #fbfcfd; }
|
||||
.field-header, .field-row { display: grid; grid-template-columns: minmax(190px, 1.2fr) 100px minmax(180px, 1fr) minmax(320px, 1.4fr); gap: 10px; align-items: center; padding: 8px 10px; }
|
||||
.field-header { position: sticky; top: 0; background: #edf3f7; color: #536170; font-size: 12px; font-weight: 700; z-index: 1; }
|
||||
.field-row { border-top: 1px solid #e4e9ee; font-size: 13px; }
|
||||
.field-row code { width: fit-content; }
|
||||
.field-controls { display: flex; flex-wrap: wrap; gap: 10px; }
|
||||
.field-controls label { white-space: nowrap; }
|
||||
@media (max-width: 860px) { .hero, .split { grid-template-columns: 1fr; } .hero img { display: none; } }
|
||||
</style>
|
||||
</head>
|
||||
@@ -199,7 +207,8 @@ document.getElementById('loadFields').addEventListener('click', async () => {
|
||||
if (!selected) { document.getElementById('fieldPicker').textContent = 'Load streams, tick one stream, then load its fields.'; return; }
|
||||
const payload = await (await fetch(`/api/graylog/fields?stream_id=${encodeURIComponent(selected.dataset.id)}`)).json();
|
||||
const profile = (window.streamProfiles || []).find(item => item.stream_id === selected.dataset.id) || {};
|
||||
document.getElementById('fieldPicker').innerHTML = (payload.fields || []).map(field => { const name=field.name||field.field, props=(field.type||{}).properties||[]; return `<div><code>${esc(name)}</code> <label>entity <input type="radio" name="profile_entity" value="${esc(name)}" ${profile.entity_field===name?'checked':''}></label> <label>time <input type="radio" name="profile_timestamp" value="${esc(name)}" ${profile.timestamp_field===name?'checked':''}></label> ${props.includes('enumerable')?`<label>categorical <input class="profile-categorical" type="checkbox" value="${esc(name)}" ${(profile.categorical_fields||[]).includes(name)?'checked':''}></label>`:''} ${props.includes('numeric')?`<label>numeric <input class="profile-numeric" type="checkbox" value="${esc(name)}" ${(profile.numeric_fields||[]).includes(name)?'checked':''}></label>`:''}</div>`; }).join('') || esc(payload.error || 'No fields found.');
|
||||
const rows = (payload.fields || []).map(field => { const name=field.name||field.field, type=(field.type||{}).type||'', props=(field.type||{}).properties||[]; return `<div class="field-row"><code>${esc(name)}</code><span>${esc(type)}</span><span>${esc(props.join(', '))}</span><div class="field-controls"><label><input type="radio" name="profile_entity" value="${esc(name)}" ${profile.entity_field===name?'checked':''}> Entity</label><label><input type="radio" name="profile_timestamp" value="${esc(name)}" ${profile.timestamp_field===name?'checked':''}> Time</label>${props.includes('enumerable')?`<label><input class="profile-categorical" type="checkbox" value="${esc(name)}" ${(profile.categorical_fields||[]).includes(name)?'checked':''}> Categorical</label>`:''}${props.includes('numeric')?`<label><input class="profile-numeric" type="checkbox" value="${esc(name)}" ${(profile.numeric_fields||[]).includes(name)?'checked':''}> Numeric</label>`:''}</div></div>`; }).join('');
|
||||
document.getElementById('fieldPicker').innerHTML = rows ? `<div class="field-header"><span>Field</span><span>Type</span><span>Capabilities</span><span>Use In Profile</span></div>${rows}` : esc(payload.error || 'No fields found.');
|
||||
window.activeProfileStream = selected.dataset.id;
|
||||
});
|
||||
document.getElementById('settingsForm').addEventListener('submit', async event => {
|
||||
|
||||
Reference in New Issue
Block a user