fix(sample): fix shop-i18n client (#1005)
This commit is contained in:
		
							parent
							
								
									d5680f80d7
								
							
						
					
					
						commit
						1065e5e616
					
				| @ -1,15 +1,15 @@ | |||||||
| # Modeling for simple shop scenario | # I18n for simple shop scenario | ||||||
| 
 | 
 | ||||||
| ## Register | ## Register | ||||||
| 
 | 
 | ||||||
| ```ts | ```ts | ||||||
| yarn pm add sample-shop-modeling | yarn pm add sample-shop-i18n | ||||||
| ``` | ``` | ||||||
| 
 | 
 | ||||||
| ## Activate | ## Activate | ||||||
| 
 | 
 | ||||||
| ```bash | ```bash | ||||||
| yarn pm enable sample-shop-modeling | yarn pm enable sample-shop-i18n | ||||||
| ``` | ``` | ||||||
| 
 | 
 | ||||||
| ## Launch the app | ## Launch the app | ||||||
|  | |||||||
| @ -1,10 +1,15 @@ | |||||||
| 
 | import React, { useContext } from 'react'; | ||||||
| import React from 'react'; | import { useHistory } from 'react-router-dom'; | ||||||
| import { Select } from 'antd'; |  | ||||||
| import { i18n } from '@nocobase/client'; |  | ||||||
| import { useTranslation } from 'react-i18next'; | import { useTranslation } from 'react-i18next'; | ||||||
|  | import { Select } from 'antd'; | ||||||
|  | import { ShopOutlined } from '@ant-design/icons'; | ||||||
|  | import { i18n, PluginManager, PluginManagerContext, RouteSwitchContext, SettingsCenterProvider } from '@nocobase/client'; | ||||||
| 
 | 
 | ||||||
| i18n.addResources('zh-CN', '@nocobase/plugin-sample-shop-i18n', { | const ns = '@nocobase/plugin-sample-shop-i18n'; | ||||||
|  | 
 | ||||||
|  | i18n.addResources('zh-CN', ns, { | ||||||
|  |   Shop: '店铺', | ||||||
|  |   I18n: '国际化', | ||||||
|   Pending: '已下单', |   Pending: '已下单', | ||||||
|   Paid: '已支付', |   Paid: '已支付', | ||||||
|   Delivered: '已发货', |   Delivered: '已发货', | ||||||
| @ -20,7 +25,7 @@ const ORDER_STATUS_LIST = [ | |||||||
| ] | ] | ||||||
| 
 | 
 | ||||||
| function OrderStatusSelect() { | function OrderStatusSelect() { | ||||||
|   const { t } = useTranslation('@nocobase/plugin-sample-shop-i18n'); |   const { t } = useTranslation(ns); | ||||||
| 
 | 
 | ||||||
|   return ( |   return ( | ||||||
|     <Select style={{ minWidth: '8em' }}> |     <Select style={{ minWidth: '8em' }}> | ||||||
| @ -31,6 +36,52 @@ function OrderStatusSelect() { | |||||||
|   ); |   ); | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
|  | export const ShopShortcut = () => { | ||||||
|  |   const { t } = useTranslation(); | ||||||
|  |   const history = useHistory(); | ||||||
|  |   return ( | ||||||
|  |     <PluginManager.Toolbar.Item | ||||||
|  |       key="workflow" | ||||||
|  |       icon={<ShopOutlined />} | ||||||
|  |       title={t('Workflow')} | ||||||
|  |       onClick={() => { | ||||||
|  |         history.push('/admin/settings/workflow/workflows'); | ||||||
|  |       }} | ||||||
|  |     /> | ||||||
|  |   ); | ||||||
|  | }; | ||||||
|  | 
 | ||||||
| export default React.memo((props) => { | export default React.memo((props) => { | ||||||
|   return <OrderStatusSelect />; |   const ctx = useContext(PluginManagerContext); | ||||||
|  |   const { routes, components, ...others } = useContext(RouteSwitchContext); | ||||||
|  | 
 | ||||||
|  |   return ( | ||||||
|  |     <SettingsCenterProvider | ||||||
|  |       settings={{ | ||||||
|  |         workflow: { | ||||||
|  |           icon: 'ShopOutlined', | ||||||
|  |           title: `{{t("Shop", { ns: "${ns}" })}}`, | ||||||
|  |           tabs: { | ||||||
|  |             workflows: { | ||||||
|  |               title: `{{t("I18n", { ns: "${ns}" })}}`, | ||||||
|  |               component: OrderStatusSelect, | ||||||
|  |             }, | ||||||
|  |           }, | ||||||
|  |         }, | ||||||
|  |       }} | ||||||
|  |     > | ||||||
|  |       <PluginManagerContext.Provider | ||||||
|  |         value={{ | ||||||
|  |           components: { | ||||||
|  |             ...ctx?.components, | ||||||
|  |             ShopShortcut, | ||||||
|  |           }, | ||||||
|  |         }} | ||||||
|  |       > | ||||||
|  |         <RouteSwitchContext.Provider value={{ components: { ...components }, ...others, routes }}> | ||||||
|  |           {props.children} | ||||||
|  |         </RouteSwitchContext.Provider> | ||||||
|  |       </PluginManagerContext.Provider> | ||||||
|  |     </SettingsCenterProvider> | ||||||
|  |   ); | ||||||
| }); | }); | ||||||
|  | |||||||
		Loading…
	
		Reference in New Issue
	
	Block a user