index.vue 2.4 KB
<template>
  <a-layout style="height: 100%">
    <a-layout-header style="display: flex">
      <div class="title">
        <span>{{ title }}</span>
      </div>
      <div style="flex: 1"></div>
      <a-flex gap="large" align="center">
        <a-button type="link" @click="themeStore.isCompact=!themeStore.isCompact">
          <template #icon>
            <l-icon :type="themeStore.isCompact?'full-screen-two':'off-screen-two'"/>
          </template>
        </a-button>
        <a-button type="link" @click="themeStore.isDark=!themeStore.isDark">
          <template #icon>
            <l-icon :type="themeStore.isDark?'sun-one':'moon'"/>
          </template>
        </a-button>

        <a-dropdown>
          <div style="cursor: pointer;display: flex;align-items: center">
            <!--            <a-avatar></a-avatar>-->
            <!--            <div style="margin-left: 10px"> {{ userStore.user?.fullName }}</div>-->
          </div>

          <!--          <template #overlay>
                      <a-menu>
                        <a-menu-item @click="onLogout" key="0">
                          退出登录
                        </a-menu-item>
                      </a-menu>
                    </template>-->
        </a-dropdown>

      </a-flex>
    </a-layout-header>
    <a-layout>
      <a-layout-sider>
        <a-menu mode="inline" @click="(item:any)=>router.push(item.key)" v-model:selectedKeys="current"
                :items="menuList" v-model:open-keys="openKeys"></a-menu>
      </a-layout-sider>
      <a-layout-content style="flex: 1;overflow-y: auto;width: 100%;overflow-x: hidden;padding: 10px">
        <router-view/>
      </a-layout-content>
    </a-layout>

  </a-layout>
</template>

<script setup lang="ts">
import {useThemeStore} from "@/store/useThemeStore.ts";
import {ref} from "vue";
import router from "@/router";
import LIcon from "@/components/l-Icon/l-Icon.vue";
import {useRoute} from "vue-router";
import useRequest from "@/hooks/useRequest.ts";

const title = import.meta.env.VITE_APP_TITLE;


const openKeys = ref(['GL'])

const menuList = [{
  label: '管理',
  key: 'GL',
  children: [{
    title: 'air_route',
    label: '航线管理',
    key: 'air_route',
  },]
},]
const route = useRoute()
const themeStore = useThemeStore()
const current = ref([route.name])
</script>

<style scoped>
.title {
  font-weight: bold;
  font-size: x-large;
}
</style>