<!--
 * app.[id].vue
 * Copyright (C) 2024 veypi <i@veypi.com>
 * 2024-06-07 17:46
 * Distributed under terms of the MIT license.
 -->
<template>
  <div>
    <div class="flex justify-start items-center gap-4 mb-8">
      <img class="w-12 h-12 rounded-full" :src="core.icon">
      <div class="text-3xl">
        {{ core.name }}
      </div>
    </div>
    <NuxtPage keepalive :page-key="route => route.fullPath"></NuxtPage>
  </div>
</template>

<script lang="ts" setup>
import type { models } from '#imports';
import msg from '@veypi/msg';

definePageMeta({
  middleware: ['auth']
})

const route = useRoute()
const router = useRouter()

let menu = useMenuStore()
let core = ref({} as models.App)
provide('app', core)

const set_menu = () => {
  let p = '/app/' + core.value.id
  menu.set([
    { ico: 'home', name: core.value.name ? '!' + core.value.name : '', path: p },
    { ico: 'user', name: 'menu.user', path: p + '/user' },
    { ico: 'team', name: 'menu.auth', path: p + '/auth' },
    { ico: 'setting', name: 'menu.setting', path: p + '/cfg' },
  ])
}

onMounted(() => {
  api.app.Get(route.params.id as string).then((e) => {
    core.value = e
    set_menu()
  }).catch(e => {
    msg.Warn('获取数据失败: ' + e)
    router.push('/')
  })
})


onActivated(() => {
  set_menu()
})
onBeforeRouteLeave(() => {
  menu.default()
})

</script>

<style scoped></style>
