Initial commit

2025-04-14 23:52:39 +08:00
commit dc83e37811
29 changed files with 3434 additions and 0 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -0,0 +1,30 @@
+# Logs
+logs
+*.log
+.env
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+tsconfig.app.tsbuildinfo
+tsconfig.node.tsbuildinfo
+
+.turbo
--- a/.gitmodules
+++ b/.gitmodules
@@ -0,0 +1,3 @@
+[submodule "packages/components"]
+	path = packages/components
+	url = git@git.xiongxiao.me:kevisual/components.git
--- a/.npmrc
+++ b/.npmrc
@@ -0,0 +1,3 @@
+//npm.xiongxiao.me/:_authToken=${ME_NPM_TOKEN}
+//registry.npmjs.org/:_authToken=${NPM_TOKEN}
+ignore-workspace-root-check=true
--- a/README.md
+++ b/README.md
@@ -0,0 +1 @@
+# vite-react-template
--- a/index.html
+++ b/index.html
@@ -0,0 +1,33 @@
+<!doctype html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8" />
+  <link rel="icon" type="image/png" href="https://kevisual.xiongxiao.me/root/center/panda.png" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>Vite + React + TS</title>
+  <link rel="stylesheet" href="/src/index.css" />
+  <style>
+    html,
+    body {
+      height: 100%;
+      margin: 0;
+      padding: 0;
+      overflow: hidden;
+    }
+
+    #root {
+      height: 100%;
+      margin: 0;
+      padding: 0;
+      overflow: hidden;
+    }
+  </style>
+</head>
+
+<body>
+  <div id="root"></div>
+  <script type="module" src="/src/main.tsx"></script>
+</body>
+
+</html>
--- a/package.json
+++ b/package.json
@@ -0,0 +1,61 @@
+{
+  "name": "vite-react",
+  "private": true,
+  "version": "0.0.1",
+  "type": "module",
+  "basename": "/",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "build:css": "tailwindcss -i ./src/index.css -o ./dist/render.css --minify",
+    "postbuild2": "pnpm build:css",
+    "preview": "vite preview",
+    "pub": "envision deploy ./dist -k vite-react -v 0.0.1",
+    "dev:lib": "turbo dev",
+    "git:submodule": "git submodule update --init --recursive",
+    "cmd": "tsx ./script/index.ts "
+  },
+  "files": [
+    "dist"
+  ],
+  "author": "abearxiong <xiongxiao@xiongxiao.me>",
+  "license": "MIT",
+  "dependencies": {
+    "@emotion/react": "^11.14.0",
+    "@emotion/styled": "^11.14.0",
+    "@kevisual/router": "0.0.10",
+    "@mui/material": "^7.0.1",
+    "clsx": "^2.1.1",
+    "dayjs": "^1.11.13",
+    "lodash-es": "^4.17.21",
+    "lucide-react": "^0.487.0",
+    "nanoid": "^5.1.5",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
+    "react-hook-form": "^7.55.0",
+    "react-router": "^7.5.0",
+    "react-router-dom": "^7.5.0",
+    "react-toastify": "^11.0.5",
+    "zustand": "^5.0.3"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "devDependencies": {
+    "@kevisual/components": "workspace:*",
+    "@kevisual/query": "0.0.17",
+    "@kevisual/types": "^0.0.6",
+    "@tailwindcss/vite": "^4.1.3",
+    "@types/node": "^22.14.0",
+    "@types/react": "^19.1.0",
+    "@types/react-dom": "^19.1.1",
+    "@vitejs/plugin-basic-ssl": "^2.0.0",
+    "@vitejs/plugin-react": "^4.3.4",
+    "commander": "^13.1.0",
+    "inquire": "^0.4.8",
+    "tailwindcss": "^4.1.3",
+    "typescript": "^5.8.3",
+    "vite": "^6.2.5"
+  },
+  "packageManager": "pnpm@10.7.1"
+}
--- a/packages/.gitkeep
+++ b/packages/.gitkeep
--- a/packages/components
+++ b/packages/components
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/pnpm-workspace.yaml
+++ b/pnpm-workspace.yaml
@@ -0,0 +1,3 @@
+packages:
+  - 'submodules/*'
+  - 'packages/*'
--- a/public/demo.html
+++ b/public/demo.html
@@ -0,0 +1,39 @@
+<!doctype html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <link rel="icon" type="image/png" href="https://kevisual.xiongxiao.me/root/center/panda.png" />
+  <title>Demo</title>
+  <style>
+    html,
+    body {
+      margin: 0;
+      padding: 0;
+      width: 100%;
+      height: 100%;
+      overflow: hidden;
+    }
+
+    #root {
+      width: 100%;
+      height: 100%;
+    }
+  </style>
+  <link rel="stylesheet" crossorigin href="./render.css">
+</head>
+
+<body>
+  <div id="root"></div>
+  <script type="module">
+    import { render } from './render.js';
+    console.log('render', render);
+    const opts = {
+      renderRoot: document.getElementById('root'),
+    }
+    render(opts);
+  </script>
+</body>
+
+</html>
--- a/script/index.ts
+++ b/script/index.ts
@@ -0,0 +1,15 @@
+import fs from 'fs';
+import path from 'path';
+import { program, Command } from './program';
+
+export const root = process.cwd();
+
+export const clearWorkspace = () => {
+  const files = ['submodules', 'packages', 'pnpm-workspace.yaml', 'turbo.json'];
+  for (const file of files) {
+    fs.rmSync(path.join(root, file), { recursive: true, force: true });
+  }
+};
+program.addCommand(new Command('clear').action(clearWorkspace));
+
+program.parse(process.argv);
--- a/script/program.ts
+++ b/script/program.ts
@@ -0,0 +1,2 @@
+import { program, Command } from 'commander';
+export { program, Command };
--- a/src/app.ts
+++ b/src/app.ts
--- a/src/index.css
+++ b/src/index.css
@@ -0,0 +1 @@
+@import "tailwindcss";
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -0,0 +1,10 @@
+import { createRoot } from 'react-dom/client';
+import { App, AppRoute } from './pages/App.tsx';
+import { CustomThemeProvider } from '@kevisual/components/theme/index.tsx';
+
+console.log('cu',)
+createRoot(document.getElementById('root')!).render(
+  <CustomThemeProvider>
+    <AppRoute />
+  </CustomThemeProvider>,
+);
--- a/src/modules/basename.ts
+++ b/src/modules/basename.ts
@@ -0,0 +1 @@
+export const basename = DEV_SERVER ? '/' : BASE_NAME;
--- a/src/modules/query.ts
+++ b/src/modules/query.ts
@@ -0,0 +1,3 @@
+import { QueryClient } from '@kevisual/query';
+
+export const query = new QueryClient();
--- a/src/pages/App.tsx
+++ b/src/pages/App.tsx
@@ -0,0 +1,18 @@
+import { basename } from '../modules/basename';
+import { BrowserRouter as Router, Routes, Route, Navigate } from 'react-router-dom';
+console.log('basename', basename);
+import { App as AppDemo } from './app-demo';
+export const App = () => {
+  return <div className='bg-slate-200 w-full h-full border'>123</div>;
+};
+
+export const AppRoute = () => {
+  return (
+    <Router>
+      <Routes>
+        <Route path='/' element={<Navigate to='/app-demo/list' />} />
+        <Route path='/app-demo/*' element={<AppDemo />} />
+      </Routes>
+    </Router>
+  );
+};
--- a/src/pages/app-demo/index.tsx
+++ b/src/pages/app-demo/index.tsx
@@ -0,0 +1,11 @@
+import { Routes, Route } from 'react-router';
+import { List } from './pages/List';
+
+export const App = () => {
+  return (
+    <Routes>
+      <Route index element={<List />} />
+      <Route path='/list' element={<List />} />
+    </Routes>
+  );
+};
--- a/src/pages/app-demo/pages/List.tsx
+++ b/src/pages/app-demo/pages/List.tsx
@@ -0,0 +1,62 @@
+import { useEffect } from 'react';
+import { useDemoStore } from '../store';
+import { useShallow } from 'zustand/react/shallow';
+import { Dialog, DialogTitle, DialogContent, TextField, Button } from '@mui/material';
+import { Controller, useForm } from 'react-hook-form';
+export const EditDialog = () => {
+  const { control, handleSubmit, reset } = useForm();
+  const store = useDemoStore(
+    useShallow((state) => ({
+      formData: state.formData,
+      setFormData: state.setFormData,
+      showEdit: state.showEdit,
+      setShowEdit: state.setShowEdit,
+    })),
+  );
+  useEffect(() => {
+    if (store.showEdit) {
+      reset(store.formData || {});
+    }
+  }, [store.formData]);
+  const onSubmit = (data: any) => {
+    console.log(data);
+  };
+  const hasId = !!store.formData?.id;
+  return (
+    <Dialog open={store.showEdit} onClose={() => store.setShowEdit(false)}>
+      <DialogTitle>{hasId ? 'Edit' : 'Add'}</DialogTitle>
+      <DialogContent>
+        <form onSubmit={handleSubmit(onSubmit)}>
+          <Controller control={control} name='title' render={({ field }) => <TextField {...field} label='Title' />} />
+          <Button type='submit'>提交</Button>
+        </form>
+      </DialogContent>
+    </Dialog>
+  );
+};
+
+export const List = () => {
+  const store = useDemoStore(
+    useShallow((state) => ({
+      list: state.list,
+      init: state.init,
+      setShowEdit: state.setShowEdit,
+    })),
+  );
+  useEffect(() => {
+    store.init();
+  }, []);
+  return (
+    <div className='w-full h-full flex flex-col gap-2 bg-gray-100'>
+      <div className='flex justify-end'>
+        <Button onClick={() => store.setShowEdit(true)}>添加</Button>
+      </div>
+      <div>
+        {store.list.map((item) => (
+          <div key={item.id}>{item.title}</div>
+        ))}
+      </div>
+      <EditDialog />
+    </div>
+  );
+};
--- a/src/pages/app-demo/query.ts
+++ b/src/pages/app-demo/query.ts
@@ -0,0 +1,46 @@
+import { BaseQuery } from '@kevisual/query';
+export class QueryApi extends BaseQuery {
+  constructor(options: { query: any }) {
+    super(options);
+  }
+  async getList(params?: any, dataOpts?: any) {
+    return this.query.post(
+      {
+        path: 'demo',
+        key: 'list',
+        ...params,
+      },
+      dataOpts,
+    );
+  }
+  async getDetail(id?: string, dataOpts?: any) {
+    return this.query.post(
+      {
+        path: 'demo',
+        key: 'get',
+        data: { id },
+      },
+      dataOpts,
+    );
+  }
+  async update(data?: any, dataOpts?: any) {
+    return this.query.post(
+      {
+        path: 'demo',
+        key: 'update',
+        data,
+      },
+      dataOpts,
+    );
+  }
+  async delete(id?: string, dataOpts?: any) {
+    return this.query.post(
+      {
+        path: 'demo',
+        key: 'delete',
+        data: { id },
+      },
+      dataOpts,
+    );
+  }
+}
--- a/src/pages/app-demo/store.ts
+++ b/src/pages/app-demo/store.ts
@@ -0,0 +1,87 @@
+import { create } from 'zustand';
+import { query } from '@/modules/query';
+import { QueryApi } from './query';
+import { toast } from 'react-toastify';
+
+export const queryApi = new QueryApi({ query });
+type Store = {
+  list: any[];
+  setList: (list: any[]) => void;
+  data: any;
+  setData: (data: any) => void;
+  loading: boolean;
+  setLoading: (loading: boolean) => void;
+  formData: any;
+  setFormData: (data: any) => void;
+  showEdit: boolean;
+  setShowEdit: (showEdit: boolean) => void;
+  getList: () => Promise<any>;
+  init: () => Promise<void>;
+  getData: (id: string) => Promise<any>;
+  updateData: (data: any, opts?: { refresh?: boolean }) => Promise<any>;
+  deleteData: (id: string, opts?: { refresh?: boolean }) => Promise<any>;
+};
+export const useDemoStore = create<Store>((set, get) => ({
+  list: [],
+  setList: (list) => set({ list }),
+  data: null,
+  setData: (data) => set({ data }),
+  loading: false,
+  setLoading: (loading) => set({ loading }),
+  formData: null,
+  setFormData: (formData) => set({ formData }),
+  showEdit: false,
+  setShowEdit: (showEdit) => set({ showEdit }),
+  getList: async () => {
+    set({ loading: true });
+    const res = await queryApi.getList();
+    set({ loading: false });
+    if (res.code === 200) {
+      set({ list: res.data });
+    }
+    return res;
+  },
+  init: async () => {
+    await get().getList();
+  },
+  getData: async (id) => {
+    set({ loading: true });
+    const res = await queryApi.getDetail(id);
+    set({ loading: false });
+    if (res.code === 200) {
+      const data = res.data;
+      set({ data });
+    }
+    return res;
+  },
+  updateData: async (data, opts = { refresh: true }) => {
+    set({ loading: true });
+    const res = await queryApi.update(data);
+    set({ loading: false });
+    if (res.code === 200) {
+      set({ data: res.data });
+      toast.success('更新成功');
+    } else {
+      toast.error(res.message || '更新失败');
+    }
+    if (opts.refresh) {
+      await get().getList();
+    }
+    return res;
+  },
+  deleteData: async (id, opts = { refresh: true }) => {
+    set({ loading: true });
+    const res = await queryApi.delete(id);
+    set({ loading: false });
+    if (res.code === 200) {
+      set({ data: null });
+      toast.success('删除成功');
+    } else {
+      toast.error(res.message || '删除失败');
+    }
+    if (opts.refresh) {
+      await get().getList();
+    }
+    return res;
+  },
+}));
--- a/src/routes/index.ts
+++ b/src/routes/index.ts
@@ -0,0 +1 @@
+// import {}
--- a/src/vite-env.d.ts
+++ b/src/vite-env.d.ts
@@ -0,0 +1,6 @@
+/// <reference types="vite/client" />
+type SimpleObject = {
+  [key: string | number]: any;
+};
+
+declare let BASE_NAME: string;
--- a/submodules/.gitkeep
+++ b/submodules/.gitkeep
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -0,0 +1,43 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "useDefineForClassFields": true,
+    "lib": [
+      "ES2020",
+      "DOM",
+      "DOM.Iterable"
+    ],
+    "module": "ESNext",
+    "skipLibCheck": true,
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "isolatedModules": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+    // "jsx": "react",
+    // "jsxFragmentFactory": "Fragment",
+    // "jsxFactory": "h",
+    "jsx": "react-jsx",
+    "baseUrl": "./",
+    "typeRoots": [
+      "node_modules/@types",
+      "node_modules/@kevisual/types",
+    ],
+    "paths": {
+      "@/*": [
+        "src/*"
+      ]
+    },
+    /* Linting */
+    "strict": true,
+    "noImplicitAny": false,
+    "noUnusedLocals": false,
+    "noUnusedParameters": false,
+    "noFallthroughCasesInSwitch": true
+  },
+  "include": [
+    "src",
+    "typings.d.ts"
+  ]
+}
--- a/turbo.json
+++ b/turbo.json
@@ -0,0 +1,22 @@
+{
+  "$schema": "https://turbo.build/schema.json",
+  "tasks": {
+    "build": {
+      "dependsOn": [
+        "^build"
+      ],
+      "outputs": [
+        "dist/**"
+      ]
+    },
+    "dev:lib": {
+      "persistent": true,
+      "cache": true
+    },
+    "build:lib": {
+      "dependsOn": [
+        "^build:lib"
+      ]
+    }
+  }
+}
--- a/vite.config.mjs
+++ b/vite.config.mjs
@@ -0,0 +1,95 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import path from 'path';
+import pkgs from './package.json' with { type: 'json' };
+const version = pkgs.version || '0.0.1';
+
+const isDev = process.env.NODE_ENV === 'development';
+const basename = isDev ? '/' : pkgs?.basename || '/';
+
+const checkJsh = () => {
+  return process.env.SHELL === '/bin/jsh';
+};
+const isJsh = checkJsh();
+const plugins = [react(), ];
+
+if (!isJsh) {
+  const basicSsl = await import('@vitejs/plugin-basic-ssl');
+  const tailwindcss = await import('@tailwindcss/vite');
+  const defaultPlugin = basicSsl.default;
+  const defaultCssPlugin = tailwindcss.default;
+  plugins.push(defaultCssPlugin(),defaultPlugin());
+}
+
+let target = 'https://kevisual.xiongxiao.me';
+if (isDev) {
+  target = 'https://kevisual.xiongxiao.me';
+} else {
+  target = 'https://kevisual.cn';
+}
+
+let proxy = {
+  '/root/center/': {
+    target: `https://${target}/root/center/`,
+  },
+  '/root/system-lib/': {
+    target: `https://${target}/root/system-lib/`,
+  },
+  '/user/login/': {
+    target: `https://${target}/user/login/`,
+  },
+  '/api': {
+    target: `https://${target}`,
+    changeOrigin: true,
+    ws: true,
+    rewriteWsOrigin: true,
+    cookieDomainRewrite: 'localhost',
+  },
+};
+/**
+ * @see https://vitejs.dev/config/
+ */
+export default defineConfig({
+  plugins,
+  resolve: {
+    alias: {
+      '@': path.resolve(__dirname, './src')
+    },
+  },
+  base: basename,
+  define: {
+    DEV_SERVER: JSON.stringify(process.env.NODE_ENV === 'development'),
+    APP_VERSION: JSON.stringify(version),
+    BASE_NAME: JSON.stringify(basename),
+    'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
+  },
+  build: {
+    target: 'modules',
+    // lib: {
+    //   entry: './src/libs.ts',
+    //   formats: ['es'],
+    //   fileName: (format) => `render.js`,
+    // },
+  },
+  server: {
+    port: 7008,
+    host: '0.0.0.0',
+    proxy: {
+      '/api': {
+        target: 'http://localhost:3000',
+        changeOrigin: true,
+        ws: true,
+        rewriteWsOrigin: true,
+        rewrite: (path) => path.replace(/^\/api/, '/api'),
+      },
+      '/api/router': {
+        target: 'ws://localhost:3000',
+        changeOrigin: true,
+        ws: true,
+        rewriteWsOrigin: true,
+        rewrite: (path) => path.replace(/^\/api/, '/api'),
+      },
+      ...proxy,
+    },
+  },
+});
				`@@ -0,0 +1 @@`
				`export const basename = DEV_SERVER ? '/' : BASE_NAME;`