style: 开放平台插件补全国际化翻译

pull/90/head
moonrailgun 2 years ago
parent 4a289d1f93
commit f0abf1b9cb

@ -6,6 +6,7 @@ import {
} from '@capital/component'; } from '@capital/component';
import { useOpenAppInfo } from '../context'; import { useOpenAppInfo } from '../context';
import { useOpenAppAction } from './useOpenAppAction'; import { useOpenAppAction } from './useOpenAppAction';
import { Translate } from '../../translate';
const OAuth: React.FC = React.memo(() => { const OAuth: React.FC = React.memo(() => {
const { capability, oauth } = useOpenAppInfo(); const { capability, oauth } = useOpenAppInfo();
@ -15,7 +16,7 @@ const OAuth: React.FC = React.memo(() => {
return ( return (
<div className="plugin-openapi-app-info_oauth"> <div className="plugin-openapi-app-info_oauth">
<FullModalField <FullModalField
title="开启 OAuth" title={Translate.oauth.open}
content={ content={
<Switch <Switch
disabled={loading} disabled={loading}
@ -27,8 +28,8 @@ const OAuth: React.FC = React.memo(() => {
{capability.includes('oauth') && ( {capability.includes('oauth') && (
<FullModalField <FullModalField
title={'允许的回调地址'} title={Translate.oauth.allowedCallbackUrls}
tip="多个回调地址单独一行" tip={Translate.oauth.allowedCallbackUrlsTip}
content={ content={
<> <>
{(oauth?.redirectUrls ?? []).map((url, i) => ( {(oauth?.redirectUrls ?? []).map((url, i) => (

@ -1,6 +1,7 @@
import { useOpenAppInfo } from '../context'; import { useOpenAppInfo } from '../context';
import React from 'react'; import React from 'react';
import { FullModalField, Divider, SensitiveText } from '@capital/component'; import { FullModalField, Divider, SensitiveText } from '@capital/component';
import { Translate } from '../../translate';
import './Profile.less'; import './Profile.less';
/** /**
@ -11,7 +12,7 @@ const Profile: React.FC = React.memo(() => {
return ( return (
<div className="plugin-openapi-app-info_profile"> <div className="plugin-openapi-app-info_profile">
<h2></h2> <h2>{Translate.app.appcret}</h2>
<div> <div>
<FullModalField title="App ID" content={appId} /> <FullModalField title="App ID" content={appId} />
@ -23,7 +24,7 @@ const Profile: React.FC = React.memo(() => {
<Divider /> <Divider />
<h2></h2> <h2>{Translate.app.basicInfo}</h2>
{/* TODO */} {/* TODO */}
</div> </div>

@ -2,9 +2,10 @@ import React, { useMemo } from 'react';
import { SidebarView } from '@capital/component'; import { SidebarView } from '@capital/component';
import { Loadable } from '@capital/common'; import { Loadable } from '@capital/common';
import { useOpenAppInfo } from '../context'; import { useOpenAppInfo } from '../context';
import { Translate } from '../../translate';
import './index.less'; import './index.less';
const Summary = Loadable(() => import('./Summary')); // const Summary = Loadable(() => import('./Summary'));
const Profile = Loadable(() => import('./Profile')); const Profile = Loadable(() => import('./Profile'));
const Bot = Loadable(() => import('./Bot')); const Bot = Loadable(() => import('./Bot'));
const Webpage = Loadable(() => import('./Webpage')); const Webpage = Loadable(() => import('./Webpage'));
@ -19,31 +20,31 @@ const AppInfo: React.FC = React.memo(() => {
type: 'group', type: 'group',
title: appName, title: appName,
children: [ children: [
// {
// type: 'item',
// title: '总览',
// content: <Summary />,
// isDev: true,
// },
{ {
type: 'item', type: 'item',
title: '总览', title: Translate.app.basicInfo,
content: <Summary />,
isDev: true,
},
{
type: 'item',
title: '基础信息',
content: <Profile />, content: <Profile />,
}, },
{ {
type: 'item', type: 'item',
title: '机器人', title: Translate.app.bot,
content: <Bot />, content: <Bot />,
}, },
{ {
type: 'item', type: 'item',
title: '网页', title: Translate.app.webpage,
content: <Webpage />, content: <Webpage />,
isDev: true, isDev: true,
}, },
{ {
type: 'item', type: 'item',
title: '应用登录', title: Translate.app.oauth,
content: <OAuth />, content: <OAuth />,
}, },
], ],

@ -7,6 +7,7 @@ import { OpenAppInfoProvider } from './context';
import { CreateOpenApp } from '../modals/CreateOpenApp'; import { CreateOpenApp } from '../modals/CreateOpenApp';
import { ServiceChecker } from '../components/ServiceChecker'; import { ServiceChecker } from '../components/ServiceChecker';
import { useOpenAppList } from './useOpenAppList'; import { useOpenAppList } from './useOpenAppList';
import { Translate } from '../translate';
import './index.less'; import './index.less';
const OpenApiMainPanel: React.FC = React.memo(() => { const OpenApiMainPanel: React.FC = React.memo(() => {
@ -16,16 +17,16 @@ const OpenApiMainPanel: React.FC = React.memo(() => {
const columns = useMemo( const columns = useMemo(
() => [ () => [
{ {
title: '名称', title: Translate.name,
dataIndex: 'appName', dataIndex: 'appName',
}, },
{ {
title: '操作', title: Translate.operation,
key: 'action', key: 'action',
render: (_, record: OpenApp) => ( render: (_, record: OpenApp) => (
<Space> <Space>
<Button onClick={() => handleSetSelectedApp(record._id)}> <Button onClick={() => handleSetSelectedApp(record._id)}>
{Translate.enter}
</Button> </Button>
</Space> </Space>
), ),
@ -59,7 +60,7 @@ const OpenApiMainPanel: React.FC = React.memo(() => {
type="primary" type="primary"
onClick={handleCreateOpenApp} onClick={handleCreateOpenApp}
> >
{Translate.createApplication}
</Button> </Button>
<Table columns={columns} dataSource={allApps} pagination={false} /> <Table columns={columns} dataSource={allApps} pagination={false} />
</> </>

@ -8,21 +8,22 @@ import {
} from '@capital/common'; } from '@capital/common';
import { WebFastForm } from '@capital/component'; import { WebFastForm } from '@capital/component';
import React from 'react'; import React from 'react';
import { Translate } from '../translate';
const schema = createFastFormSchema({ const schema = createFastFormSchema({
appName: fieldSchema appName: fieldSchema
.string() .string()
.required('应用名不能为空') .required(Translate.appNameCannotBeEmpty)
.max(20, '应用名过长'), .max(20, Translate.appNameTooLong),
appDesc: fieldSchema.string(), appDesc: fieldSchema.string(),
}); });
const fields = [ const fields = [
{ type: 'text', name: 'appName', label: '应用名' }, { type: 'text', name: 'appName', label: Translate.app.appName },
{ {
type: 'textarea', type: 'textarea',
name: 'appDesc', name: 'appDesc',
label: '应用描述', label: Translate.app.appDesc,
}, },
]; ];
@ -38,7 +39,7 @@ export const CreateOpenApp: React.FC<CreateOpenAppProps> = React.memo(
appIcon: '', appIcon: '',
}); });
showToasts('应用创建成功', 'success'); showToasts(Translate.createApplicationSuccess, 'success');
props.onSuccess?.(); props.onSuccess?.();
} catch (e) { } catch (e) {
showErrorToasts(e); showErrorToasts(e);
@ -46,7 +47,7 @@ export const CreateOpenApp: React.FC<CreateOpenAppProps> = React.memo(
}; };
return ( return (
<ModalWrapper title="创建应用"> <ModalWrapper title={Translate.createApplication}>
<WebFastForm schema={schema} fields={fields} onSubmit={handleSubmit} /> <WebFastForm schema={schema} fields={fields} onSubmit={handleSubmit} />
</ModalWrapper> </ModalWrapper>
); );

@ -10,6 +10,64 @@ export const Translate = {
'zh-CN': '开启机器人能力', 'zh-CN': '开启机器人能力',
'en-US': 'Enable Bot Capability', 'en-US': 'Enable Bot Capability',
}), }),
name: localTrans({
'zh-CN': '名称',
'en-US': 'Name',
}),
operation: localTrans({
'zh-CN': '操作',
'en-US': 'Operation',
}),
enter: localTrans({
'zh-CN': '进入',
'en-US': 'Enter',
}),
createApplication: localTrans({
'zh-CN': '创建应用',
'en-US': 'Create Application',
}),
createApplicationSuccess: localTrans({
'zh-CN': '创建应用成功',
'en-US': 'Create Application Success',
}),
appNameCannotBeEmpty: localTrans({
'zh-CN': '应用名不能为空',
'en-US': 'App Name Cannot be Empty',
}),
appNameTooLong: localTrans({
'zh-CN': '应用名过长',
'en-US': 'App Name too Long',
}),
app: {
basicInfo: localTrans({
'zh-CN': '基础信息',
'en-US': 'Basic Info',
}),
bot: localTrans({
'zh-CN': '机器人',
'en-US': 'Bot',
}),
webpage: localTrans({
'zh-CN': '网页',
'en-US': 'Web Page',
}),
oauth: localTrans({
'zh-CN': '第三方登录',
'en-US': 'OAuth',
}),
appcret: localTrans({
'zh-CN': '应用凭证',
'en-US': 'Application Credentials',
}),
appName: localTrans({
'zh-CN': '应用名称',
'en-US': 'App Name',
}),
appDesc: localTrans({
'zh-CN': '应用描述',
'en-US': 'App Desc',
}),
},
bot: { bot: {
callback: localTrans({ callback: localTrans({
'zh-CN': '消息回调地址', 'zh-CN': '消息回调地址',
@ -22,4 +80,18 @@ export const Translate = {
'The bot will send a request to this address when it is mentioned (callback will be sent when the inbox receives new content)', 'The bot will send a request to this address when it is mentioned (callback will be sent when the inbox receives new content)',
}), }),
}, },
oauth: {
open: localTrans({
'zh-CN': '开启 OAuth',
'en-US': 'Open OAuth',
}),
allowedCallbackUrls: localTrans({
'zh-CN': '允许的回调地址',
'en-US': 'Allowed Callback Urls',
}),
allowedCallbackUrlsTip: localTrans({
'zh-CN': '多个回调地址单独一行',
'en-US': 'Multiple callback addresses on a single line',
}),
},
}; };

@ -128,7 +128,7 @@ wget https://raw.githubusercontent.com/msgbyte/tailchat/master/docker-compose.en
修改 `docker-compose.env` 文件的配置,以下字段推荐修改: 修改 `docker-compose.env` 文件的配置,以下字段推荐修改:
- `API_URL` 对外可访问的url地址用于文件服务访问, 可以是域名也可以是ip - `API_URL` 对外可访问的url地址用于文件服务访问, 可以是域名也可以是ip **如果出现发送图片不能正常显示就是这个变量没有设置**
- `SECRET` 服务端加密秘钥用于生成Token. 默认为 `tailchat` - `SECRET` 服务端加密秘钥用于生成Token. 默认为 `tailchat`

Loading…
Cancel
Save