import './styles/tailwind.css';
import { createApp } from 'vue';
import App from './App.vue';
import router, { setupRouter } from './router';
import { setupStore } from '@/store';
import { setupDirectives, setupNaive } from '@/plugins';
import { AppProvider } from '@/components/Application';
import Websocket from '@/utils/websocket';
import { storage } from '@/utils/Storage';
import { ACCESS_TOKEN } from '@/store/mutation-types';

function getQueryParams() {
  const params = new URLSearchParams(window.location.search);
  // 获取 access-token 的值
  return params.get('access-token');
}

async function bootstrap() {
  const appProvider = createApp(AppProvider);
  const app = createApp(App);

  setupNaive(app);
  setupDirectives(app);
  setupStore(app);
  appProvider.mount('#appProvider', true);

  // 调用函数获取查询参数
  const accessToken = getQueryParams();
  // console.log('====accessToken:', accessToken);
  if (accessToken !== '' && accessToken !== null) {
    storage.set(ACCESS_TOKEN, accessToken);
  }

  await setupRouter(app);
  await router.isReady();
  const onMessageList: Array<Function> = [];
  app.provide('onMessageList', onMessageList);
  const onMessage = (event: any) => {
    onMessageList.forEach((f) => {
      f.call(null, event);
    });
  };
  app.config.globalProperties.$websocket = Websocket(onMessage);
  app.mount('#app', true);
}

void bootstrap();