create-fullstack-scaffold 0.4.9 → 0.4.10

package/template/src/admin/pages/RolesPage.tsx

@@ -23,17 +23,19 @@ import {
 import { useRoleStore } from '../hooks/useRoles'
 import { useConfig, usePermissionCategories } from '../hooks/useConfig'
 import { usePermissions } from '../hooks/usePermissions'
-import type { RoleType, CreateRoleType } from '@shared/modules/role/schemas'
+import type { RoleDataType, CreateRoleType } from '@shared/modules/role/schemas'
 import { PermissionConfigEditor } from '../components/PermissionConfigEditor'
 import { PermissionTree } from '../components/PermissionTree'
 import { apiClient } from '../services/apiClient'
 import { validatePermissionDependencies } from '@shared/modules/permission/permission-dependencies'
+import { useLanguage } from '../i18n/useLanguage'
 
 type RoleFormValues = Pick<CreateRoleType, 'code' | 'name' | 'label' | 'description'> & {
   isActive?: boolean | null
 }
 
 export const RolesPage: React.FC = () => {
+  const { t } = useLanguage()
   const { roles, loading, fetchRoles, createRole, updateRole, deleteRole, updateRolePermissions } =
     useRoleStore()
   const { permissions } = useConfig()
@@ -41,7 +43,7 @@ export const RolesPage: React.FC = () => {
   const { refreshPermissions } = usePermissions()
   const [modalVisible, setModalVisible] = useState(false)
   const [permissionModalVisible, setPermissionModalVisible] = useState(false)
-  const [editingRole, setEditingRole] = useState<RoleType | null>(null)
+  const [editingRole, setEditingRole] = useState<RoleDataType | null>(null)
   const [selectedPermissions, setSelectedPermissions] = useState<string[]>([])
   const [form] = Form.useForm<RoleFormValues>()
 
@@ -55,7 +57,7 @@ export const RolesPage: React.FC = () => {
     setModalVisible(true)
   }
 
-  const handleEdit = (role: RoleType) => {
+  const handleEdit = (role: RoleDataType) => {
     setEditingRole(role)
     form.setFieldsValue({
       code: role.code,
@@ -70,11 +72,11 @@ export const RolesPage: React.FC = () => {
   const handleDelete = async (id: string) => {
     const success = await deleteRole(id)
     if (success) {
-      message.success('角色删除成功')
+      message.success(t('roles.deleted'))
     }
   }
 
-  const handleManagePermissions = async (role: RoleType) => {
+  const handleManagePermissions = async (role: RoleDataType) => {
     setEditingRole(role)
 
     try {
@@ -103,13 +105,13 @@ export const RolesPage: React.FC = () => {
       if (editingRole) {
         const success = await updateRole(editingRole.id, values)
         if (success) {
-          message.success('角色更新成功')
+          message.success(t('roles.updated'))
           setModalVisible(false)
         }
       } else {
         const success = await createRole(values)
         if (success) {
-          message.success('角色创建成功')
+          message.success(t('roles.created'))
           setModalVisible(false)
         }
       }
@@ -124,10 +126,10 @@ export const RolesPage: React.FC = () => {
     const validation = validatePermissionDependencies(selectedPermissions)
     if (!validation.valid) {
       Modal.error({
-        title: '权限依赖校验失败',
+        title: t('roles.permissionValidationFailed'),
         content: (
           <div>
-            <p>以下权限配置存在问题：</p>
+            <p>{t('roles.permissionValidationErrors')}</p>
             <ul>
               {validation.errors.map((error, index) => (
                 <li key={index}>{error}</li>
@@ -141,7 +143,7 @@ export const RolesPage: React.FC = () => {
 
     const success = await updateRolePermissions(editingRole.id, selectedPermissions)
     if (success) {
-      message.success('权限更新成功')
+      message.success(t('roles.permissionUpdated'))
       setPermissionModalVisible(false)
       await refreshPermissions()
     }
@@ -149,45 +151,45 @@ export const RolesPage: React.FC = () => {
 
   const columns = [
     {
-      title: '角色代码',
+      title: t('roles.roleCode'),
       dataIndex: 'code',
       key: 'code',
     },
     {
-      title: '角色名称',
+      title: t('roles.roleName'),
       dataIndex: 'name',
       key: 'name',
     },
     {
-      title: '显示名称',
+      title: t('roles.displayName'),
       dataIndex: 'label',
       key: 'label',
     },
     {
-      title: '描述',
+      title: t('roles.description'),
       dataIndex: 'description',
       key: 'description',
     },
     {
-      title: '系统角色',
+      title: t('roles.isSystem'),
       dataIndex: 'isSystem',
       key: 'isSystem',
       render: (isSystem: boolean) => (
-        <Tag color={isSystem ? 'blue' : 'default'}>{isSystem ? '是' : '否'}</Tag>
+        <Tag color={isSystem ? 'blue' : 'default'}>{isSystem ? t('common.yes') : t('common.no')}</Tag>
       ),
     },
     {
-      title: '状态',
+      title: t('common.status'),
       dataIndex: 'isActive',
       key: 'isActive',
       render: (isActive: boolean) => (
-        <Tag color={isActive ? 'green' : 'red'}>{isActive ? '启用' : '禁用'}</Tag>
+        <Tag color={isActive ? 'green' : 'red'}>{isActive ? t('common.enabled') : t('common.disabled')}</Tag>
       ),
     },
     {
-      title: '操作',
+      title: t('common.actions'),
       key: 'action',
-      render: (_: unknown, record: RoleType) => (
+      render: (_: unknown, record: RoleDataType) => (
         <Space>
           {record.code !== 'super_admin' && (
             <Button
@@ -195,21 +197,21 @@ export const RolesPage: React.FC = () => {
               icon={<KeyOutlined />}
               onClick={() => handleManagePermissions(record)}
             >
-              权限
+              {t('roles.permissions')}
             </Button>
           )}
           <Button type="link" icon={<EditOutlined />} onClick={() => handleEdit(record)}>
-            编辑
+            {t('common.edit')}
           </Button>
           {!record.isSystem && (
             <Popconfirm
-              title="确定要删除这个角色吗？"
+              title={t('roles.deleteConfirm')}
               onConfirm={() => handleDelete(record.id)}
-              okText="确定"
-              cancelText="取消"
+              okText={t('common.confirm')}
+              cancelText={t('common.cancel')}
             >
               <Button type="link" danger icon={<DeleteOutlined />}>
-                删除
+                {t('common.delete')}
               </Button>
             </Popconfirm>
           )}
@@ -221,67 +223,67 @@ export const RolesPage: React.FC = () => {
   return (
     <div style={{ padding: '24px' }}>
       <div style={{ marginBottom: '16px', display: 'flex', justifyContent: 'space-between' }}>
-        <h1>角色管理</h1>
+        <h1>{t('roles.title')}</h1>
         <Button type="primary" icon={<PlusOutlined />} onClick={handleCreate}>
-          创建角色
+          {t('roles.createRole')}
         </Button>
       </div>
 
       <Table columns={columns} dataSource={roles} rowKey="id" loading={loading} />
 
       <Modal
-        title={editingRole ? '编辑角色' : '创建角色'}
+        title={editingRole ? t('roles.editRole') : t('roles.createRole')}
         open={modalVisible}
         onOk={handleSubmit}
         onCancel={() => setModalVisible(false)}
-        okText="确定"
-        cancelText="取消"
+        okText={t('common.confirm')}
+        cancelText={t('common.cancel')}
       >
         <Form form={form} layout="vertical">
           <Form.Item
             name="code"
-            label="角色代码"
-            rules={[{ required: true, message: '请输入角色代码' }]}
+            label={t('roles.roleCode')}
+            rules={[{ required: true, message: t('roles.roleCodeRequired') }]}
           >
-            <Input disabled={!!editingRole} placeholder="请输入角色代码，如：manager" />
+            <Input disabled={!!editingRole} placeholder={t('roles.roleCodePlaceholder')} />
           </Form.Item>
 
           <Form.Item
             name="name"
-            label="角色名称"
-            rules={[{ required: true, message: '请输入角色名称' }]}
+            label={t('roles.roleName')}
+            rules={[{ required: true, message: t('roles.roleNameRequired') }]}
           >
-            <Input placeholder="请输入角色名称" />
+            <Input placeholder={t('roles.roleNamePlaceholder')} />
           </Form.Item>
 
           <Form.Item
             name="label"
-            label="显示名称"
-            rules={[{ required: true, message: '请输入显示名称' }]}
+            label={t('roles.displayName')}
+            rules={[{ required: true, message: t('roles.displayNameRequired') }]}
           >
-            <Input placeholder="请输入显示名称" />
+            <Input placeholder={t('roles.displayNamePlaceholder')} />
           </Form.Item>
 
-          <Form.Item name="description" label="描述">
-            <Input.TextArea placeholder="请输入角色描述" />
+          <Form.Item name="description" label={t('roles.description')}>
+            <Input.TextArea placeholder={t('roles.descriptionPlaceholder')} />
           </Form.Item>
 
           {editingRole && (
-            <Form.Item name="isActive" label="状态" valuePropName="checked">
-              <Switch checkedChildren="启用" unCheckedChildren="禁用" />
+            <Form.Item name="isActive" label={t('common.status')} valuePropName="checked">
+              <Switch checkedChildren={t('common.enabled')} unCheckedChildren={t('common.disabled')} />
             </Form.Item>
           )}
         </Form>
       </Modal>
 
       <Modal
-        title={`管理角色权限 - ${editingRole?.label || ''}`}
+        title={t('roles.managePermissions', { name: editingRole?.label || '' })}
         open={permissionModalVisible}
         onOk={handlePermissionSubmit}
         onCancel={() => setPermissionModalVisible(false)}
         width={900}
-        okText="保存"
-        cancelText="取消"
+        okText={t('common.save')}
+        cancelText={t('common.cancel')}
       >
         <Tabs
           defaultActiveKey="tree"
@@ -291,7 +293,7 @@ export const RolesPage: React.FC = () => {
               label: (
                 <span>
                   <ApartmentOutlined />
-                  树状选择
+                  {t('roles.treeView')}
                 </span>
               ),
               children: (
@@ -308,7 +310,7 @@ export const RolesPage: React.FC = () => {
               label: (
                 <span>
                   <CodeOutlined />
-                  JSON编辑
+                  {t('roles.jsonView')}
                 </span>
               ),
               children: (

package/template/src/admin/pages/SettingsPage.tsx

@@ -1,4 +1,5 @@
 import { Card, Form, Input, Button, Switch, Divider, message } from 'antd'
+import { useLanguage } from '../i18n/useLanguage'
 
 interface SettingsFormValues {
   siteName?: string
@@ -9,62 +10,61 @@ interface SettingsFormValues {
 }
 
 export const SettingsPage: React.FC = () => {
+  const { t } = useLanguage()
   const [form] = Form.useForm<SettingsFormValues>()
 
   const handleSave = () => {
-    message.success('Settings saved successfully!')
+    message.success(t('settings.saved'))
   }
 
   return (
     <div>
-      <h1 className="text-2xl font-bold text-gray-900 mb-6">Settings</h1>
+      <h1 className="text-2xl font-bold text-gray-900 mb-6">{t('settings.title')}</h1>
 
-      <Card title="General Settings" className="mb-6">
+      <Card title={t('settings.general')} className="mb-6">
         <Form form={form} layout="vertical">
-          <Form.Item label="Site Name" name="siteName">
-            <Input placeholder="Enter site name" />
+          <Form.Item label={t('settings.siteName')} name="siteName">
+            <Input placeholder={t('settings.siteNamePlaceholder')} />
           </Form.Item>
-          <Form.Item label="Site Description" name="siteDescription">
-            <Input.TextArea rows={4} placeholder="Enter site description" />
+          <Form.Item label={t('settings.siteDescription')} name="siteDescription">
+            <Input.TextArea rows={4} placeholder={t('settings.siteDescriptionPlaceholder')} />
           </Form.Item>
         </Form>
       </Card>
 
-      <Card title="Notification Settings" className="mb-6">
+      <Card title={t('settings.notification')} className="mb-6">
         <div className="space-y-4">
           <div className="flex items-center justify-between">
             <div>
-              <p className="font-medium">Email Notifications</p>
-              <p className="text-sm text-gray-500">
-                Receive email notifications for important updates
-              </p>
+              <p className="font-medium">{t('settings.emailNotifications')}</p>
+              <p className="text-sm text-gray-500">{t('settings.emailNotificationsDesc')}</p>
             </div>
             <Switch defaultChecked />
           </div>
           <Divider />
           <div className="flex items-center justify-between">
             <div>
-              <p className="font-medium">Push Notifications</p>
-              <p className="text-sm text-gray-500">Receive push notifications in browser</p>
+              <p className="font-medium">{t('settings.pushNotifications')}</p>
+              <p className="text-sm text-gray-500">{t('settings.pushNotificationsDesc')}</p>
             </div>
             <Switch />
           </div>
         </div>
       </Card>
 
-      <Card title="Security Settings">
+      <Card title={t('settings.security')}>
         <Form form={form} layout="vertical">
-          <Form.Item label="Current Password" name="currentPassword">
-            <Input.Password placeholder="Enter current password" />
+          <Form.Item label={t('settings.currentPassword')} name="currentPassword">
+            <Input.Password placeholder={t('settings.currentPasswordPlaceholder')} />
           </Form.Item>
-          <Form.Item label="New Password" name="newPassword">
-            <Input.Password placeholder="Enter new password" />
+          <Form.Item label={t('settings.newPassword')} name="newPassword">
+            <Input.Password placeholder={t('settings.newPasswordPlaceholder')} />
           </Form.Item>
-          <Form.Item label="Confirm New Password" name="confirmPassword">
-            <Input.Password placeholder="Confirm new password" />
+          <Form.Item label={t('settings.confirmNewPassword')} name="confirmPassword">
+            <Input.Password placeholder={t('settings.confirmNewPasswordPlaceholder')} />
           </Form.Item>
           <Button type="primary" onClick={handleSave}>
-            Save Changes
+            {t('settings.saveChanges')}
           </Button>
         </Form>
       </Card>

package/template/src/admin/pages/SystemLogsPage.tsx

@@ -12,10 +12,12 @@ import {
   type ResourceType,
   type ActionType,
 } from '@shared/constants'
+import { useLanguage } from '../i18n/useLanguage'
 
 const { Option } = Select
 
 export const SystemLogsPage: React.FC = () => {
+  const { t, formatDate } = useLanguage()
   const { logs, loading, fetchLogs } = useAuditLogStore()
   const [selectedLog, setSelectedLog] = useState<AuditLogType | null>(null)
   const [detailModalVisible, setDetailModalVisible] = useState(false)
@@ -62,20 +64,20 @@ export const SystemLogsPage: React.FC = () => {
 
   const columns = [
     {
-      title: '时间',
+      title: t('systemLogs.time'),
       dataIndex: 'createdAt',
       key: 'createdAt',
       width: 180,
-      render: (date: string) => new Date(date).toLocaleString('zh-CN'),
+      render: (date: string) => formatDate(date),
     },
     {
-      title: '用户ID',
+      title: t('systemLogs.userId'),
       dataIndex: 'userId',
       key: 'userId',
       width: 120,
     },
     {
-      title: '操作',
+      title: t('systemLogs.action'),
       dataIndex: 'action',
       key: 'action',
       width: 100,
@@ -84,33 +86,33 @@ export const SystemLogsPage: React.FC = () => {
       ),
     },
     {
-      title: '资源类型',
+      title: t('systemLogs.resourceType'),
       dataIndex: 'resourceType',
       key: 'resourceType',
       width: 120,
       render: (type: ResourceType) => RESOURCE_LABELS[type] || type,
     },
     {
-      title: '资源ID',
+      title: t('systemLogs.resourceId'),
       dataIndex: 'resourceId',
       key: 'resourceId',
       width: 150,
       render: (id: string | null) => id || '-',
     },
     {
-      title: 'IP地址',
+      title: t('systemLogs.ipAddress'),
       dataIndex: 'ipAddress',
       key: 'ipAddress',
       width: 140,
       render: (ip: string | null) => ip || '-',
     },
     {
-      title: '操作',
-      key: 'action',
+      title: t('common.actions'),
+      key: 'actionCol',
       width: 100,
       render: (_: unknown, record: AuditLogType) => (
         <Button type="link" icon={<EyeOutlined />} onClick={() => handleViewDetail(record)}>
-          详情
+          {t('common.detail')}
         </Button>
       ),
     },
@@ -119,22 +121,22 @@ export const SystemLogsPage: React.FC = () => {
   return (
     <div style={{ padding: '24px' }}>
       <Card
-        title="系统日志"
+        title={t('systemLogs.title')}
         extra={
           <Button icon={<ReloadOutlined />} onClick={() => fetchLogs()}>
-            刷新
+            {t('common.refresh')}
           </Button>
         }
       >
         <Space style={{ marginBottom: '16px' }} wrap>
           <Input
-            placeholder="用户ID"
+            placeholder={t('systemLogs.userId')}
             value={filters.userId}
             onChange={e => setFilters({ ...filters, userId: e.target.value })}
             style={{ width: 150 }}
           />
           <Select
-            placeholder="操作类型"
+            placeholder={t('systemLogs.actionType')}
             value={filters.action || undefined}
             onChange={value => setFilters({ ...filters, action: (value || '') as ActionType | '' })}
             style={{ width: 120 }}
@@ -147,7 +149,7 @@ export const SystemLogsPage: React.FC = () => {
             ))}
           </Select>
           <Select
-            placeholder="资源类型"
+            placeholder={t('systemLogs.resourceType')}
             value={filters.resourceType || undefined}
             onChange={value =>
               setFilters({ ...filters, resourceType: (value || '') as ResourceType | '' })
@@ -162,9 +164,9 @@ export const SystemLogsPage: React.FC = () => {
             ))}
           </Select>
           <Button type="primary" icon={<SearchOutlined />} onClick={handleSearch}>
-            搜索
+            {t('common.search')}
           </Button>
-          <Button onClick={handleReset}>重置</Button>
+          <Button onClick={handleReset}>{t('common.reset')}</Button>
         </Space>
 
         <Table
@@ -175,13 +177,13 @@ export const SystemLogsPage: React.FC = () => {
           pagination={{
             pageSize: 20,
             showSizeChanger: true,
-            showTotal: total => `共 ${total} 条记录`,
+            showTotal: total => t('common.totalRecords', { count: total }),
           }}
         />
       </Card>
 
       <Modal
-        title="日志详情"
+        title={t('systemLogs.detail')}
         open={detailModalVisible}
         onCancel={() => setDetailModalVisible(false)}
         footer={null}
@@ -189,31 +191,31 @@ export const SystemLogsPage: React.FC = () => {
       >
         {selectedLog && (
           <Descriptions column={1} bordered>
-            <Descriptions.Item label="日志ID">{selectedLog.id}</Descriptions.Item>
-            <Descriptions.Item label="用户ID">{selectedLog.userId}</Descriptions.Item>
-            <Descriptions.Item label="操作">
+            <Descriptions.Item label={t('systemLogs.logId')}>{selectedLog.id}</Descriptions.Item>
+            <Descriptions.Item label={t('systemLogs.userId')}>{selectedLog.userId}</Descriptions.Item>
+            <Descriptions.Item label={t('systemLogs.action')}>
               <Tag color={ACTION_COLORS[selectedLog.action] || 'default'}>
                 {ACTION_LABELS[selectedLog.action] || selectedLog.action}
               </Tag>
             </Descriptions.Item>
-            <Descriptions.Item label="资源类型">
+            <Descriptions.Item label={t('systemLogs.resourceType')}>
               {RESOURCE_LABELS[selectedLog.resourceType] || selectedLog.resourceType}
             </Descriptions.Item>
-            <Descriptions.Item label="资源ID">{selectedLog.resourceId || '-'}</Descriptions.Item>
-            <Descriptions.Item label="IP地址">{selectedLog.ipAddress || '-'}</Descriptions.Item>
-            <Descriptions.Item label="User Agent">{selectedLog.userAgent || '-'}</Descriptions.Item>
-            <Descriptions.Item label="时间">
-              {new Date(selectedLog.createdAt).toLocaleString('zh-CN')}
+            <Descriptions.Item label={t('systemLogs.resourceId')}>{selectedLog.resourceId || '-'}</Descriptions.Item>
+            <Descriptions.Item label={t('systemLogs.ipAddress')}>{selectedLog.ipAddress || '-'}</Descriptions.Item>
+            <Descriptions.Item label={t('systemLogs.userAgent')}>{selectedLog.userAgent || '-'}</Descriptions.Item>
+            <Descriptions.Item label={t('systemLogs.time')}>
+              {formatDate(selectedLog.createdAt)}
             </Descriptions.Item>
             {selectedLog.oldValue && (
-              <Descriptions.Item label="旧值">
+              <Descriptions.Item label={t('systemLogs.oldValue')}>
                 <pre style={{ margin: 0, maxHeight: '200px', overflow: 'auto' }}>
                   {safeFormatJson(selectedLog.oldValue)}
                 </pre>
               </Descriptions.Item>
             )}
             {selectedLog.newValue && (
-              <Descriptions.Item label="新值">
+              <Descriptions.Item label={t('systemLogs.newValue')}>
                 <pre style={{ margin: 0, maxHeight: '200px', overflow: 'auto' }}>
                   {safeFormatJson(selectedLog.newValue)}
                 </pre>