[1448] with nested to nested route , the second is invalid

my route pages/ -|user-admin/ ----|main/ ------|settings/ ------| index.vue // ------| settings.vue // <-- nested level two --------| user-info.vue // not include parent(settings.vue)'s other layout ----| index.vue // <-- redirect to /user-admin/main ----| main.vue // <-- nested level one

here is level one:

<template lang="pug">
  nuxt-child
</template>
<script>
  export default {
    layout: 'user-admin'
  }
</script>

and level two:

<template lang="pug">
  .ua-category
    affix(:list="menu", category="main")
    .ua-category-content.ua-content.ua-content-hasCarbon(:class="{'category-content-hidden': visible}")
      div hello
      nuxt-child
</template>
<script>
  import { uaPrefix } from '~/store/module-prefixs'
  import Affix from '~/components/user-admin/Affix.vue'

  export default {
    layout: 'user-admin',
    computed: {
      visible () { return this.$store.state[uaPrefix].visibleAffix },
      menu () { return this.$store.state[uaPrefix].menus.main }
    },
    components: {
      Affix
    }
  }
</script>

the problem is when i access: /user-admin/main/settings/user-info no Affix.vue components included and access: /user-admin/main/settings 404 return