import { defineConfig } from 'umi';
import zhCN from 'antd/locale/zh_CN';
import { theme } from 'antd';

const panelDarkTheme = {
  algorithm: theme.darkAlgorithm,
  token: {
    colorPrimary: '#22d3ee',
    colorInfo: '#38bdf8',
    colorSuccess: '#4ade80',
    colorWarning: '#fbbf24',
    colorError: '#fb7185',
    colorTextBase: '#e6f7ff',
    colorBgBase: '#07142e',
    borderRadius: 14,
    wireframe: false,
    fontFamily: 'Inter, PingFang SC, Microsoft YaHei, system-ui, sans-serif',
  },
  components: {
    Layout: {
      bodyBg: 'transparent',
      headerBg: 'transparent',
      siderBg: 'transparent',
    },
    Card: {
      colorBgContainer: 'rgba(7, 18, 39, 0.84)',
      colorBorderSecondary: 'rgba(103, 232, 249, 0.16)',
      headerBg: 'rgba(34, 211, 238, 0.08)',
      headerFontSize: 16,
    },
    Table: {
      colorBgContainer: 'rgba(2, 8, 23, 0.2)',
      colorHeaderBg: 'rgba(34, 211, 238, 0.12)',
      colorBgContainerHover: 'rgba(34, 211, 238, 0.1)',
      colorText: '#e6f7ff',
      headerColor: '#cffafe',
      borderColor: 'rgba(103, 232, 249, 0.16)',
      cellPaddingBlock: 10,
    },
    Input: {
      colorBgContainer: 'rgba(2, 8, 23, 0.48)',
      colorBorder: 'rgba(103, 232, 249, 0.28)',
      activeBorderColor: '#22d3ee',
      colorText: '#e6f7ff',
    },
    InputNumber: {
      colorBgContainer: 'rgba(2, 8, 23, 0.48)',
      colorBorder: 'rgba(103, 232, 249, 0.28)',
      activeBorderColor: '#22d3ee',
      colorText: '#e6f7ff',
    },
    Select: {
      colorBgContainer: 'rgba(2, 8, 23, 0.48)',
      colorBorder: 'rgba(103, 232, 249, 0.28)',
      optionSelectedBg: 'rgba(34, 211, 238, 0.18)',
      colorText: '#e6f7ff',
    },
    DatePicker: {
      colorBgContainer: 'rgba(2, 8, 23, 0.48)',
      colorBorder: 'rgba(103, 232, 249, 0.28)',
      colorText: '#e6f7ff',
    },
    Button: {
      primaryShadow: '0 12px 26px rgba(37, 99, 235, 0.28)',
      defaultBg: 'rgba(255, 255, 255, 0.05)',
      defaultColor: '#a5f3fc',
    },
    Modal: {
      colorBgContainer: '#081428',
      headerColor: '#e6f7ff',
      contentColor: '#e6f7ff',
    },
    Drawer: {
      colorBgElevated: '#081428',
      colorText: '#e6f7ff',
    },
    Popover: {
      colorBgElevated: '#0b1b38',
      colorText: '#e6f7ff',
    },
    Tooltip: {
      colorBgSpotlight: '#0b1b38',
      colorTextLightSolid: '#e6f7ff',
    },
    Tabs: {
      itemColor: 'rgba(230, 247, 255, 0.68)',
      itemSelectedColor: '#67e8f9',
      inkBarColor: '#22d3ee',
    },
    Collapse: {
      colorBgContainer: 'rgba(7, 18, 39, 0.68)',
      colorBorder: 'rgba(103, 232, 249, 0.18)',
      headerBg: 'rgba(34, 211, 238, 0.07)',
    },
  },
};

export default defineConfig({
  plugins: ['@umijs/plugins/dist/antd', '@umijs/plugins/dist/locale'],
  routes: [
    { path: '/', component: '@/pages/index', layout: false },
    { path: '/login', component: '@/pages/login', layout: false },
    { path: '/overview', component: '@/pages/overview' },
    { path: '/campusState', component: '@/pages/campusState' },
    { path: '/monitScreen', component: '@/pages/monitScreen' },
    { path: '/alarms', component: '@/pages/alarms' },
    { path: '/ai-chat', component: '@/pages/aiChat' },
    { path: '/userInfo', component: '@/pages/userInfo' },
    { path: '/admin/mapManage', component: '@/pages/admin/mapManage' },
    { path: '/admin/camerasManage', component: '@/pages/admin/camerasManage' },
    {
      path: '/admin/alarmRulesManage',
      component: '@/pages/admin/alarmRulesManage',
    },
    { path: '/admin/usersManage', component: '@/pages/admin/usersManage' },
    { path: '/*', redirect: '/' },
  ],
  clientLoader: {},
  npmClient: 'pnpm',
  antd: {
    configProvider: {
      locale: zhCN,
      theme: panelDarkTheme,
    },
  },
  locale: { default: 'zh-CN', antd: false, baseSeparator: '-' },
  publicPath: process.env.NODE_ENV === 'production' ? './' : '/',
  history: { type: 'hash' },
  metas: [
    { name: 'viewport', content: 'width=device-width, initial-scale=1' },
    { name: 'theme-color', content: '#07142e' },
  ],
  links: [{ rel: 'icon', type: 'image/svg+xml', href: './favicon.svg' }],
});