style(web): translate the comments in the src/views directory into English

web/src/views/UserManagement/components/CreateModal.tsx

@@ -1,3 +1,14 @@
+/*
+ * @Author: ZhaoYing 
+ * @Date: 2026-02-03 17:51:40 
+ * @Last Modified by:   ZhaoYing 
+ * @Last Modified time: 2026-02-03 17:51:40 
+ */
+/**
+ * Create User Modal
+ * Modal for creating new user with email, username, and password
+ */
+
 import { forwardRef, useImperativeHandle, useState } from 'react';
 import { Form, Input, App } from 'antd';
 import { useTranslation } from 'react-i18next';
@@ -8,6 +19,9 @@ import { addUser } from '@/api/user'
 
 const FormItem = Form.Item;
 
+/**
+ * Component props
+ */
 interface CreateModalProps {
   refreshTable: () => void;
 }
@@ -23,18 +37,19 @@ const CreateModal = forwardRef<CreateModalRef, CreateModalProps>(({
 
   const values = Form.useWatch([], form);
 
-  // 封装取消方法，添加关闭弹窗逻辑
+  /** Close modal and reset form */
   const handleClose = () => {
     setVisible(false);
     form.resetFields();
     setLoading(false)
   };
 
+  /** Open modal */
   const handleOpen = () => {
     form.resetFields();
     setVisible(true);
   };
-  // 封装保存方法，添加提交逻辑
+  /** Save user */
   const handleSave = () => {
     form
       .validateFields()
@@ -56,7 +71,7 @@ const CreateModal = forwardRef<CreateModalRef, CreateModalProps>(({
       });
   }
 
-  // 暴露给父组件的方法
+  /** Expose methods to parent component */
   useImperativeHandle(ref, () => ({
     handleOpen,
     handleClose

web/src/views/UserManagement/components/ResetPasswordModal.tsx

@@ -1,10 +1,21 @@
+/*
+ * @Author: ZhaoYing 
+ * @Date: 2026-02-03 17:51:29 
+ * @Last Modified by:   ZhaoYing 
+ * @Last Modified time: 2026-02-03 17:51:29 
+ */
+/**
+ * Reset Password Modal
+ * Modal for resetting user password with auto-generate option
+ */
+
 import { forwardRef, useImperativeHandle, useState } from 'react';
 import { Form, Input, App, Button, Row, Col } from 'antd';
 import { useTranslation } from 'react-i18next';
 import copy from 'copy-to-clipboard'
+
 import { randomString } from '@/utils/common'
 import { useUser } from '@/store/user';
-
 import type { ResetPasswordModalRef, User } from '../types'
 import RbModal from '@/components/RbModal'
 import { changePassword } from '@/api/user'
@@ -20,19 +31,20 @@ const ResetPasswordModal = forwardRef<ResetPasswordModalRef, { source?: 'resetPa
 
   const values = Form.useWatch([], form);
 
-  // 封装取消方法，添加关闭弹窗逻辑
+  /** Close modal and reset form */
   const handleClose = () => {
     setVisible(false);
     form.resetFields();
     setLoading(false)
   };
 
+  /** Open modal with user data */
   const handleOpen = (user: User) => {
     form.resetFields();
     setEditVo(user)
     setVisible(true);
   };
-  // 封装保存方法，添加提交逻辑
+  /** Save new password */
   const handleSave = () => {
     form
       .validateFields()
@@ -69,12 +81,12 @@ const ResetPasswordModal = forwardRef<ResetPasswordModalRef, { source?: 'resetPa
         console.log('err', err)
       });
   }
-  // 自动生成长度为12的随机密码，包含字母、数字、特殊字符
+  /** Auto-generate random password (12 chars with letters, numbers, special chars) */
   const handleAutoGenerate = () => {
     form.setFieldValue('new_password', randomString());
   }
 
-  // 暴露给父组件的方法
+  /** Expose methods to parent component */
   useImperativeHandle(ref, () => ({
     handleOpen,
     handleClose

web/src/views/UserManagement/index.tsx

@@ -1,9 +1,21 @@
+/*
+ * @Author: ZhaoYing 
+ * @Date: 2026-02-03 17:51:08 
+ * @Last Modified by:   ZhaoYing 
+ * @Last Modified time: 2026-02-03 17:51:08 
+ */
+/**
+ * User Management Page
+ * Manages users with create, enable/disable, and password reset capabilities
+ */
+
 import React, { useRef } from 'react';
 import { Button, Space, App } from 'antd';
 import { useTranslation } from 'react-i18next';
+import type { ColumnsType } from 'antd/es/table';
+
 import CreateModal from './components/CreateModal';
 import type { CreateModalRef, User, ResetPasswordModalRef } from './types'
-import type { ColumnsType } from 'antd/es/table';
 import Table, { type TableRef } from '@/components/Table'
 import StatusTag from '@/components/StatusTag'
 import { deleteUser, enableUser, getUserListUrl } from '@/api/user'
@@ -18,21 +30,21 @@ const UserManagement: React.FC = () => {
   const resetPasswordModalRef = useRef<ResetPasswordModalRef>(null);
   const tableRef = useRef<TableRef>(null);
 
-  // 打开新增用户弹窗
+  /** Open create user modal */
   const handleCreate = () => {
     userFormRef.current?.handleOpen();
   }
-  // 重置密码
+  /** Reset user password */
   const handleResetPassword = (user: User) => {
     resetPasswordModalRef.current?.handleOpen(user);
   };
 
-  // 刷新列表数据
+  /** Refresh table data */
   const refreshTable = () => {
     tableRef.current?.loadData()
   }
 
-  // 启用/停用
+  /** Enable/disable user */
   const handleChangeStatus = async (record: User) => {
     modal.confirm({
       title: t(`user.${record.is_active ? 'disabled' : 'enabled'}Confirm`),
@@ -50,7 +62,7 @@ const UserManagement: React.FC = () => {
     })
   };
 
-  // 表格列配置
+  /** Table column configuration */
   const columns: ColumnsType = [
     {
       title: t('user.userId'),
@@ -124,7 +136,7 @@ const UserManagement: React.FC = () => {
 
   return (
     <div className="rb:h-[calc(100vh-80px)] rb:overflow-hidden">
-      <div className="rb:flex rb:justify-end rb:mb-[12px]">
+      <div className="rb:flex rb:justify-end rb:mb-3">
         <Button type="primary" onClick={handleCreate}>
           {t('user.createUser')}
         </Button>

web/src/views/UserManagement/types.ts

@@ -1,4 +1,12 @@
-// 用户数据类型
+/*
+ * @Author: ZhaoYing 
+ * @Date: 2026-02-03 17:50:56 
+ * @Last Modified by: ZhaoYing
+ * @Last Modified time: 2026-02-03 17:51:17
+ */
+/**
+ * User data type
+ */
 export interface User {
   username: string;
   email: string;
@@ -13,23 +21,32 @@ export interface User {
   [key: string]: unknown;
 }
 
-// 用户表单数据类型
+/**
+ * User form data type
+ */
 export interface CreateModalData {
   email: string;
   username: string;
   password: string;
 }
 
-// 用户表单数据类型
+/**
+ * User form data type (duplicate definition)
+ */
 export interface CreateModalData {
   username: string;
   displayName: string;
   initialPassword?: string;
 }
-// 定义组件暴露的方法接口
+/**
+ * Component exposed methods interface
+ */
 export interface CreateModalRef {
   handleOpen: () => void;
 }
+/**
+ * Reset password modal ref interface
+ */
 export interface ResetPasswordModalRef {
   handleOpen: (user: User) => void;
 }