<script lang="ts" setup>
import type {NavigationMenuItem} from '@nuxt/ui'

const route = useRoute()

const items = computed<NavigationMenuItem[]>(() => [
  {
    label: '首页',
    to: '/',

  },
  {
    label: '共享解决方案',
    active: route.path.startsWith('/sharedSolutions'),
    children: [
      {
        label: '共享单车',
        icon: 'i-lucide-bike',
        description: '一种新型环保共享经济，最大化的利用了公共道路通过率',
        to: '/sharedSolutions/bike',
      },
      {
        label: '景区共享电动车',
        icon: 'i-lucide-map-pin',
        description: '有助于缓解交通堵塞，以及公路的磨损，减少空气污染，降低对能量的依赖性',
        to: '/sharedSolutions/scenicEbike',
      },
      {
        label: '共享滑板车',
        icon: 'i-lucide-scooter',
        description: '新的共享出行方式，轻便省力',
        to: '/sharedSolutions/scooter',
      },
      {
        label: '共享陪护床',
        icon: 'i-lucide-bed',
        description: '立足医院民生需求而诞生，解决医患家属的休息问题',
        to: '/sharedSolutions/bed',
      },
      {
        label: '共享电动车',
        icon: 'i-lucide-car',
        description: '通过扫码开锁，循环共享',
        to: '/sharedSolutions/eBike',
      },
      {
        label: '共享充电宝',
        icon: 'i-lucide-battery',
        description: '企业提供的充电租赁设备，用户扫码取出后即可使用，用完后就近归还',
        to: '/sharedSolutions/powerbank',
      }
    ]
  },
  {
    label: '行业解决方案',
    active: route.path.startsWith('/industrySolutions'),
    children: [
      {
        label: '智能电动车',
        icon: 'i-lucide-file-text',
        description: '打造智能电动车时代方便用户的出行，让骑车出行便捷',
        to: '/industrySolutions/ElectCar',
      }, {
        label: '共享电动车',
        icon: 'i-lucide-file-text',
        description: '通过扫码开锁，循环共享',
        to: '/sharedSolutions/eBike',
      }

    ]
  },
  {
    label: '软件应用开发',
    active: route.path.startsWith('/softwareDevelopment'),
    children: [
      {
        label: '微信开发',
        icon: 'i-lucide-message-circle',
        description: '定制开发可使您的微信公众平台更突出价值',
        to: '/softwareDevelopment/wechat',
      },
      {
        label: 'APP开发',
        icon: 'i-lucide-smartphone',
        description: '小程序是一种新的开放能力，可以在微信内被便捷地获取和传播，同时具有出色的使用体验',
        to: '/softwareDevelopment/app',
      },
      {
        label: '小程序开发',
        icon: 'i-lucide-zap',
        description: '提供高效的APP开发、手机APP制作与APP管理等服务',
        to: '/softwareDevelopment/miniprogram',
      }
    ]
  },
  {
    label: '物联网解决方案',
    active: route.path.startsWith('/IoTSolutions'),
    children: [
      {
        label: '物联网应用定制',
        icon: 'i-lucide-settings',
        description: '规范化的开发流程，实现产品快速落地',
        to: '/IoTSolutions/applicationCustomization',
      },
      {
        label: '物联网智能硬件',
        icon: 'i-lucide-cpu',
        description: '支持定制，满足各类硬件场景需求',
        to: '/IoTSolutions/smartHardware',
      },
      {
        label: '物联网IoT云平台',
        icon: 'i-lucide-cloud',
        description: '灵活、可靠、安全，有效降低成本',
        to: '/IoTSolutions/iotCloudPlatform',
      }
    ]
  },
  {
    label: '关于创特',
    to: '/about',

  }, {
    label: '后台管理',
    to: 'https://ele.ccttiot.com/login',
    target: '_blank'
  }

])
</script>

<template>
  <UHeader class="min-w-full">
    <template #title>
      <IndexLogo class="h-6 w-auto"/>
    </template>

    <UNavigationMenu :items="items" color="primary"/>

    <template #right>
      <ColorModeButton/>
    </template>
    <template #body>
      <div class="px-4 py-2">
        <UNavigationMenu
            :items="items"
            class="-mx-2.5"
            color="primary"
            orientation="vertical"
        />
      </div>
    </template>
  </UHeader>
</template>
