diff --git a/.dockerignore b/.dockerignore
index e4e8e72e..0670cd7d 100644
--- a/.dockerignore
+++ b/.dockerignore
@@ -4,4 +4,5 @@
.vscode
.gitignore
Makefile
-docs
\ No newline at end of file
+docs
+.eslintcache
\ No newline at end of file
diff --git a/.gitignore b/.gitignore
index 6a23f89e..1382829f 100644
--- a/.gitignore
+++ b/.gitignore
@@ -10,4 +10,5 @@ web/dist
.env
one-api
.DS_Store
-tiktoken_cache
\ No newline at end of file
+tiktoken_cache
+.eslintcache
\ No newline at end of file
diff --git a/LICENSE b/LICENSE
index 261eeb9e..71284f6d 100644
--- a/LICENSE
+++ b/LICENSE
@@ -1,201 +1,103 @@
- Apache License
- Version 2.0, January 2004
- http://www.apache.org/licenses/
+# **New API 许可协议 (Licensing)**
- TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+本项目采用**基于使用场景的双重许可 (Usage-Based Dual Licensing)** 模式。
- 1. Definitions.
+**核心原则：**
- "License" shall mean the terms and conditions for use, reproduction,
- and distribution as defined by Sections 1 through 9 of this document.
+- **默认许可:** 本项目默认在 **GNU Affero 通用公共许可证 v3.0 (AGPLv3)** 下提供。任何用户在遵守 AGPLv3 条款和下述附加限制的前提下，均可免费使用。
+- **商业许可:** 在特定商业场景下，或当您希望获得 AGPLv3 之外的权利时，**必须**获取**商业许可证 (Commercial License)**。
- "Licensor" shall mean the copyright owner or entity authorized by
- the copyright owner that is granting the License.
+---
- "Legal Entity" shall mean the union of the acting entity and all
- other entities that control, are controlled by, or are under common
- control with that entity. For the purposes of this definition,
- "control" means (i) the power, direct or indirect, to cause the
- direction or management of such entity, whether by contract or
- otherwise, or (ii) ownership of fifty percent (50%) or more of the
- outstanding shares, or (iii) beneficial ownership of such entity.
+## **1. 开源许可证 (Open Source License): AGPLv3 - 适用于基础使用**
- "You" (or "Your") shall mean an individual or Legal Entity
- exercising permissions granted by this License.
+- 在遵守 **AGPLv3** 条款的前提下，您可以自由地使用、修改和分发 New API。AGPLv3 的完整文本可以访问 [https://www.gnu.org/licenses/agpl-3.0.html](https://www.gnu.org/licenses/agpl-3.0.html) 获取。
+- **核心义务:** AGPLv3 的一个关键要求是，如果您修改了 New API 并通过网络提供服务 (SaaS)，或者分发了修改后的版本，您必须以 AGPLv3 许可证向所有用户提供相应的**完整源代码**。
+- **附加限制 (重要):** 在仅使用 AGPLv3 开源许可证的情况下，您**必须**完整保留项目代码中原有的品牌标识、LOGO 及版权声明信息。**禁止以任何形式修改、移除或遮盖**这些信息。如需移除，必须获取商业许可证。
+- 使用前请务必仔细阅读并理解 AGPLv3 的所有条款及上述附加限制。
- "Source" form shall mean the preferred form for making modifications,
- including but not limited to software source code, documentation
- source, and configuration files.
+## **2. 商业许可证 (Commercial License) - 适用于高级场景及闭源需求**
- "Object" form shall mean any form resulting from mechanical
- transformation or translation of a Source form, including but
- not limited to compiled object code, generated documentation,
- and conversions to other media types.
+在以下任一情况下，您**必须**联系我们获取并签署一份商业许可证，才能合法使用 New API：
- "Work" shall mean the work of authorship, whether in Source or
- Object form, made available under the License, as indicated by a
- copyright notice that is included in or attached to the work
- (an example is provided in the Appendix below).
+- **场景一：移除品牌和版权信息**
+ 您希望在您的产品或服务中移除 New API 的 LOGO、UI界面中的版权声明或其他品牌标识。
- "Derivative Works" shall mean any work, whether in Source or Object
- form, that is based on (or derived from) the Work and for which the
- editorial revisions, annotations, elaborations, or other modifications
- represent, as a whole, an original work of authorship. For the purposes
- of this License, Derivative Works shall not include works that remain
- separable from, or merely link (or bind by name) to the interfaces of,
- the Work and Derivative Works thereof.
+- **场景二：规避 AGPLv3 开源义务**
+ 您基于 New API 进行了修改，并希望：
+ - 通过网络提供服务（SaaS），但**不希望**向您的服务用户公开您修改后的源代码。
+ - 分发一个集成了 New API 的软件产品，但**不希望**以 AGPLv3 许可证发布您的产品或公开源代码。
- "Contribution" shall mean any work of authorship, including
- the original version of the Work and any modifications or additions
- to that Work or Derivative Works thereof, that is intentionally
- submitted to Licensor for inclusion in the Work by the copyright owner
- or by an individual or Legal Entity authorized to submit on behalf of
- the copyright owner. For the purposes of this definition, "submitted"
- means any form of electronic, verbal, or written communication sent
- to the Licensor or its representatives, including but not limited to
- communication on electronic mailing lists, source code control systems,
- and issue tracking systems that are managed by, or on behalf of, the
- Licensor for the purpose of discussing and improving the Work, but
- excluding communication that is conspicuously marked or otherwise
- designated in writing by the copyright owner as "Not a Contribution."
+- **场景三：企业政策与集成需求**
+ - 您所在公司的政策、客户合同或项目要求不允许使用 AGPLv3 许可的软件。
+ - 您需要进行 OEM 集成，将 New API 作为您闭源商业产品的一部分进行再分发。
- "Contributor" shall mean Licensor and any individual or Legal Entity
- on behalf of whom a Contribution has been received by Licensor and
- subsequently incorporated within the Work.
+- **场景四：需要商业支持与保障**
+ 您需要 AGPLv3 未提供的商业保障，如官方技术支持等。
- 2. Grant of Copyright License. Subject to the terms and conditions of
- this License, each Contributor hereby grants to You a perpetual,
- worldwide, non-exclusive, no-charge, royalty-free, irrevocable
- copyright license to reproduce, prepare Derivative Works of,
- publicly display, publicly perform, sublicense, and distribute the
- Work and such Derivative Works in Source or Object form.
+**获取商业许可：**
+请通过电子邮件 **support@quantumnous.com** 联系 New API 团队洽谈商业授权事宜。
- 3. Grant of Patent License. Subject to the terms and conditions of
- this License, each Contributor hereby grants to You a perpetual,
- worldwide, non-exclusive, no-charge, royalty-free, irrevocable
- (except as stated in this section) patent license to make, have made,
- use, offer to sell, sell, import, and otherwise transfer the Work,
- where such license applies only to those patent claims licensable
- by such Contributor that are necessarily infringed by their
- Contribution(s) alone or by combination of their Contribution(s)
- with the Work to which such Contribution(s) was submitted. If You
- institute patent litigation against any entity (including a
- cross-claim or counterclaim in a lawsuit) alleging that the Work
- or a Contribution incorporated within the Work constitutes direct
- or contributory patent infringement, then any patent licenses
- granted to You under this License for that Work shall terminate
- as of the date such litigation is filed.
+## **3. 贡献 (Contributions)**
- 4. Redistribution. You may reproduce and distribute copies of the
- Work or Derivative Works thereof in any medium, with or without
- modifications, and in Source or Object form, provided that You
- meet the following conditions:
+- 我们欢迎社区对 New API 的贡献。所有向本项目提交的贡献（例如通过 Pull Request）都将被视为在 **AGPLv3** 许可证下提供。
+- 通过向本项目提交贡献，即表示您同意您的代码以 AGPLv3 许可证授权给本项目及所有后续使用者（无论这些使用者最终遵循 AGPLv3 还是商业许可）。
+- 您也理解并同意，您的贡献可能会被包含在根据商业许可证分发的 New API 版本中。
- (a) You must give any other recipients of the Work or
- Derivative Works a copy of this License; and
+## **4. 其他条款 (Other Terms)**
- (b) You must cause any modified files to carry prominent notices
- stating that You changed the files; and
+- 关于商业许可证的具体条款、条件和价格，以双方签署的正式商业许可协议为准。
+- 项目维护者保留根据需要更新本许可政策的权利。相关更新将通过项目官方渠道（如代码仓库、官方网站）进行通知。
- (c) You must retain, in the Source form of any Derivative Works
- that You distribute, all copyright, patent, trademark, and
- attribution notices from the Source form of the Work,
- excluding those notices that do not pertain to any part of
- the Derivative Works; and
+---
- (d) If the Work includes a "NOTICE" text file as part of its
- distribution, then any Derivative Works that You distribute must
- include a readable copy of the attribution notices contained
- within such NOTICE file, excluding those notices that do not
- pertain to any part of the Derivative Works, in at least one
- of the following places: within a NOTICE text file distributed
- as part of the Derivative Works; within the Source form or
- documentation, if provided along with the Derivative Works; or,
- within a display generated by the Derivative Works, if and
- wherever such third-party notices normally appear. The contents
- of the NOTICE file are for informational purposes only and
- do not modify the License. You may add Your own attribution
- notices within Derivative Works that You distribute, alongside
- or as an addendum to the NOTICE text from the Work, provided
- that such additional attribution notices cannot be construed
- as modifying the License.
+# **New API Licensing**
- You may add Your own copyright statement to Your modifications and
- may provide additional or different license terms and conditions
- for use, reproduction, or distribution of Your modifications, or
- for any such Derivative Works as a whole, provided Your use,
- reproduction, and distribution of the Work otherwise complies with
- the conditions stated in this License.
+This project uses a **Usage-Based Dual Licensing** model.
- 5. Submission of Contributions. Unless You explicitly state otherwise,
- any Contribution intentionally submitted for inclusion in the Work
- by You to the Licensor shall be under the terms and conditions of
- this License, without any additional terms or conditions.
- Notwithstanding the above, nothing herein shall supersede or modify
- the terms of any separate license agreement you may have executed
- with Licensor regarding such Contributions.
+**Core Principles:**
- 6. Trademarks. This License does not grant permission to use the trade
- names, trademarks, service marks, or product names of the Licensor,
- except as required for reasonable and customary use in describing the
- origin of the Work and reproducing the content of the NOTICE file.
+- **Default License:** This project is available by default under the **GNU Affero General Public License v3.0 (AGPLv3)**. Any user may use it free of charge, provided they comply with both the AGPLv3 terms and the additional restrictions listed below.
+- **Commercial License:** For specific commercial scenarios, or if you require rights beyond those granted by AGPLv3, you **must** obtain a **Commercial License**.
- 7. Disclaimer of Warranty. Unless required by applicable law or
- agreed to in writing, Licensor provides the Work (and each
- Contributor provides its Contributions) on an "AS IS" BASIS,
- WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
- implied, including, without limitation, any warranties or conditions
- of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
- PARTICULAR PURPOSE. You are solely responsible for determining the
- appropriateness of using or redistributing the Work and assume any
- risks associated with Your exercise of permissions under this License.
+---
- 8. Limitation of Liability. In no event and under no legal theory,
- whether in tort (including negligence), contract, or otherwise,
- unless required by applicable law (such as deliberate and grossly
- negligent acts) or agreed to in writing, shall any Contributor be
- liable to You for damages, including any direct, indirect, special,
- incidental, or consequential damages of any character arising as a
- result of this License or out of the use or inability to use the
- Work (including but not limited to damages for loss of goodwill,
- work stoppage, computer failure or malfunction, or any and all
- other commercial damages or losses), even if such Contributor
- has been advised of the possibility of such damages.
+## **1. Open Source License: AGPLv3 – For Basic Usage**
- 9. Accepting Warranty or Additional Liability. While redistributing
- the Work or Derivative Works thereof, You may choose to offer,
- and charge a fee for, acceptance of support, warranty, indemnity,
- or other liability obligations and/or rights consistent with this
- License. However, in accepting such obligations, You may act only
- on Your own behalf and on Your sole responsibility, not on behalf
- of any other Contributor, and only if You agree to indemnify,
- defend, and hold each Contributor harmless for any liability
- incurred by, or claims asserted against, such Contributor by reason
- of your accepting any such warranty or additional liability.
+- Under the terms of the **AGPLv3**, you are free to use, modify, and distribute New API. The complete AGPLv3 license text can be viewed at [https://www.gnu.org/licenses/agpl-3.0.html](https://www.gnu.org/licenses/agpl-3.0.html).
+- **Core Obligation:** A key AGPLv3 requirement is that if you modify New API and provide it as a network service (SaaS), or distribute a modified version, you must make the **complete corresponding source code** available to all users under the AGPLv3 license.
+- **Additional Restriction (Important):** When using only the AGPLv3 open-source license, you **must** retain all original branding, logos, and copyright statements within the project’s code. **You are strictly prohibited from modifying, removing, or concealing** any such information. If you wish to remove this, you must obtain a Commercial License.
+- Please read and ensure that you fully understand all AGPLv3 terms and the above additional restriction before use.
- END OF TERMS AND CONDITIONS
+## **2. Commercial License – For Advanced Scenarios & Closed Source Needs**
- APPENDIX: How to apply the Apache License to your work.
+You **must** contact us to obtain and sign a Commercial License in any of the following scenarios in order to legally use New API:
- To apply the Apache License to your work, attach the following
- boilerplate notice, with the fields enclosed by brackets "[]"
- replaced with your own identifying information. (Don't include
- the brackets!) The text should be enclosed in the appropriate
- comment syntax for the file format. We also recommend that a
- file or class name and description of purpose be included on the
- same "printed page" as the copyright notice for easier
- identification within third-party archives.
+- **Scenario 1: Removal of Branding and Copyright**
+ You wish to remove the New API logo, copyright statement, or other branding elements from your product or service.
- Copyright [yyyy] [name of copyright owner]
+- **Scenario 2: Avoidance of AGPLv3 Open Source Obligations**
+ You have modified New API and wish to:
+ - Offer it as a network service (SaaS) **without** disclosing your modifications' source code to your users.
+ - Distribute a software product integrated with New API **without** releasing your product under AGPLv3 or open-sourcing the code.
- Licensed under the Apache License, Version 2.0 (the "License");
- you may not use this file except in compliance with the License.
- You may obtain a copy of the License at
+- **Scenario 3: Enterprise Policy & Integration Needs**
+ - Your organization’s policies, client contracts, or project requirements prohibit the use of AGPLv3-licensed software.
+ - You require OEM integration and need to redistribute New API as part of your closed-source commercial product.
- http://www.apache.org/licenses/LICENSE-2.0
+- **Scenario 4: Commercial Support and Assurances**
+ You require commercial assurances not provided by AGPLv3, such as official technical support.
- Unless required by applicable law or agreed to in writing, software
- distributed under the License is distributed on an "AS IS" BASIS,
- WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- See the License for the specific language governing permissions and
- limitations under the License.
+**Obtaining a Commercial License:**
+Please contact the New API team via email at **support@quantumnous.com** to discuss commercial licensing.
+
+## **3. Contributions**
+
+- We welcome community contributions to New API. All contributions (e.g., via Pull Request) are deemed to be provided under the **AGPLv3** license.
+- By submitting a contribution, you agree that your code is licensed to this project and all downstream users under the AGPLv3 license (regardless of whether those users ultimately operate under AGPLv3 or a Commercial License).
+- You also acknowledge and agree that your contribution may be included in New API releases distributed under a Commercial License.
+
+## **4. Other Terms**
+
+- The specific terms, conditions, and pricing of the Commercial License are governed by the formal commercial license agreement executed by both parties.
+- Project maintainers reserve the right to update this licensing policy as needed. Updates will be communicated via official project channels (e.g., repository, official website).
diff --git a/README.en.md b/README.en.md
index b4ae921a..df7f1cbc 100644
--- a/README.en.md
+++ b/README.en.md
@@ -189,6 +189,24 @@ If you have any questions, please refer to [Help and Support](https://docs.newap
- [Issue Feedback](https://docs.newapi.pro/support/feedback-issues)
- [FAQ](https://docs.newapi.pro/support/faq)
+## 🤝 Trusted Partners
+
+
+
+
+
+
+
+
+
+
No particular order
+
## 🌟 Star History
[](https://star-history.com/#Calcium-Ion/new-api&Date)
diff --git a/README.md b/README.md
index 05423548..4060715c 100644
--- a/README.md
+++ b/README.md
@@ -188,6 +188,24 @@ docker run --name new-api -d --restart always -p 3000:3000 -e SQL_DSN="root:1234
- [反馈问题](https://docs.newapi.pro/support/feedback-issues)
- [常见问题](https://docs.newapi.pro/support/faq)
+## 🤝 我们信任的合作伙伴
+
+
{showEmailLogin || !(status.github_oauth || status.oidc_enabled || status.wechat_login || status.linuxdo_oauth || status.telegram_oauth)
? renderEmailLoginForm()
: renderOAuthOptions()}
diff --git a/web/src/components/auth/OAuth2Callback.js b/web/src/components/auth/OAuth2Callback.js
index 7d435574..4fb3a512 100644
--- a/web/src/components/auth/OAuth2Callback.js
+++ b/web/src/components/auth/OAuth2Callback.js
@@ -1,9 +1,28 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useContext, useEffect } from 'react';
import { useNavigate, useSearchParams } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
import { API, showError, showSuccess, updateAPI, setUserData } from '../../helpers';
import { UserContext } from '../../context/User';
-import Loading from '../common/Loading';
+import Loading from '../common/ui/Loading';
const OAuth2Callback = (props) => {
const { t } = useTranslation();
diff --git a/web/src/components/auth/PasswordResetConfirm.js b/web/src/components/auth/PasswordResetConfirm.js
index 5fbd1fc5..6c729c03 100644
--- a/web/src/components/auth/PasswordResetConfirm.js
+++ b/web/src/components/auth/PasswordResetConfirm.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState } from 'react';
import { API, copy, showError, showNotice, getLogo, getSystemName } from '../../helpers';
import { useSearchParams, Link } from 'react-router-dom';
@@ -82,7 +101,7 @@ const PasswordResetConfirm = () => {
{/* 背景模糊晕染球 */}
-
+
diff --git a/web/src/components/auth/PasswordResetForm.js b/web/src/components/auth/PasswordResetForm.js
index 033989e0..3602f317 100644
--- a/web/src/components/auth/PasswordResetForm.js
+++ b/web/src/components/auth/PasswordResetForm.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState } from 'react';
import { API, getLogo, showError, showInfo, showSuccess, getSystemName } from '../../helpers';
import Turnstile from 'react-turnstile';
@@ -82,7 +101,7 @@ const PasswordResetForm = () => {
{/* 背景模糊晕染球 */}
-
+
diff --git a/web/src/components/auth/RegisterForm.js b/web/src/components/auth/RegisterForm.js
index 9d213a60..897881ad 100644
--- a/web/src/components/auth/RegisterForm.js
+++ b/web/src/components/auth/RegisterForm.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useContext, useEffect, useState } from 'react';
import { Link, useNavigate } from 'react-router-dom';
import {
@@ -540,7 +559,7 @@ const RegisterForm = () => {
{/* 背景模糊晕染球 */}
-
- );
-};
-
-export default Loading;
diff --git a/web/src/components/common/logo/LinuxDoIcon.js b/web/src/components/common/logo/LinuxDoIcon.js
index f6ee9b31..861f19d4 100644
--- a/web/src/components/common/logo/LinuxDoIcon.js
+++ b/web/src/components/common/logo/LinuxDoIcon.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
import { Icon } from '@douyinfe/semi-ui';
diff --git a/web/src/components/common/logo/OIDCIcon.js b/web/src/components/common/logo/OIDCIcon.js
index bd98c8fb..28d538eb 100644
--- a/web/src/components/common/logo/OIDCIcon.js
+++ b/web/src/components/common/logo/OIDCIcon.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
import { Icon } from '@douyinfe/semi-ui';
diff --git a/web/src/components/common/logo/WeChatIcon.js b/web/src/components/common/logo/WeChatIcon.js
index 723c7ecb..f9f7057c 100644
--- a/web/src/components/common/logo/WeChatIcon.js
+++ b/web/src/components/common/logo/WeChatIcon.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
import { Icon } from '@douyinfe/semi-ui';
diff --git a/web/src/components/common/markdown/MarkdownRenderer.js b/web/src/components/common/markdown/MarkdownRenderer.js
index a48d34d1..820f2bbf 100644
--- a/web/src/components/common/markdown/MarkdownRenderer.js
+++ b/web/src/components/common/markdown/MarkdownRenderer.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import ReactMarkdown from 'react-markdown';
import 'katex/dist/katex.min.css';
import 'highlight.js/styles/github.css';
diff --git a/web/src/components/common/ui/CardPro.js b/web/src/components/common/ui/CardPro.js
new file mode 100644
index 00000000..e72cc42b
--- /dev/null
+++ b/web/src/components/common/ui/CardPro.js
@@ -0,0 +1,213 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React, { useState } from 'react';
+import { Card, Divider, Typography, Button } from '@douyinfe/semi-ui';
+import PropTypes from 'prop-types';
+import { useIsMobile } from '../../../hooks/common/useIsMobile';
+import { IconEyeOpened, IconEyeClosed } from '@douyinfe/semi-icons';
+
+const { Text } = Typography;
+
+/**
+ * CardPro 高级卡片组件
+ *
+ * 布局分为6个区域：
+ * 1. 统计信息区域 (statsArea)
+ * 2. 描述信息区域 (descriptionArea)
+ * 3. 类型切换/标签区域 (tabsArea)
+ * 4. 操作按钮区域 (actionsArea)
+ * 5. 搜索表单区域 (searchArea)
+ * 6. 分页区域 (paginationArea) - 固定在卡片底部
+ *
+ * 支持三种布局类型：
+ * - type1: 操作型 (如TokensTable) - 描述信息 + 操作按钮 + 搜索表单
+ * - type2: 查询型 (如LogsTable) - 统计信息 + 搜索表单
+ * - type3: 复杂型 (如ChannelsTable) - 描述信息 + 类型切换 + 操作按钮 + 搜索表单
+ */
+const CardPro = ({
+ type = 'type1',
+ className = '',
+ children,
+ // 各个区域的内容
+ statsArea,
+ descriptionArea,
+ tabsArea,
+ actionsArea,
+ searchArea,
+ paginationArea, // 新增分页区域
+ // 卡片属性
+ shadows = 'always',
+ bordered = false,
+ // 自定义样式
+ style,
+ // 国际化函数
+ t = (key) => key,
+ ...props
+}) => {
+ const isMobile = useIsMobile();
+ const [showMobileActions, setShowMobileActions] = useState(false);
+
+ const toggleMobileActions = () => {
+ setShowMobileActions(!showMobileActions);
+ };
+
+ const hasMobileHideableContent = actionsArea || searchArea;
+
+ const renderHeader = () => {
+ const hasContent = statsArea || descriptionArea || tabsArea || actionsArea || searchArea;
+ if (!hasContent) return null;
+
+ return (
+
+ );
+};
+
+CardTable.propTypes = {
+ columns: PropTypes.array.isRequired,
+ dataSource: PropTypes.array,
+ loading: PropTypes.bool,
+ rowKey: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),
+ hidePagination: PropTypes.bool,
+};
+
+export default CardTable;
\ No newline at end of file
diff --git a/web/src/components/common/ui/CompactModeToggle.js b/web/src/components/common/ui/CompactModeToggle.js
new file mode 100644
index 00000000..631156ee
--- /dev/null
+++ b/web/src/components/common/ui/CompactModeToggle.js
@@ -0,0 +1,68 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Button } from '@douyinfe/semi-ui';
+import PropTypes from 'prop-types';
+import { useIsMobile } from '../../../hooks/common/useIsMobile';
+
+/**
+ * 紧凑模式切换按钮组件
+ * 用于在自适应列表和紧凑列表之间切换
+ * 在移动端时自动隐藏，因为移动端使用"显示操作项"按钮来控制内容显示
+ */
+const CompactModeToggle = ({
+ compactMode,
+ setCompactMode,
+ t,
+ size = 'small',
+ type = 'tertiary',
+ className = '',
+ ...props
+}) => {
+ const isMobile = useIsMobile();
+
+ // 在移动端隐藏紧凑列表切换按钮
+ if (isMobile) {
+ return null;
+ }
+
+ return (
+
+ );
+};
+
+CompactModeToggle.propTypes = {
+ compactMode: PropTypes.bool.isRequired,
+ setCompactMode: PropTypes.func.isRequired,
+ t: PropTypes.func.isRequired,
+ size: PropTypes.string,
+ type: PropTypes.string,
+ className: PropTypes.string,
+};
+
+export default CompactModeToggle;
\ No newline at end of file
diff --git a/web/src/components/common/ui/Loading.js b/web/src/components/common/ui/Loading.js
new file mode 100644
index 00000000..60f94748
--- /dev/null
+++ b/web/src/components/common/ui/Loading.js
@@ -0,0 +1,35 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Spin } from '@douyinfe/semi-ui';
+
+const Loading = ({ size = 'small' }) => {
+
+ return (
+
+
+
+ );
+};
+
+export default Loading;
diff --git a/web/src/components/common/ui/ScrollableContainer.js b/web/src/components/common/ui/ScrollableContainer.js
new file mode 100644
index 00000000..0137c64b
--- /dev/null
+++ b/web/src/components/common/ui/ScrollableContainer.js
@@ -0,0 +1,220 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React, {
+ useRef,
+ useState,
+ useEffect,
+ useCallback,
+ useMemo,
+ useImperativeHandle,
+ forwardRef
+} from 'react';
+
+/**
+ * ScrollableContainer 可滚动容器组件
+ *
+ * 提供自动检测滚动状态和显示渐变指示器的功能
+ * 当内容超出容器高度且未滚动到底部时，会显示底部渐变指示器
+ *
+ */
+const ScrollableContainer = forwardRef(({
+ children,
+ maxHeight = '24rem',
+ className = '',
+ contentClassName = 'p-2',
+ fadeIndicatorClassName = '',
+ checkInterval = 100,
+ scrollThreshold = 5,
+ debounceDelay = 16, // ~60fps
+ onScroll,
+ onScrollStateChange,
+ ...props
+}, ref) => {
+ const scrollRef = useRef(null);
+ const containerRef = useRef(null);
+ const debounceTimerRef = useRef(null);
+ const resizeObserverRef = useRef(null);
+ const onScrollStateChangeRef = useRef(onScrollStateChange);
+ const onScrollRef = useRef(onScroll);
+
+ const [showScrollHint, setShowScrollHint] = useState(false);
+
+ useEffect(() => {
+ onScrollStateChangeRef.current = onScrollStateChange;
+ }, [onScrollStateChange]);
+
+ useEffect(() => {
+ onScrollRef.current = onScroll;
+ }, [onScroll]);
+
+ const debounce = useCallback((func, delay) => {
+ return (...args) => {
+ if (debounceTimerRef.current) {
+ clearTimeout(debounceTimerRef.current);
+ }
+ debounceTimerRef.current = setTimeout(() => func(...args), delay);
+ };
+ }, []);
+
+ const checkScrollable = useCallback(() => {
+ if (!scrollRef.current) return;
+
+ const element = scrollRef.current;
+ const isScrollable = element.scrollHeight > element.clientHeight;
+ const isAtBottom = element.scrollTop + element.clientHeight >= element.scrollHeight - scrollThreshold;
+ const shouldShowHint = isScrollable && !isAtBottom;
+
+ setShowScrollHint(shouldShowHint);
+
+ if (onScrollStateChangeRef.current) {
+ onScrollStateChangeRef.current({
+ isScrollable,
+ isAtBottom,
+ showScrollHint: shouldShowHint,
+ scrollTop: element.scrollTop,
+ scrollHeight: element.scrollHeight,
+ clientHeight: element.clientHeight
+ });
+ }
+ }, [scrollThreshold]);
+
+ const debouncedCheckScrollable = useMemo(() =>
+ debounce(checkScrollable, debounceDelay),
+ [debounce, checkScrollable, debounceDelay]
+ );
+
+ const handleScroll = useCallback((e) => {
+ debouncedCheckScrollable();
+ if (onScrollRef.current) {
+ onScrollRef.current(e);
+ }
+ }, [debouncedCheckScrollable]);
+
+ useImperativeHandle(ref, () => ({
+ checkScrollable: () => {
+ checkScrollable();
+ },
+ scrollToTop: () => {
+ if (scrollRef.current) {
+ scrollRef.current.scrollTop = 0;
+ }
+ },
+ scrollToBottom: () => {
+ if (scrollRef.current) {
+ scrollRef.current.scrollTop = scrollRef.current.scrollHeight;
+ }
+ },
+ getScrollInfo: () => {
+ if (!scrollRef.current) return null;
+ const element = scrollRef.current;
+ return {
+ scrollTop: element.scrollTop,
+ scrollHeight: element.scrollHeight,
+ clientHeight: element.clientHeight,
+ isScrollable: element.scrollHeight > element.clientHeight,
+ isAtBottom: element.scrollTop + element.clientHeight >= element.scrollHeight - scrollThreshold
+ };
+ }
+ }), [checkScrollable, scrollThreshold]);
+
+ useEffect(() => {
+ const timer = setTimeout(() => {
+ checkScrollable();
+ }, checkInterval);
+ return () => clearTimeout(timer);
+ }, [checkScrollable, checkInterval]);
+
+ useEffect(() => {
+ if (!scrollRef.current) return;
+
+ if (typeof ResizeObserver === 'undefined') {
+ if (typeof MutationObserver !== 'undefined') {
+ const observer = new MutationObserver(() => {
+ debouncedCheckScrollable();
+ });
+
+ observer.observe(scrollRef.current, {
+ childList: true,
+ subtree: true,
+ attributes: true,
+ characterData: true
+ });
+
+ return () => observer.disconnect();
+ }
+ return;
+ }
+
+ resizeObserverRef.current = new ResizeObserver((entries) => {
+ for (const entry of entries) {
+ debouncedCheckScrollable();
+ }
+ });
+
+ resizeObserverRef.current.observe(scrollRef.current);
+
+ return () => {
+ if (resizeObserverRef.current) {
+ resizeObserverRef.current.disconnect();
+ }
+ };
+ }, [debouncedCheckScrollable]);
+
+ useEffect(() => {
+ return () => {
+ if (debounceTimerRef.current) {
+ clearTimeout(debounceTimerRef.current);
+ }
+ };
+ }, []);
+
+ const containerStyle = useMemo(() => ({
+ maxHeight
+ }), [maxHeight]);
+
+ const fadeIndicatorStyle = useMemo(() => ({
+ opacity: showScrollHint ? 1 : 0
+ }), [showScrollHint]);
+
+ return (
+
+
+ {children}
+
+
+
+ );
+});
+
+ScrollableContainer.displayName = 'ScrollableContainer';
+
+export default ScrollableContainer;
\ No newline at end of file
diff --git a/web/src/components/dashboard/AnnouncementsPanel.jsx b/web/src/components/dashboard/AnnouncementsPanel.jsx
new file mode 100644
index 00000000..89d5f335
--- /dev/null
+++ b/web/src/components/dashboard/AnnouncementsPanel.jsx
@@ -0,0 +1,107 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Card, Tag, Timeline, Empty } from '@douyinfe/semi-ui';
+import { Bell } from 'lucide-react';
+import { marked } from 'marked';
+import { IllustrationConstruction, IllustrationConstructionDark } from '@douyinfe/semi-illustrations';
+import ScrollableContainer from '../common/ui/ScrollableContainer';
+
+const AnnouncementsPanel = ({
+ announcementData,
+ announcementLegendData,
+ CARD_PROPS,
+ ILLUSTRATION_SIZE,
+ t
+}) => {
+ return (
+
+
+ )}
+
+
+ );
+};
+
+export default AnnouncementsPanel;
\ No newline at end of file
diff --git a/web/src/components/dashboard/ApiInfoPanel.jsx b/web/src/components/dashboard/ApiInfoPanel.jsx
new file mode 100644
index 00000000..5da250e6
--- /dev/null
+++ b/web/src/components/dashboard/ApiInfoPanel.jsx
@@ -0,0 +1,117 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Card, Avatar, Tag, Divider, Empty } from '@douyinfe/semi-ui';
+import { Server, Gauge, ExternalLink } from 'lucide-react';
+import { IllustrationConstruction, IllustrationConstructionDark } from '@douyinfe/semi-illustrations';
+import ScrollableContainer from '../common/ui/ScrollableContainer';
+
+const ApiInfoPanel = ({
+ apiInfoData,
+ handleCopyUrl,
+ handleSpeedTest,
+ CARD_PROPS,
+ FLEX_CENTER_GAP2,
+ ILLUSTRATION_SIZE,
+ t
+}) => {
+ return (
+
+
+ {t('API信息')}
+
+ )}
+
+
+ );
+};
+
+export default ApiInfoPanel;
\ No newline at end of file
diff --git a/web/src/components/dashboard/ChartsPanel.jsx b/web/src/components/dashboard/ChartsPanel.jsx
new file mode 100644
index 00000000..86726e53
--- /dev/null
+++ b/web/src/components/dashboard/ChartsPanel.jsx
@@ -0,0 +1,117 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Card, Tabs, TabPane } from '@douyinfe/semi-ui';
+import { PieChart } from 'lucide-react';
+import {
+ IconHistogram,
+ IconPulse,
+ IconPieChart2Stroked
+} from '@douyinfe/semi-icons';
+import { VChart } from '@visactor/react-vchart';
+
+const ChartsPanel = ({
+ activeChartTab,
+ setActiveChartTab,
+ spec_line,
+ spec_model_line,
+ spec_pie,
+ spec_rank_bar,
+ CARD_PROPS,
+ CHART_CONFIG,
+ FLEX_CENTER_GAP2,
+ hasApiInfoPanel,
+ t
+}) => {
+ return (
+
+
+
+ );
+};
+
+export default ChartsPanel;
\ No newline at end of file
diff --git a/web/src/components/dashboard/DashboardHeader.jsx b/web/src/components/dashboard/DashboardHeader.jsx
new file mode 100644
index 00000000..f59aa0b8
--- /dev/null
+++ b/web/src/components/dashboard/DashboardHeader.jsx
@@ -0,0 +1,61 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Button } from '@douyinfe/semi-ui';
+import { IconRefresh, IconSearch } from '@douyinfe/semi-icons';
+
+const DashboardHeader = ({
+ getGreeting,
+ greetingVisible,
+ showSearchModal,
+ refresh,
+ loading,
+ t
+}) => {
+ const ICON_BUTTON_CLASS = "text-white hover:bg-opacity-80 !rounded-full";
+
+ return (
+
+ );
+};
+
+export default DashboardHeader;
\ No newline at end of file
diff --git a/web/src/components/dashboard/FaqPanel.jsx b/web/src/components/dashboard/FaqPanel.jsx
new file mode 100644
index 00000000..bf09392c
--- /dev/null
+++ b/web/src/components/dashboard/FaqPanel.jsx
@@ -0,0 +1,81 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Card, Collapse, Empty } from '@douyinfe/semi-ui';
+import { HelpCircle } from 'lucide-react';
+import { IconPlus, IconMinus } from '@douyinfe/semi-icons';
+import { marked } from 'marked';
+import { IllustrationConstruction, IllustrationConstructionDark } from '@douyinfe/semi-illustrations';
+import ScrollableContainer from '../common/ui/ScrollableContainer';
+
+const FaqPanel = ({
+ faqData,
+ CARD_PROPS,
+ FLEX_CENTER_GAP2,
+ ILLUSTRATION_SIZE,
+ t
+}) => {
+ return (
+
+
+ {t('常见问答')}
+
+ )}
+
+
+ );
+};
+
+export default FaqPanel;
\ No newline at end of file
diff --git a/web/src/components/dashboard/StatsCards.jsx b/web/src/components/dashboard/StatsCards.jsx
new file mode 100644
index 00000000..ae614eb5
--- /dev/null
+++ b/web/src/components/dashboard/StatsCards.jsx
@@ -0,0 +1,93 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Card, Avatar, Skeleton } from '@douyinfe/semi-ui';
+import { VChart } from '@visactor/react-vchart';
+
+const StatsCards = ({
+ groupedStatsData,
+ loading,
+ getTrendSpec,
+ CARD_PROPS,
+ CHART_CONFIG
+}) => {
+ return (
+
+ );
+};
+
+export default StatsCards;
\ No newline at end of file
diff --git a/web/src/components/dashboard/UptimePanel.jsx b/web/src/components/dashboard/UptimePanel.jsx
new file mode 100644
index 00000000..9c5049b8
--- /dev/null
+++ b/web/src/components/dashboard/UptimePanel.jsx
@@ -0,0 +1,136 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Card, Button, Spin, Tabs, TabPane, Tag, Empty } from '@douyinfe/semi-ui';
+import { Gauge } from 'lucide-react';
+import { IconRefresh } from '@douyinfe/semi-icons';
+import { IllustrationConstruction, IllustrationConstructionDark } from '@douyinfe/semi-illustrations';
+import ScrollableContainer from '../common/ui/ScrollableContainer';
+
+const UptimePanel = ({
+ uptimeData,
+ uptimeLoading,
+ activeUptimeTab,
+ setActiveUptimeTab,
+ loadUptimeData,
+ uptimeLegendData,
+ renderMonitorList,
+ CARD_PROPS,
+ ILLUSTRATION_SIZE,
+ t
+}) => {
+ return (
+
+
+ );
+};
+
+export default Dashboard;
\ No newline at end of file
diff --git a/web/src/components/dashboard/modals/SearchModal.jsx b/web/src/components/dashboard/modals/SearchModal.jsx
new file mode 100644
index 00000000..251f040c
--- /dev/null
+++ b/web/src/components/dashboard/modals/SearchModal.jsx
@@ -0,0 +1,101 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React, { useRef } from 'react';
+import { Modal, Form } from '@douyinfe/semi-ui';
+
+const SearchModal = ({
+ searchModalVisible,
+ handleSearchConfirm,
+ handleCloseModal,
+ isMobile,
+ isAdminUser,
+ inputs,
+ dataExportDefaultTime,
+ timeOptions,
+ handleInputChange,
+ t
+}) => {
+ const formRef = useRef();
+
+ const FORM_FIELD_PROPS = {
+ className: "w-full mb-2 !rounded-lg",
+ };
+
+ const createFormField = (Component, props) => (
+
+ );
+
+ const { start_timestamp, end_timestamp, username } = inputs;
+
+ return (
+
+
+
+ );
+};
+
+export default SearchModal;
\ No newline at end of file
diff --git a/web/src/components/layout/Footer.js b/web/src/components/layout/Footer.js
index d380e574..560c4ac3 100644
--- a/web/src/components/layout/Footer.js
+++ b/web/src/components/layout/Footer.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useMemo, useContext } from 'react';
import { useTranslation } from 'react-i18next';
import { Typography } from '@douyinfe/semi-ui';
diff --git a/web/src/components/layout/HeaderBar.js b/web/src/components/layout/HeaderBar.js
index 4d83d48b..a2e3986c 100644
--- a/web/src/components/layout/HeaderBar.js
+++ b/web/src/components/layout/HeaderBar.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useContext, useEffect, useState, useRef } from 'react';
import { Link, useNavigate, useLocation } from 'react-router-dom';
import { UserContext } from '../../context/User/index.js';
@@ -31,8 +50,8 @@ import {
Badge,
} from '@douyinfe/semi-ui';
import { StatusContext } from '../../context/Status/index.js';
-import { useIsMobile } from '../../hooks/useIsMobile.js';
-import { useSidebarCollapsed } from '../../hooks/useSidebarCollapsed.js';
+import { useIsMobile } from '../../hooks/common/useIsMobile.js';
+import { useSidebarCollapsed } from '../../hooks/common/useSidebarCollapsed.js';
const HeaderBar = ({ onMobileMenuToggle, drawerOpen }) => {
const { t, i18n } = useTranslation();
@@ -41,6 +60,7 @@ const HeaderBar = ({ onMobileMenuToggle, drawerOpen }) => {
const isMobile = useIsMobile();
const [collapsed, toggleCollapsed] = useSidebarCollapsed();
const [isLoading, setIsLoading] = useState(true);
+ const [logoLoaded, setLogoLoaded] = useState(false);
let navigate = useNavigate();
const [currentLang, setCurrentLang] = useState(i18n.language);
const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
@@ -207,6 +227,14 @@ const HeaderBar = ({ onMobileMenuToggle, drawerOpen }) => {
}
}, [statusState?.status]);
+ useEffect(() => {
+ setLogoLoaded(false);
+ if (!logo) return;
+ const img = new Image();
+ img.src = logo;
+ img.onload = () => setLogoLoaded(true);
+ }, [logo]);
+
const handleLanguageChange = (lang) => {
i18n.changeLanguage(lang);
setMobileMenuOpen(false);
@@ -336,7 +364,7 @@ const HeaderBar = ({ onMobileMenuToggle, drawerOpen }) => {
>
.
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useContext, useMemo } from 'react';
import { Button, Modal, Empty, Tabs, TabPane, Timeline } from '@douyinfe/semi-ui';
import { useTranslation } from 'react-i18next';
diff --git a/web/src/components/layout/PageLayout.js b/web/src/components/layout/PageLayout.js
index 7ef42eb7..f8462ff7 100644
--- a/web/src/components/layout/PageLayout.js
+++ b/web/src/components/layout/PageLayout.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import HeaderBar from './HeaderBar.js';
import { Layout } from '@douyinfe/semi-ui';
import SiderBar from './SiderBar.js';
@@ -5,8 +24,8 @@ import App from '../../App.js';
import FooterBar from './Footer.js';
import { ToastContainer } from 'react-toastify';
import React, { useContext, useEffect, useState } from 'react';
-import { useIsMobile } from '../../hooks/useIsMobile.js';
-import { useSidebarCollapsed } from '../../hooks/useSidebarCollapsed.js';
+import { useIsMobile } from '../../hooks/common/useIsMobile.js';
+import { useSidebarCollapsed } from '../../hooks/common/useSidebarCollapsed.js';
import { useTranslation } from 'react-i18next';
import { API, getLogo, getSystemName, showError, setStatusData } from '../../helpers/index.js';
import { UserContext } from '../../context/User/index.js';
@@ -23,7 +42,7 @@ const PageLayout = () => {
const { i18n } = useTranslation();
const location = useLocation();
- const shouldHideFooter = location.pathname === '/console/playground' || location.pathname.startsWith('/console/chat');
+ const shouldHideFooter = location.pathname.startsWith('/console');
const shouldInnerPadding = location.pathname.includes('/console') &&
!location.pathname.startsWith('/console/chat') &&
diff --git a/web/src/components/layout/SetupCheck.js b/web/src/components/layout/SetupCheck.js
index 3fbd9012..b81cfa97 100644
--- a/web/src/components/layout/SetupCheck.js
+++ b/web/src/components/layout/SetupCheck.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useContext, useEffect } from 'react';
import { Navigate, useLocation } from 'react-router-dom';
import { StatusContext } from '../../context/Status';
diff --git a/web/src/components/layout/SiderBar.js b/web/src/components/layout/SiderBar.js
index b18dad6c..e8703113 100644
--- a/web/src/components/layout/SiderBar.js
+++ b/web/src/components/layout/SiderBar.js
@@ -1,9 +1,28 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useMemo, useState } from 'react';
import { Link, useLocation } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
import { getLucideIcon, sidebarIconColors } from '../../helpers/render.js';
import { ChevronLeft } from 'lucide-react';
-import { useSidebarCollapsed } from '../../hooks/useSidebarCollapsed.js';
+import { useSidebarCollapsed } from '../../hooks/common/useSidebarCollapsed.js';
import {
isAdmin,
isRoot,
@@ -56,7 +75,7 @@ const SiderBar = ({ onNavigate = () => { } }) => {
: 'tableHiddle',
},
{
- text: t('API令牌'),
+ text: t('令牌管理'),
itemKey: 'token',
to: '/token',
},
@@ -109,13 +128,13 @@ const SiderBar = ({ onNavigate = () => { } }) => {
const adminItems = useMemo(
() => [
{
- text: t('渠道'),
+ text: t('渠道管理'),
itemKey: 'channel',
to: '/channel',
className: isAdmin() ? '' : 'tableHiddle',
},
{
- text: t('兑换码'),
+ text: t('兑换码管理'),
itemKey: 'redemption',
to: '/redemption',
className: isAdmin() ? '' : 'tableHiddle',
@@ -421,7 +440,7 @@ const SiderBar = ({ onNavigate = () => { } }) => {
/>
}
onClick={toggleCollapsed}
- iconOnly={collapsed}
+ icononly={collapsed}
style={collapsed ? { padding: '4px', width: '100%' } : { padding: '4px 12px', width: '100%' }}
>
{!collapsed ? t('收起侧边栏') : null}
diff --git a/web/src/components/playground/ChatArea.js b/web/src/components/playground/ChatArea.js
index 81e2df90..b6303112 100644
--- a/web/src/components/playground/ChatArea.js
+++ b/web/src/components/playground/ChatArea.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
import {
Card,
diff --git a/web/src/components/playground/CodeViewer.js b/web/src/components/playground/CodeViewer.js
index 1ce723ce..0e0d0bf5 100644
--- a/web/src/components/playground/CodeViewer.js
+++ b/web/src/components/playground/CodeViewer.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useState, useMemo, useCallback } from 'react';
import { Button, Tooltip, Toast } from '@douyinfe/semi-ui';
import { Copy, ChevronDown, ChevronUp } from 'lucide-react';
diff --git a/web/src/components/playground/ConfigManager.js b/web/src/components/playground/ConfigManager.js
index ddff8785..753d1138 100644
--- a/web/src/components/playground/ConfigManager.js
+++ b/web/src/components/playground/ConfigManager.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useRef } from 'react';
import {
Button,
diff --git a/web/src/components/playground/CustomInputRender.js b/web/src/components/playground/CustomInputRender.js
index ff62c104..2191cb16 100644
--- a/web/src/components/playground/CustomInputRender.js
+++ b/web/src/components/playground/CustomInputRender.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
const CustomInputRender = (props) => {
diff --git a/web/src/components/playground/CustomRequestEditor.js b/web/src/components/playground/CustomRequestEditor.js
index 9b11b4f4..cd21398a 100644
--- a/web/src/components/playground/CustomRequestEditor.js
+++ b/web/src/components/playground/CustomRequestEditor.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useState, useEffect } from 'react';
import {
TextArea,
diff --git a/web/src/components/playground/DebugPanel.js b/web/src/components/playground/DebugPanel.js
index 8c717a4a..24158c2b 100644
--- a/web/src/components/playground/DebugPanel.js
+++ b/web/src/components/playground/DebugPanel.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useState, useEffect } from 'react';
import {
Card,
diff --git a/web/src/components/playground/FloatingButtons.js b/web/src/components/playground/FloatingButtons.js
index 4b629770..87a3b0b5 100644
--- a/web/src/components/playground/FloatingButtons.js
+++ b/web/src/components/playground/FloatingButtons.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
import { Button } from '@douyinfe/semi-ui';
import {
@@ -61,7 +80,7 @@ const FloatingButtons = ({
? 'linear-gradient(to right, #e11d48, #be123c)'
: 'linear-gradient(to right, #4f46e5, #6366f1)',
}}
- className="lg:hidden !rounded-full !p-0"
+ className="lg:hidden"
/>
)}
diff --git a/web/src/components/playground/ImageUrlInput.js b/web/src/components/playground/ImageUrlInput.js
index 2b8fb854..43c65b62 100644
--- a/web/src/components/playground/ImageUrlInput.js
+++ b/web/src/components/playground/ImageUrlInput.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
import {
Input,
diff --git a/web/src/components/playground/MessageActions.js b/web/src/components/playground/MessageActions.js
index 9f42aeb7..64775ae5 100644
--- a/web/src/components/playground/MessageActions.js
+++ b/web/src/components/playground/MessageActions.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
import {
Button,
diff --git a/web/src/components/playground/MessageContent.js b/web/src/components/playground/MessageContent.js
index 5988c844..fdeb3813 100644
--- a/web/src/components/playground/MessageContent.js
+++ b/web/src/components/playground/MessageContent.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useRef, useEffect } from 'react';
import {
Typography,
diff --git a/web/src/components/playground/OptimizedComponents.js b/web/src/components/playground/OptimizedComponents.js
index 9ba2a7c7..2f2c4a87 100644
--- a/web/src/components/playground/OptimizedComponents.js
+++ b/web/src/components/playground/OptimizedComponents.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
import MessageContent from './MessageContent';
import MessageActions from './MessageActions';
diff --git a/web/src/components/playground/ParameterControl.js b/web/src/components/playground/ParameterControl.js
index e499dcfe..3f4cead9 100644
--- a/web/src/components/playground/ParameterControl.js
+++ b/web/src/components/playground/ParameterControl.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
import {
Input,
diff --git a/web/src/components/playground/SettingsPanel.js b/web/src/components/playground/SettingsPanel.js
index b2e8310a..fa65b363 100644
--- a/web/src/components/playground/SettingsPanel.js
+++ b/web/src/components/playground/SettingsPanel.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
import {
Card,
@@ -14,7 +33,7 @@ import {
Settings,
} from 'lucide-react';
import { useTranslation } from 'react-i18next';
-import { renderGroupOption } from '../../helpers';
+import { renderGroupOption, modelSelectFilter } from '../../helpers';
import ParameterControl from './ParameterControl';
import ImageUrlInput from './ImageUrlInput';
import ConfigManager from './ConfigManager';
@@ -154,8 +173,8 @@ const SettingsPanel = ({
name='model'
required
selection
- searchPosition='dropdown'
- filter
+ filter={modelSelectFilter}
+ autoClearSearchValue={false}
onChange={(value) => onInputChange('model', value)}
value={inputs.model}
autoComplete='new-password'
diff --git a/web/src/components/playground/ThinkingContent.js b/web/src/components/playground/ThinkingContent.js
index d5210507..f7eaead2 100644
--- a/web/src/components/playground/ThinkingContent.js
+++ b/web/src/components/playground/ThinkingContent.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useRef } from 'react';
import { Typography } from '@douyinfe/semi-ui';
import MarkdownRenderer from '../common/markdown/MarkdownRenderer';
diff --git a/web/src/components/playground/configStorage.js b/web/src/components/playground/configStorage.js
index 91fda88a..b42b57ce 100644
--- a/web/src/components/playground/configStorage.js
+++ b/web/src/components/playground/configStorage.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import { STORAGE_KEYS, DEFAULT_CONFIG } from '../../constants/playground.constants';
const MESSAGES_STORAGE_KEY = 'playground_messages';
diff --git a/web/src/components/playground/index.js b/web/src/components/playground/index.js
index 57826256..7011eda8 100644
--- a/web/src/components/playground/index.js
+++ b/web/src/components/playground/index.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
export { default as SettingsPanel } from './SettingsPanel';
export { default as ChatArea } from './ChatArea';
export { default as DebugPanel } from './DebugPanel';
diff --git a/web/src/components/settings/ChannelSelectorModal.js b/web/src/components/settings/ChannelSelectorModal.js
index 998c2bf3..2e3e5c20 100644
--- a/web/src/components/settings/ChannelSelectorModal.js
+++ b/web/src/components/settings/ChannelSelectorModal.js
@@ -1,5 +1,24 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useState, useEffect, forwardRef, useImperativeHandle } from 'react';
-import { useIsMobile } from '../../hooks/useIsMobile.js';
+import { useIsMobile } from '../../hooks/common/useIsMobile.js';
import {
Modal,
Table,
@@ -212,11 +231,6 @@ const ChannelSelectorModal = forwardRef(({
showSizeChanger: true,
showQuickJumper: true,
pageSizeOptions: ['10', '20', '50', '100'],
- formatPageText: (page) => t('第 {{start}} - {{end}} 条，共 {{total}} 条', {
- start: page.currentStart,
- end: page.currentEnd,
- total: total,
- }),
onChange: (page, size) => {
setCurrentPage(page);
setPageSize(size);
diff --git a/web/src/components/settings/ChatsSetting.js b/web/src/components/settings/ChatsSetting.js
index cc345594..f1b649d6 100644
--- a/web/src/components/settings/ChatsSetting.js
+++ b/web/src/components/settings/ChatsSetting.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState } from 'react';
import { Card, Spin } from '@douyinfe/semi-ui';
import SettingsChats from '../../pages/Setting/Chat/SettingsChats.js';
diff --git a/web/src/components/settings/DashboardSetting.js b/web/src/components/settings/DashboardSetting.js
index ac1a73ed..764148cc 100644
--- a/web/src/components/settings/DashboardSetting.js
+++ b/web/src/components/settings/DashboardSetting.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useMemo } from 'react';
import { Card, Spin, Button, Modal } from '@douyinfe/semi-ui';
import { API, showError, showSuccess, toBoolean } from '../../helpers';
diff --git a/web/src/components/settings/DrawingSetting.js b/web/src/components/settings/DrawingSetting.js
index 7b35ea64..789c3321 100644
--- a/web/src/components/settings/DrawingSetting.js
+++ b/web/src/components/settings/DrawingSetting.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState } from 'react';
import { Card, Spin } from '@douyinfe/semi-ui';
import SettingsDrawing from '../../pages/Setting/Drawing/SettingsDrawing.js';
diff --git a/web/src/components/settings/ModelSetting.js b/web/src/components/settings/ModelSetting.js
index 5f81ecb6..e63905b5 100644
--- a/web/src/components/settings/ModelSetting.js
+++ b/web/src/components/settings/ModelSetting.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState } from 'react';
import { Card, Spin, Tabs } from '@douyinfe/semi-ui';
diff --git a/web/src/components/settings/OperationSetting.js b/web/src/components/settings/OperationSetting.js
index 899fa30a..93322181 100644
--- a/web/src/components/settings/OperationSetting.js
+++ b/web/src/components/settings/OperationSetting.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState } from 'react';
import { Card, Spin } from '@douyinfe/semi-ui';
import SettingsGeneral from '../../pages/Setting/Operation/SettingsGeneral.js';
diff --git a/web/src/components/settings/OtherSetting.js b/web/src/components/settings/OtherSetting.js
index a054e0da..bc4164a2 100644
--- a/web/src/components/settings/OtherSetting.js
+++ b/web/src/components/settings/OtherSetting.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useContext, useEffect, useRef, useState } from 'react';
import {
Banner,
diff --git a/web/src/components/settings/PaymentSetting.js b/web/src/components/settings/PaymentSetting.js
index ed175a20..5f909cf0 100644
--- a/web/src/components/settings/PaymentSetting.js
+++ b/web/src/components/settings/PaymentSetting.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState } from 'react';
import { Card, Spin } from '@douyinfe/semi-ui';
import SettingsGeneralPayment from '../../pages/Setting/Payment/SettingsGeneralPayment.js';
diff --git a/web/src/components/settings/PersonalSetting.js b/web/src/components/settings/PersonalSetting.js
index 7e2b85fd..1e0132cf 100644
--- a/web/src/components/settings/PersonalSetting.js
+++ b/web/src/components/settings/PersonalSetting.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useContext, useEffect, useState } from 'react';
import { useNavigate } from 'react-router-dom';
import {
@@ -379,7 +398,7 @@ const PersonalSetting = () => {
};
return (
-
+
{/* 主卡片容器 */}
diff --git a/web/src/components/settings/RateLimitSetting.js b/web/src/components/settings/RateLimitSetting.js
index e7f105ec..eafbfc59 100644
--- a/web/src/components/settings/RateLimitSetting.js
+++ b/web/src/components/settings/RateLimitSetting.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState } from 'react';
import { Card, Spin } from '@douyinfe/semi-ui';
diff --git a/web/src/components/settings/RatioSetting.js b/web/src/components/settings/RatioSetting.js
index 01c2637c..baa24f9c 100644
--- a/web/src/components/settings/RatioSetting.js
+++ b/web/src/components/settings/RatioSetting.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState } from 'react';
import { Card, Spin, Tabs } from '@douyinfe/semi-ui';
import { useTranslation } from 'react-i18next';
diff --git a/web/src/components/settings/SystemSetting.js b/web/src/components/settings/SystemSetting.js
index aec8ea69..ce8ac7a7 100644
--- a/web/src/components/settings/SystemSetting.js
+++ b/web/src/components/settings/SystemSetting.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import {
Button,
diff --git a/web/src/components/table/ChannelsTable.js b/web/src/components/table/ChannelsTable.js
deleted file mode 100644
index fba5db79..00000000
--- a/web/src/components/table/ChannelsTable.js
+++ /dev/null
@@ -1,2212 +0,0 @@
-import React, { useEffect, useState, useMemo, useRef } from 'react';
-import {
- API,
- showError,
- showInfo,
- showSuccess,
- timestamp2string,
- renderGroup,
- renderQuota,
- getChannelIcon,
- renderQuotaWithAmount
-} from '../../helpers/index.js';
-import { CHANNEL_OPTIONS, ITEMS_PER_PAGE, MODEL_TABLE_PAGE_SIZE } from '../../constants/index.js';
-import {
- Button,
- Divider,
- Dropdown,
- Empty,
- Input,
- InputNumber,
- Modal,
- Space,
- SplitButtonGroup,
- Switch,
- Table,
- Tag,
- Tooltip,
- Typography,
- Checkbox,
- Card,
- Form,
- Tabs,
- TabPane,
- Select
-} from '@douyinfe/semi-ui';
-import {
- IllustrationNoResult,
- IllustrationNoResultDark
-} from '@douyinfe/semi-illustrations';
-import EditChannel from '../../pages/Channel/EditChannel.js';
-import {
- IconTreeTriangleDown,
- IconSearch,
- IconMore,
- IconDescend2
-} from '@douyinfe/semi-icons';
-import { loadChannelModels, copy } from '../../helpers';
-import { useIsMobile } from '../../hooks/useIsMobile.js';
-import EditTagModal from '../../pages/Channel/EditTagModal.js';
-import { useTranslation } from 'react-i18next';
-import { useTableCompactMode } from '../../hooks/useTableCompactMode';
-import { FaRandom } from 'react-icons/fa';
-
-const ChannelsTable = () => {
- const { t } = useTranslation();
- const isMobile = useIsMobile();
-
- let type2label = undefined;
-
- const renderType = (type, channelInfo = undefined) => {
- if (!type2label) {
- type2label = new Map();
- for (let i = 0; i < CHANNEL_OPTIONS.length; i++) {
- type2label[CHANNEL_OPTIONS[i].value] = CHANNEL_OPTIONS[i];
- }
- type2label[0] = { value: 0, label: t('未知类型'), color: 'grey' };
- }
-
- let icon = getChannelIcon(type);
-
- if (channelInfo?.is_multi_key) {
- icon = (
- channelInfo?.multi_key_mode === 'random' ? (
-
+ );
+};
+
+export default ChannelsActions;
\ No newline at end of file
diff --git a/web/src/components/table/channels/ChannelsColumnDefs.js b/web/src/components/table/channels/ChannelsColumnDefs.js
new file mode 100644
index 00000000..beb5fe55
--- /dev/null
+++ b/web/src/components/table/channels/ChannelsColumnDefs.js
@@ -0,0 +1,623 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import {
+ Button,
+ Dropdown,
+ InputNumber,
+ Modal,
+ Space,
+ SplitButtonGroup,
+ Tag,
+ Tooltip,
+ Typography
+} from '@douyinfe/semi-ui';
+import {
+ timestamp2string,
+ renderGroup,
+ renderQuota,
+ getChannelIcon,
+ renderQuotaWithAmount
+} from '../../../helpers/index.js';
+import { CHANNEL_OPTIONS } from '../../../constants/index.js';
+import { IconTreeTriangleDown, IconMore } from '@douyinfe/semi-icons';
+import { FaRandom } from 'react-icons/fa';
+
+// Render functions
+const renderType = (type, channelInfo = undefined, t) => {
+ let type2label = new Map();
+ for (let i = 0; i < CHANNEL_OPTIONS.length; i++) {
+ type2label[CHANNEL_OPTIONS[i].value] = CHANNEL_OPTIONS[i];
+ }
+ type2label[0] = { value: 0, label: t('未知类型'), color: 'grey' };
+
+ let icon = getChannelIcon(type);
+
+ if (channelInfo?.is_multi_key) {
+ icon = (
+ channelInfo?.multi_key_mode === 'random' ? (
+
+ );
+ } else {
+ return (
+ {
+ Modal.warning({
+ title: t('修改子渠道权重'),
+ content: t('确定要修改所有子渠道权重为 ') + e.target.value + t(' 吗？'),
+ onOk: () => {
+ if (e.target.value === '') {
+ return;
+ }
+ submitTagEdit('weight', {
+ tag: record.key,
+ weight: e.target.value,
+ });
+ },
+ });
+ }}
+ innerButtons
+ defaultValue={record.weight}
+ min={-999}
+ size="small"
+ />
+ );
+ }
+ },
+ },
+ {
+ key: COLUMN_KEYS.OPERATE,
+ title: '',
+ dataIndex: 'operate',
+ fixed: 'right',
+ render: (text, record, index) => {
+ if (record.children === undefined) {
+ const moreMenuItems = [
+ {
+ node: 'item',
+ name: t('删除'),
+ type: 'danger',
+ onClick: () => {
+ Modal.confirm({
+ title: t('确定是否要删除此渠道？'),
+ content: t('此修改将不可逆'),
+ onOk: () => {
+ (async () => {
+ await manageChannel(record.id, 'delete', record);
+ await refresh();
+ setTimeout(() => {
+ if (channels.length === 0 && activePage > 1) {
+ refresh(activePage - 1);
+ }
+ }, 100);
+ })();
+ },
+ });
+ },
+ },
+ {
+ node: 'item',
+ name: t('复制'),
+ type: 'tertiary',
+ onClick: () => {
+ Modal.confirm({
+ title: t('确定是否要复制此渠道？'),
+ content: t('复制渠道的所有信息'),
+ onOk: () => copySelectedChannel(record),
+ });
+ },
+ },
+ ];
+
+ return (
+
+
+
+ }
+ onClick={() => {
+ setCurrentTestChannel(record);
+ setShowModelTestModal(true);
+ }}
+ />
+
+
+ {record.channel_info?.is_multi_key ? (
+
+ {
+ record.status === 1 ? (
+
+ ) : (
+
+ )
+ }
+ manageChannel(record.id, 'enable_all', record),
+ }
+ ]}
+ >
+ }
+ />
+
+
+ ) : (
+ record.status === 1 ? (
+
+ ) : (
+
+ )
+ )}
+
+
+
+
+ }
+ type='tertiary'
+ size="small"
+ />
+
+
+ );
+ } else {
+ // 标签操作按钮
+ return (
+
+
+
+
+
+ );
+ }
+ },
+ },
+ ];
+};
\ No newline at end of file
diff --git a/web/src/components/table/channels/ChannelsFilters.jsx b/web/src/components/table/channels/ChannelsFilters.jsx
new file mode 100644
index 00000000..0d607f5f
--- /dev/null
+++ b/web/src/components/table/channels/ChannelsFilters.jsx
@@ -0,0 +1,159 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Button, Form } from '@douyinfe/semi-ui';
+import { IconSearch } from '@douyinfe/semi-icons';
+
+const ChannelsFilters = ({
+ setEditingChannel,
+ setShowEdit,
+ refresh,
+ setShowColumnSelector,
+ formInitValues,
+ setFormApi,
+ searchChannels,
+ enableTagMode,
+ formApi,
+ groupOptions,
+ loading,
+ searching,
+ t
+}) => {
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+};
+
+export default ChannelsFilters;
\ No newline at end of file
diff --git a/web/src/components/table/channels/ChannelsTable.jsx b/web/src/components/table/channels/ChannelsTable.jsx
new file mode 100644
index 00000000..bf4d24de
--- /dev/null
+++ b/web/src/components/table/channels/ChannelsTable.jsx
@@ -0,0 +1,159 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React, { useMemo } from 'react';
+import { Empty } from '@douyinfe/semi-ui';
+import CardTable from '../../common/ui/CardTable.js';
+import {
+ IllustrationNoResult,
+ IllustrationNoResultDark
+} from '@douyinfe/semi-illustrations';
+import { getChannelsColumns } from './ChannelsColumnDefs.js';
+
+const ChannelsTable = (channelsData) => {
+ const {
+ channels,
+ loading,
+ searching,
+ activePage,
+ pageSize,
+ channelCount,
+ enableBatchDelete,
+ compactMode,
+ visibleColumns,
+ setSelectedChannels,
+ handlePageChange,
+ handlePageSizeChange,
+ handleRow,
+ t,
+ COLUMN_KEYS,
+ // Column functions and data
+ updateChannelBalance,
+ manageChannel,
+ manageTag,
+ submitTagEdit,
+ testChannel,
+ setCurrentTestChannel,
+ setShowModelTestModal,
+ setEditingChannel,
+ setShowEdit,
+ setShowEditTag,
+ setEditingTag,
+ copySelectedChannel,
+ refresh,
+ } = channelsData;
+
+ // Get all columns
+ const allColumns = useMemo(() => {
+ return getChannelsColumns({
+ t,
+ COLUMN_KEYS,
+ updateChannelBalance,
+ manageChannel,
+ manageTag,
+ submitTagEdit,
+ testChannel,
+ setCurrentTestChannel,
+ setShowModelTestModal,
+ setEditingChannel,
+ setShowEdit,
+ setShowEditTag,
+ setEditingTag,
+ copySelectedChannel,
+ refresh,
+ activePage,
+ channels,
+ });
+ }, [
+ t,
+ COLUMN_KEYS,
+ updateChannelBalance,
+ manageChannel,
+ manageTag,
+ submitTagEdit,
+ testChannel,
+ setCurrentTestChannel,
+ setShowModelTestModal,
+ setEditingChannel,
+ setShowEdit,
+ setShowEditTag,
+ setEditingTag,
+ copySelectedChannel,
+ refresh,
+ activePage,
+ channels,
+ ]);
+
+ // Filter columns based on visibility settings
+ const getVisibleColumns = () => {
+ return allColumns.filter((column) => visibleColumns[column.key]);
+ };
+
+ const visibleColumnsList = useMemo(() => {
+ return getVisibleColumns();
+ }, [visibleColumns, allColumns]);
+
+ const tableColumns = useMemo(() => {
+ return compactMode
+ ? visibleColumnsList.map(({ fixed, ...rest }) => rest)
+ : visibleColumnsList;
+ }, [compactMode, visibleColumnsList]);
+
+ return (
+ {
+ setSelectedChannels(selectedRows);
+ },
+ }
+ : null
+ }
+ empty={
+ }
+ darkModeImage={}
+ description={t('搜索无结果')}
+ style={{ padding: 30 }}
+ />
+ }
+ className="rounded-xl overflow-hidden"
+ size="middle"
+ loading={loading || searching}
+ />
+ );
+};
+
+export default ChannelsTable;
\ No newline at end of file
diff --git a/web/src/components/table/channels/ChannelsTabs.jsx b/web/src/components/table/channels/ChannelsTabs.jsx
new file mode 100644
index 00000000..f0448efc
--- /dev/null
+++ b/web/src/components/table/channels/ChannelsTabs.jsx
@@ -0,0 +1,89 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Tabs, TabPane, Tag } from '@douyinfe/semi-ui';
+import { CHANNEL_OPTIONS } from '../../../constants/index.js';
+import { getChannelIcon } from '../../../helpers/index.js';
+
+const ChannelsTabs = ({
+ enableTagMode,
+ activeTypeKey,
+ setActiveTypeKey,
+ channelTypeCounts,
+ availableTypeKeys,
+ loadChannels,
+ activePage,
+ pageSize,
+ idSort,
+ setActivePage,
+ t
+}) => {
+ if (enableTagMode) return null;
+
+ const handleTabChange = (key) => {
+ setActiveTypeKey(key);
+ setActivePage(1);
+ loadChannels(1, pageSize, idSort, enableTagMode, key);
+ };
+
+ return (
+
+
+ {t('全部')}
+
+ {channelTypeCounts['all'] || 0}
+
+
+ }
+ />
+
+ {CHANNEL_OPTIONS.filter((opt) => availableTypeKeys.includes(String(opt.value))).map((option) => {
+ const key = String(option.value);
+ const count = channelTypeCounts[option.value] || 0;
+ return (
+
+ {getChannelIcon(option.value)}
+ {option.label}
+
+ {count}
+
+
+ }
+ />
+ );
+ })}
+
+ );
+};
+
+export default ChannelsTabs;
\ No newline at end of file
diff --git a/web/src/components/table/channels/index.jsx b/web/src/components/table/channels/index.jsx
new file mode 100644
index 00000000..f9370150
--- /dev/null
+++ b/web/src/components/table/channels/index.jsx
@@ -0,0 +1,80 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import CardPro from '../../common/ui/CardPro.js';
+import ChannelsTable from './ChannelsTable.jsx';
+import ChannelsActions from './ChannelsActions.jsx';
+import ChannelsFilters from './ChannelsFilters.jsx';
+import ChannelsTabs from './ChannelsTabs.jsx';
+import { useChannelsData } from '../../../hooks/channels/useChannelsData.js';
+import { useIsMobile } from '../../../hooks/common/useIsMobile.js';
+import BatchTagModal from './modals/BatchTagModal.jsx';
+import ModelTestModal from './modals/ModelTestModal.jsx';
+import ColumnSelectorModal from './modals/ColumnSelectorModal.jsx';
+import EditChannelModal from './modals/EditChannelModal.jsx';
+import EditTagModal from './modals/EditTagModal.jsx';
+import { createCardProPagination } from '../../../helpers/utils';
+
+const ChannelsPage = () => {
+ const channelsData = useChannelsData();
+ const isMobile = useIsMobile();
+
+ return (
+ <>
+ {/* Modals */}
+
+ channelsData.setShowEditTag(false)}
+ refresh={channelsData.refresh}
+ />
+
+
+
+
+ {/* Main Content */}
+ }
+ actionsArea={}
+ searchArea={}
+ paginationArea={createCardProPagination({
+ currentPage: channelsData.activePage,
+ pageSize: channelsData.pageSize,
+ total: channelsData.channelCount,
+ onPageChange: channelsData.handlePageChange,
+ onPageSizeChange: channelsData.handlePageSizeChange,
+ isMobile: isMobile,
+ })}
+ t={channelsData.t}
+ >
+
+
+
+ );
+};
+
+export default ChannelsPage;
\ No newline at end of file
diff --git a/web/src/components/table/channels/modals/BatchTagModal.jsx b/web/src/components/table/channels/modals/BatchTagModal.jsx
new file mode 100644
index 00000000..121ba87f
--- /dev/null
+++ b/web/src/components/table/channels/modals/BatchTagModal.jsx
@@ -0,0 +1,60 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Modal, Input, Typography } from '@douyinfe/semi-ui';
+
+const BatchTagModal = ({
+ showBatchSetTag,
+ setShowBatchSetTag,
+ batchSetChannelTag,
+ batchSetTagValue,
+ setBatchSetTagValue,
+ selectedChannels,
+ t
+}) => {
+ return (
+ setShowBatchSetTag(false)}
+ maskClosable={false}
+ centered={true}
+ size="small"
+ className="!rounded-lg"
+ >
+
+
+ );
+};
+
+export default BatchTagModal;
\ No newline at end of file
diff --git a/web/src/components/table/channels/modals/ColumnSelectorModal.jsx b/web/src/components/table/channels/modals/ColumnSelectorModal.jsx
new file mode 100644
index 00000000..291992ce
--- /dev/null
+++ b/web/src/components/table/channels/modals/ColumnSelectorModal.jsx
@@ -0,0 +1,133 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Modal, Button, Checkbox } from '@douyinfe/semi-ui';
+import { getChannelsColumns } from '../ChannelsColumnDefs.js';
+
+const ColumnSelectorModal = ({
+ showColumnSelector,
+ setShowColumnSelector,
+ visibleColumns,
+ handleColumnVisibilityChange,
+ handleSelectAll,
+ initDefaultColumns,
+ COLUMN_KEYS,
+ t,
+ // Props needed for getChannelsColumns
+ updateChannelBalance,
+ manageChannel,
+ manageTag,
+ submitTagEdit,
+ testChannel,
+ setCurrentTestChannel,
+ setShowModelTestModal,
+ setEditingChannel,
+ setShowEdit,
+ setShowEditTag,
+ setEditingTag,
+ copySelectedChannel,
+ refresh,
+ activePage,
+ channels,
+}) => {
+ // Get all columns for display in selector
+ const allColumns = getChannelsColumns({
+ t,
+ COLUMN_KEYS,
+ updateChannelBalance,
+ manageChannel,
+ manageTag,
+ submitTagEdit,
+ testChannel,
+ setCurrentTestChannel,
+ setShowModelTestModal,
+ setEditingChannel,
+ setShowEdit,
+ setShowEditTag,
+ setEditingTag,
+ copySelectedChannel,
+ refresh,
+ activePage,
+ channels,
+ });
+
+ return (
+ setShowColumnSelector(false)}
+ footer={
+
)}
-
+
{batch && (
{
className='!rounded-lg mb-3'
/>
)}
-
+
{useManualInput && !batch ? (
{
placeholder={t('请选择该渠道所支持的模型')}
rules={[{ required: true, message: t('请选择模型') }]}
multiple
- filter
+ filter={modelSelectFilter}
+ autoClearSearchValue={false}
searchPosition='dropdown'
optionList={modelOptions}
style={{ width: '100%' }}
@@ -1466,4 +1485,4 @@ const EditChannel = (props) => {
);
};
-export default EditChannel;
+export default EditChannelModal;
\ No newline at end of file
diff --git a/web/src/pages/Channel/EditTagModal.js b/web/src/components/table/channels/modals/EditTagModal.jsx
similarity index 93%
rename from web/src/pages/Channel/EditTagModal.js
rename to web/src/components/table/channels/modals/EditTagModal.jsx
index 433d4f09..5aadb95e 100644
--- a/web/src/pages/Channel/EditTagModal.js
+++ b/web/src/components/table/channels/modals/EditTagModal.jsx
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useState, useEffect, useRef } from 'react';
import {
API,
@@ -6,7 +25,8 @@ import {
showSuccess,
showWarning,
verifyJSON,
-} from '../../helpers';
+ modelSelectFilter,
+} from '../../../../helpers';
import {
SideSheet,
Space,
@@ -26,7 +46,7 @@ import {
IconUser,
IconCode,
} from '@douyinfe/semi-icons';
-import { getChannelModels } from '../../helpers';
+import { getChannelModels } from '../../../../helpers';
import { useTranslation } from 'react-i18next';
const { Text, Title } = Typography;
@@ -375,7 +395,8 @@ const EditTagModal = (props) => {
label={t('模型')}
placeholder={t('请选择该渠道所支持的模型，留空则不更改')}
multiple
- filter
+ filter={modelSelectFilter}
+ autoClearSearchValue={false}
searchPosition='dropdown'
optionList={modelOptions}
style={{ width: '100%' }}
@@ -441,4 +462,4 @@ const EditTagModal = (props) => {
);
};
-export default EditTagModal;
+export default EditTagModal;
\ No newline at end of file
diff --git a/web/src/components/table/channels/modals/ModelTestModal.jsx b/web/src/components/table/channels/modals/ModelTestModal.jsx
new file mode 100644
index 00000000..1d159473
--- /dev/null
+++ b/web/src/components/table/channels/modals/ModelTestModal.jsx
@@ -0,0 +1,276 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import {
+ Modal,
+ Button,
+ Input,
+ Table,
+ Tag,
+ Typography
+} from '@douyinfe/semi-ui';
+import { IconSearch } from '@douyinfe/semi-icons';
+import { copy, showError, showInfo, showSuccess } from '../../../../helpers/index.js';
+import { MODEL_TABLE_PAGE_SIZE } from '../../../../constants/index.js';
+
+const ModelTestModal = ({
+ showModelTestModal,
+ currentTestChannel,
+ handleCloseModal,
+ isBatchTesting,
+ batchTestModels,
+ modelSearchKeyword,
+ setModelSearchKeyword,
+ selectedModelKeys,
+ setSelectedModelKeys,
+ modelTestResults,
+ testingModels,
+ testChannel,
+ modelTablePage,
+ setModelTablePage,
+ allSelectingRef,
+ isMobile,
+ t
+}) => {
+ const hasChannel = Boolean(currentTestChannel);
+
+ const filteredModels = hasChannel
+ ? currentTestChannel.models
+ .split(',')
+ .filter((model) =>
+ model.toLowerCase().includes(modelSearchKeyword.toLowerCase())
+ )
+ : [];
+
+ const handleCopySelected = () => {
+ if (selectedModelKeys.length === 0) {
+ showError(t('请先选择模型！'));
+ return;
+ }
+ copy(selectedModelKeys.join(',')).then((ok) => {
+ if (ok) {
+ showSuccess(t('已复制 ${count} 个模型').replace('${count}', selectedModelKeys.length));
+ } else {
+ showError(t('复制失败，请手动复制'));
+ }
+ });
+ };
+
+ const handleSelectSuccess = () => {
+ if (!currentTestChannel) return;
+ const successKeys = currentTestChannel.models
+ .split(',')
+ .filter((m) => m.toLowerCase().includes(modelSearchKeyword.toLowerCase()))
+ .filter((m) => {
+ const result = modelTestResults[`${currentTestChannel.id}-${m}`];
+ return result && result.success;
+ });
+ if (successKeys.length === 0) {
+ showInfo(t('暂无成功模型'));
+ }
+ setSelectedModelKeys(successKeys);
+ };
+
+ const columns = [
+ {
+ title: t('模型名称'),
+ dataIndex: 'model',
+ render: (text) => (
+
{
+ if (allSelectingRef.current) {
+ allSelectingRef.current = false;
+ return;
+ }
+ setSelectedModelKeys(keys);
+ },
+ onSelectAll: (checked) => {
+ allSelectingRef.current = true;
+ setSelectedModelKeys(checked ? filteredModels : []);
+ },
+ }}
+ pagination={{
+ currentPage: modelTablePage,
+ pageSize: MODEL_TABLE_PAGE_SIZE,
+ total: filteredModels.length,
+ showSizeChanger: false,
+ onPageChange: (page) => setModelTablePage(page),
+ }}
+ />
+ )}
+
+ );
+};
+
+export default ModelTestModal;
\ No newline at end of file
diff --git a/web/src/components/table/mj-logs/MjLogsActions.jsx b/web/src/components/table/mj-logs/MjLogsActions.jsx
new file mode 100644
index 00000000..b924c36a
--- /dev/null
+++ b/web/src/components/table/mj-logs/MjLogsActions.jsx
@@ -0,0 +1,64 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Skeleton, Typography } from '@douyinfe/semi-ui';
+import { IconEyeOpened } from '@douyinfe/semi-icons';
+import CompactModeToggle from '../../common/ui/CompactModeToggle';
+
+const { Text } = Typography;
+
+const MjLogsActions = ({
+ loading,
+ showBanner,
+ isAdminUser,
+ compactMode,
+ setCompactMode,
+ t,
+}) => {
+ return (
+
+ );
+ },
+ },
+ {
+ key: COLUMN_KEYS.IMAGE,
+ title: t('结果图片'),
+ dataIndex: 'image_url',
+ render: (text, record, index) => {
+ if (!text) {
+ return t('无');
+ }
+ return (
+
+ );
+ },
+ },
+ {
+ key: COLUMN_KEYS.PROMPT,
+ title: 'Prompt',
+ dataIndex: 'prompt',
+ render: (text, record, index) => {
+ if (!text) {
+ return t('无');
+ }
+
+ return (
+ {
+ openContentModal(text);
+ }}
+ >
+ {text}
+
+ );
+ },
+ },
+ {
+ key: COLUMN_KEYS.PROMPT_EN,
+ title: 'PromptEn',
+ dataIndex: 'prompt_en',
+ render: (text, record, index) => {
+ if (!text) {
+ return t('无');
+ }
+
+ return (
+ {
+ openContentModal(text);
+ }}
+ >
+ {text}
+
+ );
+ },
+ },
+ {
+ key: COLUMN_KEYS.FAIL_REASON,
+ title: t('失败原因'),
+ dataIndex: 'fail_reason',
+ fixed: 'right',
+ render: (text, record, index) => {
+ if (!text) {
+ return t('无');
+ }
+
+ return (
+ {
+ openContentModal(text);
+ }}
+ >
+ {text}
+
+ );
+ },
+ },
+ ];
+};
\ No newline at end of file
diff --git a/web/src/components/table/mj-logs/MjLogsFilters.jsx b/web/src/components/table/mj-logs/MjLogsFilters.jsx
new file mode 100644
index 00000000..4aced0f2
--- /dev/null
+++ b/web/src/components/table/mj-logs/MjLogsFilters.jsx
@@ -0,0 +1,123 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Button, Form } from '@douyinfe/semi-ui';
+import { IconSearch } from '@douyinfe/semi-icons';
+
+const MjLogsFilters = ({
+ formInitValues,
+ setFormApi,
+ refresh,
+ setShowColumnSelector,
+ formApi,
+ loading,
+ isAdminUser,
+ t,
+}) => {
+ return (
+
+ );
+};
+
+export default MjLogsFilters;
\ No newline at end of file
diff --git a/web/src/components/table/mj-logs/MjLogsTable.jsx b/web/src/components/table/mj-logs/MjLogsTable.jsx
new file mode 100644
index 00000000..31a2d10e
--- /dev/null
+++ b/web/src/components/table/mj-logs/MjLogsTable.jsx
@@ -0,0 +1,117 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React, { useMemo } from 'react';
+import { Empty } from '@douyinfe/semi-ui';
+import CardTable from '../../common/ui/CardTable.js';
+import {
+ IllustrationNoResult,
+ IllustrationNoResultDark,
+} from '@douyinfe/semi-illustrations';
+import { getMjLogsColumns } from './MjLogsColumnDefs.js';
+
+const MjLogsTable = (mjLogsData) => {
+ const {
+ logs,
+ loading,
+ activePage,
+ pageSize,
+ logCount,
+ compactMode,
+ visibleColumns,
+ handlePageChange,
+ handlePageSizeChange,
+ copyText,
+ openContentModal,
+ openImageModal,
+ isAdminUser,
+ t,
+ COLUMN_KEYS,
+ } = mjLogsData;
+
+ // Get all columns
+ const allColumns = useMemo(() => {
+ return getMjLogsColumns({
+ t,
+ COLUMN_KEYS,
+ copyText,
+ openContentModal,
+ openImageModal,
+ isAdminUser,
+ });
+ }, [
+ t,
+ COLUMN_KEYS,
+ copyText,
+ openContentModal,
+ openImageModal,
+ isAdminUser,
+ ]);
+
+ // Filter columns based on visibility settings
+ const getVisibleColumns = () => {
+ return allColumns.filter((column) => visibleColumns[column.key]);
+ };
+
+ const visibleColumnsList = useMemo(() => {
+ return getVisibleColumns();
+ }, [visibleColumns, allColumns]);
+
+ const tableColumns = useMemo(() => {
+ return compactMode
+ ? visibleColumnsList.map(({ fixed, ...rest }) => rest)
+ : visibleColumnsList;
+ }, [compactMode, visibleColumnsList]);
+
+ return (
+
+ }
+ darkModeImage={
+
+ }
+ description={t('搜索无结果')}
+ style={{ padding: 30 }}
+ />
+ }
+ pagination={{
+ currentPage: activePage,
+ pageSize: pageSize,
+ total: logCount,
+ pageSizeOptions: [10, 20, 50, 100],
+ showSizeChanger: true,
+ onPageSizeChange: handlePageSizeChange,
+ onPageChange: handlePageChange,
+ }}
+ hidePagination={true}
+ />
+ );
+};
+
+export default MjLogsTable;
\ No newline at end of file
diff --git a/web/src/components/table/mj-logs/index.jsx b/web/src/components/table/mj-logs/index.jsx
new file mode 100644
index 00000000..86f96713
--- /dev/null
+++ b/web/src/components/table/mj-logs/index.jsx
@@ -0,0 +1,64 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Layout } from '@douyinfe/semi-ui';
+import CardPro from '../../common/ui/CardPro.js';
+import MjLogsTable from './MjLogsTable.jsx';
+import MjLogsActions from './MjLogsActions.jsx';
+import MjLogsFilters from './MjLogsFilters.jsx';
+import ColumnSelectorModal from './modals/ColumnSelectorModal.jsx';
+import ContentModal from './modals/ContentModal.jsx';
+import { useMjLogsData } from '../../../hooks/mj-logs/useMjLogsData.js';
+import { useIsMobile } from '../../../hooks/common/useIsMobile.js';
+import { createCardProPagination } from '../../../helpers/utils';
+
+const MjLogsPage = () => {
+ const mjLogsData = useMjLogsData();
+ const isMobile = useIsMobile();
+
+ return (
+ <>
+ {/* Modals */}
+
+
+
+
+ }
+ searchArea={}
+ paginationArea={createCardProPagination({
+ currentPage: mjLogsData.activePage,
+ pageSize: mjLogsData.pageSize,
+ total: mjLogsData.logCount,
+ onPageChange: mjLogsData.handlePageChange,
+ onPageSizeChange: mjLogsData.handlePageSizeChange,
+ isMobile: isMobile,
+ })}
+ t={mjLogsData.t}
+ >
+
+
+
+
+ );
+};
+
+export default MjLogsPage;
\ No newline at end of file
diff --git a/web/src/components/table/mj-logs/modals/ColumnSelectorModal.jsx b/web/src/components/table/mj-logs/modals/ColumnSelectorModal.jsx
new file mode 100644
index 00000000..d05f9cf0
--- /dev/null
+++ b/web/src/components/table/mj-logs/modals/ColumnSelectorModal.jsx
@@ -0,0 +1,111 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Modal, Button, Checkbox } from '@douyinfe/semi-ui';
+import { getMjLogsColumns } from '../MjLogsColumnDefs.js';
+
+const ColumnSelectorModal = ({
+ showColumnSelector,
+ setShowColumnSelector,
+ visibleColumns,
+ handleColumnVisibilityChange,
+ handleSelectAll,
+ initDefaultColumns,
+ COLUMN_KEYS,
+ isAdminUser,
+ copyText,
+ openContentModal,
+ openImageModal,
+ t,
+}) => {
+ // Get all columns for display in selector
+ const allColumns = getMjLogsColumns({
+ t,
+ COLUMN_KEYS,
+ copyText,
+ openContentModal,
+ openImageModal,
+ isAdminUser,
+ });
+
+ return (
+ setShowColumnSelector(false)}
+ footer={
+
+
+ );
+};
+
+export default ColumnSelectorModal;
\ No newline at end of file
diff --git a/web/src/components/table/mj-logs/modals/ContentModal.jsx b/web/src/components/table/mj-logs/modals/ContentModal.jsx
new file mode 100644
index 00000000..f73cda24
--- /dev/null
+++ b/web/src/components/table/mj-logs/modals/ContentModal.jsx
@@ -0,0 +1,55 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Modal, ImagePreview } from '@douyinfe/semi-ui';
+
+const ContentModal = ({
+ isModalOpen,
+ setIsModalOpen,
+ modalContent,
+ isModalOpenurl,
+ setIsModalOpenurl,
+ modalImageUrl,
+}) => {
+ return (
+ <>
+ {/* Text Content Modal */}
+ setIsModalOpen(false)}
+ onCancel={() => setIsModalOpen(false)}
+ closable={null}
+ bodyStyle={{ height: '400px', overflow: 'auto' }}
+ width={800}
+ >
+
{modalContent}
+
+
+ {/* Image Preview Modal */}
+ setIsModalOpenurl(visible)}
+ />
+
+ );
+};
+
+export default ContentModal;
\ No newline at end of file
diff --git a/web/src/components/table/redemptions/RedemptionsActions.jsx b/web/src/components/table/redemptions/RedemptionsActions.jsx
new file mode 100644
index 00000000..5b10fb00
--- /dev/null
+++ b/web/src/components/table/redemptions/RedemptionsActions.jsx
@@ -0,0 +1,72 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Button } from '@douyinfe/semi-ui';
+
+const RedemptionsActions = ({
+ selectedKeys,
+ setEditingRedemption,
+ setShowEdit,
+ batchCopyRedemptions,
+ batchDeleteRedemptions,
+ t
+}) => {
+
+ // Add new redemption code
+ const handleAddRedemption = () => {
+ setEditingRedemption({
+ id: undefined,
+ });
+ setShowEdit(true);
+ };
+
+ return (
+
+
+
+
+
+
+
+ );
+};
+
+export default RedemptionsActions;
\ No newline at end of file
diff --git a/web/src/components/table/redemptions/RedemptionsColumnDefs.js b/web/src/components/table/redemptions/RedemptionsColumnDefs.js
new file mode 100644
index 00000000..fc1601c1
--- /dev/null
+++ b/web/src/components/table/redemptions/RedemptionsColumnDefs.js
@@ -0,0 +1,217 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Tag, Button, Space, Popover, Dropdown } from '@douyinfe/semi-ui';
+import { IconMore } from '@douyinfe/semi-icons';
+import { renderQuota, timestamp2string } from '../../../helpers';
+import { REDEMPTION_STATUS, REDEMPTION_STATUS_MAP, REDEMPTION_ACTIONS } from '../../../constants/redemption.constants';
+
+/**
+ * Check if redemption code is expired
+ */
+export const isExpired = (record) => {
+ return record.status === REDEMPTION_STATUS.UNUSED &&
+ record.expired_time !== 0 &&
+ record.expired_time < Math.floor(Date.now() / 1000);
+};
+
+/**
+ * Render timestamp
+ */
+const renderTimestamp = (timestamp) => {
+ return <>{timestamp2string(timestamp)};
+};
+
+/**
+ * Render redemption code status
+ */
+const renderStatus = (status, record, t) => {
+ if (isExpired(record)) {
+ return (
+ {t('已过期')}
+ );
+ }
+
+ const statusConfig = REDEMPTION_STATUS_MAP[status];
+ if (statusConfig) {
+ return (
+
+ {t(statusConfig.text)}
+
+ );
+ }
+
+ return (
+
+ {t('未知状态')}
+
+ );
+};
+
+/**
+ * Get redemption code table column definitions
+ */
+export const getRedemptionsColumns = ({
+ t,
+ manageRedemption,
+ copyText,
+ setEditingRedemption,
+ setShowEdit,
+ refresh,
+ redemptions,
+ activePage,
+ showDeleteRedemptionModal
+}) => {
+ return [
+ {
+ title: t('ID'),
+ dataIndex: 'id',
+ },
+ {
+ title: t('名称'),
+ dataIndex: 'name',
+ },
+ {
+ title: t('状态'),
+ dataIndex: 'status',
+ key: 'status',
+ render: (text, record) => {
+ return
;
+ },
+ },
+ {
+ title: '',
+ dataIndex: 'operate',
+ fixed: 'right',
+ width: 205,
+ render: (text, record) => {
+ // Create dropdown menu items for more operations
+ const moreMenuItems = [
+ {
+ node: 'item',
+ name: t('删除'),
+ type: 'danger',
+ onClick: () => {
+ showDeleteRedemptionModal(record);
+ },
+ }
+ ];
+
+ if (record.status === REDEMPTION_STATUS.UNUSED && !isExpired(record)) {
+ moreMenuItems.push({
+ node: 'item',
+ name: t('禁用'),
+ type: 'warning',
+ onClick: () => {
+ manageRedemption(record.id, REDEMPTION_ACTIONS.DISABLE, record);
+ },
+ });
+ } else if (!isExpired(record)) {
+ moreMenuItems.push({
+ node: 'item',
+ name: t('启用'),
+ type: 'secondary',
+ onClick: () => {
+ manageRedemption(record.id, REDEMPTION_ACTIONS.ENABLE, record);
+ },
+ disabled: record.status === REDEMPTION_STATUS.USED,
+ });
+ }
+
+ return (
+
+
+
+
+
+
+
+ }
+ />
+
+
+ );
+ },
+ },
+ ];
+};
\ No newline at end of file
diff --git a/web/src/components/table/redemptions/RedemptionsDescription.jsx b/web/src/components/table/redemptions/RedemptionsDescription.jsx
new file mode 100644
index 00000000..56e63464
--- /dev/null
+++ b/web/src/components/table/redemptions/RedemptionsDescription.jsx
@@ -0,0 +1,44 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Typography } from '@douyinfe/semi-ui';
+import { Ticket } from 'lucide-react';
+import CompactModeToggle from '../../common/ui/CompactModeToggle';
+
+const { Text } = Typography;
+
+const RedemptionsDescription = ({ compactMode, setCompactMode, t }) => {
+ return (
+
+
+
+ {t('兑换码管理')}
+
+
+
+
+ );
+};
+
+export default RedemptionsDescription;
\ No newline at end of file
diff --git a/web/src/components/table/redemptions/RedemptionsFilters.jsx b/web/src/components/table/redemptions/RedemptionsFilters.jsx
new file mode 100644
index 00000000..3766706b
--- /dev/null
+++ b/web/src/components/table/redemptions/RedemptionsFilters.jsx
@@ -0,0 +1,94 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React, { useRef } from 'react';
+import { Form, Button } from '@douyinfe/semi-ui';
+import { IconSearch } from '@douyinfe/semi-icons';
+
+const RedemptionsFilters = ({
+ formInitValues,
+ setFormApi,
+ searchRedemptions,
+ loading,
+ searching,
+ t
+}) => {
+
+ // Handle form reset and immediate search
+ const formApiRef = useRef(null);
+
+ const handleReset = () => {
+ if (!formApiRef.current) return;
+ formApiRef.current.reset();
+ setTimeout(() => {
+ searchRedemptions();
+ }, 100);
+ };
+
+ return (
+
+ );
+};
+
+export default RedemptionsFilters;
\ No newline at end of file
diff --git a/web/src/components/table/redemptions/RedemptionsTable.jsx b/web/src/components/table/redemptions/RedemptionsTable.jsx
new file mode 100644
index 00000000..76e50532
--- /dev/null
+++ b/web/src/components/table/redemptions/RedemptionsTable.jsx
@@ -0,0 +1,140 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React, { useMemo, useState } from 'react';
+import { Empty } from '@douyinfe/semi-ui';
+import CardTable from '../../common/ui/CardTable.js';
+import {
+ IllustrationNoResult,
+ IllustrationNoResultDark
+} from '@douyinfe/semi-illustrations';
+import { getRedemptionsColumns, isExpired } from './RedemptionsColumnDefs';
+import DeleteRedemptionModal from './modals/DeleteRedemptionModal';
+
+const RedemptionsTable = (redemptionsData) => {
+ const {
+ redemptions,
+ loading,
+ activePage,
+ pageSize,
+ tokenCount,
+ compactMode,
+ handlePageChange,
+ rowSelection,
+ handleRow,
+ manageRedemption,
+ copyText,
+ setEditingRedemption,
+ setShowEdit,
+ refresh,
+ t,
+ } = redemptionsData;
+
+ // Modal states
+ const [showDeleteModal, setShowDeleteModal] = useState(false);
+ const [deletingRecord, setDeletingRecord] = useState(null);
+
+ // Handle show delete modal
+ const showDeleteRedemptionModal = (record) => {
+ setDeletingRecord(record);
+ setShowDeleteModal(true);
+ };
+
+ // Get all columns
+ const columns = useMemo(() => {
+ return getRedemptionsColumns({
+ t,
+ manageRedemption,
+ copyText,
+ setEditingRedemption,
+ setShowEdit,
+ refresh,
+ redemptions,
+ activePage,
+ showDeleteRedemptionModal
+ });
+ }, [
+ t,
+ manageRedemption,
+ copyText,
+ setEditingRedemption,
+ setShowEdit,
+ refresh,
+ redemptions,
+ activePage,
+ showDeleteRedemptionModal,
+ ]);
+
+ // Handle compact mode by removing fixed positioning
+ const tableColumns = useMemo(() => {
+ return compactMode ? columns.map(col => {
+ if (col.dataIndex === 'operate') {
+ const { fixed, ...rest } = col;
+ return rest;
+ }
+ return col;
+ }) : columns;
+ }, [compactMode, columns]);
+
+ return (
+ <>
+ }
+ darkModeImage={}
+ description={t('搜索无结果')}
+ style={{ padding: 30 }}
+ />
+ }
+ className="rounded-xl overflow-hidden"
+ size="middle"
+ />
+
+ setShowDeleteModal(false)}
+ record={deletingRecord}
+ manageRedemption={manageRedemption}
+ refresh={refresh}
+ redemptions={redemptions}
+ activePage={activePage}
+ t={t}
+ />
+
+ );
+};
+
+export default RedemptionsTable;
\ No newline at end of file
diff --git a/web/src/components/table/redemptions/index.jsx b/web/src/components/table/redemptions/index.jsx
new file mode 100644
index 00000000..5abb64aa
--- /dev/null
+++ b/web/src/components/table/redemptions/index.jsx
@@ -0,0 +1,121 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import CardPro from '../../common/ui/CardPro';
+import RedemptionsTable from './RedemptionsTable.jsx';
+import RedemptionsActions from './RedemptionsActions.jsx';
+import RedemptionsFilters from './RedemptionsFilters.jsx';
+import RedemptionsDescription from './RedemptionsDescription.jsx';
+import EditRedemptionModal from './modals/EditRedemptionModal';
+import { useRedemptionsData } from '../../../hooks/redemptions/useRedemptionsData';
+import { useIsMobile } from '../../../hooks/common/useIsMobile';
+import { createCardProPagination } from '../../../helpers/utils';
+
+const RedemptionsPage = () => {
+ const redemptionsData = useRedemptionsData();
+ const isMobile = useIsMobile();
+
+ const {
+ // Edit state
+ showEdit,
+ editingRedemption,
+ closeEdit,
+ refresh,
+
+ // Actions state
+ selectedKeys,
+ setEditingRedemption,
+ setShowEdit,
+ batchCopyRedemptions,
+ batchDeleteRedemptions,
+
+ // Filters state
+ formInitValues,
+ setFormApi,
+ searchRedemptions,
+ loading,
+ searching,
+
+ // UI state
+ compactMode,
+ setCompactMode,
+
+ // Translation
+ t,
+ } = redemptionsData;
+
+ return (
+ <>
+
+
+
+ }
+ actionsArea={
+
+
+
+
+
+
+
+ }
+ paginationArea={createCardProPagination({
+ currentPage: redemptionsData.activePage,
+ pageSize: redemptionsData.pageSize,
+ total: redemptionsData.tokenCount,
+ onPageChange: redemptionsData.handlePageChange,
+ onPageSizeChange: redemptionsData.handlePageSizeChange,
+ isMobile: isMobile,
+ })}
+ t={t}
+ >
+
+
+
+ );
+};
+
+export default RedemptionsPage;
\ No newline at end of file
diff --git a/web/src/components/table/redemptions/modals/DeleteRedemptionModal.jsx b/web/src/components/table/redemptions/modals/DeleteRedemptionModal.jsx
new file mode 100644
index 00000000..d99968e7
--- /dev/null
+++ b/web/src/components/table/redemptions/modals/DeleteRedemptionModal.jsx
@@ -0,0 +1,58 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Modal } from '@douyinfe/semi-ui';
+import { REDEMPTION_ACTIONS } from '../../../../constants/redemption.constants';
+
+const DeleteRedemptionModal = ({
+ visible,
+ onCancel,
+ record,
+ manageRedemption,
+ refresh,
+ redemptions,
+ activePage,
+ t
+}) => {
+ const handleConfirm = async () => {
+ await manageRedemption(record.id, REDEMPTION_ACTIONS.DELETE, record);
+ await refresh();
+ setTimeout(() => {
+ if (redemptions.length === 0 && activePage > 1) {
+ refresh(activePage - 1);
+ }
+ }, 100);
+ onCancel(); // Close modal after success
+ };
+
+ return (
+
+ {t('此修改将不可逆')}
+
+ );
+};
+
+export default DeleteRedemptionModal;
\ No newline at end of file
diff --git a/web/src/pages/Redemption/EditRedemption.js b/web/src/components/table/redemptions/modals/EditRedemptionModal.jsx
similarity index 91%
rename from web/src/pages/Redemption/EditRedemption.js
rename to web/src/components/table/redemptions/modals/EditRedemptionModal.jsx
index 44d17e62..79b834a3 100644
--- a/web/src/pages/Redemption/EditRedemption.js
+++ b/web/src/components/table/redemptions/modals/EditRedemptionModal.jsx
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import { useTranslation } from 'react-i18next';
import {
@@ -7,8 +26,8 @@ import {
showSuccess,
renderQuota,
renderQuotaWithPrompt,
-} from '../../helpers';
-import { useIsMobile } from '../../hooks/useIsMobile.js';
+} from '../../../../helpers';
+import { useIsMobile } from '../../../../hooks/common/useIsMobile.js';
import {
Button,
Modal,
@@ -32,7 +51,7 @@ import {
const { Text, Title } = Typography;
-const EditRedemption = (props) => {
+const EditRedemptionModal = (props) => {
const { t } = useTranslation();
const isEdit = props.editingRedemption.id !== undefined;
const [loading, setLoading] = useState(isEdit);
@@ -302,4 +321,4 @@ const EditRedemption = (props) => {
);
};
-export default EditRedemption;
+export default EditRedemptionModal;
\ No newline at end of file
diff --git a/web/src/components/table/task-logs/TaskLogsActions.jsx b/web/src/components/table/task-logs/TaskLogsActions.jsx
new file mode 100644
index 00000000..5df27e69
--- /dev/null
+++ b/web/src/components/table/task-logs/TaskLogsActions.jsx
@@ -0,0 +1,47 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Typography } from '@douyinfe/semi-ui';
+import { IconEyeOpened } from '@douyinfe/semi-icons';
+import CompactModeToggle from '../../common/ui/CompactModeToggle';
+
+const { Text } = Typography;
+
+const TaskLogsActions = ({
+ compactMode,
+ setCompactMode,
+ t,
+}) => {
+ return (
+
+
+
+ {t('任务记录')}
+
+
+
+ );
+};
+
+export default TaskLogsActions;
\ No newline at end of file
diff --git a/web/src/components/table/task-logs/TaskLogsColumnDefs.js b/web/src/components/table/task-logs/TaskLogsColumnDefs.js
new file mode 100644
index 00000000..8b066758
--- /dev/null
+++ b/web/src/components/table/task-logs/TaskLogsColumnDefs.js
@@ -0,0 +1,370 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import {
+ Progress,
+ Tag,
+ Typography
+} from '@douyinfe/semi-ui';
+import {
+ Music,
+ FileText,
+ HelpCircle,
+ CheckCircle,
+ Pause,
+ Clock,
+ Play,
+ XCircle,
+ Loader,
+ List,
+ Hash,
+ Video,
+ Sparkles
+} from 'lucide-react';
+import { TASK_ACTION_GENERATE, TASK_ACTION_TEXT_GENERATE } from '../../../constants/common.constant';
+
+const colors = [
+ 'amber',
+ 'blue',
+ 'cyan',
+ 'green',
+ 'grey',
+ 'indigo',
+ 'light-blue',
+ 'lime',
+ 'orange',
+ 'pink',
+ 'purple',
+ 'red',
+ 'teal',
+ 'violet',
+ 'yellow',
+];
+
+// Render functions
+const renderTimestamp = (timestampInSeconds) => {
+ const date = new Date(timestampInSeconds * 1000); // 从秒转换为毫秒
+
+ const year = date.getFullYear(); // 获取年份
+ const month = ('0' + (date.getMonth() + 1)).slice(-2); // 获取月份，从0开始需要+1，并保证两位数
+ const day = ('0' + date.getDate()).slice(-2); // 获取日期，并保证两位数
+ const hours = ('0' + date.getHours()).slice(-2); // 获取小时，并保证两位数
+ const minutes = ('0' + date.getMinutes()).slice(-2); // 获取分钟，并保证两位数
+ const seconds = ('0' + date.getSeconds()).slice(-2); // 获取秒钟，并保证两位数
+
+ return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`; // 格式化输出
+};
+
+function renderDuration(submit_time, finishTime) {
+ if (!submit_time || !finishTime) return 'N/A';
+ const durationSec = finishTime - submit_time;
+ const color = durationSec > 60 ? 'red' : 'green';
+
+ // 返回带有样式的颜色标签
+ return (
+ }>
+ {durationSec} 秒
+
+ );
+}
+
+const renderType = (type, t) => {
+ switch (type) {
+ case 'MUSIC':
+ return (
+ }>
+ {t('生成音乐')}
+
+ );
+ case 'LYRICS':
+ return (
+ }>
+ {t('生成歌词')}
+
+ );
+ case TASK_ACTION_GENERATE:
+ return (
+ }>
+ {t('图生视频')}
+
+ );
+ case TASK_ACTION_TEXT_GENERATE:
+ return (
+ }>
+ {t('文生视频')}
+
+ );
+ default:
+ return (
+ }>
+ {t('未知')}
+
+ );
+ }
+};
+
+const renderPlatform = (platform, t) => {
+ switch (platform) {
+ case 'suno':
+ return (
+ }>
+ Suno
+
+ );
+ case 'kling':
+ return (
+ }>
+ Kling
+
+ );
+ case 'jimeng':
+ return (
+ }>
+ Jimeng
+
+ );
+ default:
+ return (
+ }>
+ {t('未知')}
+
+ );
+ }
+};
+
+const renderStatus = (type, t) => {
+ switch (type) {
+ case 'SUCCESS':
+ return (
+ }>
+ {t('成功')}
+
+ );
+ case 'NOT_START':
+ return (
+ }>
+ {t('未启动')}
+
+ );
+ case 'SUBMITTED':
+ return (
+ }>
+ {t('队列中')}
+
+ );
+ case 'IN_PROGRESS':
+ return (
+ }>
+ {t('执行中')}
+
+ );
+ case 'FAILURE':
+ return (
+ }>
+ {t('失败')}
+
+ );
+ case 'QUEUED':
+ return (
+ }>
+ {t('排队中')}
+
+ );
+ case 'UNKNOWN':
+ return (
+ }>
+ {t('未知')}
+
+ );
+ case '':
+ return (
+ }>
+ {t('正在提交')}
+
+ );
+ default:
+ return (
+ }>
+ {t('未知')}
+
+ );
+ }
+};
+
+export const getTaskLogsColumns = ({
+ t,
+ COLUMN_KEYS,
+ copyText,
+ openContentModal,
+ isAdminUser,
+}) => {
+ return [
+ {
+ key: COLUMN_KEYS.SUBMIT_TIME,
+ title: t('提交时间'),
+ dataIndex: 'submit_time',
+ render: (text, record, index) => {
+ return
+ );
+ },
+ },
+ {
+ key: COLUMN_KEYS.FAIL_REASON,
+ title: t('详情'),
+ dataIndex: 'fail_reason',
+ fixed: 'right',
+ render: (text, record, index) => {
+ // 仅当为视频生成任务且成功，且 fail_reason 是 URL 时显示可点击链接
+ const isVideoTask = record.action === TASK_ACTION_GENERATE || record.action === TASK_ACTION_TEXT_GENERATE;
+ const isSuccess = record.status === 'SUCCESS';
+ const isUrl = typeof text === 'string' && /^https?:\/\//.test(text);
+ if (isSuccess && isVideoTask && isUrl) {
+ return (
+
+ {t('点击预览视频')}
+
+ );
+ }
+ if (!text) {
+ return t('无');
+ }
+ return (
+ {
+ openContentModal(text);
+ }}
+ >
+ {text}
+
+ );
+ },
+ },
+ ];
+};
\ No newline at end of file
diff --git a/web/src/components/table/task-logs/TaskLogsFilters.jsx b/web/src/components/table/task-logs/TaskLogsFilters.jsx
new file mode 100644
index 00000000..c3e26eea
--- /dev/null
+++ b/web/src/components/table/task-logs/TaskLogsFilters.jsx
@@ -0,0 +1,124 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Button, Form } from '@douyinfe/semi-ui';
+import { IconSearch } from '@douyinfe/semi-icons';
+
+const TaskLogsFilters = ({
+ formInitValues,
+ setFormApi,
+ refresh,
+ setShowColumnSelector,
+ formApi,
+ loading,
+ isAdminUser,
+ t,
+}) => {
+ return (
+
+ );
+};
+
+export default TaskLogsFilters;
\ No newline at end of file
diff --git a/web/src/components/table/task-logs/TaskLogsTable.jsx b/web/src/components/table/task-logs/TaskLogsTable.jsx
new file mode 100644
index 00000000..cacb12dd
--- /dev/null
+++ b/web/src/components/table/task-logs/TaskLogsTable.jsx
@@ -0,0 +1,114 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React, { useMemo } from 'react';
+import { Empty } from '@douyinfe/semi-ui';
+import CardTable from '../../common/ui/CardTable.js';
+import {
+ IllustrationNoResult,
+ IllustrationNoResultDark,
+} from '@douyinfe/semi-illustrations';
+import { getTaskLogsColumns } from './TaskLogsColumnDefs.js';
+
+const TaskLogsTable = (taskLogsData) => {
+ const {
+ logs,
+ loading,
+ activePage,
+ pageSize,
+ logCount,
+ compactMode,
+ visibleColumns,
+ handlePageChange,
+ handlePageSizeChange,
+ copyText,
+ openContentModal,
+ isAdminUser,
+ t,
+ COLUMN_KEYS,
+ } = taskLogsData;
+
+ // Get all columns
+ const allColumns = useMemo(() => {
+ return getTaskLogsColumns({
+ t,
+ COLUMN_KEYS,
+ copyText,
+ openContentModal,
+ isAdminUser,
+ });
+ }, [
+ t,
+ COLUMN_KEYS,
+ copyText,
+ openContentModal,
+ isAdminUser,
+ ]);
+
+ // Filter columns based on visibility settings
+ const getVisibleColumns = () => {
+ return allColumns.filter((column) => visibleColumns[column.key]);
+ };
+
+ const visibleColumnsList = useMemo(() => {
+ return getVisibleColumns();
+ }, [visibleColumns, allColumns]);
+
+ const tableColumns = useMemo(() => {
+ return compactMode
+ ? visibleColumnsList.map(({ fixed, ...rest }) => rest)
+ : visibleColumnsList;
+ }, [compactMode, visibleColumnsList]);
+
+ return (
+
+ }
+ darkModeImage={
+
+ }
+ description={t('搜索无结果')}
+ style={{ padding: 30 }}
+ />
+ }
+ pagination={{
+ currentPage: activePage,
+ pageSize: pageSize,
+ total: logCount,
+ pageSizeOptions: [10, 20, 50, 100],
+ showSizeChanger: true,
+ onPageSizeChange: handlePageSizeChange,
+ onPageChange: handlePageChange,
+ }}
+ hidePagination={true}
+ />
+ );
+};
+
+export default TaskLogsTable;
\ No newline at end of file
diff --git a/web/src/components/table/task-logs/index.jsx b/web/src/components/table/task-logs/index.jsx
new file mode 100644
index 00000000..c9a02541
--- /dev/null
+++ b/web/src/components/table/task-logs/index.jsx
@@ -0,0 +1,64 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Layout } from '@douyinfe/semi-ui';
+import CardPro from '../../common/ui/CardPro.js';
+import TaskLogsTable from './TaskLogsTable.jsx';
+import TaskLogsActions from './TaskLogsActions.jsx';
+import TaskLogsFilters from './TaskLogsFilters.jsx';
+import ColumnSelectorModal from './modals/ColumnSelectorModal.jsx';
+import ContentModal from './modals/ContentModal.jsx';
+import { useTaskLogsData } from '../../../hooks/task-logs/useTaskLogsData.js';
+import { useIsMobile } from '../../../hooks/common/useIsMobile.js';
+import { createCardProPagination } from '../../../helpers/utils';
+
+const TaskLogsPage = () => {
+ const taskLogsData = useTaskLogsData();
+ const isMobile = useIsMobile();
+
+ return (
+ <>
+ {/* Modals */}
+
+
+
+
+ }
+ searchArea={}
+ paginationArea={createCardProPagination({
+ currentPage: taskLogsData.activePage,
+ pageSize: taskLogsData.pageSize,
+ total: taskLogsData.logCount,
+ onPageChange: taskLogsData.handlePageChange,
+ onPageSizeChange: taskLogsData.handlePageSizeChange,
+ isMobile: isMobile,
+ })}
+ t={taskLogsData.t}
+ >
+
+
+
+
+ );
+};
+
+export default TaskLogsPage;
\ No newline at end of file
diff --git a/web/src/components/table/task-logs/modals/ColumnSelectorModal.jsx b/web/src/components/table/task-logs/modals/ColumnSelectorModal.jsx
new file mode 100644
index 00000000..6a66304b
--- /dev/null
+++ b/web/src/components/table/task-logs/modals/ColumnSelectorModal.jsx
@@ -0,0 +1,105 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Modal, Button, Checkbox } from '@douyinfe/semi-ui';
+import { getTaskLogsColumns } from '../TaskLogsColumnDefs.js';
+
+const ColumnSelectorModal = ({
+ showColumnSelector,
+ setShowColumnSelector,
+ visibleColumns,
+ handleColumnVisibilityChange,
+ handleSelectAll,
+ initDefaultColumns,
+ COLUMN_KEYS,
+ isAdminUser,
+ copyText,
+ openContentModal,
+ t,
+}) => {
+ // Get all columns for display in selector
+ const allColumns = getTaskLogsColumns({
+ t,
+ COLUMN_KEYS,
+ copyText,
+ openContentModal,
+ isAdminUser,
+ });
+
+ return (
+ setShowColumnSelector(false)}
+ footer={
+
+
+ );
+};
+
+export default ColumnSelectorModal;
\ No newline at end of file
diff --git a/web/src/components/table/task-logs/modals/ContentModal.jsx b/web/src/components/table/task-logs/modals/ContentModal.jsx
new file mode 100644
index 00000000..11869614
--- /dev/null
+++ b/web/src/components/table/task-logs/modals/ContentModal.jsx
@@ -0,0 +1,42 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Modal } from '@douyinfe/semi-ui';
+
+const ContentModal = ({
+ isModalOpen,
+ setIsModalOpen,
+ modalContent,
+}) => {
+ return (
+ setIsModalOpen(false)}
+ onCancel={() => setIsModalOpen(false)}
+ closable={null}
+ bodyStyle={{ height: '400px', overflow: 'auto' }}
+ width={800}
+ >
+
{modalContent}
+
+ );
+};
+
+export default ContentModal;
\ No newline at end of file
diff --git a/web/src/components/table/tokens/TokensActions.jsx b/web/src/components/table/tokens/TokensActions.jsx
new file mode 100644
index 00000000..765069e1
--- /dev/null
+++ b/web/src/components/table/tokens/TokensActions.jsx
@@ -0,0 +1,118 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React, { useState } from 'react';
+import { Button, Space } from '@douyinfe/semi-ui';
+import { showError } from '../../../helpers';
+import CopyTokensModal from './modals/CopyTokensModal';
+import DeleteTokensModal from './modals/DeleteTokensModal';
+
+const TokensActions = ({
+ selectedKeys,
+ setEditingToken,
+ setShowEdit,
+ batchCopyTokens,
+ batchDeleteTokens,
+ copyText,
+ t,
+}) => {
+ // Modal states
+ const [showCopyModal, setShowCopyModal] = useState(false);
+ const [showDeleteModal, setShowDeleteModal] = useState(false);
+
+ // Handle copy selected tokens with options
+ const handleCopySelectedTokens = () => {
+ if (selectedKeys.length === 0) {
+ showError(t('请至少选择一个令牌！'));
+ return;
+ }
+ setShowCopyModal(true);
+ };
+
+ // Handle delete selected tokens with confirmation
+ const handleDeleteSelectedTokens = () => {
+ if (selectedKeys.length === 0) {
+ showError(t('请至少选择一个令牌！'));
+ return;
+ }
+ setShowDeleteModal(true);
+ };
+
+ // Handle delete confirmation
+ const handleConfirmDelete = () => {
+ batchDeleteTokens();
+ setShowDeleteModal(false);
+ };
+
+ return (
+ <>
+
+
+
+
+
+
+
+
+ setShowCopyModal(false)}
+ selectedKeys={selectedKeys}
+ copyText={copyText}
+ t={t}
+ />
+
+ setShowDeleteModal(false)}
+ onConfirm={handleConfirmDelete}
+ selectedKeys={selectedKeys}
+ t={t}
+ />
+
+ );
+};
+
+export default TokensActions;
\ No newline at end of file
diff --git a/web/src/components/table/tokens/TokensColumnDefs.js b/web/src/components/table/tokens/TokensColumnDefs.js
new file mode 100644
index 00000000..ffa5ff79
--- /dev/null
+++ b/web/src/components/table/tokens/TokensColumnDefs.js
@@ -0,0 +1,472 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import {
+ Button,
+ Dropdown,
+ Space,
+ SplitButtonGroup,
+ Tag,
+ AvatarGroup,
+ Avatar,
+ Tooltip,
+ Progress,
+ Switch,
+ Input,
+ Modal
+} from '@douyinfe/semi-ui';
+import {
+ timestamp2string,
+ renderGroup,
+ renderQuota,
+ getModelCategories,
+ showError
+} from '../../../helpers';
+import {
+ IconTreeTriangleDown,
+ IconCopy,
+ IconEyeOpened,
+ IconEyeClosed,
+} from '@douyinfe/semi-icons';
+
+// Render functions
+function renderTimestamp(timestamp) {
+ return <>{timestamp2string(timestamp)};
+}
+
+// Render status column with switch and progress bar
+const renderStatus = (text, record, manageToken, t) => {
+ const enabled = text === 1;
+ const handleToggle = (checked) => {
+ if (checked) {
+ manageToken(record.id, 'enable', record);
+ } else {
+ manageToken(record.id, 'disable', record);
+ }
+ };
+
+ let tagColor = 'black';
+ let tagText = t('未知状态');
+ if (enabled) {
+ tagColor = 'green';
+ tagText = t('已启用');
+ } else if (text === 2) {
+ tagColor = 'red';
+ tagText = t('已禁用');
+ } else if (text === 3) {
+ tagColor = 'yellow';
+ tagText = t('已过期');
+ } else if (text === 4) {
+ tagColor = 'grey';
+ tagText = t('已耗尽');
+ }
+
+ const used = parseInt(record.used_quota) || 0;
+ const remain = parseInt(record.remain_quota) || 0;
+ const total = used + remain;
+ const percent = total > 0 ? (remain / total) * 100 : 0;
+
+ const getProgressColor = (pct) => {
+ if (pct === 100) return 'var(--semi-color-success)';
+ if (pct <= 10) return 'var(--semi-color-danger)';
+ if (pct <= 30) return 'var(--semi-color-warning)';
+ return undefined;
+ };
+
+ const quotaSuffix = record.unlimited_quota ? (
+
+ );
+ },
+ },
+ {
+ title: '',
+ dataIndex: 'operate',
+ fixed: 'right',
+ render: (text, record, index) => renderOperations(
+ text,
+ record,
+ onOpenLink,
+ setEditingToken,
+ setShowEdit,
+ manageToken,
+ refresh,
+ t
+ ),
+ },
+ ];
+};
\ No newline at end of file
diff --git a/web/src/components/table/tokens/TokensDescription.jsx b/web/src/components/table/tokens/TokensDescription.jsx
new file mode 100644
index 00000000..3dcfebac
--- /dev/null
+++ b/web/src/components/table/tokens/TokensDescription.jsx
@@ -0,0 +1,44 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Typography } from '@douyinfe/semi-ui';
+import { Key } from 'lucide-react';
+import CompactModeToggle from '../../common/ui/CompactModeToggle';
+
+const { Text } = Typography;
+
+const TokensDescription = ({ compactMode, setCompactMode, t }) => {
+ return (
+
+
+
+ {t('令牌管理')}
+
+
+
+
+ );
+};
+
+export default TokensDescription;
\ No newline at end of file
diff --git a/web/src/components/table/tokens/TokensFilters.jsx b/web/src/components/table/tokens/TokensFilters.jsx
new file mode 100644
index 00000000..e8241a68
--- /dev/null
+++ b/web/src/components/table/tokens/TokensFilters.jsx
@@ -0,0 +1,106 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React, { useRef } from 'react';
+import { Form, Button } from '@douyinfe/semi-ui';
+import { IconSearch } from '@douyinfe/semi-icons';
+
+const TokensFilters = ({
+ formInitValues,
+ setFormApi,
+ searchTokens,
+ loading,
+ searching,
+ t,
+}) => {
+ // Handle form reset and immediate search
+ const formApiRef = useRef(null);
+
+ const handleReset = () => {
+ if (!formApiRef.current) return;
+ formApiRef.current.reset();
+ setTimeout(() => {
+ searchTokens();
+ }, 100);
+ };
+
+ return (
+
+ );
+};
+
+export default TokensFilters;
\ No newline at end of file
diff --git a/web/src/components/table/tokens/TokensTable.jsx b/web/src/components/table/tokens/TokensTable.jsx
new file mode 100644
index 00000000..15be1c63
--- /dev/null
+++ b/web/src/components/table/tokens/TokensTable.jsx
@@ -0,0 +1,120 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React, { useMemo } from 'react';
+import { Empty } from '@douyinfe/semi-ui';
+import CardTable from '../../common/ui/CardTable.js';
+import {
+ IllustrationNoResult,
+ IllustrationNoResultDark,
+} from '@douyinfe/semi-illustrations';
+import { getTokensColumns } from './TokensColumnDefs.js';
+
+const TokensTable = (tokensData) => {
+ const {
+ tokens,
+ loading,
+ activePage,
+ pageSize,
+ tokenCount,
+ compactMode,
+ handlePageChange,
+ handlePageSizeChange,
+ rowSelection,
+ handleRow,
+ showKeys,
+ setShowKeys,
+ copyText,
+ manageToken,
+ onOpenLink,
+ setEditingToken,
+ setShowEdit,
+ refresh,
+ t,
+ } = tokensData;
+
+ // Get all columns
+ const columns = useMemo(() => {
+ return getTokensColumns({
+ t,
+ showKeys,
+ setShowKeys,
+ copyText,
+ manageToken,
+ onOpenLink,
+ setEditingToken,
+ setShowEdit,
+ refresh,
+ });
+ }, [
+ t,
+ showKeys,
+ setShowKeys,
+ copyText,
+ manageToken,
+ onOpenLink,
+ setEditingToken,
+ setShowEdit,
+ refresh,
+ ]);
+
+ // Handle compact mode by removing fixed positioning
+ const tableColumns = useMemo(() => {
+ return compactMode ? columns.map(col => {
+ if (col.dataIndex === 'operate') {
+ const { fixed, ...rest } = col;
+ return rest;
+ }
+ return col;
+ }) : columns;
+ }, [compactMode, columns]);
+
+ return (
+ }
+ darkModeImage={}
+ description={t('搜索无结果')}
+ style={{ padding: 30 }}
+ />
+ }
+ className="rounded-xl overflow-hidden"
+ size="middle"
+ />
+ );
+};
+
+export default TokensTable;
\ No newline at end of file
diff --git a/web/src/components/table/tokens/index.jsx b/web/src/components/table/tokens/index.jsx
new file mode 100644
index 00000000..a955f13c
--- /dev/null
+++ b/web/src/components/table/tokens/index.jsx
@@ -0,0 +1,123 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import CardPro from '../../common/ui/CardPro';
+import TokensTable from './TokensTable.jsx';
+import TokensActions from './TokensActions.jsx';
+import TokensFilters from './TokensFilters.jsx';
+import TokensDescription from './TokensDescription.jsx';
+import EditTokenModal from './modals/EditTokenModal';
+import { useTokensData } from '../../../hooks/tokens/useTokensData';
+import { useIsMobile } from '../../../hooks/common/useIsMobile';
+import { createCardProPagination } from '../../../helpers/utils';
+
+const TokensPage = () => {
+ const tokensData = useTokensData();
+ const isMobile = useIsMobile();
+
+ const {
+ // Edit state
+ showEdit,
+ editingToken,
+ closeEdit,
+ refresh,
+
+ // Actions state
+ selectedKeys,
+ setEditingToken,
+ setShowEdit,
+ batchCopyTokens,
+ batchDeleteTokens,
+ copyText,
+
+ // Filters state
+ formInitValues,
+ setFormApi,
+ searchTokens,
+ loading,
+ searching,
+
+ // Description state
+ compactMode,
+ setCompactMode,
+
+ // Translation
+ t,
+ } = tokensData;
+
+ return (
+ <>
+
+
+
+ }
+ actionsArea={
+
+
+
+
+
+
+
+ }
+ paginationArea={createCardProPagination({
+ currentPage: tokensData.activePage,
+ pageSize: tokensData.pageSize,
+ total: tokensData.tokenCount,
+ onPageChange: tokensData.handlePageChange,
+ onPageSizeChange: tokensData.handlePageSizeChange,
+ isMobile: isMobile,
+ })}
+ t={t}
+ >
+
+
+
+ );
+};
+
+export default TokensPage;
\ No newline at end of file
diff --git a/web/src/components/table/tokens/modals/CopyTokensModal.jsx b/web/src/components/table/tokens/modals/CopyTokensModal.jsx
new file mode 100644
index 00000000..93ea3cfa
--- /dev/null
+++ b/web/src/components/table/tokens/modals/CopyTokensModal.jsx
@@ -0,0 +1,71 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Modal, Button, Space } from '@douyinfe/semi-ui';
+
+const CopyTokensModal = ({ visible, onCancel, selectedKeys, copyText, t }) => {
+ // Handle copy with name and key format
+ const handleCopyWithName = async () => {
+ let content = '';
+ for (let i = 0; i < selectedKeys.length; i++) {
+ content += selectedKeys[i].name + ' sk-' + selectedKeys[i].key + '\n';
+ }
+ await copyText(content);
+ onCancel();
+ };
+
+ // Handle copy with key only format
+ const handleCopyKeyOnly = async () => {
+ let content = '';
+ for (let i = 0; i < selectedKeys.length; i++) {
+ content += 'sk-' + selectedKeys[i].key + '\n';
+ }
+ await copyText(content);
+ onCancel();
+ };
+
+ return (
+
+
+
+
+ }
+ >
+ {t('请选择你的复制方式')}
+
+ );
+};
+
+export default CopyTokensModal;
\ No newline at end of file
diff --git a/web/src/components/table/tokens/modals/DeleteTokensModal.jsx b/web/src/components/table/tokens/modals/DeleteTokensModal.jsx
new file mode 100644
index 00000000..4f339ec3
--- /dev/null
+++ b/web/src/components/table/tokens/modals/DeleteTokensModal.jsx
@@ -0,0 +1,39 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Modal } from '@douyinfe/semi-ui';
+
+const DeleteTokensModal = ({ visible, onCancel, onConfirm, selectedKeys, t }) => {
+ return (
+
+
+
+ );
+};
+
+export default DeleteTokensModal;
\ No newline at end of file
diff --git a/web/src/pages/Token/EditToken.js b/web/src/components/table/tokens/modals/EditTokenModal.jsx
similarity index 94%
rename from web/src/pages/Token/EditToken.js
rename to web/src/components/table/tokens/modals/EditTokenModal.jsx
index 4eb9bcf4..d26701f4 100644
--- a/web/src/pages/Token/EditToken.js
+++ b/web/src/components/table/tokens/modals/EditTokenModal.jsx
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useContext, useRef } from 'react';
import {
API,
@@ -7,8 +26,9 @@ import {
renderGroupOption,
renderQuotaWithPrompt,
getModelCategories,
-} from '../../helpers';
-import { useIsMobile } from '../../hooks/useIsMobile.js';
+ modelSelectFilter,
+} from '../../../../helpers';
+import { useIsMobile } from '../../../../hooks/common/useIsMobile.js';
import {
Button,
SideSheet,
@@ -30,11 +50,11 @@ import {
IconKey,
} from '@douyinfe/semi-icons';
import { useTranslation } from 'react-i18next';
-import { StatusContext } from '../../context/Status';
+import { StatusContext } from '../../../../context/Status';
const { Text, Title } = Typography;
-const EditToken = (props) => {
+const EditTokenModal = (props) => {
const { t } = useTranslation();
const [statusState, statusDispatch] = useContext(StatusContext);
const [loading, setLoading] = useState(false);
@@ -494,7 +514,8 @@ const EditToken = (props) => {
multiple
optionList={models}
extraText={t('非必要，不建议启用模型限制')}
- filter
+ filter={modelSelectFilter}
+ autoClearSearchValue={false}
searchPosition='dropdown'
showClear
style={{ width: '100%' }}
@@ -522,4 +543,4 @@ const EditToken = (props) => {
);
};
-export default EditToken;
+export default EditTokenModal;
\ No newline at end of file
diff --git a/web/src/components/table/usage-logs/UsageLogsActions.jsx b/web/src/components/table/usage-logs/UsageLogsActions.jsx
new file mode 100644
index 00000000..72db01e4
--- /dev/null
+++ b/web/src/components/table/usage-logs/UsageLogsActions.jsx
@@ -0,0 +1,112 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React, { useState, useEffect, useRef } from 'react';
+import { Tag, Space, Skeleton } from '@douyinfe/semi-ui';
+import { renderQuota } from '../../../helpers';
+import CompactModeToggle from '../../common/ui/CompactModeToggle';
+
+const LogsActions = ({
+ stat,
+ loadingStat,
+ showStat,
+ compactMode,
+ setCompactMode,
+ t,
+}) => {
+ const [showSkeleton, setShowSkeleton] = useState(loadingStat);
+ const needSkeleton = !showStat || showSkeleton;
+ const loadingStartRef = useRef(Date.now());
+
+ useEffect(() => {
+ if (loadingStat) {
+ loadingStartRef.current = Date.now();
+ setShowSkeleton(true);
+ } else {
+ const elapsed = Date.now() - loadingStartRef.current;
+ const remaining = Math.max(0, 500 - elapsed);
+ if (remaining === 0) {
+ setShowSkeleton(false);
+ } else {
+ const timer = setTimeout(() => setShowSkeleton(false), remaining);
+ return () => clearTimeout(timer);
+ }
+ }
+ }, [loadingStat]);
+
+ // Skeleton placeholder layout (three tag-size blocks)
+ const placeholder = (
+
+
+
+
+
+ );
+
+ return (
+
: <>;
+ },
+ },
+ {
+ key: COLUMN_KEYS.DETAILS,
+ title: t('详情'),
+ dataIndex: 'content',
+ fixed: 'right',
+ render: (text, record, index) => {
+ let other = getLogOther(record.other);
+ if (other == null || record.type !== 2) {
+ return (
+
+ {text}
+
+ );
+ }
+ let content = other?.claude
+ ? renderClaudeModelPriceSimple(
+ other.model_ratio,
+ other.model_price,
+ other.group_ratio,
+ other?.user_group_ratio,
+ other.cache_tokens || 0,
+ other.cache_ratio || 1.0,
+ other.cache_creation_tokens || 0,
+ other.cache_creation_ratio || 1.0,
+ )
+ : renderModelPriceSimple(
+ other.model_ratio,
+ other.model_price,
+ other.group_ratio,
+ other?.user_group_ratio,
+ other.cache_tokens || 0,
+ other.cache_ratio || 1.0,
+ );
+ return (
+
+ {content}
+
+ );
+ },
+ },
+ ];
+};
\ No newline at end of file
diff --git a/web/src/components/table/usage-logs/UsageLogsFilters.jsx b/web/src/components/table/usage-logs/UsageLogsFilters.jsx
new file mode 100644
index 00000000..4ff33628
--- /dev/null
+++ b/web/src/components/table/usage-logs/UsageLogsFilters.jsx
@@ -0,0 +1,188 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Button, Form } from '@douyinfe/semi-ui';
+import { IconSearch } from '@douyinfe/semi-icons';
+
+const LogsFilters = ({
+ formInitValues,
+ setFormApi,
+ refresh,
+ setShowColumnSelector,
+ formApi,
+ setLogType,
+ loading,
+ isAdminUser,
+ t,
+}) => {
+ return (
+
+ );
+};
+
+export default LogsFilters;
\ No newline at end of file
diff --git a/web/src/components/table/usage-logs/UsageLogsTable.jsx b/web/src/components/table/usage-logs/UsageLogsTable.jsx
new file mode 100644
index 00000000..2739d3c4
--- /dev/null
+++ b/web/src/components/table/usage-logs/UsageLogsTable.jsx
@@ -0,0 +1,128 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React, { useMemo } from 'react';
+import { Empty, Descriptions } from '@douyinfe/semi-ui';
+import CardTable from '../../common/ui/CardTable.js';
+import {
+ IllustrationNoResult,
+ IllustrationNoResultDark,
+} from '@douyinfe/semi-illustrations';
+import { getLogsColumns } from './UsageLogsColumnDefs.js';
+
+const LogsTable = (logsData) => {
+ const {
+ logs,
+ expandData,
+ loading,
+ activePage,
+ pageSize,
+ logCount,
+ compactMode,
+ visibleColumns,
+ handlePageChange,
+ handlePageSizeChange,
+ copyText,
+ showUserInfoFunc,
+ hasExpandableRows,
+ isAdminUser,
+ t,
+ COLUMN_KEYS,
+ } = logsData;
+
+ // Get all columns
+ const allColumns = useMemo(() => {
+ return getLogsColumns({
+ t,
+ COLUMN_KEYS,
+ copyText,
+ showUserInfoFunc,
+ isAdminUser,
+ });
+ }, [
+ t,
+ COLUMN_KEYS,
+ copyText,
+ showUserInfoFunc,
+ isAdminUser,
+ ]);
+
+ // Filter columns based on visibility settings
+ const getVisibleColumns = () => {
+ return allColumns.filter((column) => visibleColumns[column.key]);
+ };
+
+ const visibleColumnsList = useMemo(() => {
+ return getVisibleColumns();
+ }, [visibleColumns, allColumns]);
+
+ const tableColumns = useMemo(() => {
+ return compactMode
+ ? visibleColumnsList.map(({ fixed, ...rest }) => rest)
+ : visibleColumnsList;
+ }, [compactMode, visibleColumnsList]);
+
+ const expandRowRender = (record, index) => {
+ return ;
+ };
+
+ return (
+
+ expandData[record.key] && expandData[record.key].length > 0,
+ })}
+ dataSource={logs}
+ rowKey='key'
+ loading={loading}
+ scroll={compactMode ? undefined : { x: 'max-content' }}
+ className='rounded-xl overflow-hidden'
+ size='middle'
+ empty={
+
+ }
+ darkModeImage={
+
+ }
+ description={t('搜索无结果')}
+ style={{ padding: 30 }}
+ />
+ }
+ pagination={{
+ currentPage: activePage,
+ pageSize: pageSize,
+ total: logCount,
+ pageSizeOptions: [10, 20, 50, 100],
+ showSizeChanger: true,
+ onPageSizeChange: (size) => {
+ handlePageSizeChange(size);
+ },
+ onPageChange: handlePageChange,
+ }}
+ hidePagination={true}
+ />
+ );
+};
+
+export default LogsTable;
\ No newline at end of file
diff --git a/web/src/components/table/usage-logs/index.jsx b/web/src/components/table/usage-logs/index.jsx
new file mode 100644
index 00000000..6f7aeafd
--- /dev/null
+++ b/web/src/components/table/usage-logs/index.jsx
@@ -0,0 +1,62 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import CardPro from '../../common/ui/CardPro.js';
+import LogsTable from './UsageLogsTable.jsx';
+import LogsActions from './UsageLogsActions.jsx';
+import LogsFilters from './UsageLogsFilters.jsx';
+import ColumnSelectorModal from './modals/ColumnSelectorModal.jsx';
+import UserInfoModal from './modals/UserInfoModal.jsx';
+import { useLogsData } from '../../../hooks/usage-logs/useUsageLogsData.js';
+import { useIsMobile } from '../../../hooks/common/useIsMobile.js';
+import { createCardProPagination } from '../../../helpers/utils';
+
+const LogsPage = () => {
+ const logsData = useLogsData();
+ const isMobile = useIsMobile();
+
+ return (
+ <>
+ {/* Modals */}
+
+
+
+ {/* Main Content */}
+ }
+ searchArea={}
+ paginationArea={createCardProPagination({
+ currentPage: logsData.activePage,
+ pageSize: logsData.pageSize,
+ total: logsData.logCount,
+ onPageChange: logsData.handlePageChange,
+ onPageSizeChange: logsData.handlePageSizeChange,
+ isMobile: isMobile,
+ })}
+ t={logsData.t}
+ >
+
+
+
+ );
+};
+
+export default LogsPage;
\ No newline at end of file
diff --git a/web/src/components/table/usage-logs/modals/ColumnSelectorModal.jsx b/web/src/components/table/usage-logs/modals/ColumnSelectorModal.jsx
new file mode 100644
index 00000000..262041fe
--- /dev/null
+++ b/web/src/components/table/usage-logs/modals/ColumnSelectorModal.jsx
@@ -0,0 +1,110 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Modal, Button, Checkbox } from '@douyinfe/semi-ui';
+import { getLogsColumns } from '../UsageLogsColumnDefs.js';
+
+const ColumnSelectorModal = ({
+ showColumnSelector,
+ setShowColumnSelector,
+ visibleColumns,
+ handleColumnVisibilityChange,
+ handleSelectAll,
+ initDefaultColumns,
+ COLUMN_KEYS,
+ isAdminUser,
+ copyText,
+ showUserInfoFunc,
+ t,
+}) => {
+ // Get all columns for display in selector
+ const allColumns = getLogsColumns({
+ t,
+ COLUMN_KEYS,
+ copyText,
+ showUserInfoFunc,
+ isAdminUser,
+ });
+
+ return (
+ setShowColumnSelector(false)}
+ footer={
+
+
+ );
+};
+
+export default ColumnSelectorModal;
\ No newline at end of file
diff --git a/web/src/components/table/usage-logs/modals/UserInfoModal.jsx b/web/src/components/table/usage-logs/modals/UserInfoModal.jsx
new file mode 100644
index 00000000..294f55ef
--- /dev/null
+++ b/web/src/components/table/usage-logs/modals/UserInfoModal.jsx
@@ -0,0 +1,160 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Modal, Badge } from '@douyinfe/semi-ui';
+import { renderQuota, renderNumber } from '../../../../helpers';
+
+const UserInfoModal = ({
+ showUserInfo,
+ setShowUserInfoModal,
+ userInfoData,
+ t,
+}) => {
+ const infoItemStyle = {
+ marginBottom: '16px'
+ };
+
+ const labelStyle = {
+ display: 'flex',
+ alignItems: 'center',
+ marginBottom: '2px',
+ fontSize: '12px',
+ color: 'var(--semi-color-text-2)',
+ gap: '6px'
+ };
+
+ const renderLabel = (text, type = 'tertiary') => (
+
+ )}
+
+ );
+};
+
+export default UserInfoModal;
\ No newline at end of file
diff --git a/web/src/components/table/users/UsersActions.jsx b/web/src/components/table/users/UsersActions.jsx
new file mode 100644
index 00000000..bf505baf
--- /dev/null
+++ b/web/src/components/table/users/UsersActions.jsx
@@ -0,0 +1,46 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Button } from '@douyinfe/semi-ui';
+
+const UsersActions = ({
+ setShowAddUser,
+ t
+}) => {
+
+ // Add new user
+ const handleAddUser = () => {
+ setShowAddUser(true);
+ };
+
+ return (
+
+
+
+ );
+};
+
+export default UsersActions;
\ No newline at end of file
diff --git a/web/src/components/table/users/UsersColumnDefs.js b/web/src/components/table/users/UsersColumnDefs.js
new file mode 100644
index 00000000..774554cb
--- /dev/null
+++ b/web/src/components/table/users/UsersColumnDefs.js
@@ -0,0 +1,313 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import {
+ Button,
+ Space,
+ Tag,
+ Tooltip,
+ Progress,
+ Switch,
+} from '@douyinfe/semi-ui';
+import { renderGroup, renderNumber, renderQuota } from '../../../helpers';
+
+/**
+ * Render user role
+ */
+const renderRole = (role, t) => {
+ switch (role) {
+ case 1:
+ return (
+
+ {t('普通用户')}
+
+ );
+ case 10:
+ return (
+
+ {t('管理员')}
+
+ );
+ case 100:
+ return (
+
+ {t('超级管理员')}
+
+ );
+ default:
+ return (
+
+ {t('未知身份')}
+
+ );
+ }
+};
+
+/**
+ * Render username with remark
+ */
+const renderUsername = (text, record) => {
+ const remark = record.remark;
+ if (!remark) {
+ return {text};
+ }
+ const maxLen = 10;
+ const displayRemark = remark.length > maxLen ? remark.slice(0, maxLen) + '…' : remark;
+ return (
+
+ {text}
+
+
+
;
+ },
+ },
+ {
+ title: t('状态'),
+ dataIndex: 'info',
+ render: (text, record, index) => renderStatistics(text, record, showEnableDisableModal, t),
+ },
+ {
+ title: t('邀请信息'),
+ dataIndex: 'invite',
+ render: (text, record, index) => renderInviteInfo(text, record, t),
+ },
+ {
+ title: '',
+ dataIndex: 'operate',
+ fixed: 'right',
+ width: 200,
+ render: (text, record, index) => renderOperations(text, record, {
+ setEditingUser,
+ setShowEditUser,
+ showPromoteModal,
+ showDemoteModal,
+ showEnableDisableModal,
+ showDeleteModal,
+ t
+ }),
+ },
+ ];
+};
\ No newline at end of file
diff --git a/web/src/components/table/users/UsersDescription.jsx b/web/src/components/table/users/UsersDescription.jsx
new file mode 100644
index 00000000..2ab1c696
--- /dev/null
+++ b/web/src/components/table/users/UsersDescription.jsx
@@ -0,0 +1,43 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Typography } from '@douyinfe/semi-ui';
+import { IconUserAdd } from '@douyinfe/semi-icons';
+import CompactModeToggle from '../../common/ui/CompactModeToggle';
+
+const { Text } = Typography;
+
+const UsersDescription = ({ compactMode, setCompactMode, t }) => {
+ return (
+
+
+
+ {t('用户管理')}
+
+
+
+ );
+};
+
+export default UsersDescription;
\ No newline at end of file
diff --git a/web/src/components/table/users/UsersFilters.jsx b/web/src/components/table/users/UsersFilters.jsx
new file mode 100644
index 00000000..a2fcaa35
--- /dev/null
+++ b/web/src/components/table/users/UsersFilters.jsx
@@ -0,0 +1,116 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React, { useRef } from 'react';
+import { Form, Button } from '@douyinfe/semi-ui';
+import { IconSearch } from '@douyinfe/semi-icons';
+
+const UsersFilters = ({
+ formInitValues,
+ setFormApi,
+ searchUsers,
+ loadUsers,
+ activePage,
+ pageSize,
+ groupOptions,
+ loading,
+ searching,
+ t
+}) => {
+
+ const formApiRef = useRef(null);
+
+ const handleReset = () => {
+ if (!formApiRef.current) return;
+ formApiRef.current.reset();
+ setTimeout(() => {
+ loadUsers(1, pageSize);
+ }, 100);
+ };
+
+ return (
+
+ );
+};
+
+export default UsersFilters;
\ No newline at end of file
diff --git a/web/src/components/table/users/UsersTable.jsx b/web/src/components/table/users/UsersTable.jsx
new file mode 100644
index 00000000..cd93bf95
--- /dev/null
+++ b/web/src/components/table/users/UsersTable.jsx
@@ -0,0 +1,195 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React, { useMemo, useState } from 'react';
+import { Empty } from '@douyinfe/semi-ui';
+import CardTable from '../../common/ui/CardTable.js';
+import {
+ IllustrationNoResult,
+ IllustrationNoResultDark
+} from '@douyinfe/semi-illustrations';
+import { getUsersColumns } from './UsersColumnDefs';
+import PromoteUserModal from './modals/PromoteUserModal';
+import DemoteUserModal from './modals/DemoteUserModal';
+import EnableDisableUserModal from './modals/EnableDisableUserModal';
+import DeleteUserModal from './modals/DeleteUserModal';
+
+const UsersTable = (usersData) => {
+ const {
+ users,
+ loading,
+ activePage,
+ pageSize,
+ userCount,
+ compactMode,
+ handlePageChange,
+ handlePageSizeChange,
+ handleRow,
+ setEditingUser,
+ setShowEditUser,
+ manageUser,
+ refresh,
+ t,
+ } = usersData;
+
+ // Modal states
+ const [showPromoteModal, setShowPromoteModal] = useState(false);
+ const [showDemoteModal, setShowDemoteModal] = useState(false);
+ const [showEnableDisableModal, setShowEnableDisableModal] = useState(false);
+ const [showDeleteModal, setShowDeleteModal] = useState(false);
+ const [modalUser, setModalUser] = useState(null);
+ const [enableDisableAction, setEnableDisableAction] = useState('');
+
+ // Modal handlers
+ const showPromoteUserModal = (user) => {
+ setModalUser(user);
+ setShowPromoteModal(true);
+ };
+
+ const showDemoteUserModal = (user) => {
+ setModalUser(user);
+ setShowDemoteModal(true);
+ };
+
+ const showEnableDisableUserModal = (user, action) => {
+ setModalUser(user);
+ setEnableDisableAction(action);
+ setShowEnableDisableModal(true);
+ };
+
+ const showDeleteUserModal = (user) => {
+ setModalUser(user);
+ setShowDeleteModal(true);
+ };
+
+ // Modal confirm handlers
+ const handlePromoteConfirm = () => {
+ manageUser(modalUser.id, 'promote', modalUser);
+ setShowPromoteModal(false);
+ };
+
+ const handleDemoteConfirm = () => {
+ manageUser(modalUser.id, 'demote', modalUser);
+ setShowDemoteModal(false);
+ };
+
+ const handleEnableDisableConfirm = () => {
+ manageUser(modalUser.id, enableDisableAction, modalUser);
+ setShowEnableDisableModal(false);
+ };
+
+ // Get all columns
+ const columns = useMemo(() => {
+ return getUsersColumns({
+ t,
+ setEditingUser,
+ setShowEditUser,
+ showPromoteModal: showPromoteUserModal,
+ showDemoteModal: showDemoteUserModal,
+ showEnableDisableModal: showEnableDisableUserModal,
+ showDeleteModal: showDeleteUserModal
+ });
+ }, [
+ t,
+ setEditingUser,
+ setShowEditUser,
+ ]);
+
+ // Handle compact mode by removing fixed positioning
+ const tableColumns = useMemo(() => {
+ return compactMode ? columns.map(col => {
+ if (col.dataIndex === 'operate') {
+ const { fixed, ...rest } = col;
+ return rest;
+ }
+ return col;
+ }) : columns;
+ }, [compactMode, columns]);
+
+ return (
+ <>
+ }
+ darkModeImage={}
+ description={t('搜索无结果')}
+ style={{ padding: 30 }}
+ />
+ }
+ className="overflow-hidden"
+ size="middle"
+ />
+
+ {/* Modal components */}
+ setShowPromoteModal(false)}
+ onConfirm={handlePromoteConfirm}
+ user={modalUser}
+ t={t}
+ />
+
+ setShowDemoteModal(false)}
+ onConfirm={handleDemoteConfirm}
+ user={modalUser}
+ t={t}
+ />
+
+ setShowEnableDisableModal(false)}
+ onConfirm={handleEnableDisableConfirm}
+ user={modalUser}
+ action={enableDisableAction}
+ t={t}
+ />
+
+ setShowDeleteModal(false)}
+ user={modalUser}
+ users={users}
+ activePage={activePage}
+ refresh={refresh}
+ manageUser={manageUser}
+ t={t}
+ />
+
+ );
+};
+
+export default UsersTable;
\ No newline at end of file
diff --git a/web/src/components/table/users/index.jsx b/web/src/components/table/users/index.jsx
new file mode 100644
index 00000000..adc9a570
--- /dev/null
+++ b/web/src/components/table/users/index.jsx
@@ -0,0 +1,126 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import CardPro from '../../common/ui/CardPro';
+import UsersTable from './UsersTable.jsx';
+import UsersActions from './UsersActions.jsx';
+import UsersFilters from './UsersFilters.jsx';
+import UsersDescription from './UsersDescription.jsx';
+import AddUserModal from './modals/AddUserModal.jsx';
+import EditUserModal from './modals/EditUserModal.jsx';
+import { useUsersData } from '../../../hooks/users/useUsersData';
+import { useIsMobile } from '../../../hooks/common/useIsMobile';
+import { createCardProPagination } from '../../../helpers/utils';
+
+const UsersPage = () => {
+ const usersData = useUsersData();
+ const isMobile = useIsMobile();
+
+ const {
+ // Modal state
+ showAddUser,
+ showEditUser,
+ editingUser,
+ setShowAddUser,
+ closeAddUser,
+ closeEditUser,
+ refresh,
+
+ // Form state
+ formInitValues,
+ setFormApi,
+ searchUsers,
+ loadUsers,
+ activePage,
+ pageSize,
+ groupOptions,
+ loading,
+ searching,
+
+ // Description state
+ compactMode,
+ setCompactMode,
+
+ // Translation
+ t,
+ } = usersData;
+
+ return (
+ <>
+
+
+
+
+
+ }
+ actionsArea={
+
+
+
+
+
+ }
+ paginationArea={createCardProPagination({
+ currentPage: usersData.activePage,
+ pageSize: usersData.pageSize,
+ total: usersData.userCount,
+ onPageChange: usersData.handlePageChange,
+ onPageSizeChange: usersData.handlePageSizeChange,
+ isMobile: isMobile,
+ })}
+ t={t}
+ >
+
+
+
+ );
+};
+
+export default UsersPage;
\ No newline at end of file
diff --git a/web/src/pages/User/AddUser.js b/web/src/components/table/users/modals/AddUserModal.jsx
similarity index 83%
rename from web/src/pages/User/AddUser.js
rename to web/src/components/table/users/modals/AddUserModal.jsx
index fa4c97e6..caf33a64 100644
--- a/web/src/pages/User/AddUser.js
+++ b/web/src/components/table/users/modals/AddUserModal.jsx
@@ -1,6 +1,25 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useState, useRef } from 'react';
-import { API, showError, showSuccess } from '../../helpers';
-import { useIsMobile } from '../../hooks/useIsMobile.js';
+import { API, showError, showSuccess } from '../../../../helpers';
+import { useIsMobile } from '../../../../hooks/common/useIsMobile.js';
import {
Button,
SideSheet,
@@ -23,7 +42,7 @@ import { useTranslation } from 'react-i18next';
const { Text, Title } = Typography;
-const AddUser = (props) => {
+const AddUserModal = (props) => {
const { t } = useTranslation();
const formApiRef = useRef(null);
const [loading, setLoading] = useState(false);
@@ -164,4 +183,4 @@ const AddUser = (props) => {
);
};
-export default AddUser;
+export default AddUserModal;
\ No newline at end of file
diff --git a/web/src/components/table/users/modals/DeleteUserModal.jsx b/web/src/components/table/users/modals/DeleteUserModal.jsx
new file mode 100644
index 00000000..aa4e0539
--- /dev/null
+++ b/web/src/components/table/users/modals/DeleteUserModal.jsx
@@ -0,0 +1,58 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Modal } from '@douyinfe/semi-ui';
+
+const DeleteUserModal = ({
+ visible,
+ onCancel,
+ onConfirm,
+ user,
+ users,
+ activePage,
+ refresh,
+ manageUser,
+ t
+}) => {
+ const handleConfirm = async () => {
+ await manageUser(user.id, 'delete', user);
+ await refresh();
+ setTimeout(() => {
+ if (users.length === 0 && activePage > 1) {
+ refresh(activePage - 1);
+ }
+ }, 100);
+ onCancel(); // Close modal after success
+ };
+
+ return (
+
+ {t('相当于删除用户，此修改将不可逆')}
+
+ );
+};
+
+export default DeleteUserModal;
\ No newline at end of file
diff --git a/web/src/components/table/users/modals/DemoteUserModal.jsx b/web/src/components/table/users/modals/DemoteUserModal.jsx
new file mode 100644
index 00000000..e9bebc50
--- /dev/null
+++ b/web/src/components/table/users/modals/DemoteUserModal.jsx
@@ -0,0 +1,37 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Modal } from '@douyinfe/semi-ui';
+
+const DemoteUserModal = ({ visible, onCancel, onConfirm, user, t }) => {
+ return (
+
+ {t('此操作将降低用户的权限级别')}
+
+ );
+};
+
+export default DemoteUserModal;
\ No newline at end of file
diff --git a/web/src/pages/User/EditUser.js b/web/src/components/table/users/modals/EditUserModal.jsx
similarity index 92%
rename from web/src/pages/User/EditUser.js
rename to web/src/components/table/users/modals/EditUserModal.jsx
index bfccf37b..a075f14b 100644
--- a/web/src/pages/User/EditUser.js
+++ b/web/src/components/table/users/modals/EditUserModal.jsx
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import { useTranslation } from 'react-i18next';
import {
@@ -6,8 +25,8 @@ import {
showSuccess,
renderQuota,
renderQuotaWithPrompt,
-} from '../../helpers';
-import { useIsMobile } from '../../hooks/useIsMobile.js';
+} from '../../../../helpers';
+import { useIsMobile } from '../../../../hooks/common/useIsMobile.js';
import {
Button,
Modal,
@@ -35,7 +54,7 @@ import {
const { Text, Title } = Typography;
-const EditUser = (props) => {
+const EditUserModal = (props) => {
const { t } = useTranslation();
const userId = props.editingUser.id;
const [loading, setLoading] = useState(true);
@@ -348,4 +367,4 @@ const EditUser = (props) => {
);
};
-export default EditUser;
+export default EditUserModal;
\ No newline at end of file
diff --git a/web/src/components/table/users/modals/EnableDisableUserModal.jsx b/web/src/components/table/users/modals/EnableDisableUserModal.jsx
new file mode 100644
index 00000000..c1c383ec
--- /dev/null
+++ b/web/src/components/table/users/modals/EnableDisableUserModal.jsx
@@ -0,0 +1,46 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Modal } from '@douyinfe/semi-ui';
+
+const EnableDisableUserModal = ({
+ visible,
+ onCancel,
+ onConfirm,
+ user,
+ action,
+ t
+}) => {
+ const isDisable = action === 'disable';
+
+ return (
+
+ {isDisable ? t('此操作将禁用用户账户') : t('此操作将启用用户账户')}
+
+ );
+};
+
+export default EnableDisableUserModal;
\ No newline at end of file
diff --git a/web/src/components/table/users/modals/PromoteUserModal.jsx b/web/src/components/table/users/modals/PromoteUserModal.jsx
new file mode 100644
index 00000000..da2a1c37
--- /dev/null
+++ b/web/src/components/table/users/modals/PromoteUserModal.jsx
@@ -0,0 +1,37 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Modal } from '@douyinfe/semi-ui';
+
+const PromoteUserModal = ({ visible, onCancel, onConfirm, user, t }) => {
+ return (
+
+ {t('此操作将提升用户的权限级别')}
+
+ );
+};
+
+export default PromoteUserModal;
\ No newline at end of file
diff --git a/web/src/constants/channel.constants.js b/web/src/constants/channel.constants.js
index b145ea11..c2468ec7 100644
--- a/web/src/constants/channel.constants.js
+++ b/web/src/constants/channel.constants.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
export const CHANNEL_OPTIONS = [
{ value: 1, color: 'green', label: 'OpenAI' },
{
diff --git a/web/src/constants/common.constant.js b/web/src/constants/common.constant.js
index 6556ffef..de0d1d6f 100644
--- a/web/src/constants/common.constant.js
+++ b/web/src/constants/common.constant.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
export const ITEMS_PER_PAGE = 10; // this value must keep same as the one defined in backend!
export const DEFAULT_ENDPOINT = '/api/ratio_config';
diff --git a/web/src/constants/dashboard.constants.js b/web/src/constants/dashboard.constants.js
new file mode 100644
index 00000000..332687e5
--- /dev/null
+++ b/web/src/constants/dashboard.constants.js
@@ -0,0 +1,149 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+// ========== UI 配置常量 ==========
+export const CHART_CONFIG = { mode: 'desktop-browser' };
+
+export const CARD_PROPS = {
+ shadows: 'always',
+ bordered: false,
+ headerLine: true
+};
+
+export const FORM_FIELD_PROPS = {
+ className: "w-full mb-2 !rounded-lg",
+ size: 'large'
+};
+
+export const ICON_BUTTON_CLASS = "text-white hover:bg-opacity-80 !rounded-full";
+export const FLEX_CENTER_GAP2 = "flex items-center gap-2";
+
+export const ILLUSTRATION_SIZE = { width: 96, height: 96 };
+
+// ========== 时间相关常量 ==========
+export const TIME_OPTIONS = [
+ { label: '小时', value: 'hour' },
+ { label: '天', value: 'day' },
+ { label: '周', value: 'week' },
+];
+
+export const DEFAULT_TIME_INTERVALS = {
+ hour: { seconds: 3600, minutes: 60 },
+ day: { seconds: 86400, minutes: 1440 },
+ week: { seconds: 604800, minutes: 10080 }
+};
+
+// ========== 默认时间设置 ==========
+export const DEFAULT_TIME_RANGE = {
+ HOUR: 'hour',
+ DAY: 'day',
+ WEEK: 'week'
+};
+
+// ========== 图表默认配置 ==========
+export const DEFAULT_CHART_SPECS = {
+ PIE: {
+ type: 'pie',
+ outerRadius: 0.8,
+ innerRadius: 0.5,
+ padAngle: 0.6,
+ valueField: 'value',
+ categoryField: 'type',
+ pie: {
+ style: {
+ cornerRadius: 10,
+ },
+ state: {
+ hover: {
+ outerRadius: 0.85,
+ stroke: '#000',
+ lineWidth: 1,
+ },
+ selected: {
+ outerRadius: 0.85,
+ stroke: '#000',
+ lineWidth: 1,
+ },
+ },
+ },
+ legends: {
+ visible: true,
+ orient: 'left',
+ },
+ label: {
+ visible: true,
+ },
+ },
+
+ BAR: {
+ type: 'bar',
+ stack: true,
+ legends: {
+ visible: true,
+ selectMode: 'single',
+ },
+ bar: {
+ state: {
+ hover: {
+ stroke: '#000',
+ lineWidth: 1,
+ },
+ },
+ },
+ },
+
+ LINE: {
+ type: 'line',
+ legends: {
+ visible: true,
+ selectMode: 'single',
+ },
+ }
+};
+
+// ========== 公告图例数据 ==========
+export const ANNOUNCEMENT_LEGEND_DATA = [
+ { color: 'grey', label: '默认', type: 'default' },
+ { color: 'blue', label: '进行中', type: 'ongoing' },
+ { color: 'green', label: '成功', type: 'success' },
+ { color: 'orange', label: '警告', type: 'warning' },
+ { color: 'red', label: '异常', type: 'error' }
+];
+
+// ========== Uptime 状态映射 ==========
+export const UPTIME_STATUS_MAP = {
+ 1: { color: '#10b981', label: '正常', text: '可用率' }, // UP
+ 0: { color: '#ef4444', label: '异常', text: '有异常' }, // DOWN
+ 2: { color: '#f59e0b', label: '高延迟', text: '高延迟' }, // PENDING
+ 3: { color: '#3b82f6', label: '维护中', text: '维护中' } // MAINTENANCE
+};
+
+// ========== 本地存储键名 ==========
+export const STORAGE_KEYS = {
+ DATA_EXPORT_DEFAULT_TIME: 'data_export_default_time',
+ MJ_NOTIFY_ENABLED: 'mj_notify_enabled'
+};
+
+// ========== 默认值 ==========
+export const DEFAULTS = {
+ PAGE_SIZE: 20,
+ CHART_HEIGHT: 96,
+ MODEL_TABLE_PAGE_SIZE: 10,
+ MAX_TREND_POINTS: 7
+};
\ No newline at end of file
diff --git a/web/src/constants/index.js b/web/src/constants/index.js
index f92e2b19..623885d4 100644
--- a/web/src/constants/index.js
+++ b/web/src/constants/index.js
@@ -1,5 +1,26 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
export * from './channel.constants';
export * from './user.constants';
export * from './toast.constants';
export * from './common.constant';
+export * from './dashboard.constants';
export * from './playground.constants';
+export * from './redemption.constants';
diff --git a/web/src/constants/playground.constants.js b/web/src/constants/playground.constants.js
index c5eb47fa..ed6d37c8 100644
--- a/web/src/constants/playground.constants.js
+++ b/web/src/constants/playground.constants.js
@@ -1,4 +1,22 @@
-// ========== 消息相关常量 ==========
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
export const MESSAGE_STATUS = {
LOADING: 'loading',
INCOMPLETE: 'incomplete',
diff --git a/web/src/constants/redemption.constants.js b/web/src/constants/redemption.constants.js
new file mode 100644
index 00000000..3149df0c
--- /dev/null
+++ b/web/src/constants/redemption.constants.js
@@ -0,0 +1,47 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+export const REDEMPTION_STATUS = {
+ UNUSED: 1, // Unused
+ DISABLED: 2, // Disabled
+ USED: 3, // Used
+};
+
+// Redemption code status display mapping
+export const REDEMPTION_STATUS_MAP = {
+ [REDEMPTION_STATUS.UNUSED]: {
+ color: 'green',
+ text: '未使用'
+ },
+ [REDEMPTION_STATUS.DISABLED]: {
+ color: 'red',
+ text: '已禁用'
+ },
+ [REDEMPTION_STATUS.USED]: {
+ color: 'grey',
+ text: '已使用'
+ }
+};
+
+// Action type constants
+export const REDEMPTION_ACTIONS = {
+ DELETE: 'delete',
+ ENABLE: 'enable',
+ DISABLE: 'disable'
+};
\ No newline at end of file
diff --git a/web/src/constants/toast.constants.js b/web/src/constants/toast.constants.js
index f8853df6..901caa49 100644
--- a/web/src/constants/toast.constants.js
+++ b/web/src/constants/toast.constants.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
export const toastConstants = {
SUCCESS_TIMEOUT: 1500,
INFO_TIMEOUT: 3000,
diff --git a/web/src/constants/user.constants.js b/web/src/constants/user.constants.js
index cde70df7..05d3e1fa 100644
--- a/web/src/constants/user.constants.js
+++ b/web/src/constants/user.constants.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
export const userConstants = {
REGISTER_REQUEST: 'USERS_REGISTER_REQUEST',
REGISTER_SUCCESS: 'USERS_REGISTER_SUCCESS',
diff --git a/web/src/context/Status/index.js b/web/src/context/Status/index.js
index 5a5319ed..baae8a17 100644
--- a/web/src/context/Status/index.js
+++ b/web/src/context/Status/index.js
@@ -1,4 +1,21 @@
-// contexts/User/index.jsx
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
import React from 'react';
import { initialState, reducer } from './reducer';
diff --git a/web/src/context/Status/reducer.js b/web/src/context/Status/reducer.js
index ec9ac6ae..457b5f1d 100644
--- a/web/src/context/Status/reducer.js
+++ b/web/src/context/Status/reducer.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
export const reducer = (state, action) => {
switch (action.type) {
case 'set':
diff --git a/web/src/context/Theme/index.js b/web/src/context/Theme/index.js
index 76549886..04e51042 100644
--- a/web/src/context/Theme/index.js
+++ b/web/src/context/Theme/index.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import { createContext, useCallback, useContext, useState } from 'react';
const ThemeContext = createContext(null);
diff --git a/web/src/context/User/index.js b/web/src/context/User/index.js
index 033b3613..a57aab1b 100644
--- a/web/src/context/User/index.js
+++ b/web/src/context/User/index.js
@@ -1,4 +1,21 @@
-// contexts/User/index.jsx
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
import React from 'react';
import { reducer, initialState } from './reducer';
diff --git a/web/src/context/User/reducer.js b/web/src/context/User/reducer.js
index d44cffcc..80275e1f 100644
--- a/web/src/context/User/reducer.js
+++ b/web/src/context/User/reducer.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
export const reducer = (state, action) => {
switch (action.type) {
case 'login':
diff --git a/web/src/helpers/api.js b/web/src/helpers/api.js
index cad1dd13..55228fd8 100644
--- a/web/src/helpers/api.js
+++ b/web/src/helpers/api.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import { getUserIdFromLocalStorage, showError, formatMessageForAPI, isValidMessage } from './utils';
import axios from 'axios';
import { MESSAGE_ROLES } from '../constants/playground.constants';
diff --git a/web/src/helpers/auth.js b/web/src/helpers/auth.js
index cb694ccf..d182ccd6 100644
--- a/web/src/helpers/auth.js
+++ b/web/src/helpers/auth.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
import { Navigate } from 'react-router-dom';
import { history } from './history';
diff --git a/web/src/helpers/boolean.js b/web/src/helpers/boolean.js
index 692196e0..992e163b 100644
--- a/web/src/helpers/boolean.js
+++ b/web/src/helpers/boolean.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
export const toBoolean = (value) => {
// 兼容字符串、数字以及布尔原生类型
if (typeof value === 'boolean') return value;
diff --git a/web/src/helpers/dashboard.js b/web/src/helpers/dashboard.js
new file mode 100644
index 00000000..374f1ea6
--- /dev/null
+++ b/web/src/helpers/dashboard.js
@@ -0,0 +1,314 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import { Progress, Divider, Empty } from '@douyinfe/semi-ui';
+import { IllustrationConstruction, IllustrationConstructionDark } from '@douyinfe/semi-illustrations';
+import { timestamp2string, timestamp2string1, copy, showSuccess } from './utils';
+import { STORAGE_KEYS, DEFAULT_TIME_INTERVALS, DEFAULTS, ILLUSTRATION_SIZE } from '../constants/dashboard.constants';
+
+// ========== 时间相关工具函数 ==========
+export const getDefaultTime = () => {
+ return localStorage.getItem(STORAGE_KEYS.DATA_EXPORT_DEFAULT_TIME) || 'hour';
+};
+
+export const getTimeInterval = (timeType, isSeconds = false) => {
+ const intervals = DEFAULT_TIME_INTERVALS[timeType] || DEFAULT_TIME_INTERVALS.hour;
+ return isSeconds ? intervals.seconds : intervals.minutes;
+};
+
+export const getInitialTimestamp = () => {
+ const defaultTime = getDefaultTime();
+ const now = new Date().getTime() / 1000;
+
+ switch (defaultTime) {
+ case 'hour':
+ return timestamp2string(now - 86400);
+ case 'week':
+ return timestamp2string(now - 86400 * 30);
+ default:
+ return timestamp2string(now - 86400 * 7);
+ }
+};
+
+// ========== 数据处理工具函数 ==========
+export const updateMapValue = (map, key, value) => {
+ if (!map.has(key)) {
+ map.set(key, 0);
+ }
+ map.set(key, map.get(key) + value);
+};
+
+export const initializeMaps = (key, ...maps) => {
+ maps.forEach(map => {
+ if (!map.has(key)) {
+ map.set(key, 0);
+ }
+ });
+};
+
+// ========== 图表相关工具函数 ==========
+export const updateChartSpec = (setterFunc, newData, subtitle, newColors, dataId) => {
+ setterFunc(prev => ({
+ ...prev,
+ data: [{ id: dataId, values: newData }],
+ title: {
+ ...prev.title,
+ subtext: subtitle,
+ },
+ color: {
+ specified: newColors,
+ },
+ }));
+};
+
+export const getTrendSpec = (data, color) => ({
+ type: 'line',
+ data: [{ id: 'trend', values: data.map((val, idx) => ({ x: idx, y: val })) }],
+ xField: 'x',
+ yField: 'y',
+ height: 40,
+ width: 100,
+ axes: [
+ {
+ orient: 'bottom',
+ visible: false
+ },
+ {
+ orient: 'left',
+ visible: false
+ }
+ ],
+ padding: 0,
+ autoFit: false,
+ legends: { visible: false },
+ tooltip: { visible: false },
+ crosshair: { visible: false },
+ line: {
+ style: {
+ stroke: color,
+ lineWidth: 2
+ }
+ },
+ point: {
+ visible: false
+ },
+ background: {
+ fill: 'transparent'
+ }
+});
+
+// ========== UI 工具函数 ==========
+export const createSectionTitle = (Icon, text) => (
+
);
diff --git a/web/src/pages/Chat/index.js b/web/src/pages/Chat/index.js
index 4b354752..0b8c3cab 100644
--- a/web/src/pages/Chat/index.js
+++ b/web/src/pages/Chat/index.js
@@ -1,5 +1,24 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
-import { useTokenKeys } from '../../hooks/useTokenKeys';
+import { useTokenKeys } from '../../hooks/chat/useTokenKeys';
import { Spin } from '@douyinfe/semi-ui';
import { useParams } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
@@ -42,7 +61,7 @@ const ChatPage = () => {
allow='camera;microphone'
/>
) : (
-
);
diff --git a/web/src/pages/Dashboard/index.js b/web/src/pages/Dashboard/index.js
new file mode 100644
index 00000000..f7f5afdd
--- /dev/null
+++ b/web/src/pages/Dashboard/index.js
@@ -0,0 +1,29 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
+import React from 'react';
+import Dashboard from '../../components/dashboard';
+
+const Detail = () => (
+
- );
-};
-
-export default Detail;
diff --git a/web/src/pages/Home/index.js b/web/src/pages/Home/index.js
index 0cf8dea1..3d8ac68f 100644
--- a/web/src/pages/Home/index.js
+++ b/web/src/pages/Home/index.js
@@ -1,7 +1,26 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useContext, useEffect, useState } from 'react';
import { Button, Typography, Tag, Input, ScrollList, ScrollItem } from '@douyinfe/semi-ui';
import { API, showError, copy, showSuccess } from '../../helpers';
-import { useIsMobile } from '../../hooks/useIsMobile.js';
+import { useIsMobile } from '../../hooks/common/useIsMobile.js';
import { API_ENDPOINTS } from '../../constants/common.constant';
import { StatusContext } from '../../context/Status';
import { marked } from 'marked';
@@ -274,7 +293,7 @@ const Home = () => {
className="w-full h-screen border-none"
/>
) : (
-
+
)}
)}
diff --git a/web/src/pages/Log/index.js b/web/src/pages/Log/index.js
index 74c570bb..5e52459b 100644
--- a/web/src/pages/Log/index.js
+++ b/web/src/pages/Log/index.js
@@ -1,9 +1,28 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
-import LogsTable from '../../components/table/LogsTable';
+import UsageLogsTable from '../../components/table/usage-logs';
const Token = () => (
-
-
+
+
);
diff --git a/web/src/pages/Midjourney/index.js b/web/src/pages/Midjourney/index.js
index 71d4c3a8..2b168294 100644
--- a/web/src/pages/Midjourney/index.js
+++ b/web/src/pages/Midjourney/index.js
@@ -1,8 +1,27 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
-import MjLogsTable from '../../components/table/MjLogsTable';
+import MjLogsTable from '../../components/table/mj-logs';
const Midjourney = () => (
-
+
);
diff --git a/web/src/pages/NotFound/index.js b/web/src/pages/NotFound/index.js
index c64b5a40..be236822 100644
--- a/web/src/pages/NotFound/index.js
+++ b/web/src/pages/NotFound/index.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
import { Empty } from '@douyinfe/semi-ui';
import { IllustrationNotFound, IllustrationNotFoundDark } from '@douyinfe/semi-illustrations';
@@ -6,7 +25,7 @@ import { useTranslation } from 'react-i18next';
const NotFound = () => {
const { t } = useTranslation();
return (
-
+
}
darkModeImage={}
diff --git a/web/src/pages/Playground/index.js b/web/src/pages/Playground/index.js
index 9a41bc18..f31cefb7 100644
--- a/web/src/pages/Playground/index.js
+++ b/web/src/pages/Playground/index.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useContext, useEffect, useCallback, useRef } from 'react';
import { useSearchParams } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
@@ -5,15 +24,15 @@ import { Layout, Toast, Modal } from '@douyinfe/semi-ui';
// Context
import { UserContext } from '../../context/User/index.js';
-import { useIsMobile } from '../../hooks/useIsMobile.js';
+import { useIsMobile } from '../../hooks/common/useIsMobile.js';
// hooks
-import { usePlaygroundState } from '../../hooks/usePlaygroundState.js';
-import { useMessageActions } from '../../hooks/useMessageActions.js';
-import { useApiRequest } from '../../hooks/useApiRequest.js';
-import { useSyncMessageAndCustomBody } from '../../hooks/useSyncMessageAndCustomBody.js';
-import { useMessageEdit } from '../../hooks/useMessageEdit.js';
-import { useDataLoader } from '../../hooks/useDataLoader.js';
+import { usePlaygroundState } from '../../hooks/playground/usePlaygroundState.js';
+import { useMessageActions } from '../../hooks/playground/useMessageActions.js';
+import { useApiRequest } from '../../hooks/playground/useApiRequest.js';
+import { useSyncMessageAndCustomBody } from '../../hooks/playground/useSyncMessageAndCustomBody.js';
+import { useMessageEdit } from '../../hooks/playground/useMessageEdit.js';
+import { useDataLoader } from '../../hooks/playground/useDataLoader.js';
// Constants and utils
import {
@@ -352,28 +371,18 @@ const Playground = () => {
}, [setMessage, saveMessagesImmediately]);
return (
-
);
diff --git a/web/src/pages/Redemption/index.js b/web/src/pages/Redemption/index.js
index b55f8fdc..c77d0677 100644
--- a/web/src/pages/Redemption/index.js
+++ b/web/src/pages/Redemption/index.js
@@ -1,9 +1,28 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
-import RedemptionsTable from '../../components/table/RedemptionsTable';
+import RedemptionsTable from '../../components/table/redemptions';
const Redemption = () => {
return (
-
+
);
diff --git a/web/src/pages/Setting/Chat/SettingsChats.js b/web/src/pages/Setting/Chat/SettingsChats.js
index 76f3f9f2..bef38eaf 100644
--- a/web/src/pages/Setting/Chat/SettingsChats.js
+++ b/web/src/pages/Setting/Chat/SettingsChats.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import {
Banner,
diff --git a/web/src/pages/Setting/Dashboard/SettingsAPIInfo.js b/web/src/pages/Setting/Dashboard/SettingsAPIInfo.js
index d59aacec..3dac07e7 100644
--- a/web/src/pages/Setting/Dashboard/SettingsAPIInfo.js
+++ b/web/src/pages/Setting/Dashboard/SettingsAPIInfo.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState } from 'react';
import {
Button,
@@ -403,11 +422,6 @@ const SettingsAPIInfo = ({ options, refresh }) => {
total: apiInfoList.length,
showSizeChanger: true,
showQuickJumper: true,
- formatPageText: (page) => t('第 {{start}} - {{end}} 条，共 {{total}} 条', {
- start: page.currentStart,
- end: page.currentEnd,
- total: apiInfoList.length,
- }),
pageSizeOptions: ['5', '10', '20', '50'],
onChange: (page, size) => {
setCurrentPage(page);
diff --git a/web/src/pages/Setting/Dashboard/SettingsAnnouncements.js b/web/src/pages/Setting/Dashboard/SettingsAnnouncements.js
index f81a8c2f..c2d57944 100644
--- a/web/src/pages/Setting/Dashboard/SettingsAnnouncements.js
+++ b/web/src/pages/Setting/Dashboard/SettingsAnnouncements.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import {
Button,
@@ -444,11 +463,6 @@ const SettingsAnnouncements = ({ options, refresh }) => {
total: announcementsList.length,
showSizeChanger: true,
showQuickJumper: true,
- formatPageText: (page) => t('第 {{start}} - {{end}} 条，共 {{total}} 条', {
- start: page.currentStart,
- end: page.currentEnd,
- total: announcementsList.length,
- }),
pageSizeOptions: ['5', '10', '20', '50'],
onChange: (page, size) => {
setCurrentPage(page);
diff --git a/web/src/pages/Setting/Dashboard/SettingsDataDashboard.js b/web/src/pages/Setting/Dashboard/SettingsDataDashboard.js
index af6079b6..c33ba77a 100644
--- a/web/src/pages/Setting/Dashboard/SettingsDataDashboard.js
+++ b/web/src/pages/Setting/Dashboard/SettingsDataDashboard.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import { Button, Col, Form, Row, Spin } from '@douyinfe/semi-ui';
import {
diff --git a/web/src/pages/Setting/Dashboard/SettingsFAQ.js b/web/src/pages/Setting/Dashboard/SettingsFAQ.js
index 3ab211e6..96c81fd6 100644
--- a/web/src/pages/Setting/Dashboard/SettingsFAQ.js
+++ b/web/src/pages/Setting/Dashboard/SettingsFAQ.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState } from 'react';
import {
Button,
@@ -370,11 +389,6 @@ const SettingsFAQ = ({ options, refresh }) => {
total: faqList.length,
showSizeChanger: true,
showQuickJumper: true,
- formatPageText: (page) => t('第 {{start}} - {{end}} 条，共 {{total}} 条', {
- start: page.currentStart,
- end: page.currentEnd,
- total: faqList.length,
- }),
pageSizeOptions: ['5', '10', '20', '50'],
onChange: (page, size) => {
setCurrentPage(page);
diff --git a/web/src/pages/Setting/Dashboard/SettingsUptimeKuma.js b/web/src/pages/Setting/Dashboard/SettingsUptimeKuma.js
index d9137d7d..9c9cda19 100644
--- a/web/src/pages/Setting/Dashboard/SettingsUptimeKuma.js
+++ b/web/src/pages/Setting/Dashboard/SettingsUptimeKuma.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState } from 'react';
import {
Button,
@@ -386,11 +405,6 @@ const SettingsUptimeKuma = ({ options, refresh }) => {
total: uptimeGroupsList.length,
showSizeChanger: true,
showQuickJumper: true,
- formatPageText: (page) => t('第 {{start}} - {{end}} 条，共 {{total}} 条', {
- start: page.currentStart,
- end: page.currentEnd,
- total: uptimeGroupsList.length,
- }),
pageSizeOptions: ['5', '10', '20', '50'],
onChange: (page, size) => {
setCurrentPage(page);
diff --git a/web/src/pages/Setting/Drawing/SettingsDrawing.js b/web/src/pages/Setting/Drawing/SettingsDrawing.js
index 0c9394df..fbea6702 100644
--- a/web/src/pages/Setting/Drawing/SettingsDrawing.js
+++ b/web/src/pages/Setting/Drawing/SettingsDrawing.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import { Button, Col, Form, Row, Spin, Tag } from '@douyinfe/semi-ui';
import {
diff --git a/web/src/pages/Setting/Model/SettingClaudeModel.js b/web/src/pages/Setting/Model/SettingClaudeModel.js
index 3eff92a0..04d7956a 100644
--- a/web/src/pages/Setting/Model/SettingClaudeModel.js
+++ b/web/src/pages/Setting/Model/SettingClaudeModel.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import { Button, Col, Form, Row, Spin } from '@douyinfe/semi-ui';
import {
diff --git a/web/src/pages/Setting/Model/SettingGeminiModel.js b/web/src/pages/Setting/Model/SettingGeminiModel.js
index a5daace6..13d45083 100644
--- a/web/src/pages/Setting/Model/SettingGeminiModel.js
+++ b/web/src/pages/Setting/Model/SettingGeminiModel.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import { Button, Col, Form, Row, Spin } from '@douyinfe/semi-ui';
import {
diff --git a/web/src/pages/Setting/Model/SettingGlobalModel.js b/web/src/pages/Setting/Model/SettingGlobalModel.js
index 837508c7..e71593d5 100644
--- a/web/src/pages/Setting/Model/SettingGlobalModel.js
+++ b/web/src/pages/Setting/Model/SettingGlobalModel.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import { Button, Col, Form, Row, Spin, Banner } from '@douyinfe/semi-ui';
import {
diff --git a/web/src/pages/Setting/Operation/SettingsCreditLimit.js b/web/src/pages/Setting/Operation/SettingsCreditLimit.js
index 1e2911ed..131ade44 100644
--- a/web/src/pages/Setting/Operation/SettingsCreditLimit.js
+++ b/web/src/pages/Setting/Operation/SettingsCreditLimit.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import { Button, Col, Form, Row, Spin } from '@douyinfe/semi-ui';
import { useTranslation } from 'react-i18next';
diff --git a/web/src/pages/Setting/Operation/SettingsGeneral.js b/web/src/pages/Setting/Operation/SettingsGeneral.js
index 3ca9c377..162dc338 100644
--- a/web/src/pages/Setting/Operation/SettingsGeneral.js
+++ b/web/src/pages/Setting/Operation/SettingsGeneral.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import {
Banner,
diff --git a/web/src/pages/Setting/Operation/SettingsLog.js b/web/src/pages/Setting/Operation/SettingsLog.js
index 6ac27014..dcd17081 100644
--- a/web/src/pages/Setting/Operation/SettingsLog.js
+++ b/web/src/pages/Setting/Operation/SettingsLog.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import { Button, Col, Form, Row, Spin, DatePicker } from '@douyinfe/semi-ui';
import dayjs from 'dayjs';
diff --git a/web/src/pages/Setting/Operation/SettingsMonitoring.js b/web/src/pages/Setting/Operation/SettingsMonitoring.js
index 857bb8da..f4de4f6e 100644
--- a/web/src/pages/Setting/Operation/SettingsMonitoring.js
+++ b/web/src/pages/Setting/Operation/SettingsMonitoring.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import { Button, Col, Form, Row, Spin } from '@douyinfe/semi-ui';
import {
diff --git a/web/src/pages/Setting/Operation/SettingsSensitiveWords.js b/web/src/pages/Setting/Operation/SettingsSensitiveWords.js
index 41481bd4..8310ddb2 100644
--- a/web/src/pages/Setting/Operation/SettingsSensitiveWords.js
+++ b/web/src/pages/Setting/Operation/SettingsSensitiveWords.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import { Button, Col, Form, Row, Spin, Tag } from '@douyinfe/semi-ui';
import {
diff --git a/web/src/pages/Setting/Payment/SettingsGeneralPayment.js b/web/src/pages/Setting/Payment/SettingsGeneralPayment.js
index c5b6511c..b9252839 100644
--- a/web/src/pages/Setting/Payment/SettingsGeneralPayment.js
+++ b/web/src/pages/Setting/Payment/SettingsGeneralPayment.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import {
Button,
diff --git a/web/src/pages/Setting/Payment/SettingsPaymentGateway.js b/web/src/pages/Setting/Payment/SettingsPaymentGateway.js
index 0bb63b53..46c18a47 100644
--- a/web/src/pages/Setting/Payment/SettingsPaymentGateway.js
+++ b/web/src/pages/Setting/Payment/SettingsPaymentGateway.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import {
Button,
diff --git a/web/src/pages/Setting/Payment/SettingsPaymentGatewayStripe.js b/web/src/pages/Setting/Payment/SettingsPaymentGatewayStripe.js
index 4c4a1af6..23bd1b67 100644
--- a/web/src/pages/Setting/Payment/SettingsPaymentGatewayStripe.js
+++ b/web/src/pages/Setting/Payment/SettingsPaymentGatewayStripe.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import {
Banner,
diff --git a/web/src/pages/Setting/RateLimit/SettingsRequestRateLimit.js b/web/src/pages/Setting/RateLimit/SettingsRequestRateLimit.js
index 85473ec9..efb355df 100644
--- a/web/src/pages/Setting/RateLimit/SettingsRequestRateLimit.js
+++ b/web/src/pages/Setting/RateLimit/SettingsRequestRateLimit.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import { Button, Col, Form, Row, Spin } from '@douyinfe/semi-ui';
import {
diff --git a/web/src/pages/Setting/Ratio/GroupRatioSettings.js b/web/src/pages/Setting/Ratio/GroupRatioSettings.js
index 12e634ba..1e6e4af3 100644
--- a/web/src/pages/Setting/Ratio/GroupRatioSettings.js
+++ b/web/src/pages/Setting/Ratio/GroupRatioSettings.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import { Button, Col, Form, Row, Spin } from '@douyinfe/semi-ui';
import {
diff --git a/web/src/pages/Setting/Ratio/ModelRatioSettings.js b/web/src/pages/Setting/Ratio/ModelRatioSettings.js
index 80238fc8..c0e5991b 100644
--- a/web/src/pages/Setting/Ratio/ModelRatioSettings.js
+++ b/web/src/pages/Setting/Ratio/ModelRatioSettings.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import {
Button,
diff --git a/web/src/pages/Setting/Ratio/ModelRationNotSetEditor.js b/web/src/pages/Setting/Ratio/ModelRationNotSetEditor.js
index 25c67eee..5ca8686b 100644
--- a/web/src/pages/Setting/Ratio/ModelRationNotSetEditor.js
+++ b/web/src/pages/Setting/Ratio/ModelRationNotSetEditor.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState } from 'react';
import {
Table,
@@ -420,12 +439,6 @@ export default function ModelRatioNotSetEditor(props) {
onPageChange: (page) => setCurrentPage(page),
onPageSizeChange: handlePageSizeChange,
pageSizeOptions: pageSizeOptions,
- formatPageText: (page) =>
- t('第 {{start}} - {{end}} 条，共 {{total}} 条', {
- start: page.currentStart,
- end: page.currentEnd,
- total: filteredModels.length,
- }),
showTotal: true,
showSizeChanger: true,
}}
diff --git a/web/src/pages/Setting/Ratio/ModelSettingsVisualEditor.js b/web/src/pages/Setting/Ratio/ModelSettingsVisualEditor.js
index b897968f..2aa45ace 100644
--- a/web/src/pages/Setting/Ratio/ModelSettingsVisualEditor.js
+++ b/web/src/pages/Setting/Ratio/ModelSettingsVisualEditor.js
@@ -1,4 +1,22 @@
-// ModelSettingsVisualEditor.js
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useRef } from 'react';
import {
Table,
@@ -475,12 +493,6 @@ export default function ModelSettingsVisualEditor(props) {
pageSize: pageSize,
total: filteredModels.length,
onPageChange: (page) => setCurrentPage(page),
- formatPageText: (page) =>
- t('第 {{start}} - {{end}} 条，共 {{total}} 条', {
- start: page.currentStart,
- end: page.currentEnd,
- total: filteredModels.length,
- }),
showTotal: true,
showSizeChanger: false,
}}
diff --git a/web/src/pages/Setting/Ratio/UpstreamRatioSync.js b/web/src/pages/Setting/Ratio/UpstreamRatioSync.js
index 647ca758..8b408062 100644
--- a/web/src/pages/Setting/Ratio/UpstreamRatioSync.js
+++ b/web/src/pages/Setting/Ratio/UpstreamRatioSync.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useState, useCallback, useMemo, useEffect } from 'react';
import {
Button,
@@ -19,7 +38,7 @@ import {
CheckCircle,
} from 'lucide-react';
import { API, showError, showSuccess, showWarning, stringToColor } from '../../../helpers';
-import { useIsMobile } from '../../../hooks/useIsMobile.js';
+import { useIsMobile } from '../../../hooks/common/useIsMobile.js';
import { DEFAULT_ENDPOINT } from '../../../constants';
import { useTranslation } from 'react-i18next';
import {
@@ -689,11 +708,6 @@ export default function UpstreamRatioSync(props) {
total: filteredDataSource.length,
showSizeChanger: true,
showQuickJumper: true,
- formatPageText: (page) => t('第 {{start}} - {{end}} 条，共 {{total}} 条', {
- start: page.currentStart,
- end: page.currentEnd,
- total: filteredDataSource.length,
- }),
pageSizeOptions: ['5', '10', '20', '50'],
onChange: (page, size) => {
setCurrentPage(page);
diff --git a/web/src/pages/Setting/index.js b/web/src/pages/Setting/index.js
index 43907826..4e8bb2f6 100644
--- a/web/src/pages/Setting/index.js
+++ b/web/src/pages/Setting/index.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState } from 'react';
import { Layout, TabPane, Tabs } from '@douyinfe/semi-ui';
import { useNavigate, useLocation } from 'react-router-dom';
@@ -150,7 +169,7 @@ const Setting = () => {
}
}, [location.search]);
return (
-
diff --git a/web/src/pages/Task/index.js b/web/src/pages/Task/index.js
index 4e3a9af4..d29777da 100644
--- a/web/src/pages/Task/index.js
+++ b/web/src/pages/Task/index.js
@@ -1,8 +1,27 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
-import TaskLogsTable from '../../components/table/TaskLogsTable.js';
+import TaskLogsTable from '../../components/table/task-logs';
const Task = () => (
-
+
);
diff --git a/web/src/pages/Token/index.js b/web/src/pages/Token/index.js
index 33921eb6..8764db76 100644
--- a/web/src/pages/Token/index.js
+++ b/web/src/pages/Token/index.js
@@ -1,9 +1,28 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
-import TokensTable from '../../components/table/TokensTable';
+import TokensTable from '../../components/table/tokens';
const Token = () => {
return (
-
+
);
diff --git a/web/src/pages/TopUp/index.js b/web/src/pages/TopUp/index.js
index a7ac6ba6..867e623e 100644
--- a/web/src/pages/TopUp/index.js
+++ b/web/src/pages/TopUp/index.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React, { useEffect, useState, useContext } from 'react';
import {
API,
@@ -490,7 +509,7 @@ const TopUp = () => {
};
return (
-
+
{/* 划转模态框 */}
.
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import React from 'react';
-import UsersTable from '../../components/table/UsersTable';
+import UsersTable from '../../components/table/users';
const User = () => {
return (
-
+
);
diff --git a/web/tailwind.config.js b/web/tailwind.config.js
index 09cb9782..1f092b4d 100644
--- a/web/tailwind.config.js
+++ b/web/tailwind.config.js
@@ -1,4 +1,22 @@
-/** @type {import('tailwindcss').Config} */
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
export default {
content: [
"./index.html",
diff --git a/web/vite.config.js b/web/vite.config.js
index 78825b4a..50ca06a5 100644
--- a/web/vite.config.js
+++ b/web/vite.config.js
@@ -1,3 +1,22 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see .
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
import react from '@vitejs/plugin-react';
import { defineConfig, transformWithEsbuild } from 'vite';
import pkg from '@douyinfe/vite-plugin-semi';
+
+ 
+
+ 
+