<template>
  <header class="layout-header wow animate__animated animate__fadeInDownBig" data-wow-duration=".3s">
    LayoutHeader
    <el-button @click="handleLogout">退出登录</el-button>
  </header>
</template>

<script lang="ts" setup>
import { ElMessageBox } from 'element-plus/es'
import { useUserStore } from '@/store/user'
const userStore = useUserStore()

const handleLogout = () => {
  ElMessageBox.confirm(
    '是否退出登录？',
    '退出登录',
    {
      confirmButtonText: '退出',
      cancelButtonText: '再想想',
      type: 'warning'
    }
  ).then(() => {
    userStore.logoutAction()
  })
}
</script>

<style scoped lang="scss">
  .layout-header{
    height: 60px;
    background: black;
  }
</style>
