Nenhum alvo de impersonação permitido para este usuário.
`);\n picker = `\n
\n
\n
\n ${store.get('pilotTokenInvalidReason', '') === 'sector-not-in-pilot'\n ? `
Painel exclusivo do piloto
\n
Este painel está disponível apenas para os setores que participam do piloto de remuneração. Em caso de dúvida, procure sua liderança.
`\n : `
Sessão inválida
\n
Não foi possível validar seu acesso. Faça login novamente pela Consultoria Natura para continuar.
`}\n
\n
`;\n }\n\n const topBar = d2.param('topBar','natura-x-piloto@pilotMTopBar');\n const userHeader = d2.param('userHeader','natura-x-piloto@pilotMUserHeader');\n const controls = d2.param('controls','natura-x-piloto@pilotMControls');\n const groupGrid = d2.param('groupGrid','natura-x-piloto@pilotMGroupGrid');\n const kpiGrid = d2.param('kpiGrid','natura-x-piloto@pilotMKpiGrid');\n const typeBadge = d2.param('typeBadge','natura-x-piloto@pilotMTypeBadge');\n\n // ── LIDER branch — own-performance drill view (no group grid) ──────────────\n if (!loading && data && data.perfil === 'lider'){\n const accL = d2.param('sectorAccordion','natura-x-piloto@pilotMSectorAccordion');\n const lh = (data.header) || {};\n const barL = d2.render(topBar, { title: 'Meu Desempenho', userName: (lh.leaderName || lh.name || '') }, { key:'barL', style:'display:block' });\n // STEP 3: a locked Líder (effective perfil = lider) has NO sector to return to,\n // so the back affordance is omitted entirely. Only a GV/GN who DRILLED down to a\n // leader sees \"Voltar ao Setor\".\n const backBtn = scopeLockedToGroup(d2) ? '' : `
\n `;\n const headerHostL = d2.render(userHeader, {\n name: (lh.leaderName || lh.name || ''),\n perfil: 'lider',\n nivel: (lh.nivel || data.nivel || ''),\n rede: (lh.rede || data.rede || ''),\n grupo: (lh.grupo || data.structureCode || ''),\n gvName: (lh.gvName || ''),\n cycle: (lh.cycle || data.cycle || ''),\n remuneracao: (data.remuneracao || 0),\n typeBadge: typeBadge\n }, { key:'hdrL-'+(data.structureCode||''), style:'display:block' });\n\n const aceleradores = (data.aceleradores) || [];\n const indicadores = (data.indicadores) || [];\n const acSection = aceleradores.length ? d2.render(accL, {\n items: aceleradores,\n sectionTitle: 'Aceleradores de Ganhos',\n startExpandedRef: (aceleradores[0] && aceleradores[0].ref) || ''\n }, { key:'acel-'+(data.structureCode||'')+'-'+aceleradores.length, style:'display:block' }) : '';\n const inSection = indicadores.length ? d2.render(accL, {\n items: indicadores,\n sectionTitle: 'Indicadores de Performance'\n }, { key:'indic-'+(data.structureCode||'')+'-'+indicadores.length, style:'display:block' }) : '';\n\n return `
\n
${barL}
\n ${impBar(d2)}\n
\n ${fechamentoChip(d2)}\n
${backBtn}
\n ${headerHostL}\n ${acSection}\n ${inSection}\n
\n
`;\n }\n\n // ── GV branch — GN-card grid + REDE toggle + Totalizador Rede ──────────────\n if (!loading && data && data.perfil === 'gv'){\n const gh = (data.header) || {};\n const rede = data.rede || (store ? store.get('rede','rede1') : 'rede1');\n const groupCard = d2.param('groupCard','natura-x-piloto@pilotMGroupCard');\n const totRede = (data.totalizadorRede) || {};\n const gns = (data.gns) || [];\n\n const barGv = d2.render(topBar, { title: 'Gerentes de Negócio', userName: (gh.gvName || '') }, { key:'barGv', style:'display:block' });\n const headerHostGv = d2.render(userHeader, {\n name: (gh.gvName || ''),\n perfil: 'gv',\n cycle: (gh.cycle || data.cycle || ''),\n sectorCount: (gh.sectorCount != null ? gh.sectorCount : gns.length),\n remuneracao: (totRede.remuneracao || 0)\n }, { key:'hdrGv-'+rede, style:'display:block' });\n\n const seg = (r, lbl) => `
${lbl} `;\n const toggle = `
${seg('rede1','REDE 1')}${seg('rede2','REDE 2')}
`;\n\n const totRedeComp = compOf(totRede);\n const totCard = (totRede.stats && totRede.stats.length) ? d2.render(groupCard, {\n variant: 'totalizador',\n totalLabel: (totRede.label || ('Totalizador Rede ' + String(rede).replace('rede',''))),\n rede: rede,\n stats: totRede.stats,\n remuneracao: (totRede.remuneracao || 0),\n composition: totRedeComp.composition,\n gainByRef: totRedeComp.gainByRef\n }, { key:'totrede-'+rede+'-'+(totRede.remuneracao||0), style:'display:block;height:100%;overflow:visible' }) : '';\n\n const gnCards = gns.map((g, i) => {\n const gnNatura = Number(g.compNatura || 0);\n const gnAvon = Number(g.compAvon || 0);\n const gnBonusAmbas = Number(g.compBonusAmbas || 0);\n const gnComp = { natura: gnNatura, avon: gnAvon, remunBase: (gnNatura + gnAvon), bonusAmbasMarcas: gnBonusAmbas, bonusTotal: gnBonusAmbas };\n const gnGain = (gnNatura + gnAvon) > 0 ? [{ ref: (g.rede==='rede2'?'lider-volume-pontos-marca':'lider-ativas-por-marca'), amount: (gnNatura + gnAvon), natura: gnNatura, avon: gnAvon }] : [];\n const host = d2.render(groupCard, {\n name: g.gnName,\n nivel: 'gn',\n rede: g.rede,\n remuneracao: g.remuneracao,\n codigoGrupo: g.sectorCode,\n drillCode: g.sectorCode,\n drillEvent: 'drill:gn',\n stats: g.stats || [],\n composition: gnComp,\n gainByRef: gnGain,\n drivers: g.drivers || null\n }, { key:'gn-'+g.sectorCode+'-'+(g.remuneracao||0), style:'display:block;height:100%;overflow:visible' });\n return `
${host}
`;\n }).join('');\n\n const totCell = totCard ? `
${totCard}
` : '';\n\n return `
\n
${barGv}
\n ${impBar(d2)}\n
\n ${fechamentoChip(d2)}\n ${headerHostGv}\n ${toggle}\n
Gerentes de Negócio · Rede ${String(rede).replace('rede','')}
\n
${totCell}${gnCards}
\n
\n
`;\n }\n\n const header = (data && data.header) || {};\n const tot = (data && data.totalizador) || {};\n const leaders = (data && data.leaders) || [];\n const sectorCode = header.sectorCode || (data && data.structureCode) || (store ? store.get('structureCode','') : '');\n const gnName = header.gnName || '';\n const sectorName = header.sectorName || ('Setor ' + sectorCode);\n const cycle = header.cycle || (data && data.cycle) || (store ? store.get('cycle','') : '');\n const rede = header.rede || tot.rede || '';\n\n const bar = d2.render(topBar, { title: 'Ranking de Líderes', userName: (gnName || sectorName) }, { key:'bar', style:'display:block' });\n\n const dataReady = !loading && !!data && !!data.perfil;\n if (!dataReady && !d2.state.loaderDone){\n const loadingCmp = d2.param('loading','natura-x-piloto@pilotMLoading');\n const loadDetail = (d2.state.loadDetail != null) ? d2.state.loadDetail : '';\n const loadingHost = d2.render(loadingCmp, {\n label: 'Carregando painel',\n detail: loadDetail,\n estimateMs: 18000,\n cardCount: 6,\n done: dataReady\n }, { key:'loader', style:'display:block', onDone: ()=>{ d2.state.loaderDone = true; d2.refresh(); } });\n return `
\n
${bar}
\n ${impBar(d2)}\n ${loadingHost}\n
`;\n }\n\n const headerHost = d2.render(userHeader, {\n name: (gnName || sectorName),\n perfil: perfil,\n rede: rede,\n sectorCode: sectorCode,\n cycle: cycle,\n remuneracao: tot.remuneracao || 0,\n leaderCount: (data.leaderCount != null ? data.leaderCount : leaders.length)\n }, { key:'hdr-'+sectorCode, style:'display:block' });\n\n const allGroups = mapLeaders(leaders);\n const cycles = [{ code: cycle }];\n const controlsHost = d2.render(controls, {\n groups: allGroups,\n cycles: cycles\n }, { key:'ctl', style:'display:block', onChange: (payload)=>{ d2.state.filterTick = Date.now(); } });\n\n const filtered = selectedGroup\n ? allGroups.filter(g => String(g.codigoGrupo) === String(selectedGroup))\n : allGroups;\n const totComp = compOf(tot);\n const showTot = !selectedGroup ? Object.assign({}, tot, { composition: totComp.composition, gainByRef: totComp.gainByRef }) : null;\n const titleSuffix = selectedGroup ? (' · Grupo ' + selectedGroup) : (gnName ? (' · ' + gnName) : '');\n const groupSection = d2.render(groupGrid, {\n groups: filtered,\n totalizador: showTot,\n sectionTitle: 'Ranking de Líderes' + titleSuffix\n }, { key:'groups-' + (selectedGroup || 'all'), style:'display:block' });\n\n const sectorItems = (data && data.sectorItems) || [];\n const sectorKpis = (data && data.sectorKpis) || [];\n const sectorAccordion = d2.param('sectorAccordion','natura-x-piloto@pilotMSectorAccordion');\n let sectorSection = '';\n if (!selectedGroup && sectorItems.length){\n sectorSection = d2.render(sectorAccordion, {\n items: sectorItems,\n sectionTitle: 'Indicadores do Setor',\n startExpandedRef: (sectorItems[0] && sectorItems[0].ref) || ''\n }, { key:'sectoritems-' + sectorCode + '-' + sectorItems.length, style:'display:block' });\n } else if (!selectedGroup && sectorKpis.length){\n sectorSection = d2.render(kpiGrid, {\n kpis: sectorKpis,\n sectionTitle: 'Indicadores do Setor'\n }, { key:'sectorkpis-' + sectorCode + '-' + sectorKpis.length, style:'display:block' });\n }\n\n const cameFromGv = !!(d2.shared.get('pilotGvRede','', { global:true }));\n const gnBack = cameFromGv ? `
` : '';\n\n return `
\n
${bar}
\n ${impBar(d2)}\n
\n ${fechamentoChip(d2)}\n ${gnBack}\n ${headerHost}\n ${controlsHost}\n ${groupSection}\n ${sectorSection}\n
\n
`;\n },\n async mounted(d2){\n // Bootstrap overrides from URL query (?perfil=gv&rede=rede1&structureCode=3253&gvName=...)\n // Lets a GV/GN/LIDER view be opened directly for verification without a role-switch UI.\n try{\n const store = d2.store('pilotDashboardStore');\n const q = new URLSearchParams((typeof location!=='undefined' && location.search) || '');\n if(store){\n if(q.get('perfil')) store.set('perfil', q.get('perfil'));\n if(q.get('rede')) store.set('rede', q.get('rede'));\n if(q.get('structureCode')) store.set('structureCode', q.get('structureCode'));\n if(q.get('gvName')) store.set('gvName', q.get('gvName'));\n if(q.get('cycle')){ store.set('cycle', q.get('cycle')); store.set('cycleForced', true); }\n }\n }catch(e){ d2.log('bootstrap query error', e); }\n // ── STEP 2/3 — resolve identity (token vs gv-admin) then seed + clamp scope ──\n // Runs AFTER the raw ?perfil=/?structureCode= bootstrap so the effective\n // identity's scope OVERRIDES any stale/hostile query param for a GN/Líder.\n await resolveIdentityAndSeed(d2);\n // ── ACCESS TRACKING (additive) — runs AFTER identity resolves so the session\n // carries the effective identity/scope. Reuses a stored sessionId (heartbeat)\n // or mints one (login). Never blocks the dashboard load below.\n await pilotTrackMount(d2);\n // Impersonation-bar UI events (gv-admin mode only; the render hides them in token mode).\n d2.on('.pil-switch','change',(e,el)=>{ onSwitchActingUser(d2, el && el.value); });\n d2.on('.pil-imp-open','click',()=>{ d2.state.impPickerOpen = true; d2.state.impQuery=''; ensureAllowedTargets(d2); d2.refresh(); });\n d2.on('.pil-imp-close','click',()=>{ d2.state.impPickerOpen = false; d2.refresh(); });\n d2.on('.pil-imp-search','input',(e,el)=>{ d2.state.impQuery = el ? el.value : ''; d2.refresh(); });\n d2.on('.pil-imp-pick','click',(e,el)=>{ onPickImpersonationTarget(d2, el && el.getAttribute('data-uid')); });\n d2.on('.pil-imp-exit','click',()=>{ onExitImpersonation(d2); });\n // Group selector: non-empty -> drill into that group's LIDER view; empty -> back to sector.\n d2.bus.on('filter:group', (v)=>{\n const store = d2.store('pilotDashboardStore');\n const code = (v || '');\n if(code){\n drillToLider(d2, code);\n } else if(store && store.get('perfil','gn') === 'lider'){\n backToSector(d2);\n } else {\n d2.state.selGroup = '';\n d2.refresh();\n }\n });\n // GV → GN drill: clicking a GN card emits 'drill:gn' with the sector code.\n d2.bus.on('drill:gn', (v)=>{ drillToGn(d2, (v || '')); });\n // Explicit back signal (from another component if needed)\n d2.bus.on('pilot:back', ()=>{ backToSector(d2); });\n // Back button inside this shell's LIDER header\n d2.on('.lider-back','click',()=>{ backToSector(d2); });\n // REDE 1 / REDE 2 toggle in the GV branch → switch rede param and refetch.\n d2.on('.rede-seg','click',(e,el)=>{\n const store = d2.store('pilotDashboardStore');\n const r = el && el.getAttribute('data-rede');\n if(!store || !r || store.get('rede','rede1') === r) return;\n pilotTrackView(d2, 'dashboard:gv:'+r, 'gv');\n store.set('rede', r);\n store.set('data', null);\n loadData(d2);\n });\n // GN → GV back button (only present when we drilled from a GV grid)\n d2.on('.gn-back','click',()=>{ backToGv(d2); });\n // Cycle selector → refetch the current view for the chosen cycle.\n d2.on('.pil-cycle-sel','change',(e,el)=>{\n const store = d2.store('pilotDashboardStore');\n const v = el && el.value;\n if(!store || !v || String(store.get('cycle','')) === String(v)) return;\n store.set('cycle', String(v));\n store.set('cycleUserSel', true);\n store.set('data', null);\n pilotTrackView(d2, 'dashboard:cycle:'+v, store.get('perfil','gn'));\n loadData(d2);\n });\n // App B: an invalid token shows the \"sessão inválida\" screen — do NOT fetch\n // default dashboard data (that would render a silent full-GV view = scope leak).\n const storeM = d2.store('pilotDashboardStore');\n if(storeM && storeM.get('pilotTokenInvalid', false)){\n pilotTrackEnd(d2); // token invalid → end any session from this browser session\n d2.state.loaderDone = true; d2.refresh(); return;\n }\n await loadData(d2);\n // Initial section view for the entry screen (after data resolves so perfil is known).\n try{\n const p = storeM ? storeM.get('perfil','gn') : 'gn';\n pilotTrackView(d2, 'dashboard:'+p, p);\n }catch(e){}\n // NOTE: intentionally NO 'pagehide'/'beforeunload' session-end — those fire on a\n // plain RELOAD too, which would end the session and break the one-session-per-browser\n // guarantee (a reload must REUSE the stored sessionId). Abandoned sessions are derived\n // as expired in the stats screen via the 30-min lastSeenAt TTL; explicit session-end is\n // reserved for logout / token-invalid (handled above and on the invalid-token branch).\n }\n};"}},"store":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"store"}}}},"api":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"api"}}}},"topBar":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"topBar"}}}},"userHeader":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"userHeader"}}}},"controls":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"controls"}}}},"kpiGrid":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"kpiGrid"}}}},"groupGrid":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"groupGrid"}}}}}}}}}},{"_id":"6a484afcb0a857d0aa64c9f0","component":"data2-core-types@Component","system":"688179c2a93dd170ce61e598","params":{"extends":"data2-core-primitives@Block","component":"pilotMTokenProbe","package":"natura-x-piloto","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"export default {\n render(d2){\n return `
pending… `;\n },\n async mounted(d2, root){\n const show = (msg)=>{ const p=root.querySelector('.probe'); if(p) p.textContent=msg; };\n let out = [];\n // 1) d2.exec of the headless CD\n try {\n const r = await d2.exec({ component:'natura-x-piloto@pilotMTokens', params:{} });\n out.push('exec='+(r&&r.color?('OK '+r.color.naturaMagenta):(typeof r)));\n } catch(e){ out.push('exec THREW '+String(e).slice(0,60)); }\n // 2) d2.process\n try {\n const pr = d2.process ? d2.process('pilotMTokens') : null;\n const keys = pr ? Object.keys(pr).slice(0,8).join(',') : '';\n let val;\n try { val = pr && pr.invoke ? await pr.invoke({}) : undefined; } catch(e2){ val = 'invErr:'+String(e2).slice(0,40); }\n const shape = (val&&val.color)?('OK '+val.color.naturaMagenta):(typeof val==='string'?val:typeof val);\n out.push('invoke='+shape);\n } catch(e){ out.push('process THREW '+String(e).slice(0,40)); }\n show(out.join(' | '));\n }\n};"}}}}}}}},{"_id":"6a490aa7e3014dd5bb70bd32","component":"data2-core-types@Component","system":"688179c2a93dd170ce61e598","params":{"extends":"data2-core-primitives@Block","component":"pilotMControls","package":"natura-x-piloto","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"function esc(s){ return String(s==null?'':s).replace(/&/g,'&').replace(//g,'>').replace(/\"/g,'"'); }\nexport default {\n css: `\n :host{display:block}\n .ctl{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;background:#FFFFFF;border:1px solid rgba(16,24,40,0.08);\n border-radius:14px;padding:14px 16px;box-sizing:border-box;box-shadow:0 1px 3px rgba(16,24,40,.06);\n font-family:Roboto,system-ui,sans-serif}\n .fld{display:flex;flex-direction:column;gap:5px;min-width:0}\n .fld.grow{flex:1 1 260px}\n .lbl{font:600 10px/1 'Roboto',sans-serif;letter-spacing:.6px;text-transform:uppercase;color:#6B7280}\n .sel{appearance:none;-webkit-appearance:none;width:100%;box-sizing:border-box;height:40px;padding:0 34px 0 12px;\n border:1px solid rgba(16,24,40,0.14);border-radius:10px;background:#FFFFFF;color:#1A1C1E;font:500 13px/1 'Roboto',sans-serif;\n cursor:pointer;transition:border-color 150ms ease-out,box-shadow 150ms ease-out;\n background-image:url(\"data:image/svg+xml;utf8,
\");\n background-repeat:no-repeat;background-position:right 10px center}\n .sel:focus{outline:none;border-color:#E5004B;box-shadow:0 0 0 3px rgba(229,0,75,.12)}\n .sel.cycle{min-width:150px}\n .clr{height:40px;padding:0 14px;border:1px solid rgba(16,24,40,0.14);border-radius:10px;background:#F7F8FA;color:#4A5560;\n font:600 12px/1 'Roboto',sans-serif;cursor:pointer;transition:background 150ms ease-out}\n .clr:hover{background:#EEF0F3}\n .clr[disabled]{opacity:.45;cursor:default}\n @media (max-width:640px){.ctl{flex-direction:column;align-items:stretch}.fld.grow{flex:1 1 auto}}\n `,\n render(d2){\n const store = d2.store('pilotDashboardStore');\n const groups = d2.param('groups', []) || [];\n const cycles = d2.param('cycles', []) || [];\n const selGroup = d2.shared.get('pilotSelectedGroup', '', { global:true });\n const selCycle = store ? (store.get('cycle','') || '') : '';\n\n const grpOpts = ['
Todos os grupos '].concat(\n groups.map(g => {\n const code = (g.codigoGrupo != null ? g.codigoGrupo : g.grupo);\n const nm = g.name || g.leaderName || '';\n const txt = code + (nm ? (' — ' + nm) : '');\n const sel = (String(code) === String(selGroup)) ? ' selected' : '';\n return `
${esc(txt)} `;\n })\n ).join('');\n\n const cycOpts = (cycles.length ? cycles : [selCycle]).map(c => {\n const code = (c && c.code != null) ? c.code : c;\n const sel = (String(code) === String(selCycle)) ? ' selected' : '';\n return `
Ciclo ${esc(code)} `;\n }).join('');\n\n return `
\n
\n Grupo \n ${grpOpts} \n
\n
\n Ciclo \n ${cycOpts} \n
\n
Limpar \n
`;\n },\n mounted(d2){\n d2.on('.group','change',(e,el)=>{\n const store = d2.store('pilotDashboardStore');\n if(store) store.set('selectedGroup', el.value || '');\n d2.shared.set('pilotSelectedGroup', el.value || '', { global:true });\n d2.bus.emit('filter:group', el.value || '');\n d2.emit('onChange', { type:'group', value: el.value || '' });\n });\n d2.on('.cycle','change',(e,el)=>{\n const store = d2.store('pilotDashboardStore');\n if(store){ store.set('cycle', el.value || ''); store.set('data', null); store.set('loading', false); }\n d2.emit('onChange', { type:'cycle', value: el.value || '' });\n });\n d2.on('.clr','click',()=>{\n const store = d2.store('pilotDashboardStore');\n if(store) store.set('selectedGroup', '');\n d2.shared.set('pilotSelectedGroup', '', { global:true });\n d2.bus.emit('filter:group', '');\n d2.emit('onChange', { type:'group', value:'' });\n });\n }\n};"}},"store":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"store"}}}},"groups":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"groups"}}}},"cycles":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"cycles"}}}},"onChange":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"onChange"}}}}}}}}}},{"_id":"6a4bbd245059efc0d0a5247e","component":"data2-core-types@Component","system":"688179c2a93dd170ce61e598","params":{"extends":"data2-core-primitives@Block","component":"pilotMSectorAccordion","package":"natura-x-piloto","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"const FALLBACK = { color:{ surface:'#FFFFFF', ink:'#1A1C1E', muted:'#6B7280', hairline:'rgba(16,24,40,0.08)', rampRed:'#FF1418', rampAmber:'#FAA000', rampGreen:'#29AC56', goldIap:'#FFCF30', naturaMagenta:'#E5004B', naturaOrange:'#EB6619', money:'#29AC56' } };\nlet TOK;\nfunction tok(d2){ if(!TOK){ try{ TOK = d2.call('natura-x-piloto@pilotMTokens'); }catch(e){} if(!TOK||!TOK.color) TOK = FALLBACK; } return TOK; }\nfunction statusColor(t, status){\n if(status==='green') return t.color.rampGreen;\n if(status==='amber') return t.color.rampAmber;\n if(status==='red') return t.color.rampRed;\n return t.color.muted;\n}\nfunction attColor(t, pct){ const p=Number(pct||0); if(p>=100) return t.color.rampGreen; if(p>=60) return t.color.rampAmber; return t.color.rampRed; }\nfunction num(n){ if(n===null||n===undefined) return '—'; try{ return Number(n).toLocaleString('pt-BR',{maximumFractionDigits:0}); }catch(e){ return String(n); } }\nfunction brl(n){ try{ return Number(n||0).toLocaleString('pt-BR',{style:'currency',currency:'BRL'}); }catch(e){ return 'R$ '+Number(n||0).toLocaleString('pt-BR',{minimumFractionDigits:2,maximumFractionDigits:2}); } }\nfunction esc(s){ return String(s==null?'':s).replace(/&/g,'&').replace(//g,'>'); }\nfunction svgIcon(iconId, color){\n const c = color || '#6B7280';\n const w = 'width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"'+c+'\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"';\n const P = {\n 'people': '
',\n 'crown': '';\n return ''+path+' ';\n}\nexport default {\n css: `\n :host{display:block;overflow:visible!important}\n /* Shadow fix: the accordion's own code-component host clips at its edge; pad the shadow-root\n content 18px on the sides + bottom so each hover-lifted line's box-shadow stays within the host. */\n .sa{display:flex;flex-direction:column;gap:12px;padding:2px 18px 18px;box-sizing:border-box}\n .sa-h{font:600 15px/1 'Roboto',system-ui,sans-serif;color:#1A1C1E;display:flex;align-items:center;gap:8px}\n .sa-h::before{content:'';width:4px;height:16px;border-radius:2px;background:linear-gradient(135deg,#E5004B 0%,#EB6619 100%)}\n .sa-list{display:flex;flex-direction:column;gap:12px}\n .it{background:#FFFFFF;border:1px solid rgba(16,24,40,0.08);border-radius:16px;box-sizing:border-box;overflow:visible;\n box-shadow:0 1px 2px rgba(16,24,40,0.04),0 1px 3px rgba(16,24,40,0.08);\n transition:box-shadow 150ms ease-out,transform 150ms ease-out}\n .it:hover{box-shadow:0 4px 12px rgba(16,24,40,0.10);transform:translateY(-1px)}\n .it[data-open]{box-shadow:0 6px 18px rgba(16,24,40,0.12)}\n .it-head{display:flex;align-items:center;gap:14px;padding:16px;cursor:pointer;position:relative;border-radius:16px;\n transition:background 150ms ease-out}\n .it-head:hover{background:#F7F8FA}\n .it-ic{width:40px;height:40px;flex:none;border-radius:12px;display:flex;align-items:center;justify-content:center;\n background:#F3F4F6}\n .it[data-iap] .it-ic{background:rgba(255,207,48,0.22)}\n .it-mid{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:7px}\n .it-toprow{display:flex;align-items:flex-start;gap:8px}\n .it-lbl{font:600 15px/1.25 'Roboto',sans-serif;color:#1A1C1E;white-space:normal;overflow-wrap:anywhere;min-width:0}\n .it-iapchip{flex:none;display:inline-flex;align-items:center;height:19px;padding:0 8px;border-radius:999px;\n background:#FFCF30;color:#5A4600;font:700 9.5px/1 'Roboto',sans-serif;letter-spacing:.5px}\n .it-bonuschip{flex:none;display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 10px;border-radius:999px;\n font:700 10px/1 'Roboto',sans-serif;letter-spacing:.3px}\n .it-bonuschip.yes{background:rgba(41,172,86,0.14);color:#1E7D3E}\n .it-bonuschip.no{background:#F1F2F4;color:#8A929B}\n .it-bonuschip svg{width:12px;height:12px}\n .it-gain{flex:none;display:inline-flex;align-items:center;gap:4px;height:24px;padding:0 11px;border-radius:999px;\n background:rgba(41,172,86,0.12);color:#1E7D3E;font:700 13px/1 'Roboto',sans-serif;letter-spacing:.2px;white-space:nowrap;\n font-variant-numeric:tabular-nums}\n .it-gain.zero{background:#F1F2F4;color:#8A929B}\n .it-gain svg{width:13px;height:13px}\n .it-right{flex:none;display:flex;align-items:center;gap:10px}\n .it-bar{display:flex;align-items:center;gap:10px}\n .it-track{flex:1 1 auto;height:6px;border-radius:999px;background:rgba(16,24,40,0.07);overflow:hidden}\n .it-fill{height:100%;border-radius:999px;width:0;transition:width 500ms cubic-bezier(0.4,0,0.2,1)}\n .it-vals{flex:none;display:flex;align-items:baseline;gap:5px;font-variant-numeric:tabular-nums}\n .it-v{font:700 15px/1 'Roboto',sans-serif;color:#1A1C1E}\n .it-g{font:400 12px/1 'Roboto',sans-serif;color:#9AA1A9}\n .it-pct{flex:none;font:700 13px/1 'Roboto',sans-serif;min-width:42px;text-align:right}\n .it-caret{width:26px;height:26px;flex:none;display:flex;align-items:center;justify-content:center;color:#6B7280;font-size:16px;\n transition:transform 280ms cubic-bezier(0.2,0,0,1)}\n .it[data-open] .it-caret{transform:rotate(180deg)}\n .it-body{max-height:0;opacity:0;overflow:hidden;\n transition:max-height 280ms cubic-bezier(0.2,0,0,1),opacity 280ms cubic-bezier(0.2,0,0,1)}\n .it[data-open] .it-body{max-height:900px;opacity:1}\n .it-bodyin{padding:2px 16px 16px 16px}\n .it-dettitle{font:700 10.5px/1 'Roboto',sans-serif;color:#6B7280;letter-spacing:.6px;text-transform:uppercase;margin:6px 0 12px}\n .it-kgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}\n @media (max-width:640px){\n .it-head{flex-wrap:wrap;gap:10px 12px;padding:14px}\n .it-mid{flex:1 1 calc(100% - 92px)}\n .it-caret{order:2}\n .it-right{order:3;flex:1 1 100%;justify-content:flex-start;flex-wrap:wrap;padding-left:52px}\n }\n @media (prefers-reduced-motion: reduce){.it,.it-caret,.it-body,.it-fill{transition:none}.it:hover{transform:none}\n .it[data-open] .it-body{max-height:none}}\n `,\n render(d2){\n const t = tok(d2);\n const items = d2.param('items', []) || [];\n const title = d2.param('sectionTitle','Indicadores do Setor');\n const kpiCard = d2.param('kpiCard','natura-x-piloto@pilotMKpiCard');\n const brandMark = d2.param('brandMark','natura-x-piloto@pilotMBrandMark');\n if(!d2.state.open){\n const initial = {};\n const startRef = d2.param('startExpandedRef','');\n if(startRef) initial[startRef] = true;\n d2.state.open = initial;\n }\n const openMap = d2.state.open || {};\n\n const lines = items.map((it, idx) => {\n const ref = it.ref || ('item-'+idx);\n const open = !!openMap[ref];\n const main = it.main || {};\n const isIap = it.agrupamento === 'indicador-iap';\n const isBonus = !!it.isBonus;\n const status = main.status || 'none';\n const sCol = statusColor(t, status);\n const at = main.atingimento;\n const hasGoal = main.goal !== null && main.goal !== undefined && Number(main.goal) > 0;\n const clamped = (at !== null && at !== undefined) ? Math.max(0, Math.min(100, Number(at))) : 0;\n\n const iconTint = isIap ? '#8A6D00' : (sCol || t.color.muted);\n const iconHtml = svgIcon(it.icon || main.icon || '', iconTint);\n const iapChip = isIap ? `IAP ` : '';\n\n // right-side: bonus → chip; else value/goal + pct\n let rightHtml;\n if(isBonus){\n const will = it.willReceive === true;\n const chk = '${chk} Vai receber `\n : `${dash} Não atingido `;\n } else {\n const goalHtml = hasGoal ? `/ ${num(main.goal)} ` : '';\n rightHtml = `${num(main.value)} ${goalHtml}+${brl(g)} ` : '';\n } else {\n const upSvg = '${upSvg} +${brl(g)} `\n : `R$ 0 `;\n }\n }\n const rightGroup = `${rightHtml}${gainHtml} `;\n\n // slim progress bar in collapsed line (only when the main KPI has a goal)\n const barHtml = (hasGoal)\n ? `\n
\n
${(at!==null&&at!==undefined)?Number(at).toFixed(0)+'%':''} \n
Sem meta
`);\n\n // DETALHES sub-cards — related KPIs, else the main itself as a single detail card\n const detailSource = (it.related && it.related.length) ? it.related : [{\n code: main.code, label: main.label, value: main.value, goal: main.goal, description: it.detailNote || main.label\n }];\n const subCards = detailSource.map((k, ki) => {\n return d2.render(kpiCard, {\n cardTitle: k.label,\n value: k.value,\n goal: k.goal,\n description: k.description || '',\n iap: false\n }, { key: 'kc-'+ref+'-'+(k.code||ki)+'-'+(open?'o':'c'), style:'display:block;height:100%' });\n }).join('');\n\n const bodyHtml = `\n
Detalhes${(it.related&&it.related.length)?'':' do indicador'}
\n
${subCards}
\n
\n
\n ${iconHtml} \n \n ${esc(it.label)} ${iapChip} \n ${rightGroup}\n ⌄ \n
\n ${bodyHtml}\n
\n
${esc(title)}
\n
${lines}
\n
\n \n
\n
\n
\n
\n \n
\n
\n
\n ${String(label).replace(/\n 0% \n
\n
\n
${String(detail).replace(/\n
\n
\n
\n
${cards.join('')}
\n
\n
`;\n },\n mounted(d2, root){\n const start = (typeof performance!=='undefined' ? performance.now() : Date.now());\n const estimate = Math.max(3000, Number(d2.param('estimateMs', 18000)) || 18000);\n const fillEl = root.querySelector('[data-fill]');\n const pctEl = root.querySelector('[data-pct]');\n const detEl = root.querySelector('[data-detail]');\n const subEl = root.querySelector('[data-sub]');\n const rootEl = root.querySelector('[data-root]');\n const reduce = (typeof window!=='undefined' && window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches);\n let shown = 0; // 0..100, monotonic\n let fading = false;\n let finishing = false;\n let capActive = false; // whether the indeterminate stripe / creep phase is engaged\n let subLevel = 0; // 0 none, 1 \"consolidando\", 2 \"quase lá\"\n const paint = (p) => {\n const v = Math.max(0, Math.min(100, p));\n if(v > shown) shown = v; // never go backwards\n if(fillEl) fillEl.style.width = shown.toFixed(1) + '%';\n if(pctEl) pctEl.textContent = Math.round(shown) + '%';\n };\n // Engage the \"alive at the cap\" treatment: travelling indeterminate stripe (skipped under reduced motion).\n const setCap = (on) => {\n if(on === capActive) return;\n capActive = on;\n if(fillEl){ if(on && !reduce) fillEl.setAttribute('data-cap',''); else fillEl.removeAttribute('data-cap'); }\n };\n // Reassuring secondary line — appears after a few seconds, escalates once more further in.\n const setSub = (level) => {\n if(level === subLevel || !subEl) return;\n subLevel = level;\n if(level === 0){ subEl.removeAttribute('data-on'); return; }\n subEl.textContent = level >= 2 ? 'Quase lá…' : 'Consolidando dados do setor…';\n subEl.setAttribute('data-on','');\n };\n const done = () => {\n const p = d2.param('progress', null);\n return d2.param('done', false) === true || (typeof p === 'number' && p >= 1);\n };\n // Real-progress override (stretch): if a numeric `progress` (0..1) is supplied,\n // follow it instead of the eased estimate. Never regresses (paint clamps).\n d2.raf(() => {\n // refresh detail text live (real \"X de N\" if the shell supplies it)\n if(detEl){ const d = d2.param('detail',''); if(d !== detEl.textContent) detEl.textContent = String(d); }\n if(done()){\n if(!finishing){\n finishing = true;\n setCap(false); // drop the indeterminate stripe; this is a determinate finish now\n if(reduce){\n // reduced motion: jump straight to 100 and skip the fade entirely\n paint(100);\n d2.emit('onDone');\n } else {\n // VISIBLE completion: tween current -> 100 over ~350ms, hold ~150ms, then fade ~300ms.\n if(fillEl) fillEl.setAttribute('data-finish',''); // engages the 350ms width transition\n shown = 100;\n if(fillEl) fillEl.style.width = '100%';\n if(pctEl) pctEl.textContent = '100%';\n setSub(0);\n fading = true;\n setTimeout(() => { if(rootEl) rootEl.setAttribute('data-fading',''); }, 500); // 350 fill + 150 hold\n setTimeout(() => { d2.emit('onDone'); }, 800); // + ~300ms fade\n }\n }\n return false; // stop the loop once completion has been kicked off\n }\n const now = (typeof performance!=='undefined' ? performance.now() : Date.now());\n const elapsed = now - start;\n const pOverride = d2.param('progress', null);\n let target;\n if(typeof pOverride === 'number'){\n target = Math.min(90, pOverride * 100); // hold below the cap until `done`\n } else {\n target = eased(elapsed / estimate) * 100;\n }\n // Once the eased fill has reached the ~90% ceiling and we're still waiting, keep the bar alive:\n // - engage the travelling indeterminate stripe, and\n // - apply a slow asymptotic micro-creep 90 -> ~97 so the numbers keep inching (never hits 100).\n if(target >= 89.5){\n setCap(true);\n const secPastCap = Math.max(0, (elapsed - estimate) / 1000);\n target = Math.max(target, creep(secPastCap));\n }\n paint(target);\n // reassuring sub-label: appears after ~7s still loading, escalates after ~14s\n if(elapsed >= 14000) setSub(2);\n else if(elapsed >= 7000) setSub(1);\n });\n }\n};"}},"done":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"done"}}}},"estimateMs":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"estimateMs"}}}},"label":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"label"}}}},"detail":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"detail"}}}},"progress":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"progress"}}}},"cardCount":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"cardCount"}}}}}}}}}},{"_id":"6a4c0ae108850cd753f0647a","component":"data2-core-types@Component","system":"688179c2a93dd170ce61e598","params":{"extends":"data2-core-primitives@Block","component":"pilotAdmCard","package":"natura-x-piloto","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"const FALLBACK = {\n color:{surface:'#FFFFFF',ground:'#FAFAFB',ink:'#1A1C1E',muted:'#6B7280',hairline:'rgba(16,24,40,0.08)',naturaMagenta:'#E5004B',naturaOrange:'#EB6619',brandGradient:'linear-gradient(135deg,#E5004B 0%,#EB6619 100%)',gold:'#F7BE00',money:'#29AC56'},\n radius:{sm:8,md:12,lg:16,pill:999},\n type:{family:\"'Roboto',system-ui,-apple-system,sans-serif\",h2:'20px',title:'15px',body:'13px',caption:'11px'},\n shadow:{card:'0 1px 2px rgba(16,24,40,0.04),0 1px 3px rgba(16,24,40,0.08)',raised:'0 8px 24px rgba(16,24,40,0.18)'}\n};\nlet TOK;\nfunction tok(d2){ if(!TOK){ try{ TOK = d2.call('natura-x-piloto@pilotMTokens'); }catch(e){} if(!TOK||!TOK.color) TOK = FALLBACK; } return TOK; }\n\n// Lucide (ISC) — paths inline, sem lib\nconst LUCIDE = {\n 'brand-natura':'
',\n 'brand-avon':'
',\n 'people':'
',\n 'crown':'',\n 'coins':'',\n 'chart':'${LUCIDE[name]||LUCIDE.chart} `; }\nconst ICON = (()=>{\n const S = (p)=>`${p} `;\n return {\n edit:S('')\n };\n})();\nconst AGRUP_LABEL = { 'ranking-stat':'Ranking', 'acelerador':'Acelerador', 'indicador-iap':'IAP' };\nconst PERFIL_LABEL = { gn:'GN', lider:'Líder', gv:'GV', all:'Todos' };\nconst REDE_LABEL = { rede1:'Rede 1', rede2:'Rede 2', both:'Ambas' };\nfunction sectionLabel(s){\n const m = {'leader-card':'Cartão Líder','sector':'Setor','sector-kpi':'KPI Setor','leader':'Líder','kpis':'KPIs','totalizador':'Totalizador'};\n return m[s] || (s||'—');\n}\nfunction esc(s){ return String(s==null?'':s).replace(/&/g,'&').replace(//g,'>').replace(/\"/g,'"'); }\n\nexport default {\n css: `\n :host{display:block}\n .pad{padding:9px;box-sizing:border-box;height:100%}\n .card{position:relative;background:var(--surface);border:1px solid var(--hair);border-radius:var(--rlg);\n padding:14px 16px;box-sizing:border-box;box-shadow:var(--sh);display:flex;gap:12px;align-items:flex-start;\n transition:box-shadow .15s ease-out, transform .15s ease-out;overflow:hidden}\n .card:hover{box-shadow:var(--shr);transform:translateY(-1px)}\n .card.drag{box-shadow:var(--shr);transform:scale(1.015)}\n .card.off{opacity:.55}\n .card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--accent);border-radius:4px 0 0 4px}\n .handle{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:26px;height:34px;margin-top:2px;\n color:var(--muted);cursor:grab;border-radius:8px;font-size:16px;line-height:1;user-select:none;touch-action:none;\n transition:background .15s}\n .handle:hover{background:var(--ground);color:var(--ink)}\n .glyph{flex:0 0 auto;width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;\n background:var(--ground);color:var(--accent)}\n .glyph .lu{width:20px;height:20px;display:block}\n .body{flex:1 1 auto;min-width:0}\n .top{display:flex;align-items:center;gap:8px}\n .label{font:600 15px/1.25 var(--fam);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n .order{flex:0 0 auto;font:700 11px/1 var(--fam);color:var(--muted);background:var(--ground);border-radius:999px;padding:4px 8px}\n .chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}\n .chip{font:600 11px/1 var(--fam);padding:5px 9px;border-radius:999px;background:var(--ground);color:var(--muted);white-space:nowrap}\n .chip.p{background:rgba(229,0,75,.10);color:var(--mag)}\n .kpi{margin-top:9px;font:500 12px/1.3 var(--fam);color:var(--muted)}\n .kpi b{color:var(--ink);font-weight:600}\n .tag{display:inline-flex;align-items:center;gap:4px;margin-top:9px;font:700 10px/1 var(--fam);letter-spacing:.04em;\n text-transform:uppercase;padding:5px 8px;border-radius:999px}\n .tag.iap{background:rgba(247,190,0,.16);color:#9a7400}\n .actions{flex:0 0 auto;display:flex;align-items:center;gap:4px;opacity:0;transition:opacity .15s}\n .card:hover .actions{opacity:1}\n .act{width:30px;height:30px;border:none;border-radius:9px;background:var(--ground);color:var(--muted);cursor:pointer;\n font-size:13px;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s}\n .act:hover{background:rgba(229,0,75,.10);color:var(--mag)}\n .ic-svg{display:block;flex:0 0 auto}\n .handle .ic-svg{width:18px;height:18px}\n .act .ic-svg{width:16px;height:16px}\n .act.del:hover{background:rgba(229,0,75,.14);color:var(--mag)}\n .act.del.confirm{width:auto;padding:0 10px;background:var(--mag);color:#fff;font:700 11px/1 var(--fam);animation:cfpop .18s ease-out}\n @keyframes cfpop{from{transform:scale(.8);opacity:.5}to{transform:scale(1);opacity:1}}\n .toggle{flex:0 0 auto;width:38px;height:22px;border-radius:999px;background:#D1D5DB;position:relative;cursor:pointer;\n transition:background .18s;border:none;padding:0}\n .toggle.on{background:var(--green)}\n .toggle i{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .18s;\n box-shadow:0 1px 2px rgba(0,0,0,.2)}\n .toggle.on i{transform:translateX(16px)}\n @media (prefers-reduced-motion: reduce){\n .card,.card:hover,.act,.toggle,.toggle i,.handle,.actions{transition:none!important}\n .card:hover{transform:none}\n }\n `,\n render(d2){\n const t = tok(d2);\n const it = d2.param('item', {}) || {};\n const dragging = !!d2.param('dragging', false);\n const kpiName = d2.param('kpiName','');\n const accent = it.isBonus ? t.color.gold : t.color.naturaMagenta;\n const glyph = lucide(it.icon);\n const visible = it.visible !== false;\n const mainLine = it.mainKpiCode ? `KPI principal · ${esc(kpiName || it.mainKpiCode)} ` : 'Sem KPI principal';\n const rel = Array.isArray(it.relatedKpiCodes) ? it.relatedKpiCodes.length : 0;\n return `\n \n
\n
${ICON.grip}
\n
${glyph}
\n
\n
\n ${esc(it.label||'(sem título)')} \n #${esc(it.displayOrder!=null?it.displayOrder:'—')} \n
\n
\n ${esc(PERFIL_LABEL[it.perfil]||it.perfil||'—')} \n ${esc(REDE_LABEL[it.rede]||it.rede||'—')} \n ${esc(sectionLabel(it.section))} \n ${esc(AGRUP_LABEL[it.agrupamento]||it.agrupamento||'—')} \n
\n
${mainLine}${rel?` · ${rel} relacionado${rel>1?'s':''}`:''}
\n ${it.isBonus?`
★ IAP / Bônus `:''}\n
\n
\n ${ICON.edit} \n ${ICON.dup} \n ${d2.state.confirmDel\n ? `Excluir? `\n : `${ICON.del} `}\n
\n
\n
\n
',\n 'crown':'',\n 'coins':'',\n 'plus':'${LUCIDE[name]} ` : ''; }\nfunction enumLabel(field,val){ const e=(ENUMS[field]||[]).find(x=>x[0]===val); return e?e[1]:(val||'Selecione…'); }\nfunction esc(s){ return String(s==null?'':s).replace(/&/g,'&').replace(//g,'>').replace(/\"/g,'"'); }\n\nfunction emptyItem(){\n return { ref:'', label:'', icon:'people', agrupamento:'ranking-stat', section:'sector', perfil:'gn', rede:'rede1',\n mainKpiCode:'', relatedKpiCodes:[], isBonus:false, visible:true, displayOrder:1 };\n}\nfunction kpiName(list,code){ const k=(list||[]).find(x=>String(x.code)===String(code)); return k?k.name:code; }\n\nexport default {\n css: `\n :host{display:block}\n .scrim{position:fixed;inset:0;z-index:9000;display:flex;align-items:flex-start;justify-content:center;\n background:rgba(16,24,40,.44);backdrop-filter:blur(2px);opacity:0;transition:opacity .22s ease-out;\n overflow-y:auto;padding:40px 16px}\n .scrim.in{opacity:1}\n .modal{width:100%;max-width:560px;background:var(--surface);border-radius:20px;box-shadow:0 24px 64px rgba(16,24,40,.28);\n transform:scale(.94) translateY(8px);opacity:0;transition:transform .24s cubic-bezier(.2,0,0,1),opacity .24s ease-out;\n overflow:hidden;margin:auto 0}\n .scrim.in .modal{transform:scale(1) translateY(0);opacity:1}\n .head{padding:20px 22px 14px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--hair)}\n .head .hg{width:40px;height:40px;border-radius:12px;background:var(--grad);display:flex;align-items:center;justify-content:center;font-size:20px}\n .head h3{margin:0;font:700 20px/1.1 var(--fam);color:var(--ink)}\n .head p{margin:2px 0 0;font:400 12px/1.2 var(--fam);color:var(--muted)}\n .x{margin-left:auto;width:34px;height:34px;border:none;border-radius:10px;background:var(--ground);color:var(--muted);\n font-size:16px;cursor:pointer;transition:background .15s}\n .x:hover{background:rgba(229,0,75,.10);color:var(--mag)}\n .form{padding:18px 22px 8px;max-height:60vh;overflow-y:auto}\n .row{display:flex;gap:12px}\n .row>.field{flex:1 1 0;min-width:0}\n .field{margin-bottom:15px}\n label{display:block;font:600 12px/1 var(--fam);color:var(--ink);margin-bottom:7px}\n input[type=text],input[type=number]{width:100%;box-sizing:border-box;padding:11px 12px;border:1.5px solid var(--hair);\n border-radius:11px;font:400 14px/1.2 var(--fam);color:var(--ink);background:var(--surface);outline:none;transition:border-color .15s}\n input:focus{border-color:var(--mag)}\n .sel{position:relative}\n .sel .trigger{width:100%;box-sizing:border-box;padding:11px 12px;border:1.5px solid var(--hair);border-radius:11px;\n font:500 14px/1.2 var(--fam);color:var(--ink);background:var(--surface);cursor:pointer;display:flex;align-items:center;\n justify-content:space-between;gap:8px;text-align:left}\n .sel .trigger:hover{border-color:var(--muted)}\n .sel .trigger .cv{color:var(--muted);transition:transform .18s}\n .sel.open .trigger{border-color:var(--mag)}\n .sel.open .trigger .cv{transform:rotate(180deg)}\n .menu{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:20;background:var(--surface);border:1px solid var(--hair);\n border-radius:12px;box-shadow:0 12px 32px rgba(16,24,40,.16);padding:5px;max-height:230px;overflow-y:auto;\n transform-origin:top;transform:scaleY(.6);opacity:0;pointer-events:none;transition:transform .16s cubic-bezier(.2,0,0,1),opacity .16s}\n .sel.open .menu{transform:scaleY(1);opacity:1;pointer-events:auto}\n .opt{padding:9px 11px;border-radius:8px;font:500 13px/1.2 var(--fam);color:var(--ink);cursor:pointer;transition:background .12s}\n .opt:hover{background:var(--ground)}\n .opt,.lbl{display:flex;align-items:center;gap:8px}\n .opt .lu,.lbl .lu{width:16px;height:16px;flex:0 0 auto;color:var(--mag)}\n .head .hg{color:#fff}\n .head .hg .lu{width:20px;height:20px}\n .opt.on{background:rgba(229,0,75,.10);color:var(--mag);font-weight:600}\n .search{width:100%;box-sizing:border-box;padding:8px 10px;border:1px solid var(--hair);border-radius:8px;margin-bottom:5px;\n font:400 13px/1.2 var(--fam);outline:none}\n .search:focus{border-color:var(--mag)}\n .chips{display:flex;flex-wrap:wrap;gap:7px;padding:10px;border:1.5px dashed var(--hair);border-radius:11px;min-height:20px}\n .chip{display:inline-flex;align-items:center;gap:6px;font:600 12px/1 var(--fam);padding:6px 8px 6px 10px;border-radius:999px;\n background:rgba(229,0,75,.10);color:var(--mag);animation:pop .2s cubic-bezier(.2,0,0,1)}\n .chip button{border:none;background:none;color:var(--mag);cursor:pointer;font-size:13px;line-height:1;padding:0;opacity:.7}\n .chip button:hover{opacity:1}\n .chip.empty{background:none;color:var(--muted);font-weight:400;animation:none}\n @keyframes pop{from{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}\n .toggles{display:flex;gap:22px;margin-bottom:8px}\n .tg{display:flex;align-items:center;gap:9px;cursor:pointer}\n .tg .sw{width:40px;height:23px;border-radius:999px;background:#D1D5DB;position:relative;transition:background .18s;flex:0 0 auto}\n .tg .sw.on{background:var(--green)}\n .tg .sw i{position:absolute;top:2px;left:2px;width:19px;height:19px;border-radius:50%;background:#fff;transition:transform .18s;box-shadow:0 1px 2px rgba(0,0,0,.2)}\n .tg .sw.on i{transform:translateX(17px)}\n .tg span{font:600 13px/1 var(--fam);color:var(--ink)}\n .foot{padding:14px 22px 20px;display:flex;gap:10px;justify-content:flex-end;border-top:1px solid var(--hair)}\n .btn{padding:11px 20px;border-radius:11px;font:600 14px/1 var(--fam);cursor:pointer;border:none;transition:filter .15s,background .15s}\n .btn.ghost{background:var(--ground);color:var(--ink)}\n .btn.ghost:hover{background:var(--hair)}\n .btn.primary{background:var(--grad);color:#fff;box-shadow:0 6px 16px rgba(229,0,75,.30)}\n .btn.primary:hover{filter:brightness(1.05)}\n .btn.primary:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;filter:none}\n @media (prefers-reduced-motion: reduce){\n .scrim,.modal,.menu,.sel .trigger .cv,.chip,.tg .sw,.tg .sw i{transition:none!important;animation:none!important}\n .modal{transform:none}\n }\n `,\n render(d2){\n const t = tok(d2);\n const list = d2.param('kpiList', []) || [];\n const dr = d2.state.draft || {};\n const isNew = !dr._id;\n const open = d2.state.openSel || null;\n const kq = (d2.state.kpiQuery||'').toLowerCase();\n const rel = Array.isArray(dr.relatedKpiCodes) ? dr.relatedKpiCodes : [];\n const canSave = !!(dr.label && dr.label.trim());\n // dedupe kpi list by code for pickers\n const seen = {}; const kpis = [];\n for(const k of list){ if(!seen[k.code]){ seen[k.code]=1; kpis.push(k); } }\n const filtered = kq ? kpis.filter(k=>String(k.name).toLowerCase().includes(kq)||String(k.code).includes(kq)) : kpis;\n\n const selField = (field,current)=>`\n \n \n ${field==='icon'?lucide(current):''}${esc(enumLabel(field,current))} ▾ \n \n \n
`;\n\n const mainPicker = `\n \n \n ${dr.mainKpiCode?esc(kpiName(kpis,dr.mainKpiCode)+' ('+dr.mainKpiCode+')'):'Selecione o KPI principal…'} ▾ \n \n \n
`;\n\n const relPicker = `\n \n \n Adicionar KPI relacionado… ▾ \n \n \n
`;\n\n return `\n \n
\n
\n
${lucide(isNew?'plus':'pencil')}
\n
\n
${isNew?'Novo indicador':'Editar indicador'} \n
${isNew?'Adicione um indicador ao dashboard':esc(dr.ref||'')}
\n
\n
✕ \n
\n
\n \n
\n
\n
📋
Nenhum indicador neste filtro.
Use “+ Novo indicador” para começar.
` : '';\n const indA = dropAfter===id ? `
` : '';\n return `${ind}\n
\n
${d2.render(card,{ item:it, kpiName:kpiName(kpiList,it.mainKpiCode), dragging:dragId===id },{ key:id })}
\n
⠿ ${esc(d2.state.ghost.label||'')} `;\n g.style.transform = `translate3d(${d2.state.ghost.x+14}px,${d2.state.ghost.y-6}px,0)`;\n }\n};\n"}},"items":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"items"}}}},"kpiList":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"kpiList"}}}},"card":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"card"}}}},"orderVersion":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"orderVersion"}}}},"busy":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"busy"}}}}}}}}}},{"_id":"6a4c0c5afe6887479ea7e300","component":"data2-core-types@Component","system":"688179c2a93dd170ce61e598","params":{"extends":"data2-core-primitives@Block","component":"pilotAdmScreen","package":"natura-x-piloto","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"const FALLBACK = {\n color:{surface:'#FFFFFF',ground:'#FAFAFB',ink:'#1A1C1E',muted:'#6B7280',hairline:'rgba(16,24,40,0.08)',naturaMagenta:'#E5004B',naturaOrange:'#EB6619',brandGradient:'linear-gradient(135deg,#E5004B 0%,#EB6619 100%)',gold:'#F7BE00',money:'#29AC56'},\n radius:{sm:8,md:12,lg:16,pill:999},\n type:{family:\"'Roboto',system-ui,-apple-system,sans-serif\",h1:'28px',h2:'20px',title:'15px',body:'13px',caption:'11px'},\n shadow:{card:'0 1px 2px rgba(16,24,40,0.04),0 1px 3px rgba(16,24,40,0.08)',raised:'0 8px 24px rgba(16,24,40,0.18)'}\n};\nlet TOK;\nfunction tok(d2){ if(!TOK){ try{ TOK = d2.call('natura-x-piloto@pilotMTokens'); }catch(e){} if(!TOK||!TOK.color) TOK = FALLBACK; } return TOK; }\nfunction esc(s){ return String(s==null?'':s).replace(/&/g,'&').replace(//g,'>').replace(/\"/g,'"'); }\n\nconst ICON = (()=>{\n const S = (p)=>`${p} `;\n return {\n plus:S('${opts.map(([v,l])=>`${esc(l)} `).join('')}
`;\n\n const listHost = loading\n ? `Carregando indicadores…
`\n : d2.render(d2.param('list','natura-x-piloto@pilotAdmList'), {\n items: filtered, kpiList: kpiList, card:'natura-x-piloto@pilotAdmCard', orderVersion: version\n }, {\n key:'admlist-'+(kpiList.length>0?'k1':'k0')+'-'+f.perfil+'-'+f.rede+'-'+f.section+'-'+(f.q||'').length\n });\n\n const formHost = d2.state.formOpen\n ? d2.render(d2.param('form','natura-x-piloto@pilotAdmForm'), {\n item: d2.state.formItem || null, kpiList: kpiList, openKey: d2.state.formKey || 1\n }, {\n key:'admform-'+(d2.state.formKey||1)\n })\n : '';\n\n return `\n \n
\n ${filtered.length} indicador${filtered.length===1?'':'es'}
\n
${listHost}
\n ${formHost}\n
${esc(d2.state.toast||'')}
\n
${p} `;\n return {\n edit:S('Nenhuma faixa ou tabela para este filtro.
\n
\n ${b.nivel?`${esc(b.nivel)} `:'— '}\n
\n
${b.brand?`${esc(b.brand)} `:'total '}
\n
\n
${nf(lo)} a ${hi>=9999?'∞':nf(hi)} ${isPct?'% de atingimento':''}
\n
\n
\n
${isPct?nf(b.value):money(b.value)}
\n
\n ${ICON.edit} \n ${armed?ICON.ok:ICON.del} \n
\n
${esc(bt.kpiName)} ` : (bt&&bt.kpiCode?`KPI ${esc(bt.kpiCode)} `:'sem KPI');\n const scopeTxt = bt ? `${esc(REDE_LABEL[bt.rede]||bt.rede||'')} · ${esc(PERFIL_LABEL[bt.perfil]||bt.perfil||'')}` : '';\n const editBtn = bt ? `${ICON.gear} ` : '';\n const inner = rows.length\n ? `${rows.map(b=>rowHtml(b,vt)).join('')}
`\n : `Nenhuma faixa nesta tabela ainda.
`;\n return `\n
\n
\n
\n
${esc(label)} \n
\n ${kpiTxt} \n ${esc(VT_LABEL[vt]||vt)} \n ${scopeTxt?`${scopeTxt} `:''}\n
\n
\n
${rows.length} \n ${editBtn}\n
\n ${inner}\n
${ICON.plus} Adicionar faixa em ${esc(label)}
\n
${groupHtml}
`;\n },\n mounted(d2){\n d2.on('[data-edit]','click',(e,el)=>{ d2.state.armDel=null; d2.bus.emit('rule:band:edit', findBand(d2, el.dataset.edit)); });\n d2.on('[data-add]','click',(e,el)=>{ d2.state.armDel=null; d2.bus.emit('rule:band:add', el.dataset.add); });\n d2.on('[data-edittable]','click',(e,el)=>{ d2.state.armDel=null; d2.bus.emit('rule:table:edit', findTable(d2, el.dataset.edittable)); });\n d2.on('[data-del]','click',(e,el)=>{\n const id = el.dataset.del;\n if(d2.state.armDel === id){ d2.state.armDel=null; d2.bus.emit('rule:band:del', findBand(d2,id)); }\n else { d2.state.armDel = id; d2.refresh(); setTimeout(()=>{ if(d2.state.armDel===id){ d2.state.armDel=null; d2.refresh(); } }, 3000); }\n });\n }\n};\nfunction cssVars(t){\n return `--surface:${t.color.surface};--ground:${t.color.ground};--ink:${t.color.ink};--muted:${t.color.muted};--hair:${t.color.hairline};--mag:${t.color.naturaMagenta};--grad:${t.color.brandGradient};--money:${t.color.money};--fam:${t.type.family};--shadowcard:${t.shadow.card}`;\n}\nfunction findBand(d2,id){ return (d2.param('bands',[])||[]).find(b=>b._id===id) || null; }\nfunction findTable(d2,ref){\n const bt = (d2.param('bandTables',[])||[]).find(x=>x.ref===ref) || null;\n if(!bt) return null;\n // Emit a plain band-table row shape the parent modal expects (strip derived kpiName).\n return { _id:bt._id, ref:bt.ref, label:bt.label, kpiCode:bt.kpiCode, rede:bt.rede, perfil:bt.perfil, valueType:bt.valueType, displayOrder:bt.displayOrder, active:bt.active };\n}"}},"bands":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"bands"}}}},"filter":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"filter"}}}},"flashId":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"flashId"}}}},"bandTables":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"bandTables"}}}}}}}}}},{"_id":"6a4c1473be5b19656f26461f","component":"data2-core-types@Component","system":"688179c2a93dd170ce61e598","params":{"extends":"data2-core-primitives@Block","component":"pilotRuleBonusEditor","package":"natura-x-piloto","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"const FALLBACK = {\n color:{surface:'#FFFFFF',ground:'#FAFAFB',ink:'#1A1C1E',muted:'#6B7280',hairline:'rgba(16,24,40,0.08)',naturaMagenta:'#E5004B',naturaOrange:'#EB6619',avonMagenta:'#E5014B',brandGradient:'linear-gradient(135deg,#E5004B 0%,#EB6619 100%)',gold:'#F7BE00',money:'#29AC56'},\n radius:{sm:8,md:12,lg:16,pill:999},\n type:{family:\"'Roboto',system-ui,-apple-system,sans-serif\",h1:'28px',h2:'20px',title:'15px',body:'13px',caption:'11px'},\n shadow:{card:'0 1px 2px rgba(16,24,40,0.04),0 1px 3px rgba(16,24,40,0.08)',raised:'0 8px 24px rgba(16,24,40,0.18)'}\n};\nlet TOK;\nfunction tok(d2){ if(!TOK){ try{ TOK = d2.call('natura-x-piloto@pilotMTokens'); }catch(e){} if(!TOK||!TOK.color) TOK = FALLBACK; } return TOK; }\nfunction esc(s){ return String(s==null?'':s).replace(/&/g,'&').replace(//g,'>').replace(/\"/g,'"'); }\nfunction money(n){ try{ return Number(n||0).toLocaleString('pt-BR',{style:'currency',currency:'BRL',minimumFractionDigits:0,maximumFractionDigits:2}); }catch(e){ return 'R$'+n; } }\n\nconst ICON = (()=>{\n const S = (p)=>`${p} `;\n return {\n edit:S('${ICON.plus} Nova regra de bônus
`;\n\n let cards;\n if(bonuses.length===0){\n cards = `Nenhuma regra de bônus neste perfil. Crie a primeira com “Nova regra de bônus”.
`;\n } else {\n cards = bonuses.map(b=>{\n const isUnit=(b.payoutType||b.basis)==='per-unit';\n const val=(b.payoutValue!=null?b.payoutValue:b.amount)||0;\n const summ=summarize(b).replace(money(val), ''+money(val)+' ');\n const confirming = confirmDel===b._id;\n return `\n
\n
${esc(b.label||b.bonusType||'Bônus')}
\n
${isUnit?'Por unidade':'Total fixo'} \n
\n
\n ${esc(PERFIL_LABEL[b.perfil]||b.perfil||'')} \n ${esc(REDE_LABEL[b.rede]||b.rede||'')} \n
\n
${summ}
\n
\n ${ICON.edit} Editar \n ${ICON.dup} Duplicar \n ${confirming?'Confirmar?':ICON.del+' Excluir'} \n
\n
\n ${toolbar}\n
${cards}
\n ${renderModal(d2,t)}\n
${esc(l)} `; }\nfunction kpiOpts(cur){ return KPIS.map(k=>opt(k.code,k.label,cur)).join(''); }\nfunction renderModal(d2,t){\n if(!d2.state.modalOpen) return '';\n const m=d2.state.modal||{};\n const isNew=!m._id;\n const isUnit=m.payoutType==='per-unit';\n const conds=m.conditions||[];\n const condRows = conds.length? conds.map((c,i)=>`\n \n
Indicador ${kpiOpts(c.kpiCode)}
\n
Métrica ${opt('atingimento','Atingimento %',c.metric)}${opt('value','Valor',c.metric)}
\n
Op. ${opt('gte','≥',c.op)}${opt('gt','>',c.op)}${opt('eq','=',c.op)}
\n
Limite
\n
${ICON.x} \n
Nenhuma condição — o bônus é pago sempre (útil para aceleradores por unidade).
`;\n\n return `\n
\n
${isNew?'Nova regra de bônus':'Editar regra de bônus'} \n
Defina condições sobre indicadores e o pagamento. Nomes amigáveis dos indicadores.
\n\n
Nome da regra
\n\n
\n
Perfil ${opt('lider','Líder',m.perfil)}${opt('gn','GN',m.perfil)}
\n
Rede ${opt('rede1','Rede 1',m.rede)}${opt('rede2','Rede 2',m.rede)}
\n
\n\n
\n
Condições${isUnit?' (ignoradas em Por unidade)':''} ${ICON.plus} Condição
\n ${condRows}\n
\n\n
\n
Pagamento
\n
Tipo \n
\n Total fixo \n Por unidade \n
\n
\n
\n
${isUnit?'Valor por unidade (R$)':'Valor total (R$)'}
\n ${isUnit?`
Indicador (contagem) ${kpiOpts(m.perUnitKpiCode)}
`:''}\n
\n
\n\n
\n
Pré-visualização
\n
${summarize(normalize(m)).replace(money(Number(m.payoutValue)||0),''+money(Number(m.payoutValue)||0)+' ')}
\n
\n\n \n
\n
${p} `;\n return {\n x:S('\n
✅ \n
Fórmulas estruturadas são interpretadas ao vivo pelo cálculo. \n Monte a remuneração com blocos amigáveis — cada edição salva altera o ganho real (sem string Formula()).\n Afeta o cálculo ao vivo
\n
${banner}
Nenhuma fórmula neste perfil.
${banner}
${cards}
${renderPicker(d2,t,bandTables)}
{\n const {fm,p}=parseDouble(el.dataset.pup);\n mutate(d2,fm,st=>{ if(p>0){ const x=st.parcelas[p]; st.parcelas[p]=st.parcelas[p-1]; st.parcelas[p-1]=x; } });\n });\n d2.on('[data-pdown]','click',(e,el)=>{\n const {fm,p}=parseDouble(el.dataset.pdown);\n mutate(d2,fm,st=>{ if(p{\n const {fm,p}=parseDouble(el.dataset.pdel);\n mutate(d2,fm,st=>{ st.parcelas.splice(p,1); });\n });\n d2.on('[data-addparc]','click',(e,el)=>{\n const fm=el.dataset.addparc;\n mutate(d2,fm,st=>{ st.parcelas.push({ label:'Parcela '+(st.parcelas.length+1), factors:[] }); });\n });\n d2.on('[data-addfac]','click',(e,el)=>{\n const {fm,p}=parseDouble(el.dataset.addfac);\n d2.setState({ picker:{ fm, p, tab:'band', brand:'natura', constVal:'1' } });\n });\n // picker\n d2.on('[data-pktab]','click',(e,el)=>{ const pk={...(d2.state.picker||{})}; pk.tab=el.dataset.pktab; d2.setState({picker:pk}); });\n d2.on('[data-pkbrand]','click',(e,el)=>{ const pk={...(d2.state.picker||{})}; pk.brand=el.dataset.pkbrand; d2.setState({picker:pk}); });\n d2.on('[data-pkconst]','input',(e,el)=>{ const pk={...(d2.state.picker||{})}; pk.constVal=el.value; d2.state.picker=pk; });\n d2.on('[data-pkclose]','click',()=>d2.setState({picker:null}));\n d2.on('[data-pkbg]','click',(e,el)=>{ if(e.target===el) d2.setState({picker:null}); });\n d2.on('[data-pkpick-band]','click',(e,el)=>{\n const pk=d2.state.picker||{}; const ref=el.dataset.pkpickBand;\n const bts=d2.param('bandTables',[])||[]; const bt=bts.find(x=>x.ref===ref)||{};\n const brand = pk.brand||'natura';\n const fac={ kind:'band-table', ref, brand, label:(bt.label||ref), op:'mul' };\n addFactor(d2, pk.fm, pk.p, fac);\n });\n d2.on('[data-pkpick-kpi]','click',(e,el)=>{\n const pk=d2.state.picker||{}; const code=el.dataset.pkpickKpi;\n const kpis=d2.param('kpis',[])||[]; const k=kpis.find(x=>String(x.code)===String(code))||{};\n const fac={ kind:'kpi', kpiCode:String(code), label:(k.label||k.name||('KPI '+code)), op:'mul' };\n addFactor(d2, pk.fm, pk.p, fac);\n });\n d2.on('[data-pkpick-const]','click',()=>{\n const pk=d2.state.picker||{}; const n=Number(pk.constVal); const val=isNaN(n)?1:n;\n addFactor(d2, pk.fm, pk.p, { kind:'const', n:val, label:String(val), op:'mul' });\n });\n d2.on('[data-reset]','click',(e,el)=>{\n const fm=el.dataset.reset; const d=d2.state.drafts||{}; delete d[fm]; d2.state.drafts=d; d2.refresh(); recompute(d2,fm);\n });\n d2.on('[data-save]','click',(e,el)=>{\n const id=el.dataset.save;\n const base=(d2.param('formulas',[])||[]).find(x=>x._id===id); if(!base) return;\n const structure=(d2.state.drafts||{})[id]; if(structure==null) return;\n const next={ ...base, structure };\n const d=d2.state.drafts||{}; delete d[id]; d2.state.drafts=d;\n d2.bus.emit('rule:formula:save', next);\n });\n }\n};\n\nfunction parseTriple(s){ const [fm,p,f]=String(s).split('|'); return { fm, p:Number(p), f:Number(f) }; }\nfunction parseDouble(s){ const [fm,p]=String(s).split('|'); return { fm, p:Number(p) }; }\n\nfunction currentStructure(d2, fmId){\n const drafts = d2.state.drafts||{};\n if(drafts[fmId]!=null) return clone(drafts[fmId]);\n const base=(d2.param('formulas',[])||[]).find(x=>x._id===fmId);\n return clone((base&&base.structure) || emptyStructure());\n}\nfunction mutate(d2, fmId, fn){\n const st = currentStructure(d2, fmId);\n fn(st);\n const d = d2.state.drafts||{}; d[fmId]=st; d2.state.drafts=d;\n d2.refresh();\n recompute(d2, fmId);\n}\nfunction addFactor(d2, fmId, p, fac){\n mutate(d2, fmId, st=>{ if(st.parcelas[p]){ st.parcelas[p].factors.push(fac); } });\n d2.setState({ picker:null });\n}\nasync function recompute(d2, fmId){\n const base=(d2.param('formulas',[])||[]).find(x=>x._id===fmId);\n if(!base) return;\n const st = currentStructure(d2, fmId);\n const sample = SAMPLE[base.rede] || SAMPLE.rede1;\n const pv = {...(d2.state.previews||{})}; pv[fmId]={...(pv[fmId]||{}), loading:true}; d2.setState({previews:pv});\n try{\n const r = await d2.rush('pilotGetGroupEarnings').invoke({ structureCode:sample.code, cycle:sample.cycle, structureOverride:st });\n const data = (r && r.data) || r || {};\n const val = data.remuneracao;\n const base2 = data.breakdown && data.breakdown.components ? data.breakdown.components.structuredBase : null;\n const pv2 = {...(d2.state.previews||{})};\n pv2[fmId]={ loading:false, value:val, structuredBase:base2, sample:sample.code };\n d2.setState({previews:pv2});\n }catch(e){\n const pv2={...(d2.state.previews||{})}; pv2[fmId]={ loading:false, error:true }; d2.setState({previews:pv2});\n }\n}\n\nfunction renderCard(d2, t, fm, structure, dirty, pv, bandTables, flashId){\n const parcelas = structure.parcelas||[];\n const parcHtml = parcelas.map((p,pi)=>renderParcela(d2,t,fm._id,p,pi,parcelas.length,bandTables)).join(`${ICON.plus}
`);\n const line = humanLine(structure, bandTables);\n const resVal = pv.loading ? '' : (pv.error ? 'erro' : (pv.value!=null ? Number(pv.value).toLocaleString('pt-BR',{style:'currency',currency:'BRL'}) : '—'));\n const sampleCode = pv.sample || (SAMPLE[fm.rede]||SAMPLE.rede1).code;\n return `\n
\n ${esc(PERFIL_LABEL[fm.perfil]||fm.perfil)} \n ${esc(fm.rede)} \n Estruturada · ao vivo \n
\n
${humanHtml(line)}
\n
\n
\n Ganho — grupo ${esc(sampleCode)}${dirty?' (rascunho)':''} \n ${pv.loading?`${esc(resVal)} `}\n
\n
Cálculo ao vivo via motor de ganhos (mesmo avaliador do dashboard). \n
\n
\n ${parcHtml || `
Nenhuma parcela — adicione a primeira abaixo.
`}\n
\n
${ICON.plus} Parcela (nova soma) \n
\n Descartar \n Salvar fórmula \n
\n
${isDiv?'÷':'×'} `;\n }\n const tag=factorKindTag(f);\n chain += `\n ${esc(tag)} \n ${esc(factorLabel(f,bandTables))} \n \n ${ICON.left} \n ${ICON.right} \n ${ICON.x} \n \n `;\n });\n return `\n
\n
${esc(p.label||('Parcela '+(pi+1)))} \n
\n ${ICON.up} \n ${ICON.down} \n ${ICON.x} \n
\n
\n
\n ${chain}\n ${ICON.plus} fator \n
\n
× ').replace(/÷/g,'÷ ').replace(/\\+/g,'+ ');\n}\n\nfunction renderPicker(d2,t,bandTables){\n const pk = d2.state.picker;\n if(!pk) return '';\n const tab = pk.tab||'band';\n const kpis = d2.param('kpis',[])||[];\n // dedupe kpis by code\n const seen={}; const kpiList=[];\n (kpis||[]).slice().sort((a,b)=>(a.displayOrder||0)-(b.displayOrder||0)).forEach(k=>{ const c=String(k.code); if(!seen[c]){ seen[c]=1; kpiList.push({code:c,name:(k.label||k.name||c)}); } });\n const bts = (bandTables||[]).filter(b=>b && b.ref);\n const seg = `\n Tabela de faixas \n Indicador (KPI) \n Constante \n
`;\n let body='';\n if(tab==='band'){\n const brand=pk.brand||'natura';\n const brow=`\n ${[['natura','Natura'],['avon','Avon'],['','Total']].map(([v,l])=>`${esc(l)} `).join('')}\n
`;\n const opts = bts.map(b=>`\n
${esc(b.label||b.ref)}
${esc(b.valueType==='multiplier'?'% multiplicador':'R$ fixo')} · KPI ${esc(b.kpiCode||'—')}
\n
Nenhuma tabela de faixas.
`;\n body = `Escolha a marca e a tabela. O valor da faixa correspondente ao grupo entra no produto (multiplicador vira % automaticamente).
${brow}${opts}`;\n } else if(tab==='kpi'){\n const opts = kpiList.map(k=>`\n
${esc(k.name)}
Valor realizado do indicador · código ${esc(k.code)}
\n
Nenhum indicador.
`;\n body = `O valor realizado do indicador (ex.: pontos, ativas) entra direto como fator.
${opts}`;\n } else {\n body = `Um número fixo (ex.: 1.1 para +10%, 100 como base).
\n
\n `;\n }\n const foot = tab==='const' ? '' : ``;\n return `\n
Adicionar fator \n ${seg}\n ${body}\n ${foot}\n ${p} `;\n return {\n del:S('${opts.map(([v,l])=>`${esc(l)} `).join('')}
`;\n const tabs = `${TAB_SEG.map(([v,l])=>`${esc(l)} `).join('')}
`;\n const rsstatus = ``;\n const perfilSeg = `Perfil ${PERFIL_SEG.map(([v,l])=>`${esc(l)} `).join('')}
Rede ${PERFIL_REDE_SEG.map(([v,l])=>`${esc(l)} `).join('')}
${esc(cyErr)} ` : (cyCode ? `Ciclo ${esc(cyCode)} usa v${esc(selVer)} ` : '');\n const cyclePick = `Ciclo Tabela ${seg('bandTable',tableSeg,f.bandTable)}
\n Nível ${seg('nivel',NIVEL_SEG,f.nivel)}
\n Marca ${seg('brand',BRAND_SEG,f.brand)}
`;\n }\n\n let bodyHost = '';\n let count = 0;\n if(loading){\n bodyHost = `Carregando regras…
`;\n } else if(tab==='bands'){\n const vis = perfilBands.filter(b=>((f.bandTable||'all')==='all'||(b.bandTableRef||b.bandTable)===f.bandTable)&&(f.nivel==='all'||(b.nivel||'')===f.nivel)&&(f.brand==='all'||(b.brand||'')===f.brand));\n count = vis.length;\n bodyHost = renderBandCards(d2, vis, perfilTables, kpis, pending, f);\n } else if(tab==='bonus'){\n count = perfilBonuses.length;\n bodyHost = d2.render('natura-x-piloto@pilotRuleBonusEditor', { bonuses:perfilBonuses, flashId:d2.state.flashId||'', perfilHint:perfil }, { key:'bn-v'+selVer+'-'+perfil+'-'+rede+'-'+perfilBonuses.length+'-'+(d2.state.flashId||'') });\n } else {\n count = perfilFormulas.length;\n const btForFormula = perfilTables.map(bt=>({ _id:bt._id, ref:bt.ref, label:bt.label, valueType:bt.valueType, rede:bt.rede, perfil:bt.perfil, kpiCode:bt.kpiCode }));\n bodyHost = d2.render('natura-x-piloto@pilotRuleFormulaEditor', { formulas:perfilFormulas, bandTables:btForFormula, kpis:kpis, flashId:d2.state.flashId||'' }, { key:'fm-v'+selVer+'-'+perfil+'-'+rede+'-'+perfilFormulas.length+'-'+perfilTables.length+'-'+(d2.state.flashId||'') });\n }\n\n const scopeLabel = `${PERFIL_LABEL[perfil]||perfil} · ${REDE_LABEL[rede]||rede}`;\n const countLabel = tab==='bands' ? `${count} faixa${count===1?'':'s'} · ${perfilTables.length} tabela${perfilTables.length===1?'':'s'}` : tab==='bonus' ? `${count} regra${count===1?'':'s'} de bônus` : `${count} fórmula${count===1?'':'s'}`;\n const metaLabel = `${scopeLabel} — ${countLabel}`;\n const draftHint = isDraft\n ? `Editando rascunho v${esc(selectedRs.version)} — não afeta ciclos usando outra versão.`\n : (tab==='bands' ? `Ruleset ${STATUS_LABEL[selectedRs.status]||selectedRs.status} v${esc(selectedRs.version)}: \"Enviar Alterações\" cria um rascunho novo com as mudanças; ele só vale depois de ativado.` : '');\n const metaHint = draftHint;\n\n return `\n \n
${perfilSeg}${redeSeg}${filterBar}
\n
${metaLabel} ${esc(metaHint)} `:''}
\n
${bodyHost}
\n ${renderModal(d2,t)}\n ${renderTableModal(d2,t,kpis)}\n
${esc(d2.state.toast||'')}
\n
Nenhuma tabela de faixas para este perfil e rede.
Nenhuma faixa para este filtro.
\n
${nv?`${esc(NIVEL_LABEL[nv]||nv)} `:'— '}
\n
${br?`${esc(MARCA_LABEL[br]||br)} `:'total '}
\n
\n
${isPct?'':'R$ '}% ':''}
\n
${armed?ICON.ok:ICON.del}
\n
${esc(kn)} ` : 'sem KPI';\n const scopeTxt = `${esc(REDE_LABEL[bt.rede]||bt.rede||'')} · ${esc(PERFIL_LABEL[bt.perfil]||bt.perfil||'')}`;\n const pend = rows.filter(b=>pending[b._id]).length;\n const inner = rows.length\n ? `${rows.map(b=>rowHtml(b,bt)).join('')}
`\n : `Nenhuma faixa nesta tabela nesta versão.
`;\n return `\n
\n
\n
\n
${esc(bt.label||bt.ref)} \n
\n ${kpiTxt} \n ${esc(VT_CHIP[vt])} \n ${scopeTxt} \n ${pend?`${pend} alterada${pend===1?'':'s'} `:''}\n
\n
\n
${rows.length} \n
${ICON.gear} \n
\n ${inner}\n
${ICON.plus} Adicionar faixa em ${esc(bt.label||bt.ref)}
\n
${cards.join('')}
`;\n}\n\nfunction onBandField(d2, el){\n const id = el.dataset.id, fld = el.dataset.bf;\n const b = allBands(d2).find(x=>x._id===id); if(!b) return;\n const pending = { ...(d2.state.pending||{}) };\n const p = { ...(pending[id]||{}) };\n const raw = String(el.value).trim();\n const orig = shown(b[fld]);\n if(raw==='' || Number(raw)===Number(orig)) delete p[fld]; else p[fld] = raw;\n if(Object.keys(p).length) pending[id] = p; else delete pending[id];\n d2.setState({ pending });\n}\n\nfunction applyCycle(d2, raw){\n const code = normCycle(raw);\n if(!code){ d2.setState({ cycleCode:String(raw||''), cycleErr:'Ciclo inválido (ex.: 202615)' }); return; }\n const cyc = cycleRows(d2).find(c=>String(c.code)===code);\n if(!cyc){ d2.setState({ cycleCode:code, cycleErr:`Ciclo ${code} não cadastrado` }); return; }\n const v = Number(cyc.rulesetVersion)||0;\n if(Object.keys(d2.state.pending||{}).length && v!==selectedVersion(d2) && !confirmDiscard()) return;\n d2.setState({ cycleCode:code, cycleErr:'', rulesetVersion: v || null, pending: v!==selectedVersion(d2) ? {} : d2.state.pending });\n}\n\nasync function submitPending(d2){\n const pending = d2.state.pending || {};\n const ids = Object.keys(pending);\n if(!ids.length || d2.state.saving) return;\n const bands = allBands(d2);\n for(const id of ids){\n const p = pending[id];\n for(const k of Object.keys(p)){ if(!isFinite(Number(p[k]))){ toast(d2,'Valor inválido em uma das faixas'); return; } }\n const b = bands.find(x=>x._id===id);\n const mn = Number(p.minPct!==undefined?p.minPct:b&&b.minPct), mx = Number(p.maxPct!==undefined?p.maxPct:b&&b.maxPct);\n if(b && mx < mn){ toast(d2,'Há faixa com máximo menor que o mínimo'); return; }\n }\n const ver = selectedVersion(d2);\n const rsDs = d2.data('rulesets'); const rs = rsDs ? rsDs.records() : [];\n const cur = rs.find(r=>Number(r.version)===ver);\n d2.setState({ saving:true });\n try{\n let targetVer = ver;\n let idMap = null;\n if(!cur || cur.status!=='draft'){\n // Locked ruleset → duplicate into a new draft and apply the edits there (server guard stays intact).\n targetVer = rs.reduce((m,r)=>Math.max(m,Number(r.version)||0),0) + 1;\n const today = new Date().toISOString().slice(0,10);\n const dup = await invoke(d2,{ entity:'ruleset', op:'duplicate', actorEmail:ACTOR, row:{ version:targetVer, sourceVersion:ver, label:`Rascunho de v${ver} — ajuste de faixas (${today})` }, before:{} });\n const dd = dup && dup.data;\n if(!dd || dd.ok!==true) throw new Error('duplicate: '+JSON.stringify(dd||dup));\n await reloadBands(d2);\n const fresh = allBands(d2).filter(x=>Number(x.rulesetVersion)===targetVer);\n idMap = {};\n for(const id of ids){\n const b = bands.find(x=>x._id===id); if(!b) continue;\n const twin = fresh.find(x=>(x.bandTableRef||x.bandTable)===(b.bandTableRef||b.bandTable) && x.rede===b.rede && (x.nivel||'')===(b.nivel||'') && (x.brand||'')===(b.brand||'') && Number(x.minPct)===Number(b.minPct) && Number(x.maxPct)===Number(b.maxPct) && Number(x.value)===Number(b.value) && !Object.values(idMap).includes(x._id));\n if(!twin) throw new Error('faixa copiada não encontrada para '+id);\n idMap[id] = twin._id;\n }\n }\n let fails = 0;\n for(const id of ids){\n const b = bands.find(x=>x._id===id); if(!b) { fails++; continue; }\n const p = pending[id];\n const row = {\n _id: idMap ? idMap[id] : id, rulesetVersion: targetVer, bandTable: b.bandTable, bandTableRef: b.bandTableRef||b.bandTable, rede: b.rede,\n nivel: b.nivel||'', brand: b.brand||'',\n minPct: Number(p.minPct!==undefined?p.minPct:b.minPct)||0,\n maxPct: Number(p.maxPct!==undefined?p.maxPct:b.maxPct)||0,\n value: Number(p.value!==undefined?p.value:b.value)||0\n };\n const r = await invoke(d2,{ entity:'band', op:'upsert', actorEmail:ACTOR, row, before:{ minPct:b.minPct, maxPct:b.maxPct, value:b.value, sourceVersion:ver } });\n if(!(r && r.data && r.data.ok===true)) fails++;\n }\n refreshAll(d2);\n await reloadBands(d2);\n if(targetVer!==ver){\n d2.setState({ pending:{}, rulesetVersion:targetVer, cycleErr:'' });\n toast(d2, fails ? `Rascunho v${targetVer} criado, mas ${fails} faixa(s) falharam` : `Rascunho v${targetVer} criado com ${ids.length} alteração(ões). Ative-o em Rulesets para aplicar.`);\n } else {\n d2.setState({ pending: fails ? d2.state.pending : {} });\n toast(d2, fails ? `${fails} faixa(s) não foram salvas` : `${ids.length} faixa(s) atualizada(s)`);\n }\n }catch(e){\n d2.log('Enviar Alterações falhou', e);\n toast(d2,'Erro ao enviar alterações');\n }\n d2.setState({ saving:false });\n}\n\nfunction addBand(d2, ref, nivel){\n const ver = selectedVersion(d2);\n const rsDs = d2.data('rulesets'); const rs = rsDs ? rsDs.records() : [];\n const cur = rs.find(r=>Number(r.version)===ver);\n if(!cur || cur.status!=='draft'){ toast(d2,'Para adicionar faixas, selecione um ruleset em rascunho (ou envie uma alteração para criar um).'); return; }\n openBandModal(d2,{ bandTable:ref, bandTableRef:ref, rulesetVersion:ver, rede:d2.state.rede||'rede1', nivel:nivel||'', brand:'', minPct:0, maxPct:100, value:0 });\n}\n\nfunction valueTypeOf(d2, m){\n const ref = m.bandTableRef || m.bandTable;\n const btDs = d2.data('bandTables');\n const bts = btDs ? btDs.records() : [];\n const bt = bts.find(x=>x.ref===ref);\n if(bt && bt.valueType) return bt.valueType;\n return 'fixed';\n}\nfunction tableLabelOf(d2, ref){\n const btDs = d2.data('bandTables');\n const bt = (btDs ? btDs.records() : []).find(x=>x.ref===ref);\n return bt ? (bt.label||ref) : (ref||'');\n}\n\nfunction renderModal(d2,t){\n if(!d2.state.modalOpen) return '';\n const m = d2.state.modal || {};\n const vt = valueTypeOf(d2, m);\n const vtLabel = VT_LABEL[vt] || vt;\n const isPct = vt==='multiplier';\n const valNote = isPct\n ? 'Multiplicador: o valor é aplicado como % sobre a base (ex.: 85 = 85%).'\n : 'Valor fixo em R$: entra direto no cálculo do ganho.';\n return `\n
\n
Nova faixa \n
${esc(tableLabelOf(d2, m.bandTableRef||m.bandTable))} · ${esc(REDE_LABEL[m.rede]||m.rede||'')} · ${esc(vtLabel)}
\n
\n
Nível \n ${['diamante','ouro','prata',''].map(v=>`${v?NIVEL_LABEL[v]:'—'} `).join('')} \n
\n
Marca \n ${['natura','avon',''].map(v=>`${MARCA_LABEL[v]} `).join('')} \n
\n
\n
\n
Mínimo
\n
Máximo
\n
Valor \n
${isPct?'%':'R$'}
\n
\n
\n
${esc(valNote)}
\n \n
\n
\n
\n
${isNew?'Nova tabela de faixas':'Editar tabela de faixas'} \n
Uma tabela agrupa faixas por KPI. ${isNew?'Ela fica inerte até ser referenciada por uma fórmula.':esc('Slug: '+(m.ref||''))}
\n
\n
\n
KPI vinculado \n — ${kpiList.map(k=>`${esc(k.name)} (${esc(k.code)}) `).join('')}
\n
\n
\n
Rede \n ${['rede1','rede2'].map(v=>`${v==='rede1'?'Rede 1':'Rede 2'} `).join('')} \n
\n
Perfil \n ${[['lider','Líder'],['gn','GN']].map(([v,l])=>`${l} `).join('')} \n
\n
Tipo de valor \n ${VALUETYPE_SEG.map(([v,l])=>`${l} `).join('')} \n
\n
\n ${isNew?`
Tabela nova: as faixas dela ainda NÃO afetam o cálculo. Só passam a valer quando uma fórmula referenciar esta tabela.
`:''}\n \n
\n
${l.glyph} ${esc(l.label)}\n
\n A \n AdministraçãoPainel de Remuneração \n
\n
${links}
\n
\n
⌂ Início \n
\n
${c.glyph} \n
${esc(c.title)} ${esc(c.tag)} \n
${esc(c.desc)}
\n
Abrir → \n
\n
\n
Administração do Painel \n
Central de configuração do piloto Natura. Gerencie os indicadores do dashboard e as regras de remuneração a partir de um só lugar.
\n
\n
${cards}
\n
${p} `;\n return {\n edit:S('${esc(STATUS_LABEL[s]||s)} `;\n}\n\nfunction renderCard(d2, rs, bands, formulas, bonuses, cycles){\n const v = rs.version;\n const nb = countBy(bands,v), nf = countBy(formulas,v), nbo = countBy(bonuses,v);\n const bc = boundCycles(cycles,v);\n const bcLabel = bc.length ? bc.map(c=>esc(c.code)).join(', ') : 'nenhum ciclo';\n return `\n
\n
\n
v${esc(v)}
\n ${statusChip(rs.status)}\n
\n
\n ${ICON.edit} Editar \n ${ICON.dup} Duplicar \n
\n
\n
${esc(rs.label||'—')}
\n
\n ${nb} faixas${nf} fórmulas${nbo} bônus
\n
Ciclos vinculados: ${bcLabel}
\n \n
\n
\n
${esc(title)} \n
${esc(sub)}
\n
\n
\n ${(!isNew&&!isDup)?`
Status \n ${STATUS_ORDER.map(s=>`${STATUS_LABEL[s]} `).join('')} \n
`:''}\n ${canDelete?'':(!isNew&&!isDup?`
Só é possível excluir um rascunho sem ciclos vinculados. Esta versão está protegida.
`:'')}\n \n
\n
\n \n
\n ${loading?`
Carregando rulesets…
`:`
${cards}
`}\n
\n ${renderEditModal(d2)}\n
${esc(d2.state.toast||'')}
\n
${p} `;\n return { plus:S('v${esc(r.version)} — ${esc(r.label||'')} [${esc(RS_STATUS_LABEL[r.status]||r.status||'')}] `).join('');\n}\n\nfunction renderRow(d2, c, rulesets){\n // controls show the pending draft (d2.state.draft[code]) over the stored record, so edits stick across re-renders\n const st = curVal(d2, c.code, 'status') || 'open';\n const rsv = curVal(d2, c.code, 'rulesetVersion');\n const isCur = !!curVal(d2, c.code, 'isCurrent');\n const lbl = curVal(d2, c.code, 'label');\n const dirty = !!(d2.state.draft||{})[c.code];\n return `\n
\n
${esc(c.code)}
\n
${esc(c.label||'—')}
\n
\n
\n ${esc(STATUS_LABEL[st]||st)} \n ${c.isCurrent?`● Atual `:''}\n ${esc(rsLabel(rulesets,c.rulesetVersion))} \n
\n
\n
\n Rótulo \n
\n
\n Ruleset vinculado \n ${rsOptions(rulesets, rsv)} \n
\n
\n Status \n ${STATUS_KEYS.map(s=>`${STATUS_LABEL[s]} `).join('')} \n
\n
\n Ciclo atual \n
\n
${dirty?'Salvar •':'Salvar'} \n
\n
\n \n
\n ${loading?`
Carregando ciclos…
`:rows}\n
\n ${renderNewModal(d2,rulesets)}\n
${esc(d2.state.toast||'')}
\n
\n
\n
Novo ciclo \n
Cadastre um ciclo e vincule-o a um ruleset. O código é a chave (ex.: 202611).
\n
\n
Código
\n
Status ${STATUS_KEYS.map(s=>`${STATUS_LABEL[s]} `).join('')}
\n
\n
\n
\n
Ruleset vinculado ${sorted.map(r=>`v${esc(r.version)} — ${esc(r.label||'')} `).join('')}
\n
\n \n
\n
',\n 'crown':'',\n 'coins':'',\n 'chart':'${LUCIDE[name]||LUCIDE.chart} `; }\nconst ICON = (()=>{\n const S = (p)=>`${p} `;\n return {\n edit:S('${esc(parts.join(' · '))} ` : '';\n}\nfunction brandChip(brand){\n const b = brand||'total';\n return `${esc(BRAND_LABEL[b]||b)} `;\n}\nfunction iconGlyph(icon){ return lucide(icon||'target'); }\n\nfunction renderCard(d2, k, kpis){\n const refs = refCount(kpis, k);\n const src = k.source||'performance-api';\n const armed = d2.state.confirmDel===k._id;\n return `\n
${iconGlyph(k.icon)}
\n
\n
\n ${esc(k.name||'(sem nome)')} \n #${esc(k.code||'—')} \n
\n
\n ${brandChip(k.brand)}\n ${placeChip(k)}\n ${esc(SOURCE_LABEL[src]||src)} \n ${k.hasGoal?`Com meta `:`Sem meta `}\n ${k.iap?`IAP `:''}\n ${refs>0?`${refs}× uso `:''}\n
\n ${k.hasGoal&&k.goalKey?`
meta: ${esc(k.goalKey)}
`:''}\n ${k.description?`
${esc(String(k.description).slice(0,140))}${String(k.description).length>140?'…':''}
`:''}\n
\n
\n ${ICON.edit} \n ${ICON.dup} \n ${armed\n ? `${ICON.ok} ${ICON.x} `\n : `${ICON.del} `}\n
\n
${ICON_LABEL[i]||i} `).join('');\n}\nfunction brandOptions(cur){\n return ['natura','avon','total'].map(b=>`${BRAND_LABEL[b]} `).join('');\n}\n\nfunction fieldsMarkup(d2, m, isNew){\n const src = m.source||'performance-api';\n const isBricks = src==='databricks-query';\n return `\n \n
Nome do indicador
\n
Marca ${brandOptions(m.brand)}
\n
\n
Origem do dado \n
\n Performance API \n Databricks query — em breve \n \n
Mapeie um indicador da Performance API pelo código de índice. A origem por consulta Databricks chega em breve.
\n
\n
\n
Código do índice (Performance API)
\n
Ícone ${iconOptions(m.icon||'target')}
\n
\n
Ícone ${iconOptions(m.icon||'target')}
\n
Origem
\n
\n
\n Possui meta \n
\n
\n Indicador de acompanhamento (IAP) \n
\n
\n
\n
Editar indicador \n
Código #${esc(m.code||'—')} · propriedades intrínsecas do KPI. A exibição no dashboard (agrupamento, seção, ordem) fica no editor de Indicadores.
\n ${refs>0?`
⚠️ Este código é usado por ${refs} outro registro. Alterações no significado do indicador podem afetar itens do dashboard, tabelas de faixas e bônus que apontam para #${esc(m.code)}.
`:''}\n ${fieldsMarkup(d2, m, false)}\n \n
\n
\n
\n
Novo indicador \n
Mapeie uma métrica de negócio a partir do código de índice da Performance API. O código do índice vira o código (chave) do KPI — pronto para ser escolhido nos itens do dashboard, tabelas de faixas e bônus.
\n ${fieldsMarkup(d2, m, true)}\n \n
\n
\n \n
\n ${loading?`
Carregando indicadores…
`:(rows||`
Nenhum indicador encontrado${q?` para “${esc(d2.state.q)}”`:''}.
`)}\n
\n ${renderEditModal(d2,kpis)}\n ${renderNewModal(d2)}\n
${esc(d2.state.toast||'')}
\n
${p} `;\n return {\n down:S('cópia ${lbl} ${parts.length?`${esc(parts.join(' · '))} copiados `:''}
`;\n }\n if(act==='update'){\n const diff = buildDiff(rec).filter(d=>d.hasAfter && JSON.stringify(d.before)!==JSON.stringify(d.after));\n const annotations = buildDiff(rec).filter(d=>!d.hasAfter);\n if(diff.length===0 && annotations.length>0){\n return annotations.map(d=>`${esc(d.key)}: ${esc(fmtVal(d.before))}
`).join('');\n }\n if(diff.length===0){\n return `Sem alterações de campo detectadas.
`;\n }\n return diff.slice(0,6).map(d=>\n `${esc(d.key)}: ${esc(fmtVal(d.before))} → ${esc(fmtVal(d.after))}
`\n ).join('') + (diff.length>6?`+${diff.length-6} outro(s) campo(s)
`:'');\n }\n const kf = keyFields(rec);\n if(kf.length===0) return `${act==='delete'?'Registro removido.':'Registro criado.'}
`;\n return `${kf.map(f=>`${esc(f.key)} ${esc(fmtVal(f.val))}
`;\n}\n\nfunction rowMarkup(d2, rec){\n const act = effectiveAction(rec);\n const meta = ACTION_META[act] || {label:act,cls:'update'};\n const et = String(rec.entityType||'');\n const etLabel = ENTITY_LABEL[et]||et||'—';\n const etGlyph = ENTITY_GLYPH[et]||'•';\n const lbl = friendlyLabel(rec);\n const id = String(rec._id||'');\n const expanded = d2.state.expanded===id;\n let fullJson = '';\n try{ fullJson = JSON.stringify(rec.changes||{}, null, 2); }catch(e){ fullJson='{}'; }\n return `\n
\n
\n
\n
\n ${esc(actorInitials(rec.actorEmail))} \n ${esc(rec.actorEmail||'—')} \n ${esc(meta.label)} \n ${etGlyph} ${esc(etLabel)}${esc(relTime(d2, rec.at))} \n
\n
\n ${lbl?`${esc(lbl)} `:''}\n #${esc(rec.entityId||'—')} \n
\n
${summaryMarkup(rec)}
\n \n ${expanded?`
${esc(fullJson)} `:''}\n
\n
${esc(c.label)} `).join('');\n const actionChips = ACTION_FILTERS.map(c=>`${esc(c.label)} `).join('');\n const dateChips = DATE_PRESETS.map(c=>`${esc(c.label)} `).join('');\n const actorOpts = ['Todos os autores '].concat(\n actors.map(a=>`${esc(a)} `)\n ).join('');\n\n return `\n \n
\n ${loading\n ? `
Carregando histórico…
`\n : (rows ? `
${rows}
` : `
Nenhum evento de auditoria encontrado com os filtros atuais.
`)}\n
\n
',\n kpis:'',\n regras:'',\n rulesets:'',\n auditoria:'',\n estatisticas:'',\n rightArrow:''\n};\nfunction icon(name,cls){ return `${SVG[name]||''} `; }\n\nconst SECTIONS = [\n { id:'indicadores', label:'Indicadores', icon:'indicadores', tag:'Code · DnD', desc:'Reordene, edite, duplique ou oculte os indicadores exibidos no dashboard. Arraste pelos punhos para reorganizar.' },\n { id:'kpis', label:'KPIs', icon:'kpis', tag:'Code · Definições', desc:'Gerencie as definições dos indicadores (KPIs) que o painel referencia. Edite nome, meta, marca e IAP, ou crie um novo mapeando um código de índice da Performance API.' },\n { id:'regras', label:'Regras', icon:'regras', tag:'Code · Remuneração', desc:'Ajuste faixas, bônus e fórmulas por perfil (Líder / GN) que compõem o cálculo de ganhos.' },\n { id:'rulesets', label:'Rulesets', icon:'rulesets', tag:'Code · Versionamento', desc:'Versione as regras de remuneração. Duplique um ruleset ativo para preparar o próximo ciclo sem tocar no conjunto em produção.' },\n { id:'ciclos', label:'Ciclos', icon:'ciclos', tag:'Code · Vínculo', desc:'Vincule cada ciclo a um ruleset e controle status/ciclo atual. Trocar o ruleset de um ciclo muda o cálculo daquele ciclo.' },\n { id:'consultas', label:'Consultas', icon:'consultas', tag:'Code · Databricks', desc:'Biblioteca de consultas SQL parametrizadas ({{param}}) executadas ao vivo no Databricks. Crie, edite, teste consultas e consulte o calendário de ciclos por grupo.' },\n { id:'auditoria', label:'Auditoria', icon:'auditoria', tag:'Code · Somente leitura', desc:'Histórico somente-leitura de \"quem alterou o quê e quando\": KPIs, faixas, bônus, fórmulas, rulesets e ciclos. Filtre por entidade, ação, autor e período; expanda para ver o diff completo.' },\n { id:'acesso', label:'Acessos', icon:'acesso', tag:'Code · Somente leitura', desc:'Registro de impersonações e acessos ao painel: quem visualizou como quem, quando, com qual escopo e ciclo. Estatísticas de uso e tabela do mais recente ao mais antigo.' },\n { id:'estatisticas',label:'Estatísticas', icon:'estatisticas', tag:'Code · Somente leitura', desc:'Painel de uso: sessões ativas agora, logins ao longo do tempo, distribuição por perfil / modo / rede, usuários mais ativos, seções mais acessadas e mix de dispositivo/entrada.' }\n];\n\n// section typeId + which shell params each one needs, mapped to the child's expected param names.\nfunction sectionCfg(d2){\n return {\n indicadores: { type:'natura-x-piloto@pilotAdmScreen', params:{\n items:d2.params.items, kpis:d2.params.kpis, writer:d2.params.itemWriter,\n list:'natura-x-piloto@pilotAdmList', form:'natura-x-piloto@pilotAdmForm' } },\n kpis: { type:'natura-x-piloto@pilotKpiAdmScreen', params:{\n kpis:d2.params.kpis, writer:d2.params.ruleWriter } },\n regras: { type:'natura-x-piloto@pilotRuleAdmScreen', params:{\n bands:d2.params.bands, bonuses:d2.params.bonuses, formulas:d2.params.formulas,\n rulesets:d2.params.rulesets, bandTables:d2.params.bandTables, kpis:d2.params.kpis,\n cycles:d2.params.cycles, writer:d2.params.ruleWriter } },\n rulesets: { type:'natura-x-piloto@pilotRulesetAdmScreen', params:{\n rulesets:d2.params.rulesets, bands:d2.params.bands, formulas:d2.params.formulas,\n bonuses:d2.params.bonuses, cycles:d2.params.cycles, writer:d2.params.ruleWriter } },\n ciclos: { type:'natura-x-piloto@pilotCycleAdmScreen', params:{\n cycles:d2.params.cycles, rulesets:d2.params.rulesets, writer:d2.params.ruleWriter } },\n consultas: { type:'natura-x-piloto@pilotQueryLibAdmScreen', params:{\n queryLib:d2.params.queryLib, queryCalendar:d2.params.queryCalendar,\n queryWriter:d2.params.queryWriter, runner:d2.params.runner } },\n auditoria: { type:'natura-x-piloto@pilotAuditAdmScreen', params:{\n audit:d2.params.audit } },\n acesso: { type:'natura-x-piloto@pilotAccessLogAdmScreen', params:{\n accessLog:d2.params.accessLog } },\n estatisticas: { type:'natura-x-piloto@pilotAccessStatsAdmScreen', params:{\n sessions:d2.params.sessions, accessLog:d2.params.accessLog } }\n };\n}\n\nfunction syncLinksEdge(el){ if(!el) return; el.classList.toggle('atend', el.scrollLeft + el.clientWidth >= el.scrollWidth - 4); }\nfunction revealActiveTab(d2){\n const l = d2.$('.links'); const a = d2.$('.item[data-active]');\n if(l && a){\n const lr = l.getBoundingClientRect(), ar = a.getBoundingClientRect();\n if(ar.left < lr.left || ar.right > lr.right) l.scrollLeft += (ar.left - lr.left) - (lr.width - ar.width)/2;\n }\n syncLinksEdge(l);\n}\n\nexport default {\n css: `\n :host{display:block}\n .app{min-height:100%;height:auto;display:flex;flex-direction:column;background:var(--ground);font-family:var(--fam)}\n .bar{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:8px;min-height:62px;box-sizing:border-box;padding:0 22px;background:var(--surface);border-bottom:1px solid var(--hair)}\n .brand{display:flex;align-items:center;gap:10px;cursor:pointer;padding:6px 6px 6px 0;margin-right:8px;border-radius:10px}\n .brand .logo{width:26px;height:26px;border-radius:8px;background:var(--grad);display:inline-flex;align-items:center;justify-content:center;color:#fff;font:800 14px/1 var(--fam)}\n .brand .name{font:800 15px/1 var(--fam);color:var(--ink);letter-spacing:-.2px}\n .brand .name small{display:block;font:600 10px/1.3 var(--fam);color:var(--muted);letter-spacing:.04em;text-transform:uppercase;margin-top:3px}\n .links{display:flex;gap:4px;margin-left:6px;flex-wrap:nowrap;flex:1 1 auto;min-width:0;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch;\n -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent)}\n .links::-webkit-scrollbar{display:none}\n .links.atend{-webkit-mask-image:none;mask-image:none}\n .item{display:inline-flex;align-items:center;gap:7px;padding:9px 14px;border-radius:10px;cursor:pointer;font:700 13px/1 var(--fam);color:var(--muted);\n background:none;border:none;transition:background .15s,color .15s;white-space:nowrap;flex:0 0 auto}\n .item:hover{background:var(--ground);color:var(--ink)}\n .item[data-active]{color:var(--mag);background:rgba(229,0,75,.10)}\n .g{width:17px;height:17px;flex:none}\n .spacer{margin-left:auto}\n .bar .spacer{flex:0 0 auto;margin-left:0}\n .home-btn,.brand{flex:0 0 auto;white-space:nowrap}\n @media (max-width:900px){\n .bar{flex-wrap:wrap;padding:8px 14px 0;gap:6px 8px;align-items:center}\n .brand{order:1;margin-right:auto;padding:4px 0}\n .brand .name small{display:none}\n .bar>.spacer{display:none}\n .home-btn{order:2;padding:8px 10px}\n .home-btn .lbl{display:none}\n .who{display:none}\n .links{order:3;flex:1 0 100%;margin:0 -14px;padding:2px 14px 8px;gap:2px}\n .item{padding:9px 12px}\n }\n @media (max-width:900px) and (prefers-reduced-motion: no-preference){ .links{scroll-behavior:smooth} }\n .home-btn{display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:10px;cursor:pointer;font:700 12px/1 var(--fam);color:var(--muted);\n background:none;border:1px solid var(--hair);transition:background .15s,color .15s}\n .home-btn:hover{background:var(--ground);color:var(--ink)}\n .home-btn[data-active]{color:var(--mag);border-color:rgba(229,0,75,.30);background:rgba(229,0,75,.06)}\n .home-btn .g{width:16px;height:16px}\n .home-btn[disabled]{opacity:.6;cursor:default}\n .who{font:600 12px/1 var(--fam);color:var(--muted);max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n .slot{flex:1 1 auto;min-height:600px}\n .sechost{display:block;width:100%}\n .home{min-height:100%;height:auto;box-sizing:border-box;background:var(--ground);font-family:var(--fam);padding:40px 44px 64px}\n .inner{max-width:1000px;margin:0 auto}\n .hero h1{margin:0;font:800 34px/1.1 var(--fam);color:var(--ink);letter-spacing:-.6px}\n .hero p{margin:8px 0 0;font:400 15px/1.5 var(--fam);color:var(--muted);max-width:640px}\n .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:22px;margin-top:34px}\n .card{position:relative;background:var(--surface);border:1px solid var(--hair);border-radius:20px;padding:26px;cursor:pointer;\n box-shadow:var(--shadowcard);transition:box-shadow .2s,transform .2s;overflow:hidden}\n .card:hover{box-shadow:var(--shadowraised);transform:translateY(-3px)}\n .card::after{content:'';position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--grad);opacity:0;transition:opacity .2s}\n .card:hover::after{opacity:1}\n .card .ico{width:52px;height:52px;border-radius:14px;background:rgba(229,0,75,.10);display:inline-flex;align-items:center;justify-content:center;color:var(--mag)}\n .card .ico svg{width:26px;height:26px}\n .card h2{margin:16px 0 0;font:800 21px/1.15 var(--fam);color:var(--ink);letter-spacing:-.3px}\n .card .tag{display:inline-block;margin-top:8px;font:700 10px/1 var(--fam);letter-spacing:.06em;text-transform:uppercase;\n color:var(--mag);background:rgba(229,0,75,.10);padding:5px 9px;border-radius:999px}\n .card p{margin:14px 0 0;font:400 13.5px/1.55 var(--fam);color:var(--muted)}\n .card .go{margin-top:18px;display:inline-flex;align-items:center;gap:6px;font:700 13px/1 var(--fam);color:var(--mag)}\n .card .go svg{width:15px;height:15px}\n @media (prefers-reduced-motion: reduce){ .item,.home-btn,.card{transition:none!important} .card:hover{transform:none} }\n `,\n render(d2){\n const t = tok(d2);\n const section = d2.state.section || 'home';\n const vars = `--surface:${t.color.surface};--ground:${t.color.ground};--ink:${t.color.ink};--muted:${t.color.muted};--hair:${t.color.hairline};--mag:${t.color.naturaMagenta};--grad:${t.color.brandGradient};--fam:${t.type.family};--shadowcard:${(t.shadow&&t.shadow.card)||FALLBACK.shadow.card};--shadowraised:${(t.shadow&&t.shadow.raised)||FALLBACK.shadow.raised}`;\n\n let who = '';\n try { const a = d2.auth('pilotAdminAuth'); who = (a && a.user && a.user.email) || ''; } catch(e) {}\n const links = SECTIONS.map(s=>`${icon(s.icon)}${esc(s.label)} `).join('');\n const nav = `\n
\n A \n AdministraçãoPainel de Remuneração \n
\n
${links}
\n
\n
${icon('home')}Início \n ${who?`
${esc(who)} `:''}\n
${icon('logout')}${d2.state.loggingOut?'Saindo…':'Sair'} \n
\n
${icon(s.icon)} \n
${esc(s.label)} ${esc(s.tag)} \n
${esc(s.desc)}
\n
Abrir ${icon('rightArrow')} \n
\n
\n
Administração do Painel \n
Central de configuração do piloto Natura. Gerencie os indicadores do dashboard e as regras de remuneração a partir de um só lugar.
\n
\n
${cards}
\n
Seção desconhecida
`;\n slot = `${inner}
`;\n }\n\n return `${nav}${slot}
`;\n },\n updated(d2){ const l=d2.$('.links'); if(l) syncLinksEdge(l); },\n mounted(d2){\n if(!d2.state.section) d2.state.section = 'home';\n d2.on('[data-logout]','click',async()=>{\n if(d2.state.loggingOut) return;\n d2.state.loggingOut = true;\n try { await d2.auth('pilotAdminAuth').logout(); } catch(e) { d2.log('logout falhou', e); }\n window.location.assign('/');\n });\n d2.on('[data-sec]','click',(e,el)=>{\n const next = el.dataset.sec;\n if(next && next!==d2.state.section){ d2.state.section = next; if(d2.root && d2.root.scrollTo) d2.root.scrollTo(0,0); }\n setTimeout(()=>revealActiveTab(d2), 60);\n });\n // Mobile: keep the active tab inside the scrollable tab strip, and drop the fade once scrolled to the end.\n d2.on('.links','scroll',(e,el)=>syncLinksEdge(el));\n setTimeout(()=>{ revealActiveTab(d2); const l=d2.$('.links'); if(l) syncLinksEdge(l); }, 120);\n }\n};"}},"items":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"items"}}}},"kpis":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"kpis"}}}},"itemWriter":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"itemWriter"}}}},"bands":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"bands"}}}},"bonuses":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"bonuses"}}}},"formulas":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"formulas"}}}},"rulesets":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"rulesets"}}}},"bandTables":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"bandTables"}}}},"cycles":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"cycles"}}}},"ruleWriter":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"ruleWriter"}}}},"audit":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"audit"}}}},"accessLog":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"accessLog"}}}},"sessions":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"sessions"}}}},"queryLib":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"queryLib"}}}},"queryCalendar":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"queryCalendar"}}}},"queryWriter":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"queryWriter"}}}},"runner":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"runner"}}}}}}}}}},{"_id":"6a4ce9aed961b870ddee86db","component":"data2-core-types@Component","system":"688179c2a93dd170ce61e598","params":{"extends":"data2-core-primitives@Block","component":"pilotSimulador","package":"natura-x-piloto","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"const FALLBACK_TOK = {\n color:{ surface:'#FFFFFF', ground:'#FAFAFB', ink:'#1A1C1E', muted:'#6B7280', hairline:'rgba(16,24,40,0.08)',\n naturaMagenta:'#E5004B', naturaOrange:'#EB6619', brandGradient:'linear-gradient(135deg,#E5004B 0%,#EB6619 100%)',\n rampRed:'#FF1418', rampAmber:'#FAA000', rampGreen:'#29AC56', gold:'#F7BE00', money:'#29AC56' },\n radius:{ sm:8, md:12, lg:16, pill:999 },\n type:{ family:\"'Roboto',system-ui,-apple-system,sans-serif\" },\n shadow:{ card:'0 1px 2px rgba(16,24,40,0.04),0 1px 3px rgba(16,24,40,0.08)', raised:'0 4px 12px rgba(16,24,40,0.10)' },\n media:{ natura:'https://natura-x-piloto.data2.media/file/UrhVLdPDEZCXToLgJDPW8',\n avon:'https://natura-x-piloto.data2.media/file/HqLhKqINaRUI9OSBjYGFh',\n lockup:'https://natura-x-piloto.data2.media/file/H0P_N-7AQzQOg_VJMBWzV' }\n};\nlet TOK;\nfunction tok(d2){ if(!TOK){ try{ TOK = d2.call('natura-x-piloto@pilotMTokens'); }catch(e){} if(!TOK||!TOK.color) TOK = FALLBACK_TOK; } return TOK; }\nfunction esc(s){ return String(s==null?'':s).replace(/&/g,'&').replace(//g,'>').replace(/\"/g,'"'); }\nfunction brl(n){ const v = Number(n)||0; return v.toLocaleString('pt-BR',{ style:'currency', currency:'BRL' }); }\nfunction num(n){ const v = Number(n); return isFinite(v) ? v.toLocaleString('pt-BR',{ maximumFractionDigits:0 }) : '—'; }\nfunction pct(n){ if(n==null||!isFinite(Number(n))) return '—'; return (Number(n)).toLocaleString('pt-BR',{ maximumFractionDigits:1 })+'%'; }\nfunction pctClass(a){ if(a==null||!isFinite(Number(a))) return 'n'; const v=Number(a); if(v>=100) return 'g'; if(v>=80) return 'a'; return 'r'; }\n\nfunction icon(name, color, size){\n const s = size||18; const c = color||'#6B7280';\n const A = `xmlns=\"http://www.w3.org/2000/svg\" width=\"${s}\" height=\"${s}\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"${c}\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"`;\n const P = {\n people:``,\n crown:``,\n coins:``,\n flag:``,\n calc:``,\n check:``,\n back:`${P[name]||''} `;\n}\nfunction dashIcon(iconId, color){\n const c = color || '#6B7280';\n const w = `width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"${c}\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"`;\n const P = {\n 'people':``,\n 'crown':``;\n return `${path} `;\n}\nfunction brandMark(t, brand, size){\n const s = size||18;\n const src = String(brand).toLowerCase()==='avon' ? t.media.avon : t.media.natura;\n const label = String(brand).toLowerCase()==='avon' ? 'Avon' : 'Natura';\n return `=Number(r.minPct) && v<=Number(r.maxPct)) return i; }\n return -1;\n}\n// Faixa label: '%' suffix for multiplier / atingimento-style tables, plain range for fixed (ativas-total).\nfunction faixaLabel(r, valueType, kpiCode){\n const suffix = (valueType==='multiplier') ? '%' : '';\n const lo = num(r.minPct);\n const hi = (Number(r.maxPct)>=9999) ? '+' : num(r.maxPct);\n if(Number(r.maxPct)>=9999) return `${lo}${suffix}+`;\n return `${lo}${suffix}–${hi}${suffix}`;\n}\n// Valor cell: multiplier → 'N%' (or ×N%); fixed → R$.\nfunction valorCell(r, valueType){\n if(valueType==='multiplier') return `${num(r.value)}%`;\n return brl(r.value);\n}\nfunction topbar(t){\n return `\n
${icon('back','#E5004B',20)}Voltar ao Painel \n
\n
Simulador de Ganhos \n
\n
${esc(txt)} `;\n // End user (token session): only their own structure is offered — the server enforces the same scope.\n let tokenUser = false; try{ const ns = JSON.parse(window.localStorage.getItem('_d2_natura_session') || 'null'); tokenUser = !!(ns && ns.token); }catch(e){}\n const groupList = tokenUser ? [] : (Array.isArray(groups)?groups:[]).slice();\n // Ensure the current context structure is a selectable option even if it isn't in the static list.\n if(st.group && !groupList.some(g=>String((g&&g.code!=null)?g.code:g)===String(st.group))){\n const lbl = (st.perfil==='gn' ? 'Setor ' : 'Grupo ') + st.group + (st.gvName?(' · '+st.gvName):'');\n groupList.unshift({ code: st.group, name: lbl });\n }\n const groupOpts = `${opt('', st.group, '— Manual (sem grupo) —')}` + groupList.map(g=>{\n const code=(g&&g.code!=null)?g.code:g; const nm=(g&&g.name)?g.name:('Grupo '+code); return opt(code, st.group, nm);\n }).join('');\n const groupSel = `${groupOpts} `;\n const perfilSel = `${opt('lider',st.perfil,'Líder')}${opt('gn',st.perfil,'GN')} `;\n const redeSel = `${opt('rede1',st.rede,'Rede 1')}${opt('rede2',st.rede,'Rede 2')} `;\n const nivelSel = `${opt('prata',st.nivel,'Prata')}${opt('ouro',st.nivel,'Ouro')}${opt('diamante',st.nivel,'Diamante')} `;\n const cycOpts = (Array.isArray(cycles)?cycles:[cycles]).map(c=>{ const code=(c&&c.code!=null)?c.code:c; return opt(code,st.cycle,'Ciclo '+code); }).join('');\n const cycleSel = `${cycOpts} `;\n\n const inpVal = (k)=>{ const v = st.inputs[k]; return (v==null?'':v); };\n const goalVal = (k)=>{ const v = st.goals[k]; return (v==null?'':v); };\n\n const kpiCards = fl.map(f=>{\n const code = f.code;\n const val = st.inputs[code];\n const goal = f.goalKey ? st.goals[f.goalKey] : null;\n const baseline = st.baseline[code];\n const fx = { value: val, goal: goal, baseline: baseline, brand: f.brand };\n const max = sliderMax(fx);\n const v = Number(val)||0;\n const g = (goal!=null && isFinite(Number(goal))) ? Number(goal) : null;\n const at = (g && g>0) ? (v/g*100) : null;\n const atCls = pctClass(at);\n const fillPct = Math.max(0, Math.min(100, (v/max)*100));\n const metaPct = (g!=null) ? Math.max(0, Math.min(100,(g/max)*100)) : null;\n const prodPct = (baseline!=null) ? Math.max(0, Math.min(100,(Number(baseline)/max)*100)) : null;\n const goalCell = f.goalKey ? `Meta \n
` : '';\n const realLbl = f.goalKey ? 'Realizado (simulado)' : 'Valor (simulado)';\n const mkLeft = (p)=>`calc(var(--r) + (${p}/100)*(100% - 2*var(--r)))`;\n const markers = `\n ${metaPct!=null?`
Meta ${num(g)}
`:''}\n ${prodPct!=null?`
Realizado ${num(baseline)}
`:''}`;\n const atChip = (at!=null) ? `${pct(at)} ` : `— `;\n return `\n
\n
${fieldIcon(t,f)}
\n
${esc(f.label)} \n ${atChip}\n
\n
\n
${realLbl} \n
\n ${goalCell}\n
\n
\n
${pct(at)} `:'—';\n return `${ico}${esc(f.label)} \n ${baseline!=null?num(baseline):'—'} \n ${gN!=null?num(gN):'—'} \n ${num(sim)} \n ${atv} \n
${icon('sliders', t.color.muted, 15)} Indicadores — Realizado · Meta · Simulado
\n ${st.loadError?`
${esc(st.loadError)}
`:''}\n
Indicador Realizado Meta Simulado Atingimento ${indRows}
+${brl(d)} vs. grupo `;\n else if(d<-0.5) deltaHtml = `${brl(d)} vs. grupo `;\n else deltaHtml = `= remuneração do grupo `;\n }\n const kpTable = stats.filter(s=>!s.isBonus).map(s=>{\n const cls = s.status==='green'?'g':(s.status==='amber'?'a':(s.status==='red'?'r':'n'));\n const atv = (s.atingimento==null)?'—':`${pct(s.atingimento)} `;\n const brandIco = statIcon(t, s);\n return `${brandIco}${esc(s.label)} \n ${num(s.value)} ${s.goal!=null?num(s.goal):'—'} ${atv} Componente Natura
${brl(comp.natura)}
Componente Avon
${brl(comp.avon)}
Base de remuneração
${brl(comp.remunBase)}
Total bônus
${brl(comp.bonusTotal)}
\n
${icon('gift', wr?t.color.money:t.color.muted, 18)}\n ${esc(b.label||b.bonusType)} \n ${wr?'Recebe':'Não recebe'}
\n
${brl(b.amount)} \n
Nenhum bônus configurado para este perfil/rede.
`;\n\n resultHtml = `\n
${icon('money', t.color.money, 15)} Resultado da simulação\n
\n
\n Remuneração estimada \n ${brl(r.remuneracao)} \n ${deltaHtml}\n
\n
${esc(r.rede==='rede2'?'Rede 2':'Rede 1')} · nível ${esc(r.nivel||'')} · ciclo ${esc(r.cycle||'')} · ${comp.structured?'fórmula estruturada':'cálculo nativo'} · ruleset v${esc(r.rulesetVersion||'')}
\n
\n
${icon('target', t.color.muted, 15)} Atingimento por indicador (motor)
\n
Indicador Realizado Meta Atingimento ${kpTable}
\n
${icon('layers', t.color.muted, 15)} Componentes da remuneração
\n
${compCards}
\n
${icon('gift', t.color.muted, 15)} Bônus & aceleradores
\n
${bonHtml}
\n
\n
${icon('calc', '#C7CCD3', 30)}
Escolha um grupo (ou preencha manualmente) e ajuste os controles — a remuneração recalcula automaticamente.
${icon('layers', t.color.muted, 15)} Tabela de Remuneração
\n
${icon('flag','#E5004B',11)} você está aqui ` : '';\n return `\n ${faixaLabel(r, tbl.valueType, tbl.kpiCode)}${you} \n ${valorCell(r, tbl.valueType)} `;\n }).join('');\n const idxDisp = (idx!=null && isFinite(Number(idx)))\n ? ((tbl.valueType==='multiplier') ? pct(idx) : num(idx)) : '—';\n // accumulate parcela / component for the summary strip\n if(hot>=0){\n const bandVal = Number(rows[hot].value)||0;\n if(!isRede2 && tbl.ref==='ativas-total'){ parcelaAcc.push({brand, ativas:bandVal}); }\n if(!isRede2 && tbl.ref==='atingimento'){ const p=parcelaAcc.find(x=>x.brand===brand); if(p){ p.mult=bandVal; } }\n if(isRede2 && tbl.ref==='pontos'){ const vol=Number(bandVolume(tbl.ref,brand,bd))||0; parcelaAcc.push({brand, mult:bandVal, vol, comp:(bandVal/100)*vol}); }\n }\n return `\n
${brandMark(t, brand, 18)}${esc(tbl.label)} \n ${brand==='avon'?'Avon':'Natura'} ${tbl.valueType==='multiplier'?'Atingimento':'Realizado'}: ${idxDisp}
\n
\n
Parcela ${p.brand==='avon'?'Avon':'Natura'}
\n
${brl(parcela)}
\n
${brl(p.ativas)} × ${num(mult)}% = ${brl(parcela)}
${parts}
`;\n } else {\n const parts = parcelaAcc.filter(p=>p.comp!=null).map(p=>{\n return `Componente ${p.brand==='avon'?'Avon':'Natura'}
\n
${brl(p.comp)}
\n
${num(p.mult)}% × ${num(p.vol)} pontos = ${brl(p.comp)}
${parts}
`;\n }\n\n remunTableHtml = `\n
${icon('layers', t.color.muted, 15)} Tabela de Remuneração${esc(rede==='rede2'?'Rede 2':'Rede 1')}
\n
${esc(modelCaption)} — a faixa destacada é onde a simulação atual se encontra.
\n
${groups}
\n ${strip}\n
${icon('layers', t.color.muted, 15)} Tabela de Remuneração
\n
Sem faixas configuradas para este perfil/rede/nível.
${topbar(t)}\n
\n
\n
${icon('calc', '#FFFFFF', 22)}
\n
Simulador de Ganhos ${tokenUser ? 'Arraste os indicadores e veja como fica a sua remuneração, pelo mesmo motor do painel.' : 'Carregue um grupo real, arraste os indicadores e veja a remuneração pelo mesmo motor do painel.'}
\n
\n ${tokenUser ? '' : `
\n
${icon('people', t.color.muted, 15)} Grupo / usuário a simular\n
\n
\n
Grupo ${groupSel}
\n
Perfil ${perfilSel}
\n
Rede ${redeSel}
\n
Nível ${nivelSel}
\n
Ciclo ${cycleSel}
\n
\n
${groupTitle}
\n
`}\n ${indicatorTable}\n
\n
${icon('receipt', t.color.muted, 15)} Ajuste os indicadores — ${esc(rede==='rede2'?'Rede 2':'Rede 1')}
\n
${kpiCards}
\n
\n ${icon('check','#fff',18)}${st.loading?'Simulando…':'Simular agora'} \n Restaurar realizado \n Recalcula automaticamente (~500ms) pelo endpoint pilotSimulate, sem cache. \n
\n
\n ${resultHtml}\n ${remunTableHtml}\n
${pct(at)} ` : '—';\n }\n\n d2.on('.sel','change',(e,el)=>{\n const k = el.getAttribute('data-k'); if(!k) return;\n st[k] = el.value;\n if(k==='group'){ loadGroup(); return; }\n if(k==='rede' || k==='perfil'){\n // perfil/rede switch changes the whole indicator set — reset and reload.\n st.inputs={}; st.goals={}; st.baseline={}; st.baselineGoal={}; st.result=null; st.error=null;\n st.groupLoaded=false; st.baseRemuneracao=null; st.bandTables=null; st.bandTablesSig=null;\n if(st.group){ loadGroup(); return; }\n d2.refresh(); return;\n }\n if(k==='cycle'){ if(st.group){ loadGroup(); return; } }\n d2.refresh();\n scheduleSimulate();\n });\n\n d2.on('.rng','input',(e,el)=>{\n const code = el.getAttribute('data-rng'); if(!code) return;\n const v = Number(el.value);\n if(!st.inputs) st.inputs={};\n st.inputs[code] = v;\n syncLive(code, v);\n scheduleSimulate();\n });\n\n d2.on('.num','input',(e,el)=>{\n const code = el.getAttribute('data-code');\n const goal = el.getAttribute('data-goal');\n const v = el.value===''? null : Number(el.value);\n if(!st.inputs) st.inputs={}; if(!st.goals) st.goals={};\n if(code!=null){\n st.inputs[code]=v;\n const rng = d2.$(`.rng[data-rng=\"${code}\"]`);\n if(rng){ const max=Number(rng.getAttribute('data-max'))||1; rng.value = String(Math.max(0,Math.min(max, Number(v)||0))); }\n syncLive(code, v||0);\n scheduleSimulate();\n } else if(goal!=null){\n st.goals[goal]=v;\n scheduleSimulate();\n }\n });\n\n d2.on('.sim','click', ()=>{ if(debTimer) clearTimeout(debTimer); runSimulate(); });\n d2.on('.reset','click', ()=>{\n if(st.groupLoaded){\n st.inputs = {...st.baseline}; st.goals = {...st.baselineGoal}; d2.refresh(); scheduleSimulate();\n } else {\n st.inputs = {}; st.goals = {}; st.result=null; d2.refresh();\n }\n });\n\n async function loadCycleList(){\n try{\n const ds = d2.data('pilot-cycleDataSet');\n if(!ds) return;\n let rows = ds.records();\n if(!rows || !rows.length){ rows = await ds.loadAll(); }\n if(Array.isArray(rows) && rows.length){\n st.cycleList = rows.map(r=>({ code:String(r.code), name:('Ciclo '+r.code) }))\n .sort((a,b)=> a.codeb.code?1:0));\n d2.refresh();\n }\n }catch(err){ d2.log('cycle list load error', err); }\n }\n loadCycleList();\n\n if(st.group && st.autoLoadOnMount!==false) loadGroup(); else d2.refresh();\n }\n};"}},"cycles":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"cycles"}}}},"defaultCycle":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"defaultCycle"}}}},"groups":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"groups"}}}},"defaultGroup":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"defaultGroup"}}}},"backRef":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"backRef"}}}}}}}}}},{"_id":"6a4ceaa06c020b3085c1e987","component":"data2-core-types@Component","system":"688179c2a93dd170ce61e598","params":{"extends":"data2-core-primitives@Block","component":"pilotSimuladorLauncher","package":"natura-x-piloto","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"function icon(name, color, size){\n const s = size||20; const c = color||'#FFFFFF';\n const A = `xmlns=\"http://www.w3.org/2000/svg\" width=\"${s}\" height=\"${s}\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"${c}\" stroke-width=\"1.9\" stroke-linecap=\"round\" stroke-linejoin=\"round\"`;\n const P = {\n calc:``\n };\n return `${P[name]||''} `;\n}\nconst FAB_CSS = `\n :host{ display:block; }\n .fab{ position:fixed; right:24px; bottom:24px; z-index:9999; height:52px; padding:0 20px 0 18px;\n display:inline-flex; align-items:center; gap:10px; border:none; border-radius:999px; cursor:pointer;\n color:#fff; background:linear-gradient(135deg,#E5004B 0%,#EB6619 100%); font:700 14px/1 'Roboto',system-ui,sans-serif;\n box-shadow:0 6px 18px rgba(229,0,75,.34); transition:transform 150ms ease-out,box-shadow 150ms ease-out; }\n .fab:hover{ transform:translateY(-2px); box-shadow:0 10px 24px rgba(229,0,75,.40); }\n @media (prefers-reduced-motion:reduce){ .fab{ transition:none; } .fab:hover{ transform:none; } }\n @media (max-width:640px){ .fab{ right:16px; bottom:16px; height:46px; padding:0 16px 0 14px; font-size:13px; } }\n `;\n// position:fixed breaks under a transformed ancestor (the player wraps artboards), so the\n// button lives in a portal with its own shadow root; removed on unmount.\nfunction fabPortal(d2, kind, html, onClick){\n if(typeof document === 'undefined') return;\n const old = document.querySelector('[data-pilot-fab=\"'+kind+'\"]');\n if(old) old.remove();\n const host = document.createElement('div');\n host.setAttribute('data-pilot-fab', kind);\n const sh = host.attachShadow({ mode:'open' });\n sh.innerHTML = '' + html;\n document.body.appendChild(host);\n const b = sh.querySelector('.fab');\n if(b) b.addEventListener('click', onClick);\n d2.onUnmount(()=>{ host.remove(); });\n}\nexport default {\n css: `:host{ display:none; }`,\n render(d2){\n return `${icon('calc','#fff',20)}${label} `;\n const go = ()=>{\n const ref = d2.param('artboardRef','');\n if(!ref) return;\n // ACCESS TRACKING (additive) — record a Simulador section view before navigating away.\n try{\n const sid = (typeof window!=='undefined' && window.sessionStorage) ? window.sessionStorage.getItem('pilotAccessSessionId') : '';\n if(sid) d2.rush('pilotTrackAccess').invoke({ action:'view', sessionId: sid, section:'simulador', drillLevel:'launcher' }).catch(()=>{});\n }catch(e){}\n // CURRENT-CONTEXT PASS — read the live dashboard view and hand it to the Simulador screen.\n // perfil gv → simulate the GV's default sector context; leader/gn → that entity.\n let ctx = null;\n try{\n const store = d2.store('pilotDashboardStore');\n if(store){\n ctx = {\n perfil: store.get('perfil',''),\n structureCode: String(store.get('selectedGroup','') || store.get('structureCode','') || ''),\n rede: store.get('rede',''),\n cycle: String(store.get('cycle','') || ''),\n gvName: store.get('gvName','')\n };\n d2.shared.set('pilotSimContext', ctx, {global:true});\n }\n }catch(e){ d2.log('sim context read error', e); }\n // Encode context into the URL so it survives a full-page nav to the screen artboard.\n let qs = '';\n try{\n if(ctx){\n const p = [];\n if(ctx.perfil) p.push('perfil='+encodeURIComponent(ctx.perfil));\n if(ctx.structureCode) p.push('structureCode='+encodeURIComponent(ctx.structureCode));\n if(ctx.rede) p.push('rede='+encodeURIComponent(ctx.rede));\n if(ctx.cycle) p.push('cycle='+encodeURIComponent(ctx.cycle));\n if(ctx.gvName) p.push('gvName='+encodeURIComponent(ctx.gvName));\n if(p.length) qs = '?'+p.join('&');\n }\n }catch(e){}\n const path = (typeof location!=='undefined' && location.pathname) || '';\n const inPreview = /\\/preview\\//.test(path);\n try{\n if(inPreview && typeof location!=='undefined'){\n // Isolated preview host renders ONE artboard by ref — hop to the sibling preview route.\n location.href = '/preview/'+ref+qs; return;\n }\n // d2.router().goTo() does not navigate from this component in the player — drive the\n // browser router via history + popstate, remembering the dashboard URL (keeps ?token).\n try{ window.sessionStorage.setItem('pilotReturnUrl', location.pathname + location.search); }catch(e){}\n history.pushState({}, '', '/'+ref+qs); window.dispatchEvent(new PopStateEvent('popstate')); return;\n if(typeof location!=='undefined'){ location.href = '/preview/'+ref+qs; }\n }catch(err){ d2.log('launcher nav error', err); if(typeof location!=='undefined'){ location.href = '/preview/'+ref+qs; } }\n };\n fabPortal(d2, 'simulador', html, go);\n // Hide the button while the dashboard shows \"Sessão inválida\" — the shell sets the flag asynchronously.\n const syncVis = ()=>{ try{ const h = document.querySelector('[data-pilot-fab=\"simulador\"]'); if(h) h.style.display = d2.shared.get('pilotTokenInvalid', false, { global:true }) ? 'none' : ''; }catch(e){} };\n syncVis(); const visTimer = setInterval(syncVis, 400); d2.onUnmount(()=>clearInterval(visTimer));\n }\n};"}},"artboardRef":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"artboardRef"}}}},"label":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"label"}}}}}}}}}},{"_id":"6a4cedd991afdd4d5cd38fac","component":"data2-core-types@Component","system":"688179c2a93dd170ce61e598","params":{"extends":"data2-core-primitives@Block","component":"pilotHistoricoScreen","package":"natura-x-piloto","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"const FALLBACK_TOK = {\n color:{ surface:'#FFFFFF', ground:'#FAFAFB', ink:'#1A1C1E', muted:'#6B7280', hairline:'rgba(16,24,40,0.08)',\n naturaMagenta:'#E5004B', naturaOrange:'#EB6619', brandGradient:'linear-gradient(135deg,#E5004B 0%,#EB6619 100%)',\n rampRed:'#FF1418', rampAmber:'#FAA000', rampGreen:'#29AC56', gold:'#F7BE00', money:'#29AC56' },\n radius:{ sm:8, md:12, lg:16, pill:999 },\n type:{ family:\"'Roboto',system-ui,-apple-system,sans-serif\" },\n shadow:{ card:'0 1px 2px rgba(16,24,40,0.04),0 1px 3px rgba(16,24,40,0.08)', raised:'0 4px 12px rgba(16,24,40,0.10)' },\n media:{ natura:'https://natura-x-piloto.data2.media/file/UrhVLdPDEZCXToLgJDPW8',\n avon:'https://natura-x-piloto.data2.media/file/HqLhKqINaRUI9OSBjYGFh',\n lockup:'https://natura-x-piloto.data2.media/file/H0P_N-7AQzQOg_VJMBWzV' }\n};\nlet TOK;\nfunction tok(d2){ if(!TOK){ try{ TOK = d2.call('natura-x-piloto@pilotMTokens'); }catch(e){} if(!TOK||!TOK.color) TOK = FALLBACK_TOK; } return TOK; }\nfunction esc(s){ return String(s==null?'':s).replace(/&/g,'&').replace(//g,'>').replace(/\"/g,'"'); }\nfunction brl(n){ const v = Number(n)||0; return v.toLocaleString('pt-BR',{ style:'currency', currency:'BRL' }); }\nfunction num(n){ const v = Number(n); return isFinite(v) ? v.toLocaleString('pt-BR',{ maximumFractionDigits:0 }) : '—'; }\nfunction pct(n){ if(n==null||!isFinite(Number(n))) return '—'; return (Number(n)).toLocaleString('pt-BR',{ maximumFractionDigits:1 })+'%'; }\n\n// Inline SVG icon set — uniform stroke style, token-colored. No emoji.\nfunction icon(name, color, size){\n const s = size||18; const c = color||'#6B7280';\n const A = `xmlns=\"http://www.w3.org/2000/svg\" width=\"${s}\" height=\"${s}\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"${c}\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"`;\n const P = {\n history:``,\n crown:``,\n receipt:``,\n layers:``,\n chevron:`${P[name]||''} `;\n}\nfunction brandMark(t, brand, size){\n const s = size||18;\n const src = String(brand).toLowerCase()==='avon' ? t.media.avon : t.media.natura;\n const label = String(brand).toLowerCase()==='avon' ? 'Avon' : 'Natura';\n return ``,\n 'crown':``;\n return `${path} `;\n}\n// Dashboard-parity stat icon: brand → brandMark; else the SAME svgIcon map the dashboard uses,\n// crown→gold, else status color / muted. Drives off stats[].icon and stats[].brand exactly like pilotMGroupCard.\nfunction statIcon(t, s){\n const hasBrand = s.brand === 'natura' || s.brand === 'avon';\n if(hasBrand) return brandMark(t, s.brand, 16);\n const col = s.status==='green'?t.color.rampGreen:(s.status==='amber'?t.color.rampAmber:(s.status==='red'?t.color.rampRed:null));\n const iconId = s.icon || 'target';\n const tint = (iconId==='crown') ? t.color.gold : (col || t.color.muted || '#6B7280');\n return dashIcon(iconId, tint);\n}\n// Sticky nav topbar + back-to-dashboard. Matches dashboard chrome (lockup + title + brand-accent back).\nfunction topbar(t){\n return `\n
${icon('back','#E5004B',20)}Voltar ao Painel \n
\n
Histórico de Ganhos \n
\n
Fechado `;\n if(s==='open' || s==='current') return `Aberto `;\n return `${esc(status||'—')} `;\n}\n// Inline SVG sparkline of a numeric series. Clean vector, no emoji.\nfunction sparkline(values, w, h, color){\n const arr = (values||[]).map(v=>Number(v)||0);\n if(arr.length < 2) return ``).join('');\n return `\n ${dots} `;\n}\n\nfunction redeLabel(r){ return r==='rede2' ? 'Rede 2' : 'Rede 1'; }\n// Read the current-view context handed over by the launcher (query first, then shared UIState).\nfunction readHistContext(d2){\n const out = { perfil:'', structureCode:'', rede:'', cycle:'', gvName:'' };\n try{\n const qs = (typeof location!=='undefined' && location.search) ? location.search : '';\n if(qs){\n const p = new URLSearchParams(qs);\n out.perfil = p.get('perfil') || '';\n out.structureCode = p.get('structureCode') || '';\n out.rede = p.get('rede') || '';\n out.cycle = p.get('cycle') || '';\n out.gvName = p.get('gvName') || '';\n }\n }catch(e){}\n try{\n const sh = d2.shared.get('pilotSimContext', null, {global:true});\n if(sh){\n if(!out.perfil) out.perfil = sh.perfil || '';\n if(!out.structureCode) out.structureCode = String(sh.structureCode||'');\n if(!out.rede) out.rede = sh.rede || '';\n if(!out.cycle) out.cycle = String(sh.cycle||'');\n if(!out.gvName) out.gvName = sh.gvName || '';\n }\n }catch(e){}\n return out;\n}\n\nexport default {\n css: `\n :host{ display:block; min-height:100%; height:auto; background:#FAFAFB; font-family:'Roboto',system-ui,-apple-system,sans-serif; color:#1A1C1E; }\n .page{ min-height:100%; background:#FAFAFB; }\n *{ box-sizing:border-box; }\n .topbar{ position:sticky; top:0; z-index:50; display:flex; align-items:center; gap:14px; height:60px; padding:0 18px;\n background:#FFFFFF; border-bottom:1px solid rgba(16,24,40,0.08); box-shadow:0 1px 3px rgba(16,24,40,0.05); }\n .backbtn{ display:inline-flex; align-items:center; gap:7px; height:38px; padding:0 14px 0 10px; border:1px solid rgba(229,0,75,.24);\n border-radius:999px; background:#fff; color:#E5004B; font:700 13px/1 'Roboto',sans-serif; cursor:pointer;\n transition:background 150ms ease-out,border-color 150ms ease-out,transform 150ms ease-out; }\n .backbtn:hover{ background:rgba(229,0,75,.06); border-color:rgba(229,0,75,.4); transform:translateX(-1px); }\n .backbtn:active{ transform:translateX(0); }\n .lock{ height:28px; display:flex; align-items:center; margin-left:2px; padding-left:14px; border-left:1px solid rgba(16,24,40,0.10); }\n .lock img{ height:100%; width:auto; display:block; }\n .tbttl{ font:600 15px/1 'Roboto',sans-serif; color:#1A1C1E; letter-spacing:.1px; }\n .tbspacer{ flex:1 1 auto; }\n .wrap{ max-width:960px; margin:0 auto; padding:20px 16px 48px; }\n .head{ display:flex; align-items:center; gap:12px; margin:0 0 18px; flex-wrap:wrap; }\n .head .mk{ width:40px; height:40px; border-radius:12px; display:flex; align-items:center; justify-content:center;\n background:linear-gradient(135deg,#E5004B 0%,#EB6619 100%); box-shadow:0 4px 12px rgba(229,0,75,.28); flex:0 0 40px; }\n .head .htxt{ flex:1 1 auto; min-width:0; }\n .head h1{ font:700 22px/1.1 'Roboto',sans-serif; margin:0; letter-spacing:-.2px; }\n .head p{ margin:2px 0 0; font:400 12px/1.3 'Roboto',sans-serif; color:#6B7280; }\n .card{ background:#FFFFFF; border:1px solid rgba(16,24,40,0.08); border-radius:16px;\n box-shadow:0 1px 2px rgba(16,24,40,0.04),0 1px 3px rgba(16,24,40,0.08); padding:18px; margin-bottom:16px; }\n .card > .ct{ display:flex; align-items:center; gap:8px; font:700 11px/1 'Roboto',sans-serif; letter-spacing:.6px;\n text-transform:uppercase; color:#6B7280; margin:0 0 14px; }\n .idrow{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }\n .idrow .who{ flex:1 1 220px; min-width:0; }\n .idrow .who .nm{ font:700 17px/1.2 'Roboto',sans-serif; color:#1A1C1E; letter-spacing:-.2px; }\n .idrow .who .meta{ margin-top:3px; font:500 12px/1.3 'Roboto',sans-serif; color:#6B7280; }\n .fld{ display:flex; flex-direction:column; gap:5px; min-width:0; flex:0 0 200px; }\n .lbl{ font:600 10px/1 'Roboto',sans-serif; letter-spacing:.5px; text-transform:uppercase; color:#6B7280; }\n .sel{ appearance:none; -webkit-appearance:none; width:100%; min-width:0; height:40px; padding:0 34px 0 12px;\n border:1px solid rgba(16,24,40,0.14); border-radius:10px; background:#FFFFFF; color:#1A1C1E;\n font:500 13px/1 'Roboto',sans-serif; cursor:pointer; transition:border-color 150ms ease-out,box-shadow 150ms ease-out;\n background-image:url(\"data:image/svg+xml;utf8,${esc(txt)} `;\n const isGn = (st.perfil==='gn');\n // End user (token session): only their own structure is offered — the server enforces the same scope.\n let tokenUser = false; try{ const ns = JSON.parse(window.localStorage.getItem('_d2_natura_session') || 'null'); tokenUser = !!(ns && ns.token); }catch(e){}\n const groupList = tokenUser ? [] : (Array.isArray(groups)?groups:[]).slice();\n if(st.structureCode && !groupList.some(g=>String((g&&g.code!=null)?g.code:g)===String(st.structureCode))){\n const lbl = (isGn?'Setor ':'Grupo ') + st.structureCode + (st.gvName?(' · '+st.gvName):'');\n groupList.unshift({ code: st.structureCode, name: lbl });\n }\n const groupOpts = groupList.map(g=>{\n const code = (g && g.code!=null) ? g.code : g;\n const nm = (g && g.name) ? g.name : ('Grupo '+code);\n return opt(code, st.structureCode, nm);\n }).join('');\n const groupSel = `${groupOpts} `;\n\n const H = st.history;\n const entityWord = isGn ? 'Setor' : 'Grupo';\n const perfilLabel = isGn ? 'GN' : 'Líder';\n const identity = H ? `\n \n
${esc(H.leaderName||(entityWord+' '+st.structureCode))}
\n
${esc(perfilLabel)} · ${esc(entityWord)} ${esc(st.structureCode)} · ${esc(redeLabel(H.rede))}${H.nivel?(' · nível '+esc(H.nivel)):''}
\n
\n
${esc(entityWord)} ${esc(st.structureCode||'—')}
\n
Selecione um ${esc(entityWord.toLowerCase())} para ver o histórico
\n
`;\n } else if(st.histError){\n listHtml = `${esc(st.histError)}
`;\n } else if(H && Array.isArray(H.history) && H.history.length){\n const series = H.history.map(h=>Number(h.remuneracao)||0);\n const rows = H.history.map((h,i)=>{\n const prev = i>0 ? (Number(H.history[i-1].remuneracao)||0) : null;\n const cur = Number(h.remuneracao)||0;\n let trendHtml = `${icon('dash', t.color.muted, 14)} `;\n if(prev!=null){\n if(cur > prev){ trendHtml = `${icon('trendUp','#1F8A45',15)} ${pct(((cur-prev)/(prev||1))*100)} `; }\n else if(cur < prev){ trendHtml = `${icon('trendDown','#D01418',15)} ${pct(((cur-prev)/(prev||1))*100)} `; }\n else { trendHtml = `${icon('dash', t.color.muted, 14)} 0% `; }\n }\n const selCls = String(st.selectedCycle)===String(h.cycle) ? ' sel' : '';\n const dotColor = selCls ? '#FFFFFF' : t.color.muted;\n return `\n
${icon('clock', dotColor, 17)}
\n
\n
Ciclo ${esc(h.cycle)} ${statusChip(h.status)}${h.isCurrent?'Atual ':''}
\n
${esc(h.label||'')}
\n
\n
\n
${brl(h.remuneracao)}
\n
${trendHtml}
\n
\n
${icon('chevron', selCls?'#E5004B':'#C7CCD3', 18)}
\n
${sparkline(series, 220, 44, sparkColor)}
\n ${rows}
`;\n } else if(H) {\n listHtml = `${icon('history','#C7CCD3',30)}
Nenhum ciclo disponível para este grupo.
`;\n }\n\n let exHtml = '';\n if(st.selectedCycle!=null){\n if(st.exLoading){\n exHtml = `
${pct(s.atingimento)} `;\n const brandIco = statIcon(t, s);\n return `${brandIco}${esc(s.label)} \n ${num(s.value)} ${s.goal!=null?num(s.goal):'—'} ${atv} Componente Natura
${brl(comp.natura)}
Componente Avon
${brl(comp.avon)}
Base de remuneração
${brl(comp.remunBase)}
Total bônus
${brl(comp.bonusTotal)}
\n
${icon('gift', wr?t.color.money:t.color.muted, 18)}\n ${esc(b.label||b.bonusType)} \n ${wr?'Recebe':'Não recebe'}
\n
${brl(b.amount)} \n
Nenhum bônus configurado para este perfil/rede.
`;\n\n exHtml = `\n
${icon('receipt', t.color.muted, 15)} Extrato — Ciclo ${esc(r.cycle)}
\n
\n Remuneração do ciclo \n ${brl(r.remuneracao)} \n
\n
${esc(H?H.leaderName:'')} · ${esc(redeLabel(r.rede))} · nível ${esc(r.nivel||'')} · ${comp.structured?'fórmula estruturada':'cálculo nativo'} · ruleset v${esc(r.rulesetVersion||'')}
\n
${icon('target', t.color.muted, 15)} Indicadores & atingimentos
\n
Indicador Realizado Meta Atingimento ${kpTable}
\n
${icon('layers', t.color.muted, 15)} Componentes da remuneração
\n
${compCards}
\n
${icon('gift', t.color.muted, 15)} Bônus & aceleradores
\n
${bonHtml}
\n
${topbar(t)}\n
\n
\n
${icon('history', '#FFFFFF', 22)}
\n
Histórico de Ganhos Remuneração do grupo ao longo dos ciclos — clique em um ciclo para ver o extrato completo.
\n
\n
\n
${icon('people', t.color.muted, 15)} Grupo
\n
\n ${identity}\n
Selecionar grupo ${groupSel}
\n
\n
\n
\n
${icon('history', t.color.muted, 15)} Linha do tempo de remuneração
\n ${listHtml}\n
\n ${exHtml}\n
${P[name]||''} `;\n}\nconst FAB_CSS = `\n :host{ display:block; }\n .fab{ position:fixed; right:24px; bottom:96px; z-index:9998; height:52px; padding:0 20px 0 18px;\n display:inline-flex; align-items:center; gap:10px; border:none; border-radius:999px; cursor:pointer;\n color:#fff; background:linear-gradient(135deg,#E5004B 0%,#EB6619 100%); font:700 14px/1 'Roboto',system-ui,sans-serif;\n box-shadow:0 6px 18px rgba(229,0,75,.34); transition:transform 150ms ease-out,box-shadow 150ms ease-out; }\n .fab:hover{ transform:translateY(-2px); box-shadow:0 10px 24px rgba(229,0,75,.40); }\n @media (prefers-reduced-motion:reduce){ .fab{ transition:none; } .fab:hover{ transform:none; } }\n @media (max-width:640px){ .fab{ right:16px; bottom:74px; height:46px; padding:0 16px 0 14px; font-size:13px; } }\n `;\n// position:fixed breaks under a transformed ancestor (the player wraps artboards), so the\n// button lives in a portal with its own shadow root; removed on unmount.\nfunction fabPortal(d2, kind, html, onClick){\n if(typeof document === 'undefined') return;\n const old = document.querySelector('[data-pilot-fab=\"'+kind+'\"]');\n if(old) old.remove();\n const host = document.createElement('div');\n host.setAttribute('data-pilot-fab', kind);\n const sh = host.attachShadow({ mode:'open' });\n sh.innerHTML = '' + html;\n document.body.appendChild(host);\n const b = sh.querySelector('.fab');\n if(b) b.addEventListener('click', onClick);\n d2.onUnmount(()=>{ host.remove(); });\n}\nexport default {\n css: `:host{ display:none; }`,\n render(d2){\n return `${icon('history','#fff',20)}${label} `;\n const go = ()=>{\n const ref = d2.param('artboardRef','');\n if(!ref) return;\n // ACCESS TRACKING (additive) — record a Histórico section view before navigating away.\n try{\n const sid = (typeof window!=='undefined' && window.sessionStorage) ? window.sessionStorage.getItem('pilotAccessSessionId') : '';\n if(sid) d2.rush('pilotTrackAccess').invoke({ action:'view', sessionId: sid, section:'historico', drillLevel:'launcher' }).catch(()=>{});\n }catch(e){}\n // CURRENT-CONTEXT PASS — hand the live dashboard view to the Histórico screen.\n let ctx = null;\n try{\n const store = d2.store('pilotDashboardStore');\n if(store){\n ctx = {\n perfil: store.get('perfil',''),\n structureCode: String(store.get('selectedGroup','') || store.get('structureCode','') || ''),\n rede: store.get('rede',''),\n cycle: String(store.get('cycle','') || ''),\n gvName: store.get('gvName','')\n };\n d2.shared.set('pilotSimContext', ctx, {global:true});\n }\n }catch(e){ d2.log('hist context read error', e); }\n let qs = '';\n try{\n if(ctx){\n const p = [];\n if(ctx.perfil) p.push('perfil='+encodeURIComponent(ctx.perfil));\n if(ctx.structureCode) p.push('structureCode='+encodeURIComponent(ctx.structureCode));\n if(ctx.rede) p.push('rede='+encodeURIComponent(ctx.rede));\n if(ctx.cycle) p.push('cycle='+encodeURIComponent(ctx.cycle));\n if(ctx.gvName) p.push('gvName='+encodeURIComponent(ctx.gvName));\n if(p.length) qs = '?'+p.join('&');\n }\n }catch(e){}\n const path = (typeof location!=='undefined' && location.pathname) || '';\n const inPreview = /\\/preview\\//.test(path);\n try{\n if(inPreview && typeof location!=='undefined'){\n location.href = '/preview/'+ref+qs; return;\n }\n // d2.router().goTo() does not navigate from this component in the player — drive the\n // browser router via history + popstate, remembering the dashboard URL (keeps ?token).\n try{ window.sessionStorage.setItem('pilotReturnUrl', location.pathname + location.search); }catch(e){}\n history.pushState({}, '', '/'+ref+qs); window.dispatchEvent(new PopStateEvent('popstate')); return;\n if(typeof location!=='undefined'){ location.href = '/preview/'+ref+qs; }\n }catch(err){ d2.log('launcher nav error', err); if(typeof location!=='undefined'){ location.href = '/preview/'+ref+qs; } }\n };\n fabPortal(d2, 'historico', html, go);\n // Hide the button while the dashboard shows \"Sessão inválida\" — the shell sets the flag asynchronously.\n const syncVis = ()=>{ try{ const h = document.querySelector('[data-pilot-fab=\"historico\"]'); if(h) h.style.display = d2.shared.get('pilotTokenInvalid', false, { global:true }) ? 'none' : ''; }catch(e){} };\n syncVis(); const visTimer = setInterval(syncVis, 400); d2.onUnmount(()=>clearInterval(visTimer));\n }\n};\n"}},"artboardRef":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"artboardRef"}}}},"label":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"label"}}}}}}}}}},{"_id":"6a4d0ea891afdd4d5cd4381b","component":"data2-core-types@Component","system":"688179c2a93dd170ce61e598","params":{"extends":"data2-core-primitives@Block","component":"pilotAccessLogAdmScreen","package":"natura-x-piloto","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"const FALLBACK = {\n color:{surface:'#FFFFFF',ground:'#FAFAFB',ink:'#1A1C1E',muted:'#6B7280',hairline:'rgba(16,24,40,0.08)',naturaMagenta:'#E5004B',naturaOrange:'#EB6619',brandGradient:'linear-gradient(135deg,#E5004B 0%,#EB6619 100%)',money:'#29AC56',rampGreen:'#29AC56',rampRed:'#FF1418',rampAmber:'#FAA000',gold:'#F7BE00'},\n radius:{sm:8,md:12,lg:16,pill:999},\n type:{family:\"'Roboto',system-ui,-apple-system,sans-serif\"},\n shadow:{card:'0 1px 2px rgba(16,24,40,0.04),0 1px 3px rgba(16,24,40,0.08)',raised:'0 8px 24px rgba(16,24,40,0.18)'},\n motion:{hover:'150ms ease-out',mount:'400ms cubic-bezier(0.4,0,0.2,1)',fade:'200ms ease-out'}\n};\nlet TOK;\nfunction tok(d2){ if(!TOK){ try{ TOK = d2.call('natura-x-piloto@pilotMTokens'); }catch(e){} if(!TOK||!TOK.color) TOK = FALLBACK; } return TOK; }\nfunction esc(s){ return String(s==null?'':s).replace(/&/g,'&').replace(//g,'>').replace(/\"/g,'"'); }\n\nconst PERFIL_LABEL = { gv:'GV', gn:'GN', lider:'Líder' };\nfunction perfilLabel(p){ return PERFIL_LABEL[p] || String(p||'—'); }\nconst ACTION_META = {\n 'impersonate-start':{ label:'Início impersonação', cls:'start' },\n 'impersonate-end':{ label:'Fim impersonação', cls:'end' },\n 'view':{ label:'Visualização', cls:'view' },\n 'simulate':{ label:'Simulação', cls:'sim' },\n 'export':{ label:'Exportação', cls:'exp' },\n 'login':{ label:'Login', cls:'start' },\n 'session-end':{ label:'Fim de sessão', cls:'end' }\n};\nfunction actionMeta(a){ return ACTION_META[String(a||'')] || { label:String(a||'—'), cls:'view' }; }\n\nconst ICON = (()=>{\n const S = (p)=>`${p} `;\n return {\n search:S(''),\n target:S('')\n };\n})();\n\nfunction actorInitials(name){\n const parts = String(name||'').trim().split(/\\s+/).filter(Boolean);\n if(!parts.length) return '?';\n if(parts.length===1) return parts[0].slice(0,2).toUpperCase();\n return (parts[0][0]+parts[parts.length-1][0]).toUpperCase();\n}\nfunction relTime(iso){\n const t = new Date(iso).getTime();\n if(!isFinite(t)) return '';\n const diff = Date.now()-t;\n const s = Math.round(diff/1000);\n if(s<60) return 'agora mesmo';\n const m = Math.round(s/60); if(m<60) return `há ${m} min`;\n const h = Math.round(m/60); if(h<24) return `há ${h} h`;\n const dd = Math.round(h/24); if(dd<30) return `há ${dd} d`;\n try{ return new Date(iso).toLocaleDateString('pt-BR',{day:'2-digit',month:'short'}); }catch(e){ return ''; }\n}\nfunction absTime(iso){\n try{ return new Date(iso).toLocaleString('pt-BR',{day:'2-digit',month:'2-digit',year:'numeric',hour:'2-digit',minute:'2-digit'}); }\n catch(e){ return String(iso||''); }\n}\n\nfunction computeStats(rows){\n const starts = rows.filter(r=>String(r.action)==='impersonate-start');\n const actors = {};\n const targets = {};\n starts.forEach(r=>{\n const a = r.actorName || r.actorEmail || r.actorUserId;\n if(a) actors[a] = (actors[a]||0)+1;\n const t = r.targetName || r.targetUserId;\n if(t) targets[t] = (targets[t]||0)+1;\n });\n const distinctActors = Object.keys(actors).length;\n let topTarget = '—'; let topN = 0;\n Object.keys(targets).forEach(k=>{ if(targets[k]>topN){ topN=targets[k]; topTarget=k; } });\n return { totalImpersonations: starts.length, distinctActors, topTarget, topTargetCount: topN };\n}\n\nconst ACTION_FILTERS = [\n { key:'', label:'Todas' },\n { key:'impersonate-start', label:'Início' },\n { key:'impersonate-end', label:'Fim' },\n { key:'login', label:'Login' },\n { key:'view', label:'Visualização' }\n];\n\nfunction rowMarkup(rec){\n const m = actionMeta(rec.action);\n const id = String(rec._id||'');\n // Two record shapes share pilot-access-log: impersonation events (actor*/target*/scope)\n // and pilotTrackAccess session events (name/userId/perfil/section/mode).\n const actor = rec.actorName || rec.actorEmail || rec.name || (rec.perfil==='gv' ? rec.gvName : '') || rec.userId || '—';\n const actorPerfil = rec.actorPerfil || rec.actualPerfil || rec.perfil;\n const target = rec.targetName || (rec.action==='impersonate-end' ? '(fim)' : (rec.section || '—'));\n const targetPerfil = rec.targetPerfil || rec.effectivePerfil || rec.perfil || '';\n const scope = rec.scope && rec.scope!=='n/a' ? rec.scope : (rec.mode || '—');\n return `\n ${esc(relTime(rec.at))} ${esc(absTime(rec.at))} ${esc(actorInitials(actor))} ${esc(actor)} ${esc(perfilLabel(actorPerfil))} ${ICON.arrow} \n ${esc(target)} ${rec.impersonatedCode||rec.structureCode?`${esc(rec.impersonatedCode||rec.structureCode)} `:''}${esc(perfilLabel(targetPerfil))} ${esc(m.label)} ${esc(scope)} \n ${esc(rec.cycle||'—')} \n `;\n}\n\nexport default {\n css: `\n :host{display:block}\n .screen{min-height:100%;height:auto;display:flex;flex-direction:column;background:var(--ground);font-family:var(--fam);box-sizing:border-box}\n .header{padding:26px 30px 18px;background:var(--surface);border-bottom:1px solid var(--hair)}\n .htitle h1{margin:0;font:800 28px/1.1 var(--fam);color:var(--ink);letter-spacing:-.5px}\n .htitle .badge{display:inline-block;margin-left:10px;font:700 10px/1 var(--fam);letter-spacing:.06em;text-transform:uppercase;color:var(--mag);background:rgba(229,0,75,.10);padding:5px 9px;border-radius:999px;vertical-align:middle}\n .htitle p{margin:6px 0 0;font:400 13px/1.4 var(--fam);color:var(--muted);max-width:720px}\n .toolbar{display:flex;align-items:center;gap:12px;margin-top:16px;flex-wrap:wrap}\n .search{flex:1 1 240px;min-width:0;display:flex;align-items:center;gap:8px;background:var(--ground);border:1.5px solid var(--hair);border-radius:11px;padding:9px 13px}\n .search input{flex:1;min-width:0;border:none;background:none;outline:none;font:500 14px/1 var(--fam);color:var(--ink)}\n .search .si{color:var(--muted);display:inline-flex}\n .search .si .ic-svg{width:16px;height:16px}\n .count{font:600 12px/1 var(--fam);color:var(--muted);white-space:nowrap}\n .filters{display:flex;align-items:center;gap:8px;margin-top:12px;flex-wrap:wrap}\n .flabel{font:700 10px/1 var(--fam);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-right:2px}\n .fchip{padding:7px 12px;border-radius:999px;border:1px solid var(--hair);background:var(--surface);color:var(--muted);font:700 12px/1 var(--fam);cursor:pointer;transition:background .15s,color .15s,border-color .15s;white-space:nowrap}\n .fchip:hover{background:var(--ground);color:var(--ink)}\n .fchip[data-on]{background:var(--mag);color:#fff;border-color:var(--mag)}\n .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;padding:22px 30px 4px}\n .stat{background:var(--surface);border:1px solid var(--hair);border-radius:16px;padding:18px 20px;box-shadow:var(--shadowcard);display:flex;align-items:center;gap:14px}\n .stat .ico{width:44px;height:44px;flex:none;border-radius:12px;background:rgba(229,0,75,.10);display:inline-flex;align-items:center;justify-content:center;color:var(--mag)}\n .stat .ico .ic-svg{width:22px;height:22px}\n .stat .sv{font:800 26px/1 var(--fam);color:var(--ink);letter-spacing:-.5px}\n .stat .sl{font:600 11px/1.3 var(--fam);color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-top:4px}\n .stat .st{font:600 12px/1.3 var(--fam);color:var(--ink);margin-top:3px;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n .body{flex:1 1 auto;padding:18px 30px 90px}\n .tablecard{max-width:1080px;margin:0 auto;background:var(--surface);border:1px solid var(--hair);border-radius:16px;box-shadow:var(--shadowcard);overflow:hidden}\n table.log{width:100%;border-collapse:collapse}\n table.log thead th{text-align:left;font:700 10px/1 var(--fam);letter-spacing:.05em;text-transform:uppercase;color:var(--muted);padding:13px 14px;border-bottom:1px solid var(--hair);background:var(--ground);white-space:nowrap}\n table.log td{padding:12px 14px;border-bottom:1px solid rgba(16,24,40,0.05);font:500 13px/1.3 var(--fam);color:var(--ink);vertical-align:middle}\n table.log tbody tr:last-child td{border-bottom:none}\n table.log tbody tr:hover{background:var(--ground)}\n .c-when .rel{display:block;font-weight:700;color:var(--ink)}\n .c-when .abs{display:block;font:500 10.5px/1.2 var(--fam);color:var(--muted);margin-top:2px}\n .c-actor{display:flex;align-items:center;gap:9px}\n .avatar{width:28px;height:28px;flex:none;border-radius:50%;background:var(--grad);color:#fff;font:800 10px/1 var(--fam);display:inline-flex;align-items:center;justify-content:center}\n .an{display:flex;flex-direction:column;min-width:0}\n .anm{font:700 12.5px/1.2 var(--fam);color:var(--ink);max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n .ap{font:600 10.5px/1 var(--fam);color:var(--muted);margin-top:2px}\n .c-arrow{color:var(--muted);width:26px;text-align:center}\n .c-arrow .ic-svg{width:16px;height:16px}\n .tn{font:700 12.5px/1.2 var(--fam);color:var(--ink)}\n .tc{display:inline-block;margin-left:6px;font:700 10px/1 'SF Mono',ui-monospace,Menlo,monospace;color:var(--muted);background:var(--ground);padding:2px 6px;border-radius:5px}\n .pchip{font:800 10px/1 var(--fam);letter-spacing:.03em;padding:5px 9px;border-radius:999px;white-space:nowrap}\n .pchip.gn{background:rgba(59,130,246,.14);color:#1d5fd1}\n .pchip.lider{background:rgba(139,92,246,.16);color:#6d34d6}\n .pchip.gv{background:rgba(229,0,75,.12);color:var(--mag)}\n .achip{font:800 10px/1 var(--fam);letter-spacing:.03em;padding:5px 9px;border-radius:999px;white-space:nowrap}\n .achip.start{background:rgba(41,172,86,.15);color:#1a7d3c}\n .achip.end{background:rgba(107,114,128,.16);color:var(--muted)}\n .achip.view{background:rgba(59,130,246,.14);color:#1d5fd1}\n .achip.sim{background:rgba(250,160,0,.16);color:#b57200}\n .achip.exp{background:rgba(139,92,246,.14);color:#6d34d6}\n .c-scope,.c-cycle{color:var(--muted);font-weight:600;white-space:nowrap}\n .empty{padding:60px;text-align:center;color:var(--muted);font:500 14px/1.5 var(--fam)}\n @media (prefers-reduced-motion: reduce){ .fchip{transition:none!important} }\n `,\n render(d2){\n const t = tok(d2);\n const green = t.color.rampGreen||t.color.money||'#29AC56';\n const vars = `--surface:${t.color.surface};--ground:${t.color.ground};--ink:${t.color.ink};--muted:${t.color.muted};--hair:${t.color.hairline};--mag:${t.color.naturaMagenta};--grad:${t.color.brandGradient};--green:${green};--fam:${t.type.family};--shadowcard:${t.shadow.card}`;\n\n const ds = d2.data('accessLog');\n const all = ds ? ds.records() : [];\n const loading = ds && ds.loading;\n const sorted = all.slice().sort((a,b)=> new Date(b.at||0)-new Date(a.at||0));\n\n const fAction = d2.state.fAction||'';\n const q = String(d2.state.q||'').trim().toLowerCase();\n const filtered = sorted.filter(r=>{\n if(fAction && String(r.action)!==fAction) return false;\n if(q){\n const hay = `${r.actorName||''} ${r.actorEmail||''} ${r.targetName||''} ${r.name||''} ${r.userId||''} ${r.gvName||''} ${r.section||''} ${r.mode||''} ${r.action||''} ${r.impersonatedCode||''} ${r.structureCode||''} ${r.cycle||''}`.toLowerCase();\n if(hay.indexOf(q)<0) return false;\n }\n return true;\n });\n\n const st = computeStats(sorted);\n const statCards = `\n ${ICON.eye} ${st.totalImpersonations}
Impersonações (início)
${ICON.users} ${st.distinctActors}
Atores distintos
${ICON.target} ${st.topTargetCount||0}×
Alvo mais impersonado
${esc(st.topTarget)}
${esc(c.label)} `).join('');\n\n const tableBody = loading\n ? `Carregando registros de acesso…
`\n : (rows\n ? `\n Quando Ator Alvo Perfil Ação Escopo Ciclo ${rows}
Nenhum registro de acesso encontrado com os filtros atuais.
`);\n\n return `\n \n
${statCards}
\n
${tableBody}
\n
${p} `;\n return {\n live:S(''),\n cycle:S(''),\n device:S(''),\n bars:S('')\n };\n})();\n\nfunction num(n){ try{ return Number(n||0).toLocaleString('pt-BR'); }catch(e){ return String(n||0); } }\nfunction absTime(iso){\n if(!iso) return '—';\n try{ return new Date(iso).toLocaleString('pt-BR',{day:'2-digit',month:'2-digit',year:'numeric',hour:'2-digit',minute:'2-digit'}); }\n catch(e){ return String(iso||''); }\n}\nfunction relTime(iso){\n const t = new Date(iso).getTime();\n if(!isFinite(t)) return '—';\n const diff = Date.now()-t;\n const s = Math.round(diff/1000);\n if(s<60) return 'agora mesmo';\n const m = Math.round(s/60); if(m<60) return `há ${m} min`;\n const h = Math.round(m/60); if(h<24) return `há ${h} h`;\n const dd = Math.round(h/24); if(dd<30) return `há ${dd} d`;\n try{ return new Date(iso).toLocaleDateString('pt-BR',{day:'2-digit',month:'short'}); }catch(e){ return '—'; }\n}\nfunction dayKey(iso){\n const d = new Date(iso);\n if(!isFinite(d.getTime())) return '';\n return d.toISOString().slice(0,10);\n}\nfunction dayLabel(key){\n try{ const d = new Date(key+'T00:00:00'); return d.toLocaleDateString('pt-BR',{day:'2-digit',month:'2-digit'}); }catch(e){ return key; }\n}\nfunction fmtDuration(ms){\n if(!isFinite(ms) || ms<=0) return '—';\n const totalMin = Math.round(ms/60000);\n if(totalMin < 60) return totalMin+' min';\n const h = Math.floor(totalMin/60); const m = totalMin%60;\n return m ? `${h}h ${m}min` : `${h}h`;\n}\n\n// coarse userAgent → { browser, os } bucket\nfunction parseUA(ua){\n const s = String(ua||'');\n let browser = 'Outro';\n if(/Edg\\//i.test(s)) browser='Edge';\n else if(/OPR\\/|Opera/i.test(s)) browser='Opera';\n else if(/Chrome\\//i.test(s) && !/Chromium/i.test(s)) browser='Chrome';\n else if(/Firefox\\//i.test(s)) browser='Firefox';\n else if(/Safari\\//i.test(s) && /Version\\//i.test(s)) browser='Safari';\n else if(!s) browser='Desconhecido';\n let os = 'Outro';\n if(/iPhone|iPad|iPod/i.test(s)) os='iOS';\n else if(/Android/i.test(s)) os='Android';\n else if(/Windows/i.test(s)) os='Windows';\n else if(/Mac OS X|Macintosh/i.test(s)) os='macOS';\n else if(/Linux/i.test(s)) os='Linux';\n else if(!s) os='Desconhecido';\n const mobile = /Mobi|iPhone|iPad|iPod|Android/i.test(s);\n return { browser, os, kind: mobile?'Mobile':(s?'Desktop':'Desconhecido') };\n}\n\n// horizontal breakdown bars from a {label,count} array\nfunction breakdownBars(items, colorVar){\n if(!items.length) return `Sem dados.
`;\n const max = Math.max.apply(null, items.map(i=>i.count).concat([1]));\n return items.map(i=>{\n const pct = Math.round((i.count/max)*100);\n return `\n ${esc(i.label)} \n ${num(i.count)} \n
`;\n }).join('');\n}\n\n// inline-SVG login-over-time bar chart (last N days)\nfunction loginsChart(days){\n if(!days.length) return `Sem logins no período.
`;\n const W = 720, H = 140, pad = 24, n = days.length;\n const max = Math.max.apply(null, days.map(d=>d.count).concat([1]));\n const bw = (W - pad*2) / n;\n const barW = Math.max(6, Math.min(38, bw*0.6));\n let bars = '';\n let labels = '';\n days.forEach((d,i)=>{\n const x = pad + i*bw + (bw-barW)/2;\n const h = Math.round((d.count/max)*(H-pad*2));\n const y = H - pad - h;\n bars += `${esc(dayLabel(d.key))}: ${num(d.count)} login(s) ${d.count?num(d.count):''} `;\n if(n<=14 || i%2===0){\n labels += `${esc(dayLabel(d.key))} `;\n }\n });\n return `\n \n ${bars}${labels}\n `;\n}\n\nfunction tally(arr, keyFn, labelFn){\n const m = {};\n arr.forEach(r=>{ const k = keyFn(r); if(k==null||k==='') return; m[k]=(m[k]||0)+1; });\n return Object.keys(m).map(k=>({ key:k, label: labelFn?labelFn(k):k, count:m[k] })).sort((a,b)=>b.count-a.count);\n}\n\nexport default {\n css: `\n :host{display:block}\n .screen{min-height:100%;height:auto;display:flex;flex-direction:column;background:var(--ground);font-family:var(--fam);box-sizing:border-box}\n .header{padding:26px 30px 18px;background:var(--surface);border-bottom:1px solid var(--hair)}\n .htitle h1{margin:0;font:800 28px/1.1 var(--fam);color:var(--ink);letter-spacing:-.5px}\n .htitle .badge{display:inline-block;margin-left:10px;font:700 10px/1 var(--fam);letter-spacing:.06em;text-transform:uppercase;color:var(--mag);background:rgba(229,0,75,.10);padding:5px 9px;border-radius:999px;vertical-align:middle}\n .htitle p{margin:6px 0 0;font:400 13px/1.4 var(--fam);color:var(--muted);max-width:760px}\n .toolbar{display:flex;align-items:center;gap:10px;margin-top:16px;flex-wrap:wrap}\n .flabel{font:700 10px/1 var(--fam);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-right:2px}\n .fchip{padding:7px 12px;border-radius:999px;border:1px solid var(--hair);background:var(--surface);color:var(--muted);font:700 12px/1 var(--fam);cursor:pointer;transition:background .15s,color .15s,border-color .15s;white-space:nowrap}\n .fchip:hover{background:var(--ground);color:var(--ink)}\n .fchip[data-on]{background:var(--mag);color:#fff;border-color:var(--mag)}\n .count{font:600 12px/1 var(--fam);color:var(--muted);white-space:nowrap;margin-left:auto}\n .body{flex:1 1 auto;padding:22px 30px 90px;max-width:1120px;margin:0 auto;width:100%;box-sizing:border-box}\n .kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px}\n .kpi{background:var(--surface);border:1px solid var(--hair);border-radius:16px;padding:16px 18px;box-shadow:var(--shadowcard);display:flex;align-items:center;gap:13px}\n .kpi .ico{width:42px;height:42px;flex:none;border-radius:12px;background:rgba(229,0,75,.10);display:inline-flex;align-items:center;justify-content:center;color:var(--mag)}\n .kpi .ico.live{background:rgba(41,172,86,.14);color:var(--green)}\n .kpi .ico .ic-svg{width:21px;height:21px}\n .kpi .sv{font:800 25px/1 var(--fam);color:var(--ink);letter-spacing:-.5px}\n .kpi .sl{font:600 10.5px/1.3 var(--fam);color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-top:4px}\n .kpi .live-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);margin-right:5px;vertical-align:middle;box-shadow:0 0 0 3px rgba(41,172,86,.18)}\n .grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:20px}\n .grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:18px}\n @media (max-width:860px){ .grid2,.grid3{grid-template-columns:1fr} }\n .panel{background:var(--surface);border:1px solid var(--hair);border-radius:16px;box-shadow:var(--shadowcard);padding:18px 20px}\n .panel.wide{grid-column:1 / -1}\n .ptitle{display:flex;align-items:center;gap:8px;font:800 14px/1 var(--fam);color:var(--ink);margin:0 0 14px}\n .ptitle .pico{color:var(--mag);display:inline-flex}\n .ptitle .pico .ic-svg{width:17px;height:17px}\n .ptitle .psub{font:600 11px/1 var(--fam);color:var(--muted);margin-left:auto;text-transform:none;letter-spacing:0}\n .chart{width:100%;height:auto;display:block}\n .ch-num{font:700 10px/1 var(--fam);fill:var(--muted)}\n .ch-lbl{font:600 10px/1 var(--fam);fill:var(--muted)}\n .bd-row{display:flex;align-items:center;gap:10px;margin:0 0 9px}\n .bd-label{flex:0 0 120px;font:700 12px/1.2 var(--fam);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n .bd-track{flex:1 1 auto;height:10px;background:var(--ground);border-radius:999px;overflow:hidden;min-width:40px}\n .bd-fill{display:block;height:100%;border-radius:999px;transition:width .3s ease-out}\n .bd-val{flex:0 0 auto;font:800 12px/1 var(--fam);color:var(--ink);min-width:34px;text-align:right}\n .bd-empty{padding:16px 4px;color:var(--muted);font:500 12.5px/1.4 var(--fam);font-style:italic}\n table.tbl{width:100%;border-collapse:collapse}\n table.tbl thead th{text-align:left;font:700 10px/1 var(--fam);letter-spacing:.05em;text-transform:uppercase;color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--hair);white-space:nowrap}\n table.tbl td{padding:11px 12px;border-bottom:1px solid rgba(16,24,40,0.05);font:500 13px/1.3 var(--fam);color:var(--ink);vertical-align:middle}\n table.tbl tbody tr:last-child td{border-bottom:none}\n table.tbl tbody tr:hover{background:var(--ground)}\n .u-name{display:flex;align-items:center;gap:9px}\n .avatar{width:26px;height:26px;flex:none;border-radius:50%;background:var(--grad);color:#fff;font:800 10px/1 var(--fam);display:inline-flex;align-items:center;justify-content:center}\n .pchip{font:800 9.5px/1 var(--fam);letter-spacing:.03em;padding:4px 8px;border-radius:999px;white-space:nowrap}\n .pchip.gn{background:rgba(59,130,246,.14);color:#1d5fd1}\n .pchip.lider{background:rgba(139,92,246,.16);color:#6d34d6}\n .pchip.gv{background:rgba(229,0,75,.12);color:var(--mag)}\n .pchip.admin{background:rgba(107,114,128,.16);color:var(--muted)}\n .tnum{font:800 13px/1 var(--fam);color:var(--ink)}\n .tmut{color:var(--muted);font-weight:600;white-space:nowrap}\n .sec-name{font:700 12.5px/1.2 var(--fam);color:var(--ink)}\n .empty{padding:60px;text-align:center;color:var(--muted);font:500 14px/1.5 var(--fam)}\n @media (prefers-reduced-motion: reduce){ .fchip{transition:none!important} .bd-fill{transition:none} }\n `,\n render(d2){\n const t = tok(d2);\n const green = t.color.rampGreen||t.color.money||'#29AC56';\n const blue = '#3b82f6';\n const purple = '#8b5cf6';\n const vars = `--surface:${t.color.surface};--ground:${t.color.ground};--ink:${t.color.ink};--muted:${t.color.muted};--hair:${t.color.hairline};--mag:${t.color.naturaMagenta};--orange:${t.color.naturaOrange};--grad:${t.color.brandGradient};--green:${green};--fam:${t.type.family};--shadowcard:${t.shadow.card}`;\n\n // Prefer the declared params; fall back to the global DataSet processes so the\n // screen works even if a host forgot to bind them.\n const sDs = d2.data('sessions') || d2.data('pilot-sessionDataSet');\n const eDs = d2.data('accessLog') || d2.data('pilot-access-logDataSet');\n const sessions = sDs ? sDs.records() : [];\n const events = eDs ? eDs.records() : [];\n const loading = (sDs && sDs.loading) || (eDs && eDs.loading);\n\n const now = Date.now();\n const range = d2.state.range || '7d';\n const rangeMs = range==='today' ? null : (range==='30d' ? 30*24*3600*1000 : (range==='all' ? null : 7*24*3600*1000));\n function inRange(iso){\n const ts = new Date(iso).getTime();\n if(!isFinite(ts)) return false;\n if(range==='today'){ const d=new Date(); d.setHours(0,0,0,0); return ts>=d.getTime(); }\n if(range==='all') return true;\n return ts >= now - rangeMs;\n }\n\n // ── sessions in range (by startedAt) ─────────────────────────────────────\n const sessInRange = sessions.filter(s=>inRange(s.startedAt));\n // active-now: lastSeenAt within TTL AND not ended\n const activeNow = sessions.filter(s=>{\n if(String(s.status)==='ended') return false;\n const ls = new Date(s.lastSeenAt||s.startedAt).getTime();\n return isFinite(ls) && (now - ls) <= TTL_MS;\n });\n\n // login events (from the event stream) — the canonical \"logins\" metric\n const loginEvents = events.filter(e=>String(e.action)==='login');\n const viewEvents = events.filter(e=>String(e.action)==='view');\n const loginsInRange = loginEvents.filter(e=>inRange(e.at));\n\n // logins today / cycle\n const startToday = (()=>{ const d=new Date(); d.setHours(0,0,0,0); return d.getTime(); })();\n const loginsToday = loginEvents.filter(e=>{ const ts=new Date(e.at).getTime(); return isFinite(ts) && ts>=startToday; }).length;\n // cycle = the most common cycle in login events (pilot has one active cycle)\n const cycleTally = tally(loginEvents, e=>e.cycle);\n const topCycle = cycleTally.length ? cycleTally[0].key : '';\n const loginsCycle = topCycle ? loginEvents.filter(e=>String(e.cycle)===String(topCycle)).length : loginEvents.length;\n\n // distinct users (in range) — by userId, fallback name\n const userKeys = {};\n loginsInRange.forEach(e=>{ const k=e.userId||e.name; if(k) userKeys[k]=1; });\n const distinctUsers = Object.keys(userKeys).length;\n\n // avg session duration for ended sessions in range\n const ended = sessInRange.filter(s=>String(s.status)==='ended' && s.endedAt && s.startedAt);\n let avgDur = 0;\n if(ended.length){\n const totalMs = ended.reduce((acc,s)=>{\n const d = new Date(s.endedAt).getTime() - new Date(s.startedAt).getTime();\n return acc + (isFinite(d) && d>0 ? d : 0);\n }, 0);\n avgDur = totalMs / ended.length;\n }\n\n // logins over time (by day) — from login events in range\n const dayMap = {};\n loginsInRange.forEach(e=>{ const k=dayKey(e.at); if(!k) return; dayMap[k]=(dayMap[k]||0)+1; });\n // build a contiguous day series for the last N days when a windowed range is used\n let daySeries = [];\n if(range==='today'){\n daySeries = Object.keys(dayMap).sort().map(k=>({key:k,count:dayMap[k]}));\n if(!daySeries.length) daySeries = [{ key: dayKey(new Date().toISOString()), count: 0 }];\n } else if(range==='all'){\n daySeries = Object.keys(dayMap).sort().map(k=>({key:k,count:dayMap[k]}));\n } else {\n const nDays = range==='30d' ? 30 : 7;\n for(let i=nDays-1;i>=0;i--){\n const d = new Date(now - i*24*3600*1000);\n const k = d.toISOString().slice(0,10);\n daySeries.push({ key:k, count: dayMap[k]||0 });\n }\n }\n\n // breakdowns (from login events in range)\n const byPerfil = tally(loginsInRange, e=>e.perfil, perfilLabel);\n const byMode = tally(loginsInRange, e=>e.mode, modeLabel);\n const byRede = tally(loginsInRange.filter(e=>e.rede), e=>e.rede, redeLabel);\n\n // most-active users — sessions count + last-seen + total views, in range\n const uMap = {};\n loginsInRange.forEach(e=>{\n const k = e.userId || e.name || '?';\n if(!uMap[k]) uMap[k] = { key:k, name:e.name||e.userId||'—', perfil:e.perfil, sessions:0, views:0, lastSeen:0 };\n uMap[k].sessions += 1;\n });\n // fold last-seen from the session rows + views from view events\n sessInRange.forEach(s=>{\n const k = s.userId || s.name; if(!k || !uMap[k]) return;\n const ls = new Date(s.lastSeenAt||s.startedAt).getTime();\n if(isFinite(ls) && ls>uMap[k].lastSeen) uMap[k].lastSeen = ls;\n uMap[k].views += Number(s.viewCount||0);\n });\n const activeUsers = Object.keys(uMap).map(k=>uMap[k]).sort((a,b)=> b.sessions-a.sessions || b.views-a.views).slice(0,10);\n\n // most-viewed sections — from view events in range\n const bySection = tally(viewEvents.filter(e=>inRange(e.at)), e=>e.section, sectionLabel).slice(0,10);\n\n // device / entry mix (from sessions in range — coarse UA + entryMode)\n const uaParsed = sessInRange.map(s=>parseUA(s.userAgent));\n const byKind = tally(uaParsed, r=>r.kind, x=>x);\n const byBrowser = tally(uaParsed, r=>r.browser, x=>x);\n const byEntry = tally(sessInRange, s=>s.entryMode||s.mode, modeLabel);\n\n if(loading){\n return `\n \n
Carregando estatísticas de uso…
\n
${esc(c.label)} `).join('');\n\n const kpis = `\n ${ICON.live}
Sessões ativas agora
${ICON.login} ${num(loginsToday)}
Logins hoje
${ICON.cycle} ${num(loginsCycle)}
Logins no ciclo ${topCycle?esc(topCycle):''}
${ICON.users} ${num(distinctUsers)}
Usuários distintos
${ICON.clock} ${fmtDuration(avgDur)}
Duração média
\n ${esc((String(u.name||'?').trim()[0]||'?').toUpperCase())} ${esc(u.name)}${esc(perfilLabel(u.perfil))} ${num(u.sessions)} \n ${num(u.views)} \n ${u.lastSeen?esc(relTime(new Date(u.lastSeen).toISOString())):'—'} \n `).join('') : '';\n\n const secRows = bySection.length ? bySection.map(s=>`\n ${esc(s.label)} ${num(s.count)} \n `).join('') : '';\n\n return `\n \n
\n
${kpis}
\n\n
\n
\n
${ICON.bars} Logins ao longo do tempo ${range==='today'?'hoje':(range==='all'?'todo o histórico':(range==='30d'?'últimos 30 dias':'últimos 7 dias'))}
\n ${loginsChart(daySeries)}\n
\n
\n\n
\n
\n
${ICON.users} Por perfil
\n ${breakdownBars(byPerfil, 'var(--mag)')}\n
\n
\n
${ICON.login} Por modo de entrada
\n ${breakdownBars(byMode, blue)}\n
\n
\n
${ICON.bars} Por rede
\n ${breakdownBars(byRede, green)}\n
\n
\n\n
\n
\n
${ICON.users} Usuários mais ativos top 10
\n ${userRows ? `
Usuário Perfil Sessões Views Último acesso ${userRows}
` : `
Nenhum acesso no período.
`}\n
\n
\n
${ICON.eye} Seções mais acessadas top 10
\n ${secRows ? `
` : `
Nenhuma visualização no período.
`}\n
\n
\n\n
\n
\n
${ICON.device} Tipo de dispositivo
\n ${breakdownBars(byKind, purple)}\n
\n
\n
${ICON.device} Navegador
\n ${breakdownBars(byBrowser, 'var(--orange)')}\n
\n
\n
${ICON.login} Modo de entrada (sessões)
\n ${breakdownBars(byEntry, 'var(--mag)')}\n
\n
\n
\n
${p} `;\n return {\n edit:S('\n
\n
\n ${esc(q.name||'(sem nome)')} \n ${q.active===false?`inativa `:`ativa `}\n ${vars.length?`${vars.length} var${vars.length>1?'s':''} `:''}\n ${q.strategy?`usada no cálculo scheduler · ${esc(q.strategy)} `:''}\n ${q.lastExecutedAt?`última ${esc(String(q.lastExecutedAt).replace('T',' ').slice(0,16))} `:''}\n
\n ${q.description?`
${esc(q.description)}
`:''}\n
${esc(sqlPreview)}${String(q.sql||'').length>120?'…':''}
\n ${vars.length?`
${vars.map(v=>`{{${esc(v)}}} `).join('')}
`:''}\n
\n
\n ${ICON.run} \n ${ICON.edit} \n ${armed\n ? `${ICON.ok} ${ICON.x} `\n : `${ICON.del} `}\n
\n
\n
\n
${isNew?'Nova consulta':'Editar consulta'} \n
Consultas com {{param}} são substituídas pelo runner antes de irem ao Databricks.
\n ${m.strategy?`
Consulta usada no cálculo do painel. O scheduler roda esta consulta toda hora e o resultado vira o realizado e as metas da remuneração e dos totalizadores. Uma alteração vale na próxima execução: se a consulta passar a devolver linhas erradas, o painel mostra números errados. Mantenha as colunas (structure_code, index_code, valor) e teste com ▶ Executar antes de salvar.
`:''}\n
\n
Nome (chave)
\n
Ativa
\n
Scheduler \n não roda \n cache (toda hora, por ciclo aberto) \n oneTimeCycle (uma vez por ciclo) \n Precisa de {{cycle}} no SQL.
\n
\n
\n
\n
\n \n
\n
Esta consulta não tem parâmetros.
`;\n return `${vars.map(v=>`
{{${esc(v)}}}
`).join('')}
${esc(res.error)}
`;\n const rows = res.rows||[];\n if(!rows.length) return `0 linhas.
`;\n const cols = Object.keys(rows[0]);\n const head = cols.map(c=>`${esc(c)} `).join('');\n const body = rows.slice(0,50).map(r=>`${cols.map(c=>`${esc(r[c])} `).join('')} `).join('');\n return `${rows.length} linha(s)${rows.length>50?' (mostrando 50)':''}
\n ${esc(res.sql||'')}
\n `;\n}\n\nfunction runModal(d2){\n if(!d2.state.runOpen) return '';\n const id = d2.state.runId;\n const q = queries(d2).find(x=>x._id===id) || {};\n const running = d2.state.running;\n const res = d2.state.runResult;\n return `\n
\n
Executar · ${esc(q.name||'')} \n
Preencha os parâmetros e execute. As linhas voltam do Databricks ao vivo.
\n ${paramInputs(d2, q)}\n \n
${res?resultTable(res):(running?'
Consultando Databricks…
':'
Sem resultado ainda.
')}
\n
\n
Ver calendário de ciclos por grupo (${rows.length})
`;\n }\n const filter = String(d2.state.calFilter||'').trim();\n let list = rows.slice();\n if(filter) list = list.filter(r=>String(r.groupCode||'').includes(filter)||String(r.sectorCode||'').includes(filter)||String(r.cycle||'').includes(filter));\n list = list.slice().sort((a,b)=> (String(a.groupCode)+a.cycle).localeCompare(String(b.groupCode)+b.cycle));\n const head = `Ciclo Setor Grupo Início Fim Origem ${esc(r.cycle)} ${esc(r.sectorCode)} ${esc(r.groupCode)} ${esc(r.startDate)} ${esc(r.endDate)} ${esc(r.source||'—')} \n
\n
Calendário de ciclos por grupo ${rows.length} linhas \n
${ICON.search}
\n
Ocultar \n
\n
\n ${list.length>200?`
Mostrando 200 de ${list.length}.
`:''}\n
Nenhuma consulta ainda. Crie a primeira.
`;\n const toastEl = d2.state.toast?`${esc(d2.state.toast)}
`:'';\n return `\n \n
\n ${cards}\n ${calendarPanel(d2)}\n
\n ${editModal(d2)}\n ${runModal(d2)}\n ${toastEl}\n
\n
\n
natura-x-piloto — V1 × V2 \n
Dashboard de remuneração variável da consultora Natura. Esta é a doc do rebuild net-new no Data2 (V2), feito como stress test de um build spec-driven — \"The Data2 Way\". A V1 é o piloto em produção; a V2 atingiu paridade funcional sem tocar em prod.
\n
\n systemId 688179c2a93dd170ce61e598 \n as-of 2026-08-12 \n 42 tabelas · 19 PILOT · \n 37 listeners \n âncora: grupo 20200 rede1 diamante = R$ 680,00 \n
\n
\n\n
1 · TL;DR \n
\n O que é: painel de remuneração variável com drill GV → GN → Líder; cada perfil enxerga a própria estrutura para baixo.O que faz: calcula o ganho variável de cada consultora por ciclo, a partir de KPIs da API de performance da Natura + Databricks, aplicando um rules-engine versionado , e entrega num dashboard escopado por perfil — com admin pra editar as regras, simulador e histórico.O que foi a V2: reconstrução limpa do piloto direto no Data2, via o MCP data2-builder, seguindo uma metodologia spec-driven de 12 fases (dado primeiro, contratos, comportamento, UI por último). Rodou num workspace isolado (🧪 rebuild-pilot).Veredito do experimento: metodologia 8.5/10 , ergonomia da plataforma 6/10 , loop dispatch/verify/memory 9/10 . Nada foi publicado em prod — a V2 fica atrás de resolveActingIdentity(); o cutover troca só a fonte, não o formato. \n\n
2 · Escopo & features (o que a spec entregou) \n
A spec começou como \"vertical slice do dashboard principal\" e foi além, até um substituto funcional do piloto. O que entrou:
\n
\n Dashboard 3 perfis — GV→GN→Líder com drill real + agregação grupo/setor, sobre dados live da API. (live-real) Engine de ganhos config-driven — band tables (fixo & multiplicador) + fórmula estruturada (rede1 soma-de-parcelas, rede2 multiplicador×volume) + regras de bônus; versionado ruleset→cycle, editável por GUI.Admin completo — indicadores, regras (bands/bônus/construtor de fórmula), rulesets, binding de ciclo, gerenciador de KPI, viewers de audit-log + access-log.Simulador — auto-carrega a produção real de uma consultora; sliders por KPI (meta/realizado); re-simulação ao vivo; escada de remuneração com faixa ativa destacada. + Histórico .Impersonation formal + modelo two-app prod-compliant, seam resolveActingIdentity, scope locks por identidade efetiva. \n
\n
Proveniência dos dados \n
Live-real: KPIs, metas e remuneração vêm da API/Databricks de verdade. Seeded mirror: identidade + hierarquia (setor/grupo/usuário) são espelhos semeados atrás do resolver — o cutover de prod troca a fonte , não o shape.
\n
\n
\n
Fora de escopo / pendente \n
Nada publicado em prod. O IR/compiler (v2 do produto app-builder) não foi exercido. O cutover de prod — plugar a fonte real de identidade no seam — fica pendente, junto do natura-piloto-hardening (fechar as leituras abertas).
\n
\n\n
3 · O produto \n
Remuneração por duas redes com regra dependente de ciclo, mais bônus por cima:
\n
\n rede1 = soma de parcelas · rede2 = multiplicador × volume.Perfis / grãos: GV → GN → Líder (hierarquia de drill; cada um vê para baixo). \n Fontes de dado: uma API principal da Natura (performance) + Databricks (espalhado). Na V1 há ainda Tableau. \n \n\n
4 · V1 × V2 — visão geral \n
\n
\n
V1 · prod original \n
Modelo ad-hoc, dados espalhados \n
\n KPIs num tabelão denormalizado (display + cálculo + validade-por-ciclo + prompt no mesmo registro). \n Faixas e fórmulas espalhadas em várias tabelas + view client-side; regra é dado cravado. \n Caches manuais (painelCache, getGnGoalsCache, getLeaderGoalsCache).Identidade simples: email / name / password. \n Fluxos: listeners getKPIsGN/Leader, getSimulationLider, goals-por-grupo, getPoints, schedulers de fechamento. \n \n
\n
\n
V2 · rebuild Data2 \n
Engine config-driven, modelo normalizado \n
\n Regras vivem em tabelas versionadas (ruleset ↔ cycle). \"Mudar regra\" = editar linha, não código.Modelo normalizado com FKs e enums explícitos; admin GUI = CRUD sobre as tabelas de config. \n Simulador reusa o mesmo engine via inputsOverride.Identidade one-seam (4 modos) + impersonation formal com scope efetivo. \n UI também é config-driven (dashboard-config → dashboard-item); listeners PILOT · por recurso. \n \n
\n
\n\n
5 · Metodologia — dois eixos de \"v1/v2\" \n
Cuidado com a ambiguidade: existem dois eixos v1/v2 no projeto.
\n
\n
\n
Eixo A — o app \n
V1 = o piloto rodando em produção (API Natura + Databricks + Tableau).V2 = o rebuild net-new dentro do Data2 seguindo The Data2 Way.
\n
\n
\n
Eixo B — o produto (app-builder) \n
v1 = \"agent path\" — sub-agentes briefados + MCP cru + KB de footguns + verify em .data2.qa + loop findings→memory. Provado. v2 = IR/compiler determinístico (idempotência, drift, diff/apply). Aposta de escala; não pode travar o v1.
\n
\n
\n
The Data2 Way — 12 fases (gate por fase) \n
\n 0 Foundation1 Data models2 Schemas3 Identity & access4 Client state5 Integrations6 Endpoints & flows7 Design system8 Reusable UI9 Screens10 Navigation11 Verify & publish
\n
Doutrina: dado primeiro, contratos, comportamento, UI por último . Tela é projeção de dado + endpoint; construí-la cedo é retrabalho. Não se começa a fase N+1 sem o gate de N passar.
\n\n
6 · Decisões load-bearing \n
\n
Two-app identity + um único seam \n
Prod são dois apps com uma só lógica de escopo. App A (GV/Admin): login full-dashboard; impersonation mora aqui. App B (token-in-URL): identidade chega como token na URL, escopada (GN → só seu setor; Líder → só seu grupo). Regra de conformidade: impersonar GN X no App A tem que dar exatamente o que GN X vê no App B. Tudo passa por resolveActingIdentity(); o cutover de prod troca só a fonte, não o shape.
\n
\n
\n
Config-driven rules engine \n
O engine de ganhos lê as regras de tabelas (kpi-definition · band-table · earning-band · earning-formula.structure · bonus-rule, versionadas por ruleset → cycle). Consequência: o admin GUI cai fora do modelo de dados (é só CRUD), e o Simulador reusa a mesma computação de produção.
\n
\n
\n
Avaliação nativa estruturada, não Formula() string \n
rede1 = soma-de-produtos, rede2 = multiplicador × volume, avaliados nativamente no handler a partir do campo structure — não uma string Formula(). Isso rebaixou \"expor Formula no parser\" de blocker para nice-to-have.
\n
\n
\n
Seeded-vs-live por camada \n
KPIs/metas/remuneração rodaram live-real ; identidade + hierarquia foram seeded mirrors atrás do resolver. Toda camada declara se é live ou espelho, para o cutover trocar fonte e não formato.
\n
\n
\n
Identity seam = 4 modos \n
session (email/senha) · idp (OAuth/OIDC/SAML — SSO Natura/Maia) · token-url (app escopado) · impersonation (efetivo ≠ acting). Todos resolvem para um shape único {userId, perfil, structureCode, scope}; scope e impersonation vivem downstream, provider-agnósticos.
\n
\n\n
7 · Modelos de dados — real × KB \n
São 42 tabelas no sistema: as legadas (V1) convivem com as PILOT · (V2). Abaixo os schemas reais puxados do syste , confrontados com o que a KB (context-pack) descrevia.
\n\n
V1 — legado (schemas reais) \n
\n Tabela Campos reais Papel Kpis/remuneraçaotitulo, agrupamento, rede, color, perfil, index, index_grid, tipo_kpi, icon, marca, acoes, quem_sao (obj), descricao, calculo_do_kpi, indicadores (lookup), prompt, afetado_por_nivel, has_table, table (lookup), ganho, iap, hide, aceleradores_validados_ciclos, ciclos_validado… (28 campos) KPIs num tabelão: display + cálculo + validade-por-ciclo + prompt tudo junto tabelas-remuneraçãonome stub/ponteiro — praticamente vazio lideres_e_niveislider, nome, nivel, effective_from, effective_to líder → nível, temporal por strings GV/Admin usersemail, name, password identidade de login (herdada; a V2 mantém) parametros-faixas-remuneracao (OLD), formulas-ganhos, 🕘parametros-faixas-*— faixas e fórmulas espalhadas + view join client-side painelCache, getGnGoalsCache, getLeaderGoalsCache— caches manuais 🌐 Queries Databricks, query_library— SQL Databricks avulso
\n\n
V2 — PILOT · (schemas reais) \n
\n Tabela Campos reais (FK → destino) Papel Config / rules engine pilot-rulesetversion*, label, status (draft/active/archived) versão do conjunto de regras pilot-cyclecode* (202605), label, status (open/closed), isCurrent, rulesetVersion → ruleset, dashboardConfigVersion → dashboard-config, startsAt, endsAt ciclo amarra ruleset + dashboard pilot-kpi-definitioncode*, name*, brand (natura/avon/total), hasGoal, sourceGrain (sector/group), aggregation (sum/avg/none), goalKey, valueKey, rede, perfil, source (performance-api/databricks-query), apiIndexCode… (23 campos) definição declarativa de KPI pilot-band-tableref*, label*, kpiCode → kpi-definition, rede, perfil, valueType (fixed/multiplier), active catálogo de faixas pilot-earning-bandrulesetVersion → ruleset, bandTable (atingimento/pontos/…/multiplicador), rede, nivel (prata/ouro/diamante), brand, minPct, maxPct, value, bandTableRef → band-table linhas de faixa (fixo/multiplicador) pilot-earning-formularulesetVersion → ruleset, perfil, rede, template ({{}}), structure (object — soma-de-produtos) fórmula estruturada, avaliada nativa pilot-bonus-rulerulesetVersion → ruleset, perfil, rede, bonusType, conditions[], payoutType (flat/per-unit), payoutValue, perUnitKpiCode → kpi-definition regras de bônus Estrutura (temporal por ciclo) pilot-sectorcode*, name, gnCode, gnName, rede, effectiveFromCycle, effectiveToCycle, gvName setor pilot-groupcode*, name, sectorCode → sector, leaderCode, leaderName, nivel, rede, effectiveFrom/ToCycle grupo → setor Identidade & acesso pilot-useremail*, name, perfil (lider/gn/gv/admin), structureCode, sectorCode, scopeStructureCode, rede, nivel, gvName, naturaId (SSO Natura/Maia) identidade + escopo efetivo pilot-impersonation-ruleactorPerfil (gv/gn), targetPerfil (gn/lider), scope (any/within-sector) política de impersonation pilot-session, pilot-access-log, pilot-audit-log— sessão + logs de acesso/auditoria Dashboard (UI config-driven) pilot-dashboard-configversion*, label, status versão do layout pilot-dashboard-itemdashboardConfigVersion → config, perfil, rede, kpiCode → kpi-definition, mainKpiCode, relatedKpiCodes[], section, displayOrder, isBonus… card/item declarativo do dashboard pilot-dashboard-cache, pilot-query-library, pilot-cycle-calendar— cache de render + biblioteca de queries + calendário de ciclos
\n\n
\n
Real × KB — onde diverge \n
A KB descrevia o engine como kpi-definition / band-table / earning-formula.structure / bonus-rule / ruleset↔cycle. O syste real confirma todos e vai além: (1) pilot-earning-band guarda as linhas de faixa de fato; (2) sector → group são temporais por ciclo; (3) existe uma camada dashboard-config → dashboard-item que a KB não citava — a UI também é config-driven , não só o cálculo; (4) identidade ganhou tabela própria (user + impersonation-rule + session + access/audit-log), casando com o seam de 4 modos; (5) naturaId no pilot-user é o gancho concreto do SSO Natura (Maia) que a KB só previa como modo genérico token-url/idp.
\n
\n\n
8 · Mapa de entidades (V2) \n
O eixo do modelo é o versionamento : cada cycle amarra uma ruleset (as regras) e uma dashboard-config (o layout). Trocar de ciclo = apontar para outras versions. Tudo no rules-engine aponta para ruleset; kpi-definition é o hub referenciado por todo lado.
\n
\n \n pilot-ruleset \n version · status \n \n pilot-cycle \n code · isCurrent \n \n pilot-dashboard-config \n version · status \n \n rulesetVersion \n \n dashboardConfigVersion \n \n
\n
\n
Rules engine → ruleset \n
earning-band → ruleset · band-table (rulesetVersion, bandTableRef)
\n
earning-formula → ruleset (rulesetVersion)
\n
bonus-rule → ruleset · kpi-definition (perUnitKpiCode)
\n
band-table → kpi-definition (kpiCode)
\n
\n
\n
Hub: kpi-definition \n
Referenciado por band-table , bonus-rule , dashboard-item (kpiCode / mainKpiCode / relatedKpiCodes[]).
\n
A definição declarativa de cada indicador — de onde vem o valor (performance-api/databricks), grão, agregação, marca, perfil.
\n
\n
\n
Dashboard (config-driven) \n
dashboard-item → dashboard-config (dashboardConfigVersion)
\n
dashboard-item → kpi-definition (kpiCode/main/related)
\n
O que aparece em tela é linha de tabela, não código.
\n
\n
\n
Estrutura + Identidade \n
group → sector (sectorCode)
\n
user → sector (sectorCode) · naturaId → SSO
\n
impersonation-rule actorPerfil → targetPerfil + scope
\n
sector e group são temporais (effectiveFrom/ToCycle). session + access-log + audit-log são satélites.
\n
\n
\n\n
9 · O que o sistema faz — fluxos \n
Sete fluxos cobrem o sistema. Cada passo abaixo é um listener real (PILOT ·) do sistema.
\n\n
\n
1 · Identidade (entrada) \n
Dois caminhos, um só seam. App A resolve login; App B resolve o token da URL (clone fiel do SSO Natura, pronto pra switch).
\n
login (piloto-admin-auth) → pilotResolveIdentity → pilotUsers (switcher)
\n
token na URL → pilotResolveSession / pilotResolveNaturaSession → pilotResolveDisplayCycle
\n
\n\n
\n
2 · Dashboard (o coração) \n
Resolve identidade e ciclo, computa os ganhos pelo rules-engine, faz o rollup grupo→setor e monta os cards a partir da config.
\n
pilotResolveIdentity → pilotResolveDisplayCycle → pilotGetDashboardData → pilotGetGroupEarnings → pilotGetSectorRollup → pilotTrackAccess
\n
pilotGetGroupEarnings aplica ruleset/cycle → earning-band + earning-formula + bonus-rule. pilotGetSectorRollup agrega group→sector (sum/avg por KPI). pilotBandTables alimenta as faixas exibidas. Render config-driven via dashboard-config → dashboard-item.
\n
\n\n
\n
3 · Impersonation (GV/GN vê para baixo) \n
A identidade efetiva passa a ser a do alvo; o dashboard re-renderiza no escopo dele — idêntico ao que o alvo veria sozinho.
\n
pilotAllowedTargets → pilotImpersonate (start) → dashboard no escopo do alvo → pilotEndImpersonation
\n
\n\n
\n
4 · Simulador \n
Carrega a produção real da consultora, deixa mexer nos KPIs e re-simula reusando o mesmo engine.
\n
carrega produção real → sliders por KPI (meta/realizado) → pilotSimulate (inputsOverride) → escada de remuneração
\n
\n\n
\n
5 · Histórico \n
pilotHistorico → ganhos por ciclos anteriores
\n
\n\n
\n
6 · Admin (config-as-data) \n
Gated por piloto-admin-auth. Editar regra = editar tabela e subir uma nova version de ruleset/dashboard-config, que o cycle passa a apontar.
\n
pilotAdminRuleWrite · pilotAdminItemWrite · pilotQueryLibWrite → nova version → bind no cycle
\n
Telas: PILOT · Admin — Home / KPIs / Regras / Rulesets / Ciclos / Indicadores / Auditoria.
\n
\n\n
\n
7 · Dados externos / fechamento \n
Schedulers puxam Databricks e geram fechamentos por ciclo; queries parametrizadas rodam da query-library.
\n
🌐 Bricks Scheduler · Gera fechamentos (líderes/gerentes) · pilotRunQuery → Databricks / performance-api
\n
\n\n
\n
Postura de acesso (gates reais) \n
As leituras do piloto (dashboard, earnings, simulate, histórico) estão Policy(empty=open) — abertas, herança do modo piloto. As escritas de admin e o impersonation são gated por piloto-admin-auth. resolveIdentity/session/users/trackAccess estão UNGATED . Fechar as leituras é item do natura-piloto-hardening .
\n
\n\n
10 · O que quebrou — lições \n
\n Fail-silent code-component authoring (maior time-sink): corpo não persiste em silêncio, this solto, preview renderiza frame preto → stub-then-patch e verificar só em .data2.qa.Descoberta lida como impossibilidade: agente concluiu 2× que algo buildável era impossível (Schema sem create_schema; parser rejeita Formula()). Ambos buildáveis.Write-but-don't-wire: o resolver de impersonation foi autorado mas nunca wired no mount — parecia pronto, estava inerte. Daí o gate \"wire-it-and-prove-it\" .Config mal-taggeada vira bug de dado silencioso (band table rede2 marcada perfil:gn escondeu a tabela do líder) → oneOf + lint.Stale-published-app: \"está quebrado\" era o owner vendo o app publicado enquanto o fix vivia no draft → explicar draft × published no kickoff. \n\n
11 · Estado & fontes \n
\n sistema: natura-x-piloto (688179c2a93dd170ce61e598). Apps: PILOT · Admin App (pilot-admin), piloto-dashboard-view (novo-piloto). Workspace de build: 🧪 rebuild-pilot.Auth strategies: piloto-admin-auth · admin-view-auth · PILOT · Maia Auth (consultora SSO).Context pack completo: repo natura-x-piloto-context (CONTEXT.md + memory/ com 45+ notas de gotcha do Data2).Vault: Projects/natura-x-piloto + Resources/clients/natura/piloto.Âncora de regressão (nunca quebra): grupo 20200 rede1 diamante = R$ 680,00 . \n\n\n
${p} `;\nconst ICON = {\n plus: S(''+com+' ';\n if(vr) return ''+vr+' ';\n if(str) return ''+str+' ';\n if(fn) return ''+fn+' ';\n if(kw) return ''+kw+' ';\n if(num) return ''+num+' ';\n return m;\n });\n}\n\nfunction varsOf(row){\n const out=[], seen={};\n const push=(v)=>{ v=String(v==null?'':v).trim(); if(v && !seen[v]){ seen[v]=1; out.push(v); } };\n (String((row&&row.sql)||'').match(/\\{\\{([^}]*)\\}\\}/g)||[]).forEach(x=>push(x.replace(/^\\{\\{|\\}\\}$/g,'')));\n const st = row && row.variables;\n if(Array.isArray(st)) st.forEach(push);\n else if(typeof st === 'string') st.split(',').forEach(push);\n return out;\n}\n\n// ---- dados ----\nfunction dsOf(d2){ return d2.data('queryLib'); }\nfunction sortedRows(d2){\n const ds = dsOf(d2);\n const all = (ds && ds.records && ds.records()) || [];\n return all.slice().sort((a,b)=>String(a.name||'').localeCompare(String(b.name||'')));\n}\nfunction visibleRows(d2){\n const all = sortedRows(d2);\n const term = String(d2.state.q||'').trim().toLowerCase();\n const filt = d2.state.filt || 'all';\n let list = all;\n if(filt==='on') list = list.filter(r=>r.active!==false);\n if(filt==='off') list = list.filter(r=>r.active===false);\n if(term) list = list.filter(r=>\n String(r.name||'').toLowerCase().includes(term) ||\n String(r.description||'').toLowerCase().includes(term) ||\n String(r.sql||'').toLowerCase().includes(term));\n return { all, list };\n}\nfunction curRow(d2){\n const all = sortedRows(d2);\n const id = d2.state.selId;\n return all.find(r=>r._id===id) || all[0] || null;\n}\n\n// ---- ações ----\nfunction toast(d2,msg,kind){\n d2.setState({ toast:msg, toastKind:kind||'ok', toastKey:(d2.state.toastKey||0)+1 });\n setTimeout(()=>d2.setState({ toast:null }), 2800);\n}\nfunction actor(d2){ return String(d2.param('actorEmail','') || '').trim() || 'query-tester@pilot'; }\nfunction ok(r){ return !!(r && (r.ok || (r.data && r.data.ok))); }\nfunction refresh(d2){ const ds=dsOf(d2); if(ds && ds.refresh) ds.refresh(); }\nasync function write(d2,payload){ return await d2.rush('queryWriter').invoke(payload); }\n\nasync function doDelete(d2, before){\n const id = before && before._id;\n if(!id) return;\n try{\n const r = await write(d2,{ op:'delete', actorEmail:actor(d2), row:{ _id:id }, before });\n d2.setState({ armed:null });\n if(ok(r)){\n refresh(d2);\n if(d2.state.selId===id) d2.setState({ selId:null });\n toast(d2,'Consulta excluída');\n } else toast(d2,'Falha ao excluir','err');\n }catch(err){ d2.setState({ armed:null }); toast(d2,'Erro: '+errMsg(err),'err'); }\n}\nasync function doSave(d2, m){\n const before = d2.state.editBefore || {};\n try{\n const r = await write(d2,{ op:'upsert', actorEmail:actor(d2), row:m, before });\n if(ok(r)){\n const newId = (r.id || (r.data && r.data.id)) || m._id;\n d2.setState({ editOpen:false, editDraft:null, editBefore:null, editErr:null });\n refresh(d2);\n if(newId) d2.setState({ selId:newId });\n toast(d2,'Consulta salva');\n } else toast(d2,'Falha ao salvar','err');\n }catch(err){ toast(d2,'Erro: '+errMsg(err),'err'); }\n}\nasync function doToggle(d2, row){\n if(!row) return;\n const next = Object.assign({}, row, { active: row.active===false });\n try{\n const r = await write(d2,{ op:'upsert', actorEmail:actor(d2), row:next, before:row });\n if(ok(r)){ refresh(d2); toast(d2, next.active ? 'Consulta ativada' : 'Consulta desativada'); }\n else toast(d2,'Falha ao alterar estado','err');\n }catch(err){ toast(d2,'Erro: '+errMsg(err),'err'); }\n}\nasync function doCopy(d2, sql){\n try{ await navigator.clipboard.writeText(String(sql||'')); toast(d2,'SQL copiado'); }\n catch(err){ toast(d2,'Não foi possível copiar','err'); }\n}\nasync function doRun(d2, params){\n const q = d2.state.runRow;\n if(!q || !q._id) return;\n const id = q._id;\n d2.setState({ running:true });\n const t0 = Date.now();\n try{\n const r = await d2.rush('runner').invoke({ name:q.name, params: params||{} });\n const p = (r && r.data) ? r.data : r;\n const ms = Date.now() - t0;\n const lr = Object.assign({}, d2.state.lastRun);\n lr[id] = (p && p.error)\n ? { error:String(p.error), ms, raw:p }\n : { rows:(p && p.rows) || [], sql:(p && p.sql) || '', count:(p && p.count), ms, raw:p };\n d2.setState({ running:false, runOpen:false, runRow:null, lastRun:lr, selId:id });\n const n = (lr[id].rows||[]).length;\n toast(d2,\n lr[id].error ? 'Erro na consulta' : (n ? n+' linha(s) em '+ms+'ms' : 'O runner respondeu sem linhas'),\n (lr[id].error || !n) ? 'err' : 'ok');\n }catch(err){\n const ms = Date.now() - t0;\n const lr = Object.assign({}, d2.state.lastRun);\n lr[id] = { error:errMsg(err), ms, raw:null };\n d2.setState({ running:false, runOpen:false, runRow:null, lastRun:lr, selId:id });\n toast(d2,'Erro na consulta','err');\n }\n}\n\n// ---- sincronização DOM -> state (o modal é a fonte da verdade enquanto aberto) ----\nfunction syncEdit(d2){\n const m = Object.assign({}, d2.state.editDraft||{});\n (d2.$$('[data-f]')||[]).forEach(el=>{ m[el.dataset.f] = el.value; });\n d2.state.editDraft = m;\n return m;\n}\nfunction syncRun(d2){\n const v = {};\n (d2.$$('[data-p]')||[]).forEach(el=>{ v[el.dataset.p] = el.value; });\n return v;\n}\nfunction varsFromSql(sql){\n const out=[], seen={};\n (String(sql||'').match(/\\{\\{([^}]*)\\}\\}/g)||[]).forEach(x=>{\n const v = x.replace(/^\\{\\{|\\}\\}$/g,'').trim();\n if(v && !seen[v]){ seen[v]=1; out.push(v); }\n });\n return out;\n}\n\n// ---- pedaços de UI ----\nfunction cardHtml(d2, q, sel){\n const vars = varsOf(q);\n const armed = d2.state.armed === q._id;\n return `\n
${armed\n ? `${ICON.ok} ${ICON.x} `\n : `${ICON.del} `}
\n
\n
${esc(q.name||'(sem nome)')} \n
\n ${q.active===false?'inativa':'ativa'} \n ${vars.length?`${vars.length} var${vars.length>1?'s':''} `:''}\n ${q.dataset?`${esc(q.dataset)} `:''}\n
\n ${q.description?`
${esc(q.description)}
`:''}\n
\n
${l} `;\n const slots = list.length\n ? list.map(r=>cardHtml(d2, r, r._id===selId)).join('')\n : `Nenhuma consulta encontrada.
`;\n return `\n \n Query Library \n ${ICON.plus} \n
\n \n ${list.length} de ${all.length}
\n ${slots}
\n `;\n}\nfunction resultHtml(lr){\n if(!lr) return '';\n if(lr.error) return ``;\n const rs = lr.rows || [];\n if(!rs.length) return `\n
Preview sem linhas · ${esc(lr.ms)}ms
\n
O runner respondeu sem rows. Payload bruto de pilotRunQuery — use isto para saber se o problema é a query ou o bridge Databricks:
\n
${esc(JSON.stringify(lr.raw||{}, null, 2)).slice(0,4000)}\n
${esc(c)} `).join('');\n const body = rs.slice(0,100).map((r,i)=>`${cols.map(c=>`${esc(r[c])} `).join('')} `).join('');\n return `\n
Preview ${rs.length} linha(s)${rs.length>100?' · mostrando 100':''} · ${esc(lr.ms)}ms
\n
\n
queryLib não resolveu nenhum módulo.'\n : (ds.loading ? 'Carregando consultas…' : 'Crie a primeira consulta para começar a testar.');\n return ``;\n }\n const lr = (d2.state.lastRun || {})[q._id];\n const sql = String(q.sql||'');\n const vars = varsOf(q);\n const off = q.active===false;\n const n = lr && lr.rows ? lr.rows.length : 0;\n const runTxt = !lr ? '—' : (lr.error ? 'erro' : (n ? n+' linha(s) · '+lr.ms+'ms' : 'sem linhas · '+lr.ms+'ms'));\n const runCls = lr && (lr.error || !n) ? ' warn' : '';\n return `\n Query Library ${ICON.chev}${esc(q.name||'')}
\n \n
\n
${esc(q.name||'')} \n ${q.description?`
${esc(q.description)}
`:''}\n
\n
\n ${ICON.power} ${off?'Ativar':'Desativar'} \n ${ICON.run} Executar \n
\n
\n Databricks \n · Estado: ${off?'inativa':'ativa'} \n · SQL: ${sql.length} car. \n · Última execução: ${esc(runTxt)} \n
\n \n Variables \n ${vars.length?vars.map(v=>`{{${esc(v)}}} `).join(''):'sem parâmetros '}\n
\n \n
\n Databricks SQL \n \n ${ICON.edit} Editar \n ${ICON.copy} Copiar \n \n
\n
${sql?hl(sql):'-- sem SQL '}\n
`;\n}\nfunction editHtml(d2){\n if(!d2.state.editOpen) return '';\n const m = d2.state.editDraft || {};\n const isNew = !m._id;\n const varsStr = Array.isArray(m.variables) ? m.variables.join(', ') : (m.variables||'');\n return `\n
\n
\n
${isNew?'Nova consulta':'Editar consulta'} \n
Placeholders {{param}} são substituídos por pilotRunQuery antes de ir ao Databricks.
\n
\n
Nome (chave) ${d2.state.editErr?`
${esc(d2.state.editErr)}
`:''}
\n
Ativa
\n
\n
\n
\n
\n \n
\n
${vars.map(v=>`
{{${esc(v)}}}
`).join('')}
Esta consulta não tem parâmetros.
`;\n return `\n
\n
\n
Executar · ${esc(q.name||'')} \n
As linhas voltam do Databricks ao vivo e aparecem no Preview.
\n ${fields}\n \n
\n
${esc(d2.state.toast)}
`\n : '';\n return `\n ${sideHtml(d2)}\n ${detailHtml(d2)}\n ${editHtml(d2)}${runHtml(d2)}${toastEl}\n
`;\n },\n mounted(d2){\n if(!d2.state.lastRun) d2.state.lastRun = {};\n\n // --- lista ---\n d2.on('[data-new]','click',()=> d2.setState({ editOpen:true, editDraft:{ active:true, variables:[] }, editBefore:{}, editErr:null }));\n d2.on('[data-q]','input',(e,el)=>{ d2.setState({ q: el.value }); });\n d2.on('[data-filt]','click',(e,el)=> d2.setState({ filt: el.dataset.filt }));\n d2.on('[data-pick]','click',(e,el)=>{\n if(e.target && e.target.closest && e.target.closest('.acts')) return;\n d2.setState({ selId: el.dataset.pick, armed:null });\n });\n d2.on('[data-delask]','click',(e,el)=> d2.setState({ armed: el.dataset.delask }));\n d2.on('[data-delcancel]','click',()=> d2.setState({ armed:null }));\n d2.on('[data-del]','click',(e,el)=>{\n const id = el.dataset.del;\n const row = sortedRows(d2).find(r=>r._id===id) || { _id:id };\n doDelete(d2, row);\n });\n\n // --- detalhe ---\n d2.on('[data-run]','click',()=>{ const q=curRow(d2); if(q) d2.setState({ runOpen:true, runRow:q, running:false }); });\n d2.on('[data-toggle]','click',()=>{ const q=curRow(d2); if(q) doToggle(d2, q); });\n d2.on('[data-edit]','click',()=>{ const q=curRow(d2); if(q) d2.setState({ editOpen:true, editDraft:JSON.parse(JSON.stringify(q)), editBefore:q, editErr:null }); });\n d2.on('[data-copy]','click',()=>{ const q=curRow(d2); doCopy(d2, q && q.sql); });\n\n // --- modal de edição ---\n d2.on('[data-tog]','click',()=>{\n const m = syncEdit(d2);\n d2.setState({ editDraft: Object.assign({}, m, { active: m.active===false }) });\n });\n d2.on('[data-editclose]','click',()=> d2.setState({ editOpen:false, editDraft:null, editBefore:null, editErr:null }));\n d2.on('[data-editbg]','click',(e,el)=>{ if(e.target===el) d2.setState({ editOpen:false, editDraft:null, editBefore:null, editErr:null }); });\n d2.on('[data-save]','click',()=>{\n const m = Object.assign({}, syncEdit(d2));\n if(!String(m.name||'').trim()){ d2.setState({ editErr:'Nome é obrigatório' }); return; }\n const typed = Array.isArray(m.variables)\n ? m.variables\n : String(m.variables||'').split(',').map(s=>s.trim()).filter(Boolean);\n m.variables = typed.length ? typed : varsFromSql(m.sql);\n doSave(d2, m);\n });\n\n // --- modal de execução ---\n d2.on('[data-runclose]','click',()=> d2.setState({ runOpen:false, runRow:null, running:false }));\n d2.on('[data-runbg]','click',(e,el)=>{ if(e.target===el) d2.setState({ runOpen:false, runRow:null, running:false }); });\n d2.on('[data-go]','click',()=> doRun(d2, syncRun(d2)));\n\n d2.on(document,'keydown',(e)=>{\n if(e.key!=='Escape') return;\n if(d2.state.runOpen) d2.setState({ runOpen:false, runRow:null, running:false });\n else if(d2.state.editOpen) d2.setState({ editOpen:false, editDraft:null, editBefore:null, editErr:null });\n else if(d2.state.armed) d2.setState({ armed:null });\n });\n },\n updated(d2){\n // Semeia a seleção assim que os records chegam, para a lista e o painel\n // concordarem no primeiro load. Roda pós-render, nunca dentro de render().\n if(d2.state.selId) return;\n const first = sortedRows(d2)[0];\n if(first && first._id) d2.state.selId = first._id;\n }\n};"}},"queryLib":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"queryLib"}}}},"queryWriter":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"queryWriter"}}}},"runner":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"runner"}}}},"actorEmail":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"actorEmail"}}}}}}}}}},{"_id":"6ad7dacc41232854da246f48","component":"data2-core-types@Component","system":"688179c2a93dd170ce61e598","params":{"extends":"data2-core-primitives@Block","component":"pilotSimPicker","package":"natura-x-piloto","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"const esc = (s) => String(s == null ? '' : s).replace(/[&<>\"']/g, (c) => ({ '&': '&', '<': '<', '>': '>', '\"': '"', \"'\": ''' }[c]));\n\nfunction readUrl() {\n let q;\n try { q = new URLSearchParams(location.search); } catch (e) { q = { get: () => null }; }\n return {\n perfil: q.get('perfil') || '',\n structureCode: q.get('structureCode') || '',\n cycle: q.get('cycle') || ''\n };\n}\n\nexport default {\n css: `\n :host { display:block; }\n .bar { box-sizing:border-box; height:100%; display:flex; align-items:center; gap:12px; flex-wrap:nowrap;\n padding:8px 16px; background:#4a1d96; color:#fff; font:500 13px/1.3 system-ui, sans-serif;\n overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; }\n .bar::-webkit-scrollbar { display:none; }\n .bar > * { flex:0 0 auto; white-space:nowrap; }\n form { flex-wrap:nowrap !important; }\n @media (max-width:700px) { .bar { gap:8px; padding:8px 12px; } .muted { display:none; } .tag { padding:3px 6px; } }\n .tag { background:#fbbf24; color:#1f1300; font-weight:700; padding:3px 8px; border-radius:999px; letter-spacing:.04em; }\n .who { font-weight:600; }\n .muted { opacity:.8; }\n form { display:flex; gap:8px; align-items:center; margin-left:auto; flex-wrap:wrap; }\n select, input { font:inherit; padding:5px 8px; border-radius:6px; border:1px solid #a78bfa; background:#fff; color:#111; }\n input.code { width:110px; }\n input.cyc { width:90px; }\n button { font:inherit; font-weight:600; padding:6px 12px; border-radius:6px; border:0; background:#fbbf24; color:#1f1300; cursor:pointer; }\n button.ghost { background:transparent; color:#fff; border:1px solid #c4b5fd; }\n .err { color:#fecaca; }\n `,\n render(d2) {\n const cur = readUrl();\n const active = !!(cur.perfil && cur.structureCode);\n const label = cur.perfil === 'gn' ? 'GN do setor' : 'Líder do grupo';\n const err = d2.state.err || '';\n return `\n \n MODO SIMULAÇÃO \n ${active\n ? `Vendo como ${esc(label)} ${esc(cur.structureCode)} ${cur.cycle ? `· ciclo ${esc(cur.cycle)} ` : ''}`\n : `Escolha um perfil e o código da estrutura para simular. `}\n \n ${err ? `${esc(err)} ` : ''}\n
`;\n },\n mounted(d2, root) {\n d2.on('.f', 'submit', (ev) => {\n ev.preventDefault();\n const f = ev.target;\n const perfil = f.perfil.value === 'gn' ? 'gn' : 'lider';\n const code = String(f.structureCode.value || '').trim();\n const cycle = String(f.cycle.value || '').trim();\n if (!/^\\d{1,10}$/.test(code)) { d2.state.err = 'Código da estrutura inválido.'; return; }\n if (cycle && !/^\\d{6}$/.test(cycle)) { d2.state.err = 'Ciclo deve ter 6 dígitos (ex.: 202615).'; return; }\n const q = new URLSearchParams();\n q.set('perfil', perfil);\n q.set('structureCode', code);\n if (cycle) q.set('cycle', cycle);\n location.search = q.toString();\n });\n d2.on('.clear', 'click', () => { location.search = ''; });\n }\n};"}}}}}}}},{"_id":"6ad953d8c520b0805dcbdd8d","component":"data2-core-types@Component","system":"688179c2a93dd170ce61e598","params":{"extends":"data2-core-primitives@Block","component":"pilotDeckV1V2","package":"natura-x-piloto","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"const ul = (items) => `${items.map((i) => `${i} `).join('')} `\n\nconst problem = (tag, title, items, note) => `\n Problemas da v1 · ${tag}
\n ${title} \n ${ul(items)}\n ${note ? `${note}
` : ''}`\n\nconst map = (title, rows) => `\n O que a v2 resolve
\n ${title} \n ${rows.map(([a, b]) => `\n
`).join('')}\n
\n
Data2 × Natura · 22/10/2026
\n
Painel de Ganhos \n
O que aprendemos com a v1 e como a v2 resolve
\n
Contexto
\n A v1 cresceu por camadas \n A v1 está no ar desde 2025 e atende GV, GN e Líder de Negócio nas Redes 1 e 2: aceleradores, ranking de líderes e remuneração prévia do ciclo.
\n Cada ciclo trouxe uma regra nova, uma base nova e um ajuste de urgência. A v2 é a reconstrução com o que aprendemos.
\n Dados mantidos à mão Lentidão e cache Virada de ciclo manual Acesso e sessão Dependência da Data2
`,\n\n problem('dados', 'Dados mantidos à mão', [\n 'O nível da líder vem de uma tabela atualizada a partir do CSV de líderes. Existem duas cópias dessa tabela, e elas divergem.',\n 'O CSV traz a data de entrada da líder no cargo, não o ciclo em que o nível mudou.',\n 'Grupo × setor, setor × rede e setor × GN também são planilhas copiadas pro sistema. A atualização de 28/08 foram 109 alterações manuais.',\n 'Líder nova só aparece depois de entrar em duas listas fixas e de uma publicação.',\n ], '21/10: um GN viu no ranking níveis do ciclo anterior. O DW da Natura registra a mudança no 202614; a tabela montada pelo CSV, no 202615.'),\n\n problem('performance', 'Lentidão e cache', [\n 'Consulta de uma líder na API: 30 a 50 s sem cache. Ranking de um setor: 24 s .',\n 'O cache depende de três rotinas de aquecimento a cada 6 h.',\n 'Quando uma rodada falha, a tela da líder mostra meta sem realizado ou número em branco (23/09 e 14/10).',\n 'Ciclo fechado continua lento no primeiro acesso.',\n ], 'Em setembro o ranking caiu de 24 s pra 2,7 s com cache quente. Isso melhorou a tela, mas o problema de origem continuou.'),\n\n problem('ciclo', 'Virada de ciclo manual', [\n 'Abrir um ciclo exige três passos: cadastrar o ciclo, validar os aceleradores nos 18 cards e atualizar o ciclo padrão do app, com publicação.',\n 'Rede 1 e Rede 2 viram em dias diferentes. Em 25/09 a Rede 2 chegou ao 202615 antes da Rede 1, e cada acesso levava de 8 a 26 s.',\n 'A regra de remuneração muda por ciclo escrito no código (202604, 202612).',\n 'Regras herdadas com erro: faixa faltando que vira valor vazio e faturamento Avon do GN Rede 2 comparando indicadores diferentes.',\n ], '21/10: os aceleradores do 202616 só apareceram depois da virada manual.'),\n\n problem('acesso', 'Acesso e sessão', [\n 'A sessão se acumulava a cada ciclo até travar o painel (22/09). A correção limitou a sessão a 6 h; quem já estava travado precisou limpar o navegador.',\n 'O controle de acesso por perfil entrou com o produto já no ar, em agosto, fechando acesso tela por tela.',\n ]),\n\n problem('operação', 'Dependência da Data2 pra operar', [\n 'Mudar indicador, faixa ou bônus é mudança de código.',\n 'Virar ciclo, cadastrar líder e trocar GN de setor passam pela Data2.',\n 'Quando um número sai estranho, nenhuma tela mostra de onde ele veio.',\n ]),\n\n map('Dados e performance', [\n ['Nível da líder em planilha manual', 'Nível por ciclo lido do DW da Natura (plano Líder de Negócio, com vigência). Bateu com o fechamento nos casos testados'],\n ['Estrutura copiada de CSV', 'Calendário e ciclos já vêm do Databricks de hora em hora. Estrutura (setor, GN, grupo) passa a sincronizar do Databricks no mesmo job: em implementação, antes do paralelo de 05/11'],\n ['Tela esperando a API', 'Indicadores e metas atualizados de hora em hora num snapshot. Medido em 19/10: grupo 15 s → 4,6 s, setor 17 s → 5,8 s'],\n ['Virada de ciclo em 3 passos', 'Ciclo abre e fecha pelo calendário da Natura, por grupo. Rede 1 e Rede 2 viram cada uma no seu dia'],\n ]),\n\n map('Regras, acesso e operação', [\n ['Regra de remuneração no código', 'Cada ciclo aponta pra um conjunto de regras versionado: faixas, fórmula e bônus. As 6 configurações da v1 foram migradas'],\n ['Acesso remendado', 'Um ponto único de identidade: GV vê tudo, GN o setor, líder o grupo. Admin com login próprio e registro de acesso'],\n ['Tudo passa pela Data2', 'Admin com indicadores, faixas, bônus, fórmula, regras por ciclo e consultas. Toda alteração fica no log de auditoria'],\n ['Sem visibilidade do cálculo', 'Simulador com meta e realizado por indicador e a faixa ativa destacada, mais histórico por ciclo'],\n ]),\n\n `v1 × v2 · mesma tela, mesmo setor
\n Ranking de Líderes, setor 3531, ciclo 202615 \n \n \n
Mesma base. Faturamento Natura 2.307.185, mesmo volume de pontos e 1.494 cadastros nas duas.
\n
Nível da líder. A v1 mostra Erica Ouro, Camila Diamante e Acalicia sem nível. A v2 lê do DW: Prata, Prata e Diamante.
\n
Remuneração por líder. A v2 mostra o valor prévio de cada líder no próprio card.
\n
Validação
\n Mesmo cálculo da v1 \n \n Caso v1 / fechamento v2 \n Líder Rede 1, 202615 956,25 956,25 Líder Rede 2, 202613 5.417,52 5.417,52 Líder Rede 1, 202601 (fechamento pago) 1.725,00 1.725,00 GN Rede 1, 202516 5.700,00 5.700,00 \n
\n As 6 configurações de remuneração da v1 foram migradas e conferidas caso a caso contra a v1 e contra o fechamento pago.
`,\n\n `Veja a v2
\n Onde abrir \n `,\n\n `Go-live
\n v2 oficial em 12/11 \n \n
28/10
Fechamento estatístico do 202615 em todos os setores
\n
até 04/11
Natura valida a v2 contra o fechamento. Setores 3515 e 3531 podem começar antes
\n
05/11
v2 no ar em paralelo com a v1, mesmos usuários, comparação lado a lado
\n
12/11
Go-live final: a v2 vira a oficial
\n
Em andamento, antes de 05/11: acesso de líderes e GNs pelo SSO da Natura na v2 e sincronização da estrutura (setor, GN, grupo) com o Databricks. Pendente da Natura: fonte oficial do nível da líder (DW ou CSV de líderes).
`,\n]\n\nfunction go(d2, delta) {\n const i = Math.min(SLIDES.length - 1, Math.max(0, (d2.state.i || 0) + delta))\n if (i !== (d2.state.i || 0)) d2.state.i = i\n}\n\nexport default {\n css: `\n:host{--brand:#F26B21;--brand2:#E5197B;--ink:#1c2230;--muted:#5a6474;--line:#e3e7ee;--ok:#15803d;--warn:#b45309}\n.deck{position:relative;height:100%;min-height:100%;display:flex;flex-direction:column;background:#f6f4f1;color:var(--ink);font:18px/1.55 -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;overflow:hidden}\n.deck *{box-sizing:border-box}\n.deck:focus{outline:none}\n.bar{height:5px;background:var(--line)}\n.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--brand),var(--brand2));transition:width .3s ease}\n.stage{flex:1;min-height:0;display:flex;padding:32px 48px;overflow:auto}\n.slide{margin:auto;width:100%;max-width:1080px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:52px 60px;box-shadow:0 2px 10px rgba(20,30,50,.06)}\n.slide.c{background:linear-gradient(135deg,var(--brand),var(--brand2));border:0;color:#fff;min-height:440px;display:flex;align-items:center}\n.kicker{font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--brand2);margin-bottom:10px}\n.kicker.light{color:rgba(255,255,255,.85)}\nh1{margin:0 0 12px;font-size:56px;font-weight:800;letter-spacing:-.02em;line-height:1.05}\nh2{margin:0 0 22px;font-size:34px;font-weight:800;letter-spacing:-.01em;line-height:1.15}\n.sub{margin:0;font-size:24px;opacity:.95}\n.lead{font-size:20px;color:#2a3040;margin:0 0 14px;max-width:62ch}\nul,ol{margin:0;padding-left:24px}\nli{margin:10px 0}\nli::marker{color:var(--brand)}\n.note{margin-top:22px;padding:14px 18px;border-left:4px solid var(--brand);background:#fff6ef;border-radius:10px;font-size:16px;color:#3a2a1c}\n.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}\n.chips span{background:#fff1e8;color:#a3420c;border:1px solid #ffd7bf;border-radius:999px;padding:7px 14px;font-size:15px;font-weight:600}\n.map{display:flex;flex-direction:column;gap:12px}\n.row{display:grid;grid-template-columns:1fr 32px 1.6fr;align-items:center;gap:8px}\n.v1,.v2{border-radius:12px;padding:12px 16px;font-size:16px;line-height:1.45}\n.v1{background:#f1f3f6;color:#3a4256}\n.v2{background:#ecfdf3;color:#14532d;border:1px solid #bbf7d0}\n.arrow{text-align:center;color:var(--brand);font-weight:800;font-size:22px}\n.tag{display:inline-block;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;border-radius:5px;padding:2px 6px;margin-right:8px;vertical-align:1px}\n.t1{background:#dde2ea;color:#4a5466}.t2{background:#bbf7d0;color:#15803d}\ntable{width:100%;border-collapse:collapse;font-size:17px}\nth,td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line)}\nth{font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}\ntd.ok{color:var(--ok);font-weight:700}td.diff{color:var(--warn);font-weight:700}\n.steps li{padding-left:6px;font-size:19px}\n.shots{display:grid;grid-template-columns:1fr 1fr;gap:16px}\n.shot{position:relative;display:block;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#f5f5f5;height:420px}\n.shot img{width:100%;height:100%;object-fit:contain;object-position:top center;display:block}\n.shot .tag{position:absolute;top:10px;left:10px;margin:0;z-index:1}\n.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px;font-size:14.5px;line-height:1.45}\n.facts div{background:#fff6ef;border-radius:10px;padding:10px 14px}\n.links{display:flex;flex-direction:column;gap:14px}\n.link{border:1px solid var(--line);border-radius:12px;padding:16px 20px}\n.lk-t{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:4px}\n.link a{font-size:20px;font-weight:700;color:var(--brand2);word-break:break-all}\n.lk-d{font-size:16px;color:#3a4256;margin-top:6px}\n.link.main{border:2px solid var(--brand);background:#fff6ef;padding:22px 24px}\n.link.main a{font-size:24px}\n.link:not(.main) a{font-size:16px}\n.tl{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}\n.st{border-top:4px solid var(--line);padding:12px 4px 0}\n.st.hl{border-top-color:var(--brand)}\n.dt{font-size:24px;font-weight:800;color:var(--ink)}\n.st.hl .dt{color:var(--brand2)}\n.sd{font-size:15.5px;color:#3a4256;margin-top:4px;line-height:1.45}\n.nav{display:flex;align-items:center;justify-content:space-between;padding:12px 48px 18px;color:var(--muted);font-size:14px}\n.nav button{border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px 16px;font-weight:600;font-size:14px;font-family:inherit;color:var(--ink);cursor:pointer}\n.nav button:disabled{opacity:.35;cursor:default}\n.hint{opacity:.7}\n@media(max-width:760px){.stage{padding:16px}.slide{padding:28px 22px}h1{font-size:38px}h2{font-size:26px}.row{grid-template-columns:1fr}.arrow{display:none}.shots,.facts,.tl{grid-template-columns:1fr}.shot{height:260px}table{font-size:14px}th,td{padding:8px 6px}th{font-size:11px}.nav{padding:10px 16px}.hint{display:none}}\n`,\n render(d2) {\n const i = d2.state.i || 0\n const n = SLIDES.length\n return `\n
\n
\n
\n ← Anterior \n ${i + 1} / ${n} · setas ← → pra navegar \n Próximo → \n
\n
\n 0?'bad':'ok'}\">${sel.failed>0?`${sel.failed} reprovado${sel.failed===1?'':'s'}`:'Tudo aprovado'} \n ${esc(sel.passed)} de ${esc(sel.total)} casos \n ${esc(fmtDate(sel.startedAt||sel.createdAt))}${sel.actor?` · ${esc(sel.actor)}`:''}${sel.durationMs!=null?` · ${(Number(sel.durationMs)/1000).toLocaleString('pt-BR',{maximumFractionDigits:1})} s`:''} \n
` : `Nenhuma execução ainda.
`;\n const rows = results.map(r=>`\n ${r.ok?ICON.ok:ICON.x} \n ${esc(r.id)} \n ${esc(r.name)} \n Esperado ${esc(fmtVal(r.expected))}Obtido ${esc(fmtVal(r.got))}${esc(fmtVal(r.ms))} ms \n
`).join('');\n const casesCard = sel ? `Casos da execução \n
Caso O que verifica Esperado Obtido Tempo
\n ${rows || '
Execução sem casos.
'}
Rode a suíte para ver o resultado de cada caso.
\n ${esc(fmtDate(r.startedAt||r.createdAt))} \n 0?'bad':'ok'}\">${esc(r.passed)}/${esc(r.total)} \n ${esc(r.actor||'')}${r.cardId?` · card ${esc(String(r.cardId).slice(-6))}`:''} \n `).join('');\n const histCard = runs.length ? `` : '';\n const tab = d2.state.tab || 'runs';\n const reqsAll = allReqs(d2);\n let reqCard = '';\n if(tab === 'reqs'){\n const res = lastResults(d2);\n const q = String(d2.state.rq||'').trim().toLowerCase();\n const rk = d2.state.rk || 'all';\n const rc = d2.state.rc || 'all';\n const counts = { auto:0, fail:0, manual:0, none:0 };\n reqsAll.forEach(r=>{ counts[covOf(r,res)]++; });\n const list = reqsAll.filter(r=>{\n if(rk!=='all' && r.kind!==rk) return false;\n if(rc!=='all' && covOf(r,res)!==rc) return false;\n if(!q) return true;\n const hay = `${r.code||''} ${r.title||''} ${r.section||''} ${r.criteria||''} ${r.decision||''} ${(r.tests||[]).join(' ')}`.toLowerCase();\n return hay.indexOf(q) >= 0;\n });\n const editId = d2.state.editId || '';\n const f = d2.state.form || {};\n const saving = !!d2.state.saving;\n const opt = (v,cur)=>`${esc(v)} `;\n const form = (isNew)=>``;\n const items = list.map(r=>{\n const c = covOf(r,res);\n const tests = (Array.isArray(r.tests)?r.tests:[]).map(t=>`${esc(t)} `).join('');\n const st = (r.status && r.status!=='vigente') ? `${esc(r.status)} ` : '';\n const editing = editId === r._id;\n return `\n
\n
${esc(r.code)} \n
\n
${esc(r.title)}
\n
${esc(r.kind||'')}${r.section?` · ${esc(r.section)}`:''}
\n ${r.criteria?`
${esc(r.criteria)}
`:''}\n ${r.decision?`
${esc(r.decision)}
`:''}\n ${tests?`
${tests}
`:''}\n
${r.updatedBy?`Alterado por ${esc(r.updatedBy)}`:''}${r.updatedAt?` · ${esc(fmtDate(r.updatedAt))}`:''}
\n
\n
\n ${COV[c][0]} ${st}\n ${editing?'':`Editar `}\n
\n
\n
${label} `;\n reqCard = `\n
Requisitos da V2 · base dos testes ? O que é RF e RNF? \n
\n Novo requisito \n
\n
\n ${chip('data-rk','all',rk,'Todos')}${chip('data-rk','funcional',rk,'Funcionais')}${chip('data-rk','não funcional',rk,'Não funcionais')}\n
\n
Os casos ficam verdes ou vermelhos conforme a última execução da suíte; cinza é teste manual (E2E, SEG, VIS, REG, SCAN) ou ainda não automatizado.Entenda a cobertura
\n ${editId==='__new'?form(true):''}\n ${items || '
Nenhum requisito com esses filtros.
'}\n
\n
\n
Como usar a tela de testes × \n
Passo a passo
\n
\n Rode a suíte Clique em Rodar suíte . Ela verifica sessão, ciclo, cálculo, acesso e a saúde dos dados direto no servidor, em cerca de 1 minuto. Só lê dados; a única gravação é o registro da própria execução. Leia o resultado O selo mostra \"Tudo aprovado\" ou quantos casos reprovaram. Na aba Execuções os reprovados vêm primeiro, com o valor esperado e o obtido lado a lado. Use o histórico como evidência Cada execução fica guardada com data, autor e duração. Clique numa execução antiga para revê-la e cite-a na nota do card antes de pedir review. Confira o que cada teste cobre Na aba Requisitos está a lista do que a V2 precisa fazer, com os casos ligados a cada item: verde passou, vermelho falhou, cinza é verificação manual. Os filtros mostram o que está falhando ou sem teste. Mantenha os requisitos em dia Use Novo requisito ou Editar . Em \"Casos de teste\", separe os IDs por vírgula. Excluir pede uma segunda confirmação. \n
Tipos de requisito
\n RF · requisito funcional \n O que o painel faz para quem usa: uma tela, uma regra de cálculo, uma ação. Ex.: RF-13, calcular a remuneração pela fórmula do ciclo. \n RNF · requisito não funcional \n Como o sistema precisa se comportar, seja qual for a função: segurança, privacidade, desempenho, integridade, responsividade, rastreabilidade. Ex.: RNF-03, token Natura nunca fica gravado. \n \n
Casos e cobertura
\n Casos de teste \n UNIT, INT, ACC, SYNC, CACHE, EST, KPI e PERF rodam na suíte automática. E2E, SEG, VIS e REG são verificações manuais feitas no painel; SCAN é a varredura de segurança feita no builder. \n Cobertura \n Suíte automática: algum caso passou na última execução. Falhando: algum caso falhou. Só manual: só há casos manuais. Sem teste: nenhum caso ligado. \n \n
Entendi
\n
\n
\n \n
${tab==='reqs' ? reqCard : casesCard + histCard}
\n ${helpModal}\n
stands in for the decoded subject\n d2.shared.set('pilotActingUserId', actingUser, { global:true });\n return { userId: actingUser, mode: 'token' };\n }\n d2.shared.set('pilotUrlToken', '', { global:true });\n }catch(e){}\n // App A / GV-ADMIN mode (fallback). PROD App A: identity from login session.\n d2.shared.set('pilotMode', 'gv-admin', { global:true });\n const uid = d2.shared.get('pilotActingUserId', '', { global:true }) || '';\n return { userId: uid, mode: 'gv-admin' };\n}\nfunction readActingUserId(d2){ return readActingIdentitySource(d2).userId; }\n// The mode the shell resolved on mount (cached into the store). 'token' hides all\n// role-switching UI; 'gv-admin' shows the switcher + Ver como.\nfunction resolveMode(d2){\n const store = d2.store('store');\n return (store && store.get('pilotMode', 'gv-admin')) || 'gv-admin';\n}\nfunction readImpersonateUserId(d2){\n return d2.shared.get('pilotImpersonateUserId', '', { global:true }) || '';\n}\n// Resolve acting + effective identities via the server-side seam (pilotResolveIdentity).\nasync function resolveIdentities(d2){\n const actingUserId = readActingUserId(d2);\n const impersonateUserId = readImpersonateUserId(d2);\n try{\n const res = await d2.rush('pilotResolveIdentity').invoke({ actingUserId, impersonateUserId });\n const body = (res && res.data && res.data.data) ? res.data.data : (res && res.data ? res.data : res);\n if(body && (body.acting || body.effective)) return body;\n }catch(e){ d2.log('resolveIdentities error', e); }\n return { acting:null, effective:null, impersonating:false };\n}\nfunction resolveActingIdentity(d2){\n const store = d2.store('store');\n return (store && store.get('pilotActingIdentity', null)) || null;\n}\nfunction resolveEffectiveIdentity(d2){\n const store = d2.store('store');\n return (store && store.get('pilotEffectiveIdentity', null))\n || (store && store.get('pilotActingIdentity', null)) || null;\n}\nfunction isImpersonating(d2){\n const store = d2.store('store');\n return !!(store && store.get('pilotImpersonating', false));\n}\n// ── STEP 2/3 — mount-time identity resolution ────────────────────────────────\nasync function resolveIdentityAndSeed(d2){\n const store = d2.store('store');\n if(!store) return;\n const src = readActingIdentitySource(d2); // establishes pilotMode + acting id\n store.set('pilotMode', src.mode);\n store.set('pilotTokenInvalid', false);\n store.set('pilotTokenInvalidReason', '');\n d2.shared.set('pilotTokenInvalid', false, { global:true }); // launchers (Histórico/Simulador) hide on an invalid session\n // ── App B / TOKEN INGRESS — resolve the URL token via the pilotResolveSession\n // Rush endpoint. The token in the URL is exchanged for a scoped identity server-side.\n if(src.mode === 'token' && src.token){\n // Session persistence: a resolved token-session survives SPA navigation via\n // the pilot store (reused as the session store — key 'pilotTokenSession').\n const cached = store.get('pilotTokenSession', null);\n let identity = (cached && cached.token === src.token && cached.identity) ? cached.identity : null;\n if(!identity){\n try{\n const res = await d2.rush('pilotResolveSession').invoke({ token: src.token });\n const b = (res && res.data && res.data.data) ? res.data.data : (res && res.data ? res.data : res);\n if(b && b.valid && b.userId){\n identity = b;\n store.set('pilotTokenSession', { token: src.token, identity: identity });\n } else if(b && b.reason){\n store.set('pilotTokenInvalidReason', String(b.reason));\n }\n }catch(e){ d2.log('pilotResolveSession error', e); }\n }\n if(identity){\n // Token identity has no impersonation. acting == effective == the scoped user.\n d2.shared.set('pilotActingUserId', identity.userId, { global:true });\n store.set('pilotActingIdentity', identity);\n store.set('pilotEffectiveIdentity', identity);\n store.set('pilotImpersonating', false);\n seedStoreFromEffective(d2);\n return; // token mode: no switcher, no pilotResolveIdentity round-trip\n }\n // Invalid/expired token → \"sessão inválida\" state (rendered by the panel).\n store.set('pilotTokenInvalid', true);\n d2.shared.set('pilotTokenInvalid', true, { global:true });\n store.set('pilotTokenSession', null);\n return;\n }\n const body = await resolveIdentities(d2); // { acting, effective, impersonating }\n if(body){\n if(body.acting) store.set('pilotActingIdentity', body.acting);\n if(body.effective) store.set('pilotEffectiveIdentity', body.effective);\n store.set('pilotImpersonating', !!body.impersonating);\n }\n // Clamp the dashboard store to the effective identity (STEP 3).\n seedStoreFromEffective(d2);\n // Populate the pilot user-switcher (gv-admin only). Token mode has no switcher.\n if(src.mode !== 'token') ensureSwitcherUsers(d2);\n}\n// Load the full pilot-user roster once for the switcher dropdown (gv-admin\n// stand-in for the App-A login). Distinct from pilotAllowedTargets (scope-limited).\nasync function ensureSwitcherUsers(d2){\n if(Array.isArray(d2.state.switcherUsers) && d2.state.switcherUsers.length) return;\n try{\n const res = await d2.rush('pilotUsers').invoke({});\n const b = (res && res.data && res.data.data) ? res.data.data : (res && res.data ? res.data : res);\n d2.state.switcherUsers = (b && Array.isArray(b.users)) ? b.users : [];\n d2.refresh();\n }catch(e){ d2.log('switcherUsers error', e); }\n}\n// PILOT switcher (App-A stand-in for login). Sets the acting user + reloads as them.\nfunction onSwitchActingUser(d2, uid){\n if(!uid) return;\n d2.shared.set('pilotActingUserId', uid, { global:true });\n d2.shared.set('pilotImpersonateUserId', '', { global:true }); // switching identity ends any impersonation\n reloadAsIdentity(d2);\n}\n// Fetch the allowed impersonation targets for the current acting user (rules + scope).\nasync function ensureAllowedTargets(d2){\n const acting = resolveActingIdentity(d2);\n const actorUserId = (acting && acting.userId) || d2.shared.get('pilotActingUserId','', { global:true });\n if(!actorUserId){ d2.state.allowedTargets = []; d2.refresh(); return; }\n if(d2.state.allowedTargetsFor === actorUserId && Array.isArray(d2.state.allowedTargets)) return;\n d2.state.allowedTargetsLoading = true; d2.refresh();\n try{\n const res = await d2.rush('pilotAllowedTargets').invoke({ actorUserId });\n const b = (res && res.data && res.data.data) ? res.data.data : (res && res.data ? res.data : res);\n d2.state.allowedTargets = (b && Array.isArray(b.targets)) ? b.targets : [];\n d2.state.allowedTargetsFor = actorUserId;\n }catch(e){ d2.log('allowedTargets error', e); d2.state.allowedTargets = []; }\n finally{ d2.state.allowedTargetsLoading = false; d2.refresh(); }\n}\n// Pick a target -> validate via pilotImpersonate (403 if denied) -> apply effective identity + reload.\nasync function onPickImpersonationTarget(d2, targetUserId){\n if(!targetUserId) return;\n const store = d2.store('store');\n const acting = resolveActingIdentity(d2);\n const actorUserId = (acting && acting.userId) || d2.shared.get('pilotActingUserId','', { global:true });\n const cycle = store ? store.get('cycle','202610') : '202610';\n try{\n const res = await d2.rush('pilotImpersonate').invoke({ actorUserId, targetUserId, cycle });\n const b = (res && res.data && res.data.data) ? res.data.data : (res && res.data ? res.data : res);\n if(!b || b.code === 403 || b.allowed === false){\n d2.state.impError = (b && b.message) || 'Você não tem permissão para ver como essa pessoa.';\n d2.refresh();\n return;\n }\n d2.shared.set('pilotImpersonateUserId', targetUserId, { global:true });\n d2.state.impPickerOpen = false; d2.state.impError = null;\n pilotTrackView(d2, 'impersonation:start', (b && b.perfil) || 'impersonation', 'impersonation');\n reloadAsIdentity(d2);\n }catch(e){\n d2.state.impError = 'Não foi possível abrir a visualização: ' + (e && e.message ? e.message : String(e));\n d2.refresh();\n }\n}\n// Sair da impersonação -> log end + restore actor + full scope.\nasync function onExitImpersonation(d2){\n const store = d2.store('store');\n const acting = resolveActingIdentity(d2);\n const actorUserId = (acting && acting.userId) || d2.shared.get('pilotActingUserId','', { global:true });\n const targetUserId = d2.shared.get('pilotImpersonateUserId','', { global:true });\n const cycle = store ? store.get('cycle','202610') : '202610';\n try{ await d2.rush('pilotEndImpersonation').invoke({ actorUserId, targetUserId, cycle }); }\n catch(e){ d2.log('endImpersonation error', e); }\n d2.shared.set('pilotImpersonateUserId', '', { global:true });\n pilotTrackView(d2, 'impersonation:end', 'gv');\n reloadAsIdentity(d2);\n}\n// Re-resolve identity, clear any drill breadcrumbs, then boot the panel again — which\n// moves to the panel of the new effective identity when it is not this one.\nasync function reloadAsIdentity(d2){\n const store = d2.store('store');\n if(store){\n store.set('data', null);\n d2.shared.set('pilotGvRede','', { global:true });\n d2.shared.set('pilotReturnPerfil','', { global:true });\n d2.shared.set('pilotReturnStructure','', { global:true });\n d2.shared.set('pilotSelectedGroup','', { global:true });\n d2.shared.set('pilotDrillGroup','', { global:true });\n d2.state.selGroup = '';\n }\n await bootView(d2);\n}\n// The effective perfil drives ALL scope locks. When a GV impersonates a GN/Líder,\n// the effective perfil becomes gn/lider so the SAME locks apply.\nfunction effectivePerfil(d2){\n const eff = resolveEffectiveIdentity(d2);\n return (eff && eff.perfil) || 'gv';\n}\n// STEP 3 — SCOPE ENFORCEMENT. Seed + clamp the dashboard store to the effective identity.\nfunction seedStoreFromEffective(d2){\n const store = d2.store('store');\n const eff = resolveEffectiveIdentity(d2);\n if(!store || !eff) return;\n const perfil = eff.perfil || 'gv';\n store.set('perfil', perfil);\n store.set('gvName', eff.gvName || 'PAINEIRA-ROSA');\n if(perfil === 'gn'){\n store.set('structureCode', String(eff.structureCode || eff.sectorCode || ''));\n if(eff.rede) store.set('rede', eff.rede);\n } else if(perfil === 'lider'){\n store.set('structureCode', String(eff.structureCode || ''));\n if(eff.rede) store.set('rede', eff.rede);\n } else {\n // GV — keep full navigation; only default the structure if empty.\n if(eff.rede) store.set('rede', eff.rede);\n }\n}\n// gv → no locks; gn → locked to own sector (may drill down to a leader read-only);\n// lider → locked to own group (no drill/back at all).\nfunction scopeLockedToSector(d2){ return effectivePerfil(d2) === 'gn'; }\nfunction scopeLockedToGroup(d2){ return effectivePerfil(d2) === 'lider'; }\n// Clamp any attempt to move to a sector the effective GN doesn't own.\nfunction sectorAllowed(d2, sectorCode){\n const eff = resolveEffectiveIdentity(d2);\n if(!eff) return true;\n if(eff.perfil === 'gv') return true;\n if(eff.perfil === 'gn') return String(sectorCode) === String(eff.structureCode || eff.sectorCode || '');\n if(eff.perfil === 'lider') return String(sectorCode) === String(eff.sectorCode || '');\n return true;\n}\n// Clamp any attempt to drill into a group outside the effective identity's scope.\nfunction groupAllowed(d2, groupCode, groupSectorCode){\n const eff = resolveEffectiveIdentity(d2);\n if(!eff) return true;\n if(eff.perfil === 'gv') return true;\n if(eff.perfil === 'gn'){\n if(groupSectorCode != null) return String(groupSectorCode) === String(eff.structureCode || eff.sectorCode || '');\n return true;\n }\n if(eff.perfil === 'lider') return String(groupCode) === String(eff.structureCode || '');\n return true;\n}\nfunction escH(s){ return String(s==null?'':s).replace(/&/g,'&').replace(//g,'>').replace(/\"/g,'"'); }\nconst PERFIL_LABEL = { gv:'GV', gn:'GN', lider:'Líder' };\nfunction perfilLabel(p){ return PERFIL_LABEL[p] || String(p||''); }\n// End-user (token) session? Not only the store's pilotMode — the global store handle can come back\n// empty on some loads — but also the shared flag, a token in the URL, or the locally stored token.\nfunction isTokenMode(d2){\n if(resolveMode(d2) === 'token') return true;\n try{ if(d2.shared.get('pilotMode', '', { global:true }) === 'token') return true; }catch(e){}\n try{ const q = new URLSearchParams((typeof location!=='undefined' && location.search) || ''); if(q.get('authorization') || q.get('token') || q.get('c')) return true; }catch(e){}\n try{ const ns = JSON.parse(window.localStorage.getItem('_d2_natura_session') || 'null'); if(ns && ns.token) return true; }catch(e){}\n return false;\n}\n// ─────────────────────────────────────────────────────────────────────────────\n// ACCESS TRACKING (additive) — sessions + section-view events via pilotTrackAccess.\n// One session per BROWSER session (sessionStorage), reused across SPA reloads.\n// ─────────────────────────────────────────────────────────────────────────────\nconst PILOT_SID_KEY = 'pilotAccessSessionId';\nlet _pilotViewInFlight = null; // dedupe: last section we emitted a view for\nfunction pilotSidStore(){\n try{ return (typeof window!=='undefined' && window.sessionStorage) ? window.sessionStorage : null; }catch(e){ return null; }\n}\nfunction pilotGetSid(d2){\n const ss = pilotSidStore();\n let sid = '';\n try{ if(ss) sid = ss.getItem(PILOT_SID_KEY) || ''; }catch(e){}\n if(!sid){\n const store = d2.store('store');\n if(store) sid = store.get('pilotAccessSid','') || '';\n }\n return sid;\n}\nfunction pilotSetSid(d2, sid){\n if(!sid) return;\n const ss = pilotSidStore();\n try{ if(ss) ss.setItem(PILOT_SID_KEY, sid); }catch(e){}\n const store = d2.store('store');\n if(store) store.set('pilotAccessSid', sid);\n}\nfunction pilotMakeSid(){\n try{ if(typeof crypto!=='undefined' && crypto.randomUUID) return 's-'+crypto.randomUUID(); }catch(e){}\n return 's-'+Date.now()+'-'+Math.floor(Math.random()*1e9);\n}\n// effective identity + current store scope, flattened into the tracker payload shape.\nfunction pilotIdentityPayload(d2){\n const store = d2.store('store');\n const eff = (typeof resolveEffectiveIdentity==='function' ? resolveEffectiveIdentity(d2) : null) || {};\n const impersonating = (typeof isImpersonating==='function') ? isImpersonating(d2) : false;\n const rawMode = store ? store.get('pilotMode','gv-admin') : 'gv-admin';\n // entryMode = the identity mode; a login while impersonating carries mode 'impersonation'.\n const mode = impersonating ? 'impersonation' : (rawMode === 'gv-admin' ? 'session' : rawMode);\n let ua = ''; let ref = '';\n try{ ua = (typeof navigator!=='undefined' && navigator.userAgent) || ''; }catch(e){}\n try{ ref = (typeof document!=='undefined' && document.referrer) || ''; }catch(e){}\n return {\n userId: eff.userId || (store && store.get('pilotActingUserId','')) || '',\n name: eff.name || '',\n perfil: eff.perfil || (store && store.get('perfil','')) || '',\n mode: mode,\n entryMode: mode,\n structureCode: eff.structureCode || (store && store.get('structureCode','')) || '',\n sectorCode: eff.sectorCode || '',\n rede: eff.rede || (store && store.get('rede','')) || '',\n gvName: eff.gvName || (store && store.get('gvName','')) || '',\n cycle: (store && store.get('cycle','')) || '',\n userAgent: ua,\n referrer: ref\n };\n}\n// On mount, AFTER identity resolves: reuse a stored sessionId (heartbeat) or FRESH login.\nasync function pilotTrackMount(d2){\n try{\n const store = d2.store('store');\n // Do not track the invalid-session screen (no identity resolved).\n if(store && store.get('pilotTokenInvalid', false)) return;\n const existing = pilotGetSid(d2);\n if(existing){\n d2.rush('pilotTrackAccess').invoke({ action:'heartbeat', sessionId: existing }).catch(()=>{});\n return;\n }\n const sid = pilotMakeSid();\n const payload = pilotIdentityPayload(d2);\n payload.action = 'login';\n payload.sessionId = sid;\n // Optimistically store first so a fast reload reuses it even if the call is in flight.\n pilotSetSid(d2, sid);\n const res = await d2.rush('pilotTrackAccess').invoke(payload);\n const b = (res && res.data) ? res.data : res;\n if(b && b.sessionId) pilotSetSid(d2, b.sessionId);\n }catch(e){ d2.log('pilotTrackMount error', e); }\n}\n// Section navigation → one view event per logical navigation (deduped by section+level).\nfunction pilotTrackView(d2, section, drillLevel, modeOverride){\n try{\n if(!section) return;\n const sid = pilotGetSid(d2);\n if(!sid) return;\n const key = section + '|' + (drillLevel||'') + '|' + (modeOverride||'');\n if(_pilotViewInFlight === key) return; // collapse repeated same-target navigations\n _pilotViewInFlight = key;\n const payload = { action:'view', sessionId: sid, section: section, drillLevel: drillLevel||'' };\n if(modeOverride) payload.mode = modeOverride; // event-level mode (e.g. 'impersonation')\n d2.rush('pilotTrackAccess').invoke(payload)\n .catch(()=>{})\n .then(()=>{ if(_pilotViewInFlight===key) _pilotViewInFlight = null; });\n }catch(e){ d2.log('pilotTrackView error', e); }\n}\n// Exit / logout / token-invalid → best-effort session-end (does not block).\nfunction pilotTrackEnd(d2){\n try{\n const sid = pilotGetSid(d2);\n if(!sid) return;\n d2.rush('pilotTrackAccess').invoke({ action:'session-end', sessionId: sid }).catch(()=>{});\n const ss = pilotSidStore();\n try{ if(ss) ss.removeItem(PILOT_SID_KEY); }catch(e){}\n const store = d2.store('store');\n if(store) store.set('pilotAccessSid','');\n }catch(e){ d2.log('pilotTrackEnd error', e); }\n}\nfunction mapLeaders(leaders){\n return (leaders || []).map(l => {\n const comp = (l.breakdown && l.breakdown.components) || l.components || null;\n const gainByRef = (comp && Array.isArray(comp.gainByRef)) ? comp.gainByRef : [];\n return {\n name: l.name || ('Grupo ' + l.structureCode),\n codigoGrupo: l.codigoGrupo != null ? l.codigoGrupo : l.structureCode,\n nivel: l.nivel,\n rede: l.rede,\n remuneracao: l.remuneracao,\n stats: l.stats || [],\n composition: comp,\n gainByRef: gainByRef,\n drivers: l.drivers || null\n };\n });\n}\n// Extract {composition, gainByRef} from a node carrying breakdown.components or components.\nfunction compOf(node){\n if(!node) return { composition:null, gainByRef:[] };\n const comp = (node.breakdown && node.breakdown.components) || node.components || null;\n const gainByRef = (comp && Array.isArray(comp.gainByRef)) ? comp.gainByRef : [];\n return { composition: comp, gainByRef: gainByRef };\n}\n// ─────────────────────────────────────────────────────────────────────────────\n// NEW LAYOUT — the prototype \"Painel\" boards (GV / GN / Líder), responsive.\n// ─────────────────────────────────────────────────────────────────────────────\nconst ASSET = 'https://natura-x-piloto.data2.media/file/';\nconst IMG = {\n logo: ASSET + 'H0P_N-7AQzQOg_VJMBWzV',\n logoW: ASSET + 'l8OGBbGu-q9PqWy_enKhS',\n natura: ASSET + 'UrhVLdPDEZCXToLgJDPW8',\n avon: ASSET + 'HqLhKqINaRUI9OSBjYGFh'\n};\nconst MEDAL = { prata:'XaupHTnpmugw-UyhnYvo2', ouro:'9hek6z8USd_zqLqsBAr3x', diamante:'L2wHYI7sUGWajYkS6vOG8', bronze:'3E3WozfBJQ-U3TeDeBPgN', cristal:'Yqrae4YObN99lRdeZ-lgz', 'diamante+':'okKvTBHVWJcsMxxoqZ7_3' };\nconst COL = { green:'#1B9A55', amber:'#E8590C', red:'#E5231B', none:'#C9BDB5' };\nconst TIP = { green:'Meta batida (100% ou mais)', amber:'Entre 60% e 99% da meta', red:'Abaixo de 60% da meta', none:'' };\nconst TINT = { green:'#E8F5EE', amber:'#FDF0E7', red:'#FDECEC', none:'#F5EEE9' };\nconst ICO = {\n people: 'M6 7a3 3 0 1 0 6 0a3 3 0 1 0-6 0M2 21v-2a5 5 0 0 1 5-5h4a5 5 0 0 1 5 5v2M17 7a3 3 0 0 1 0 6M22 21v-2a5 5 0 0 0-3-4.5',\n user: 'M8.5 8a3.5 3.5 0 1 0 7 0a3.5 3.5 0 1 0-7 0M4 21v-2a5 5 0 0 1 5-5h6a5 5 0 0 1 5 5v2',\n crown: 'M3 8l4 4 5-6 5 6 4-4v9H3zM3 20h18',\n swap: 'M12 4v16M7 8l-4 4 4 4M17 8l4 4-4 4',\n add: 'M5.5 8a3.5 3.5 0 1 0 7 0a3.5 3.5 0 1 0-7 0M2 20v-1.5a5 5 0 0 1 5-5h4M18 12v6M15 15h6',\n target: 'M3 12a9 9 0 1 0 18 0a9 9 0 1 0-18 0M7 12a5 5 0 1 0 10 0a5 5 0 1 0-10 0M10.5 12a1.5 1.5 0 1 0 3 0a1.5 1.5 0 1 0-3 0',\n painel: 'M3 3h7v9H3zM14 3h7v5h-7zM14 12h7v9h-7zM3 16h7v5H3z',\n vercomo: 'M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7S2 12 2 12zM9 12a3 3 0 1 0 6 0a3 3 0 1 0-6 0',\n simulador: 'M6 2h12a2 2 0 0 1 2 2v16a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2zM8 6h8M8 10h.01M12 10h.01M16 10h.01M8 14h.01M12 14h.01M16 14h.01M8 18h8',\n historico: 'M3 12a9 9 0 1 0 3-6.7L3 8M3 3v5h5M12 7v5l3 2'\n};\nconst OUT_D = 'M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4M16 17l5-5-5-5M21 12H9';\nconst MEDAL_D = 'M12 15a6 6 0 1 0 0-12 6 6 0 0 0 0 12zM8.2 13.9 7 22l5-3 5 3-1.2-8.1';\nconst ROLE = { gv:'Gerente de vendas', gn:'Gerente de negócio', lider:'Líder' };\nconst BADGE = { gv:'linear-gradient(135deg,#AE0025,#590013)', gn:'linear-gradient(135deg,#F69C00,#AE0025)', lider:'linear-gradient(135deg,#FF809B,#AE0025)' };\nconst PAGE_SIZE = 10;\nconst LOWER = ['de','da','do','dos','das','e'];\nconst LEGEND = '' + svgP('m9 6 6 6-6 6', 14, 'currentColor', 2) + ' '; }\nfunction lockChip(text){ return '' + svgP('M5 11h14v10H5zM8 11V7a4 4 0 0 1 8 0v4', 12, 'currentColor', 2.5) + escH(text) + ' '; }\nfunction partialChip(){ return '' + svgP('M12 3a9 9 0 1 0 0 18a9 9 0 1 0 0-18M12 7v5l3 2', 14, 'currentColor', 2) + 'Ciclo em andamento · valores parciais, sujeitos ao fechamento '; }\n// ── formatting ──\nfunction brl(v){ return 'R$ ' + Number(v || 0).toLocaleString('pt-BR', { minimumFractionDigits:2, maximumFractionDigits:2 }); }\nfunction brl0(v){ return 'R$ ' + Number(v || 0).toLocaleString('pt-BR', { maximumFractionDigits:2 }); }\nfunction n0(v){ return Math.round(Number(v) || 0).toLocaleString('pt-BR'); }\nfunction compact(v){\n v = Number(v) || 0;\n if(Math.abs(v) >= 1e6) return 'R$ ' + (v / 1e6).toLocaleString('pt-BR', { maximumFractionDigits:1 }) + ' mi';\n if(Math.abs(v) >= 1e3) return 'R$ ' + Math.round(v / 1e3).toLocaleString('pt-BR') + ' mil';\n return brl(v);\n}\nfunction pctNum(m){ return (Number(m || 0) * 100).toLocaleString('pt-BR', { maximumFractionDigits:1 }) + '%'; }\nfunction faixaPct(f){ f = Number(f || 0); return f > 1.5 ? f.toLocaleString('pt-BR', { maximumFractionDigits:1 }) + '%' : pctNum(f); }\nfunction nome(s){\n return String(s || '').toLowerCase().split(/\\s+/).filter(Boolean)\n .map(w => LOWER.indexOf(w) >= 0 ? w : w.split('-').map(p => p.charAt(0).toUpperCase() + p.slice(1)).join('-')).join(' ');\n}\nfunction nameParts(s){ return nome(s).split(' ').filter(w => w && LOWER.indexOf(w) < 0); }\nfunction initials(s){ const p = nameParts(s); if(!p.length) return ''; return ((p[0][0] || '') + (p.length > 1 ? p[p.length - 1][0] : '')).toUpperCase(); }\nfunction shortName(s){ const p = nameParts(s); return p.length > 1 ? p[0] + ' ' + p[p.length - 1] : (p[0] || ''); }\nfunction redeTxt(r){ return 'rede ' + String(r || '').replace('rede', ''); }\nfunction joinE(a){ return a.length <= 1 ? (a[0] || '') : a.slice(0, -1).join(', ') + ' e ' + a[a.length - 1]; }\n// ── stats (value / goal / atingimento / status come from the backend as-is) ──\nfunction isMoney(s){ return /fatur/i.test(String((s && s.label) || '')); }\nfunction hasGoal(s){ return !!s && s.goal != null && Number(s.goal) > 0 && s.atingimento != null; }\nfunction kindOf(s){\n const st = String((s && s.status) || '').toLowerCase();\n if(st === 'green') return 'green';\n if(st === 'amber' || st === 'yellow' || st === 'orange') return 'amber';\n if(st === 'red') return 'red';\n if(!hasGoal(s)) return 'none';\n const a = Number(s.atingimento);\n return a >= 100 ? 'green' : (a >= 60 ? 'amber' : 'red');\n}\nfunction sv(s){\n s = s || {};\n const fmt = isMoney(s) ? compact : n0;\n const g = hasGoal(s);\n const k = g ? kindOf(s) : 'none';\n return {\n label: s.label || '', k: k,\n pct: g ? Math.round(Number(s.atingimento)) + '%' : fmt(s.value),\n vg: g ? fmt(s.value) + ' de ' + fmt(s.goal) : '',\n dot: g ? COL[k] : '', tip: g ? TIP[k] : '',\n faltam: g ? (Number(s.value) < Number(s.goal) ? 'Faltam ' + fmt(Number(s.goal) - Number(s.value)) : 'Meta batida') : 'Sem meta'\n };\n}\nfunction dotHtml(x){ return '' + ci.opts.map(o => {\n const on = String(o.cycle) === ci.cur;\n return '' + escH(o.cycle) + ' ' + (o.isCurrent ? 'Atual ' : '') + '' + (o.closed ? 'Fechado' : 'Em andamento') + ' ' + (on ? check() : '') + '
' : '';\n return 'Ciclo ' + escH(lbl) + ' ' + caret(open) + '
';\n}\nfunction navItems(d2){\n const items = [{ go:'painel', label:'Painel', short:'Painel', d: ICO.painel, on: true }];\n if(!isTokenMode(d2) && !isImpersonating(d2)) items.push({ vercomo: true, label:'Ver como outra pessoa', short:'Ver como', d: ICO.vercomo });\n items.push({ go:'simulador', label:'Simulador', short:'Simulador', d: ICO.simulador });\n items.push({ go:'historico', label:'Histórico', short:'Histórico', d: ICO.historico });\n return items;\n}\nfunction navAttrs(n){ return (n.vercomo ? 'js-vercomo' : 'js-nav') + (n.on ? ' on' : '') + '\"' + (n.go ? ' data-go=\"' + n.go + '\"' : '') + (n.on ? ' aria-current=\"page\"' : ''); }\nfunction sideNavHtml(items){ return items.map(n => '' + svgP(n.d, 20, 'currentColor', 1.8) + '' + n.label + ' ' + n.short + ' ').join(''); }\nfunction tabsHtml(items){ return '' + items.map(n => '' + svgP(n.d, 20, 'currentColor', 1.8) + ' ' + n.short + ' '; }\nfunction userCard(d2){\n const a = resolveActingIdentity(d2) || resolveEffectiveIdentity(d2) || {};\n const nm = shortName(a.name || '') || (isTokenMode(d2) ? '' : 'Usuário de teste');\n return '' + svgP('M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2M8 7a4 4 0 1 0 8 0a4 4 0 1 0-8 0', 15, '#FFFFFF', 1.8) + ' ' + escH(nm) + ' ' + escH(ROLE[a.perfil] || (isTokenMode(d2) ? '' : 'Modo piloto')) + ' ' + svgP(OUT_D, 14, 'currentColor', 2) + '
';\n}\nfunction pilotBar(d2){\n if(isTokenMode(d2)) return '';\n const acting = resolveActingIdentity(d2);\n const users = Array.isArray(d2.state.switcherUsers) ? d2.state.switcherUsers : [];\n const cur = (acting && acting.userId) || '';\n const opts = users.map(u => '' + escH(nome(u.name)) + ' · ' + escH(perfilLabel(u.perfil)) + (u.structureCode ? ' ' + escH(u.structureCode) : '') + ' ').join('');\n return 'PILOTO Modo de teste: troque de usuário para ver o painel de cada perfil. Some quando o login definitivo entrar. Usuário de teste ' + (opts || '' + escH(nome((acting && acting.name) || '—')) + ' ') + '
';\n}\nfunction viewBanner(d2){\n if(!isImpersonating(d2)) return '';\n const eff = resolveEffectiveIdentity(d2); const acting = resolveActingIdentity(d2);\n if(!eff || !acting) return '';\n const scope = eff.perfil === 'gn' ? ' · setor ' + (eff.structureCode || eff.sectorCode || '') : (eff.perfil === 'lider' ? ' · grupo ' + (eff.structureCode || '') : '');\n return '' + svgP(ICO.vercomo, 18, 'currentColor', 2) + 'Você está vendo como ' + escH(nome(eff.name)) + ' (' + escH(perfilLabel(eff.perfil) + scope) + ') · acesso de ' + escH(nome(acting.name)) + ' (' + escH(perfilLabel(acting.perfil)) + ') Sair da visualização
' + HERO_DECO[view] + '
' + svgP(OUT_D, 16, 'currentColor', 2) + ' ' + inner + '
' + pilotBar(d2) + viewBanner(d2) + '
' + SIDE_DECO + '
' + sideNavHtml(items) + ' ' + userCard(d2) + '
' + hero + '' + body + '
' + tabsHtml(items) + (overlays || '') + '
' + i + ' ';\n return '';\n}\nfunction shortLabel(l){ return String(l || '').replace(/^Faturamento/i, 'Fatur.').replace(/^Volume de Pontos/i, 'Pontos').replace(/^Quantidade de /i, ''); }\nfunction tableHead(first, stats3){ return '' + first + ' ' + stats3.map(s => '' + escH(shortLabel(s.label)) + ' ').join('') + 'Remuneração
'; }\nfunction cellHtml(s){ const x = sv(s); return '' + dotHtml(x) + '' + escH(x.pct) + ' '; }\nfunction remCard(view, label, value, subHtml){\n return '' + svgP('M3 17l6-6 4 4 8-8M15 7h6v6', 20, '#FFFFFF', 1.8) + ' ' + label + ' ' + value + ' ' + subHtml + ' Como foi calculado
';\n}\nfunction totCard(view, label, stats, iapCodes){\n return '' + svgP('M3 3v18h18M7 15l4-4 3 3 5-6', 20, '#FFFFFF', 1.8) + ' ' + label + ' ' + (stats || []).map(s => {\n const x = sv(s);\n const iap = (iapCodes && iapCodes[s.indexCode]) ? '
IAP ' : '';\n return '
' + escH(x.label) + iap + ' ' + escH(x.vg) + ' ' + escH(x.pct) + ' ' + dotHtml(x) + '
';\n }).join('') + '
' + escH(x.label) + ' ' + (x.dot ? dotHtml(x) : '') + escH(x.pct) + '' + escH(x.vg) + ' ' + escH(x.faltam) + '
'; }\n// One indicator row (sectorItems / aceleradores / indicadores), expandable when it has related KPIs.\nfunction itemHtml(d2, it, kpiByCode){\n const main = Object.assign({}, it.main || {});\n if(!hasGoal(main) && kpiByCode && main.code != null && kpiByCode[main.code]){\n const k = kpiByCode[main.code];\n if(k.goal != null && Number(k.goal) > 0){\n if(main.value == null) main.value = k.value;\n main.goal = k.goal;\n main.atingimento = (k.atingimento != null) ? k.atingimento : (Number(main.value || 0) / Number(k.goal)) * 100;\n }\n }\n main.label = main.label || it.label;\n const x = sv(main);\n const g = hasGoal(main);\n const fmt = isMoney(main) ? compact : n0;\n const related = Array.isArray(it.related) ? it.related : [];\n const ref = String(it.ref || it.label || '');\n const open = !!(d2.state.openItems || {})[ref];\n const canOpen = related.length > 0;\n const id = iconId(it.icon || main.icon, it.label);\n const icoCor = id === 'crown' ? '#F69C00' : (x.k === 'none' ? '#757575' : COL[x.k]);\n const icoBg = id === 'crown' ? '#FFF4DD' : TINT[x.k];\n const iap = String(it.agrupamento || '') === 'indicador-iap' ? 'IAP ' : '';\n const isAmbas = /ambas/i.test(ref) || /ambas/i.test(it.label || '');\n let sub = '';\n if(!g && isAmbas && related.length) sub = related.map(r => brandWord(r) + ' ' + sv(r).pct).join(' · ') + ' · precisa de 100% nas duas';\n else if(!g) sub = 'Sem meta';\n const gain = Number(it.projectedGain || 0);\n let chip = '';\n if(it.isBonus) chip = (it.willReceive && gain > 0) ? 'Vai receber ' + escH(brl(gain)) + ' ' : 'Não atingido ';\n else if(gain > 0) chip = '' + svgP('m6 15 6-6 6 6', 16, 'currentColor', 2.6) + '+' + escH(brl(gain)) + ' ';\n const valBlock = (isAmbas && !g && related.length) ? '' : '' + escH(g ? fmt(main.value) : x.pct) + ' ' + (g ? ' / ' + escH(fmt(main.goal)) + ' ' : '') + '' + svgP(ICO[id], 24, icoCor, 2) + ' '\n + '' + escH(it.label || main.label) + iap + ' ' + bar + (sub ? '' + escH(sub) + ' ' : '') + '' + escH(x.pct) + ' ' : '')\n + valBlock + '' + chip + ' '\n + (canOpen ? '' + caret(open) + ' ' : '');\n const h = canOpen ? '' + head + ' ' : '' + head + '
';\n return '' + h + (open ? '
' + related.map(relHtml).join('') + '
' : '') + '
' + ico + ' ' + escH(x.label) + ' ' + escH(x.vg) + ' ' + escH(x.pct) + ' ' + dotHtml(x) + '
';\n}\nfunction modalHtml(o){\n const stats = (o.stats && o.stats.length) ? 'indicadores ' + o.stats.map(mStatRow).join('') + '
' : '';\n const rows = (o.comp || []).map(c => '' + escH(c.label) + ' ' + escH(c.value) + '
').join('');\n const comp = 'como a remuneração foi construída ' + (rows || '
Sem detalhamento para este ciclo.
') + '
Total ' + escH(o.total) + '
' + escH(o.link.label) + ' ' : '';\n return '' + escH(o.title) + ' ' + escH(o.sub) + '
' + xIcon() + ' ' + stats + comp + '
Fechar ' + link + '
' + escH(initials(t.name)) + ' ' + escH(nome(t.name)) + '' + escH(perfilLabel(t.perfil)) + ' ' + (t.perfil === 'gn' ? 'Setor ' + escH(t.structureCode || '') : 'Grupo ' + escH(t.structureCode || '') + ' · setor ' + escH(t.sectorCode || '')) + ' Carregando as pessoas que você pode ver…
'\n : (rows || '' + (q ? 'Ninguém encontrado com essa busca.' : 'Não há pessoas que você tenha permissão de ver.') + '
');\n return 'Ver como outra pessoa Somente as pessoas que você tem permissão de ver (regras e escopo).
' + xIcon() + ' ' + svgP('M11 4a7 7 0 1 0 0 14a7 7 0 1 0 0-14M20 20l-3.5-3.5', 18, '#757575', 2) + ' ' + (d2.state.impError ? '
' + escH(d2.state.impError) + '
' : '') + '
' + body + '
' + l + ' ';\n const hero = heroWrap('gv', '
Gerente de vendas ' + escH(nome(gh.gvName || '')) + ' ' + seg('rede1', 'Rede 1') + seg('rede2', 'Rede 2') + '
' + (ci.partial ? partialChip() : '') + '
' + escH(initials(g.gnName)) + ' ' + escH(nome(g.gnName)) + ' Setor ' + code + (g.leaderCount != null ? ' · ' + escH(g.leaderCount) + ' grupos' : '') + ' '\n + (g.stats || []).slice(0, 3).map(cellHtml).join('')\n + '
' + escH(brl(g.remuneracao)) + ' Detalhes ' + chev() + ' '\n + remCard('gv', 'Total da ' + redeTxt(rede), escH(brl(tot.remuneracao)), 'Ciclo ' + escH(cyc) + ' · soma das ' + gns.length + ' gerentes de negócio')\n + totCard('gv', 'Totalizador da ' + redeTxt(rede), tot.stats)\n + '
Suas gerentes de negócio ' + gns.length + ' '\n + tableHead('Gerente de negócio', head3) + (rows || '
Nenhuma gerente de negócio nesta rede.
') + pagerHtml(pg) + '
Gerência ' + escH(nome(gvName)) + ' ' + crumbSep() : '')\n + 'Setor ' + escH(sectorCode) + ' · ' + escH(redeTxt(rede)) + ' '\n + (effP === 'gn' ? lockChip('Você vê só o seu setor') : '');\n const hero = heroWrap('gn', '' + crumbs + ' ' + cycleDd(d2) + '
Gerente de negócio ' + escH(nome(gnName)) + ' ' + (ci.partial ? partialChip() : ''));\n // Sector indicators: sectorItems (or sectorKpis when the payload has no items), goals from sectorKpis.\n const sectorKpis = data.sectorKpis || [];\n const kpiByCode = {};\n sectorKpis.forEach(k => { kpiByCode[k.code] = k; });\n let items = data.sectorItems || [];\n if(!items.length && sectorKpis.length) items = sectorKpis.map(k => ({ ref: 'kpi-' + k.code, label: k.title, icon: k.icon, agrupamento: k.agrupamento, main: { code: k.code, label: k.title, brand: k.brand === 'total' ? null : k.brand, value: k.value, goal: k.goal, atingimento: k.atingimento }, related: [] }));\n const iapCodes = {};\n items.forEach(it => { if(String(it.agrupamento || '') === 'indicador-iap' && it.main && it.main.code != null) iapCodes[it.main.code] = true; });\n // Leaders: the group picker only filters this list; the row opens the leader.\n const allGroups = mapLeaders(leaders);\n const selectedGroup = (d2.state.selGroup != null) ? d2.state.selGroup : d2.shared.get('pilotSelectedGroup', '', { global:true });\n const filtered = selectedGroup ? allGroups.filter(g => String(g.codigoGrupo) === String(selectedGroup)) : allGroups;\n const pg = paginate(filtered, d2.state.page);\n const head3 = ((allGroups[0] && allGroups[0].stats) || tot.stats || []).slice(0, 3);\n const rows = pg.items.map(l => {\n const i = allGroups.indexOf(l);\n const code = escH(l.codigoGrupo);\n const drill = 'data-code=\"' + code + '\" data-setor=\"' + escH(sectorCode) + '\"';\n return '' + medalHtml(l.nivel, 40) + ' ' + escH(nome(l.name)) + ' Grupo ' + code + (l.nivel ? ' · ' + escH(String(l.nivel).toLowerCase()) : '') + ' '\n + (l.stats || []).slice(0, 3).map(cellHtml).join('')\n + '
' + escH(brl(l.remuneracao)) + ' Detalhes ' + chev() + ' Grupo ' + escH(gSel.label) + ' ' + caret(gOpen) + ''\n + (gOpen ? '
' + gList.map(g => {\n const on = g.code === gSel.code;\n return '' + escH(g.label) + ' ' + escH(g.sub) + ' ' + (on ? check() : '') + '
' : '') + '
'\n + remCard('gn', 'Remuneração do ciclo', escH(brl(remTot)), 'Ciclo ' + escH(cyc) + ' ' + (leadersSum != null ? ' · as líderes do setor somam ' + escH(brl(leadersSum)) : ''))\n + totCard('gn', 'Totalizador do setor', tot.stats, iapCodes) + ' '\n + (items.length ? 'Indicadores do setor ' + items.map(it => itemHtml(d2, it, kpiByCode)).join('') + '
Líderes do setor ' + allGroups.length + ' ' + groupDd + '
'\n + tableHead('Líder', head3) + (rows || '
Nenhuma líder encontrada.
') + pagerHtml(pg) + '
' + escH(label) + ' ' + (rule ? '' + escH(rule) + ' ' : '') + '' + escH(status) + '
'; }\n// Bônus do ciclo: payout rules when the payload brings drivers; otherwise the bonus accelerators.\nfunction liderBonusRows(data){\n const dr = data.drivers;\n if(dr && Array.isArray(dr.bonus) && dr.bonus.length){\n return dr.bonus.map(b => {\n const ok = b.willReceive && Number(b.amount) > 0;\n const rule = b.payoutType === 'per-unit' ? brl0(b.payoutValue) + (/migrad/i.test(b.label || '') ? ' por migrada' : ' por unidade')\n : brl0(b.payoutValue) + ((b.conditions || []).length ? ' · ' + b.conditions.map(c => c.kpi + ' em ' + c.threshold + '%').join(' e ') : '');\n return bonusRow(b.label, rule, ok ? 'Vai receber ' + brl(b.amount) : 'Não atingido', ok);\n }).join('');\n }\n return (data.aceleradores || []).filter(a => a.isBonus).map(a => {\n const gain = Number(a.projectedGain || 0);\n const ok = a.willReceive && gain > 0;\n const rel = (a.related || []).filter(hasGoal);\n const rule = rel.length ? rel.map(r => brandWord(r) + ' ' + sv(r).pct).join(' · ') : '';\n return bonusRow(a.label, rule, ok ? 'Vai receber ' + brl(gain) : 'Não atingido', ok);\n }).join('');\n}\nfunction liderView(d2, data){\n const store = d2.store('store');\n const lh = data.header || {};\n const ci = cycleInfo(d2);\n const cyc = lh.cycle || data.cycle || ci.cur;\n const grupo = lh.grupo || data.structureCode || '';\n const rede = lh.rede || data.rede || '';\n const nivel = lh.nivel || data.nivel || '';\n const effP = effectivePerfil(d2);\n const eff = resolveEffectiveIdentity(d2) || {};\n const gvName = eff.gvName || (store ? store.get('gvName','') : '');\n const setor = (store && store.get('pilotLiderSetor', '')) || '';\n const crumbs = (effP === 'gv' ? 'Gerência ' + escH(nome(gvName)) + ' ' + crumbSep() : '')\n + ((effP !== 'lider' && setor) ? 'Setor ' + escH(setor) + ' ' + crumbSep() : '')\n + 'Grupo ' + escH(grupo) + ' · ' + escH(redeTxt(rede)) + ' '\n + (effP === 'lider' ? lockChip('Você vê só o seu grupo') : '');\n const hero = heroWrap('lider', '' + crumbs + ' ' + cycleDd(d2) + '
' + medalHtml(nivel, 56) + '
Líder ' + escH(nome(lh.leaderName || lh.name || '')) + ' ' + (ci.partial ? partialChip() : ''));\n const acel = data.aceleradores || [];\n const indic = data.indicadores || [];\n const bonusRows = liderBonusRows(data);\n const body = ''\n + remCard('lider', 'Remuneração do ciclo', escH(brl(data.remuneracao)), 'Ciclo ' + escH(cyc) + ' · grupo ' + escH(grupo))\n + (bonusRows ? '' + svgP(MEDAL_D, 20, '#FFFFFF', 1.8) + ' Bônus do ciclo ' + bonusRows + '
' : '')\n + ' '\n + (acel.length ? '
Aceleradores de ganhos ' + acel.map(it => itemHtml(d2, it)).join('') + '
Indicadores de performance ' + indic.map(it => itemHtml(d2, it)).join('') + '
';\n return '' + line.repeat(5) + '
';\n}\nfunction errorHero(d2, view){\n const eff = resolveEffectiveIdentity(d2) || {};\n const own = effectivePerfil(d2) === view;\n const name = own ? (view === 'gv' ? (eff.gvName || eff.name) : eff.name) : '';\n return heroWrap(view, '
' + ROLE[view] + (name ? ' ' + escH(nome(name)) + ' ' : '') + ' ' + svgP('M2 2l20 20M5.8 5.8A7 7 0 0 0 6.5 19.5H17M20.6 15.6A4.5 4.5 0 0 0 17.5 9h-1.3A7 7 0 0 0 9.2 4.6', 30, '#E5231B', 1.8) + ' Não foi possível carregar o painel Pode ser uma instabilidade de conexão. Seus dados não foram alterados — tente de novo em instantes. ' + svgP('M21 12a9 9 0 1 1-3-6.7L21 8M21 3v5h-5', 16, 'currentColor', 2.2) + 'Tentar de novo ' + (d2.state.loadError ? 'Detalhe: ' + escH(d2.state.loadError) + ' ' : '') + '
';\n}\nfunction invalidHtml(reason){\n const pilot = reason === 'sector-not-in-pilot';\n return '' + HERO_DECO.gv + '
'\n + svgP(pilot ? 'M12 3a9 9 0 1 0 0 18a9 9 0 1 0 0-18M12 8v5M12 16h.01' : 'M5 11h14v10H5zM8 11V7a4 4 0 0 1 8 0v4', 28, '#AE0025', 2) + ' '\n + (pilot ? '
Painel exclusivo do piloto Este painel está disponível apenas para os setores que participam do piloto de remuneração.
Em caso de dúvida, procure sua liderança. '\n : '
Não conseguimos validar seu acesso O link de acesso pode ter expirado. Entre de novo pela Consultoria Natura para ver seus ganhos.
Se continuar acontecendo, fale com sua liderança. ')\n + '
![\"Natura](\"${t.media.lockup}\")
\n ${title}\n \n \n ${initials(user)}\n ![\"Natura](\"${esc(t.media.lockup)}\")
\n Simulador de Ganhos\n \n