AppHeader.vue

<template>
  <div class="h-6" />
  <el-menu
    :default-active="activeIndex2"
    class="el-menu-demo"
    mode="horizontal"
    background-color="#545c64"
    text-color="#fff"
    active-text-color="#ffd04b"
    @select="handleSelect"
  >

    <el-menu-item index="1" v-on:click="redirect('/login-main-page')">Main</el-menu-item>
    <el-menu-item index="2" v-on:click="redirect('/offer-page')">Offer Page</el-menu-item>
    <el-menu-item index="3" v-on:click="redirect('/wishlist-page')">Wish List</el-menu-item>
    <el-menu-item index="4" v-on:click="redirect('/flight')">Flight Ticket</el-menu-item>
  </el-menu>
</template>

<script lang="ts">
import { defineComponent } from "vue";
export default defineComponent({
  name: "LoginMainPage",
  methods: {
    redirect(url: string) {
      this.$router.push({path: url});
    }
  },
});
</script>

<style scoped></style>