Vuetify v-tabs and multiple router-links

How to work with vuetify v-tab / tabs when displaying it on router-view. I have a navigation-drawer that has router-links on it. And in one router-view I have tabs that also have another router-links on it and ofcourse , there's also a router-view in it. I just want to ask

this is my codr

<template>
    <v-app id="inspire">
        <v-navigation-drawer
        fixed
        :clipped="true"
        app
        v-model="drawer"
        >
        <v-list dense>
            <template v-for="item in items">
                <v-layout
                row
                v-if="item.heading"
                align-center
                :key="item.heading"
                >
                <v-flex xs6>
                    <v-subheader v-if="item.heading">
                        {{ item.heading }}
                    </v-subheader>
                </v-flex>
                <v-flex xs6 class="text-xs-center">
                    <a href="#!" class="body-2 black--text">EDIT</a>
                </v-flex>
            </v-layout>
            <v-list-group
            v-else-if="item.children"
            v-model="item.model"
            :key="item.text"
            :prepend-icon="item.model ? item.icon : item['icon-alt']"
            append-icon=""
            >
            <v-list-tile slot="activator">
                <v-list-tile-content>
                    <v-list-tile-title>
                        {{ item.text }}
                    </v-list-tile-title>
                </v-list-tile-content>
            </v-list-tile>
            <v-list-tile
            v-for="(child, i) in item.children"
            :key="i"
            @click=""
            >
            <v-list-tile-action v-if="child.icon">
                <v-icon>{{ child.icon }}</v-icon>
            </v-list-tile-action>
            <v-list-tile-content>
                <v-list-tile-title>
                    {{ child.text }}
                </v-list-tile-title>
            </v-list-tile-content>
        </v-list-tile>
    </v-list-group>
    <v-list-tile v-else router :to="item.link" :key="item.text">
        <v-list-tile-action>
            <v-icon>{{ item.icon }}</v-icon>
        </v-list-tile-action>
        <v-list-tile-content>
            <v-list-tile-title>
                {{ item.text }}
            </v-list-tile-title>
        </v-list-tile-content>
    </v-list-tile>
</template>
</v-list>
</v-navigation-drawer>
<v-toolbar
color="grey lighten-3"
light
app
:clipped-left="$vuetify.breakpoint.lgAndUp"
fixed
>
<v-toolbar-title style="width: 300px" class="ml-0 pl-3">
    <v-toolbar-side-icon @click.stop="drawer = !drawer"></v-toolbar-side-icon>
    <span class="hidden-xs-and-down">Application Name</span>
</v-toolbar-title>
<v-spacer></v-spacer>
<v-menu offset-y>
    <v-icon slot="activator">more_vert</v-icon>
    <v-list>
        <v-list-tile @click="logout"> 
            <v-list-tile-title>Logout</v-list-tile-title>
        </v-list-tile>
    </v-list>
</v-menu>
</v-toolbar>
<v-content>
    <!-- <v-container xs7 offset-xs2 offset-md2 offset-lg5> -->
        <!-- <v-layout> -->
            <!-- content goes here  -->
            <!-- <router-view class="mt-0.3"></router-view> -->
            <!-- end content  -->
        <!-- </v-layout>
        </v-container> -->
        <!-- <v-container grid-list-xl text-xs-center> -->
            <v-layout row wrap>

                <v-flex xs12 sm12 md12>

                    <router-view class="mt-0.3"></router-view>
            
                </v-flex>

            </v-layout>
            <!-- </v-container> -->
</v-content>
    <!-- <v-btn
      fab
      bottom
      right
      color="pink"
      dark
      fixed
      @click.stop="dialog = !dialog"
    >
      <v-icon>add</v-icon>
  </v-btn> -->
</v-app>
</template>

<script>
export default {
    data: () => ({

        // userId : authUser.id ,

        dialog: false,

        drawer: null,

        items: [
        { icon: 'home', text: 'Home', link: '/' },
        { icon: 'motorcycle', text: 'Travel Route', link: '/start-delivery' },
        { icon: 'people', text: 'Profile', link: '/account' },
        { icon: 'exit_to_app', text: 'Logout', link: '/logout' }
        ],

        tabItems : [
        {  text : 'Packages', routeName : 'packages' }, 
        { text :' Show Map' routeName : 'mapping'}
        
        ],
      // speed dial
      direction: 'top',
      fab: false,
      fling: false,
      hover: false,
      tabs: null,
      top: false,
      right: true,
      bottom: true,
      left: false,
      transition: 'slide-y-reverse-transition'
  }),
    props: {
        source: String
    },
    methods: {
        logout () {
            window.location.href = '/auth/logout'
        }
    }
}
</script>

TravelRoute.vue

<template>
    <v-tabs icons-and-text centered dark color="light-blue darken-3">

        <v-tabs-slider color="white"></v-tabs-slider>

        <v-tab>
            Delivery
            <v-icon>shopping_cart</v-icon>
        </v-tab>

        <v-tab to="{ name : 'parcelsToPack', params : { id : AuthUser.id } }">
            Parcels To Pack
            <v-icon>list</v-icon>
        </v-tab>

        <v-tab href="#tab-3">
            Show Map
            <v-icon>map</v-icon>
        </v-tab>
        


        <router-view></router-view>




    </v-tabs>

<!-- <v-card height="200px" style="overflow: hidden;">
    <v-card-text class="text-xs-center">
        <v-btn flat color="primary" @click.native="e31 = !e31">Toggle Nav</v-btn>
    </v-card-text>
    <v-bottom-nav :value="e31" :active.sync="e3" absolute color="transparent">
        <v-btn flat color="teal">
            <span>Recents</span>
            <v-icon>history</v-icon>
        </v-btn>
        <v-btn flat color="teal">
            <span>Favorites</span>
            <v-icon>favorite</v-icon>
        </v-btn>
        <v-btn flat color="teal">
            <span>Nearby</span>
            <v-icon>place</v-icon>
        </v-btn>
    </v-bottom-nav>
</v-card> -->
</template>

<script>
export default {

    data () {
        return {
            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
            e3: 1,
            e31: true

        }
    }
}
</script>

<style scoped>
</style>

I can't understand well. Please guide me on the router-view part. I have multiple router-views.