<template>
  <div>
    <v-list class="side-box" color="primary">
      <template v-for="(item, index) in list">
        <template v-if="!item.children.length">
          <v-list-item
            :key="`${item.name}_${index}`"
            active-class="active"
            color="primary"
            :href="item.path"
            :to="item.path"
            rounded="shaped"
            :prepend-icon="item.icon"
            :title="getCurrentLocaleLang() === 'zh_CN' ? item.title : item.enName"
          >
          </v-list-item>
        </template>
        <v-list-group
          v-else
          color="primary"
          rounded="shaped"
          :key="`${item.path}_${item.title}`"
          :prepend-icon="item.icon"
        >
          <template v-slot:activator="{ props }">
            <v-list-item v-bind="props" :title="getCurrentLocaleLang() === 'zh_CN' ? item.title : item.enName"></v-list-item>
          </template>
          <v-list-item
            v-for="(val, i) in item.children"
            :key="i"
            color="primary"
            :href="val.path"
            style="padding-left: 40px;"
            :to="val.path"
            :title="getCurrentLocaleLang() === 'zh_CN' ? val.title : val.enName"
            rounded="shaped"
          ></v-list-item>
        </v-list-group>
      </template>
    </v-list>
  </div>
</template>

<script setup>
defineOptions({ name: 'enterprise-side'})
import { computed } from 'vue'
import { getCurrentLocaleLang } from '@/utils/lang.js'
import enterpriseRoute from '@/router/modules/components/recruit/enterprise'

const list = computed(() => {
  return getList(enterpriseRoute)
})

const getList = (arr, obj = []) => {
  // 是否为企业管理员
  const isAdmin = localStorage.getItem('isAdmin')

  arr.forEach(element => {
    if (element.show) return
    let data = {}
    data = {
      title: element?.meta?.title,
      enName: element?.meta?.enName,
      icon: element?.meta?.icon,
      name: element?.name,
      path: element?.path,
      children: []
    }
    if (element?.meta?.isAdmin) {
      data.isAdmin = true
    }
    if (element?.children) {
      getList(element.children, data.children)
    }
    obj.push(data)
  })
  if (isAdmin === 'false') {
    obj = obj.filter(e => !e.isAdmin)
    obj.map(e => {
      e.children = e.children.filter(val => !val.isAdmin)
    })
  }
  return obj
}

</script>

<style scoped lang="scss">
.side-box {
  width: 230px;
  height: 100%;
}
</style>
