dmz/src/layouts/navbar.vue

<script setup lang="ts">
import type { NavbarItem } from '/@src/components/layouts/navbar/navbar.types'

const pageTitle = useVueroContext<string>('page-title')

const links = ref<NavbarItem[]>([
  {
    id: 'contract',
    type: 'link',
    to: '/navbar/layouts/contract-list',
    label: '가격조사',
    icon: 'lucide:file-pen-line',
  },
  {
    id: 'bid',
    type: 'link',
    to: '/navbar/layouts/est-list',
    label: '신청내역',
    icon: 'lucide:badge-dollar-sign',
  },
])
</script>

<template>
  <NavbarLayout size="large" :links>
    <!-- Propagating the context to the default slot -->
    <template #default="context">
      <slot v-bind="context" />
    </template>

    <template #logo>
      <RouterLink
        to="/navbar/dashboards"
      >
        <AnimatedLogo
          width="38px"
          height="38px"
        />
      </RouterLink>
    </template>

    <template #navbar-title>
      <h1 class="title is-6">
        {{ pageTitle }}
      </h1>
    </template>

    <template #title-mobile>
      <div class="is-flex is-align-items-center">
        <h1 class="title is-4">
          {{ pageTitle }}
        </h1>
      </div>
    </template>

    <template #toolbar>
<!--      <LayoutSwitcher class="is-hidden-mobile" />-->
<!--      <ToolbarNotification />-->
<!--      <ToolbarActivity />-->
      <ToolbarThemeToggle />
<!--      <ToolbarLanguage />-->
      <ToolbarUserProfile right class="ml-2 is-hidden-mobile" />
    </template>

    <template #toolbar-mobile>
      <ToolbarUserProfile right />
    </template>

    <template #extra>
      <ClientOnly>
        <VReloadPrompt app-name="Vuero" />
      </ClientOnly>
    </template>
  </NavbarLayout>
</template>