import { computed } from 'vue'
import { useRoute, useRouter } from 'vue-router'

import { icons } from '../data/icons.js'

export const appViews = ['overview', 'workbench', 'requests', 'approval', 'chat', 'policies', 'audit', 'employees', 'settings']

export const navItems = [
  {
    id: 'overview',
    label: '总览',
    navHint: '查看系统总览与关键指标',
    icon: icons.dashboard,
    title: '财务运营总览',
    desc: '聚合差旅申请、审批效率、风险信号与 SLA 表现。'
  },
  {
    id: 'workbench',
    label: '个人工作台',
    navHint: '集中处理个人待办',
    icon: icons.workspace,
    title: '个人工作台',
    desc: '聚焦当前待办、快捷操作与助手入口。'
  },
  {
    id: 'requests',
    label: '申请单',
    navHint: '查看和管理申请单',
    icon: icons.list,
    title: '差旅申请与单据',
    desc: '集中查看申请单状态、处理进度和风险提示。'
  },
  {
    id: 'approval',
    label: '审批中心',
    navHint: '处理审批任务',
    icon: icons.approval,
    title: '审批中心',
    desc: '按优先级处理待审批事项，控制时效与风险。'
  },
  {
    id: 'chat',
    label: 'AI 助手',
    navHint: '进入智能问答',
    icon: icons.message,
    title: 'AI 财务助手',
    desc: '围绕制度、票据、审批和差旅场景进行快速问答。'
  },
  {
    id: 'policies',
    label: '制度知识',
    navHint: '查看制度与知识库',
    icon: icons.file,
    title: '制度与知识库',
    desc: '统一管理制度文档、知识问答和搜索入口。'
  },
  {
    id: 'audit',
    label: '任务规则中心',
    navHint: '查看和管理任务规则配置',
    icon: icons.skill,
    title: '任务规则中心',
    desc: '集中管理规则文件、外部 MCP 服务与定时任务调度。'
  },
  {
    id: 'employees',
    label: '员工管理',
    navHint: '维护员工与组织信息',
    icon: icons.users,
    title: '员工与组织管理',
    desc: '维护员工账号、组织结构与角色权限。'
  },
  {
    id: 'settings',
    label: '系统设置',
    navHint: '维护企业品牌、管理员安全与系统配置',
    icon: icons.settings,
    title: '系统设置中心',
    desc: '集中配置公司名称、管理员账号安全、模型接入、日志策略与邮箱通知。'
  }
]

const viewRouteNames = {
  overview: 'app-overview',
  workbench: 'app-workbench',
  requests: 'app-requests',
  approval: 'app-approval',
  chat: 'app-chat',
  policies: 'app-policies',
  audit: 'app-audit',
  employees: 'app-employees',
  settings: 'app-settings'
}

export function useNavigation() {
  const route = useRoute()
  const router = useRouter()

  const activeView = computed({
    get() {
      return route.meta.appView || 'overview'
    },
    set(view) {
      setView(view)
    }
  })

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

  function setView(view) {
    const targetName = viewRouteNames[view] || viewRouteNames.overview

    if (route.name === targetName) {
      return
    }

    router.push({ name: targetName })
  }

  return { activeView, currentView, setView, navItems }
}