<script setup>
import MenuDefault from "@/components/menus/MenuDefault.vue";
import {ref, watch} from "vue";
import {SessionUser} from "@/components/session/token/SessionUser.vue";

// Define the isLoaded function
// This is here, because the departments need to be loaded before the menu is shown,
// otherwise the menu will look for a department with an id not defined.
const isLoaded = ref(false);

// Load the departments
const departments = ref([]);
const loadDepartments = () => {
  SessionUser.objects.departments.get.all().then((departments) => {
    const options = [];
    departments.forEach((department) => {
      options.push({
        label: department.name,
        value: department.id,
        icon: 'fas fa-building',
        children: [],
        hidden: !SessionUser.canAccessDepartment(department.id)
      });
    });
    console.log(departments);
    menu_items.value[1].options = options;
    isLoaded.value = true;
  }).catch((error) => {
    console.error(error);
  });
}

loadDepartments();

// Check if the department ID is undefined
const isDepartmentIdUndefined = () => {
  return SessionUser.functions.getDepartmentIdFromUrl() === undefined;
}

// Check for changes in the users permissions
watch(SessionUser.permissions, () => {
  loadDepartments();
});


const menu_items = ref([
  {
    name: 'Overblik',
    route: '/admin',
    icon: 'fas fa-tachometer-alt',
    children: [],
    permissions: [
        'admin'
    ]
  },
  {
    name: 'Vælg afdeling',
    options: [
      {
        label: 'Afdeling 1',
        value: 1,
        icon: 'fas fa-building',
        children: []
      },
      {
        label: 'Afdeling 2',
        value: 2,
        icon: 'fas fa-building',
        children: []
      },
      {
        label: 'Afdeling 3',
        value: 3,
        icon: 'fas fa-building',
        children: []
      }
    ],
    selected: SessionUser.functions.getDepartmentIdFromUrl() !== null ? parseInt(SessionUser.functions.getDepartmentIdFromUrl()) : null,
    onSelect: async (value) => {
      selectDepartment(value);
    }
  },
  {
    name: 'Kassesystem',
    route: '/admin/' + SessionUser.functions.getDepartmentIdFromUrl() + '/modules/pos',
    permissions: [
        'add_order'
    ],
    icon: 'fas fa-cogs',
    children: [
      {
        name: 'Opret ny',
        route: '/admin/' + SessionUser.functions.getDepartmentIdFromUrl() + '/modules/pos',
        icon: 'fas fa-plus',
        children: [],
        hidden: (SessionUser.functions.getDepartmentIdFromUrl() === undefined),
        permissions: [
            'add_order'
        ]
      },
      {
        name: 'Transaktioner',
        route: '/admin/' + SessionUser.functions.getDepartmentIdFromUrl() + '/modules/pos/orders',
        icon: 'fas fa-exchange-alt',
        children: [],
        hidden: (SessionUser.functions.getDepartmentIdFromUrl() === undefined),
        permissions: [
            'list_orders'
        ],
      },
    ],
    hidden: (SessionUser.functions.getDepartmentIdFromUrl() === undefined)
  },
  {
    name: 'Bookinger',
    route: '/admin/' + SessionUser.functions.getDepartmentIdFromUrl() + '/modules/bookings',
    icon: 'fas fa-exchange-alt',
    children: [],
    hidden: isDepartmentIdUndefined,
    permissions: [
        'list_bookings'
    ]
  },
  {
    name: 'Tidsbooking',
    route: '/admin/' + SessionUser.functions.getDepartmentIdFromUrl() + '/modules/time-bookings',
    icon: 'fas fa-exchange-alt',
    children: [
      {
        name: 'Bookinger',
        route: '/admin/' + SessionUser.functions.getDepartmentIdFromUrl() + '/modules/time-bookings',
        icon: 'fas fa-exchange-alt',
        children: [],
        hidden: isDepartmentIdUndefined,
        permissions: [
            'department_timebookings_entries_get'
        ]
      },
      {
        name: 'Åbningstider',
        route: '/admin/' + SessionUser.functions.getDepartmentIdFromUrl() + '/modules/time-bookings/opening-hours',
        icon: 'fas fa-exchange-alt',
        children: [],
        hidden: isDepartmentIdUndefined,
        permissions: [
            'department_timebookings_opening_hours_get'
        ]
      },
      {
        name: 'Vasketyper',
        route: '/admin/' + SessionUser.functions.getDepartmentIdFromUrl() + '/modules/time-bookings/types',
        icon: 'fas fa-exchange-alt',
        children: [],
        hidden: isDepartmentIdUndefined,
        permissions: [
            'department_timebookings_opening_hours_get'
        ]
      },
      {
        name: 'Opret ny',
        route: '/admin/' + SessionUser.functions.getDepartmentIdFromUrl() + '/modules/time-bookings/new',
        icon: 'fas fa-exchange-alt',
        children: [],
        hidden: isDepartmentIdUndefined,
        permissions: [
          'department_timebookings_create'
        ]
      },
    ],
    hidden: isDepartmentIdUndefined,
    permissions: [
      'department_timebookings_entries_get'
    ]
  },
  {
    name: 'Dagsopgørelse',
    route: '/admin/' + SessionUser.functions.getDepartmentIdFromUrl() + '/modules/daily-report',
    icon: 'fas fa-exchange-alt',
    children: [],
    hidden: (SessionUser.functions.getDepartmentIdFromUrl() === undefined),
    permissions: [
        'list_department_daily_reports'
    ]
  },
  {
    name: 'Notifikationer',
    route: '/admin/' + SessionUser.functions.getDepartmentIdFromUrl() + '/modules/notifications',
    icon: 'fas fa-bell',
    children: [],
    hidden: (SessionUser.functions.getDepartmentIdFromUrl() === undefined),
    permissions: [
      'department_notification_sms_get'
    ]
  },
  {
    name: 'Intranet ( udvikles )',
    route: '/admin/' + SessionUser.functions.getDepartmentIdFromUrl() + '/modules/daily-report',
    icon: 'fas fa-exchange-alt',
    children: [],
    hidden: (SessionUser.functions.getDepartmentIdFromUrl() === undefined),
    permissions: [
        'list_department_intranet_reports'
    ]
  }
]);

const selectDepartment = (department) => {
  // Get the current path (After /admin/:department_id)
  const currentPath = window.location.pathname.split('/').slice(3).join('/');
  console.log('Selected department: ' + department);
  menu_items.value[1].selected = department;
  // Hide the menu
  menu_items.value[1].isExpanded = false;
  // Redirect to the department
  SessionUser.functions.redirectTo.department(department, currentPath);
}

</script>

<template>
  <MenuDefault
      v-if="isLoaded"
      :menu_items="menu_items"
      :show_icons="false"
  />
</template>

<style scoped>

</style>