geo/apps/ops-web/src/main.ts

import { QueryClient, VueQueryPlugin } from '@tanstack/vue-query'
import {
  Alert,
  App as AntApp,
  Avatar,
  Badge,
  Button,
  Card,
  Checkbox,
  ConfigProvider,
  DatePicker,
  Descriptions,
  Drawer,
  Dropdown,
  Empty,
  Form,
  Input,
  InputNumber,
  Layout,
  Menu,
  Modal,
  Pagination,
  Popconfirm,
  Radio,
  Result,
  Select,
  Space,
  Spin,
  Statistic,
  Switch,
  Table,
  Tabs,
  Tag,
  Tooltip,
  message,
} from 'ant-design-vue'
import { createApp } from 'vue'

import { registerChunkReloadHandlers } from '@/lib/chunk-reload'
import { bindUnauthorizedHandler } from '@/lib/http'
import { router } from '@/router'
import { useAuthStore } from '@/stores/auth'
import { pinia } from '@/stores/pinia'
import 'ant-design-vue/dist/reset.css'
import App from './App.vue'
import './styles.css'

registerChunkReloadHandlers()

const queryClient = new QueryClient({
  defaultOptions: {
    queries: {
      staleTime: 30000,
      refetchOnWindowFocus: false,
      retry: false,
    },
  },
})

const app = createApp(App)

message.config({
  maxCount: 1,
})

bindUnauthorizedHandler(() => {
  const auth = useAuthStore(pinia)
  auth.logout()
  void router.replace({ name: 'login' })
  message.destroy()
  message.warning('登录已过期，请重新登录')
})
;[
  Alert,
  AntApp,
  Avatar,
  Badge,
  Button,
  Card,
  Checkbox,
  ConfigProvider,
  DatePicker,
  Descriptions,
  Drawer,
  Dropdown,
  Empty,
  Form,
  Input,
  InputNumber,
  Layout,
  Menu,
  Modal,
  Pagination,
  Popconfirm,
  Radio,
  Result,
  Select,
  Space,
  Spin,
  Statistic,
  Switch,
  Table,
  Tabs,
  Tag,
  Tooltip,
].forEach((component) => {
  app.use(component)
})

app.use(pinia).use(router).use(VueQueryPlugin, { queryClient }).mount('#app')