import { computed, ref } from 'vue'
import { icons } from '../data/icons.js'

export const navItems = [
  {
    id: 'overview',
    label: '总览',
    navHint: '运营指标与趋势',
    icon: icons.dashboard,
    title: '企业报销智能运营台',
    desc: '面向财务共享中心的审批、风控、SLA与自动化运营看板'
  },
  {
    id: 'chat',
    label: '审批中心',
    navHint: 'AI 助手与单据处理',
    icon: icons.message,
    title: '单据管理中心',
    desc: '管理出差申请、报销单据，AI 辅助发起申请与智能审核。'
  },
  {
    id: 'requests',
    label: '报销单',
    navHint: '待审队列与风险处理',
    icon: icons.list,
    title: '报销申请队列',
    desc: '按风险、补件状态和 AI 建议处理待审单据。'
  },
  {
    id: 'policies',
    label: '政策规则',
    navHint: '制度与校验规则',
    icon: icons.file,
    title: '政策规则中心',
    desc: '维护差旅、招待、采购和发票校验规则。'
  },
  {
    id: 'audit',
    label: '审计追踪',
    navHint: '关键动作与日志',
    icon: icons.audit,
    title: '审计追踪',
    desc: '查看关键审批动作、AI 建议和制度命中记录。'
  }
]

export function useNavigation() {
  const activeView = ref('overview')

  const currentView = computed(
    () => navItems.find((item) => item.id === activeView.value) ?? navItems[0]
  )

  function setView(view) {
    activeView.value = view
  }

  return { activeView, currentView, setView, navItems }
}