init

2025-03-22 00:01:11 +08:00
commit 2920a8d602
155 changed files with 11347 additions and 0 deletions
--- a/.env.development
+++ b/.env.development
@@ -0,0 +1,2 @@
 VITE_USER_NAME=admin
 VITE_PASSWORD=88888888
--- a/.gitignore
+++ b/.gitignore
@@ -0,0 +1,33 @@
 # Logs
 logs
 *.log
 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?
 # 临时文件
 .tmp
 *.js
 *.tsbuildinfo
 # 忽略eslint缓存
 .eslintcache
--- a/.prettierrc
+++ b/.prettierrc
@@ -0,0 +1,6 @@
 {
  "plugins": ["prettier-plugin-tailwindcss"],
  "singleQuote": true,
  "trailingComma": "all",
  "printWidth": 120
 }
--- a/README.md
+++ b/README.md
@@ -0,0 +1,66 @@
 # 项目结构
 ```
 project-root/
 ├── src/
 │   ├── components/
 │   ├── services/            # 服务层
 │   ├── models/              # Mobx状态管理
 │   ├── layouts/             # 布局组件
 │   ├── pages/               # 页面路由
 │   ├── locales/             # 国际化配置
 │   │   ├── zh-CN/
 │   │   └── en-US/
 │   ├── assets/              # 静态资源
 │   │   ├── colors.css
 │   │   ├── medias.css
 │   │   └── variables.css
 │   ├── App.tsx              # 主应用组件
 │   ├── main.tsx             # 入口文件
 │   └──typings.d.ts          # 类型定义
 ├── public/                  # 公共静态文件
 │   └── index.html
 ├── package.json             # 项目配置
 ├── tsconfig.json            # TypeScript配置
 └── vite.config.ts           # 构建配置
 ```
 # 技术栈
 - 前端框架：React
 - 前端语言：TypeScript
 - UI 库：Ant Design
 - 状态管理：Mobx
 - 网络请求：Axios
 - 样式管理：CSS-in-JS
 - 路由管理：React Router
 - 国际化：React intl
 - 代码规范：ESLint
 - 代码格式化：Prettier
 - 构建工具：Vite
 - 其他：
  - 图表库：Recharts
  - 富文本编辑器：React Quill
  - 图片上传：React Dropzone
  - MD5 加密：spark-md5
  - 文件上传：react-dropzone
 # 约定路由
 约定式路由也叫文件路由，就是不需要手写配置，文件系统即路由，通过目录和文件及其命名分析出路由配置。
 1. 分析 src/pages 目录拿到路由配置。
 2. 约定 [ $] 包裹的文件或文件夹为动态可选路由。
 3. 约定目录下有 `_layout.tsx` 时会生成嵌套路由，以 `_layout.tsx` 为该目录的 layout。
 4. 约定 src/layouts/index.tsx 为全局路由。
 5. 约定 src/pages/404.tsx 为 404 页面。
 # 布局
 文件 src/layouts/index.tsx 为全局路由。
 1. 布局使用 Ant Design 的 Layout 组件，包含头部、侧边栏、底部。
 2. 布局中包含基本的鉴权功能，用户登录后，判定权限是否可以访问当前页面；未登录用户，只能访问登录页面
 3. 布局中包含国际化功能，用户可以选择语言，切换语言后，页面会自动刷新。
 4. 布局中包含主题功能，用户可以选择主题，切换主题后，页面会自动刷新。
 5. 布局中包含暗黑模式功能，用户可以选择暗黑模式，切换暗黑模式后，页面会自动刷新。
--- a/index.html
+++ b/index.html
@@ -0,0 +1,13 @@
 <!doctype html>
 <html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Aphrodite</title>
  </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,45 @@
 {
  "name": "antd",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "tsc -b && vite build",
    "lint": "eslint --fix --cache --ext .js,.jsx,.ts,.tsx --format=pretty ./src",
    "preview": "vite preview"
  },
  "dependencies": {
    "@ant-design/icons": "^5.6.1",
    "antd": "^5.24.4",
    "mobx": "^6.13.7",
    "mobx-react": "^9.2.0",
    "react": "^18",
    "react-dom": "^18",
    "react-intl": "^7.1.6",
    "react-router-dom": "^7.3.0",
    "spark-md5": "^3.0.2"
  },
  "devDependencies": {
    "@eslint/js": "^9.21.0",
    "@tailwindcss/vite": "^4.0.14",
    "@types/node": "^22.13.10",
    "@types/react": "^19.0.11",
    "@types/react-dom": "^19.0.4",
    "@types/react-intl": "^3.0.0",
    "@types/react-router-dom": "^5.3.3",
    "@vitejs/plugin-react": "^4.3.4",
    "eslint": "^9.21.0",
    "eslint-formatter-pretty": "^6.0.1",
    "eslint-plugin-react-hooks": "^5.1.0",
    "eslint-plugin-react-refresh": "^0.4.19",
    "globals": "^15.15.0",
    "postcss": "^8.5.3",
    "prettier": "^3.5.3",
    "prettier-plugin-tailwindcss": "^0.6.11",
    "tailwindcss": "^4.0.14",
    "typescript": "~5.7.2",
    "typescript-eslint": "^8.24.1",
    "vite": "^6.2.0"
  }
 }
--- a/public/vite.svg
+++ b/public/vite.svg
@@ -0,0 +1 @@
 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
--- a/src/@types/spark-md5.d.ts
+++ b/src/@types/spark-md5.d.ts
@@ -0,0 +1,6 @@
 declare module 'spark-md5' {
  export function hash(input: string): string;
  export function hashBinary(input: ArrayBuffer): string;
  export function hashStr(input: string, raw?: boolean): string;
  export function setBinary(input: boolean): void;
 } 
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -0,0 +1,22 @@
 import { App as AntdApp, ConfigProvider } from 'antd';
 import { observer } from 'mobx-react';
 import { IntlProvider } from '@/define';
 import { useSetting } from './models';
 import Routes from './routes';
 import './style.css';
 function App() {
  const setting = useSetting();
  return (
    <ConfigProvider locale={setting.currentLocale.antd} theme={setting.themeConfig}>
      <IntlProvider locale={setting.locale} messages={setting.currentLocale.messages}>
        <AntdApp>
          <Routes />
        </AntdApp>
      </IntlProvider>
    </ConfigProvider>
  );
 }
 const ObserverApp = observer(App);
 export default ObserverApp;
--- a/src/assets/login_bg.svg
+++ b/src/assets/login_bg.svg
@@ -0,0 +1,69 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
 <svg width="1361px" height="609px" viewBox="0 0 1361 609" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
    <title>Group 21</title>
    <desc>Created with Sketch.</desc>
    <defs></defs>
    <g id="Ant-Design-Pro-3.0" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <g id="账户密码登录-校验" transform="translate(-79.000000, -82.000000)">
            <g id="Group-21" transform="translate(77.000000, 73.000000)">
                <g id="Group-18" opacity="0.8" transform="translate(74.901416, 569.699158) rotate(-7.000000) translate(-74.901416, -569.699158) translate(4.901416, 525.199158)">
                    <ellipse id="Oval-11" fill="#CFDAE6" opacity="0.25" cx="63.5748792" cy="32.468367" rx="21.7830479" ry="21.766008"></ellipse>
                    <ellipse id="Oval-3" fill="#CFDAE6" opacity="0.599999964" cx="5.98746479" cy="13.8668601" rx="5.2173913" ry="5.21330997"></ellipse>
                    <path d="M38.1354514,88.3520215 C43.8984227,88.3520215 48.570234,83.6838647 48.570234,77.9254015 C48.570234,72.1669383 43.8984227,67.4987816 38.1354514,67.4987816 C32.3724801,67.4987816 27.7006688,72.1669383 27.7006688,77.9254015 C27.7006688,83.6838647 32.3724801,88.3520215 38.1354514,88.3520215 Z" id="Oval-3-Copy" fill="#CFDAE6" opacity="0.45"></path>
                    <path d="M64.2775582,33.1704963 L119.185836,16.5654915" id="Path-12" stroke="#CFDAE6" stroke-width="1.73913043" stroke-linecap="round" stroke-linejoin="round"></path>
                    <path d="M42.1431708,26.5002681 L7.71190162,14.5640702" id="Path-16" stroke="#E0B4B7" stroke-width="0.702678964" opacity="0.7" stroke-linecap="round" stroke-linejoin="round" stroke-dasharray="1.405357899873153,2.108036953469981"></path>
                    <path d="M63.9262187,33.521561 L43.6721326,69.3250951" id="Path-15" stroke="#BACAD9" stroke-width="0.702678964" stroke-linecap="round" stroke-linejoin="round" stroke-dasharray="1.405357899873153,2.108036953469981"></path>
                    <g id="Group-17" transform="translate(126.850922, 13.543654) rotate(30.000000) translate(-126.850922, -13.543654) translate(117.285705, 4.381889)" fill="#CFDAE6">
                        <ellipse id="Oval-4" opacity="0.45" cx="9.13482653" cy="9.12768076" rx="9.13482653" ry="9.12768076"></ellipse>
                        <path d="M18.2696531,18.2553615 C18.2696531,13.2142826 14.1798519,9.12768076 9.13482653,9.12768076 C4.08980114,9.12768076 0,13.2142826 0,18.2553615 L18.2696531,18.2553615 Z" id="Oval-4" transform="translate(9.134827, 13.691521) scale(-1, -1) translate(-9.134827, -13.691521) "></path>
                    </g>
                </g>
                <g id="Group-14" transform="translate(216.294700, 123.725600) rotate(-5.000000) translate(-216.294700, -123.725600) translate(106.294700, 35.225600)">
                    <ellipse id="Oval-2" fill="#CFDAE6" opacity="0.25" cx="29.1176471" cy="29.1402439" rx="29.1176471" ry="29.1402439"></ellipse>
                    <ellipse id="Oval-2" fill="#CFDAE6" opacity="0.3" cx="29.1176471" cy="29.1402439" rx="21.5686275" ry="21.5853659"></ellipse>
                    <ellipse id="Oval-2-Copy" stroke="#CFDAE6" opacity="0.4" cx="179.019608" cy="138.146341" rx="23.7254902" ry="23.7439024"></ellipse>
                    <ellipse id="Oval-2" fill="#BACAD9" opacity="0.5" cx="29.1176471" cy="29.1402439" rx="10.7843137" ry="10.7926829"></ellipse>
                    <path d="M29.1176471,39.9329268 L29.1176471,18.347561 C23.1616351,18.347561 18.3333333,23.1796097 18.3333333,29.1402439 C18.3333333,35.1008781 23.1616351,39.9329268 29.1176471,39.9329268 Z" id="Oval-2" fill="#BACAD9"></path>
                    <g id="Group-9" opacity="0.45" transform="translate(172.000000, 131.000000)" fill="#E6A1A6">
                        <ellipse id="Oval-2-Copy-2" cx="7.01960784" cy="7.14634146" rx="6.47058824" ry="6.47560976"></ellipse>
                        <path d="M0.549019608,13.6219512 C4.12262681,13.6219512 7.01960784,10.722722 7.01960784,7.14634146 C7.01960784,3.56996095 4.12262681,0.670731707 0.549019608,0.670731707 L0.549019608,13.6219512 Z" id="Oval-2-Copy-2" transform="translate(3.784314, 7.146341) scale(-1, 1) translate(-3.784314, -7.146341) "></path>
                    </g>
                    <ellipse id="Oval-10" fill="#CFDAE6" cx="218.382353" cy="138.685976" rx="1.61764706" ry="1.61890244"></ellipse>
                    <ellipse id="Oval-10-Copy-2" fill="#E0B4B7" opacity="0.35" cx="179.558824" cy="175.381098" rx="1.61764706" ry="1.61890244"></ellipse>
                    <ellipse id="Oval-10-Copy" fill="#E0B4B7" opacity="0.35" cx="180.098039" cy="102.530488" rx="2.15686275" ry="2.15853659"></ellipse>
                    <path d="M28.9985381,29.9671598 L171.151018,132.876024" id="Path-11" stroke="#CFDAE6" opacity="0.8"></path>
                </g>
                <g id="Group-10" opacity="0.799999952" transform="translate(1054.100635, 36.659317) rotate(-11.000000) translate(-1054.100635, -36.659317) translate(1026.600635, 4.659317)">
                    <ellipse id="Oval-7" stroke="#CFDAE6" stroke-width="0.941176471" cx="43.8135593" cy="32" rx="11.1864407" ry="11.2941176"></ellipse>
                    <g id="Group-12" transform="translate(34.596774, 23.111111)" fill="#BACAD9">
                        <ellipse id="Oval-7" opacity="0.45" cx="9.18534718" cy="8.88888889" rx="8.47457627" ry="8.55614973"></ellipse>
                        <path d="M9.18534718,17.4450386 C13.8657264,17.4450386 17.6599235,13.6143199 17.6599235,8.88888889 C17.6599235,4.16345787 13.8657264,0.332739156 9.18534718,0.332739156 L9.18534718,17.4450386 Z" id="Oval-7"></path>
                    </g>
                    <path d="M34.6597385,24.809694 L5.71666084,4.76878945" id="Path-2" stroke="#CFDAE6" stroke-width="0.941176471"></path>
                    <ellipse id="Oval" stroke="#CFDAE6" stroke-width="0.941176471" cx="3.26271186" cy="3.29411765" rx="3.26271186" ry="3.29411765"></ellipse>
                    <ellipse id="Oval-Copy" fill="#F7E1AD" cx="2.79661017" cy="61.1764706" rx="2.79661017" ry="2.82352941"></ellipse>
                    <path d="M34.6312443,39.2922712 L5.06366663,59.785082" id="Path-10" stroke="#CFDAE6" stroke-width="0.941176471"></path>
                </g>
                <g id="Group-19" opacity="0.33" transform="translate(1282.537219, 446.502867) rotate(-10.000000) translate(-1282.537219, -446.502867) translate(1142.537219, 327.502867)">
                    <g id="Group-17" transform="translate(141.333539, 104.502742) rotate(275.000000) translate(-141.333539, -104.502742) translate(129.333539, 92.502742)" fill="#BACAD9">
                        <circle id="Oval-4" opacity="0.45" cx="11.6666667" cy="11.6666667" r="11.6666667"></circle>
                        <path d="M23.3333333,23.3333333 C23.3333333,16.8900113 18.1099887,11.6666667 11.6666667,11.6666667 C5.22334459,11.6666667 0,16.8900113 0,23.3333333 L23.3333333,23.3333333 Z" id="Oval-4" transform="translate(11.666667, 17.500000) scale(-1, -1) translate(-11.666667, -17.500000) "></path>
                    </g>
                    <circle id="Oval-5-Copy-6" fill="#CFDAE6" cx="201.833333" cy="87.5" r="5.83333333"></circle>
                    <path d="M143.5,88.8126685 L155.070501,17.6038544" id="Path-17" stroke="#BACAD9" stroke-width="1.16666667"></path>
                    <path d="M17.5,37.3333333 L127.466252,97.6449735" id="Path-18" stroke="#BACAD9" stroke-width="1.16666667"></path>
                    <polyline id="Path-19" stroke="#CFDAE6" stroke-width="1.16666667" points="143.902597 120.302281 174.935455 231.571342 38.5 147.510847 126.366941 110.833333"></polyline>
                    <path d="M159.833333,99.7453842 L195.416667,89.25" id="Path-20" stroke="#E0B4B7" stroke-width="1.16666667" opacity="0.6"></path>
                    <path d="M205.333333,82.1372105 L238.719406,36.1666667" id="Path-24" stroke="#BACAD9" stroke-width="1.16666667"></path>
                    <path d="M266.723424,132.231988 L207.083333,90.4166667" id="Path-25" stroke="#CFDAE6" stroke-width="1.16666667"></path>
                    <circle id="Oval-5" fill="#C1D1E0" cx="156.916667" cy="8.75" r="8.75"></circle>
                    <circle id="Oval-5-Copy-3" fill="#C1D1E0" cx="39.0833333" cy="148.75" r="5.25"></circle>
                    <circle id="Oval-5-Copy-2" fill-opacity="0.6" fill="#D1DEED" cx="8.75" cy="33.25" r="8.75"></circle>
                    <circle id="Oval-5-Copy-4" fill-opacity="0.6" fill="#D1DEED" cx="243.833333" cy="30.3333333" r="5.83333333"></circle>
                    <circle id="Oval-5-Copy-5" fill="#E0B4B7" cx="175.583333" cy="232.75" r="5.25"></circle>
                </g>
            </g>
        </g>
    </g>
 </svg>
--- a/src/assets/logo.svg
+++ b/src/assets/logo.svg
@@ -0,0 +1 @@
 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="35.93" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 228"><path fill="#00D8FF" d="M210.483 73.824a171.49 171.49 0 0 0-8.24-2.597c.465-1.9.893-3.777 1.273-5.621c6.238-30.281 2.16-54.676-11.769-62.708c-13.355-7.7-35.196.329-57.254 19.526a171.23 171.23 0 0 0-6.375 5.848a155.866 155.866 0 0 0-4.241-3.917C100.759 3.829 77.587-4.822 63.673 3.233C50.33 10.957 46.379 33.89 51.995 62.588a170.974 170.974 0 0 0 1.892 8.48c-3.28.932-6.445 1.924-9.474 2.98C17.309 83.498 0 98.307 0 113.668c0 15.865 18.582 31.778 46.812 41.427a145.52 145.52 0 0 0 6.921 2.165a167.467 167.467 0 0 0-2.01 9.138c-5.354 28.2-1.173 50.591 12.134 58.266c13.744 7.926 36.812-.22 59.273-19.855a145.567 145.567 0 0 0 5.342-4.923a168.064 168.064 0 0 0 6.92 6.314c21.758 18.722 43.246 26.282 56.54 18.586c13.731-7.949 18.194-32.003 12.4-61.268a145.016 145.016 0 0 0-1.535-6.842c1.62-.48 3.21-.974 4.76-1.488c29.348-9.723 48.443-25.443 48.443-41.52c0-15.417-17.868-30.326-45.517-39.844Zm-6.365 70.984c-1.4.463-2.836.91-4.3 1.345c-3.24-10.257-7.612-21.163-12.963-32.432c5.106-11 9.31-21.767 12.459-31.957c2.619.758 5.16 1.557 7.61 2.4c23.69 8.156 38.14 20.213 38.14 29.504c0 9.896-15.606 22.743-40.946 31.14Zm-10.514 20.834c2.562 12.94 2.927 24.64 1.23 33.787c-1.524 8.219-4.59 13.698-8.382 15.893c-8.067 4.67-25.32-1.4-43.927-17.412a156.726 156.726 0 0 1-6.437-5.87c7.214-7.889 14.423-17.06 21.459-27.246c12.376-1.098 24.068-2.894 34.671-5.345a134.17 134.17 0 0 1 1.386 6.193ZM87.276 214.515c-7.882 2.783-14.16 2.863-17.955.675c-8.075-4.657-11.432-22.636-6.853-46.752a156.923 156.923 0 0 1 1.869-8.499c10.486 2.32 22.093 3.988 34.498 4.994c7.084 9.967 14.501 19.128 21.976 27.15a134.668 134.668 0 0 1-4.877 4.492c-9.933 8.682-19.886 14.842-28.658 17.94ZM50.35 144.747c-12.483-4.267-22.792-9.812-29.858-15.863c-6.35-5.437-9.555-10.836-9.555-15.216c0-9.322 13.897-21.212 37.076-29.293c2.813-.98 5.757-1.905 8.812-2.773c3.204 10.42 7.406 21.315 12.477 32.332c-5.137 11.18-9.399 22.249-12.634 32.792a134.718 134.718 0 0 1-6.318-1.979Zm12.378-84.26c-4.811-24.587-1.616-43.134 6.425-47.789c8.564-4.958 27.502 2.111 47.463 19.835a144.318 144.318 0 0 1 3.841 3.545c-7.438 7.987-14.787 17.08-21.808 26.988c-12.04 1.116-23.565 2.908-34.161 5.309a160.342 160.342 0 0 1-1.76-7.887Zm110.427 27.268a347.8 347.8 0 0 0-7.785-12.803c8.168 1.033 15.994 2.404 23.343 4.08c-2.206 7.072-4.956 14.465-8.193 22.045a381.151 381.151 0 0 0-7.365-13.322Zm-45.032-43.861c5.044 5.465 10.096 11.566 15.065 18.186a322.04 322.04 0 0 0-30.257-.006c4.974-6.559 10.069-12.652 15.192-18.18ZM82.802 87.83a323.167 323.167 0 0 0-7.227 13.238c-3.184-7.553-5.909-14.98-8.134-22.152c7.304-1.634 15.093-2.97 23.209-3.984a321.524 321.524 0 0 0-7.848 12.897Zm8.081 65.352c-8.385-.936-16.291-2.203-23.593-3.793c2.26-7.3 5.045-14.885 8.298-22.6a321.187 321.187 0 0 0 7.257 13.246c2.594 4.48 5.28 8.868 8.038 13.147Zm37.542 31.03c-5.184-5.592-10.354-11.779-15.403-18.433c4.902.192 9.899.29 14.978.29c5.218 0 10.376-.117 15.453-.343c-4.985 6.774-10.018 12.97-15.028 18.486Zm52.198-57.817c3.422 7.8 6.306 15.345 8.596 22.52c-7.422 1.694-15.436 3.058-23.88 4.071a382.417 382.417 0 0 0 7.859-13.026a347.403 347.403 0 0 0 7.425-13.565Zm-16.898 8.101a358.557 358.557 0 0 1-12.281 19.815a329.4 329.4 0 0 1-23.444.823c-7.967 0-15.716-.248-23.178-.732a310.202 310.202 0 0 1-12.513-19.846h.001a307.41 307.41 0 0 1-10.923-20.627a310.278 310.278 0 0 1 10.89-20.637l-.001.001a307.318 307.318 0 0 1 12.413-19.761c7.613-.576 15.42-.876 23.31-.876H128c7.926 0 15.743.303 23.354.883a329.357 329.357 0 0 1 12.335 19.695a358.489 358.489 0 0 1 11.036 20.54a329.472 329.472 0 0 1-11 20.722Zm22.56-122.124c8.572 4.944 11.906 24.881 6.52 51.026c-.344 1.668-.73 3.367-1.15 5.09c-10.622-2.452-22.155-4.275-34.23-5.408c-7.034-10.017-14.323-19.124-21.64-27.008a160.789 160.789 0 0 1 5.888-5.4c18.9-16.447 36.564-22.941 44.612-18.3ZM128 90.808c12.625 0 22.86 10.235 22.86 22.86s-10.235 22.86-22.86 22.86s-22.86-10.235-22.86-22.86s10.235-22.86 22.86-22.86Z"></path></svg>
--- a/src/components/Planet/PageTable.tsx
+++ b/src/components/Planet/PageTable.tsx
@@ -0,0 +1,82 @@
 import { RecordType } from '@/components/Stars/interface';
 import { StarModel } from '@/components/Stars/StarModel';
 import StarTable from '@/components/Stars/StarTable';
 import { StarTableProps } from '@/components/Stars/StarTable/interface';
 import { observer } from 'mobx-react';
 import { useEffect } from 'react';
 const PageTable = (
  props: StarTableProps & {
    model: StarModel;
    defaultParams?: RecordType;
    defaultOrders?: RecordType;
    onLoading?: () => void;
  },
 ) => {
  const {
    model,
    model: {
      data: { page: data },
      params: { page: params },
    },
    columns,
    defaultParams,
    defaultOrders,
    onLoading,
    onQueryClick,
    ...rest
  } = props;
  /**
   * 页面初始化加载数据
   */
  useEffect(() => {
    onLoading ? onLoading!() : model.page({ page: 1, size: 10, params: defaultParams, orders: defaultOrders });
  }, []);
  const ds = data && data.data ? data.data.map((d: any) => ({ key: d.id, ...d })) : [];
  return (
    <StarTable
      columns={columns}
      dataSource={ds}
      pagination={{
        pageSize: data.size,
        current: data.page,
        total: data.total,
      }}
      onQueryClick={(values: RecordType) => {
        params.page = 1;
        params.params = { ...defaultParams };
        for (const key of Object.keys(values)) {
          if (values[key] !== undefined && values[key] !== null && values[key] !== '') {
            params.params[key] = values[key];
          }
        }
        model.page(params);
        onQueryClick && onQueryClick(values);
      }}
      onPageChanged={(page, size) => {
        params.page = page;
        params.size = size;
        model.page(params);
      }}
      onRemoveClick={async (v) => {
        await model.remove(v);
        model.page(params);
      }}
      onSaveClick={async (values: any, mode) => {
        if (mode === 'add') await model.add(values);
        else await model.update(values);
        model.page(params);
      }}
      operation
      toolbar
      autoForm
      autoQuery
      {...rest}
    />
  );
 };
 const ObserverPageTable = observer(PageTable);
 export default ObserverPageTable;
--- a/src/components/SelectLang/index.tsx
+++ b/src/components/SelectLang/index.tsx
@@ -0,0 +1,434 @@
 import { useSetting } from '@/models';
 import { Dropdown, DropDownProps } from 'antd';
 import React from 'react';
 import { RecordType } from '../Stars/interface';
 export interface HeaderDropdownProps extends DropDownProps {
  overlayClassName?: string;
  placement?: 'bottomLeft' | 'bottomRight' | 'topLeft' | 'topCenter' | 'topRight' | 'bottomCenter';
 }
 const HeaderDropdown: React.FC<HeaderDropdownProps> = ({ overlayClassName: cls, ...restProps }) => (
  <Dropdown overlayClassName={cls} {...restProps} />
 );
 interface LocalData {
  lang: string;
  label?: string;
  icon?: string;
  title?: string;
 }
 interface SelectLangProps {
  globalIconClassName?: string;
  postLocalesData?: (locales: LocalData[]) => LocalData[];
  onItemClick?: (params: RecordType) => void;
  className?: string;
  icon?: React.ReactNode;
  style?: React.CSSProperties;
 }
 const defaultLangUConfigMap = {
  'ar-EG': {
    lang: 'ar-EG',
    label: 'العربية',
    icon: '🇪🇬',
    title: 'لغة',
  },
  'az-AZ': {
    lang: 'az-AZ',
    label: 'Azərbaycan dili',
    icon: '🇦🇿',
    title: 'Dil',
  },
  'bg-BG': {
    lang: 'bg-BG',
    label: 'Български език',
    icon: '🇧🇬',
    title: 'език',
  },
  'bn-BD': {
    lang: 'bn-BD',
    label: 'বাংলা',
    icon: '🇧🇩',
    title: 'ভাষা',
  },
  'ca-ES': {
    lang: 'ca-ES',
    label: 'Catalá',
    icon: '🇨🇦',
    title: 'llengua',
  },
  'cs-CZ': {
    lang: 'cs-CZ',
    label: 'Čeština',
    icon: '🇨🇿',
    title: 'Jazyk',
  },
  'da-DK': {
    lang: 'da-DK',
    label: 'Dansk',
    icon: '🇩🇰',
    title: 'Sprog',
  },
  'de-DE': {
    lang: 'de-DE',
    label: 'Deutsch',
    icon: '🇩🇪',
    title: 'Sprache',
  },
  'el-GR': {
    lang: 'el-GR',
    label: 'Ελληνικά',
    icon: '🇬🇷',
    title: 'Γλώσσα',
  },
  'en-GB': {
    lang: 'en-GB',
    label: 'English',
    icon: '🇬🇧',
    title: 'Language',
  },
  'en-US': {
    lang: 'en-US',
    label: 'English',
    icon: '🇺🇸',
    title: 'Language',
  },
  'es-ES': {
    lang: 'es-ES',
    label: 'Español',
    icon: '🇪🇸',
    title: 'Idioma',
  },
  'et-EE': {
    lang: 'et-EE',
    label: 'Eesti',
    icon: '🇪🇪',
    title: 'Keel',
  },
  'fa-IR': {
    lang: 'fa-IR',
    label: 'فارسی',
    icon: '🇮🇷',
    title: 'زبان',
  },
  'fi-FI': {
    lang: 'fi-FI',
    label: 'Suomi',
    icon: '🇫🇮',
    title: 'Kieli',
  },
  'fr-BE': {
    lang: 'fr-BE',
    label: 'Français',
    icon: '🇧🇪',
    title: 'Langue',
  },
  'fr-FR': {
    lang: 'fr-FR',
    label: 'Français',
    icon: '🇫🇷',
    title: 'Langue',
  },
  'ga-IE': {
    lang: 'ga-IE',
    label: 'Gaeilge',
    icon: '🇮🇪',
    title: 'Teanga',
  },
  'he-IL': {
    lang: 'he-IL',
    label: 'עברית',
    icon: '🇮🇱',
    title: 'שפה',
  },
  'hi-IN': {
    lang: 'hi-IN',
    label: 'हिन्दी, हिंदी',
    icon: '🇮🇳',
    title: 'भाषा: हिन्दी',
  },
  'hr-HR': {
    lang: 'hr-HR',
    label: 'Hrvatski jezik',
    icon: '🇭🇷',
    title: 'Jezik',
  },
  'hu-HU': {
    lang: 'hu-HU',
    label: 'Magyar',
    icon: '🇭🇺',
    title: 'Nyelv',
  },
  'hy-AM': {
    lang: 'hu-HU',
    label: 'Հայերեն',
    icon: '🇦🇲',
    title: 'Լեզու',
  },
  'id-ID': {
    lang: 'id-ID',
    label: 'Bahasa Indonesia',
    icon: '🇮🇩',
    title: 'Bahasa',
  },
  'it-IT': {
    lang: 'it-IT',
    label: 'Italiano',
    icon: '🇮🇹',
    title: 'Linguaggio',
  },
  'is-IS': {
    lang: 'is-IS',
    label: 'Íslenska',
    icon: '🇮🇸',
    title: 'Tungumál',
  },
  'ja-JP': {
    lang: 'ja-JP',
    label: '日本語',
    icon: '🇯🇵',
    title: '言語',
  },
  'ku-IQ': {
    lang: 'ku-IQ',
    label: 'کوردی',
    icon: '🇮🇶',
    title: 'Ziman',
  },
  'kn-IN': {
    lang: 'kn-IN',
    label: 'ಕನ್ನಡ',
    icon: '🇮🇳',
    title: 'ಭಾಷೆ',
  },
  'ko-KR': {
    lang: 'ko-KR',
    label: '한국어',
    icon: '🇰🇷',
    title: '언어',
  },
  'lv-LV': {
    lang: 'lv-LV',
    label: 'Latviešu valoda',
    icon: '🇱🇮',
    title: 'Kalba',
  },
  'mk-MK': {
    lang: 'mk-MK',
    label: 'македонски јазик',
    icon: '🇲🇰',
    title: 'Јазик',
  },
  'mn-MN': {
    lang: 'mn-MN',
    label: 'Монгол хэл',
    icon: '🇲🇳',
    title: 'Хэл',
  },
  'ms-MY': {
    lang: 'ms-MY',
    label: 'بهاس ملايو‎',
    icon: '🇲🇾',
    title: 'Bahasa',
  },
  'nb-NO': {
    lang: 'nb-NO',
    label: 'Norsk',
    icon: '🇳🇴',
    title: 'Språk',
  },
  'ne-NP': {
    lang: 'ne-NP',
    label: 'नेपाली',
    icon: '🇳🇵',
    title: 'भाषा',
  },
  'nl-BE': {
    lang: 'nl-BE',
    label: 'Vlaams',
    icon: '🇧🇪',
    title: 'Taal',
  },
  'nl-NL': {
    lang: 'nl-NL',
    label: 'Nederlands',
    icon: '🇳🇱',
    title: 'Taal',
  },
  'pl-PL': {
    lang: 'pl-PL',
    label: 'Polski',
    icon: '🇵🇱',
    title: 'Język',
  },
  'pt-BR': {
    lang: 'pt-BR',
    label: 'Português',
    icon: '🇧🇷',
    title: 'Idiomas',
  },
  'pt-PT': {
    lang: 'pt-PT',
    label: 'Português',
    icon: '🇵🇹',
    title: 'Idiomas',
  },
  'ro-RO': {
    lang: 'ro-RO',
    label: 'Română',
    icon: '🇷🇴',
    title: 'Limba',
  },
  'ru-RU': {
    lang: 'ru-RU',
    label: 'Русский',
    icon: '🇷🇺',
    title: 'язык',
  },
  'sk-SK': {
    lang: 'sk-SK',
    label: 'Slovenčina',
    icon: '🇸🇰',
    title: 'Jazyk',
  },
  'sr-RS': {
    lang: 'sr-RS',
    label: 'српски језик',
    icon: '🇸🇷',
    title: 'Језик',
  },
  'sl-SI': {
    lang: 'sl-SI',
    label: 'Slovenščina',
    icon: '🇸🇱',
    title: 'Jezik',
  },
  'sv-SE': {
    lang: 'sv-SE',
    label: 'Svenska',
    icon: '🇸🇪',
    title: 'Språk',
  },
  'ta-IN': {
    lang: 'ta-IN',
    label: 'தமிழ்',
    icon: '🇮🇳',
    title: 'மொழி',
  },
  'th-TH': {
    lang: 'th-TH',
    label: 'ไทย',
    icon: '🇹🇭',
    title: 'ภาษา',
  },
  'tr-TR': {
    lang: 'tr-TR',
    label: 'Türkçe',
    icon: '🇹🇷',
    title: 'Dil',
  },
  'uk-UA': {
    lang: 'uk-UA',
    label: 'Українська',
    icon: '🇺🇰',
    title: 'Мова',
  },
  'vi-VN': {
    lang: 'vi-VN',
    label: 'Tiếng Việt',
    icon: '🇻🇳',
    title: 'Ngôn ngữ',
  },
  'zh-CN': {
    lang: 'zh-CN',
    label: '简体中文',
    icon: '🇨🇳',
    title: '语言',
  },
  'zh-TW': {
    lang: 'zh-TW',
    label: '繁體中文',
    icon: '🇭🇰',
    title: '語言',
  },
 };
 const getAllLocales = (): string[] => {
  // 返回所有可用语言的逻辑
  return ['en-US', 'zh-CN']; // 示例返回值
 };
 export const SelectLang: React.FC<SelectLangProps> = (props) => {
  const { globalIconClassName, postLocalesData, onItemClick, icon, style, ...restProps } = props;
  const setting = useSetting();
  const defaultLangUConfig = getAllLocales().map(
    (key) =>
      defaultLangUConfigMap[key as keyof typeof defaultLangUConfigMap] || {
        lang: key,
        label: key,
        icon: '🌐',
        title: key,
      },
  );
  const allLangUIConfig = postLocalesData?.(defaultLangUConfig) || defaultLangUConfig;
  const handleClick = onItemClick
    ? (params: RecordType) => onItemClick(params)
    : ({ key }: RecordType) => {
        setting.setLocale(key);
      };
  const menuItemStyle = { minWidth: '160px' };
  const menuItemIconStyle = { marginRight: '8px' };
  const langMenu = {
    selectedKeys: [setting.locale],
    onClick: handleClick,
    items: allLangUIConfig.map((localeObj: RecordType) => ({
      key: localeObj.lang || localeObj.key,
      style: menuItemStyle,
      label: (
        <>
          <span role="img" aria-label={localeObj?.label || 'en-US'} style={menuItemIconStyle}>
            {localeObj?.icon || '🌐'}
          </span>
          {localeObj?.label || 'en-US'}
        </>
      ),
    })),
  };
  const inlineStyle = {
    cursor: 'pointer',
    padding: '12px',
    display: 'inline-flex',
    alignItems: 'center',
    justifyContent: 'center',
    fontSize: 18,
    verticalAlign: 'middle',
    ...style,
  };
  return (
    <HeaderDropdown menu={langMenu} placement="bottomRight" {...restProps}>
      <span className={globalIconClassName} style={inlineStyle}>
        <i className="anticon">
          {icon ? (
            icon
          ) : (
            <svg viewBox="0 0 24 24" focusable="false" width="1em" height="1em" fill="currentColor" aria-hidden="true">
              <path d="M0 0h24v24H0z" fill="none" />
              <path
                d="M12.87 15.07l-2.54-2.51.03-.03c1.74-1.94 2.98-4.17 3.71-6.53H17V4h-7V2H8v2H1v1.99h11.17C11.5 7.92 10.44 9.75 9 11.35 8.07 10.32 7.3 9.19 6.69 8h-2c.73 1.63 1.73 3.17 2.98 4.56l-5.09 5.02L4 19l5-5 3.11 3.11.76-2.04zM18.5 10h-2L12 22h2l1.12-3h4.75L21 22h2l-4.5-12zm-2.62 7l1.62-4.33L19.12 17h-3.24z "
                className="css-c4d79v"
              />
            </svg>
          )}
        </i>
      </span>
    </HeaderDropdown>
  );
 };
--- a/src/components/Stars/StarDatePicker/index.tsx
+++ b/src/components/Stars/StarDatePicker/index.tsx
@@ -0,0 +1,80 @@
 import zh_CN from 'antd/es/date-picker/locale/zh_CN';
 import DatePicker, { DatePickerProps, RangePickerProps } from 'antd/lib/date-picker';
 import datetime, { DateTime, isDateTime } from '../utils/datetime';
 import React from 'react';
 export type StarDatePickerProps = Omit<DatePickerProps, 'onChange'> & {
  format?: string;
  onChange?: (dt: string) => void;
 };
 export type StarDateRangePickerProps = Omit<RangePickerProps, 'value'> & {
  value?: string[];
  format?: string;
  showTime?: boolean;
  onRangeChange?: (range: string[]) => void;
 };
 const StarDatePicker: React.FC<StarDatePickerProps> = (props) => {
  const { value, format, onChange, style, ...rest } = props;
  //格式化时间
  let date: DateTime | undefined;
  if (isDateTime(value)) date = value;
  else date = value ? datetime(value) : undefined;
  const restProps = rest as DatePickerProps;
  return (
    <DatePicker
      style={style}
      locale={zh_CN}
      value={date}
      onChange={(m) => {
        if (m) {
          onChange!(m.format(format || 'yyyy-MM-DDTHH:mm:ss.SSSZ'));
        }
      }}
      {...restProps}
    />
  );
 };
 export default StarDatePicker;
 export const StarDateRangePicker: React.FC<StarDateRangePickerProps> = (props) => {
  const { value, format, style, showTime, onRangeChange, onChange, ...rest } = props;
  const moments: [DateTime | null, DateTime | null] = [null, null];
  if (value) {
    if (value[0]) moments[0] = datetime(value[0]);
    if (value[1]) moments[1] = datetime(value[1]);
  }
  return (
    <DatePicker.RangePicker
      showTime={showTime}
      style={style}
      locale={zh_CN}
      value={moments}
      onChange={(m, s) => {
        let times: string[] = [];
        if (showTime) {
          times = m
            ? [m[0]!.format(format || 'yyyy-MM-DDTHH:mm:ss.SSSZ'), m[1]!.format(format || 'yyyy-MM-DDTHH:mm:ss.SSSZ')]
            : [];
        } else {
          times = m
            ? [
                m[0]!.startOf('day').format(format || 'yyyy-MM-DDTHH:mm:ss.SSSZ'),
                m[1]!.endOf('day').format(format || 'yyyy-MM-DDTHH:mm:ss.SSSZ'),
              ]
            : [];
        }
        if (m) {
          onRangeChange && onRangeChange(times);
        }
        onChange && onChange(m, s);
      }}
      {...rest}
    />
  );
 };
--- a/src/components/Stars/StarElement/index.tsx
+++ b/src/components/Stars/StarElement/index.tsx
@@ -0,0 +1,190 @@
 import React, { JSX, useEffect, useState } from 'react';
 import {
  AutoComplete,
  AutoCompleteProps,
  Input,
  InputNumber,
  InputNumberProps,
  InputProps,
  Select,
  SelectProps,
  Switch,
  SwitchProps,
  TreeSelect,
  TreeSelectProps,
 } from 'antd';
 import { PasswordProps } from 'antd/es/input';
 import Password from 'antd/lib/input/Password';
 import TextArea, { TextAreaProps } from 'antd/lib/input/TextArea';
 import StarDatePicker, { StarDatePickerProps, StarDateRangePicker, StarDateRangePickerProps } from '../StarDatePicker';
 import StarLabel from '../StarLabel';
 import { StarMoneyInput, StarMoneyLabel } from '../StarMoney';
 import { StarMoneyProps } from '../StarMoney/interface';
 import { RecordType } from '../interface';
 import { ElementType, StarElementOption, StarElementProps } from './type';
 /**
 * 组件映射函数，用于根据组件类型返回对应的React组件
 * 使用组件映射代替冗长的switch语句，提高代码可维护性
 */
 const ElementMap: Record<ElementType, (props: StarElementProps) => JSX.Element> = {
  [ElementType.Label]: (props) => {
    const { style, value, ...rest } = props as RecordType;
    return <StarLabel {...rest} value={value || ''} style={style} />;
  },
  [ElementType.TextArea]: (props) => {
    const elementProps = props as TextAreaProps;
    return <TextArea rows={4} {...elementProps} />;
  },
  [ElementType.AutoComplete]: (props) => {
    const { style, selectOptions, ...rest } = props;
    const elementProps = rest as AutoCompleteProps;
    return (
      <AutoComplete
        style={{ width: '100%', ...style }}
        options={selectOptions}
        filterOption={(i, o) => {
          let v = o?.value;
          if (v === undefined || v === null) return false;
          if (typeof v === 'number') v = v.toString();
          return (v?.toUpperCase() || '').indexOf(i.toUpperCase()) > -1;
        }}
        disabled={false}
        {...elementProps}
      />
    );
  },
  [ElementType.Password]: (props) => {
    const elementProps = props as PasswordProps;
    return <Password {...elementProps} />;
  },
  [ElementType.Number]: (props) => {
    const { style, ...rest } = props;
    const elementProps = rest as InputNumberProps;
    return <InputNumber style={{ width: '100%', ...style }} {...elementProps} />;
  },
  [ElementType.Boolean]: (props) => {
    const { style, readOnly, ...rest } = props;
    const elementProps = rest as SwitchProps;
    return <Switch style={style} disabled={readOnly} {...elementProps} />;
  },
  [ElementType.Select]: (props) => {
    const { readOnly, selectOptions, style, ...rest } = props;
    const elementProps = rest as SelectProps;
    return (
      <Select
        style={{ width: '100%', ...style }}
        disabled={readOnly}
        options={selectOptions}
        showSearch={props.searching !== undefined && props.searching !== false}
        filterOption={props.searching !== undefined && typeof props.searching !== 'function'}
        onSearch={
          props.searching
            ? async (v) => {
                if (typeof props.searching === 'function') {
                  const result = await props.searching(v);
                  if (props.setSelectOptions) {
                    props.setSelectOptions(result);
                  }
                }
              }
            : undefined
        }
        {...elementProps}
      />
    );
  },
  [ElementType.Multiselect]: (props) => {
    const { readOnly, selectOptions, style, ...rest } = props;
    const elementProps = rest as SelectProps;
    return (
      <Select
        style={{ width: '100%', ...style }}
        disabled={readOnly}
        options={selectOptions}
        mode="multiple"
        showSearch={props.searching !== undefined && props.searching !== false}
        filterOption={props.searching !== undefined && typeof props.searching !== 'function'}
        notFoundContent={props.searching ? null : undefined}
        onSearch={
          props.searching
            ? async (v) => {
                if (typeof props.searching === 'function') {
                  const result = await props.searching(v);
                  if (props.setSelectOptions) {
                    props.setSelectOptions(result);
                  }
                }
              }
            : undefined
        }
        {...elementProps}
      />
    );
  },
  [ElementType.TreeSelect]: (props) => {
    const { style, ...rest } = props;
    const elementProps = rest as TreeSelectProps;
    return <TreeSelect style={{ width: '100%', ...style }} {...elementProps} />;
  },
  [ElementType.Datetime]: (props) => {
    const { style, ...rest } = props;
    const elementProps = rest as StarDatePickerProps;
    return <StarDatePicker style={{ width: '100%', ...style }} {...elementProps} />;
  },
  [ElementType.DateRange]: (props) => {
    const { style, ...rest } = props;
    const elementProps = rest as StarDateRangePickerProps;
    return <StarDateRangePicker style={{ width: '100%', ...style }} {...elementProps} />;
  },
  [ElementType.MoneyInput]: (props) => {
    const elementProps = props as StarMoneyProps & InputNumberProps;
    return <StarMoneyInput {...elementProps} />;
  },
  [ElementType.MoneyLabel]: (props) => {
    const elementProps = props as StarMoneyProps;
    return <StarMoneyLabel {...elementProps} />;
  },
  [ElementType.Input]: (props) => {
    const { style, ...rest } = props;
    const elementProps = rest as InputProps;
    return <Input style={{ width: '100%', ...style }} {...elementProps} />;
  },
  [ElementType.TimeRange]: (props) => {
    // 这里需要根据实际情况实现timerange组件
    const { style, ...rest } = props;
    const elementProps = rest as InputProps;
    return <Input style={{ width: '100%', ...style }} {...elementProps} />;
  },
 };
 /**
 * 星级元素组件，根据type属性渲染不同的表单控件
 */
 const StarElement: React.FC<StarElementProps> = (props) => {
  const [selectOptions, setSelectOptions] = useState<StarElementOption[]>([]);
  const { type = ElementType.Input, options, render, ...rest } = props;
  useEffect(() => {
    setSelectOptions(options || []);
  }, [options]);
  // 使用自定义渲染函数
  if (render) {
    return render(props);
  }
  // 从映射中获取对应的组件渲染函数
  const RenderComponent = ElementMap[type as ElementType];
  if ([ElementType.Select, ElementType.Multiselect, ElementType.AutoComplete].includes(type)) {
    return RenderComponent({
      ...rest,
      selectOptions,
      setSelectOptions,
    });
  } else return RenderComponent(rest);
 };
 export default StarElement;
--- a/src/components/Stars/StarElement/type.ts
+++ b/src/components/Stars/StarElement/type.ts
@@ -0,0 +1,73 @@
 import { InputNumberProps, InputProps, SelectProps, SwitchProps, TreeSelectProps } from 'antd';
 import { PasswordProps } from 'antd/es/input';
 import { TextAreaProps } from 'antd/lib/input';
 import { JSX } from 'react';
 import { RecordType } from '../interface';
 import { StarDatePickerProps, StarDateRangePickerProps } from '../StarDatePicker';
 import { StarMoneyProps } from '../StarMoney/interface';
 export interface StarElementOption {
  value: string | number;
  label: string;
  [key: string]: any; // 允许其他属性
 }
 export enum ElementType {
  TextArea,
  AutoComplete,
  Datetime,
  DateRange,
  Boolean,
  Label,
  Multiselect,
  Number,
  MoneyInput,
  MoneyLabel,
  Select,
  Input,
  TimeRange,
  TreeSelect,
  Password,
 }
 // 每种组件类型对应的属性类型映射
 export interface ComponentPropsMap {
  [ElementType.Input]: InputProps;
  [ElementType.TextArea]: TextAreaProps;
  [ElementType.AutoComplete]: SelectProps;
  [ElementType.Password]: PasswordProps;
  [ElementType.Number]: InputNumberProps;
  [ElementType.Boolean]: SwitchProps;
  [ElementType.Select]: SelectProps;
  [ElementType.Multiselect]: SelectProps;
  [ElementType.TreeSelect]: TreeSelectProps;
  [ElementType.Datetime]: StarDatePickerProps;
  [ElementType.DateRange]: StarDateRangePickerProps;
  [ElementType.MoneyInput]: StarMoneyProps & InputNumberProps;
  [ElementType.MoneyLabel]: StarMoneyProps;
  [ElementType.Label]: RecordType; // StarLabel的属性
  [ElementType.TimeRange]: StarDateRangePickerProps; // 时间范围控件的属性
 }
 // 通用基础属性
 export interface StarElementBaseProps {
  type?: ElementType;
  options?: StarElementOption[];
  readOnly?: boolean;
  searching?: boolean | SearchFunction;
  style?: React.CSSProperties;
  render?: (props: StarElementProps) => JSX.Element;
  selectOptions?: StarElementOption[];
  setSelectOptions?: (options: StarElementOption[]) => void;
 }
 // 搜索函数类型定义
 export type SearchFunction = (value: string) => Promise<StarElementOption[]>;
 // 组件属性联合类型，根据type推导具体类型
 export type StarElementProps = StarElementBaseProps &
  Partial<
    {
      [K in ElementType]: ComponentPropsMap[K];
    }[ElementType]
  >;
--- a/src/components/Stars/StarForm/index.tsx
+++ b/src/components/Stars/StarForm/index.tsx
@@ -0,0 +1,96 @@
 import { Col, Form, Row } from 'antd';
 import { ColProps } from 'antd/lib/col';
 import FormItem from 'antd/lib/form/FormItem';
 import StarElement from '../StarElement';
 import { ElementType, StarElementProps } from '../StarElement/type';
 import StarLayout from '../StarLayout';
 import { StarFormField, StarFormProps } from './type';
 import { formColLayout } from './layout';
 import { JSX } from 'react';
 /**
 * 获取表单的布局信息
 * @param layout 布局信息
 */
 const loadLayout = (config?: number | { itemCol: ColProps; labelCol?: ColProps; wrapperCol?: ColProps }) => {
  let layout = config;
  if (!layout) layout = 1;
  let itemCol: ColProps;
  let labelCol = { ...formColLayout.labelCol };
  let wrapperCol = { ...formColLayout.wrapperCol };
  if (typeof layout === 'number') {
    switch (layout) {
      case 2:
        itemCol = StarLayout.twoPerRow;
        break;
      case 3:
        itemCol = StarLayout.threePerRow;
        break;
      case 4:
        itemCol = StarLayout.fourPerRow;
        break;
      default:
        itemCol = StarLayout.onePerRow;
    }
  } else {
    itemCol = layout.itemCol;
    if (layout.labelCol) labelCol = layout.labelCol;
    if (layout.wrapperCol) wrapperCol = layout.wrapperCol;
  }
  return { itemCol, labelCol, wrapperCol };
 };
 const StarForm: React.FC<StarFormProps> = (props) => {
  const { style, className, colLayout, form, fields, entity, readonly, ...rest } = props;
  // 定义样式
  const { itemCol, labelCol, wrapperCol } = loadLayout(colLayout);
  /**
   * 渲染表单组件方法
   */
  const fieldsRender = (): JSX.Element => {
    const components: JSX.Element[] = [];
    fields.forEach((field) => {
      if (field) {
        // 过滤children传递到input等组件
        const { element: control, ...rest } = field;
        let controlProps: StarElementProps = {};
        if (Object.prototype.hasOwnProperty.call(ElementType, control as ElementType))
          controlProps.type = control as ElementType;
        else {
          controlProps = { ...(control as StarElementProps) };
        }
        // 一些特殊处理
        const extra: StarFormField = {};
        // Switch的值字段是checked
        if (controlProps?.type === ElementType.Boolean) extra.valuePropName = 'checked';
        if (controlProps?.type === ElementType.DateRange) extra.trigger = 'onRangeChange';
        components.push(
          <Col key={field.id ? field.id! : field.name!.toString()} {...itemCol}>
            <FormItem
              name={field.name}
              label={field.label}
              labelCol={labelCol}
              wrapperCol={wrapperCol}
              {...rest}
              {...extra}
            >
              <StarElement readOnly={readonly} {...controlProps} />
            </FormItem>
          </Col>,
        );
      }
    });
    return <Row>{components}</Row>;
  };
  return (
    <Form style={style} className={className} form={form} initialValues={entity} {...rest}>
      {fieldsRender()}
      {props.children as React.ReactNode}
    </Form>
  );
 };
 export default StarForm;
--- a/src/components/Stars/StarForm/layout.ts
+++ b/src/components/Stars/StarForm/layout.ts
@@ -0,0 +1,6 @@
 import { ColProps } from 'antd/lib/col';
 export const formColLayout = {
  labelCol: { xxl: 6, xl: 6, lg: 8, md: 10, sm: 24, xs: 24 } as ColProps,
  wrapperCol: { xxl: 18, xl: 18, lg: 16, md: 14, sm: 24, xs: 24 } as ColProps,
 };
--- a/src/components/Stars/StarForm/type.ts
+++ b/src/components/Stars/StarForm/type.ts
@@ -0,0 +1,19 @@
 import { ColProps } from 'antd';
 import { FormInstance, FormItemProps, FormProps } from 'antd/lib/form';
 import { ElementType, StarElementProps } from '../StarElement/type';
 export type StarFormField = Omit<FormItemProps, 'children'> & { element?: StarElementProps | ElementType };
 export interface StarFormProps extends Omit<FormProps, 'fields'> {
  form?: FormInstance;
  style?: React.CSSProperties;
  className?: string;
  /**
   * 表单布局, 可以为数字表示一行多少个字段, 也可以直接指定样式
   */
  colLayout?: number | { itemCol: ColProps; labelCol?: ColProps; wrapperCol?: ColProps };
  fields: StarFormField[];
  entity?: any;
  readonly?: boolean;
 }
--- a/src/components/Stars/StarFormat/index.ts
+++ b/src/components/Stars/StarFormat/index.ts
@@ -0,0 +1,30 @@
 import { FormatXMLElementFn, Options as IntlMessageFormatOptions, PrimitiveType } from 'intl-messageformat';
 import { MessageDescriptor, useIntl } from '@/define';
 /**
 * 国际化消息格式化参数接口
 */
 export interface IntlMessageDescriptor {
  /** 消息ID，用于查找翻译 */
  id: string;
  /** 默认消息，当无法找到翻译时使用 */
  defaultMessage?: string;
  /** 消息描述，用于提供上下文信息给翻译人员 */
  description?: string;
 }
 /**
 * 国际化格式化函数
 */
 export type IntlFormat = (
  descriptor: MessageDescriptor,
  values?: Record<string, PrimitiveType | FormatXMLElementFn<string, string>>,
  opts?: IntlMessageFormatOptions,
 ) => string;
 export const useIntlFormat: () => IntlFormat = () => {
  const { formatMessage } = useIntl();
  return (descriptor, values, opts) => {
    return formatMessage(descriptor, values, opts);
  };
 };
--- a/src/components/Stars/StarLabel/index.tsx
+++ b/src/components/Stars/StarLabel/index.tsx
@@ -0,0 +1,27 @@
 import React from 'react';
 import { Tooltip } from 'antd';
 import { RecordType } from '../interface';
 /**
 * 星级标签组件，用于显示文本内容，可选带提示框
 */
 const StarLabel: React.FC<RecordType & {
  tooltip?: boolean;
  format?: (value: any) => string;
 }> = (props) => {
  const { value, tooltip, format, ...rest } = props;
  //获取输出
  let content: string = '';
  if (format) content = format(value);
  else content = value?.toString() || '';
  return (
    <span {...rest} className="-">
      {tooltip ? <Tooltip title={content}>{content}</Tooltip> : content}
    </span>
  );
 };
 export default StarLabel;
--- a/src/components/Stars/StarLayout/index.ts
+++ b/src/components/Stars/StarLayout/index.ts
@@ -0,0 +1,23 @@
 import { ColProps } from 'antd/lib/col';
 /**
 * 一行展示四条数据
 */
 export default {
  fourPerRow: { xxl: 6, xl: 6, lg: 8, md: 12, sm: 24, xs: 24 } as ColProps,
  /**
   * 一行展示三条数据
   */
  threePerRow: { xxl: 8, xl: 8, lg: 12, md: 12, sm: 24, xs: 24 } as ColProps,
  /**
   * 一行展示两条数据
   */
  twoPerRow: { xxl: 12, xl: 12, lg: 12, md: 12, sm: 24, xs: 24 } as ColProps,
  /**
   * 一行展示两条数据
   */
  onePerRow: { span: 24 } as ColProps,
 };
--- a/src/components/Stars/StarModal/index.tsx
+++ b/src/components/Stars/StarModal/index.tsx
@@ -0,0 +1,35 @@
 import React, { useEffect, useState, ReactNode } from 'react';
 import Modal, { ModalProps } from 'antd/lib/modal';
 import { StarProps } from '../interface';
 /**
 * 星级模态框组件，基于Antd Modal的增强组件
 * 提供国际化和组件生命周期管理功能
 */
 const StarModal: React.FC<ModalProps & StarProps & { children: ReactNode }> = (props) => {
  const { open, destroyOnClose, children, format: formate, ...rest } = props;
  const [exist, setExist] = useState<boolean | undefined>(open);
  useEffect(() => {
    if (open) setExist(open);
  }, [open]);
  const elements = exist ? (
    <Modal
      destroyOnClose={destroyOnClose}
      open={open}
      afterClose={() => setExist(false)}
      okText={formate ? formate({ id: 'confirm' }) : '确定'}
      cancelText={formate ? formate({ id: 'cancel' }) : '取消'}
      {...rest}
    >
      {children}
    </Modal>
  ) : (
    <div />
  );
  return elements;
 };
 export default StarModal;
--- a/src/components/Stars/StarModel/index.ts
+++ b/src/components/Stars/StarModel/index.ts
@@ -0,0 +1,72 @@
 import { StarService } from '@/components/Stars/StarService';
 import { StarMessage } from '../StarRequest/message';
 import { action, flow, makeObservable, observable } from 'mobx';
 import type { RecordType } from '../interface';
 import type { StarModelData, StarModelParam, StarParams } from './interface';
 export class StarModel {
  service: StarService;
  constructor(service: StarService) {
    this.service = service;
    makeObservable(this);
  }
  @observable
  params: StarModelParam = { list: {}, page: { size: 10, page: 1 } };
  @observable
  data: StarModelData = {
    entity: {},
    list: [],
    page: { size: 10, page: 1, total: 0 },
  };
  @action
  setData(data: Partial<StarModelData>) {
    this.data = { ...this.data, ...data };
  }
  @flow
  *add(entity: RecordType) {
    const msg: StarMessage = yield this.service.add(entity);
    msg.success(true);
  }
  @flow
  *update(entity: RecordType) {
    const msg: StarMessage = yield this.service.update(entity);
    msg.success(true);
  }
  @flow
  *remove(id: number | string) {
    const msg: StarMessage = yield this.service.remove(id);
    msg.success(true);
  }
  @flow
  *get(id: number | string) {
    const msg: StarMessage = yield this.service.get(id);
    if (msg.success()) {
      this.data.entity = msg.data;
    }
  }
  @flow
  *list(params?: RecordType) {
    const msg: StarMessage = yield this.service.list(params || {});
    if (msg.success()) {
      this.data.list = msg.data;
    }
  }
  @flow
  *page(params: StarParams) {
    const msg: StarMessage = yield this.service.page(params);
    if (msg.success()) {
      this.data.page = msg.data;
    }
  }
 }
--- a/src/components/Stars/StarModel/interface.ts
+++ b/src/components/Stars/StarModel/interface.ts
@@ -0,0 +1,26 @@
 import { RecordType } from '../interface';
 export interface StarParams {
  size: number;
  page: number;
  params?: RecordType;
  orders?: Record<string, 'ASC' | 'DESC'>;
 }
 export interface StarPage {
  size: number;
  page: number;
  total: number;
  data?: any[];
 }
 export interface StarModelData {
  entity: RecordType;
  list: RecordType[];
  page: StarPage;
 }
 export interface StarModelParam {
  list: RecordType;
  page: StarParams;
 }
--- a/src/components/Stars/StarMoney/component/StarMoneyInput.tsx
+++ b/src/components/Stars/StarMoney/component/StarMoneyInput.tsx
@@ -0,0 +1,26 @@
 import { InputNumber, InputNumberProps, Tooltip } from 'antd';
 import { formatCurrency } from '../../utils';
 import { StarMoneyProps } from '../interface';
 const StarMoneyInput: React.FC<StarMoneyProps & InputNumberProps> = (props) => {
  const { value, moneyFormat, ...rest } = props;
  const title = value ? formatCurrency(parseFloat(value || '') || 0) : '-';
  return (
    <Tooltip
      trigger={['focus']}
      title={moneyFormat ? title : value ? `${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',') : '-'}
      placement="topLeft"
    >
      <InputNumber
        style={{ width: '100%' }}
        formatter={(value) => `${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')}
        parser={(value) => `${value}`.replace(/\$\s?|(,*)/g, '')}
        {...rest}
        value={value}
      />
    </Tooltip>
  );
 };
 export default StarMoneyInput;
--- a/src/components/Stars/StarMoney/component/StarMoneyLabel.tsx
+++ b/src/components/Stars/StarMoney/component/StarMoneyLabel.tsx
@@ -0,0 +1,17 @@
 import { Tooltip } from 'antd';
 import { formatCurrency } from '../../utils';
 import { StarMoneyProps } from '../interface';
 const StarMoneyLabel: React.FC<StarMoneyProps> = (props) => {
  const { value, moneyFormat: format, ...rest } = props;
  const title = value ? formatCurrency(parseFloat(value || '') || 0) : 'Please input money';
  const formatValue = value ? `${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',') : '';
  return (
    <Tooltip title={format ? title : formatValue} placement="top">
      <span {...rest}>{formatValue}</span>
    </Tooltip>
  );
 };
 export default StarMoneyLabel;
--- a/src/components/Stars/StarMoney/index.ts
+++ b/src/components/Stars/StarMoney/index.ts
@@ -0,0 +1,2 @@
 export { default as StarMoneyInput } from './component/StarMoneyInput';
 export { default as StarMoneyLabel } from './component/StarMoneyLabel';
--- a/src/components/Stars/StarMoney/interface.ts
+++ b/src/components/Stars/StarMoney/interface.ts
@@ -0,0 +1,13 @@
 export type StarMoneyProps = {
  /**
   * 金额值
   */
  value?: string;
  /**
   * 是否格式化为中文金额
   */
  moneyFormat?: boolean;
  [key: string]: any;
 };
--- a/src/components/Stars/StarRequest/index.ts
+++ b/src/components/Stars/StarRequest/index.ts
@@ -0,0 +1,19 @@
 import message, { StarMessage } from './message';
 export type StarWrapperRequest = (
  url: string,
  options?: Record<string | number, any>,
 ) => Promise<any>;
 export default function StarRequest(
  proxy: StarWrapperRequest,
 ): (url: string, options?: Record<string | number, any>) => Promise<StarMessage> {
  return async function (
    url: string,
    options?: Record<string | number, any>,
  ): Promise<StarMessage> {
    const res = await proxy(url, options);
    const msg = message(res);
    return msg;
  };
 }
--- a/src/components/Stars/StarRequest/message.ts
+++ b/src/components/Stars/StarRequest/message.ts
@@ -0,0 +1,45 @@
 import { message } from 'antd';
 export interface StarMessage {
  status: number;
  data?: any;
  message?: string;
  success(show?: boolean): boolean;
 }
 export default (data: any): StarMessage => {
  let msg: StarMessage = { status: 200, success: () => true };
  if (data) {
    if (typeof data === 'object') msg = data;
    else if (typeof data === 'string') {
      msg = { ...msg, ...JSON.parse(data) };
    } else {
      msg.data = data;
    }
  }
  msg.data = msg.data ? msg.data : null;
  msg.success = (show) => {
    let success = false;
    if (msg) {
      switch (msg.status) {
        case 200:
          if (show) message.info(msg.message || '操作成功');
          success = true;
          break;
        case 400:
          message.warning(msg.message || '操作失败');
          break;
        case 500:
          message.error(msg.message || '操作错误');
          break;
        default:
          break;
      }
    }
    return success;
  };
  return msg;
 };
--- a/src/components/Stars/StarService/index.ts
+++ b/src/components/Stars/StarService/index.ts
@@ -0,0 +1,60 @@
 import { StarParams } from '../StarModel/interface';
 import StarRequest, { StarWrapperRequest } from '../StarRequest';
 import { StarMessage } from '../StarRequest/message';
 import { RecordType } from '../interface';
 import { stringify } from '../utils';
 export interface StarService {
  add: (payload: RecordType) => Promise<StarMessage>;
  update: (payload: RecordType) => Promise<StarMessage>;
  remove: (payload: number | string) => Promise<StarMessage>;
  get: (payload: number | string) => Promise<StarMessage>;
  list: (payload: RecordType) => Promise<StarMessage>;
  page: (payload: StarParams) => Promise<StarMessage>;
 }
 export default (server: string, request: StarWrapperRequest): ((url: string) => StarService) => {
  return (url: string): StarService => {
    const starRequest = StarRequest(request);
    return {
      add: async (payload) => {
        return starRequest(`${server}/${url}`, {
          method: 'POST',
          data: payload,
        });
      },
      remove: async (payload) => {
        return starRequest(`${server}/${url}/${payload}`, {
          method: 'DELETE',
        });
      },
      update: async (payload) => {
        return starRequest(`${server}/${url}/${payload.id}`, {
          method: 'PUT',
          data: payload,
        });
      },
      get: async (payload) => {
        return starRequest(`${server}/${url}/${payload}`);
      },
      list: async (payload) => {
        const urlParams = stringify(payload);
        const query = urlParams && urlParams !== '' ? `?${urlParams}` : '';
        return starRequest(`${server}/${url}${query}`);
      },
      page: async (payload) => {
        const { size, page, params, orders } = payload;
        const finalParams = { ...params };
        if (orders) {
          for (const key in orders) {
            if (Object.prototype.hasOwnProperty.call(orders, key)) {
              finalParams[`@${key}`] = orders[key];
            }
          }
        }
        const urlParams = stringify(finalParams);
        const query = urlParams && urlParams !== '' ? `?${urlParams}` : '';
        return starRequest(`${server}/${url}/size/${size}/pages/${page}${query}`);
      },
    };
  };
 };
--- a/src/components/Stars/StarStyles/index.ts
+++ b/src/components/Stars/StarStyles/index.ts
@@ -0,0 +1,8 @@
 /**
 * 导出Stars组件库样式系统
 */
 export * from './theme';
 // 重新导出主题相关内容
 import { applyTheme, defaultTheme, darkTheme } from './theme';
 export { applyTheme, defaultTheme, darkTheme }; 
--- a/src/components/Stars/StarStyles/tailwind-utils.ts
+++ b/src/components/Stars/StarStyles/tailwind-utils.ts
@@ -0,0 +1,52 @@
 /**
 * Tailwind CSS 工具类
 * 提供常用的 Tailwind 类组合，方便在组件中使用
 */
 // 布局
 export const tw = {
  // 弹性布局
  flex: 'flex',
  flexCol: 'flex flex-col',
  flexRow: 'flex flex-row',
  itemsCenter: 'items-center',
  justifyBetween: 'justify-between',
  justifyCenter: 'justify-center',
  // 间距
  p1: 'p-1',
  p2: 'p-2',
  p4: 'p-4',
  m1: 'm-1',
  m2: 'm-2',
  m4: 'm-4',
  // 宽高
  wFull: 'w-full',
  hFull: 'h-full',
  // 文本
  textCenter: 'text-center',
  textSm: 'text-sm',
  textMd: 'text-base',
  textLg: 'text-lg',
  textXl: 'text-xl',
  // 颜色
  primaryText: 'text-blue-600',
  primaryBg: 'bg-blue-500',
  // 边框和圆角
  rounded: 'rounded',
  roundedMd: 'rounded-md',
  roundedLg: 'rounded-lg',
  // 常用组合
  button: 'px-4 py-2 rounded bg-blue-500 text-white hover:bg-blue-600 transition-colors',
  card: 'p-4 bg-white rounded-lg shadow',
  // 函数：组合多个类
  cn: (...classes: string[]) => classes.filter(Boolean).join(' '),
 };
 export default tw; 
--- a/src/components/Stars/StarStyles/theme.ts
+++ b/src/components/Stars/StarStyles/theme.ts
@@ -0,0 +1,189 @@
 /**
 * Stars组件库主题系统
 * 使用CSS变量实现灵活的主题配置
 */
 /**
 * 主题相关的CSS变量名称
 */
 export const ThemeVariables = {
  // 颜色系统
  primaryColor: '--stars-primary-color',
  primaryColorHover: '--stars-primary-color-hover',
  secondaryColor: '--stars-secondary-color',
  successColor: '--stars-success-color',
  warningColor: '--stars-warning-color',
  errorColor: '--stars-error-color',
  infoColor: '--stars-info-color',
  textColor: '--stars-text-color',
  textColorSecondary: '--stars-text-color-secondary',
  disabledColor: '--stars-disabled-color',
  borderColor: '--stars-border-color',
  backgroundColor: '--stars-background-color',
  // 间距与尺寸
  spacingXs: '--stars-spacing-xs',
  spacingSm: '--stars-spacing-sm',
  spacingMd: '--stars-spacing-md',
  spacingLg: '--stars-spacing-lg',
  spacingXl: '--stars-spacing-xl',
  // 边框与圆角
  borderRadius: '--stars-border-radius',
  borderRadiusLg: '--stars-border-radius-lg',
  borderRadiusSm: '--stars-border-radius-sm',
  // 字体
  fontFamily: '--stars-font-family',
  fontSize: '--stars-font-size',
  fontSizeSm: '--stars-font-size-sm',
  fontSizeLg: '--stars-font-size-lg',
  fontSizeXl: '--stars-font-size-xl',
  // 阴影
  boxShadow: '--stars-box-shadow',
  boxShadowLg: '--stars-box-shadow-lg',
 };
 /**
 * 默认主题配置
 */
 export const defaultTheme = {
  // 颜色系统
  [ThemeVariables.primaryColor]: '#1890ff',
  [ThemeVariables.primaryColorHover]: '#40a9ff',
  [ThemeVariables.secondaryColor]: '#6c757d',
  [ThemeVariables.successColor]: '#52c41a',
  [ThemeVariables.warningColor]: '#faad14',
  [ThemeVariables.errorColor]: '#ff4d4f',
  [ThemeVariables.infoColor]: '#1890ff',
  [ThemeVariables.textColor]: 'rgba(0, 0, 0, 0.85)',
  [ThemeVariables.textColorSecondary]: 'rgba(0, 0, 0, 0.45)',
  [ThemeVariables.disabledColor]: 'rgba(0, 0, 0, 0.25)',
  [ThemeVariables.borderColor]: '#d9d9d9',
  [ThemeVariables.backgroundColor]: '#f0f2f5',
  // 间距与尺寸
  [ThemeVariables.spacingXs]: '4px',
  [ThemeVariables.spacingSm]: '8px',
  [ThemeVariables.spacingMd]: '16px',
  [ThemeVariables.spacingLg]: '24px',
  [ThemeVariables.spacingXl]: '32px',
  // 边框与圆角
  [ThemeVariables.borderRadius]: '2px',
  [ThemeVariables.borderRadiusLg]: '4px',
  [ThemeVariables.borderRadiusSm]: '1px',
  // 字体
  [ThemeVariables.fontFamily]: `-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif`,
  [ThemeVariables.fontSize]: '14px',
  [ThemeVariables.fontSizeSm]: '12px',
  [ThemeVariables.fontSizeLg]: '16px',
  [ThemeVariables.fontSizeXl]: '20px',
  // 阴影
  [ThemeVariables.boxShadow]:
    '0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05)',
  [ThemeVariables.boxShadowLg]:
    '0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05)',
 };
 /**
 * 暗色主题配置
 */
 export const darkTheme = {
  // 颜色系统
  [ThemeVariables.primaryColor]: '#177ddc',
  [ThemeVariables.primaryColorHover]: '#40a9ff',
  [ThemeVariables.secondaryColor]: '#6c757d',
  [ThemeVariables.successColor]: '#49aa19',
  [ThemeVariables.warningColor]: '#d89614',
  [ThemeVariables.errorColor]: '#a61d24',
  [ThemeVariables.infoColor]: '#177ddc',
  [ThemeVariables.textColor]: 'rgba(255, 255, 255, 0.85)',
  [ThemeVariables.textColorSecondary]: 'rgba(255, 255, 255, 0.45)',
  [ThemeVariables.disabledColor]: 'rgba(255, 255, 255, 0.25)',
  [ThemeVariables.borderColor]: '#434343',
  [ThemeVariables.backgroundColor]: '#141414',
  // 其他值与默认主题相同
  ...Object.fromEntries(
    Object.entries(defaultTheme).filter(([key]) => !key.includes('color') && !key.includes('Color')),
  ),
 };
 /**
 * 应用主题到文档根元素
 * @param theme 主题配置对象
 */
 export function applyTheme(theme: Record<string, string>) {
  const root = document.documentElement;
  for (const [key, value] of Object.entries(theme)) {
    root.style.setProperty(key, value);
  }
 }
 /**
 * 获取当前主题中的一个CSS变量值
 * @param variable 变量名
 * @param defaultValue 默认值
 * @returns CSS变量的值
 */
 export function getThemeValue(variable: string, defaultValue: string = ''): string {
  if (typeof document === 'undefined') return defaultValue;
  const value = getComputedStyle(document.documentElement).getPropertyValue(variable).trim();
  return value || defaultValue;
 }
 /**
 * 创建一个根据当前主题生成样式对象的函数
 * @returns 样式对象
 */
 export function createThemeStyles() {
  return {
    /**
     * 生成主色调按钮样式
     */
    primaryButton: {
      backgroundColor: `var(${ThemeVariables.primaryColor})`,
      color: '#fff',
      borderRadius: `var(${ThemeVariables.borderRadius})`,
      padding: `var(${ThemeVariables.spacingSm}) var(${ThemeVariables.spacingMd})`,
      '&:hover': {
        backgroundColor: `var(${ThemeVariables.primaryColorHover})`,
      },
    },
    /**
     * 生成卡片容器样式
     */
    card: {
      backgroundColor: '#fff',
      boxShadow: `var(${ThemeVariables.boxShadow})`,
      borderRadius: `var(${ThemeVariables.borderRadiusLg})`,
      padding: `var(${ThemeVariables.spacingMd})`,
    },
    /**
     * 文本样式
     */
    text: {
      color: `var(${ThemeVariables.textColor})`,
      fontSize: `var(${ThemeVariables.fontSize})`,
      fontFamily: `var(${ThemeVariables.fontFamily})`,
    },
    /**
     * 次要文本样式
     */
    secondaryText: {
      color: `var(${ThemeVariables.textColorSecondary})`,
      fontSize: `var(${ThemeVariables.fontSizeSm})`,
      fontFamily: `var(${ThemeVariables.fontFamily})`,
    },
  };
 }
--- a/src/components/Stars/StarTable/component/TableColumn.tsx
+++ b/src/components/Stars/StarTable/component/TableColumn.tsx
@@ -0,0 +1,199 @@
 import { DeleteOutlined, EditOutlined, EyeOutlined } from '@ant-design/icons';
 import { FormInstance, Popconfirm, Space, Tooltip } from 'antd';
 import { GetRowKey } from 'antd/lib/table/interface';
 import { RecordType } from '../../interface';
 import { ElementType } from '../../StarElement/type';
 import { StarColumn, StarOperation, StarTableProps } from '../interface';
 import { clone } from '../../utils';
 /**
 * 表格列处理函数
 */
 export type TableColumnProps = StarTableProps & {
  editTableForm: FormInstance;
  setEditRowKey: (key: any) => void;
  showTableForm: (mode: 'add' | 'edit' | 'view') => void;
  setEntity: (entity: RecordType) => void;
 };
 /**
 * 初始化表格列
 */
 const TableColumn = (props: TableColumnProps): StarColumn[] => {
  const {
    editable,
    columns,
    operation,
    rowKey,
    editTableForm,
    editRowKey,
    format,
    onViewClick,
    onEditClick,
    onRemoveClick,
    onEntityLoading,
    onRowEditSave,
    setEditRowKey,
    setEntity,
    showTableForm,
  } = props;
  /**
   * 获取行主键
   * @param record 行数据
   * @returns 行key
   */
  const getRowKey = (record: RecordType) => {
    let key: any;
    if (rowKey) {
      if (typeof rowKey === 'string') key = record[rowKey];
      else key = (rowKey as GetRowKey<any>)(record);
    } else key = record.key;
    return key;
  };
  /**
   * 先处理可编辑表格的单元格渲染
   */
  const tableColumns = editable
    ? columns.map((col) => {
        if (!col.form) {
          return col;
        }
        return {
          ...col,
          onCell: (record: RecordType) => {
            let key: any;
            if (rowKey) {
              if (typeof rowKey === 'string') key = record[rowKey];
              else key = (rowKey as GetRowKey<any>)(record);
            } else key = record.key;
            return {
              record,
              control: typeof col.form === 'boolean' || col.form === undefined ? ElementType.Input : col.form?.element,
              name: col.dataIndex?.toString(),
              title: col.title,
              align: col.align,
              editing: key === editRowKey,
              ...(col.form && col.form !== true ? col.form : {}),
            };
          },
        };
      })
    : [...columns];
  /**
   * 是否增加操作列
   */
  if (operation) {
    //默认配置
    const operationColumn: StarColumn = {
      dataIndex: 'id',
      title: format ? format({ id: 'operation' }) : '操作',
      align: 'center',
      width: '10%',
    };
    const { view, edit, remove, extra, ...rest } = operation as StarOperation;
    //操作栏的渲染方法
    const render = (value: any, record: any) => {
      const key = getRowKey(record);
      return key === editRowKey ? (
        <Space className="ant-form-item">
          <a
            onClick={async () => {
              const data = (await editTableForm.validateFields()) as RecordType;
              if (onRowEditSave) {
                if (typeof rowKey === 'string') data[rowKey] = editRowKey;
                else data.key = editRowKey;
                const success = await onRowEditSave({ ...data });
                if (success) {
                  setEditRowKey('');
                  editTableForm.resetFields();
                }
              } else setEditRowKey('');
            }}
            style={{ marginRight: 8 }}
          >
            {format ? format({ id: 'save' }) : '保存'}
          </a>
          <Popconfirm
            title={format ? format({ id: 'cancel.confirm' }) : '确认取消?'}
            onConfirm={() => setEditRowKey('')}
          >
            <a> {format ? format({ id: 'cancel' }) : '取消'}</a>
          </Popconfirm>
        </Space>
      ) : (
        <Space>
          {extra && extra(value, record)}
          {
            // 判断查看按钮显示
            (operation === true || view) && (
              <a
                onClick={() => {
                  let entity = clone(record);
                  if (onEntityLoading) entity = onEntityLoading(value, entity); // 如果有entity加载事件，替换为加载后的数据
                  setEntity(entity); //设置当前实体
                  showTableForm('view'); // 设置TableForm 打开
                  onViewClick && onViewClick(value, entity);
                }}
              >
                <Tooltip title={format ? format({ id: 'view' }) : '查看'}>
                  <EyeOutlined />
                </Tooltip>
              </a>
            )
          }
          {
            // 判断编辑按钮显示
            (operation === true || edit) && (
              <a
                onClick={() => {
                  let entity = clone(record);
                  if (onEntityLoading) entity = onEntityLoading(value, entity); // 如果有entity加载事件，替换为加载后的数据
                  setEntity(entity); //设置当前实体
                  if (editable) {
                    //行内编辑
                    const key = getRowKey(record);
                    setEditRowKey(key);
                    editTableForm.setFieldsValue(entity);
                  } else showTableForm('edit'); // 设置TableForm 打开
                  onEditClick && onEditClick(value, entity);
                }}
              >
                <Tooltip title={format ? format({ id: 'edit' }) : '编辑'}>
                  <EditOutlined />
                </Tooltip>
              </a>
            )
          }
          {
            // 判断删除按钮显示
            (operation === true || remove) && (
              <a>
                <Popconfirm
                  title={format ? format({ id: 'remove.confirm' }) : '确认删除'}
                  onConfirm={() => onRemoveClick && onRemoveClick(value, record)}
                >
                  <Tooltip title={format ? format({ id: 'remove' }) : '删除'}>
                    <DeleteOutlined style={{ color: '#f5222d' }} />
                  </Tooltip>
                </Popconfirm>
              </a>
            )
          }
        </Space>
      );
    };
    operationColumn.render = render;
    tableColumns.push({ ...operationColumn, ...rest });
  }
  return tableColumns;
 };
 export default TableColumn;
--- a/src/components/Stars/StarTable/component/TableEditCell.tsx
+++ b/src/components/Stars/StarTable/component/TableEditCell.tsx
@@ -0,0 +1,39 @@
 import StarControl from '@/components/Stars/StarElement';
 import { StarFormField } from '@/components/Stars/StarForm/type';
 import { Form } from 'antd';
 import { RecordType } from '../../interface';
 import { ElementType, StarElementProps } from '../../StarElement/type';
 export type EditableCellProps = StarFormField & {
  align?: 'start' | 'end' | 'left' | 'right' | 'center' | 'justify' | 'match-parent';
  editing: boolean;
  record: RecordType;
  children?: React.ReactNode;
  [field: string]: any;
 };
 const TableEditCell: React.FC<EditableCellProps> = (props) => {
  const { colSpan, rowSpan, className, style, align, element: control, ...rest } = props;
  // Switch的值字段是checked
  const controlProps: StarElementProps = {};
  if (typeof control === typeof ElementType) controlProps.type = control as ElementType;
  // 一些特殊处理
  const extra: StarFormField = {};
  // Switch的值字段是checked
  if (controlProps?.type === ElementType.Boolean) extra.valuePropName = 'checked';
  if (controlProps?.type === ElementType.DateRange) extra.trigger = 'onRangeChange';
  return (
    <td colSpan={colSpan} rowSpan={rowSpan} className={className} style={{ textAlign: align || 'center', ...style }}>
      {props.editing ? (
        <Form.Item {...rest} {...extra}>
          <StarControl {...controlProps} />
        </Form.Item>
      ) : (
        props.children
      )}
    </td>
  );
 };
 export default TableEditCell;
--- a/src/components/Stars/StarTable/component/TableForm.tsx
+++ b/src/components/Stars/StarTable/component/TableForm.tsx
@@ -0,0 +1,87 @@
 import React from 'react';
 import Form from 'antd/es/form';
 import { ElementType } from '../../StarElement/type';
 import StarForm from '../../StarForm';
 import { StarFormField } from '../../StarForm/type';
 import { StarTableProps, TableFormMode } from '../interface';
 import StarModal from '../../StarModal';
 const TableForm: React.FC<StarTableProps & {
  show: boolean;
  entity: any;
  mode: TableFormMode;
  close: () => void;
  destroy?: () => void;
 }> = (props) => {
  const { columns, show, mode, entity, close, destroy, onSaveClick, format } = props;
  const fields: StarFormField[] = [];
  columns.forEach((col) => {
    const label = typeof col.title === 'function' ? col.title({}) : col.title;
    if (col.form) {
      if (col.form === true) {
        fields.push({
          element: ElementType.Input,
          label,
          name: col.dataIndex?.toString(),
        });
      } else {
        fields.push({
          label,
          name: col.dataIndex?.toString(),
          ...col.form,
        });
      }
    }
  });
  const [form] = Form.useForm();
  let title = '';
  if (format) title = format({ id: mode });
  else {
    switch (mode) {
      case 'add':
        title = '增加';
        break;
      case 'edit':
        title = '编辑';
        break;
      default:
        title = '查看';
        break;
    }
  }
  return (
    <StarModal
      title={title}
      open={show}
      onOk={async () => {
        try {
          let values = await form.validateFields();
          values = { ...entity, ...values };
          onSaveClick && onSaveClick(values, mode);
          close();
        } catch (error) {
          console.error('form fields validate error! ', error);
        }
      }}
      onCancel={() => close()}
      afterClose={() => destroy && destroy()}
      okButtonProps={{ hidden: mode === 'view' }}
      width={800}
      destroyOnClose
    >
      <StarForm
        style={{ padding: '20px 40px' }}
        form={form}
        fields={fields}
        entity={entity}
        readonly={mode === 'view'}
      />
    </StarModal>
  );
 };
 export default TableForm;
--- a/src/components/Stars/StarTable/component/TableQuery.tsx
+++ b/src/components/Stars/StarTable/component/TableQuery.tsx
@@ -0,0 +1,79 @@
 import React from 'react';
 import { Button, Card, Col, Form, Row, Space } from 'antd';
 import { ElementType } from '../../StarElement/type';
 import StarForm from '../../StarForm';
 import { StarFormField } from '../../StarForm/type';
 import { StarTableProps } from '../interface';
 const TableQuery: React.FC<StarTableProps> = (props) => {
  const { columns, queryStyle, onQueryClick, format } = props;
  /**
   * 声明组件的默认样式
   */
  const { queriesCol, buttonsCol } = {
    queriesCol: queryStyle ? queryStyle.cols.queriesCol : { xxl: 20, xl: 18, lg: 18, md: 18, sm: 24, xs: 24 },
    buttonsCol: queryStyle ? queryStyle.cols.buttonsCol : { xxl: 4, xl: 6, lg: 6, md: 6, sm: 24, xs: 24 },
  };
  const fields: StarFormField[] = [];
  columns.forEach((col) => {
    if (col.query) {
      let label = undefined;
      if (typeof col.title === 'function') label = col.title({});
      else label = col.title;
      if (col.query === true) {
        fields.push({
          element: ElementType.Input,
          label,
          name: col.dataIndex?.toString(),
        });
      } else {
        fields.push({
          label,
          name: col.dataIndex?.toString(),
          ...col.query,
        });
      }
    }
  });
  const [form] = Form.useForm();
  return (
    <Card>
      <Row>
        <Col {...queriesCol}>
          <StarForm colLayout={3} form={form} fields={fields} />
        </Col>
        <Col {...buttonsCol} style={{ display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
          <Space
            style={{
              display: 'flex',
              justifyContent: 'center',
              alignItems: 'center',
              marginBottom: 24,
            }}
          >
            <Button
              type="primary"
              onClick={() => {
                if (onQueryClick) onQueryClick(form.getFieldsValue());
              }}
            >
              {format ? format({ id: 'query' }) : '查询'}
            </Button>
            <Button
              onClick={() => {
                form.resetFields();
              }}
            >
              {format ? format({ id: 'reset' }) : '重置'}
            </Button>
          </Space>
        </Col>
      </Row>
    </Card>
  );
 };
 export default TableQuery;
--- a/src/components/Stars/StarTable/component/TableToolbar.tsx
+++ b/src/components/Stars/StarTable/component/TableToolbar.tsx
@@ -0,0 +1,29 @@
 import { PlusOutlined } from '@ant-design/icons';
 import { Button, Space, theme } from 'antd';
 import React from 'react';
 import { StarTableProps } from '../interface';
 const TableToolbar: React.FC<StarTableProps> = (props) => {
  const { toolbar, format, onAddClick } = props;
  const { token } = theme.useToken();
  if (toolbar && (toolbar === true || toolbar.add || toolbar.extra)) {
    return (
      <div id="toolbar" className="my-2 w-full rounded-md p-2" style={{ backgroundColor: token.colorBgContainer }}>
        <Space>
          {(toolbar === true || toolbar.add) && (
            <Button type="primary" onClick={() => onAddClick && onAddClick()}>
              <PlusOutlined />
              {format ? format({ id: 'add' }) : '增加'}
            </Button>
          )}
          {toolbar !== true && toolbar.extra && toolbar.extra()}
        </Space>
      </div>
    );
  }
  return null;
 };
 export default TableToolbar;
--- a/src/components/Stars/StarTable/index.tsx
+++ b/src/components/Stars/StarTable/index.tsx
@@ -0,0 +1,160 @@
 import { useIntl } from '@/define';
 import { Button, Form, Table, TablePaginationConfig, Tooltip } from 'antd';
 import { useEffect, useState } from 'react';
 import { clone } from '../utils';
 import TableColumn from './component/TableColumn';
 import EditableCell from './component/TableEditCell';
 import TableForm from './component/TableForm';
 import TableQuery from './component/TableQuery';
 import TableToolbar from './component/TableToolbar';
 import { StarTableProps } from './interface';
 /**
 * 导出组件
 */
 const StarTable = (props: StarTableProps) => {
  const {
    editable,
    columns,
    autoForm,
    autoQuery,
    pagination,
    editRowKey: rowKey,
    dataSource,
    onPageChanged,
    onAddClicking,
    onAddClick,
    onRowAddClick,
    ...rest
  } = props;
  const [tableFormExist, setTableFormExist] = useState(false);
  const [tableFormShow, setTableFormShow] = useState(false);
  const [tableFormMode, setTableFormMode] = useState<'add' | 'edit' | 'view'>('add');
  const [entity, setEntity] = useState({});
  //行编辑对象
  const [editRowKey, setEditRowKey] = useState<string | number | undefined>(rowKey || 0);
  const [editTableForm] = Form.useForm();
  const { formatMessage } = useIntl();
  useEffect(() => {
    setEditRowKey(rowKey);
  }, [rowKey]);
  const showTableForm = (mode: 'add' | 'edit' | 'view') => {
    setTableFormExist(true);
    setTableFormShow(true);
    setTableFormMode(mode);
  };
  /**
   * 初始化分页信息
   * @param props Table属性信息
   */
  const initPagination = () => {
    if (pagination === false) return false;
    let wrapper: TablePaginationConfig = {
      showSizeChanger: true,
      onChange: (page, size) => {
        if (onPageChanged) onPageChanged(page, size);
      },
      onShowSizeChange: (page, size) => {
        if (onPageChanged) onPageChanged(page, size);
      },
      ...pagination,
    };
    if (pagination) {
      wrapper = {
        total: wrapper.total,
        showTotal: wrapper.total
          ? (total) => (formatMessage ? formatMessage({ id: 'pagination.total' }, { total }) : '')
          : undefined,
        ...wrapper,
      };
    }
    return wrapper;
  };
  const editRowAddButton = () =>
    onRowAddClick ? (
      <Tooltip title={formatMessage ? formatMessage({ id: 'add' }) : '新增'}>
        <Button
          style={{ width: '100%', fontSize: '20px', lineHeight: '20px' }}
          onClick={() => {
            editTableForm.resetFields();
            onRowAddClick(editTableForm);
          }}
        >
          +
        </Button>
      </Tooltip>
    ) : undefined;
  const tablePagination = initPagination();
  //加载默认的操作列
  const tableColumns = TableColumn({
    ...props,
    editRowKey,
    editTableForm,
    setEntity,
    setEditRowKey,
    showTableForm,
  });
  return (
    <div>
      {autoQuery && <TableQuery format={formatMessage} columns={columns} {...rest} />}
      <div id="container" className="w-full">
        <TableToolbar
          columns={columns}
          format={formatMessage}
          onAddClick={() => {
            const newEntity = onAddClicking ? onAddClicking() : {};
            if (autoForm) {
              setEntity(newEntity);
              showTableForm('add');
            }
            onAddClick && onAddClick();
          }}
          {...rest}
        />
        <Form form={editTableForm} component={false} className="table">
          <Table
            columns={tableColumns.filter((c) => !c.hidden)}
            pagination={tablePagination}
            dataSource={editable ? clone(dataSource) : dataSource} //可编辑行行数可能会改变，需要改变数据源的引用才能刷新
            components={
              editable
                ? {
                    body: {
                      cell: EditableCell,
                    },
                  }
                : {}
            }
            footer={editable ? editRowAddButton : undefined}
            {...rest}
          />
        </Form>
        {autoForm && tableFormExist && !editable && (
          <TableForm
            mode={tableFormMode}
            entity={entity}
            columns={columns}
            show={tableFormShow}
            format={formatMessage}
            close={() => {
              setTableFormShow(false);
            }}
            destroy={() => setTableFormExist(false)}
            {...rest}
          />
        )}
      </div>
    </div>
  );
 };
 export default StarTable;
--- a/src/components/Stars/StarTable/interface.ts
+++ b/src/components/Stars/StarTable/interface.ts
@@ -0,0 +1,166 @@
 import { FormInstance, TableProps } from 'antd';
 import { ColProps } from 'antd/lib/col';
 import { ColumnType } from 'antd/lib/table';
 import { RecordType, StarProps } from '../interface';
 import { StarFormField } from '../StarForm/type';
 export interface StarColumn extends ColumnType<any> {
  /**
   * 是否在table中隐藏
   */
  hidden?: boolean;
  /**
   * 是否允许搜索
   */
  query?: boolean | StarFormField;
  /**
   * 是否创建自动表单
   */
  form?: boolean | StarFormField;
  onCell?: (record: RecordType) => any;
 }
 export interface StartQueryStyle {
  cols: {
    /**
     * 条件区样式
     */
    queriesCol?: ColProps;
    /**
     * 单个条件区样式
     */
    conditionCol?: ColProps;
    /**
     * 按钮区样式
     */
    buttonsCol?: ColProps;
    /**
     * 单个搜索文案样式
     */
    labelCol?: ColProps;
    /**
     * 单个搜索控件样式
     */
    wrapperCol?: ColProps;
  };
 }
 export interface StarOperation extends StarColumn {
  edit?: boolean;
  view?: boolean;
  remove?: boolean;
  extra?: (value: any, record: any) => React.ReactNode | undefined;
 }
 export interface StarTableProps extends TableProps<RecordType>, StarProps {
  /**
   * 表格是否允许行内编辑
   */
  editable?: boolean;
  /**
   * 当前正在编辑行key
   */
  editRowKey?: string | number | undefined;
  /**
   * 编辑表格form
   */
  editTableForm?: FormInstance<any>;
  /**
   * table列信息
   */
  columns: StarColumn[];
  /**
   * 操作栏信息
   */
  operation?: boolean | StarOperation;
  /**
   * 定义table工具栏
   */
  toolbar?: boolean | { add: boolean; extra: () => React.ReactNode };
  /**
   * 是否创建自动表单
   */
  autoForm?: boolean;
  /**
   * 是否创建查询表格
   */
  autoQuery?: boolean | { formCols: number };
  /**
   * table查询功能样式
   */
  queryStyle?: StartQueryStyle;
  /**
   * 点击查询时触发事件
   */
  onQueryClick?: (params: RecordType) => void;
  /**
   * 点击添加时需要预处理的事件
   */
  onAddClicking?: () => RecordType;
  /**
   * 点击添加时触发事件
   */
  onAddClick?: () => void;
  /**
   * 点击添加时触发事件
   */
  onSaveClick?: (values: any, mode: TableFormMode) => void;
  /**
   * 点击查看时触发事件
   */
  onViewClick?: (key: string | number, values: any) => void;
  /**
   * 点击编辑时触发事件
   */
  onEditClick?: (key: string | number, values: any) => void;
  /**
   * 点击删除时触发事件
   */
  onRemoveClick?: (key: string | number, values: any) => void;
  /**
   * 加载实体对象事件
   * @param key 实体的ID
   * @param values 表格中的实体行信息
   */
  onEntityLoading?: (key: string | number, values: any) => any;
  /**
   * 行编辑保存事件
   */
  onRowEditSave?: (values: RecordType) => Promise<boolean>;
  /**
   * 点击添加行事件
   */
  onRowAddClick?: (form: FormInstance) => void;
  /**
   * 分页时触发事件
   */
  onPageChanged?: (page: number, size: number) => void;
 }
 export type TableFormMode = 'add' | 'edit' | 'view';
--- a/src/components/Stars/StarTree/index.tsx
+++ b/src/components/Stars/StarTree/index.tsx
@@ -0,0 +1,42 @@
 import { Tree, TreeProps } from 'antd';
 type Key = string | number;
 type Checked = {
  checked: Key[];
  halfChecked: Key[];
 };
 const StarTree: React.FC<TreeProps & { onCheckChange?: (checked: boolean, keys: Key[]) => void }> = (props) => {
  const { checkedKeys, onCheckChange } = props;
  return (
    <Tree
      onCheck={(checked, info) => {
        let keys: Key[] = [];
        let latestKeys: Key[] = [];
        let changed: Key[] = [];
        //获取当前选择的key
        if (checked instanceof Array) {
          keys = (checked as Key[]) || [];
        } else keys = (checked as Checked)?.checked || [];
        // keys = keys.concat(info.halfCheckedKeys || []); //半选择同样算没选择
        //获取之前选择的key
        if (latestKeys instanceof Array) latestKeys = (checkedKeys as Key[]) || [];
        else latestKeys = (checkedKeys as Checked)?.checked || [];
        //过滤变动的key
        if (info.checked) {
          changed = keys.filter((k) => !latestKeys.includes(k));
        } else {
          changed = latestKeys.filter((k) => !keys.includes(k));
        }
        onCheckChange && onCheckChange(info.checked, changed);
      }}
      {...props}
    />
  );
 };
 export default StarTree;
--- a/src/components/Stars/index.ts
+++ b/src/components/Stars/index.ts
@@ -0,0 +1,53 @@
 // 导出Stars组件库中的所有组件
 import StarTable from './StarTable';
 import StarForm from './StarForm';
 import StarElement from './StarElement';
 import StarDatePicker, { StarDateRangePicker } from './StarDatePicker';
 import StarLabel from './StarLabel';
 import { StarMoneyInput, StarMoneyLabel } from './StarMoney';
 import StarModal from './StarModal';
 import StarLayout from './StarLayout/index';
 import StarTree from './StarTree';
 // 导出类型定义
 export * from './interface';
 export * from './StarTable/interface';
 export * from './StarForm/type';
 export * from './StarElement';
 export * from './StarDatePicker';
 export * from './StarMoney';
 export * from './StarModal';
 export * from './StarFormat';
 // 导出工具函数
 export * from './utils';
 // 导出组件
 export {
  StarTable,
  StarForm,
  StarElement,
  StarDatePicker,
  StarDateRangePicker,
  StarLabel,
  StarMoneyInput,
  StarMoneyLabel,
  StarModal,
  StarLayout,
  StarTree,
 };
 // 默认导出
 export default {
  StarTable,
  StarForm,
  StarElement,
  StarDatePicker,
  StarDateRangePicker,
  StarLabel,
  StarMoneyInput,
  StarMoneyLabel,
  StarModal,
  StarLayout,
  StarTree,
 };
--- a/src/components/Stars/interface.ts
+++ b/src/components/Stars/interface.ts
@@ -0,0 +1,12 @@
 import { IntlFormat } from './StarFormat';
 export interface StarProps {
  /**
   * 国际化格式化功能
   */
  format?: IntlFormat;
 }
 export declare type PrimitiveType = string | number | boolean | null | undefined | Date;
 export declare type RecordType = Record<string, any>;
--- a/src/components/Stars/utils/clone.ts
+++ b/src/components/Stars/utils/clone.ts
@@ -0,0 +1,23 @@
 /**
 * 深拷贝对象
 * @param src 源对象
 * @returns 克隆对象
 */
 export function clone<T>(src: T): T {
  if (src === null || typeof src !== 'object') {
    return src;
  }
  if (Array.isArray(src)) {
    return src.map((item) => clone(item)) as unknown as T;
  }
  const result: Record<string, any> = {};
  for (const key in src) {
    if (Object.prototype.hasOwnProperty.call(src, key)) {
      result[key] = clone(src[key]);
    }
  }
  return result as T;
 } 
--- a/src/components/Stars/utils/currency.ts
+++ b/src/components/Stars/utils/currency.ts
@@ -0,0 +1,99 @@
 /**
 * 数字金额转换为大写人民币汉字
 * @param money 金额
 * @returns 中文金额
 */
 export function formatCurrency(money: number): string {
  //汉字的数字
  const cnNumber = ['零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖'];
  //基本单位
  const cnIntRadice = ['', '拾', '佰', '仟'];
  //对应整数部分扩展单位
  const cnIntUnits = ['', '万', '亿', '兆'];
  //对应小数部分单位
  const cnDecUnits = ['角', '分', '毫', '厘'];
  //整数金额时后面跟的字符
  const cnInteger = '整';
  //整型完以后的单位
  const cnIntLast = '元';
  //最大处理的数字
  const maxNum = 999999999999999;
  //金额整数部分
  let integerNum;
  //金额小数部分
  let decimalNum;
  //输出的中文金额字符串
  let result = '';
  //分离金额后用的数组，预定义
  let parts;
  if (!money) {
    return '零';
  }
  if (money >= 0) {
    if (money >= maxNum) {
      //超出最大处理数字
      return '';
    }
    if (money === 0) {
      result = cnNumber[0] + cnIntLast + cnInteger;
      return result;
    }
    //转换为字符串
    const moneyString = money.toString();
    if (moneyString.indexOf('.') === -1) {
      integerNum = moneyString;
      decimalNum = '';
    } else {
      parts = moneyString.split('.');
      integerNum = parts[0];
      decimalNum = parts[1].substr(0, 4);
    }
    //获取整型部分转换
    if (parseInt(integerNum, 10) > 0) {
      let zeroCount = 0;
      const intLen = integerNum.length;
      for (let i = 0; i < intLen; i++) {
        const n = integerNum.substr(i, 1);
        const p = intLen - i - 1;
        const q = p / 4;
        const m = p % 4;
        if (n === '0') {
          zeroCount++;
        } else {
          if (zeroCount > 0) {
            result += cnNumber[0];
          }
          //归零
          zeroCount = 0;
          result += cnNumber[parseInt(n, 10)] + cnIntRadice[m];
        }
        if (m === 0 && zeroCount < 4) {
          result += cnIntUnits[q];
        }
      }
      result += cnIntLast;
    }
    //小数部分
    if (decimalNum !== '') {
      const decLen = decimalNum.length;
      for (let i = 0; i < decLen; i++) {
        const n = decimalNum.substr(i, 1);
        if (n !== '0') {
          result += cnNumber[Number(n)] + cnDecUnits[i];
        }
      }
    }
    if (result === '') {
      result += cnNumber[0] + cnIntLast + cnInteger;
    } else if (decimalNum === '') {
      result += cnInteger;
    }
  } else {
    const absMoney = Math.abs(money);
    const res = formatCurrency(absMoney);
    return `负${res}`;
  }
  return result;
 } 
--- a/src/components/Stars/utils/datetime.ts
+++ b/src/components/Stars/utils/datetime.ts
@@ -0,0 +1,11 @@
 import dayjs, { Dayjs as DateTime, isDayjs as isDateTime } from 'dayjs';
 export default dayjs;
 export { DateTime, isDateTime };
 export const DATE_TIME_FORMAT = 'YYYY-MM-DD HH:mm:ss';
 export const formatDateTime = (value: DateTime, format = DATE_TIME_FORMAT) => {
  return isDateTime(value) ? value.format(format) : '';
 };
--- a/src/components/Stars/utils/index.ts
+++ b/src/components/Stars/utils/index.ts
@@ -0,0 +1,239 @@
 import { RecordType } from '../interface';
 /**
 * 深拷贝对象
 * @param src 源对象
 * @returns 克隆对象
 */
 export function clone<T>(src: T): T {
  if (src === null || typeof src !== 'object') {
    return src;
  }
  if (Array.isArray(src)) {
    return src.map((item) => clone(item)) as unknown as T;
  }
  const result: Record<string, any> = {};
  for (const key in src) {
    if (Object.prototype.hasOwnProperty.call(src, key)) {
      result[key] = clone(src[key]);
    }
  }
  return result as T;
 }
 /**
 * 数字金额转换为大写人民币汉字
 * @param money 金额
 * @returns 中文金额
 */
 export function formatCurrency(money: number): string {
  //汉字的数字
  const cnNumber = ['零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖'];
  //基本单位
  const cnIntRadice = ['', '拾', '佰', '仟'];
  //对应整数部分扩展单位
  const cnIntUnits = ['', '万', '亿', '兆'];
  //对应小数部分单位
  const cnDecUnits = ['角', '分', '毫', '厘'];
  //整数金额时后面跟的字符
  const cnInteger = '整';
  //整型完以后的单位
  const cnIntLast = '元';
  //最大处理的数字
  const maxNum = 999999999999999;
  //金额整数部分
  let integerNum;
  //金额小数部分
  let decimalNum;
  //输出的中文金额字符串
  let result = '';
  //分离金额后用的数组，预定义
  let parts;
  if (!money) {
    return '零';
  }
  if (money >= 0) {
    if (money >= maxNum) {
      //超出最大处理数字
      return '';
    }
    if (money === 0) {
      result = cnNumber[0] + cnIntLast + cnInteger;
      return result;
    }
    //转换为字符串
    const moneyString = money.toString();
    if (moneyString.indexOf('.') === -1) {
      integerNum = moneyString;
      decimalNum = '';
    } else {
      parts = moneyString.split('.');
      integerNum = parts[0];
      decimalNum = parts[1].substr(0, 4);
    }
    //获取整型部分转换
    if (parseInt(integerNum, 10) > 0) {
      let zeroCount = 0;
      const intLen = integerNum.length;
      for (let i = 0; i < intLen; i++) {
        const n = integerNum.substr(i, 1);
        const p = intLen - i - 1;
        const q = p / 4;
        const m = p % 4;
        if (n === '0') {
          zeroCount++;
        } else {
          if (zeroCount > 0) {
            result += cnNumber[0];
          }
          //归零
          zeroCount = 0;
          result += cnNumber[parseInt(n, 10)] + cnIntRadice[m];
        }
        if (m === 0 && zeroCount < 4) {
          result += cnIntUnits[q];
        }
      }
      result += cnIntLast;
    }
    //小数部分
    if (decimalNum !== '') {
      const decLen = decimalNum.length;
      for (let i = 0; i < decLen; i++) {
        const n = decimalNum.substr(i, 1);
        if (n !== '0') {
          result += cnNumber[Number(n)] + cnDecUnits[i];
        }
      }
    }
    if (result === '') {
      result += cnNumber[0] + cnIntLast + cnInteger;
    } else if (decimalNum === '') {
      result += cnInteger;
    }
  } else {
    const absMoney = Math.abs(money);
    const res = formatCurrency(absMoney);
    return `负${res}`;
  }
  return result;
 }
 export type ListToTreeParams = {
  data: RecordType[];
  rootId: string;
  idField?: string;
  parentField?: string;
  childrenField?: string;
  sortField?: string;
 };
 /**
 * 根据规则转换列表为树结构
 * @param data 待处理数据
 * @param rootId 根节点ID, 默认空白''
 * @param idField ID字段名, 默认id
 * @param parentField 父ID字段名, 默认parent
 * @param childrenField 子数据字段名, 默认children
 * @param sortField 排序字段名, 不传不排序
 * @returns
 */
 export function listToTree<T extends RecordType>({
  data,
  rootId,
  idField = 'id',
  parentField = 'parent',
  childrenField = 'children',
  sortField = '',
 }: ListToTreeParams): T[] {
  const compare = () => {
    return (from: RecordType, to: RecordType) => {
      const first = from[sortField];
      const second = to[sortField];
      return first - second;
    };
  };
  let tree: T[] = [];
  // get the top level nodes
  data.filter((d) => d[parentField] === rootId).forEach((d) => tree.push(clone(d) as T));
  const nodes: RecordType[] = []; //待遍历节点
  tree.forEach((t) => nodes.push(t));
  while (nodes.length) {
    const parent = nodes.shift()!; // the parent node
    for (let i = 0; i < data.length; i++) {
      const node = clone(data[i]);
      if (node[parentField] === parent[idField]) {
        if (parent[childrenField]) {
          parent[childrenField].push(node);
          sortField ? (parent[childrenField] = parent[childrenField].sort(compare())) : null;
        } else {
          parent[childrenField] = [node];
        }
        nodes.push(node);
      }
    }
  }
  // 父级节点同样按sortAttr属性排序
  tree = tree.sort(compare());
  return tree;
 }
 /**
 * 获取URL参数信息
 * @returns URL参数信息对象
 */
 export const getUrlParams = (url?: string) => {
  const query = url ? url : window.location.href;
  const urlSearchParams = new URLSearchParams(query.split('?')[1] || '');
  const result: RecordType = {};
  urlSearchParams.forEach((value, key) => {
    result[key] = value;
  });
  return result;
 };
 /**
 * 将对象转换为 URL 查询字符串
 * @param obj 要转换的对象
 * @returns URL 查询字符串
 */
 export function stringify(obj: Record<string, any>): string {
  return Object.keys(obj)
    .map((key) => {
      const value = obj[key];
      if (value === null || value === undefined) {
        return '';
      }
      // 处理数组和嵌套对象
      if (Array.isArray(value)) {
        return value.map((v, i) => `${encodeURIComponent(key)}[${i}]=${encodeURIComponent(v)}`).join('&');
      }
      if (typeof value === 'object') {
        return Object.keys(value)
          .map(
            (subKey) =>
              `${encodeURIComponent(key)}[${encodeURIComponent(subKey)}]=${encodeURIComponent(value[subKey])}`,
          )
          .join('&');
      }
      return `${encodeURIComponent(key)}=${encodeURIComponent(value)}`;
    })
    .filter(Boolean) // 过滤空值
    .join('&');
 }
 // 从各个分割的工具文件中导出函数
 export * from './clone';
 export * from './currency';
 export * from './tree';
 export * from './url';
 export * from './datetime';
 export * from './storage';
--- a/src/components/Stars/utils/storage.ts
+++ b/src/components/Stars/utils/storage.ts
@@ -0,0 +1,44 @@
 export interface Storage {
  get: (key: string) => any & undefined;
  save: (key: string, data: any, expiry?: number, remeber?: boolean) => void;
  remove: (key: string) => void;
 }
 export default {
  get(key) {
    let saved = null;
    try {
      saved = localStorage.getItem(key);
      if (!saved) saved = sessionStorage.getItem(key);
    } catch (e) {
      console.error(`can not find key ${key} object in storage`, e);
    }
    if (saved) {
      const { data, expiry, timestamp } = JSON.parse(saved);
      if (expiry) {
        //如果设置了超时时间，查看是否超时
        const age = (Date.now() - timestamp) / 1000; //转换为秒
        //超出超时设置,清空数据
        if (age > expiry) {
          this.remove(key);
          return null;
        }
      }
      return data;
    }
    return null;
  },
  save(key, data, expiry = 0, remember = false) {
    const toSave = { data, expiry, timestamp: new Date().getTime() };
    const plain = JSON.stringify(toSave);
    if (remember) localStorage.setItem(key, plain);
    else sessionStorage.setItem(key, plain);
  },
  remove(key) {
    sessionStorage.removeItem(key);
    localStorage.removeItem(key);
  },
 } as Storage;
--- a/src/components/Stars/utils/tree.ts
+++ b/src/components/Stars/utils/tree.ts
@@ -0,0 +1,63 @@
 import { RecordType } from '../interface';
 import { clone } from './clone';
 export type ListToTreeParams = {
  data: RecordType[];
  rootId: string;
  idField?: string;
  parentField?: string;
  childrenField?: string;
  sortField?: string;
 };
 /**
 * 根据规则转换列表为树结构
 * @param data 待处理数据
 * @param rootId 根节点ID, 默认空白''
 * @param idField ID字段名, 默认id
 * @param parentField 父ID字段名, 默认parent
 * @param childrenField 子数据字段名, 默认children
 * @param sortField 排序字段名, 不传不排序
 * @returns 树形结构数据
 */
 export function listToTree<T extends RecordType>({
  data,
  rootId,
  idField = 'id',
  parentField = 'parent',
  childrenField = 'children',
  sortField = '',
 }: ListToTreeParams): T[] {
  const compare = () => {
    return (from: RecordType, to: RecordType) => {
      const first = from[sortField];
      const second = to[sortField];
      return first - second;
    };
  };
  let tree: T[] = [];
  // get the top level nodes
  data.filter((d) => d[parentField] === rootId).forEach((d) => tree.push(clone(d) as T));
  const nodes: RecordType[] = []; //待遍历节点
  tree.forEach((t) => nodes.push(t));
  while (nodes.length) {
    const parent = nodes.shift()!; // the parent node
    for (let i = 0; i < data.length; i++) {
      const node = clone(data[i]);
      if (node[parentField] === parent[idField]) {
        if (parent[childrenField]) {
          parent[childrenField].push(node);
          sortField ? (parent[childrenField] = parent[childrenField].sort(compare())) : null;
        } else {
          parent[childrenField] = [node];
        }
        nodes.push(node);
      }
    }
  }
  // 父级节点同样按sortAttr属性排序
  tree = tree.sort(compare());
  return tree;
 } 
--- a/src/components/Stars/utils/url.ts
+++ b/src/components/Stars/utils/url.ts
@@ -0,0 +1,48 @@
 import { RecordType } from '../interface';
 /**
 * 获取URL参数信息
 * @param url 可选，指定URL，不传则使用当前页面URL
 * @returns URL参数信息对象
 */
 export const getUrlParams = (url?: string): RecordType => {
  const query = url ? url : window.location.href;
  const urlSearchParams = new URLSearchParams(query.split('?')[1] || '');
  const result: RecordType = {};
  urlSearchParams.forEach((value, key) => {
    result[key] = value;
  });
  return result;
 };
 /**
 * 将对象转换为 URL 查询字符串
 * @param obj 要转换的对象
 * @returns URL 查询字符串
 */
 export function stringify(obj: Record<string, any>): string {
  return Object.keys(obj)
    .map((key) => {
      const value = obj[key];
      if (value === null || value === undefined) {
        return '';
      }
      // 处理数组和嵌套对象
      if (Array.isArray(value)) {
        return value.map((v, i) => `${encodeURIComponent(key)}[${i}]=${encodeURIComponent(v)}`).join('&');
      }
      if (typeof value === 'object') {
        return Object.keys(value)
          .map(
            (subKey) =>
              `${encodeURIComponent(key)}[${encodeURIComponent(subKey)}]=${encodeURIComponent(value[subKey])}`,
          )
          .join('&');
      }
      return `${encodeURIComponent(key)}=${encodeURIComponent(value)}`;
    })
    .filter(Boolean) // 过滤空值
    .join('&');
 } 
--- a/src/define.ts
+++ b/src/define.ts
@@ -0,0 +1,2 @@
 export * from 'react-intl';
 export * from 'react-router-dom';
--- a/src/layouts/BlankLayout.tsx
+++ b/src/layouts/BlankLayout.tsx
@@ -0,0 +1,8 @@
 import React from 'react';
 import { Outlet } from '@/define';
 const BlankLayout: React.FC = () => {
  return <Outlet />;
 };
 export default BlankLayout; 
--- a/src/layouts/MainLayout.tsx
+++ b/src/layouts/MainLayout.tsx
@@ -0,0 +1,160 @@
 import logo from '@/assets/logo.svg';
 import { RecordType } from '@/components/Stars/interface';
 import { listToTree } from '@/components/Stars/utils';
 import { useIntl } from '@/define';
 import { useAuth } from '@/models';
 import { LoginUrl, setNavigate } from '@/routes/route';
 import {
  FileOutlined,
  FileTextOutlined,
  FileUnknownOutlined,
  ReconciliationOutlined,
  SettingOutlined,
  SmileOutlined,
  SolutionOutlined,
  TeamOutlined,
  UserOutlined,
 } from '@ant-design/icons';
 import { Layout, Menu, Spin, theme } from 'antd';
 import { MenuItemType } from 'antd/lib/menu/interface';
 import React, { useEffect, useState } from 'react';
 import { Link, Outlet, useLocation, useNavigate } from '@/define';
 import Footer from './components/Footer';
 import RightContent from './components/RightContent';
 const { Header, Sider, Content } = Layout;
 /**
 * 不经过本布局渲染的页面
 */
 const ExceptionPages = [LoginUrl, '/users/password', '/users/password/success'];
 const PublicPages = ['/', '/403', '/404'];
 const icons: Record<string, React.ReactNode> = {
  smile: <SmileOutlined />,
  sheet: <ReconciliationOutlined />,
  user: <UserOutlined />,
  setting: <SettingOutlined />,
  group: <TeamOutlined />,
  role: <SolutionOutlined />,
  manual: <FileTextOutlined />,
  page: <FileOutlined />,
 };
 const MainLayout: React.FC = () => {
  //例外页面直接返回
  const location = useLocation();
  const navigate = useNavigate(); // 替代原来的 history
  const { formatMessage } = useIntl();
  const [menu, setMenu] = useState<RecordType[]>([]);
  // 设置全局 navigate 实例
  useEffect(() => {
    setNavigate(navigate);
  }, [navigate]);
  const auth = useAuth();
  const [collapsed, setCollapsed] = useState(false);
  const {
    token: { colorBgContainer, borderRadiusLG, ...rest },
  } = theme.useToken();
  /**
   * 初始化，加载菜单并判断url权限
   * 进入到该布局，说明已经通过SecurityLayout的验证，所以直接加载菜单
   */
  useEffect(() => {
    // 加载菜单，若已加载过则不再加载
    if (!auth.menus || auth.menus.length === 0) {
      auth.authorizedMenus().then((data) => {
        if (data.length > 0) {
          setMenu(
            data.map((m: any) => {
              const newMenu = m;
              newMenu.path = newMenu.uri;
              return newMenu;
            }),
          );
        }
      });
    }
    authorizeUri();
  }, [auth?.user]);
  if (ExceptionPages.indexOf(location.pathname) > -1) return <Outlet />;
  // 如果正在加载，显示加载指示器
  if (!auth.isInitialized) {
    return (
      <div className="flex h-screen w-screen items-center justify-center">
        <Spin size="large" />
      </div>
    );
  }
  /**
   * 验证页面权限
   */
  const authorizeUri = async () => {
    //额外页面和'/403', '/404'不做页面权限判断
    if (ExceptionPages.concat(PublicPages).indexOf(location.pathname) > -1) return;
    //若是直接输入url进行页面，判断url权限
    const uri = location.pathname || '/';
    await auth.isUriAuthrized(uri);
  };
  const menuIconRender = (menus: RecordType[]): MenuItemType[] =>
    menus.map(({ icon, children, ...item }) => {
      let label = formatMessage({ id: `menu.${item.name}` });
      label = label || item.name;
      return {
        key: item.id,
        label: children ? label : <Link to={item.path}>{label}</Link>, // 使用 Link 组件
        title: label,
        icon: icons[icon] || <FileUnknownOutlined />,
        children: children && menuIconRender(children),
      };
    });
  const menuTree = listToTree({ data: menu || [], sortField: 'order', rootId: '0' });
  const menus = menuIconRender(menuTree);
  return (
    <Layout style={{ minHeight: '100vh' }}>
      <Header
        id="header"
        style={{
          display: 'flex',
          padding: 0,
          background: colorBgContainer,
          borderBottom: `1px solid ${rest.colorBorderSecondary}`,
        }}
      >
        <div id="logo" className="flex h-full items-center justify-center rounded-md px-4">
          <img className="flex h-7" src={logo} />
          <span className="font-4.5 ml-1 text-lg font-semibold">Aphrodite</span>
        </div>
        {/* <Menu theme={'light'} mode="horizontal" defaultSelectedKeys={['1']} items={menus} /> */}
        <RightContent />
      </Header>
      <Layout>
        <Sider theme="light" collapsible collapsed={collapsed} onCollapse={(value) => setCollapsed(value)}>
          <Menu defaultSelectedKeys={['1']} mode="inline" items={menus} />
        </Sider>
        <Content style={{ margin: '16px' }}>
          <div
            style={{
              minHeight: '94%',
              // background: colorBgContainer,
              borderRadius: borderRadiusLG,
            }}
          >
            <Outlet />
          </div>
          <Footer />
        </Content>
      </Layout>
    </Layout>
  );
 };
 export default MainLayout;
--- a/src/layouts/SecurityLayout.tsx
+++ b/src/layouts/SecurityLayout.tsx
@@ -0,0 +1,40 @@
 import { useAuth } from '@/models';
 import { toLogin } from '@/routes/route';
 import { Spin } from 'antd';
 import { observer } from 'mobx-react';
 import React, { useEffect } from 'react';
 import { Outlet } from '@/define';
 /**
 * 安全布局组件，处理用户认证和授权
 */
 const SecurityLayout: React.FC = () => {
  const auth = useAuth();
  useEffect(() => {
    auth.init();
  }, []);
  // 如果正在加载，显示加载指示器
  if (!auth.isInitialized) {
    return (
      <div className="flex h-screen w-screen items-center justify-center">
        <Spin size="large" />
      </div>
    );
  }
  // 如果未认证，重定向到登录页
  if (!auth.user) {
    toLogin();
  }
  // 认证通过，渲染子内容
  return (
    <>
      <Outlet />
    </>
  );
 };
 const ObserverSecurityLayout = observer(SecurityLayout);
 export default ObserverSecurityLayout;
--- a/src/layouts/UserLayout.tsx
+++ b/src/layouts/UserLayout.tsx
@@ -0,0 +1,40 @@
 import { observer } from 'mobx-react';
 import React from 'react';
 import { Link, Navigate, Outlet } from '@/define';
 import logo from '../assets/logo.svg';
 import authStore from '../stores/auth-store';
 import Footer from './components/Footer';
 // 用户布局（登录、注册等页面使用）
 const UserLayout: React.FC<{ children?: React.ReactNode }> = () => {
  // 如果用户已登录，重定向到主页
  if (authStore.isLoggedIn) {
    return <Navigate to="/" replace />;
  }
  const title = 'Aphrodite';
  return (
    <div
      id="container"
      className="flex h-screen flex-col overflow-auto bg-slate-100 bg-[url('/src/assets/login_bg.svg')] bg-cover bg-center"
    >
      <div id="lang" className={`lang`}></div>
      <div id="content" className="h-full flex-1 px-32 sm:px-0">
        <div id="header" className="my-16 flex flex-col items-center">
          <div id="logo" className="flex items-center">
            <Link to="/">
              <img alt="logo" className="h-32" src={logo} />
            </Link>
          </div>
          <div className="mt-8 text-3xl font-bold text-gray-500">{title}</div>
          <div className={`desc`} />
        </div>
        <Outlet />
      </div>
      <Footer copyright="synebula" />
    </div>
  );
 };
 const ObserverUserLayout = observer(UserLayout);
 export default ObserverUserLayout;
--- a/src/layouts/components/Footer/index.tsx
+++ b/src/layouts/components/Footer/index.tsx
@@ -0,0 +1,6 @@
 const Footer: React.FC<{ copyright?: string }> = ({ copyright }) => {
  const year = new Date().getFullYear();
  return <div className="text-center">{`${copyright ?? ''} ©${year}`}</div>;
 };
 export default Footer;
--- a/src/layouts/components/RightContent/AvatarDropdown.tsx
+++ b/src/layouts/components/RightContent/AvatarDropdown.tsx
@@ -0,0 +1,41 @@
 import React from 'react';
 import { Dropdown, Avatar } from 'antd';
 import { LogoutOutlined, SettingOutlined, UserOutlined } from '@ant-design/icons';
 import { ItemType } from 'antd/es/menu/interface';
 import { useAuth } from '@/models';
 const AvatarDropdown: React.FC<{ className?: string }> = ({ className }) => {
  const auth = useAuth();
  const menus: ItemType[] = [
    {
      key: 'center',
      label: '个人中心',
      icon: <UserOutlined />,
    },
    {
      key: 'settings',
      label: '个人设置',
      icon: <SettingOutlined />,
    },
    {
      key: 'logout',
      label: '退出登录',
      icon: <LogoutOutlined />,
      danger: true,
      onClick: () => {
        auth.logout();
      },
    },
  ];
  return (
    <Dropdown menu={{ items: menus }}>
      <span className={`action ${className}`}>
        <Avatar icon={auth.user?.avatar ?? <UserOutlined />} />
        <span className="ml-2">{auth.user?.uname}</span>
      </span>
    </Dropdown>
  );
 };
 export default AvatarDropdown;
--- a/src/layouts/components/RightContent/index.tsx
+++ b/src/layouts/components/RightContent/index.tsx
@@ -0,0 +1,33 @@
 import { QuestionCircleOutlined } from '@ant-design/icons';
 import { Space, theme } from 'antd';
 import Avatar from './AvatarDropdown';
 import './style.css';
 import { SelectLang } from '@/components/SelectLang';
 export type SiderTheme = 'light' | 'dark';
 const GlobalHeaderRight: React.FC = () => {
  const { token } = theme.useToken();
  const hoverBgColor = {
    color: token.colorInfoBgHover,
  };
  return (
    <Space id="right-content" className="float-right mr-4 ml-auto flex h-16">
      <span
        className={`action ${hoverBgColor}`}
        onClick={() => {
          window.open('https://pro.ant.design/docs/getting-started');
        }}
      >
        <QuestionCircleOutlined />
      </span>
      <SelectLang className={`action ${hoverBgColor}`} />
      <Avatar className={`action ${hoverBgColor}`} />
      {/* {process.env.REACT_APP_ENV && (
        <span>
          <Tag color={'dev'}>{process.env.REACT_APP_ENV}</Tag>
        </span>
      )} */}
    </Space>
  );
 };
 export default GlobalHeaderRight;
--- a/src/layouts/components/RightContent/style.css
+++ b/src/layouts/components/RightContent/style.css
@@ -0,0 +1,9 @@
@reference "@/style.css";
 .action {
  @apply flex h-12 w-full items-center p-2 hover:rounded-md;
 }
 .action:hover {
  background-color: var(--ant-layout-color-bg-body);
 }
--- a/src/layouts/index.tsx
+++ b/src/layouts/index.tsx
@@ -0,0 +1,3 @@
 import MainLayout from "./MainLayout";
 export default MainLayout;
--- a/src/locales/en-US.ts
+++ b/src/locales/en-US.ts
@@ -0,0 +1,11 @@
 import menu from './en-US/menu';
 import copy from './en-US/copy';
 import pwa from './en-US/pwa';
 import business from './en-US/business';
 export default {
  ...copy,
  ...menu,
  ...pwa,
  ...business,
 };
--- a/src/locales/en-US/business/index.ts
+++ b/src/locales/en-US/business/index.ts
@@ -0,0 +1,9 @@
 import system from './system';
 import repair from './repair';
 import task from './task';
 export default {
  ...system,
  ...repair,
  ...task
 };
--- a/src/locales/en-US/business/repair.ts
+++ b/src/locales/en-US/business/repair.ts
@@ -0,0 +1,29 @@
 export default {
  'repair.partInfo.pn': 'Part Number',
  'repair.partInfo.name': 'Part Name',
  'repair.partInfo.icv': 'ICV',
  'repair.partInfo.manHour': 'Man Hour',
  'repair.partInfo.engineer': 'Repair Engineer',
  'repair.partInfo.workbench': 'Workbench',
  'repair.workbench.name': 'Workbench Name',
  'repair.workbench.desc': 'Workbench Description',
  'repair.workbench.exRecoverTime': 'Estimated recovery time',
  'repair.workbench.recoverTime': 'Recovery time',
  'repair.workbench.faultTime': 'Fault Time',
  'repair.workbench.faultReason': 'Fault Reason',
  'repair.workbench.fault': 'Fault',
  'repair.workbench.recover': 'Recover',
  'repair.workbench.recover.warn': 'Confirm to recover workbench?',
  'repair.workbench.parts': 'View repair parts',
  'repair.calendar.isLeapYear': 'Leap Year',
  'repair.calendar.days.workday': 'Workday Days',
  'repair.calendar.days.weekend': 'Weekend Days',
  'repair.calendar.days.holiday': 'Holiday Days',
  'repair.stock.name': 'Stock Name',
  'repair.warn.pn.format':
    'Please fill in PN correctly. Only numbers, capital letters and - are allowed',
 };
--- a/src/locales/en-US/business/system.ts
+++ b/src/locales/en-US/business/system.ts
@@ -0,0 +1,42 @@
 export default {
  'system.user.name': 'User',
  'system.user.realName': 'Name',
  'system.user.phone': 'Phone',
  'system.user.role.change': "Modify user's role or depot",
  'system.user.password': 'Password',
  'system.user.password.new': 'New password',
  'system.user.password.confirm': 'Conform new password',
  'system.user.password.confirm.fail': 'The two passwords are inconsistent',
  'system.user.active.confirm': 'Confirm to active user',
  'system.user.active': 'Active user',
  'system.user.alive': 'Active status',
  'system.user.alive.yes': 'Actived',
  'system.user.alive.no': 'Not active',
  'system.user.warn.group.need': 'RE role depot must be assigned',
  'system.role': 'Role',
  'system.role.name': 'Role Name',
  'system.group': 'Depot',
  'system.group.name': 'Depot Name',
  'system.group.authority': 'Privacy Permission',
  'system.role.authority': 'Role Authority',
  'system.page': 'Page',
  'system.page.name': 'Page Name',
  'system.page.type': 'Page Type',
  'system.page.parent': 'Parent Page',
  'system.page.system': 'Belong System',
  'system.sign.title': 'User Password Sign In',
  'system.sign.remember': 'Remember me',
  'system.sign.forgot': 'Forgot Password ?',
  'system.warn.user.name': 'Please enter User',
  'system.warn.user.password': 'Please enter password',
  用户名或密码错误: 'User or password error',
 };
--- a/src/locales/en-US/business/task.ts
+++ b/src/locales/en-US/business/task.ts
@@ -0,0 +1,3 @@
 export default {
  taskKanban: 'Task Kanban',
 };
--- a/src/locales/en-US/copy.ts
+++ b/src/locales/en-US/copy.ts
@@ -0,0 +1,56 @@
 export default {
  // info
  operation: 'Operations',
  info: 'Message',
  warn: 'Warn',
  error: 'Error',
  ok: 'OK',
  submit: 'Submit',
  confirm: 'Confirm',
  cancel: 'Cancel',
  desc: 'Description',
  descrition: 'Description',
  // action
  add: 'Add',
  edit: 'Edit',
  save: 'Save',
  query: 'Query',
  search: 'Search',
  reset: 'Reset',
  remove: 'Remove',
  view: 'View',
  upload: 'Upload',
  back: 'Back',
  'cancel.confirm': 'Confirm to cancel?',
  'remove.confirm': 'Confirm to remove?',
  'remove.batch': 'Batch remove',
  'pagination.total': 'Total {total} records',
  createTime: 'Created date',
  creatorName: 'Creator',
  modifyTime: 'Modified date',
  modifierName: 'Modifier',
  403: 'Sorry, you are not authorized to access this page.',
  404: 'Sorry, the page you visited does not exist.',
  resignin: 'Go Login',
  login: 'Sign in',
  signout: 'Sign out',
  signup: 'New user register',
  status: 'Status',
  'sort.by': 'Sort By',
  year: 'Year',
  month: 'Month',
  day: 'Day',
  order: 'Order',
  icon: 'Icon',
  uri: 'Address',
  url: 'Address',
  'expand/collapse': 'Expand/Collapse',
 };
--- a/src/locales/en-US/menu.ts
+++ b/src/locales/en-US/menu.ts
@@ -0,0 +1,15 @@
 export default {
  'menu.root': 'Root',
  'menu.home': 'Home',
  'menu.welcome': 'Welcome',
  'menu.sheet': 'Sheet',
  'menu.spare': 'Spare',
  'menu.groups': 'Depot',
  'menu.roles': 'Role',
  'menu.users': 'User',
  'menu.manual': 'Manual',
  'menu.menus': 'Menu',
  'menu.system': 'System',
  'menu.task': 'Task',
  'menu.task.kanban': 'Task Kanban',
 };
--- a/src/locales/en-US/pwa.ts
+++ b/src/locales/en-US/pwa.ts
@@ -0,0 +1,6 @@
 export default {
  'app.pwa.offline': 'You are offline now',
  'app.pwa.serviceworker.updated': 'New content is available',
  'app.pwa.serviceworker.updated.hint': 'Please press the "Refresh" button to reload current page',
  'app.pwa.serviceworker.updated.ok': 'Refresh',
 };
--- a/src/locales/zh-CN.ts
+++ b/src/locales/zh-CN.ts
@@ -0,0 +1,15 @@
 import business from './zh-CN/business';
 import copy from './zh-CN/copy';
 import menu from './zh-CN/menu';
 import pwa from './zh-CN/pwa';
 export default {
  'app.title': '管理系统',
  'app.description': '一个基于 React 和 MobX 的前端应用',
  'app.welcome': '欢迎使用',
  'app.copyright': 'Copyright © {year} Company Name',
  ...copy,
  ...menu,
  ...pwa,
  ...business,
 };
--- a/src/locales/zh-CN/business/index.ts
+++ b/src/locales/zh-CN/business/index.ts
@@ -0,0 +1,9 @@
 import repair from './repair';
 import system from './system';
 import task from './task';
 export default {
  ...system,
  ...repair,
  ...task,
 };
--- a/src/locales/zh-CN/business/repair.ts
+++ b/src/locales/zh-CN/business/repair.ts
@@ -0,0 +1,28 @@
 export default {
  'repair.partInfo.pn': 'PN编码',
  'repair.partInfo.name': '备件名称',
  'repair.partInfo.icv': 'ICV',
  'repair.partInfo.manHour': '标准维修工时',
  'repair.partInfo.engineer': '维修工程师',
  'repair.partInfo.workbench': '生产线',
  'repair.workbench.name': '生产线名称',
  'repair.workbench.desc': '生产线描述',
  'repair.workbench.exRecoverTime': '预计恢复时间',
  'repair.workbench.recoverTime': '恢复时间',
  'repair.workbench.faultTime': '故障时间',
  'repair.workbench.faultReason': '故障原因',
  'repair.workbench.fault': '故障',
  'repair.workbench.recover': '恢复',
  'repair.workbench.recover.warn': '确认恢复生产线?',
  'repair.workbench.parts': '查看可维修备件',
  'repair.calendar.isLeapYear': '是否闰年',
  'repair.calendar.days.workday': '工作日天数',
  'repair.calendar.days.weekend': '休息日天数',
  'repair.calendar.days.holiday': '节假日天数',
  'repair.stock.name': '库位',
  'repair.warn.pn.format': '请正确填写PN, 仅允许数字、大写字母和符号-',
 };
--- a/src/locales/zh-CN/business/system.ts
+++ b/src/locales/zh-CN/business/system.ts
@@ -0,0 +1,40 @@
 export default {
  'system.user.name': '用户名',
  'system.user.realName': '真实姓名',
  'system.user.phone': '手机号码',
  'system.user.role.change': '修改用户角色/维修中心',
  'system.user.password': '密码',
  'system.user.password.new': '新密码',
  'system.user.password.confirm': '确认密码',
  'system.user.password.confirm.fail': '两次输入密码不一致',
  'system.user.active.confirm': '确认是否激活用户',
  'system.user.active': '激活用户',
  'system.user.alive': '是否激活',
  'system.user.alive.yes': '已激活',
  'system.user.alive.no': '未激活',
  'system.user.warn.group.need': '用户角色为RE必须分配维修中心',
  'system.role': '角色',
  'system.role.name': '角色名称',
  'system.role.authority': '角色授权',
  'system.group': '用户组',
  'system.group.name': '用户组名称',
  'system.group.authority': '隐私权限',
  'system.page': '页面',
  'system.page.name': '页面名称',
  'system.page.type': '页面类型',
  'system.page.parent': '上级页面',
  'system.page.system': '所属系统',
  'system.sign.title': '账户密码登录',
  'system.sign.remember': '自动登录',
  'system.sign.forgot': '忘记密码',
  'system.warn.user.name': '请输入用户名',
  'system.warn.user.password': '请输入密码',
  用户名或密码错误: '用户名或密码错误',
 };
--- a/src/locales/zh-CN/business/task.ts
+++ b/src/locales/zh-CN/business/task.ts
@@ -0,0 +1,3 @@
 export default {
  taskKanban: '任务看板',
 };
--- a/src/locales/zh-CN/copy.ts
+++ b/src/locales/zh-CN/copy.ts
@@ -0,0 +1,55 @@
 export default {
  // info
  operation: '操作',
  info: '消息',
  warn: '警告',
  error: '异常',
  ok: '确定',
  submit: '提交',
  confirm: '确定',
  cancel: '取消',
  desc: '描述',
  descrition: '描述',
  // action
  add: '新增',
  edit: '编辑',
  save: '保存',
  query: '查询',
  search: '搜索',
  reset: '重置',
  remove: '删除',
  view: '查看',
  upload: '上传',
  back: '返回',
  'cancel.confirm': '确认取消?',
  'remove.confirm': '确认删除?',
  'remove.batch': '批量删除',
  'pagination.total': '共{total}条',
  'expand/collapse': '展开/折叠',
  createTime: '创建时间',
  creatorName: '创建人',
  modifyTime: '修改时间',
  modifierName: '修改人',
  403: '抱歉, 您没有该页面访问权限',
  404: '抱歉, 您访问的页面不存在',
  resignin: '重新登录',
  login: '登录',
  signout: '退出登录',
  signup: '新用户注册',
  status: '状态',
  'sort.by': '序号',
  order: '序号',
  icon: '图标',
  uri: '地址',
  url: '地址',
  year: '年',
  month: '月',
  day: '日',
 };
--- a/src/locales/zh-CN/menu.ts
+++ b/src/locales/zh-CN/menu.ts
@@ -0,0 +1,15 @@
 export default {
  'menu.root': '根菜单',
  'menu.home': '首页',
  'menu.welcome': '欢迎',
  'menu.sheet': '单据管理',
  'menu.spare': '备件配置',
  'menu.groups': '用户组',
  'menu.roles': '角色关系',
  'menu.users': '用户管理',
  'menu.manual': '使用说明',
  'menu.menus': '系统页面',
  'menu.system': '系统管理',
  'menu.task': '任务管理',
  'menu.task.kanban': '任务看板',
 };
--- a/src/locales/zh-CN/pwa.ts
+++ b/src/locales/zh-CN/pwa.ts
@@ -0,0 +1,6 @@
 export default {
  'app.pwa.offline': '当前处于离线状态',
  'app.pwa.serviceworker.updated': '有新内容',
  'app.pwa.serviceworker.updated.hint': '请点击“刷新”按钮或者手动刷新页面',
  'app.pwa.serviceworker.updated.ok': '刷新',
 };
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -0,0 +1,10 @@
 import { StrictMode } from 'react';
 import { createRoot } from 'react-dom/client';
 import App from './App.tsx';
 const root = document.getElementById('root')!;
 createRoot(root).render(
  <StrictMode>
    <App />
  </StrictMode>,
 );
--- a/src/models/attend/calendar.ts
+++ b/src/models/attend/calendar.ts
@@ -0,0 +1,15 @@
 import { services } from '@/services/attend/calendar';
 import { StarModel } from '@/components/Stars/StarModel';
 export const DayType = {
  Workday: 'Workday',
  Weekend: 'Weekend',
  Holiday: 'Holiday',
  AdjustDay: 'AdjustDay',
 };
 export default class Calendar extends StarModel {
  constructor() {
    super(services);
  }
 }
--- a/src/models/attend/leave.ts
+++ b/src/models/attend/leave.ts
@@ -0,0 +1,8 @@
 import { services } from '@/services/attend/calendar';
 import { StarModel } from '@/components/Stars/StarModel';
 export default class Leave extends StarModel {
  constructor() {
    super(services);
  }
 }
--- a/src/models/auth.d.ts
+++ b/src/models/auth.d.ts
@@ -0,0 +1,21 @@
 export const SystemType = {
  Web: '1',
  App: '2',
 };
 /**
 * 资源类型
 */
 export const ResourceType = {
  System: 'System',
  Page: 'Page',
 };
 /**
 * 权限类型
 */
 export const AuthorityType = {
  Default: 'Default',
  Deny: 'Deny',
  Allow: 'Allow',
 };
--- a/src/models/auth.ts
+++ b/src/models/auth.ts
@@ -0,0 +1,142 @@
 import { StarMessage } from '@/components/Stars/StarRequest/message';
 import storage from '@/components/Stars/utils/storage';
 import { to403, toLogin } from '@/routes/route';
 import { login, logout, userInfo } from '@/services/system/user';
 import { action, flow, observable } from 'mobx';
 import { makeObservable } from 'mobx';
 import { AuthorityType, SystemType } from './auth.d';
 import { RecordType } from '@/components/Stars/interface';
 import { systemAuthorize } from '@/services/system/system';
 import { systemAuthorizedPage, uriAuthorize } from '@/services/system/page';
 /**
 * 系统用户信息
 */
 export type User = {
  uid?: string;
  uname?: string;
  rid?: string;
  rname?: string;
  gid?: string;
  gname?: string;
  avatar?: string;
 };
 export const TOKEN = 'token';
 export const SYSTEM = SystemType.Web;
 class Auth {
  constructor() {
    makeObservable(this);
  }
  @observable
  user: User | undefined;
  @observable
  isLogin = false;
  @observable
  isInitialized = false;
  @observable
  menus: RecordType[] = [];
  @action
  async login(name: string, password: string, remember?: boolean) {
    const msg: StarMessage = await login(name, password, remember);
    if (msg.success()) {
      const memory = storage.get('remember');
      storage.save(TOKEN, msg.data.token, 0, remember || memory);
      if (remember || memory) storage.save('remember', true, 0, true);
      this.user = msg.data;
      return { status: 200, success: () => true };
    } else return msg;
  }
  /**
   * 登出
   */
  logout() {
    logout();
    this.clear();
    toLogin();
  }
  clear() {
    storage.remove(TOKEN);
    this.user = undefined;
    this.isLogin = false;
  }
  /**
   * 从token中获取用户信息
   * @returns 用户信息
   */
  @flow
  *init() {
    if (!this.user) {
      const token = storage.get(TOKEN);
      try {
        if (token) {
          const msg: StarMessage = yield userInfo();
          if (msg.success()) this.user = msg.data;
          else this.clear();
        }
      } catch (error) {
        console.error(`根据token获取用户信息出错: ${error}`);
      }
      this.isInitialized = true;
    }
  }
  get token() {
    return storage.get(TOKEN);
  }
  //******************权限认证 ******************//
  /**
   * 系统权限认证
   * @returns 是否认证通过
   */
  async isSystemAuthrized(): Promise<boolean> {
    const msg = await systemAuthorize(SYSTEM);
    if (msg.success()) {
      return msg.data === AuthorityType.Allow;
    }
    return false;
  }
  /**
   * 页面权限认证
   * @param uri 页面路径
   * @returns 是否认证通过
   */
  async isUriAuthrized(uri: string) {
    const msg = await uriAuthorize(uri);
    if (!msg.data) {
      to403();
    }
    if (msg.success()) {
      return msg.data === AuthorityType.Allow;
    }
    return false;
  }
  /**
   * 获取授权菜单
   * @returns 授权菜单
   */
  async authorizedMenus(): Promise<RecordType[]> {
    const rid = this.user?.rid;
    const msg = await systemAuthorizedPage(SYSTEM, rid || '');
    if (msg.success()) {
      this.menus = msg.data;
    }
    return this.menus;
  }
 }
 export default Auth;
--- a/src/models/doc/hospital.ts
+++ b/src/models/doc/hospital.ts
@@ -0,0 +1,15 @@
 import { StarModel } from '@/components/Stars/StarModel';
 import { RecordType } from '@/components/Stars/interface';
 import { services } from '@/services/doc/hospital';
 import { override } from 'mobx';
 export default class Hospital extends StarModel {
  constructor() {
    super(services);
  }
  @override
  *add(RecordType: RecordType) {
    yield services.add(RecordType);
  }
 }
--- a/src/models/doc/partInfo.ts
+++ b/src/models/doc/partInfo.ts
@@ -0,0 +1,8 @@
 import { StarModel } from '@/components/Stars/StarModel';
 import { services } from '@/services/doc/partInfo';
 export default class PartInfo extends StarModel {
  constructor() {
    super(services);
  }
 }
--- a/src/models/doc/stock.ts
+++ b/src/models/doc/stock.ts
@@ -0,0 +1,18 @@
 import { StarModel } from '@/components/Stars/StarModel';
 import { StarMessage } from '@/components/Stars/StarRequest/message';
 import { rootStock, services } from '@/services/doc/stock';
 import { flow } from 'mobx';
 export default class Stock extends StarModel {
  constructor() {
    super(services);
  }
  @flow
  *rootStock() {
    const msg: StarMessage = yield rootStock();
    if (msg.success()) {
      this.data.list = msg.data;
    }
  }
 }
--- a/src/models/doc/workbench.ts
+++ b/src/models/doc/workbench.ts
@@ -0,0 +1,21 @@
 import { RecordType } from '@/components/Stars/interface';
 import { StarModel } from '@/components/Stars/StarModel';
 import { StarMessage } from '@/components/Stars/StarRequest/message';
 import { services, workbenchParts } from '@/services/doc/workbench';
 import { flow } from 'mobx';
 export default class Workbench extends StarModel {
  constructor() {
    super(services);
  }
  parts: RecordType[] = [];
  @flow
  *workbenchParts(id: string) {
    const msg: StarMessage = yield workbenchParts(id);
    if (msg.success()) {
      this.parts = msg.data;
    }
  }
 }
--- a/src/models/index.ts
+++ b/src/models/index.ts
@@ -0,0 +1,79 @@
 import { RecordType } from '@/components/Stars/interface';
 import { inject, IWrappedComponent, observer } from 'mobx-react';
 import Calendar from './attend/calendar';
 import Leave from './attend/leave';
 import Hospital from './doc/hospital';
 import PartInfo from './doc/partInfo';
 import Stock from './doc/stock';
 import Workbench from './doc/workbench';
 import Icv from './plan/icv';
 import Priority from './plan/priority';
 import Authority from './system/authority';
 import Config from './system/config';
 import Group from './system/group';
 import Page from './system/page';
 import Role from './system/role';
 import System from './system/system';
 import User from './system/user';
 import Auth from './auth';
 import Setting from './setting';
 export class Models {
  role = new Role();
  user = new User();
  group = new Group();
  system = new System();
  page = new Page();
  authority = new Authority();
  calendar = new Calendar();
  leave = new Leave();
  icv = new Icv();
  priority = new Priority();
  hospital = new Hospital();
  partInfo = new PartInfo();
  stock = new Stock();
  workbench = new Workbench();
  config = new Config();
  auth = new Auth();
  setting = new Setting();
 }
 const models = new Models();
 export default models;
 export type IReactComponent<P = any> =
  | React.ClassicComponentClass<P>
  | React.ComponentClass<P>
  | React.FunctionComponent<P>
  | React.ForwardRefExoticComponent<P>;
 export function connect(
  storeMapper: (models: Models) => RecordType,
 ): <T extends IReactComponent>(target: T) => T & IWrappedComponent<{}>;
 export function connect(storeMapper: (models: Models) => RecordType) {
  return (component: IReactComponent) => {
    return inject(() => {
      // 将 stores 转换为 props
      const mappedProps = storeMapper(models);
      return mappedProps;
    })(observer(component));
  };
 }
 export function useModel() {
  return models;
 }
 export function useAuth() {
  return models.auth;
 }
 export function useSetting() {
  return models.setting;
 }
--- a/src/models/plan/icv.ts
+++ b/src/models/plan/icv.ts
@@ -0,0 +1,8 @@
 import { services } from '@/services/plan/icv';
 import { StarModel } from '@/components/Stars/StarModel';
 export default class Icv extends StarModel {
  constructor() {
    super(services);
  }
 }
--- a/src/models/plan/priority.ts
+++ b/src/models/plan/priority.ts
@@ -0,0 +1,8 @@
 import { services } from '@/services/plan/priority';
 import { StarModel } from '@/components/Stars/StarModel';
 export default class Priority extends StarModel {
  constructor() {
    super(services);
  }
 }
--- a/src/models/repair/order.ts
+++ b/src/models/repair/order.ts
@@ -0,0 +1,8 @@
 import { services } from '@/services/repair/order';
 import { StarModel } from '@/components/Stars/StarModel';
 export default class Order extends StarModel {
  constructor() {
    super(services);
  }
 }
--- a/src/models/setting.ts
+++ b/src/models/setting.ts
@@ -0,0 +1,76 @@
 import { action } from 'mobx';
 import { Locale } from 'antd/lib/locale';
 import { computed, makeObservable, observable } from 'mobx';
 import enUS from 'antd/locale/en_US';
 import zhCN from 'antd/locale/zh_CN';
 import enUSMessages from '../locales/en-US';
 import zhCNMessages from '../locales/zh-CN';
 import { theme, ThemeConfig } from 'antd';
 import storage from '@/components/Stars/utils/storage';
 // 定义 locales 的类型
 type LocalesType = {
  antd: Locale;
  messages: Record<string, string>;
 };
 const locales: Record<string, LocalesType> = {
  'zh-CN': {
    antd: zhCN,
    messages: zhCNMessages,
  },
  'en-US': {
    antd: enUS,
    messages: enUSMessages,
  },
 };
 export default class Setting {
  constructor() {
    makeObservable(this);
  }
  @observable
  isInitialized = false;
  @observable
  locale = storage.get('locale') || 'zh-CN';
  @observable
  appTheme = storage.get('theme') || '#1890ff';
  @observable
  darkMode = storage.get('darkMode') === 'true';
  @computed
  public get themeConfig(): ThemeConfig {
    return {
      algorithm: this.darkMode ? theme.darkAlgorithm : theme.defaultAlgorithm,
      token: { colorPrimary: this.appTheme },
      cssVar: true,
    };
  }
  @computed
  public get currentLocale(): LocalesType {
    return locales[this.locale];
  }
  @action
  public setLocale(locale: string) {
    this.locale = locale;
    storage.save('locale', locale, 1000 * 60 * 60 * 24 * 360 * 10, true);
  }
  @action
  public setAppTheme(theme: string) {
    this.appTheme = theme;
    storage.save('theme', theme, 1000 * 60 * 60 * 24 * 360 * 10, true);
  }
  @action
  public toggleDarkMode() {
    this.darkMode = !this.darkMode;
    storage.save('dark-mode', String(this.darkMode), 1000 * 60 * 60 * 24 * 360 * 10, true);
  }
 }
--- a/src/models/system/authority.ts
+++ b/src/models/system/authority.ts
@@ -0,0 +1,86 @@
 import { StarModel } from '@/components/Stars/StarModel';
 import { StarMessage } from '@/components/Stars/StarRequest/message';
 import { addBatch, removeByResourceRole, services } from '@/services/system/authority';
 import { action, flow } from 'mobx';
 import { AuthorityType, ResourceType } from '../auth.d';
 type AuthType = {
  type?: string;
  role: string;
  authority?: string;
  resource: string[];
 };
 export default class Authority extends StarModel {
  constructor() {
    super(services);
  }
  @flow
  *addSystemAuthority(authInfo: AuthType) {
    const params = {
      type: ResourceType.System,
      authority: AuthorityType.Allow,
      ...authInfo,
    };
    const msg: StarMessage = yield addBatch(params);
    if (msg.success(true)) {
      this.addTolist(params);
    }
  }
  @flow
  *delSystemAuthority(authInfo: AuthType) {
    const params = {
      type: ResourceType.System,
      ...authInfo,
    };
    const msg: StarMessage = yield removeByResourceRole(params);
    if (msg.success(true)) {
      this.delFromList(params);
    }
  }
  @flow
  *addPageAuthority(authInfo: AuthType) {
    const params = {
      type: ResourceType.Page,
      authority: AuthorityType.Allow,
      ...authInfo,
    };
    const msg: StarMessage = yield addBatch(params);
    if (msg.success(true)) {
      this.addTolist(params);
    }
  }
  @flow
  *delPageAuthority(authInfo: AuthType) {
    const params = {
      type: ResourceType.Page,
      ...authInfo,
    };
    const msg: StarMessage = yield removeByResourceRole(params);
    if (msg.success(true)) {
      this.delFromList(params);
    }
  }
  @action
  addTolist(params: AuthType) {
    const { list } = this.data;
    const authorities = params.resource.map((a: any) => ({
      ...params,
      resource: a,
    }));
    this.data.list = list.concat(authorities);
  }
  @action
  delFromList(params: AuthType) {
    const { list } = this.data;
    this.data.list = list.filter((a: any) => {
      return a.type !== params.type || a.role !== params.role || !params.resource.includes(a.resource);
    });
  }
 }
--- a/src/models/system/config.ts
+++ b/src/models/system/config.ts
@@ -0,0 +1,25 @@
 import { StarModel } from '@/components/Stars/StarModel';
 import message, { StarMessage } from '@/components/Stars/StarRequest/message';
 import { RecordType } from '@/components/Stars/interface';
 import { services } from '@/services/system/config';
 import { flow, observable } from 'mobx';
 export default class Config extends StarModel {
  constructor() {
    super(services);
  }
  @observable
  configs: RecordType = {};
  @flow
  *load(id: string) {
    const res: StarMessage = yield services.get(id);
    const msg = message(res);
    if (msg.success() && msg.data) {
      const payload: RecordType = {};
      payload[msg.data.id] = msg.data.items;
      this.configs = { ...this.configs, ...payload };
    }
  }
 }
--- a/src/models/system/group.ts
+++ b/src/models/system/group.ts
@@ -0,0 +1,8 @@
 import { StarModel } from '@/components/Stars/StarModel';
 import { services } from '@/services/system/group';
 export default class Group extends StarModel {
  constructor() {
    super(services);
  }
 }
--- a/src/models/system/page.ts
+++ b/src/models/system/page.ts
@@ -0,0 +1,11 @@
 import { RecordType } from '@/components/Stars/interface';
 import { StarModel } from '@/components/Stars/StarModel';
 import { services } from '@/services/system/page';
 export default class Page extends StarModel {
  pages: RecordType[] = [];
  constructor() {
    super(services);
  }
 }
--- a/src/models/system/role.ts
+++ b/src/models/system/role.ts
@@ -0,0 +1,8 @@
 import { services } from '@/services/system/role';
 import { StarModel } from '@/components/Stars/StarModel';
 export default class Role extends StarModel {
  constructor() {
    super(services);
  }
 }
--- a/src/models/system/system.ts
+++ b/src/models/system/system.ts
@@ -0,0 +1,8 @@
 import { services } from '@/services/system/system';
 import { StarModel } from '@/components/Stars/StarModel';
 export default class System extends StarModel {
  constructor() {
    super(services);
  }
 }
--- a/src/models/system/user.ts
+++ b/src/models/system/user.ts
@@ -0,0 +1,20 @@
 import { RecordType } from '@/components/Stars/interface';
 import { StarModel } from '@/components/Stars/StarModel';
 import { StarMessage } from '@/components/Stars/StarRequest/message';
 import { services } from '@/services/system/user';
 import { flow } from 'mobx';
 export default class User extends StarModel {
  constructor() {
    super(services);
  }
  @flow
  *active(payload: RecordType) {
    const user = payload;
    user.alive = true;
    const msg: StarMessage = yield services.update(payload);
    msg.success(true);
    payload;
  }
 }
--- a/src/pages/403.tsx
+++ b/src/pages/403.tsx
@@ -0,0 +1,22 @@
 import { useIntl } from '@/define';
 import { LoginUrl } from '@/routes/route';
 import { Button, Result } from 'antd';
 import { Link } from '@/define';
 const NoFoundPage: React.FC<{}> = () => {
  const { formatMessage } = useIntl();
  return (
    <Result
      status={403}
      title="403"
      subTitle={formatMessage({ id: '403' })}
      extra={
        <Button type="primary">
          <Link to={LoginUrl}> {formatMessage({ id: 'resignin' })}</Link>
        </Button>
      }
    />
  );
 };
 export default NoFoundPage;
--- a/Show More
+++ b/Show More
		`@@ -0,0 +1,2 @@`
							`VITE_USER_NAME=admin`
							`VITE_PASSWORD=88888888`
		`@@ -0,0 +1 @@`
							<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
		`@@ -0,0 +1,2 @@`
							`export { default as StarMoneyInput } from './component/StarMoneyInput';`
							`export { default as StarMoneyLabel } from './component/StarMoneyLabel';`
		`@@ -0,0 +1,2 @@`
							`export * from 'react-intl';`
							`export * from 'react-router-dom';`
		`@@ -0,0 +1,3 @@`
							`import MainLayout from "./MainLayout";`

							`export default MainLayout;`