Merge pull request #356 from guanweiwang/feature/toogle_ui

feat: 切换 ui

Author: yokowu

ui/README.md

@@ -44,7 +44,7 @@
 ### UI框架与样式
 - **Material-UI (@mui)** - Google Material Design组件库
 - **Emotion** - CSS-in-JS样式库
-- **@c-x/ui** - 自定义组件库
+- **@ctzhian/ui** - 自定义组件库
 
 ### 状态管理与数据
 - **ahooks** - React Hooks工具库

ui/api-templates/http-client.ejs

@@ -1,7 +1,7 @@
 <%
 const { apiConfig, generateResponses, config } = it;
 %>
-import { message as Message  } from '@c-x/ui'
+import { message as Message  } from '@ctzhian/ui'
 import type { AxiosInstance, AxiosRequestConfig, HeadersDefaults, ResponseType, AxiosResponse } from "axios";
 import axios from "axios";
 

ui/package.json

@@ -11,14 +11,13 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "@c-x/ui": "^1.0.9",
+    "@ctzhian/ui": "^7",
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.0",
     "@hookform/resolvers": "^5.2.1",
     "@monaco-editor/react": "4.7.0",
-    "@mui/icons-material": "^6.4.12",
-    "@mui/lab": "6.0.0-beta.19",
-    "@mui/material": "^6.4.12",
+    "@mui/icons-material": "^7",
+    "@mui/material": "^7",
     "@yokowu/modelkit-ui": "2.0.6",
     "@tailwindcss/vite": "^4.1.12",
     "ahooks": "^3.8.4",

ui/pnpm-lock.yaml

@@ -10,19 +10,19 @@
  * ---------------------------------------------------------------
  */
 
-import { message as Message } from "@c-x/ui";
+import { message as Message } from '@ctzhian/ui';
 import type {
   AxiosInstance,
   AxiosRequestConfig,
   HeadersDefaults,
   ResponseType,
-} from "axios";
-import axios from "axios";
+} from 'axios';
+import axios from 'axios';
 
 export type QueryParamsType = Record<string | number, any>;
 
 export interface FullRequestParams
-  extends Omit<AxiosRequestConfig, "data" | "params" | "url" | "responseType"> {
+  extends Omit<AxiosRequestConfig, 'data' | 'params' | 'url' | 'responseType'> {
   /** set parameter to `true` for call `securityWorker` for this request */
   secure?: boolean;
   /** request path */
@@ -39,34 +39,34 @@ export interface FullRequestParams
 
 export type RequestParams = Omit<
   FullRequestParams,
-  "body" | "method" | "query" | "path"
+  'body' | 'method' | 'query' | 'path'
 >;
 
 export interface ApiConfig<SecurityDataType = unknown>
-  extends Omit<AxiosRequestConfig, "data" | "cancelToken"> {
+  extends Omit<AxiosRequestConfig, 'data' | 'cancelToken'> {
   securityWorker?: (
-    securityData: SecurityDataType | null,
+    securityData: SecurityDataType | null
   ) => Promise<AxiosRequestConfig | void> | AxiosRequestConfig | void;
   secure?: boolean;
   format?: ResponseType;
 }
 
 export enum ContentType {
-  Json = "application/json",
-  FormData = "multipart/form-data",
-  UrlEncoded = "application/x-www-form-urlencoded",
-  Text = "text/plain",
+  Json = 'application/json',
+  FormData = 'multipart/form-data',
+  UrlEncoded = 'application/x-www-form-urlencoded',
+  Text = 'text/plain',
 }
 
-const whitePathnameList = ["/user/login", "/login", "/auth", "/invite"];
-const whiteApiList = ["/api/v1/user/profile", "/api/v1/admin/profile"];
+const whitePathnameList = ['/user/login', '/login', '/auth', '/invite'];
+const whiteApiList = ['/api/v1/user/profile', '/api/v1/admin/profile'];
 
 const redirectToLogin = () => {
   const redirectAfterLogin = encodeURIComponent(location.href);
   const search = `redirect=${redirectAfterLogin}`;
-  const pathname = location.pathname.startsWith("/user")
-    ? "/login"
-    : "/login/admin";
+  const pathname = location.pathname.startsWith('/user')
+    ? '/login'
+    : '/login/admin';
   window.location.href = `${pathname}`;
 };
 
@@ -75,7 +75,7 @@ type ExtractDataProp<T> = T extends { data?: infer U } ? U : never;
 export class HttpClient<SecurityDataType = unknown> {
   public instance: AxiosInstance;
   private securityData: SecurityDataType | null = null;
-  private securityWorker?: ApiConfig<SecurityDataType>["securityWorker"];
+  private securityWorker?: ApiConfig<SecurityDataType>['securityWorker'];
   private secure?: boolean;
   private format?: ResponseType;
 
@@ -88,7 +88,7 @@ export class HttpClient<SecurityDataType = unknown> {
     this.instance = axios.create({
       withCredentials: true,
       ...axiosConfig,
-      baseURL: axiosConfig.baseURL || "",
+      baseURL: axiosConfig.baseURL || '',
     });
     this.secure = secure;
     this.format = format;
@@ -107,20 +107,20 @@ export class HttpClient<SecurityDataType = unknown> {
           if (
             whitePathnameList.find((item) => location.pathname.startsWith(item))
           ) {
-            return Promise.reject("尚未登录");
+            return Promise.reject('尚未登录');
           }
-          Message.error("尚未登录");
+          Message.error('尚未登录');
           redirectToLogin();
-          return Promise.reject("尚未登录");
+          return Promise.reject('尚未登录');
         }
         // 手动取消请求
-        if (err.code === "ERR_CANCELED") {
+        if (err.code === 'ERR_CANCELED') {
           return;
         }
         const msg = err?.response?.data?.message || err?.message;
         Message.error(msg);
         return Promise.reject(msg);
-      },
+      }
     );
   }
 
@@ -130,7 +130,7 @@ export class HttpClient<SecurityDataType = unknown> {
 
   protected mergeRequestParams(
     params1: AxiosRequestConfig,
-    params2?: AxiosRequestConfig,
+    params2?: AxiosRequestConfig
   ): AxiosRequestConfig {
     const method = params1.method || (params2 && params2.method);
 
@@ -151,7 +151,7 @@ export class HttpClient<SecurityDataType = unknown> {
   }
 
   protected stringifyFormItem(formItem: unknown) {
-    if (typeof formItem === "object" && formItem !== null) {
+    if (typeof formItem === 'object' && formItem !== null) {
       return JSON.stringify(formItem);
     } else {
       return `${formItem}`;
@@ -168,7 +168,7 @@ export class HttpClient<SecurityDataType = unknown> {
         const isFileType = formItem instanceof Blob || formItem instanceof File;
         formData.append(
           key,
-          isFileType ? formItem : this.stringifyFormItem(formItem),
+          isFileType ? formItem : this.stringifyFormItem(formItem)
         );
       }
 
@@ -186,7 +186,7 @@ export class HttpClient<SecurityDataType = unknown> {
     ...params
   }: FullRequestParams): Promise<ExtractDataProp<T>> => {
     const secureParams =
-      ((typeof secure === "boolean" ? secure : this.secure) &&
+      ((typeof secure === 'boolean' ? secure : this.secure) &&
         this.securityWorker &&
         (await this.securityWorker(this.securityData))) ||
       {};
@@ -197,7 +197,7 @@ export class HttpClient<SecurityDataType = unknown> {
       type === ContentType.FormData &&
       body &&
       body !== null &&
-      typeof body === "object"
+      typeof body === 'object'
     ) {
       body = this.createFormData(body as Record<string, unknown>);
     }
@@ -206,7 +206,7 @@ export class HttpClient<SecurityDataType = unknown> {
       type === ContentType.Text &&
       body &&
       body !== null &&
-      typeof body !== "string"
+      typeof body !== 'string'
     ) {
       body = JSON.stringify(body);
     }
@@ -216,7 +216,7 @@ export class HttpClient<SecurityDataType = unknown> {
       headers: {
         ...(requestParams.headers || {}),
         ...(type && type !== ContentType.FormData
-          ? { "Content-Type": type }
+          ? { 'Content-Type': type }
           : {}),
       },
       params: query,
@@ -226,4 +226,4 @@ export class HttpClient<SecurityDataType = unknown> {
     });
   };
 }
-export default new HttpClient({ format: "json" }).request;
+export default new HttpClient({ format: 'json' }).request;

ui/src/api/httpClient.ts

@@ -2,7 +2,7 @@ import { styled } from '@mui/material';
 
 const StyledCard = styled('div')(({ theme }) => ({
   padding: theme.spacing(2),
-  borderRadius: theme.shape.borderRadius * 2.5,
+  borderRadius: (theme.shape.borderRadius as number) * 2.5,
   backgroundColor: theme.palette.background.default,
 }));