nsgm-cli 2.1.14 → 2.1.15

package/pages/login.tsx

@@ -2,10 +2,15 @@ import MarkdownIt from 'markdown-it'
 import _ from 'lodash'
 import { LoginContainer } from '../client/styled/common'
 // import getConfig from 'next/config'
-import React, { useState } from 'react'
+import React, { useState, useEffect } from 'react'
 import { Input, Button, Form, Typography, message } from 'antd'
 import { UserOutlined, LockOutlined } from '@ant-design/icons'
 import { directLogin } from '../client/utils/sso'
+import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
+import { useTranslation } from 'next-i18next'
+import { useRouter } from 'next/router'
+import LanguageSwitcher from '@/components/LanguageSwitcher'
+import { navigateToHome } from '@/utils/navigation'
 
 const md = new MarkdownIt({
   html: true,
@@ -19,11 +24,18 @@ const md = new MarkdownIt({
 
 const renderArr: any = []
 
-renderArr.push('Login')
+renderArr.push('NSGM')
 
 const Page = ({ html }) => {
+  const { t } = useTranslation(['login'])
+  const router = useRouter()
   const [userName, setUserName] = useState('')
   const [userPassword, setUserPassword] = useState('')
+  const [mounted, setMounted] = useState(false)
+
+  useEffect(() => {
+    setMounted(true)
+  }, [])
 
   const createMarkup = () => {
     return {
@@ -32,35 +44,36 @@ const Page = ({ html }) => {
   }
 
   const doLogin = () => {
-    if (typeof window !== 'undefined') {
-      if (userName === '') {
-        message.error('请输入用户名')
-        return
-      }
-      if (userPassword === '') {
-        message.error('请输入密码')
-        return
+    if (!mounted || typeof window === 'undefined') return
+
+    if (userName === '') {
+      message.error(t('login:login.errors.usernameRequired'))
+      return
+    }
+    if (userPassword === '') {
+      message.error(t('login:login.errors.passwordRequired'))
+      return
+    }
+
+    const result = directLogin(userName, userPassword, (user) => {
+      if (user && mounted) {
+        // 跳转到首页，保持当前语言设置，强制添加语言前缀避免自动检测
+        navigateToHome(router, true)
       }
+    })
 
-      const result = directLogin(userName, userPassword, (user) => {
-        if (user) {
-          window.location.href = window.location.origin
+    // 检查是否是 Promise
+    if (result && typeof (result as any).then === 'function') {
+      ;(result as Promise<any>).then((loginResult) => {
+        if (!loginResult.success) {
+          message.error(loginResult.message)
         }
       })
-
-      // 检查是否是 Promise
-      if (result && typeof (result as any).then === 'function') {
-        ;(result as Promise<any>).then((loginResult) => {
-          if (!loginResult.success) {
-            message.error(loginResult.message)
-          }
-        })
-      } else {
-        // 直接返回的结果
-        const syncResult = result as { success: boolean; message?: string }
-        if (!syncResult.success) {
-          message.error(syncResult.message || '登录失败')
-        }
+    } else {
+      // 直接返回的结果
+      const syncResult = result as { success: boolean; message?: string }
+      if (!syncResult.success) {
+        message.error(syncResult.message || t('login:login.errors.loginFailed'))
       }
     }
   }
@@ -75,15 +88,18 @@ const Page = ({ html }) => {
 
   return (
     <LoginContainer>
+      <div style={{ position: 'absolute', top: '20px', right: '20px' }}>
+        <LanguageSwitcher />
+      </div>
       <div dangerouslySetInnerHTML={createMarkup()} />
       <Typography.Title level={3} style={{ textAlign: 'center', marginBottom: 24 }}>
-        系统登录
+        {t('login:login.title')}
       </Typography.Title>
       <Form layout="vertical" style={{ width: '100%' }}>
         <Form.Item>
           <Input
             prefix={<UserOutlined style={{ color: 'rgba(0,0,0,.25)' }} />}
-            placeholder="用户名"
+            placeholder={t('login:login.username')}
             size="large"
             value={userName}
             onChange={doChangeName}
@@ -93,7 +109,7 @@ const Page = ({ html }) => {
         <Form.Item>
           <Input.Password
             prefix={<LockOutlined style={{ color: 'rgba(0,0,0,.25)' }} />}
-            placeholder="密码"
+            placeholder={t('login:login.password')}
             size="large"
             value={userPassword}
             onChange={doChangePassword}
@@ -102,7 +118,7 @@ const Page = ({ html }) => {
         </Form.Item>
         <Form.Item>
           <Button type="primary" onClick={doLogin} size="large" block>
-            登录
+            {t('login:login.loginButton')}
           </Button>
         </Form.Item>
       </Form>
@@ -110,15 +126,24 @@ const Page = ({ html }) => {
   )
 }
 
-Page.getInitialProps = () => {
+export const getServerSideProps = async ({ locale }) => {
+  // 确保 locale 有默认值，避免 serverSideTranslations 报错
+  const currentLocale = locale || 'zh-CN'
+
+  // 处理 markdown 内容
   let html = ''
   _.each(renderArr, (item) => {
     html += md.render(item)
   })
 
   return {
-    html,
+    props: {
+      html,
+      ...(await serverSideTranslations(currentLocale, ['common', 'layout', 'login'])),
+    },
   }
 }
 
+Page.displayName = 'LoginPage'
+
 export default Page

package/pages/template/manage.tsx

@@ -1,7 +1,18 @@
 import React, { useState, useEffect } from 'react'
-import { ConfigProvider, Table, Modal, Button, Input, Space, Upload, message } from 'antd'
-import { Container, SearchRow, ModalContainer } from '@/styled/template/manage'
-import styled from 'styled-components'
+import { ConfigProvider, Modal, Space, Upload, message } from 'antd'
+import {
+  Container,
+  SearchRow,
+  ModalContainer,
+  StyledButton,
+  StyledInput,
+  StyledTable,
+  ModalTitle,
+  ModalInput,
+  IconWrapper,
+  RoundedButton,
+  GlobalStyle,
+} from '@/styled/template/manage'
 import { useDispatch, useSelector } from 'react-redux'
 import {
   addTemplate,
@@ -14,7 +25,9 @@ import {
 import { getTemplateService } from '@/service/template/manage'
 import { RootState, AppDispatch } from '@/redux/store'
 import _ from 'lodash'
-import locale from 'antd/lib/locale/zh_CN'
+import { useTranslation } from 'next-i18next'
+import { getAntdLocale } from '@/utils/i18n'
+import { useRouter } from 'next/router'
 import { handleXSS, checkModalObj } from '@/utils/common'
 import { UploadOutlined } from '@ant-design/icons'
 import ExcelJS from 'exceljs'
@@ -23,78 +36,10 @@ import { createCSRFUploadProps } from '@/utils/fetch'
 
 const pageSize = 100
 
-const keyTitles = {
-  name: '名称',
-}
-
-// styled-components
-const StyledButton = styled(Button)<{ $primary?: boolean; $export?: boolean; $import?: boolean; $danger?: boolean }>`
-  display: flex;
-  align-items: center;
-  border-radius: 6px;
-  box-shadow: 0 2px 0 rgba(0, 0, 0, 0.045);
-  ${(props) =>
-    props.$export &&
-    `
-      background-color: #f6ffed;
-      color: #52c41a;
-      border-color: #b7eb8f;
-      box-shadow: 0 2px 0 rgba(0, 0, 0, 0.015);
-      transition: all 0.3s ease;
-    `}
-  ${(props) =>
-    props.$import &&
-    `
-      background-color: #e6f7ff;
-      color: #1890ff;
-      border-color: #91d5ff;
-      box-shadow: 0 2px 0 rgba(0, 0, 0, 0.015);
-      transition: all 0.3s ease;
-    `}
-    ${(props) =>
-    props.$danger &&
-    `
-      background-color: #fff1f0;
-      border-color: #ffa39e;
-      box-shadow: 0 2px 0 rgba(0, 0, 0, 0.015);
-      transition: all 0.3s ease;
-    `}
-`
-const StyledInput = styled(Input)`
-  width: 200px;
-  border-radius: 6px;
-  box-shadow: 0 2px 0 rgba(0, 0, 0, 0.015);
-`
-const StyledTable = styled(Table)`
-  margin-top: 16px;
-  border-radius: 8px;
-  overflow: hidden;
-
-  .styled-pagination {
-    margin-top: 16px;
-    margin-bottom: 16px;
-  }
-`
-const ModalTitle = styled.div`
-  color: #1890ff;
-  font-weight: 500;
-`
-const ModalInput = styled(Input)`
-  border-radius: 4px;
-`
-const IconWrapper = styled.i`
-  margin-right: 5px;
-`
-const RoundedButton = styled(Button)`
-  border-radius: 4px;
-`
-const GlobalStyle = styled.div`
-  .rounded-button {
-    border-radius: 4px;
-  }
-`
-
 const Page = ({ template }) => {
+  const { t } = useTranslation(['common', 'template'])
+  const router = useRouter()
+  const antdLocale = getAntdLocale(router.locale || 'zh-CN')
   const dispatch = useDispatch<AppDispatch>()
   const [isModalVisiable, setIsModalVisible] = useState(false)
   const [modalId, setModalId] = useState(0)
@@ -102,10 +47,39 @@ const Page = ({ template }) => {
   const [searchName, setSearchName] = useState('')
   const [batchDelIds, setBatchDelIds] = useState([])
 
+  const keyTitles = {
+    name: t('template:template.fields.name'),
+  }
+
   useEffect(() => {
     dispatch(updateSSRTemplate(template))
   }, [dispatch])
 
+  useEffect(() => {
+    // 管理弹窗打开时的滚动条显示
+    if (isModalVisiable) {
+      // 记录原始样式
+      const originalStyle = window.getComputedStyle(document.body).overflow
+      const originalPaddingRight = window.getComputedStyle(document.body).paddingRight
+
+      // 设置定时器，在 Modal 设置样式后覆盖
+      const timer = setTimeout(() => {
+        document.body.style.overflow = 'auto'
+        document.body.style.paddingRight = '0px'
+      }, 0)
+
+      return () => {
+        clearTimeout(timer)
+        // 清理时恢复原始样式
+        document.body.style.overflow = originalStyle
+        document.body.style.paddingRight = originalPaddingRight
+      }
+    }
+
+    // 当弹窗关闭时，不需要清理函数
+    return undefined
+  }, [isModalVisiable])
+
   const templateManage = useSelector((state: RootState) => state.templateManage)
 
   if (!templateManage.firstLoadFlag) {
@@ -122,7 +96,7 @@ const Page = ({ template }) => {
   const dataSource = templateItems
   const columns: any = [
     {
-      title: 'ID',
+      title: t('template:template.fields.id'),
       dataIndex: 'id',
       key: 'id',
       sorter: (a: any, b: any) => a.id - b.id,
@@ -132,7 +106,7 @@ const Page = ({ template }) => {
       align: 'center',
     },
     {
-      title: keyTitles.name,
+      title: t('template:template.fields.name'),
       dataIndex: 'name',
       key: 'name',
       sorter: (a: any, b: any) => a.name.length - b.name.length,
@@ -142,7 +116,7 @@ const Page = ({ template }) => {
       ellipsis: true,
     },
     {
-      title: '操作',
+      title: t('template:template.fields.actions'),
       dataIndex: '',
       width: '25%',
       align: 'center',
@@ -156,7 +130,7 @@ const Page = ({ template }) => {
                 updateTemplate(record)
               }}
             >
-              修改
+              {t('template:template.buttons.edit')}
             </RoundedButton>
             <RoundedButton
               danger
@@ -166,7 +140,7 @@ const Page = ({ template }) => {
                 deleteTemplate(id)
               }}
             >
-              删除
+              {t('template:template.buttons.delete')}
             </RoundedButton>
           </Space>
         )
@@ -197,10 +171,10 @@ const Page = ({ template }) => {
 
   const deleteTemplate = (id: number) => {
     Modal.confirm({
-      title: '提示',
-      content: '确认删除吗',
-      okText: '确认',
-      cancelText: '取消',
+      title: t('common:common.warning'),
+      content: t('template:template.messages.confirmDelete'),
+      okText: t('template:template.buttons.confirm'),
+      cancelText: t('template:template.buttons.cancel'),
       onOk: () => {
         dispatch(delTemplate(id))
         Modal.destroyAll()
@@ -284,18 +258,18 @@ const Page = ({ template }) => {
           // 导出失败
         })
     } else {
-      message.info('没有数据无需导出')
+      message.info(t('template:template.messages.noData'))
     }
   }
 
   const uploadProps = createCSRFUploadProps('/rest/template/import', {
     name: 'file',
     onSuccess: (fileName) => {
-      message.success(`${fileName} 文件上传成功`)
+      message.success(`${fileName} ${t('template:template.messages.uploadSuccess')}`)
       window.location.reload()
     },
     onError: (fileName) => {
-      message.error(`${fileName} 文件上传失败`)
+      message.error(`${fileName} ${t('template:template.messages.uploadFailed')}`)
     },
     beforeUpload: (file) => {
       // 可以在这里添加文件类型、大小等验证
@@ -303,12 +277,12 @@ const Page = ({ template }) => {
         file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' ||
         file.type === 'application/vnd.ms-excel'
       if (!isExcel) {
-        message.error('只能上传 Excel 文件!')
+        message.error(t('template:template.messages.onlyExcel'))
         return false
       }
       const isLt2M = file.size / 1024 / 1024 < 2
       if (!isLt2M) {
-        message.error('文件大小不能超过 2MB!')
+        message.error(t('template:template.messages.fileSizeLimit'))
         return false
       }
       return true
@@ -318,55 +292,55 @@ const Page = ({ template }) => {
   const batchDeleteTemplate = () => {
     if (batchDelIds.length > 0) {
       Modal.confirm({
-        title: '提示',
-        content: '确认批量删除吗',
-        okText: '确认',
-        cancelText: '取消',
+        title: t('common:common.warning'),
+        content: t('template:template.messages.confirmBatchDelete'),
+        okText: t('template:template.buttons.confirm'),
+        cancelText: t('template:template.buttons.cancel'),
         onOk: () => {
           dispatch(batchDelTemplate(batchDelIds))
           Modal.destroyAll()
         },
       })
     } else {
-      message.info('没有数据不能批量删除')
+      message.info(t('template:template.messages.noDataBatchDelete'))
     }
   }
 
   return (
     <Container>
       <GlobalStyle />
-      <div className="page-title">Template 管理</div>
-      <ConfigProvider locale={locale}>
+      <div className="page-title">{t('template:template.title')}</div>
+      <ConfigProvider locale={antdLocale}>
         <SearchRow>
           <Space size="middle" wrap>
             <Space size="small">
               <StyledButton type="primary" onClick={createTemplate} $primary>
                 <IconWrapper className="fa fa-plus"></IconWrapper>
-                新增
+                {t('template:template.buttons.add')}
               </StyledButton>
               <StyledInput
                 value={searchName}
-                placeholder="请输入名称搜索"
+                placeholder={t('template:template.placeholders.enterName')}
                 allowClear
                 onChange={(e) => setSearchName(e.target.value)}
                 onPressEnter={doSearch}
               />
               <StyledButton type="primary" onClick={doSearch} $primary>
                 <IconWrapper className="fa fa-search"></IconWrapper>
-                搜索
+                {t('template:template.buttons.search')}
               </StyledButton>
             </Space>
             <Space size="small">
               <StyledButton onClick={exportTemplate} icon={<UploadOutlined rotate={180} />} $export>
-                导出
+                {t('template:template.buttons.export')}
               </StyledButton>
               <Upload {...uploadProps}>
                 <StyledButton icon={<UploadOutlined />} $import>
-                  导入
+                  {t('template:template.buttons.import')}
                 </StyledButton>
               </Upload>
               <StyledButton danger onClick={batchDeleteTemplate} $danger>
-                批量删除
+                {t('template:template.buttons.batchDelete')}
               </StyledButton>
             </Space>
           </Space>
@@ -385,7 +359,7 @@ const Page = ({ template }) => {
             pageSize: pageSize,
             showSizeChanger: false,
             showQuickJumper: true,
-            showTotal: (total) => `共 ${total} 条记录`,
+            showTotal: (total) => t('template:template.pagination.total', { total }),
             onChange: (page, pageSize) => {
               dispatch(searchTemplate(page - 1, pageSize, { name: handleXSS(searchName) }))
             },
@@ -393,12 +367,16 @@ const Page = ({ template }) => {
           }}
         />
         <Modal
-          title={<ModalTitle>{`${modalId == 0 ? '新增' : '修改'} Template`}</ModalTitle>}
+          title={
+            <ModalTitle>
+              {modalId == 0 ? t('template:template.modal.addTitle') : t('template:template.modal.editTitle')}
+            </ModalTitle>
+          }
           open={isModalVisiable}
           onOk={handleOk}
           onCancel={handleCancel}
-          okText="确认"
-          cancelText="取消"
+          okText={t('template:template.buttons.confirm')}
+          cancelText={t('template:template.buttons.cancel')}
           centered
           maskClosable={false}
           destroyOnHidden
@@ -410,7 +388,7 @@ const Page = ({ template }) => {
               <label>{keyTitles.name}：</label>
               <ModalInput
                 value={modalName}
-                placeholder="请输入名称"
+                placeholder={t('template:template.placeholders.inputName')}
                 allowClear
                 autoFocus
                 onChange={(e) => setModalName(e.target.value)}
@@ -423,7 +401,9 @@ const Page = ({ template }) => {
   )
 }
 
-Page.getInitialProps = async () => {
+export async function getServerSideProps(context) {
+  const { serverSideTranslations } = await import('next-i18next/serverSideTranslations')
+
   let template = null
 
   await getTemplateService(0, pageSize).then((res: any) => {
@@ -431,8 +411,14 @@ Page.getInitialProps = async () => {
     template = data.template
   })
 
+  const { locale } = context
+  const translations = await serverSideTranslations(locale || 'zh-CN', ['common', 'template', 'layout', 'login'])
+
   return {
-    template,
+    props: {
+      template,
+      ...translations,
+    },
   }
 }
 

package/public/locales/en-US/common.json

@@ -0,0 +1,48 @@
+{
+  "common": {
+    "confirm": "Confirm",
+    "cancel": "Cancel",
+    "save": "Save",
+    "edit": "Edit",
+    "delete": "Delete",
+    "add": "Add",
+    "search": "Search",
+    "reset": "Reset",
+    "submit": "Submit",
+    "back": "Back",
+    "next": "Next",
+    "previous": "Previous",
+    "loading": "Loading...",
+    "success": "Success",
+    "error": "Error",
+    "warning": "Warning",
+    "info": "Info",
+    "yes": "Yes",
+    "no": "No",
+    "close": "Close",
+    "refresh": "Refresh"
+  },
+  "navigation": {
+    "home": "Home",
+    "dashboard": "Dashboard",
+    "settings": "Settings",
+    "profile": "Profile",
+    "logout": "Logout"
+  },
+  "form": {
+    "required": "This field is required",
+    "invalidEmail": "Please enter a valid email address",
+    "invalidPhone": "Please enter a valid phone number",
+    "passwordTooShort": "Password must be at least 8 characters",
+    "confirmPassword": "Confirm Password",
+    "passwordMismatch": "Passwords do not match"
+  },
+  "messages": {
+    "saveSuccess": "Save successful",
+    "deleteSuccess": "Delete successful",
+    "updateSuccess": "Update successful",
+    "createSuccess": "Create successful",
+    "operationFailed": "Operation failed",
+    "networkError": "Network error, please try again later"
+  }
+}

package/public/locales/en-US/home.json

@@ -0,0 +1,57 @@
+{
+  "page": {
+    "title": "NSGM CLI",
+    "description": "Full-stack architecture, code template generation, rapid development",
+    "sections": {
+      "database": {
+        "title": "Database Configuration",
+        "description": "Database uses Mysql, see mysql.config.js for configuration"
+      },
+      "project": {
+        "title": "Project Configuration",
+        "description": "See project.config.js for project configuration"
+      },
+      "framework": {
+        "title": "Framework Configuration",
+        "description": "See next.config.js for Next framework configuration"
+      }
+    },
+    "commands": {
+      "title": "Commands",
+      "categories": {
+        "projectManagement": {
+          "title": "Project Management",
+          "items": {
+            "init": "Initialize project",
+            "upgrade": "Upgrade project base files"
+          }
+        },
+        "templateOperations": {
+          "title": "Template Operations",
+          "items": {
+            "create": "Create template page",
+            "delete": "Delete template page",
+            "deletedb": "Delete template page and database table"
+          }
+        },
+        "runBuild": {
+          "title": "Run & Build",
+          "items": {
+            "dev": "Development mode",
+            "start": "Production mode",
+            "build": "Build",
+            "export": "Export static pages"
+          }
+        }
+      }
+    },
+    "parameters": {
+      "title": "Parameters",
+      "items": {
+        "dictionary": "Used in export/init, default webapp",
+        "controller": "Required when using create/delete",
+        "action": "Used in create/delete, default manage"
+      }
+    }
+  }
+}

package/public/locales/en-US/layout.json

@@ -0,0 +1,22 @@
+{
+  "layout": {
+    "userActions": {
+      "logout": "Logout",
+      "profile": "Profile",
+      "settings": "Account Settings",
+      "notifications": "Notifications",
+      "user": "User"
+    },
+    "navigation": {
+      "home": "Home",
+      "dashboard": "Dashboard",
+      "management": "Management",
+      "system": "System"
+    },
+    "menu": {
+      "introduction": "Introduction",
+      "template": "Template",
+      "template1": "Template 1"
+    }
+  }
+}

package/public/locales/en-US/login.json

@@ -0,0 +1,13 @@
+{
+  "login": {
+    "title": "System Login",
+    "username": "Username",
+    "password": "Password",
+    "loginButton": "Login",
+    "errors": {
+      "usernameRequired": "Please enter username",
+      "passwordRequired": "Please enter password",
+      "loginFailed": "Login failed"
+    }
+  }
+}