import React from 'react';
import './QuickNav.css';

const DEFAULT_ITEMS = [
  { icon: '📊', label: '数据看板' },
  { icon: '👥', label: '用户管理' },
  { icon: '📦', label: '订单管理' },
  { icon: '⚙️', label: '系统设置' },
  { icon: '📝', label: '审批中心' },
  { icon: '🔔', label: '消息通知' },
  { icon: '📁', label: '文件中心' },
  { icon: '🛡️', label: '权限管理' }
];

export default function QuickNav({ items = DEFAULT_ITEMS, onSelect }) {
  return (
    <div className="kole-quicknav">
      {items.map((it, i) => (
        <div key={i} className="kole-quicknav-item" onClick={() => onSelect && onSelect(it)}>
          <div className="kole-quicknav-icon">{it.icon}</div>
          <div className="kole-quicknav-label">{it.label}</div>
        </div>
      ))}
    </div>
  );
}