<template>
  <a-layout-header>
    <!-- <BackTop/> -->
    <div style="position: absolute;right: 1rem;top: 5rem;">
      <div style="background: #c2c2c2;margin-bottom: 2rem;padding: 0.5rem;width: 4rem;font-size:3rem;">
        <ArrowUpOutlined/>
      </div>
      <div style="background: #1c84c6;color:#FFF;font-size:1.5rem;padding: 0.5rem;width: 4rem;line-height: 2.1rem;">
        意见反馈
      </div>
    </div>
    <span class="topTitle">管理系统</span>
    <span class="topRight">
      <a-dropdown>
        <span class="ant-dropdown-link topRightMenu" @click.prevent>
          {{ userStore?.getUserInfo?.realname }}
          <DownOutlined/>
        </span>
        <template #overlay>
          <a-menu>
            <a-menu-item>
              <!-- <a href="javascript:;">后台管理</a> -->
              <RouterLink to="/dashboard/analysis">后台管理</RouterLink>
            </a-menu-item>
            <a-menu-item>
              <a href="javascript:void(0);" @click="userStore?.confirmLoginOut();">安全退出</a>
            </a-menu-item>
          </a-menu>
        </template>
      </a-dropdown>
    </span>
  </a-layout-header>

</template>
<script setup lang="ts">
  import { DownOutlined, ArrowUpOutlined } from '@ant-design/icons-vue';
  import { useUserStore } from '/@/store/modules/user';
  //用户相关
  const userStore = useUserStore();

</script>
<style lang="less" scoped>
#siteMain {
  #maxSite {
    .topTitle {
      font-size: 1.5rem;
    }
    .topRight {
      float: right;
      .topRightMenu {
        font-size: 1.1rem;
      }
    }
    .footerRight {
      float: right;
    }
  }
}
</style>