From 2920a8d6021f55ff7b1cea427b7cd229544b0af6 Mon Sep 17 00:00:00 2001 From: alex Date: Sat, 22 Mar 2025 00:01:11 +0800 Subject: [PATCH] init --- .env.development | 2 + .gitignore | 33 + .prettierrc | 6 + README.md | 66 + index.html | 13 + package.json | 45 + public/vite.svg | 1 + src/@types/spark-md5.d.ts | 6 + src/App.tsx | 22 + src/assets/login_bg.svg | 69 + src/assets/logo.svg | 1 + src/components/Planet/PageTable.tsx | 82 + src/components/SelectLang/index.tsx | 434 +++ src/components/Stars/StarDatePicker/index.tsx | 80 + src/components/Stars/StarElement/index.tsx | 190 ++ src/components/Stars/StarElement/type.ts | 73 + src/components/Stars/StarForm/index.tsx | 96 + src/components/Stars/StarForm/layout.ts | 6 + src/components/Stars/StarForm/type.ts | 19 + src/components/Stars/StarFormat/index.ts | 30 + src/components/Stars/StarLabel/index.tsx | 27 + src/components/Stars/StarLayout/index.ts | 23 + src/components/Stars/StarModal/index.tsx | 35 + src/components/Stars/StarModel/index.ts | 72 + src/components/Stars/StarModel/interface.ts | 26 + .../StarMoney/component/StarMoneyInput.tsx | 26 + .../StarMoney/component/StarMoneyLabel.tsx | 17 + src/components/Stars/StarMoney/index.ts | 2 + src/components/Stars/StarMoney/interface.ts | 13 + src/components/Stars/StarRequest/index.ts | 19 + src/components/Stars/StarRequest/message.ts | 45 + src/components/Stars/StarService/index.ts | 60 + src/components/Stars/StarStyles/index.ts | 8 + .../Stars/StarStyles/tailwind-utils.ts | 52 + src/components/Stars/StarStyles/theme.ts | 189 ++ .../Stars/StarTable/component/TableColumn.tsx | 199 ++ .../StarTable/component/TableEditCell.tsx | 39 + .../Stars/StarTable/component/TableForm.tsx | 87 + .../Stars/StarTable/component/TableQuery.tsx | 79 + .../StarTable/component/TableToolbar.tsx | 29 + src/components/Stars/StarTable/index.tsx | 160 + src/components/Stars/StarTable/interface.ts | 166 + src/components/Stars/StarTree/index.tsx | 42 + src/components/Stars/index.ts | 53 + src/components/Stars/interface.ts | 12 + src/components/Stars/utils/clone.ts | 23 + src/components/Stars/utils/currency.ts | 99 + src/components/Stars/utils/datetime.ts | 11 + src/components/Stars/utils/index.ts | 239 ++ src/components/Stars/utils/storage.ts | 44 + src/components/Stars/utils/tree.ts | 63 + src/components/Stars/utils/url.ts | 48 + src/define.ts | 2 + src/layouts/BlankLayout.tsx | 8 + src/layouts/MainLayout.tsx | 160 + src/layouts/SecurityLayout.tsx | 40 + src/layouts/UserLayout.tsx | 40 + src/layouts/components/Footer/index.tsx | 6 + .../RightContent/AvatarDropdown.tsx | 41 + src/layouts/components/RightContent/index.tsx | 33 + src/layouts/components/RightContent/style.css | 9 + src/layouts/index.tsx | 3 + src/locales/en-US.ts | 11 + src/locales/en-US/business/index.ts | 9 + src/locales/en-US/business/repair.ts | 29 + src/locales/en-US/business/system.ts | 42 + src/locales/en-US/business/task.ts | 3 + src/locales/en-US/copy.ts | 56 + src/locales/en-US/menu.ts | 15 + src/locales/en-US/pwa.ts | 6 + src/locales/zh-CN.ts | 15 + src/locales/zh-CN/business/index.ts | 9 + src/locales/zh-CN/business/repair.ts | 28 + src/locales/zh-CN/business/system.ts | 40 + src/locales/zh-CN/business/task.ts | 3 + src/locales/zh-CN/copy.ts | 55 + src/locales/zh-CN/menu.ts | 15 + src/locales/zh-CN/pwa.ts | 6 + src/main.tsx | 10 + src/models/attend/calendar.ts | 15 + src/models/attend/leave.ts | 8 + src/models/auth.d.ts | 21 + src/models/auth.ts | 142 + src/models/doc/hospital.ts | 15 + src/models/doc/partInfo.ts | 8 + src/models/doc/stock.ts | 18 + src/models/doc/workbench.ts | 21 + src/models/index.ts | 79 + src/models/plan/icv.ts | 8 + src/models/plan/priority.ts | 8 + src/models/repair/order.ts | 8 + src/models/setting.ts | 76 + src/models/system/authority.ts | 86 + src/models/system/config.ts | 25 + src/models/system/group.ts | 8 + src/models/system/page.ts | 11 + src/models/system/role.ts | 8 + src/models/system/system.ts | 8 + src/models/system/user.ts | 20 + src/pages/403.tsx | 22 + src/pages/404.tsx | 22 + src/pages/attend/calendar/Editor.tsx | 274 ++ src/pages/attend/calendar/Viewer.tsx | 118 + src/pages/attend/calendar/index.tsx | 89 + src/pages/attend/leaves/index.tsx | 105 + src/pages/doc/part-info.tsx | 212 ++ src/pages/doc/stocks.tsx | 94 + src/pages/doc/workbenches/FaultInfo.tsx | 92 + src/pages/doc/workbenches/Parts.tsx | 70 + src/pages/doc/workbenches/Viewer.tsx | 166 + src/pages/doc/workbenches/index.tsx | 212 ++ src/pages/index.tsx | 8 + src/pages/login/index.tsx | 216 ++ src/pages/plan/icv/Editor.tsx | 215 ++ src/pages/plan/icv/index.tsx | 92 + src/pages/plan/priority.tsx | 114 + src/pages/system/groups/index.tsx | 39 + src/pages/system/menus/index.tsx | 198 ++ src/pages/system/roles/Authority.tsx | 168 ++ src/pages/system/roles/index.tsx | 90 + src/pages/system/users/RoleModify.tsx | 93 + src/pages/system/users/index.tsx | 194 ++ src/pages/system/users/password/index.tsx | 137 + src/pages/system/users/password/success.tsx | 23 + src/routes/index.tsx | 92 + src/routes/route.tsx | 176 ++ src/services/attend/calendar.ts | 17 + src/services/attend/leave.ts | 17 + src/services/doc/hospital.ts | 6 + src/services/doc/partInfo.ts | 23 + src/services/doc/stock.ts | 25 + src/services/doc/workbench.ts | 36 + src/services/index.ts | 1 + src/services/plan/icv.ts | 7 + src/services/plan/priority.ts | 7 + src/services/repair/order.ts | 93 + src/services/system/authority.ts | 30 + src/services/system/config.ts | 5 + src/services/system/group.ts | 13 + src/services/system/page.ts | 47 + src/services/system/role.ts | 5 + src/services/system/system.ts | 16 + src/services/system/user.ts | 36 + src/stores/auth-store.ts | 97 + src/stores/settings-store.ts | 37 + src/style.css | 5 + src/utils/icons.tsx | 19 + src/utils/request.ts | 155 + src/vite-env.d.ts | 5 + tsconfig.app.json | 36 + tsconfig.json | 7 + tsconfig.node.json | 10 + vite.config.d.ts | 2 + vite.config.ts | 24 + yarn.lock | 2667 +++++++++++++++++ 155 files changed, 11347 insertions(+) create mode 100644 .env.development create mode 100644 .gitignore create mode 100644 .prettierrc create mode 100644 README.md create mode 100644 index.html create mode 100644 package.json create mode 100644 public/vite.svg create mode 100644 src/@types/spark-md5.d.ts create mode 100644 src/App.tsx create mode 100644 src/assets/login_bg.svg create mode 100644 src/assets/logo.svg create mode 100644 src/components/Planet/PageTable.tsx create mode 100644 src/components/SelectLang/index.tsx create mode 100644 src/components/Stars/StarDatePicker/index.tsx create mode 100644 src/components/Stars/StarElement/index.tsx create mode 100644 src/components/Stars/StarElement/type.ts create mode 100644 src/components/Stars/StarForm/index.tsx create mode 100644 src/components/Stars/StarForm/layout.ts create mode 100644 src/components/Stars/StarForm/type.ts create mode 100644 src/components/Stars/StarFormat/index.ts create mode 100644 src/components/Stars/StarLabel/index.tsx create mode 100644 src/components/Stars/StarLayout/index.ts create mode 100644 src/components/Stars/StarModal/index.tsx create mode 100644 src/components/Stars/StarModel/index.ts create mode 100644 src/components/Stars/StarModel/interface.ts create mode 100644 src/components/Stars/StarMoney/component/StarMoneyInput.tsx create mode 100644 src/components/Stars/StarMoney/component/StarMoneyLabel.tsx create mode 100644 src/components/Stars/StarMoney/index.ts create mode 100644 src/components/Stars/StarMoney/interface.ts create mode 100644 src/components/Stars/StarRequest/index.ts create mode 100644 src/components/Stars/StarRequest/message.ts create mode 100644 src/components/Stars/StarService/index.ts create mode 100644 src/components/Stars/StarStyles/index.ts create mode 100644 src/components/Stars/StarStyles/tailwind-utils.ts create mode 100644 src/components/Stars/StarStyles/theme.ts create mode 100644 src/components/Stars/StarTable/component/TableColumn.tsx create mode 100644 src/components/Stars/StarTable/component/TableEditCell.tsx create mode 100644 src/components/Stars/StarTable/component/TableForm.tsx create mode 100644 src/components/Stars/StarTable/component/TableQuery.tsx create mode 100644 src/components/Stars/StarTable/component/TableToolbar.tsx create mode 100644 src/components/Stars/StarTable/index.tsx create mode 100644 src/components/Stars/StarTable/interface.ts create mode 100644 src/components/Stars/StarTree/index.tsx create mode 100644 src/components/Stars/index.ts create mode 100644 src/components/Stars/interface.ts create mode 100644 src/components/Stars/utils/clone.ts create mode 100644 src/components/Stars/utils/currency.ts create mode 100644 src/components/Stars/utils/datetime.ts create mode 100644 src/components/Stars/utils/index.ts create mode 100644 src/components/Stars/utils/storage.ts create mode 100644 src/components/Stars/utils/tree.ts create mode 100644 src/components/Stars/utils/url.ts create mode 100644 src/define.ts create mode 100644 src/layouts/BlankLayout.tsx create mode 100644 src/layouts/MainLayout.tsx create mode 100644 src/layouts/SecurityLayout.tsx create mode 100644 src/layouts/UserLayout.tsx create mode 100644 src/layouts/components/Footer/index.tsx create mode 100644 src/layouts/components/RightContent/AvatarDropdown.tsx create mode 100644 src/layouts/components/RightContent/index.tsx create mode 100644 src/layouts/components/RightContent/style.css create mode 100644 src/layouts/index.tsx create mode 100644 src/locales/en-US.ts create mode 100644 src/locales/en-US/business/index.ts create mode 100644 src/locales/en-US/business/repair.ts create mode 100644 src/locales/en-US/business/system.ts create mode 100644 src/locales/en-US/business/task.ts create mode 100644 src/locales/en-US/copy.ts create mode 100644 src/locales/en-US/menu.ts create mode 100644 src/locales/en-US/pwa.ts create mode 100644 src/locales/zh-CN.ts create mode 100644 src/locales/zh-CN/business/index.ts create mode 100644 src/locales/zh-CN/business/repair.ts create mode 100644 src/locales/zh-CN/business/system.ts create mode 100644 src/locales/zh-CN/business/task.ts create mode 100644 src/locales/zh-CN/copy.ts create mode 100644 src/locales/zh-CN/menu.ts create mode 100644 src/locales/zh-CN/pwa.ts create mode 100644 src/main.tsx create mode 100644 src/models/attend/calendar.ts create mode 100644 src/models/attend/leave.ts create mode 100644 src/models/auth.d.ts create mode 100644 src/models/auth.ts create mode 100644 src/models/doc/hospital.ts create mode 100644 src/models/doc/partInfo.ts create mode 100644 src/models/doc/stock.ts create mode 100644 src/models/doc/workbench.ts create mode 100644 src/models/index.ts create mode 100644 src/models/plan/icv.ts create mode 100644 src/models/plan/priority.ts create mode 100644 src/models/repair/order.ts create mode 100644 src/models/setting.ts create mode 100644 src/models/system/authority.ts create mode 100644 src/models/system/config.ts create mode 100644 src/models/system/group.ts create mode 100644 src/models/system/page.ts create mode 100644 src/models/system/role.ts create mode 100644 src/models/system/system.ts create mode 100644 src/models/system/user.ts create mode 100644 src/pages/403.tsx create mode 100644 src/pages/404.tsx create mode 100644 src/pages/attend/calendar/Editor.tsx create mode 100644 src/pages/attend/calendar/Viewer.tsx create mode 100644 src/pages/attend/calendar/index.tsx create mode 100644 src/pages/attend/leaves/index.tsx create mode 100644 src/pages/doc/part-info.tsx create mode 100644 src/pages/doc/stocks.tsx create mode 100644 src/pages/doc/workbenches/FaultInfo.tsx create mode 100644 src/pages/doc/workbenches/Parts.tsx create mode 100644 src/pages/doc/workbenches/Viewer.tsx create mode 100644 src/pages/doc/workbenches/index.tsx create mode 100644 src/pages/index.tsx create mode 100644 src/pages/login/index.tsx create mode 100644 src/pages/plan/icv/Editor.tsx create mode 100644 src/pages/plan/icv/index.tsx create mode 100644 src/pages/plan/priority.tsx create mode 100644 src/pages/system/groups/index.tsx create mode 100644 src/pages/system/menus/index.tsx create mode 100644 src/pages/system/roles/Authority.tsx create mode 100644 src/pages/system/roles/index.tsx create mode 100644 src/pages/system/users/RoleModify.tsx create mode 100644 src/pages/system/users/index.tsx create mode 100644 src/pages/system/users/password/index.tsx create mode 100644 src/pages/system/users/password/success.tsx create mode 100644 src/routes/index.tsx create mode 100644 src/routes/route.tsx create mode 100644 src/services/attend/calendar.ts create mode 100644 src/services/attend/leave.ts create mode 100644 src/services/doc/hospital.ts create mode 100644 src/services/doc/partInfo.ts create mode 100644 src/services/doc/stock.ts create mode 100644 src/services/doc/workbench.ts create mode 100644 src/services/index.ts create mode 100644 src/services/plan/icv.ts create mode 100644 src/services/plan/priority.ts create mode 100644 src/services/repair/order.ts create mode 100644 src/services/system/authority.ts create mode 100644 src/services/system/config.ts create mode 100644 src/services/system/group.ts create mode 100644 src/services/system/page.ts create mode 100644 src/services/system/role.ts create mode 100644 src/services/system/system.ts create mode 100644 src/services/system/user.ts create mode 100644 src/stores/auth-store.ts create mode 100644 src/stores/settings-store.ts create mode 100644 src/style.css create mode 100644 src/utils/icons.tsx create mode 100644 src/utils/request.ts create mode 100644 src/vite-env.d.ts create mode 100644 tsconfig.app.json create mode 100644 tsconfig.json create mode 100644 tsconfig.node.json create mode 100644 vite.config.d.ts create mode 100644 vite.config.ts create mode 100644 yarn.lock diff --git a/.env.development b/.env.development new file mode 100644 index 0000000..b3b3663 --- /dev/null +++ b/.env.development @@ -0,0 +1,2 @@ +VITE_USER_NAME=admin +VITE_PASSWORD=88888888 diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..3d78e2b --- /dev/null +++ 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 diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..21292b8 --- /dev/null +++ b/.prettierrc @@ -0,0 +1,6 @@ +{ + "plugins": ["prettier-plugin-tailwindcss"], + "singleQuote": true, + "trailingComma": "all", + "printWidth": 120 +} diff --git a/README.md b/README.md new file mode 100644 index 0000000..60c0a77 --- /dev/null +++ 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. 布局中包含暗黑模式功能，用户可以选择暗黑模式，切换暗黑模式后，页面会自动刷新。 diff --git a/index.html b/index.html new file mode 100644 index 0000000..7234572 --- /dev/null +++ b/index.html @@ -0,0 +1,13 @@ + + + + + + + Aphrodite + + +
+ + + diff --git a/package.json b/package.json new file mode 100644 index 0000000..bb35572 --- /dev/null +++ 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" + } +} diff --git a/public/vite.svg b/public/vite.svg new file mode 100644 index 0000000..e7b8dfb --- /dev/null +++ b/public/vite.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/@types/spark-md5.d.ts b/src/@types/spark-md5.d.ts new file mode 100644 index 0000000..c2fde4c --- /dev/null +++ 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; +} \ No newline at end of file diff --git a/src/App.tsx b/src/App.tsx new file mode 100644 index 0000000..1ec71ab --- /dev/null +++ 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 ( + + + + + + + + ); +} +const ObserverApp = observer(App); +export default ObserverApp; diff --git a/src/assets/login_bg.svg b/src/assets/login_bg.svg new file mode 100644 index 0000000..89c2597 --- /dev/null +++ b/src/assets/login_bg.svg @@ -0,0 +1,69 @@ + + + + Group 21 + Created with Sketch. + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/assets/logo.svg b/src/assets/logo.svg new file mode 100644 index 0000000..6c87de9 --- /dev/null +++ b/src/assets/logo.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/components/Planet/PageTable.tsx b/src/components/Planet/PageTable.tsx new file mode 100644 index 0000000..7e99d0e --- /dev/null +++ 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 ( + { + 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; diff --git a/src/components/SelectLang/index.tsx b/src/components/SelectLang/index.tsx new file mode 100644 index 0000000..2332ead --- /dev/null +++ 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 = ({ 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 = (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: ( + <> + + {localeObj?.icon || '🌐'} + + {localeObj?.label || 'en-US'} + + ), + })), + }; + + const inlineStyle = { + cursor: 'pointer', + padding: '12px', + display: 'inline-flex', + alignItems: 'center', + justifyContent: 'center', + fontSize: 18, + verticalAlign: 'middle', + ...style, + }; + + return ( + + + + {icon ? ( + icon + ) : ( + + )} + + + + ); +}; diff --git a/src/components/Stars/StarDatePicker/index.tsx b/src/components/Stars/StarDatePicker/index.tsx new file mode 100644 index 0000000..3238fb5 --- /dev/null +++ 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 & { + format?: string; + onChange?: (dt: string) => void; +}; + +export type StarDateRangePickerProps = Omit & { + value?: string[]; + format?: string; + showTime?: boolean; + onRangeChange?: (range: string[]) => void; +}; + +const StarDatePicker: React.FC = (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 ( + { + if (m) { + onChange!(m.format(format || 'yyyy-MM-DDTHH:mm:ss.SSSZ')); + } + }} + {...restProps} + /> + ); +}; + +export default StarDatePicker; + +export const StarDateRangePicker: React.FC = (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 ( + { + 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} + /> + ); +}; diff --git a/src/components/Stars/StarElement/index.tsx b/src/components/Stars/StarElement/index.tsx new file mode 100644 index 0000000..241c03e --- /dev/null +++ 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 JSX.Element> = { + [ElementType.Label]: (props) => { + const { style, value, ...rest } = props as RecordType; + return ; + }, + [ElementType.TextArea]: (props) => { + const elementProps = props as TextAreaProps; + return