nsgm-cli 2.1.6 → 2.1.8

package/README.md

@@ -1,28 +1,62 @@
 # NSGM CLI
-- 技术栈: [Next](https://github.com/vercel/next.js), [Styled-components](https://github.com/styled-components/styled-components), [Graphql](https://graphql.org/), [Mysql](https://www.mysql.com/)
-- 全栈架构，代码模板生成，快速开发
-- 数据库采用 Mysql, 配置见 mysql.config.js
-- 项目配置见 project.config.js
-- Next 框架配置见 next.config.js
-  
-## 命令
-- nsgm init    初始化项目
-- nsgm upgrade 升级项目基础文件
-- nsgm create  创建模板页面
-- nsgm delete  删除模板页面
-- nsgm deletedb 删除模板页面及数据库表
-- nsgm dev     开发模式
-- nsgm start   生产模式
-- nsgm build   编译
-- nsgm export  导出静态页面
-        
-## 参数
-- dictionary: 在 export/init 的时候使用, 默认 webapp, 譬如: nsgm init|export dictionary=webapp 或者 nsgm init|export webapp
-- controller: 在 create/delete 的时候使用， 必须有。譬如：nsgm create|delete math
-- action:     在 create/delete 的时候使用， 默认 manage, 跟在 controller 后面， 譬如 nsgm create|delete math test
-
-## 根目录新增 next.config.js
-```
+
+A full-stack development framework with code template generation capabilities, helping developers efficiently build web applications.
+
+## Tech Stack
+
+- [Next.js](https://github.com/vercel/next.js) - React framework
+- [Styled-components](https://github.com/styled-components/styled-components) - CSS-in-JS solution
+- [GraphQL](https://graphql.org/) - API query language
+- [MySQL](https://www.mysql.com/) - Relational database
+
+## Features
+
+- Full-stack architecture design
+- Automatic code template generation
+- Rapid development workflow
+- Integrated GraphQL API
+- MySQL database support
+
+## Command Line Tools
+
+### Basic Commands
+
+| Command | Description |
+|------|------|
+| `nsgm init` | Initialize project |
+| `nsgm upgrade` | Upgrade project base files |
+| `nsgm create` | Create template page |
+| `nsgm delete` | Delete template page |
+| `nsgm deletedb` | Delete template page and database table |
+| `nsgm dev` | Development mode |
+| `nsgm start` | Production mode |
+| `nsgm build` | Build project |
+| `nsgm export` | Export static pages |
+
+### Parameter Description
+
+- **dictionary**: Used with `export`/`init` commands, default value is `webapp`
+  ```
+  nsgm init dictionary=webapp
+  # or simplified as
+  nsgm init webapp
+  ```
+
+- **controller**: Used with `create`/`delete` commands, required parameter
+  ```
+  nsgm create math
+  ```
+
+- **action**: Used with `create`/`delete` commands, default value is `manage`, follows the controller
+  ```
+  nsgm create math test
+  ```
+
+## Project Configuration
+
+### next.config.js
+
+```javascript
 const { nextConfig } = require('nsgm-cli')
 const projectConfig = require('./project.config')
 
@@ -37,8 +71,9 @@ module.exports = (phase, defaultConfig) => {
 }
 ```
 
-## 根目录新增 mysql.config.js
-```
+### mysql.config.js
+
+```javascript
 const { mysqlConfig } = require('nsgm-cli')
 const { mysqlOptions } = mysqlConfig
 const { user, password, host, port, database } = mysqlOptions
@@ -54,8 +89,9 @@ module.exports = {
 }
 ```
 
-## 根目录新增 project.config.js
-```
+### project.config.js
+
+```javascript
 const { projectConfig } = require('nsgm-cli')
 const pkg = require('./package.json')
 
@@ -71,34 +107,44 @@ module.exports = {
 }
 ```
 
-## 根目录新增 server 
-- apis    存放 Rest Api 
-- modules 存放 graphql 的 resolver 和 schema
-- plugins 存放 graphql 的 plugin
-- *.js  举例： test.js =>  用于响应 /test/*, ${prefix}/test/* 请求
+## Server Directory Structure
 
-```
-  const express = require('express')
-  const moment = require('moment')
+The `server` folder in the project root contains the following:
 
-  const router = express.Router()
+### Directory Description
 
-  router.use((req, res, next) => {
-      const fullUrl = req.protocol + '://' + req.get('host') + req.originalUrl
-      console.log(moment().format('YYYY-MM-DD HH:mm:ss') + ' ' + fullUrl)
-      next()
-  })
+- `apis/` - Stores REST API interfaces
+- `modules/` - Stores GraphQL resolvers and schemas
+- `plugins/` - Stores GraphQL plugins
+- `*.js` - Route files, e.g., `test.js` handles requests to `/test/*` and `${prefix}/test/*`
 
-  router.get('/*', (req, res) => {
-      res.statusCode = 200
-      res.json({ name: 'TEST' })
-  })
+### Example Code
 
-  module.exports = router
-```
+#### Route File Example (server/test.js)
 
-- apis/hello.js
+```javascript
+const express = require('express')
+const moment = require('moment')
+
+const router = express.Router()
+
+router.use((req, res, next) => {
+    const fullUrl = req.protocol + '://' + req.get('host') + req.originalUrl
+    console.log(moment().format('YYYY-MM-DD HH:mm:ss') + ' ' + fullUrl)
+    next()
+})
+
+router.get('/*', (req, res) => {
+    res.statusCode = 200
+    res.json({ name: 'TEST' })
+})
+
+module.exports = router
 ```
+
+#### REST API Example (server/apis/hello.js)
+
+```javascript
 const express = require('express')
 const router = express.Router()
 
@@ -110,8 +156,9 @@ router.get('/*', (req, res) => {
 module.exports = router
 ```
 
-- modules/link/schema.js
-```
+#### GraphQL Schema Example (server/modules/link/schema.js)
+
+```javascript
 module.exports = {
     query: `
         link: String
@@ -124,15 +171,16 @@ module.exports = {
 } 
 ```
 
-- modules/link/resolver.js
-```
+#### GraphQL Resolver Example (server/modules/link/resolver.js)
+
+```javascript
 let localLink = ''
 
 module.exports = {
     link: () => {
         return localLink
     },
-    linkUpdate: ({ link }) =>{
+    linkUpdate: ({ link }) => {
         console.log('link', link)
         localLink = link
         return localLink
@@ -140,8 +188,9 @@ module.exports = {
 }
 ```
 
-- plugins/date.js
-```
+#### GraphQL Plugin Example (server/plugins/date.js)
+
+```javascript
 const moment = require('moment')
 const { Kind } = require('graphql/language')
 const { GraphQLScalarType } = require('graphql')
@@ -157,5 +206,4 @@ const customScalarDate = new GraphQLScalarType({
 })
 
 module.exports = { Date: customScalarDate }
-```
-
+```

package/client/layout/index.tsx

@@ -1,13 +1,13 @@
 import React, { useEffect, useState } from 'react'
-import { Layout, Menu, Breadcrumb, Image, Select, Avatar, Dropdown, Space, Tooltip } from 'antd'
-import { Container } from '../styled/layout'
+import { Layout, Menu, Breadcrumb, Image, Select, Dropdown, Space, Tooltip } from 'antd'
+import { Container } from '@/styled/layout'
 import styled from 'styled-components'
 import { useRouter } from 'next/router'
 import _ from 'lodash'
-import menuConfig from '../utils/menu'
-import { logout } from '../utils/sso'
+import menuConfig from '@/utils/menu'
+import { logout } from '@/utils/sso'
 import getConfig from 'next/config'
-import { UserOutlined, LogoutOutlined, SettingOutlined, BellOutlined } from '@ant-design/icons'
+import { LogoutOutlined, SettingOutlined, BellOutlined, UserOutlined } from '@ant-design/icons'
 
 const { Option } = Select
 const { SubMenu } = Menu
@@ -25,24 +25,80 @@ const FlexLayout = styled(Layout)`
 const StyledSider = styled(Sider)`
     display: flex;
     flex-direction: column;
-    justify-content: space-between;
-  `
-const SiderFooter = styled.div<{ collapsed: boolean }>`
-    padding: ${props => props.collapsed ? '8px 0' : '8px 16px'};
-    text-align: center;
-    color: rgba(0,0,0,0.45);
-    font-size: 12px;
-    border-top: 1px solid #ebeef5;
-    background: #f5f7fa;
+    box-shadow: 2px 0 8px -4px rgba(0, 0, 0, 0.1);
+    z-index: 5;
+    position: relative;
   `
+
 const SideMenu = styled(Menu)`
     height: 100%;
     border-right: 0;
+    padding: 8px 0;
   `
+
 const ContentLayout = styled(Layout)`
     display: flex;
     flex-direction: column;
     flex: 1;
+    background: #f5f7fa;
+    position: relative;
+    z-index: 1;
+  `
+const StyledHeader = styled(Header)`
+    display: flex;
+    align-items: center;
+    padding: 0 24px;
+    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
+    z-index: 11;
+    
+    .logo {
+      margin-right: 24px;
+    }
+    
+    .main-menu {
+      flex: 1;
+    }
+    
+    .user-actions {
+      display: flex;
+      align-items: center;
+      
+      .action-icon {
+        font-size: 18px;
+        color: rgba(255, 255, 255, 0.85);
+        cursor: pointer;
+        padding: 0 8px;
+        transition: color 0.3s;
+        
+        &:hover {
+          color: #fff;
+        }
+      }
+      
+      .user-dropdown {
+        cursor: pointer;
+        padding: 0 8px;
+        
+        .username {
+          color: rgba(255, 255, 255, 0.85);
+          margin-left: 8px;
+        }
+      }
+    }
+  `
+const StyledBreadcrumb = styled(Breadcrumb)`
+    margin: 16px 24px;
+    font-size: 14px;
+  `
+const StyledContent = styled(Content)`
+    margin: 0 24px 24px;
+    padding: 24px;
+    background: #fff;
+    border-radius: 4px;
+    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
+    min-height: calc(100vh - 180px);
+    position: relative;
+    z-index: 1;
   `
 
 const getLocationKey = () => {
@@ -208,9 +264,9 @@ const LayoutComponent = ({ user, children }) => {
   return (
     <Layout className="main-layout">
       <Container>
-        <Header className="header">
+        <StyledHeader>
           <div className="logo">
-            <Image width={100} src={prefix + "/images/zhizuotu_1.png"} preview={false} />
+            <Image width={120} src={prefix + "/images/zhizuotu_1.png"} preview={false} />
           </div>
           <Menu
             theme="dark"
@@ -221,7 +277,7 @@ const LayoutComponent = ({ user, children }) => {
             className="main-menu"
           />
           <div className="user-actions">
-            <Space size={16} align="center">
+            <Space size={20} align="center">
               <Tooltip title="通知">
                 <BellOutlined className="action-icon" />
               </Tooltip>
@@ -259,10 +315,10 @@ const LayoutComponent = ({ user, children }) => {
               </Dropdown>
             </Space>
           </div>
-        </Header>
+        </StyledHeader>
         <FlexLayout>
           <StyledSider
-            width={200}
+            width={220}
             className="site-layout-background sidebar"
             collapsible
             collapsed={collapsed}
@@ -279,12 +335,9 @@ const LayoutComponent = ({ user, children }) => {
                 className="side-menu"
               />
             </div>
-            <SiderFooter collapsed={collapsed}>
-              {collapsed ? '©' : '© 2025 NSGM'}
-            </SiderFooter>
           </StyledSider>
           <ContentLayout className="content-layout">
-            <Breadcrumb className="breadcrumb-container">
+            <StyledBreadcrumb>
               {_.map(menuConfig, (item, index) => {
                 const { key, text, subMenus } = item
 
@@ -294,7 +347,7 @@ const LayoutComponent = ({ user, children }) => {
                     const { key: subKey, text: subText } = subItem
                     if (subKey === topMenuKey + '_' + sliderMenuKey) {
                       subContent.push(<Breadcrumb.Item key={'breadcrumb' + subIndex}>{text}</Breadcrumb.Item>)
-                      subContent.push(<Breadcrumb.Item key={'breadcrumb' + subIndex}>{subText}</Breadcrumb.Item>)
+                      subContent.push(<Breadcrumb.Item key={'breadcrumb' + subIndex + '_sub'}>{subText}</Breadcrumb.Item>)
                       return false
                     }
                   })
@@ -305,12 +358,10 @@ const LayoutComponent = ({ user, children }) => {
                   }
                 }
               })}
-            </Breadcrumb>
-            <Content
-              className="site-layout-background content-container"
-            >
+            </StyledBreadcrumb>
+            <StyledContent>
               {children}
-            </Content>
+            </StyledContent>
           </ContentLayout>
         </FlexLayout>
       </Container>

package/client/redux/template/manage/actions.ts

@@ -1,5 +1,5 @@
 import * as types from './types'
-import { getTemplateService, addTemplateService, updateTemplateService, deleteTemplateService, searchTemplateService, batchDeleteTemplateService } from '../../../service/template/manage'
+import { getTemplateService, addTemplateService, updateTemplateService, deleteTemplateService, searchTemplateService, batchDeleteTemplateService } from '@/service/template/manage'
 
 export const getTemplate = (page=0, pageSize=10) => (
   dispatch: (arg0: {

package/client/service/template/manage.ts

@@ -1,7 +1,7 @@
-import { getLocalGraphql } from '../../utils/fetch'
+import { getLocalGraphql } from '@/utils/fetch'
 import _ from 'lodash'
 
-export const getTemplateService = (page=0, pageSize=10) => {
+export const getTemplateService = (page = 0, pageSize = 10) => {
   const getTemplateQuery = `query ($page: Int, $pageSize: Int) { template(page: $page, pageSize: $pageSize) { 
         totalCounts items { 
           id name
@@ -9,10 +9,10 @@ export const getTemplateService = (page=0, pageSize=10) => {
       } 
     }`
 
-    return getLocalGraphql(getTemplateQuery, {
-      page,
-      pageSize
-    })
+  return getLocalGraphql(getTemplateQuery, {
+    page,
+    pageSize
+  })
 }
 
 export const searchTemplateByIdService = (id: number) => {
@@ -39,7 +39,7 @@ export const searchTemplateService = (page = 0, pageSize = 10, data: any) => {
   }`
 
   return getLocalGraphql(searchTemplateQuery, {
-    page, 
+    page,
     pageSize,
     data: {
       name
@@ -47,7 +47,7 @@ export const searchTemplateService = (page = 0, pageSize = 10, data: any) => {
   })
 }
 
-export const addTemplateService = (data: any) => { 
+export const addTemplateService = (data: any) => {
   const { name } = data
 
   const addTemplateQuery = `mutation ($data: TemplateAddInput) { templateAdd(data: $data) }`
@@ -59,7 +59,7 @@ export const addTemplateService = (data: any) => {
   })
 }
 
-export const updateTemplateService = (id: number, data: any) => { 
+export const updateTemplateService = (id: number, data: any) => {
   const { name } = data
 
   const updateTemplateQuery = `mutation ($id: Int, $data: TemplateAddInput) { templateUpdate(id: $id, data: $data) }`
@@ -72,7 +72,7 @@ export const updateTemplateService = (id: number, data: any) => {
   })
 }
 
-export const deleteTemplateService = (id: number) => { 
+export const deleteTemplateService = (id: number) => {
   const deleteTemplateQuery = `mutation ($id: Int) { templateDelete(id: $id) }`
 
   return getLocalGraphql(deleteTemplateQuery, {
@@ -88,7 +88,7 @@ export const batchAddTemplateService = (datas: any) => {
   })
 }
 
-export const batchDeleteTemplateService = (ids: any) => { 
+export const batchDeleteTemplateService = (ids: any) => {
   const batchDeleteTemplateQuery = `mutation ($ids: [Int]) { templateBatchDelete(ids: $ids) }`
 
   return getLocalGraphql(batchDeleteTemplateQuery, {

package/client/utils/sso.ts

@@ -8,17 +8,17 @@ const env = getLocalEnv()
 const LOGIN_COOKIE_ID = env + '_cas_nsgm'
 const LOGIN_COOKIE_USER = env + '_nsgm_user'
 
-const getPrincipalUrl = () => { 
+const getPrincipalUrl = () => {
   const url = getLocalApiPrefix() + '/rest/sso/sessionCheck'
   return url
 }
 
-const getValidateUrl = () => { 
+const getValidateUrl = () => {
   const url = getLocalApiPrefix() + '/rest/sso/ticketCheck'
   return url
 }
 
-const handleLocationHref = () => { 
+const handleLocationHref = () => {
   let newHref = ''
   if (typeof window !== 'undefined') {
     const locationHref = window.location.href
@@ -27,12 +27,12 @@ const handleLocationHref = () => {
       const locationHrefArrLen = locationHrefArr.length
 
       let newParamStr = ''
-      
+
       if (locationHrefArrLen > 1) {
         const paramStr = locationHrefArr[1]
         if (paramStr.indexOf('&') !== -1) {
           const paramArr = paramStr.split('&')
-          
+
           _.each(paramArr, (item, index) => {
             if (item.indexOf('=') !== -1) {
               const itemArr = item.split('=')
@@ -42,7 +42,7 @@ const handleLocationHref = () => {
               let value = ''
               if (itemArrLen > 1)
                 value = itemArr[1]
-              
+
               if ('ticket' !== key) {
                 newParamStr += key + '=' + value + '&'
               }
@@ -58,11 +58,11 @@ const handleLocationHref = () => {
       }
 
       const locationHrefArrFirst = locationHrefArr[0]
-      if(newParamStr !== '')
+      if (newParamStr !== '')
         newHref = locationHrefArrFirst + '?' + newParamStr
       else
         newHref = locationHrefArrFirst
-    } else { 
+    } else {
       newHref = locationHref
     }
   }
@@ -71,43 +71,43 @@ const handleLocationHref = () => {
   return encodeURIComponent(newHref)
 }
 
-const jumpToLogin = () => { 
+const jumpToLogin = () => {
   delCookie(LOGIN_COOKIE_ID)
   delCookie(LOGIN_COOKIE_USER)
-  
+
   if (typeof window !== 'undefined') {
     window.location.href = window.location.origin + '/login'
   }
 }
 
-const jumpToLogout = () => { 
+const jumpToLogout = () => {
   delCookie(LOGIN_COOKIE_ID)
   delCookie(LOGIN_COOKIE_USER)
-  
+
   if (typeof window !== 'undefined') {
     window.location.href = window.location.origin
   }
 }
 
-const principalLogin = (cookie:string, callback:any) => { 
+const principalLogin = (cookie: string, callback: any) => {
   let url = getPrincipalUrl()
 
   if (typeof window !== 'undefined') {
     url += '?cookieValue=' + cookie + '&redirectUrl=' + handleLocationHref()
   }
 
-  console.log('principalLogin_url', url)
-  axios.get(url, { params: { credentials: 'include' } }).then((res:any) => {
-    console.log('principalLogin_res', res)
+  // console.log('principalLogin_url', url)
+  axios.get(url, { params: { credentials: 'include' } }).then((res: any) => {
+    // console.log('principalLogin_res', res)
     const { data } = res
     if (data) {
       const { returnCode, userAttr } = data
       if (returnCode !== 0) {
         jumpToLogin()
-      } else { 
+      } else {
         storeLoginUser(userAttr, callback)
       }
-    } else { 
+    } else {
       jumpToLogin()
     }
   }).catch((e) => {
@@ -116,42 +116,42 @@ const principalLogin = (cookie:string, callback:any) => {
   })
 }
 
-const storeLoginUser = (userAttr:any, callback:any) => { 
-  console.log('storeLoginUser', userAttr)
+const storeLoginUser = (userAttr: any, callback: any) => {
+  // console.log('storeLoginUser', userAttr)
 
   if (userAttr) {
     const user = JSON.stringify(userAttr, ['city', 'company', 'department', 'displayName', 'employee', 'mail', 'name', 'sn'])
     setCookie(LOGIN_COOKIE_USER, user, null)
     callback && callback(JSON.parse(user))
-  } else { 
+  } else {
     callback && callback()
   }
 }
 
-const storeLogin = (cookie:any, cookieExpire:any, userAttr:any, callback:any) => { 
-  console.log('storeLogin_cookie', cookie)
+const storeLogin = (cookie: any, cookieExpire: any, userAttr: any, callback: any) => {
+  // console.log('storeLogin_cookie', cookie)
 
-  if (cookie) { 
+  if (cookie) {
     setCookie(LOGIN_COOKIE_ID, cookie, cookieExpire)
   }
 
   storeLoginUser(userAttr, callback)
 }
 
-const validateLogin = (ticket:string, name:string = '', callback:any) => { 
+const validateLogin = (ticket: string, name: string = '', callback: any) => {
   let url = getValidateUrl()
 
   if (typeof window !== 'undefined') {
     url += '?ticket=' + ticket
 
-    if(name !== ''){
+    if (name !== '') {
       url += '&name=' + name
     }
   }
-  
-  console.log('validateLogin_url', url)
-  axios.get(url, { params: { credentials: 'include' } }).then((res:any) => {
-    console.log('validateLogin_res', res)
+
+  // console.log('validateLogin_url', url)
+  axios.get(url, { params: { credentials: 'include' } }).then((res: any) => {
+    // console.log('validateLogin_res', res)
 
     if (res) {
       const { data } = res
@@ -159,13 +159,13 @@ const validateLogin = (ticket:string, name:string = '', callback:any) => {
         const { cookieValue, cookieExpire, returnCode, userAttr } = data
         if (returnCode === 0) {
           storeLogin(cookieValue, cookieExpire, userAttr, callback)
-        } else { 
+        } else {
           jumpToLogin()
         }
-      } else { 
+      } else {
         jumpToLogin()
       }
-    } else { 
+    } else {
       jumpToLogin()
     }
   }).catch((e) => {
@@ -173,25 +173,25 @@ const validateLogin = (ticket:string, name:string = '', callback:any) => {
   })
 }
 
-export const login = (callback:any) => { 
+export const login = (callback: any) => {
   const cookieLoginValue = getCookie(LOGIN_COOKIE_ID)
-  console.log('cookieLoginValue', cookieLoginValue)
+  // console.log('cookieLoginValue', cookieLoginValue)
 
-  if(typeof window !== 'undefined'){
+  if (typeof window !== 'undefined') {
     const locationHref = window.location.href
 
-    if(locationHref.indexOf('/login') === -1){
+    if (locationHref.indexOf('/login') === -1) {
 
       if (cookieLoginValue !== '') {
         principalLogin(cookieLoginValue, callback)
-      } else { 
+      } else {
         const urlParamTicket = getUrlParamByKey('ticket')
         const urlParamName = getUrlParamByKey('name')
-        console.log('urlParamTicket', urlParamTicket, urlParamName)
+        // console.log('urlParamTicket', urlParamTicket, urlParamName)
 
         if (urlParamTicket !== '') {
           validateLogin(urlParamTicket, urlParamName, callback)
-        } else { 
+        } else {
           jumpToLogin()
         }
       }
@@ -199,7 +199,7 @@ export const login = (callback:any) => {
   }
 }
 
-export const logout = () => { 
+export const logout = () => {
   jumpToLogout()
 }
 

package/generation/README.md

@@ -1,16 +1,147 @@
-# NSGM CLI PROJECT
-
-## 命令
-- npm run init    初始化项目
-- npm run upgrade 升级项目基础文件
-- npm run create  创建模板页面
-- npm run delete  删除模板页面
-- npm run dev     开发模式
-- npm run start   生产模式
-- npm run build   编译
-- npm run export  导出静态页面
-        
-## 参数
-- dictionary: 在 export/init 的时候使用, 默认 webapp, 譬如: npm run init|export dictionary=webapp 或者 npm run init|export webapp
-- controller: 在 create/delete 的时候使用， 必须有。譬如： npm run create|delete math
-- action:     在 create/delete 的时候使用， 默认 manage, 跟在 controller 后面， 譬如 npm run create|delete math test
+# 欢迎使用 NSGM 项目
+
+这是一个由 NSGM CLI 创建的全栈开发项目，集成了 Next.js、Styled-components、GraphQL 和 MySQL 技术栈。
+
+## 技术栈
+
+- [Next.js](https://github.com/vercel/next.js) - React 框架
+- [Styled-components](https://github.com/styled-components/styled-components) - CSS-in-JS 解决方案
+- [GraphQL](https://graphql.org/) - API 查询语言
+- [MySQL](https://www.mysql.com/) - 关系型数据库
+
+## 快速入门
+
+### 开发命令
+
+| 命令 | 说明 |
+|---------|-------------|
+| `npm run dev` | 开发模式 |
+| `npm run start` | 生产模式 |
+| `npm run build` | 编译项目 |
+| `npm run export` | 导出静态页面 |
+
+### 代码生成命令
+
+| 命令 | 说明 |
+|---------|-------------|
+| `npm run create` | 创建模板页面 |
+| `npm run delete` | 删除模板页面 |
+
+### 项目维护命令
+
+| 命令 | 说明 |
+|---------|-------------|
+| `npm run upgrade` | 升级项目基础文件 |
+
+## 参数说明
+
+### controller
+- 用于 `create`/`delete` 命令
+- 必填参数
+- 示例:
+  ```
+  npm run create math
+  ```
+
+### action
+- 用于 `create`/`delete` 命令
+- 默认值为 `manage`
+- 跟在 controller 参数后面
+- 示例:
+  ```
+  npm run create math test
+  ```
+
+### dictionary
+- 用于 `export` 命令
+- 默认值为 `webapp`
+- 示例:
+  ```
+  npm run export dictionary=webapp
+  # 或简化为
+  npm run export webapp
+  ```
+
+## 项目结构
+
+```
+├── components/       # 公共组件
+├── pages/            # 页面文件
+│   ├── api/          # API 路由
+│   └── [controller]/ # 控制器页面
+├── public/           # 静态资源
+├── server/           # 服务端代码
+│   ├── apis/         # REST API 接口
+│   ├── modules/      # GraphQL 解析器和模式
+│   └── plugins/      # GraphQL 插件
+├── styles/           # 全局样式
+├── next.config.js    # Next.js 配置
+├── mysql.config.js   # MySQL 配置
+└── project.config.js # 项目配置
+```
+
+## 配置文件
+
+### next.config.js
+
+```javascript
+const { nextConfig } = require('nsgm-cli')
+const projectConfig = require('./project.config')
+
+const { version, prefix, protocol, host } = projectConfig 
+
+module.exports = (phase, defaultConfig) => {
+    let configObj = nextConfig(phase, defaultConfig, { 
+        version, prefix, protocol, host
+    })
+
+    return configObj
+}
+```
+
+### mysql.config.js
+
+```javascript
+const { mysqlConfig } = require('nsgm-cli')
+const { mysqlOptions } = mysqlConfig
+const { user, password, host, port, database } = mysqlOptions
+
+module.exports = {
+    mysqlOptions: {
+        user,
+        password,
+        host,
+        port,
+        database
+    }
+}
+```
+
+### project.config.js
+
+```javascript
+const { projectConfig } = require('nsgm-cli')
+const pkg = require('./package.json')
+
+const { prefix, protocol, host, port } = projectConfig
+const { version } = pkg
+
+module.exports = {
+    version,
+    prefix,
+    protocol,
+    host,
+    port
+}
+```
+
+## 开发指南
+
+1. **创建新页面**：使用 `npm run create [controller] [action]` 命令
+2. **启动开发服务器**：运行 `npm run dev`
+3. **构建生产版本**：运行 `npm run build` 然后 `npm run start`
+4. **导出静态网站**：运行 `npm run export`
+
+## 更多资源
+
+更多详细信息，请参考 [NSGM CLI 文档](https://github.com/erishen/nsgm-cli)。

package/next.config.js

@@ -63,12 +63,17 @@ module.exports = (phase, defaultConfig, options) => {
     // Bundle 优化配置
     experimental: {
       optimizeCss: true, // 启用 CSS 优化（已安装 critters 依赖）
-      swcMinify: true,   // 使用 SWC 压缩器
       esmExternals: true // 支持 ESM 外部依赖
     },
     compiler: {
       removeConsole: phase !== PHASE_DEVELOPMENT_SERVER,
     },
+    allowedDevOrigins: [
+      'http://127.0.0.1:8080',
+      'http://localhost:8080',
+      'http://127.0.0.1:3000',
+      'http://localhost:3000'
+    ],
     webpack: (config, { buildId, dev, isServer, defaultLoaders, webpack }) => {
       // 启用压缩
       if (!dev && !isServer) {
@@ -105,7 +110,7 @@ module.exports = (phase, defaultConfig, options) => {
           },
           minimize: true,
         }
-        
+
         // 添加分析工具
         if (process.env.ANALYZE === 'true') {
           const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer')
@@ -117,13 +122,13 @@ module.exports = (phase, defaultConfig, options) => {
           )
         }
       }
-      
+
       // 优化模块解析
       config.resolve.alias = {
         ...config.resolve.alias,
         '@': path.resolve(__dirname, 'client'),
       }
-      
+
       return config
     },
     generateBuildId: async () => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nsgm-cli",
-  "version": "2.1.6",
+  "version": "2.1.8",
   "description": "A CLI tool to run Next/Style-components and Graphql/Mysql fullstack project",
   "main": "index.js",
   "scripts": {

package/pages/_app.tsx

@@ -1,10 +1,10 @@
 import React, { useEffect, useState } from 'react'
 import { Provider } from 'react-redux'
 import { ThemeProvider } from 'styled-components'
-import { useStore } from '../client/redux/store'
-import { GlobalStyle, Loading } from '../client/styled/common'
-import LayoutComponent from '../client/layout'
-import { login } from '../client/utils/sso'
+import { useStore } from '@/redux/store'
+import { GlobalStyle, Loading } from '@/styled/common'
+import LayoutComponent from '@/layout'
+import { login } from '@/utils/sso'
 import { Spin } from 'antd'
 import 'antd/dist/reset.css'
 

package/pages/_document.tsx

@@ -15,7 +15,9 @@ const MyDocument = () => {
       <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,minimal-ui" />
       <meta name="apple-mobile-web-app-capable" content="yes" />
       <meta charSet="utf-8" />
-      <Head />
+      <Head>
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
+      </Head>
       <body>
         <Main />
         <NextScript />

package/pages/template/manage.tsx

@@ -1,15 +1,15 @@
 import React, { useEffect, useState } from 'react'
 import { ConfigProvider, Table, Modal, Button, Input, Space, Upload, message } from 'antd'
-import { Container, SearchRow, ModalContainer } from '../../client/styled/template/manage'
+import { Container, SearchRow, ModalContainer } from '@/styled/template/manage'
 import styled from 'styled-components'
 import { useDispatch, useSelector } from 'react-redux'
-import { getTemplate, addTemplate, modTemplate, delTemplate, updateSSRTemplate, searchTemplate, batchDelTemplate } from '../../client/redux/template/manage/actions'
-import { getTemplateService } from '../../client/service/template/manage'
-import { RootState } from '../../client/redux/store'
+import { getTemplate, addTemplate, modTemplate, delTemplate, updateSSRTemplate, searchTemplate, batchDelTemplate } from '@/redux/template/manage/actions'
+import { getTemplateService } from '@/service/template/manage'
+import { RootState } from '@/redux/store'
 import _ from 'lodash'
 import dayjs from 'dayjs'
 import locale from 'antd/lib/locale/zh_CN'
-import { handleXSS, checkModalObj } from '../../client/utils/common'
+import { handleXSS, checkModalObj } from '@/utils/common'
 import { UploadOutlined } from '@ant-design/icons'
 import ExcelJS from 'exceljs'
 import { saveAs } from 'file-saver'
@@ -58,6 +58,11 @@ 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;
@@ -66,6 +71,21 @@ const ModalTitle = styled.div`
 const ModalInput = styled(Input)`
     border-radius: 4px;
   `
+const IconWrapper = styled.i`
+    margin-right: 5px;
+  `
+const StyledPagination = styled.div`
+    margin-top: 16px;
+    margin-bottom: 16px;
+  `
+const RoundedButton = styled(Button)`
+    border-radius: 4px;
+  `
+const GlobalStyle = styled.div`
+    .rounded-button {
+      border-radius: 4px;
+    }
+  `
 
 const Page = ({ template }) => {
   const dispatch = useDispatch()
@@ -123,13 +143,13 @@ const Page = ({ template }) => {
       render: (_: any, record: any) => {
         return (
           <Space size="small">
-            <Button type="primary" size="small" onClick={() => {
+            <RoundedButton type="primary" size="small" onClick={() => {
               updateTemplate(record)
-            }} style={{ borderRadius: '4px' }}>修改</Button>
-            <Button danger size="small" onClick={() => {
+            }}>修改</RoundedButton>
+            <RoundedButton danger size="small" onClick={() => {
               const { id } = record
               deleteTemplate(id)
-            }} style={{ borderRadius: '4px' }}>删除</Button>
+            }}>删除</RoundedButton>
           </Space>
         )
       }
@@ -281,13 +301,14 @@ const Page = ({ template }) => {
 
   return (
     <Container>
-      <div className="page-title">模板管理</div>
+      <GlobalStyle />
+      <div className="page-title">Template 管理</div>
       <ConfigProvider locale={locale}>
         <SearchRow>
           <Space size="middle" wrap>
             <Space size="small">
               <StyledButton type="primary" onClick={createTemplate} $primary>
-                <i className="fa fa-plus" style={{ marginRight: '5px' }}></i>
+                <IconWrapper className="fa fa-plus"></IconWrapper>
                 新增
               </StyledButton>
               <StyledInput
@@ -298,7 +319,7 @@ const Page = ({ template }) => {
                 onPressEnter={doSearch}
               />
               <StyledButton type="primary" onClick={doSearch} $primary>
-                <i className="fa fa-search" style={{ marginRight: '5px' }}></i>
+                <IconWrapper className="fa fa-search"></IconWrapper>
                 搜索
               </StyledButton>
             </Space>
@@ -335,11 +356,11 @@ const Page = ({ template }) => {
             onChange: (page, pageSize) => {
               dispatch(searchTemplate(page - 1, pageSize, { name: handleXSS(searchName) }))
             },
-            style: { marginTop: '16px', marginBottom: '16px' }
+            className: "styled-pagination"
           }}
         />
         <Modal
-          title={<ModalTitle>{(modalId == 0 ? "新增" : "修改") + " 模板"}</ModalTitle>}
+          title={<ModalTitle>{(modalId == 0 ? "新增" : "修改") + " Template"}</ModalTitle>}
           open={isModalVisiable}
           onOk={handleOk}
           onCancel={handleCancel}
@@ -348,8 +369,8 @@ const Page = ({ template }) => {
           centered
           maskClosable={false}
           destroyOnClose
-          okButtonProps={{ style: { borderRadius: '4px' } }}
-          cancelButtonProps={{ style: { borderRadius: '4px' } }}
+          okButtonProps={{ className: 'rounded-button' }}
+          cancelButtonProps={{ className: 'rounded-button' }}
         >
           <ModalContainer>
             <div className="line">

package/babel.config.js

@@ -1,18 +0,0 @@
-module.exports = {
-  presets: [
-    ['next/babel', {
-      'preset-env': {
-        targets: {
-          node: '18'
-        }
-      }
-    }]
-  ],
-  plugins: [
-    ['styled-components', {
-      ssr: true,
-      displayName: true,
-      preprocess: false
-    }]
-  ]
-}