fix: form factor detail panel shows only Flexoptix transceivers
- API call: +&vendor=Flexoptix filter
- Section renamed to 'Flexoptix-Lösungen' with favicon
- Each row shows 'Shop ↗' link directly to flexoptix.net search
- 'Show all' button labeled 'Alle X Flexoptix-{FF}-Produkte'
- Primary button: flexoptix.net with form factor filter
- Empty state: friendly message when no Flexoptix products yet
This commit is contained in:
parent
3f7395ea8d
commit
15a456a0ce
@ -4861,9 +4861,10 @@ async function openFormFactorDetail(name) {
|
||||
// Open panel immediately with skeleton
|
||||
openPanel('<div style="padding:0.5rem;color:var(--text-dim);font-size:0.85rem" class="loading pulse">Lade ' + esc(name) + '…</div>');
|
||||
|
||||
// Fetch transceivers for this form factor
|
||||
var txData = await api('/api/transceivers?form_factor=' + encodeURIComponent(f.name) + '&limit=10').catch(function(){ return {}; });
|
||||
// Fetch Flexoptix transceivers for this form factor
|
||||
var txData = await api('/api/transceivers?form_factor=' + encodeURIComponent(f.name) + '&vendor=Flexoptix&limit=10').catch(function(){ return {}; });
|
||||
var txRows = txData.data || [];
|
||||
var txTotal = txData.total || txRows.length;
|
||||
|
||||
var h = '';
|
||||
|
||||
@ -4950,39 +4951,42 @@ async function openFormFactorDetail(name) {
|
||||
|
||||
// ── Transceivers in Catalog ────────────────────────────────────────────────
|
||||
h += '<div style="margin-bottom:0.85rem">';
|
||||
h += '<div style="font-size:0.7rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:var(--text-dim);margin-bottom:0.45rem">';
|
||||
h += 'Unsere Transceiver (' + (f.transceiver_count || txRows.length) + ' in Datenbank)';
|
||||
h += '<div style="display:flex;align-items:center;gap:0.5rem;margin-bottom:0.45rem">';
|
||||
h += '<div style="font-size:0.7rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:var(--text-dim)">Flexoptix-Lösungen</div>';
|
||||
h += '<img src="https://www.flexoptix.net/favicon.ico" onerror="this.style.display=\'none\'" style="width:12px;height:12px;border-radius:2px">';
|
||||
h += (txTotal > 0 ? '<span style="font-size:0.68rem;color:var(--accent);font-weight:600;margin-left:auto">' + txTotal + ' verfügbar</span>' : '');
|
||||
h += '</div>';
|
||||
if (txRows.length) {
|
||||
var speedColors2 = { 1600:'#7c3aed', 800:'#c1121f', 400:'#FF8100', 200:'#e6a800', 100:'#2d6a4f', 40:'#4287f5', 25:'#0ea5e9', 10:'#888', 1:'#555' };
|
||||
h += '<div style="display:flex;flex-direction:column;gap:0.3rem">';
|
||||
txRows.slice(0,8).forEach(function(t) {
|
||||
txRows.forEach(function(t) {
|
||||
var spCol = speedColors2[t.speed_gbps] || '#888';
|
||||
var reach = t.reach_label || (t.reach_meters ? (t.reach_meters >= 1000 ? (t.reach_meters/1000)+'km' : t.reach_meters+'m') : '');
|
||||
var shopUrl = 'https://www.flexoptix.net/en/search/ajax/suggest/?q=' + encodeURIComponent(t.part_number || '');
|
||||
h += '<div style="display:flex;align-items:center;gap:0.5rem;padding:0.35rem 0.6rem;background:var(--surface3);border-radius:7px;cursor:pointer" onclick="closePanel();openTxDetail(\'' + esc(t.id) + '\')">'
|
||||
+ '<span style="background:' + spCol + '22;color:' + spCol + ';padding:1px 6px;border-radius:5px;font-size:0.68rem;font-weight:700;white-space:nowrap">' + (t.speed_gbps || '?') + 'G</span>'
|
||||
+ '<span style="font-size:0.78rem;font-weight:600;color:var(--text-bright);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">' + esc(t.part_number || '—') + '</span>'
|
||||
+ (t.vendor_name ? '<span style="font-size:0.68rem;color:var(--text-dim);white-space:nowrap">' + esc(t.vendor_name) + '</span>' : '')
|
||||
+ (reach ? '<span style="font-size:0.68rem;color:var(--cyan);white-space:nowrap">' + esc(reach) + '</span>' : '')
|
||||
+ '<a href="' + esc(shopUrl) + '" target="_blank" rel="noopener" onclick="event.stopPropagation()" style="font-size:0.65rem;color:var(--accent);white-space:nowrap;text-decoration:none" title="Im Webshop ansehen">Shop ↗</a>'
|
||||
+ '</div>';
|
||||
});
|
||||
h += '</div>';
|
||||
if ((f.transceiver_count || 0) > 8) {
|
||||
if (txTotal > 10) {
|
||||
h += '<button class="btn" style="width:100%;margin-top:0.5rem;font-size:0.78rem;background:var(--surface3);color:var(--text)" '
|
||||
+ 'onclick="goToTab(\'transceivers\');el(\'tx-search\').value=\'' + esc(f.name) + '\';searchTransceivers();closePanel()">'
|
||||
+ 'Alle ' + (f.transceiver_count || '') + ' ' + esc(f.name) + '-Transceiver anzeigen →</button>';
|
||||
+ 'Alle ' + txTotal + ' Flexoptix-' + esc(f.name) + '-Produkte anzeigen →</button>';
|
||||
}
|
||||
} else {
|
||||
h += '<div style="font-size:0.8rem;color:var(--text-dim);padding:0.5rem 0">Noch keine Transceiver in der Datenbank.</div>';
|
||||
h += '<div style="font-size:0.8rem;color:var(--text-dim);padding:0.5rem 0;border:1px dashed var(--border);border-radius:6px;text-align:center">Noch keine Flexoptix-Produkte für ' + esc(f.name) + ' in der Datenbank.</div>';
|
||||
}
|
||||
h += '</div>';
|
||||
|
||||
// ── Action buttons ─────────────────────────────────────────────────────────
|
||||
h += '<div style="display:flex;gap:0.5rem;flex-wrap:wrap">';
|
||||
h += '<button class="btn" style="flex:1;background:' + fCl + ';color:#fff;font-size:0.8rem" '
|
||||
h += '<a href="https://www.flexoptix.net/en/optical-transceivers/?form_factor=' + encodeURIComponent(f.name.toLowerCase().replace(/[^a-z0-9]/g,'-')) + '" target="_blank" rel="noopener" class="btn" style="flex:1;background:#FF8100;color:#fff;font-size:0.8rem;text-align:center;text-decoration:none">flexoptix.net — ' + esc(f.name) + ' ↗</a>';
|
||||
h += '<button class="btn" style="font-size:0.8rem;background:var(--surface3);color:var(--text)" '
|
||||
+ 'onclick="goToTab(\'transceivers\');el(\'tx-search\').value=\'' + esc(f.name) + '\';searchTransceivers();closePanel()">'
|
||||
+ 'Alle Transceiver anzeigen →</button>';
|
||||
h += '<a href="https://www.flexoptix.net/en/search/ajax/suggest/?q=' + encodeURIComponent(f.name) + '" target="_blank" rel="noopener" class="btn" style="font-size:0.8rem;text-decoration:none">flexoptix.net ↗</a>';
|
||||
+ 'TIP DB →</button>';
|
||||
h += '</div>';
|
||||
|
||||
// ── Technical notes ────────────────────────────────────────────────────────
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user