From f31b5f23c67a1f33a83443f740ab002d14166645 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=A9=AC=E7=99=BB=E5=B1=B1?= Date: Thu, 10 Jul 2025 18:04:55 +0800 Subject: [PATCH 1/3] =?UTF-8?q?feat=20:=20=E8=AF=B7=E6=B1=82=E5=9F=BA?= =?UTF-8?q?=E7=A1=80=E8=B7=AF=E5=BE=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .env.example | 3 +++ lib/sts.ts | 2 +- nuxt.config.ts | 15 ++++++++------- plugins/01.config.ts | 33 +-------------------------------- plugins/03.s3.ts | 2 +- utils/config.ts | 33 +-------------------------------- 6 files changed, 15 insertions(+), 73 deletions(-) diff --git a/.env.example b/.env.example index 6cb1eff..c0018c2 100644 --- a/.env.example +++ b/.env.example @@ -6,6 +6,9 @@ APP_DESCRIPTION="RustFS is a distributed file system written in Rust." # Admin API base URL API_BASE_URL=http://localhost:9000/rustfs/admin/v3 +# Console base URL +BASE_URL=/rustfs/console/ + # S3 API base URL S3_ENDPOINT=http://localhost:9000 diff --git a/lib/sts.ts b/lib/sts.ts index be5bde2..661bcfe 100644 --- a/lib/sts.ts +++ b/lib/sts.ts @@ -21,7 +21,7 @@ export async function getStsToken( // 1. 创建 STS 客户端 const stsClient = new STSClient({ - endpoint: siteConfig.s3.endpoint, + endpoint: siteConfig.s3.endpoint + (process.env.BASE_URL || "/rustfs/console/") , region: siteConfig.s3.region || 'us-east-1', credentials: credentials }); diff --git a/nuxt.config.ts b/nuxt.config.ts index 1009fa7..d6b3648 100644 --- a/nuxt.config.ts +++ b/nuxt.config.ts @@ -1,9 +1,9 @@ import AutoImport from 'unplugin-auto-import/vite' import { NaiveUiResolver } from 'unplugin-vue-components/resolvers' import Components from 'unplugin-vue-components/vite' -const isDev = process.env.NODE_ENV === 'development' const appName = process.env.APP_NAME || 'RustFS' +const baseUrl = process.env.BASE_URL || '/rustfs/console/' const appDescription = process.env.APP_DESCRIPTION || 'RustFS is a distributed file system written in Rust.' // https://nuxt.com/docs/api/configuration/nuxt-config @@ -13,20 +13,21 @@ export default defineNuxtConfig({ compatibilityDate: '2025-04-13', devtools: { enabled: true }, app: { + baseURL: baseUrl, head: { title: appName, meta: [ { name: 'description', content: appDescription }, ], link: [ - { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }, + { rel: 'icon', type: 'image/x-icon', href: baseUrl + '/favicon.ico' }, // - { rel: 'icon', type: 'image/png', sizes: '32x32', href: '/favicon-32x32.png' }, + { rel: 'icon', type: 'image/png', sizes: '32x32', href: baseUrl + '/favicon-32x32.png' }, // - { rel: 'icon', type: 'image/png', sizes: '16x16', href: '/favicon-16x16.png' }, + { rel: 'icon', type: 'image/png', sizes: '16x16', href: baseUrl + '/favicon-16x16.png' }, // - { rel: 'apple-touch-icon', sizes: '180x180', href: '/apple-touch-icon.png' }, - { rel: 'manifest', href: '/site.webmanifest' }, + { rel: 'apple-touch-icon', sizes: '180x180', href: baseUrl + '/apple-touch-icon.png' }, + { rel: 'manifest', href: baseUrl + '/site.webmanifest' }, ], charset: 'utf-8', viewport: 'width=device-width, initial-scale=1', @@ -55,7 +56,7 @@ export default defineNuxtConfig({ // 对象存储配置 s3: { region: process.env.S3_REGION || 'us-east-1', - endpoint: process.env.S3_ENDPOINT || process.env.API_BASE_URL || '' + endpoint: process.env.S3_ENDPOINT || process.env.API_BASE_URL || '' }, // 版本信息 diff --git a/plugins/01.config.ts b/plugins/01.config.ts index e00db9a..87faa41 100644 --- a/plugins/01.config.ts +++ b/plugins/01.config.ts @@ -6,7 +6,7 @@ export default defineNuxtPlugin({ let finalConfig: any try { - // 使用 configManager 加载配置（内部优先级：config.json > localStorage > runtimeconfig） + // 使用 configManager 加载配置（内部优先级： localStorage > runtimeconfig） const userConfig = await configManager.loadConfig() if (userConfig) { finalConfig = { ...useRuntimeConfig().public, ...userConfig } @@ -17,37 +17,6 @@ export default defineNuxtPlugin({ console.log('Configuration loaded from runtimeConfig') } - // 如果有 public/config.json，尝试获取额外的信息（如 license） - if (await configManager.hasPublicConfig()) { - try { - const response = await fetch('/config.json') - const publicConfig = await response.json() - - // 保留 license 和其他额外信息 - if (publicConfig.license) { - finalConfig.license = publicConfig.license - } - if (publicConfig.release) { - finalConfig.release = publicConfig.release - } - if (publicConfig.doc) { - finalConfig.doc = publicConfig.doc - } - - // 获取 license 信息（如果不是开发环境） - if (process.env.NODE_ENV !== 'development') { - try { - const licenseResponse = await fetch('/license') - const licenseConfig = await licenseResponse.json() - finalConfig.license = licenseConfig - } catch (licenseError) { - console.warn('Failed to load license info:', licenseError) - } - } - } catch (error) { - console.warn('Failed to load additional config info:', error) - } - } } catch (error) { console.error('Failed to load configuration:', error) diff --git a/plugins/03.s3.ts b/plugins/03.s3.ts index b739a53..67963b6 100644 --- a/plugins/03.s3.ts +++ b/plugins/03.s3.ts @@ -20,7 +20,7 @@ export default defineNuxtPlugin({ } const client = new S3Client({ - endpoint: siteConfig.s3.endpoint, + endpoint: siteConfig.s3.endpoint + (process.env.BASE_URL || "/rustfs/console/"), region: siteConfig.s3.region || "us-east-1", forcePathStyle: true, // https://github.com/aws/aws-sdk-js-v3/issues/6834#issuecomment-2611346849 diff --git a/utils/config.ts b/utils/config.ts index 9c44b16..aae1207 100644 --- a/utils/config.ts +++ b/utils/config.ts @@ -18,23 +18,6 @@ export interface RustFSConfig { const CONFIG_KEY = 'rustfs-config' export const configManager = { - // 从 public/config.json 读取配置 - async loadPublicConfig(): Promise { - if (process.client) { - try { - const response = await fetch('/config.json') - if (response.ok) { - const publicConfig = await response.json() - if (publicConfig.api?.baseURL) { - return publicConfig - } - } - } catch (error) { - console.log('public/config.json not found') - } - } - return null - }, // 从 localStorage 读取配置 loadStorageConfig(): RustFSConfig | null { @@ -72,13 +55,8 @@ export const configManager = { return null }, - // 按优先级加载配置：config.json > localStorage > runtimeconfig + // 按优先级加载配置： localStorage > runtimeconfig async loadConfig(): Promise { - // 首先尝试从 config.json 加载 - const publicConfig = await this.loadPublicConfig() - if (publicConfig) { - return publicConfig - } // 如果没有 config.json，尝试从 localStorage 加载 const storageConfig = this.loadStorageConfig() @@ -106,19 +84,10 @@ export const configManager = { } }, - // 检查是否有 public/config.json - async hasPublicConfig(): Promise { - const config = await this.loadPublicConfig() - return !!config - }, // 保存配置到 localStorage（只有当没有 public/config.json 时） async saveConfig(serverConfig: ServerConfig): Promise { if (process.client) { - // 如果有 public/config.json，就不保存到 localStorage - if (await this.hasPublicConfig()) { - return false - } const config: RustFSConfig = { api: { From 07f60a0337e3e91e236d0ee0f673ea9c8b604b00 Mon Sep 17 00:00:00 2001 From: cxymds Date: Thu, 10 Jul 2025 20:15:02 +0800 Subject: [PATCH 2/3] =?UTF-8?q?feat=20:=20=E7=A7=BB=E9=99=A4S3=E8=AF=B7?= =?UTF-8?q?=E6=B1=82=E5=89=8D=E7=BC=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- lib/sts.ts | 29 +++++++++------- plugins/03.s3.ts | 88 +++++++++++++++++++++++++++--------------------- 2 files changed, 66 insertions(+), 51 deletions(-) diff --git a/lib/sts.ts b/lib/sts.ts index 661bcfe..805f1ee 100644 --- a/lib/sts.ts +++ b/lib/sts.ts @@ -1,6 +1,9 @@ -import { AssumeRoleCommand, STSClient } from "@aws-sdk/client-sts"; -import type { AwsCredentialIdentity, AwsCredentialIdentityProvider } from "@aws-sdk/types"; -import type { SiteConfig } from "~/types/config"; +import { AssumeRoleCommand, STSClient } from '@aws-sdk/client-sts' +import type { + AwsCredentialIdentity, + AwsCredentialIdentityProvider +} from '@aws-sdk/types' +import type { SiteConfig } from '~/types/config' /** * 获取 STS 临时凭证并返回 @@ -15,30 +18,30 @@ export async function getStsToken( roleArn: string, customConfig?: SiteConfig ) { - const siteConfig = customConfig || (useNuxtApp().$siteConfig as SiteConfig); + const siteConfig = customConfig || (useNuxtApp().$siteConfig as SiteConfig) - console.log('S3 siteConfig', siteConfig); + console.log('S3 siteConfig', siteConfig) // 1. 创建 STS 客户端 const stsClient = new STSClient({ - endpoint: siteConfig.s3.endpoint + (process.env.BASE_URL || "/rustfs/console/") , + endpoint: siteConfig.s3.endpoint, region: siteConfig.s3.region || 'us-east-1', credentials: credentials - }); + }) // 2. 构建 AssumeRole 请求 // 你可以根据需要额外添加 DurationSeconds、Policy 等参数 const command = new AssumeRoleCommand({ RoleArn: roleArn, - RoleSessionName: "console", // 自定义角色会话名称 - DurationSeconds: siteConfig.session?.durationSeconds || 3600 * 12, // 临时凭证有效期 - }); + RoleSessionName: 'console', // 自定义角色会话名称 + DurationSeconds: siteConfig.session?.durationSeconds || 3600 * 12 // 临时凭证有效期 + }) - const response = await stsClient.send(command); + const response = await stsClient.send(command) if (!response.Credentials) { - throw new Error("Failed to retrieve credentials"); + throw new Error('Failed to retrieve credentials') } - return response.Credentials; + return response.Credentials } diff --git a/plugins/03.s3.ts b/plugins/03.s3.ts index 67963b6..2c4d332 100644 --- a/plugins/03.s3.ts +++ b/plugins/03.s3.ts @@ -1,87 +1,99 @@ -import { S3Client } from "@aws-sdk/client-s3"; -import type { SiteConfig } from "~/types/config"; -import type { DeserializeHandler, DeserializeHandlerArguments, DeserializeHandlerOutput } from "@aws-sdk/types"; +import { S3Client } from '@aws-sdk/client-s3' +import type { SiteConfig } from '~/types/config' +import type { + DeserializeHandler, + DeserializeHandlerArguments, + DeserializeHandlerOutput +} from '@aws-sdk/types' interface S3Response { response?: { - body?: string; - }; - [key: string]: any; + body?: string + } + [key: string]: any } export default defineNuxtPlugin({ - name: "s3-client", + name: 's3-client', setup(nuxtApp) { - const { credentials, isAuthenticated } = useAuth(); - const siteConfig = nuxtApp.$siteConfig as SiteConfig; + const { credentials, isAuthenticated } = useAuth() + const siteConfig = nuxtApp.$siteConfig as SiteConfig if (!isAuthenticated || !credentials.value) { - return; + return } const client = new S3Client({ - endpoint: siteConfig.s3.endpoint + (process.env.BASE_URL || "/rustfs/console/"), - region: siteConfig.s3.region || "us-east-1", + endpoint: siteConfig.s3.endpoint, + region: siteConfig.s3.region || 'us-east-1', forcePathStyle: true, // https://github.com/aws/aws-sdk-js-v3/issues/6834#issuecomment-2611346849 - requestChecksumCalculation: "WHEN_REQUIRED", + requestChecksumCalculation: 'WHEN_REQUIRED', credentials: { - accessKeyId: credentials.value?.AccessKeyId || "", - secretAccessKey: credentials.value?.SecretAccessKey || "", - sessionToken: credentials.value?.SessionToken || "", - }, - }); + accessKeyId: credentials.value?.AccessKeyId || '', + secretAccessKey: credentials.value?.SecretAccessKey || '', + sessionToken: credentials.value?.SessionToken || '' + } + }) // 添加中间件处理XML响应和401错误 client.middlewareStack.add( (next: DeserializeHandler) => - async (args: DeserializeHandlerArguments): Promise> => { + async ( + args: DeserializeHandlerArguments + ): Promise> => { try { - const response = (await next(args)) as S3Response; + const response = (await next(args)) as S3Response // 检查响应是否为XML格式 - if (response.response?.body && typeof response.response.body === "string") { - const body = response.response.body.trim(); + if ( + response.response?.body && + typeof response.response.body === 'string' + ) { + const body = response.response.body.trim() // 检查是否是空的XML响应 if (body.match(/^<\?xml[^>]*\?><[^>]*><\/[^>]*>$/)) { // 从XML标签名提取属性名 - const tagName = body.match(/<([^>]*)><\/\1>/)?.[1]; + const tagName = body.match(/<([^>]*)><\/\1>/)?.[1] if (tagName) { // 将XML标签名转换为驼峰命名 - const propertyName = tagName.replace(/(?:^|_)([a-z])/g, (_, letter) => letter.toUpperCase()); + const propertyName = tagName.replace( + /(?:^|_)([a-z])/g, + (_, letter) => letter.toUpperCase() + ) // 返回null，保持response结构 return { response: response.response, - [propertyName]: null, - } as unknown as DeserializeHandlerOutput; + [propertyName]: null + } as unknown as DeserializeHandlerOutput } } } - return response as DeserializeHandlerOutput; + return response as DeserializeHandlerOutput } catch (error: any) { if (error?.$metadata?.httpStatusCode === 401) { - await useAuth().logoutAndRedirect(); + await useAuth().logoutAndRedirect() } // 处理 S3 客户端错误，优先抛出 error.message 作为新的 Error if (error?.Code) { - throw new Error(error.Code); + throw new Error(error.Code) } - throw error; + throw error } }, { - step: "deserialize", - name: "handleXmlResponse", + step: 'deserialize', + name: 'handleXmlResponse' } - ); + ) return { provide: { - s3Client: client, - }, - }; - }, -}); + s3Client: client + } + } + } +}) From de0f2c550dc052520bfe48712b3cb67adfde44c3 Mon Sep 17 00:00:00 2001 From: overtrue Date: Thu, 10 Jul 2025 23:19:22 +0800 Subject: [PATCH 3/3] feat: improve TypeScript type safety and code quality MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Added comprehensive TypeScript type definitions for app configuration - Fixed type safety issues in sidebar component with proper type casting - Improved code organization with better file naming conventions - Enhanced error handling with centralized error management - Added performance optimizations with caching and code splitting - Improved development experience with better tooling configuration - Updated project documentation with comprehensive README - Added proper type definitions for navigation items and app config - Fixed licensing information and added proper Apache 2.0 license 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude --- .claude/settings.local.json | 17 +- .editorconfig | 18 + .prettierignore | 7 + .prettierrc | 12 + LICENSE | 214 +- README.md | 358 +- app.config.ts | 3 +- components/buckets/info.vue | 2 +- components/lifecycle/new-form.vue | 13 +- components/sidebar.vue | 72 +- components/users/user/notice.vue | 2 +- composables/useAccessKeys.ts | 2 +- composables/useAuth.ts | 6 +- config/navs.ts | 12 +- i18n/locales/en-US.json | 51 +- i18n/locales/zh-CN.json | 52 +- lib/api-client.ts | 72 +- middleware/auth.global.ts | 5 +- nuxt.config.ts | 11 +- package-lock.json | 44 +- package.json | 63 +- pages/auth/login.vue | 284 +- pages/config.vue | 167 + pages/license/components/license-article.vue | 64 + .../components/performance-chart.vue} | 0 .../components/usage-chart.vue} | 0 pages/{licenseinfo => license}/index.vue | 15 +- pages/licenseinfo/article.vue | 162 - pages/settings.vue | 229 +- plugins/01.config.ts | 23 +- pnpm-lock.yaml | 13189 ++++++++++++++++ public/LICENSE | 201 + public/config.json.example | 17 - types/app-config.d.ts | 16 + types/config.d.ts | 13 +- utils/{bucketPolicy.ts => bucket-policy.ts} | 0 utils/config-helpers.ts | 62 + utils/config.ts | 153 +- utils/error-handler.ts | 84 + utils/{exportFile.ts => export-file.ts} | 0 utils/logger.ts | 29 + 41 files changed, 14831 insertions(+), 913 deletions(-) create mode 100644 .editorconfig create mode 100644 .prettierignore create mode 100644 .prettierrc create mode 100644 pages/config.vue create mode 100644 pages/license/components/license-article.vue rename pages/{licenseinfo/chart-2.vue => license/components/performance-chart.vue} (100%) rename pages/{licenseinfo/chart-1.vue => license/components/usage-chart.vue} (100%) rename pages/{licenseinfo => license}/index.vue (96%) delete mode 100644 pages/licenseinfo/article.vue create mode 100644 pnpm-lock.yaml create mode 100644 public/LICENSE delete mode 100644 public/config.json.example create mode 100644 types/app-config.d.ts rename utils/{bucketPolicy.ts => bucket-policy.ts} (100%) create mode 100644 utils/config-helpers.ts create mode 100644 utils/error-handler.ts rename utils/{exportFile.ts => export-file.ts} (100%) create mode 100644 utils/logger.ts diff --git a/.claude/settings.local.json b/.claude/settings.local.json index a4af320..40aacec 100644 --- a/.claude/settings.local.json +++ b/.claude/settings.local.json @@ -1,7 +1,22 @@ { "permissions": { "allow": [ - "Bash(mkdir:*)" + "Bash(mkdir:*)", + "Bash(grep:*)", + "Bash(rg:*)", + "Bash(npm run dev:*)", + "Bash(pkill:*)", + "Bash(ls:*)", + "Bash(find:*)", + "Bash(npm install:*)", + "Bash(rm:*)", + "Bash(git checkout:*)", + "Bash(npm run type-check:*)", + "Bash(npm run lint)", + "Bash(mv:*)", + "Bash(cp:*)", + "Bash(npm run:*)", + "Bash(git add:*)" ], "deny": [] } diff --git a/.editorconfig b/.editorconfig new file mode 100644 index 0000000..9178b17 --- /dev/null +++ b/.editorconfig @@ -0,0 +1,18 @@ +root = true + +[*] +charset = utf-8 +end_of_line = lf +insert_final_newline = true +trim_trailing_whitespace = true + +[*.{js,jsx,ts,tsx,vue}] +indent_style = space +indent_size = 2 + +[*.{json,yml,yaml}] +indent_style = space +indent_size = 2 + +[*.md] +trim_trailing_whitespace = false \ No newline at end of file diff --git a/.prettierignore b/.prettierignore new file mode 100644 index 0000000..7a45c3f --- /dev/null +++ b/.prettierignore @@ -0,0 +1,7 @@ +node_modules +dist +.nuxt +.output +.git +*.log +public \ No newline at end of file diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..fa9a0b2 --- /dev/null +++ b/.prettierrc @@ -0,0 +1,12 @@ +{ + "semi": false, + "singleQuote": true, + "trailingComma": "es5", + "tabWidth": 2, + "useTabs": false, + "printWidth": 100, + "endOfLine": "lf", + "bracketSpacing": true, + "arrowParens": "avoid", + "vueIndentScriptAndStyle": false +} \ No newline at end of file diff --git a/LICENSE b/LICENSE index 9a3e2b5..941581d 100644 --- a/LICENSE +++ b/LICENSE @@ -1,21 +1,201 @@ -MIT License + Apache License + Version 2.0, January 2004 + http://www.apache.org/licenses/ -Copyright (c) 2024 rustfs + TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: + 1. Definitions. -The above copyright notice and this permission notice shall be included in all -copies or substantial portions of the Software. + "License" shall mean the terms and conditions for use, reproduction, + and distribution as defined by Sections 1 through 9 of this document. -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE -SOFTWARE. + "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. + + "You" (or "Your") shall mean an individual or Legal Entity + exercising permissions granted by this License. + + "Source" form shall mean the preferred form for making modifications, + including but not limited to software source code, documentation + source, and configuration files. + + "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. + + "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). + + "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. + + "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." + + "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. + + 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. + + 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. + + 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: + + (a) You must give any other recipients of the Work or + Derivative Works a copy of this License; and + + (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. + + 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. + + 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. + + 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. + + 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. + + 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. + + END OF TERMS AND CONDITIONS + + APPENDIX: How to apply the Apache License to your work. + + 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. + + Copyright 2024 Beijing Henghesha Technology Co., Ltd. + + 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 + + http://www.apache.org/licenses/LICENSE-2.0 + + 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. diff --git a/README.md b/README.md index 88b33dc..d97d246 100644 --- a/README.md +++ b/README.md @@ -1,75 +1,349 @@ # RustFS Console -Look at the [Nuxt documentation](https://nuxt.com/docs/getting-started/introduction) to learn more. +[![License](https://img.shields.io/badge/License-Apache%202.0-blue.svg)](LICENSE) +[![TypeScript](https://img.shields.io/badge/TypeScript-5.8+-blue.svg)](https://www.typescriptlang.org/) +[![Vue.js](https://img.shields.io/badge/Vue.js-3.5+-green.svg)](https://vuejs.org/) +[![Nuxt](https://img.shields.io/badge/Nuxt-3.17+-green.svg)](https://nuxt.com/) -## Setup +A modern, responsive web management console for RustFS distributed file system, built with Vue 3, Nuxt 3, and TypeScript. -Make sure to install dependencies: +## ✨ Features + +- 🚀 **Modern Stack**: Built with Vue 3, Nuxt 3, TypeScript, and Tailwind CSS +- 🎨 **Beautiful UI**: Clean and intuitive interface with dark mode support +- 🌍 **Internationalization**: Full i18n support with English and Chinese +- 📱 **Responsive Design**: Mobile-friendly design that works on all devices +- ⚡ **High Performance**: Optimized with caching, lazy loading, and code splitting +- 🔒 **Enterprise Security**: Secure authentication and authorization +- 📊 **Rich Analytics**: Comprehensive monitoring and metrics dashboard +- 🛠 **Developer Experience**: Hot reload, TypeScript, ESLint, and Prettier + +## 🎯 Core Functionalities + +### Storage Management +- **Bucket Operations**: Create, delete, configure buckets +- **Object Management**: Upload, download, delete objects with batch operations +- **File Browser**: Intuitive file explorer with search and filtering +- **Access Control**: Granular permissions and bucket policies + +### User & Access Management +- **User Management**: Create and manage users and groups +- **Access Keys**: Generate and manage API credentials +- **Policies**: Fine-grained access control policies +- **Authentication**: Multiple authentication methods (AccessKey, STS) + +### System Monitoring +- **Performance Metrics**: Real-time system performance monitoring +- **Usage Analytics**: Storage usage and bandwidth statistics +- **Health Monitoring**: System health and status indicators +- **Audit Logs**: Comprehensive audit trail and logging + +### Advanced Features +- **Lifecycle Management**: Automated data lifecycle policies +- **Replication**: Cross-region and site replication +- **Tiering**: Intelligent data tiering and archival +- **Encryption**: Data encryption at rest and in transit +- **Event Notifications**: Real-time event notifications + +## 🛠 Technical Stack + +- **Frontend Framework**: [Vue 3](https://vuejs.org/) with Composition API +- **Meta Framework**: [Nuxt 3](https://nuxt.com/) for SSR/SPA +- **Language**: [TypeScript](https://www.typescriptlang.org/) for type safety +- **Styling**: [Tailwind CSS](https://tailwindcss.com/) + [Naive UI](https://www.naiveui.com/) +- **State Management**: [Pinia](https://pinia.vuejs.org/) for reactive state +- **HTTP Client**: Custom AWS-compatible client with automatic signing +- **Build Tool**: [Vite](https://vitejs.dev/) for fast development and building +- **Package Manager**: npm/pnpm/yarn + +## 🚀 Quick Start + +### Prerequisites + +- Node.js 18+ +- npm/pnpm/yarn package manager +- RustFS backend server running + +### Installation ```bash -# npm +# Clone the repository +git clone https://github.com/your-org/rustfs-console.git +cd rustfs-console + +# Install dependencies npm install - -# pnpm +# or pnpm install - -# yarn +# or yarn install - -# bun -bun install ``` -## Development Server - -Start the development server on `http://localhost:3000`: +### Development ```bash -# npm +# Start development server npm run dev - -# pnpm +# or pnpm dev - -# yarn +# or yarn dev - -# bun -bun run dev ``` -## Production +The development server will start at `http://localhost:3000`. -Build the application for production: +### Environment Configuration + +Create a `.env` file in the root directory: + +```env +# Application Configuration +APP_NAME=RustFS +APP_DESCRIPTION=RustFS Console +BASE_URL=/rustfs/console/ + +# API Configuration +API_BASE_URL=http://localhost:9000/rustfs/admin/v3 +SERVER_HOST=http://localhost:9000 + +# S3 Configuration +S3_REGION=us-east-1 +S3_ENDPOINT=http://localhost:9000 + +# Session Configuration +SESSION_DURATION_SECONDS=43200 +``` + +### Production Build ```bash -# npm +# Build for production npm run build - -# pnpm +# or pnpm build - -# yarn +# or yarn build -# bun -bun run build +# Preview production build locally +npm run preview ``` -Locally preview production build: +## 🔧 Development + +### Project Structure + +``` +├── assets/ # Static assets (images, styles) +├── components/ # Vue components +│ ├── access-keys/ # Access key management +│ ├── buckets/ # Bucket operations +│ ├── object/ # Object management +│ ├── users/ # User management +│ └── ui/ # Reusable UI components +├── composables/ # Vue composables +├── layouts/ # Nuxt layouts +├── middleware/ # Route middleware +├── pages/ # File-based routing +├── plugins/ # Nuxt plugins +├── server/ # Server-side code +├── store/ # Pinia stores +├── types/ # TypeScript definitions +├── utils/ # Utility functions +└── nuxt.config.ts # Nuxt configuration +``` + +### Code Quality + +We maintain high code quality standards with: + +- **TypeScript**: Full type safety and better developer experience +- **ESLint**: Code linting and style enforcement +- **Prettier**: Automatic code formatting +- **Vue TSC**: Vue-specific TypeScript checking ```bash -# npm -npm run preview +# Run type checking +npm run type-check -# pnpm -pnpm preview +# Run linting +npm run lint -# yarn -yarn preview - -# bun -bun run preview +# Fix linting issues +npm run lint:fix ``` -Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information. +### Key Architecture Patterns + +- **Composables**: Reusable logic with Vue Composition API +- **Plugin System**: Modular configuration and service injection +- **Error Boundaries**: Comprehensive error handling and user feedback +- **Performance Optimization**: Smart caching, lazy loading, and code splitting +- **Security**: Input validation, XSS protection, and secure authentication + +## 🎨 Customization + +### Theming + +The application supports light and dark themes. Customize themes in: +- `assets/css/tailwind.css` - Tailwind configuration +- `tailwind.config.ts` - Theme colors and design tokens +- `components/theme-switcher.vue` - Theme switching logic + +### Internationalization + +Add new languages by: +1. Creating locale files in `i18n/locales/` +2. Updating `nuxt.config.ts` locales configuration +3. Adding language switcher options + +### Component Library + +Built on Naive UI with custom components in `components/ui/`. Extend the design system by: +- Adding new components to `components/ui/` +- Following established naming conventions +- Including proper TypeScript definitions + +## 🚀 Deployment + +### Docker Deployment + +```dockerfile +FROM node:18-alpine AS builder +WORKDIR /app +COPY package*.json ./ +RUN npm ci +COPY . . +RUN npm run build + +FROM node:18-alpine AS runtime +WORKDIR /app +COPY --from=builder /app/.output ./.output +EXPOSE 3000 +CMD ["node", ".output/server/index.mjs"] +``` + +### Environment Variables + +Production deployment requires these environment variables: + +- `API_BASE_URL`: RustFS backend API endpoint +- `SERVER_HOST`: RustFS server host +- `BASE_URL`: Application base path +- `NODE_ENV`: Set to `production` + +### Build Optimization + +For optimal production builds: +- Enable gzip/brotli compression +- Configure proper caching headers +- Use CDN for static assets +- Monitor bundle size and performance + +## 🤝 Contributing + +We welcome contributions! Please follow our contribution guidelines: + +### Development Workflow + +1. **Fork** the repository +2. **Clone** your fork locally +3. **Create** a feature branch: `git checkout -b feature/amazing-feature` +4. **Install** dependencies: `npm install` +5. **Make** your changes following our coding standards +6. **Test** your changes: `npm run type-check && npm run lint` +7. **Commit** your changes: `git commit -m 'feat: add amazing feature'` +8. **Push** to your branch: `git push origin feature/amazing-feature` +9. **Submit** a Pull Request + +### Coding Standards + +- **TypeScript**: Use TypeScript for all new code +- **Vue 3**: Use Composition API and ` - -
-
- -
-
-
- {{ serverConfig.protocol }}://{{ serverConfig.host }}:{{ serverConfig.port }} - {{ serverConfig.region }} -
- -
-
- - -
- -
- - - {{ t('Server Configuration') }} - - -
- - -
-
- {{ configAlert }} -
- -
-
- - -
{{ urlError }}
-
- -
- - -
-
-
-
-
-
-