feat: 多语言

Author: cole

src/App.jsx

@@ -7,6 +7,7 @@ import dayjs from 'dayjs'
 import { createAppInstance } from './useAppInstance'
 
 export default defineComponent({
+    inheritAttrs: false,
     setup () {
         const { locale, getLocaleMessage } = useI18n()
 

src/components/icon/ExitFullscreenOutlined.jsx

@@ -2,6 +2,7 @@ import { defineComponent } from 'vue'
 import Icon from '@ant-design/icons-vue'
 
 export default defineComponent({
+    inheritAttrs: false,
     setup (props, { attrs }) {
         return () => {
             const iconSlots = {

src/components/icon/FullscreenOutlined.jsx

@@ -2,6 +2,7 @@ import { defineComponent } from 'vue'
 import Icon from '@ant-design/icons-vue'
 
 export default defineComponent({
+    inheritAttrs: false,
     setup (props, { attrs }) {
         return () => {
             const iconSlots = {

src/components/icon/HamburgerOutlined.jsx

@@ -2,6 +2,7 @@ import { defineComponent } from 'vue'
 import Icon from '@ant-design/icons-vue'
 
 export default defineComponent({
+    inheritAttrs: false,
     setup (props, { attrs }) {
         return () => {
             const iconSlots = {

src/components/icon/MenuOutlined.jsx

@@ -2,6 +2,7 @@ import { defineComponent } from 'vue'
 import Icon from '@ant-design/icons-vue'
 
 export default defineComponent({
+    inheritAttrs: false,
     setup (props, { attrs }) {
         return () => {
             const iconSlots = {

src/components/icon/PasswordFilled.jsx

@@ -2,6 +2,7 @@ import { defineComponent } from 'vue'
 import Icon from '@ant-design/icons-vue'
 
 export default defineComponent({
+    inheritAttrs: false,
     setup (props, { attrs }) {
         return () => {
             const iconSlots = {

src/components/icon/UserFilled.jsx

@@ -2,6 +2,7 @@ import { defineComponent } from 'vue'
 import Icon from '@ant-design/icons-vue'
 
 export default defineComponent({
+    inheritAttrs: false,
     setup (props, { attrs }) {
         return () => {
             const iconSlots = {

src/components/loading/Loading.jsx

@@ -5,6 +5,7 @@ import styles from './style/index.module.scss'
 const cx = classNames.bind(styles)
 
 export default defineComponent({
+    inheritAttrs: false,
     props: {
         onClose: {
             type: Function,

src/layout/compatible/sidebar/OutIcon.jsx

@@ -6,7 +6,7 @@ export default defineComponent({
     inheritAttrs: false,
     props: {
         type: {
-            type: [String, Function],
+            type: [String, Function, Boolean],
             default: undefined
         }
     },
@@ -18,7 +18,10 @@ export default defineComponent({
             if (props.type && isString(props.type)) {
                 return <Icon type={props.type}/>
             }
-            return <MenuOutlined/>
+            if (props.type !== false) {
+                return <MenuOutlined/>
+            }
+            return null
         }
     }
 })

src/layout/compatible/tags/Node.jsx

@@ -5,6 +5,7 @@ import { useConfigInject } from '@utils/extend'
 import useStyle from './style/node'
 
 export default defineComponent({
+    inheritAttrs: false,
     props: {
         closable: {
             type: Boolean,

src/layout/compatible/tags/index.jsx

@@ -10,6 +10,7 @@ import useStyle from './style'
 import { isString } from 'lodash-es'
 
 export default defineComponent({
+    inheritAttrs: false,
     props: {
         homeName: {
             type: String,

src/locale/en-US/error-pages.js

@@ -0,0 +1,6 @@
+export default {
+    403: 'You are not authorized to access this page',
+    404: 'The page you visited does not exist',
+    500: 'The server is wrong',
+    backHome: 'Back Home'
+}

src/locale/en-US/index.js

@@ -4,12 +4,14 @@ import dayjs from 'dayjs/locale/en'
 // --
 import routes from './routes'
 import layout from './layout'
+import errorPages from './error-pages'
 
 export default {
     locale: 'en-US',
     antd: antd,
     packages: packages,
     dayjs: dayjs,
     routes: routes,
-    layout: layout
+    layout: layout,
+    errorPages: errorPages
 }

src/locale/en-US/routes.js

@@ -1,16 +1,13 @@
 export default {
     HomeIndex: 'Home',
     Form: 'Form',
-    FormLayout: 'Form Layout',
-    FormModal: 'Modal Form',
-    FormDrawer: 'Drawer Form',
-    FormFilter: 'Filter Form',
-    Table: 'Table',
-    TableIndex: 'Table',
-    TableCustomSearch: 'Custom Search',
-    TableEditableTable: 'Editable Table',
-    Descriptions: 'Descriptions',
-    DescriptionsIndex: 'Descriptions',
-    Test: 'Test',
-    TestIndex: 'Test'
+    FormBasicForm: 'Basic Form',
+    FormFloatingForm: 'Floating Form',
+    List: 'List',
+    ListTable: 'Query Table',
+    ListEditableTable: 'Editable Table',
+    Exception: 'Exception',
+    Examples: 'Examples',
+    ExamplesDescriptions: 'Descriptions',
+    ExamplesTest: 'Test'
 }

src/locale/zh-CN/error-pages.js

@@ -0,0 +1,6 @@
+export default {
+    403: '您无权访问此页面',
+    404: '您访问的页面不存在',
+    500: '服务器错误',
+    backHome: '返回首页'
+}

src/locale/zh-CN/index.js

@@ -4,12 +4,14 @@ import dayjs from 'dayjs/locale/zh-cn'
 // --
 import routes from './routes'
 import layout from './layout'
+import errorPages from './error-pages'
 
 export default {
     locale: 'zh-CN',
     antd: antd,
     packages: packages,
     dayjs: dayjs,
     routes: routes,
-    layout: layout
+    layout: layout,
+    errorPages: errorPages
 }

src/locale/zh-CN/routes.js

@@ -1,16 +1,13 @@
 export default {
     HomeIndex: '首页',
-    Form: '表单',
-    FormLayout: '表单布局',
-    FormModal: '浮层表单',
-    FormDrawer: '抽屉表单',
-    FormFilter: '筛选表单',
-    Table: '表格',
-    TableIndex: '表格',
-    TableCustomSearch: '自定义搜索',
-    TableEditableTable: '可编辑表格',
-    Descriptions: '描述列表',
-    DescriptionsIndex: '描述列表',
-    Test: '测试',
-    TestIndex: '测试'
+    Form: '表单页',
+    FormBasicForm: '基础表单',
+    FormFloatingForm: '浮层表单',
+    List: '列表页',
+    ListTable: '查询表格',
+    ListEditableTable: '可编辑表格',
+    Exception: '异常页',
+    Examples: '组件展示',
+    ExamplesDescriptions: '描述列表',
+    ExamplesTest: '测试'
 }

src/router/routes/README.md

@@ -1,11 +1,11 @@
 ## META
 
-| 属性         | 说明                          | 类型                 | 默认值 |
-|------------|-----------------------------|--------------------|-----|
-| title      | 导航栏 title                   | string             | -   |
-| icon       | 导航栏 icon                    | string \| function | -   |
-| hideInMenu | 设为 true 后在左侧菜单不会显示该页面选项     | boolean            | -   | 
-| hltInName  | 高亮的路由 name                  | string             | -   |
-| access     | 可访问该页面的权限数组 当前路由设置的权限会影响子路由 | string \| number   | -   |
-| notCache   | 设为 true 后 KeepAlive 混缓存页面   | boolean            | -   |
+| 属性         | 说明                          | 类型                          | 默认值 |
+|------------|-----------------------------|-----------------------------|-----|
+| title      | 导航栏 title                   | string                      | -   |
+| icon       | 导航栏 icon                    | string \| function \| false | -   |
+| hideInMenu | 设为 true 后在左侧菜单不会显示该页面选项     | boolean                     | -   | 
+| hltInName  | 高亮的路由 name                  | string                      | -   |
+| access     | 可访问该页面的权限数组 当前路由设置的权限会影响子路由 | string \| number            | -   |
+| notCache   | 设为 true 后 KeepAlive 混缓存页面   | boolean                     | -   |
 

src/router/routes/error-pages.js

@@ -0,0 +1,43 @@
+import Error403 from '@/views/error-pages/403'
+import Error404 from '@/views/error-pages/404'
+import Error500 from '@/views/error-pages/500'
+
+const errorPages = [
+    {
+        path: '/403',
+        name: 'Error403',
+        meta: {
+            hideInMenu: true,
+            notCache: true
+        },
+        component: Error403
+    },
+    {
+        path: '/404',
+        name: 'Error404',
+        meta: {
+            hideInMenu: true,
+            notCache: true
+        },
+        component: Error404
+    },
+    {
+        path: '/500',
+        name: 'Error500',
+        meta: {
+            hideInMenu: true,
+            notCache: true
+        },
+        component: Error500
+    },
+    {
+        path: '/:pathMatch(.*)*',
+        meta: {
+            hideInMenu: true,
+            notCache: true
+        },
+        component: Error404
+    }
+]
+
+export default errorPages