feat: 内容能力->栏目国际化

src/locales/zh-CN.ts

@@ -9,6 +9,7 @@ import classAndProperty from './zh-CN/classAndProperty'
 import member from './zh-CN/member'
 import purchase from './zh-CN/purchase'
 import editor from './zh-CN/editor'
+import content from './zh-CN/content'
 
 export default {
   'global.siteName': '瓴犀',
@@ -23,4 +24,6 @@ export default {
   ...member,
   ...purchase,
   ...editor,
+  ...content,
+
 }

src/locales/zh-CN/common.ts

@@ -21,6 +21,7 @@
   'common.button.query': '查询',
   'common.button.reset': '重置',
   'common.button.copay': '复制',
+  'common.button.submit': '提交',
 
   /** tips */
   'common.tip.save.confirm': '您还有未保存的内容，是否确定要离开？',
@@ -48,6 +49,8 @@
   'common.text.platform': '平台',
   'common.text.business': '商家',
   'common.text.search': '搜索',
+  'common.text.pleaseSelect': '请选择',
+  'common.text.notEmpty': '不可为空',
 
   /** form */
   'common.form.name.placeholder': '请输入姓名',

src/locales/zh-CN/content.ts

+/**
+ * 内容能力
+ */
+ export default {
+  'content.columns.name': '栏目名称',
+  'content.columns.category': '栏目分类',
+  'content.columns.sort': '栏目排序',
+  'content.columns.market': '市场行情',
+  'content.columns.information': '资讯',
+  'content.columns.add': '新建栏目',
+  'content.columns.edit': '编辑栏目',
+
+
+}

src/pages/content/columnManagement/columnInfo.tsx

@@ -5,7 +5,7 @@ import { PageHeaderWrapper } from '@ant-design/pro-layout';
 import ReutrnEle from '@/components/ReturnEle';
 import { usePageStatus } from '@/hooks/usePageStatus';
 import { validatorAllTrim } from '@/utils/regExp';
-import { history, Prompt } from 'umi';
+import { history, Prompt, useIntl } from 'umi';
 import useCustomValidator from '../hooks/useValidator'
 import { getManageMemberColumnGet, postManageMemberColumnAdd, postManageMemberColumnUpdate } from '@/services/ManageV2Api';
 
@@ -26,7 +26,31 @@ const sortedList = (() => {
   return res
 })()
 
-const schema = {
+const useInitialValues = (id) => {
+  const [state, setState] = useState({})
+  useEffect(() => {
+    if(id) {
+      getManageMemberColumnGet({id: id})
+      .then((data) => {
+        setState(data);
+      })
+    }
+
+  }, [id])
+  return state
+}
+
+const ColumnInfo = () => {
+  const intl = useIntl()
+  useCustomValidator();
+  const { id, preview } = usePageStatus();
+  const [ submitLoading, setSubmitLoading ] = useState(false);
+  const initialValues  = useInitialValues(id);
+  const [unsaved, setUnsaved] = useState(true);
+  const isEdit = id && !preview;
+  const isAdd = !id && !preview;
+
+  const schema = {
     type: 'object',
     properties: {
       layout: {
@@ -41,13 +65,13 @@ const schema = {
         properties: {
           name: {
             name: 'name',
-          title: '栏目名称',
+            title: intl.formatMessage({ id: 'content.columns.name' }),
             'x-component': 'Input',
             "required": true,
             "x-rules": [
               {
                 "required": true,
-              "message": "最长20个字符，10个汉字"
+                "message": `20${intl.formatMessage({ id: 'common.unit.individual.character' })}, 10${intl.formatMessage({ id: 'common.unit.individual.chinese' })}`
               },
               {
                 limitByte: true,  // 自定义校验规则
@@ -55,35 +79,35 @@ const schema = {
               },
               {
                 validator: value => value.trim().length === 0,
-              message: '栏目名称不可为空',
+                message: `${intl.formatMessage({ id: 'content.columns.name' })}${intl.formatMessage({ id: 'common.text.notEmpty' })}`,
               }
             ]
           },
           type: {
-          title: '栏目分类',
+            title: intl.formatMessage({ id: 'content.columns.category' }),
             'x-component': 'Select',
             "x-component-props": {
               options: [
-              { label: '市场行情', value: 1 },
-              { label: '资讯', value: 2 },
+                { label: intl.formatMessage({ id: 'content.columns.market' }), value: 1 },
+                { label: intl.formatMessage({ id: 'content.columns.information' }), value: 2 },
               ]
             },
             "required": true,
             "x-rules": [
               {
                 "required": true,
-              "message": "请选择栏目分类"
+                "message": `${intl.formatMessage({ id: 'common.text.pleaseSelect' })}${intl.formatMessage({ id: 'content.columns.category' })}`,
               },
             ]
           },
           sort: {
             name: 'sort',
-          title: '栏目排序',
+            title: intl.formatMessage({ id: 'content.columns.sort' }),
             'x-component': 'Select',
             "required": true,
             "x-rules": {
               "required": true,
-            "message": "请选择栏目排序"
+              "message": `${intl.formatMessage({ id: 'common.text.pleaseSelect' })}${intl.formatMessage({ id: 'content.columns.sort' })}`,
             },
             "x-component-props": {
               options: sortedList
@@ -92,31 +116,8 @@ const schema = {
         }
       }
     }
-}
-
-const useInitialValues = (id) => {
-  const [state, setState] = useState({})
-  useEffect(() => {
-    if(id) {
-      getManageMemberColumnGet({id: id})
-      .then((data) => {
-        setState(data);
-      })
   }
 
-  }, [id])
-  return state
-}
-
-const ColumnInfo = () => {
-  useCustomValidator();
-  const { id, preview } = usePageStatus();
-  const [ submitLoading, setSubmitLoading ] = useState(false);
-  const initialValues  = useInitialValues(id);
-  const [unsaved, setUnsaved] = useState(true);
-  const isEdit = id && !preview;
-  const isAdd = !id && !preview;
-
   const handleSubmit =  async (value: { name: string, sort: number, type: number }) => {
     const {  name, sort, type} = value;
     const serviceActions = isAdd
@@ -146,8 +147,8 @@ const ColumnInfo = () => {
     <div>
       <PageHeaderWrapper
         onBack={() => history.goBack()}
-        backIcon={<ReutrnEle description="返回" />}
-        title={!id ? '新建栏目' : '编辑栏目'}
+        backIcon={<ReutrnEle description={intl.formatMessage({ id: 'common.button.back' })} />}
+        title={intl.formatMessage({ id: id ? 'content.columns.edit' : 'content.columns.add' })}
       >
         <Card>
           <SchemaForm
@@ -161,8 +162,8 @@ const ColumnInfo = () => {
               isAdd || isEdit
               ? (
                   <FormButtonGroup offset={3}>
-                    <Submit loading={submitLoading}>提交</Submit>
-                    <Button onClick={handleCancel}>取消</Button>
+                    <Submit loading={submitLoading}>{intl.formatMessage({ id: 'common.button.submit' })}</Submit>
+                    <Button onClick={handleCancel}>{intl.formatMessage({ id: 'common.button.cancel' })}</Button>
                   </FormButtonGroup>
                 )
               : <></>
@@ -171,7 +172,7 @@ const ColumnInfo = () => {
           </SchemaForm>
         </Card>
       </PageHeaderWrapper>
-      <Prompt when={unsaved && (isAdd || isEdit)} message="您还有未保存的内容，是否确定要离开？" />
+      <Prompt when={unsaved && (isAdd || isEdit)} message={intl.formatMessage({ id: 'common.tip.save.confirm' })} />
     </div>
   )
 }

src/pages/content/columnManagement/index.tsx

 import React, { useEffect, useState, useRef } from 'react';
 import { Card, Button, Popconfirm, Row, Col  } from 'antd';
-import { createFormActions } from '@formily/antd';
-import { history, Link } from 'umi';
+import { createFormActions, ISchema } from '@formily/antd';
+import { history, useIntl } from 'umi';
 import StatusSwitch from '@/components/StatusSwitch';
 import { FORM_FILTER_PATH } from '@/formSchema/const';
 import { PlusOutlined } from '@ant-design/icons'
@@ -10,7 +10,6 @@ import { getTableDataSource } from '../utils/utils';
 import { PageHeaderWrapper } from '@ant-design/pro-layout'
 import NiceForm from '@/components/NiceForm';
 import EyePreview from '@/components/EyePreview'
-import { ISchema } from '@formily/antd';
 import { StandardTable } from 'god'
 import { useStateFilterSearchLinkageEffect } from '@/formSchema/effects/useFilterSearch';
 import { getManageMemberColumnPage, postManageMemberColumnDelete, postManageMemberColumnUpdateStatus } from '@/services/ManageV2Api';
@@ -23,7 +22,12 @@ const getData = async (params) => {
 	return res.data
 }
 
-const schema: ISchema = {
+const columnList: React.FC<{}> = () => {
+
+  const intl = useIntl()
+  const ref = useRef<any>({})
+
+  const schema: ISchema = {
     type: 'object',
     properties: {
       megalayout: {
@@ -47,30 +51,14 @@ const schema: ISchema = {
 
             },
             "x-component-props": {
-            placeholder: '栏目名称',
+              placeholder: intl.formatMessage({ id: 'content.columns.name' }),
               advanced: false
             }
           }
         }
       }
     }
-}
-
-const controllerBtns = <Row>
-  <Col span={6}>
-    <Button
-      onClick={() => history.push('/memberCenter/contentAbility/columnsManagement/add')}
-      type="primary"
-      icon={<PlusOutlined />}
-    >
-      新建
-    </Button>
-  </Col>
-</Row>
-
-const columnList: React.FC<{}> = () => {
-
-  const ref = useRef<any>({})
+  }
 
   // 停用/启用
   const handleModify = async (record: any) => {
@@ -106,7 +94,7 @@ const columnList: React.FC<{}> = () => {
       key: 'id',
     },
     {
-      title: '栏目名称',
+      title: intl.formatMessage({ id: 'content.columns.name' }),
       dataIndex: 'name',
       key: 'name',
       render: (text: any, record: any) => (
@@ -116,20 +104,20 @@ const columnList: React.FC<{}> = () => {
       )
     },
     {
-      title: '栏目分类',
+      title: intl.formatMessage({ id: 'content.columns.category' }),
       align: 'center',
       dataIndex: 'type',
       key: 'type',
-      render: (text) => text === 1 ? '市场行情' : '资讯'
+      render: (text) => text === 1 ? intl.formatMessage({ id: 'content.columns.market' }) : intl.formatMessage({ id: 'content.columns.information' })
     },
     {
-      title: '栏目排序',
+      title: intl.formatMessage({ id: 'content.columns.sort' }),
       align: 'center',
       dataIndex: 'sort',
       key: 'sort',
     },
     {
-      title: '状态',
+      title: intl.formatMessage({ id: 'common.table.status' }),
       align: 'center',
       dataIndex: 'status',
       key: 'status',
@@ -142,25 +130,35 @@ const columnList: React.FC<{}> = () => {
       )
     },
     {
-      title: '操作',
+      title: intl.formatMessage({ id: 'common.table.action' }),
       align: 'center',
       key: 'operate',
       dataIndex: 'operate',
       render: (_, record) => !record.status && (
         <>
-          <Button type='link' onClick={() => history.push(`/memberCenter/contentAbility/columnsManagement/detail?id=${record.id}`)}>修改</Button>
+          <Button type='link' onClick={() => history.push(`/memberCenter/contentAbility/columnsManagement/detail?id=${record.id}`)}>{intl.formatMessage({ id: 'common.button.modify' })}</Button>
           <Popconfirm
-            title="确定要执行这个操作?"
+            title={intl.formatMessage({ id: 'common.tip.option.confirm' })}
             onConfirm={() => handleRemove(record.id)}
           >
-            <Button type='link'>删除</Button>
+            <Button type='link'>{intl.formatMessage({ id: 'common.button.delete' })}</Button>
           </Popconfirm>
         </>
       )
     }
   ]
 
-
+  const controllerBtns = <Row>
+    <Col span={6}>
+      <Button
+        onClick={() => history.push('/memberCenter/contentAbility/columnsManagement/add')}
+        type="primary"
+        icon={<PlusOutlined />}
+      >
+        {intl.formatMessage({ id: 'common.button.add' })}
+      </Button>
+    </Col>
+  </Row>
 
 	return (
     <PageHeaderWrapper>