<template>
  <a-layout-header class="header">
    <container>
      <div class="header-actions">
        <a
          @click="$root.global.settings.siderCollapsed = !$root.global.settings.siderCollapsed"
          class="header-action mr-md"
        >
          <a-icon type="menu" />
        </a>
        <Logo />
        <search :menus="nav.content" />
      </div>
      <div class="header-actions">
        <a @click="$emit('reload')" class="header-action">
          <a-icon type="reload" />
        </a>
        <a class="header-action">
          <a-badge count="5">
            <a-icon type="bell" />
          </a-badge>
        </a>
        <User />
      </div>
    </container>
  </a-layout-header>
</template>
<script>
import Logo from '../logo';

import User from './user';
import Search from './search';

export default {
  components: {
    Logo,

    User,
    Search,
  },
  props: {
    nav: {
      default() {
        return {
          content: [],
        };
      },
      type: Object,
    },
  },
};
</script>