MelissaMenu: categoria abre alinhada com a secao ativa
Antes o menu sempre abria em "Agenda e Pacientes" (CATEGORIAS[0]). Agora resolve qual categoria contem o sub-item secaoAtiva e abre direto nela: ex. estando em /melissa/financeiro-lancamentos, o menu abre ja em "Financeiro". Sem secaoAtiva (resumo), mantem default agenda-pacientes. Watcher em props.secaoAtiva sincroniza o destaque se o user troca de sessao com o menu aberto. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -18,7 +18,7 @@
|
||||
* - select(key) — sub-item clicado (parent decide navegação)
|
||||
* - close — clique fora ou X
|
||||
*/
|
||||
import { ref, computed } from 'vue';
|
||||
import { ref, computed, watch } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { sessionUser, sessionRole } from '@/app/session';
|
||||
import { supabase } from '@/lib/supabase/client';
|
||||
@@ -27,7 +27,7 @@ import { useLayout } from '@/layout/composables/layout';
|
||||
import { useUserSettingsPersistence } from '@/composables/useUserSettingsPersistence';
|
||||
import { primaryColors, surfaces, presetOptions, applyThemeEngine } from '@/theme/theme.options';
|
||||
|
||||
defineProps({
|
||||
const props = defineProps({
|
||||
secaoAtiva: { type: String, default: null }
|
||||
});
|
||||
|
||||
@@ -173,9 +173,32 @@ const CATEGORIAS = [
|
||||
];
|
||||
|
||||
// ── Estado ──────────────────────────────────────────────────────
|
||||
const selectedKey = ref(CATEGORIAS[0].key); // primeira categoria por default
|
||||
// Resolve a categoria que contem o sub-item ativo. Se nenhum casa,
|
||||
// volta pra primeira (agenda-pacientes) — comportamento default.
|
||||
function categoryKeyFor(itemKey) {
|
||||
if (!itemKey) return null;
|
||||
for (const cat of CATEGORIAS) {
|
||||
for (const group of cat.groups) {
|
||||
if (group.items.some((it) => it.key === itemKey)) return cat.key;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
const selectedKey = ref(categoryKeyFor(props.secaoAtiva) || CATEGORIAS[0].key);
|
||||
const copiado = ref(false);
|
||||
|
||||
// Sincroniza o destaque com a sessao ativa — se o user troca de
|
||||
// "Lancamentos" pra "Agenda" sem fechar o menu, o selecionado
|
||||
// acompanha a sessao corrente.
|
||||
watch(
|
||||
() => props.secaoAtiva,
|
||||
(val) => {
|
||||
const cat = categoryKeyFor(val);
|
||||
if (cat) selectedKey.value = cat;
|
||||
}
|
||||
);
|
||||
|
||||
// Drill-down mobile: false = lista de categorias, true = sub-itens da
|
||||
// categoria escolhida. CSS controla visibilidade via translateX em <lg.
|
||||
// Em desktop o flag é ignorado (ambas colunas sempre visíveis).
|
||||
|
||||
Reference in New Issue
Block a user