feat: add Login and fix res error

src/modules/query.ts

@@ -1,9 +1,28 @@
-import { Query } from '@kevisual/query';
-export const query = new Query({});
-export const request = query.post;
-export const ws = new WebSocket('ws://localhost:6010/api/router');
+import { Query, QueryClient } from '@kevisual/query';
+import { QueryWs } from '@kevisual/query/ws';
+import { modal } from './redirect-to-login';
 import { create } from 'zustand';
-
+export const query = new Query();
+query.beforeRequest = async (config) => {
+  if (config.headers) {
+    const token = localStorage.getItem('token');
+    if (token) {
+      config.headers['Authorization'] = 'Bearer ' + token;
+    }
+  }
+  return config;
+};
+query.afterResponse = async (res) => {
+  if (res.code === 401 || res.code === 403) {
+    modal.setOpen(true);
+  }
+  return res;
+};
+export const request = query.post;
+export const queryWs = new QueryWs({
+  url: '/api/router',
+});
+export const ws = queryWs.ws;
 type Store = {
   connected: boolean;
   setConnected: (connected: boolean) => void;
@@ -18,11 +37,6 @@ ws.onopen = () => {
   console.log('Connected to WebSocket server');
   useStore.getState().setConnected(true);
 };
-// 接收服务器的消息
-ws.onmessage = (event) => {
-  // console.log('Received message:', event.data);
-  // const message = JSON.parse(event.data);
-};
 
 // 处理 WebSocket 关闭
 ws.onclose = () => {

src/modules/redirect-to-login.ts

@@ -0,0 +1,26 @@
+import { DialogModal } from '@kevisual/ui';
+import '@kevisual/ui/dist/index.css';
+
+const content = document.createElement('div');
+content.innerHTML = `
+    <div class="bg-white p-8 rounded shadow-md w-full max-w-md text-center">
+      <h2 class="text-2xl font-bold mb-4">Token 无效</h2>
+      <p class="mb-6">您的登录凭证已失效，请重新登录。</p>
+      <a href="/user/login" class="inline-block bg-red-500 text-white py-2 px-4 rounded hover:bg-red-600 transition duration-200">确定</a>
+    </div>
+`;
+export const modal = DialogModal.render(content, {
+  id: 'redirect-to-login',
+  contentStyle: {
+    width: 'unset',
+  },
+  dialogTitleStyle: {
+    display: 'none',
+    padding: '0',
+  },
+  dialogContentStyle: {
+    padding: '0',
+  },
+  mask: true,
+  open: false,
+});