mirror of
https://github.com/MetaCubeX/metacubexd.git
synced 2024-11-10 05:15:35 +08:00
feat: i18n for conn table
This commit is contained in:
parent
9d3706f390
commit
33fa191cfe
@ -27,7 +27,7 @@ const Collapse: ParentComponent<Props> = (props) => {
|
|||||||
<div
|
<div
|
||||||
class={twMerge(
|
class={twMerge(
|
||||||
getCollapseClassName(),
|
getCollapseClassName(),
|
||||||
'collapse collapse-arrow mb-2 overflow-visible border-secondary bg-base-200',
|
'collapse collapse-arrow mb-2 select-none overflow-visible border-secondary bg-base-200',
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
|
@ -13,7 +13,7 @@ import {
|
|||||||
createSortable,
|
createSortable,
|
||||||
useDragDropContext,
|
useDragDropContext,
|
||||||
} from '@thisbeyond/solid-dnd'
|
} from '@thisbeyond/solid-dnd'
|
||||||
import { For, createSignal } from 'solid-js'
|
import { For, Show, createSignal } from 'solid-js'
|
||||||
import { AccessorKey } from '~/config/enum'
|
import { AccessorKey } from '~/config/enum'
|
||||||
|
|
||||||
type ColumnVisibility = Partial<Record<AccessorKey, boolean>>
|
type ColumnVisibility = Partial<Record<AccessorKey, boolean>>
|
||||||
@ -65,7 +65,7 @@ export default (props: {
|
|||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div class="m-1 flex cursor-grab justify-between p-1">
|
<div class="m-1 flex cursor-grab justify-between p-1">
|
||||||
<span class="select-none">{key}</span>
|
<span class="select-none">{t(key)}</span>
|
||||||
<input
|
<input
|
||||||
type="checkbox"
|
type="checkbox"
|
||||||
class="toggle"
|
class="toggle"
|
||||||
@ -99,7 +99,9 @@ export default (props: {
|
|||||||
</SortableProvider>
|
</SortableProvider>
|
||||||
</div>
|
</div>
|
||||||
<DragOverlay>
|
<DragOverlay>
|
||||||
<div class="sortable">{activeKey()}</div>
|
<Show when={activeKey()}>
|
||||||
|
<div class="sortable">{t(activeKey()!)}</div>
|
||||||
|
</Show>
|
||||||
</DragOverlay>
|
</DragOverlay>
|
||||||
</DragDropProvider>
|
</DragDropProvider>
|
||||||
|
|
||||||
|
@ -14,6 +14,7 @@ import {
|
|||||||
} from '@tabler/icons-solidjs'
|
} from '@tabler/icons-solidjs'
|
||||||
import { For, ParentComponent, Show, createSignal } from 'solid-js'
|
import { For, ParentComponent, Show, createSignal } from 'solid-js'
|
||||||
import { twMerge } from 'tailwind-merge'
|
import { twMerge } from 'tailwind-merge'
|
||||||
|
import { LANG } from '~/config/enum'
|
||||||
import { themes } from '~/constants'
|
import { themes } from '~/constants'
|
||||||
import { setCurTheme, setSelectedEndpoint } from '~/signals'
|
import { setCurTheme, setSelectedEndpoint } from '~/signals'
|
||||||
|
|
||||||
@ -171,7 +172,7 @@ export const Header = () => {
|
|||||||
onClick={() => {
|
onClick={() => {
|
||||||
const curLocale = locale()
|
const curLocale = locale()
|
||||||
|
|
||||||
locale(curLocale === 'en-US' ? 'zh-Hans' : 'en-US')
|
locale(curLocale === LANG.EN ? LANG.ZH : LANG.EN)
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<IconLanguage />
|
<IconLanguage />
|
||||||
|
@ -1,17 +1,17 @@
|
|||||||
export enum AccessorKey {
|
export enum AccessorKey {
|
||||||
Close = 'Close',
|
Close = 'close',
|
||||||
ID = 'ID',
|
ID = 'ID',
|
||||||
Type = 'Type',
|
Type = 'type',
|
||||||
Process = 'Process',
|
Process = 'process',
|
||||||
Host = 'Host',
|
Host = 'host',
|
||||||
Rule = 'Rule',
|
Rule = 'rules',
|
||||||
Chains = 'Chains',
|
Chains = 'chains',
|
||||||
DlSpeed = 'DL Speed',
|
DlSpeed = 'dlSpeed',
|
||||||
ULSpeed = 'UL Speed',
|
ULSpeed = 'ulSpeed',
|
||||||
Download = 'DL',
|
Download = 'dl',
|
||||||
Upload = 'UL',
|
Upload = 'ul',
|
||||||
Source = 'Source',
|
Source = 'source',
|
||||||
Destination = 'Destination',
|
Destination = 'destination',
|
||||||
}
|
}
|
||||||
|
|
||||||
export enum DELAY {
|
export enum DELAY {
|
||||||
@ -24,3 +24,8 @@ export enum PROXIES_PREVIEW_TYPE {
|
|||||||
DOTS = 'dots',
|
DOTS = 'dots',
|
||||||
BAR = 'bar',
|
BAR = 'bar',
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export enum LANG {
|
||||||
|
EN = 'en-US',
|
||||||
|
ZH = 'zh-CN',
|
||||||
|
}
|
||||||
|
8
src/i18n/dict.ts
Normal file
8
src/i18n/dict.ts
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
import { LANG } from '~/config/enum'
|
||||||
|
import en from './en'
|
||||||
|
import zh from './zh'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
[LANG.EN]: en,
|
||||||
|
[LANG.ZH]: zh,
|
||||||
|
}
|
36
src/i18n/en.ts
Normal file
36
src/i18n/en.ts
Normal file
@ -0,0 +1,36 @@
|
|||||||
|
export default {
|
||||||
|
add: 'Add',
|
||||||
|
overview: 'Overview',
|
||||||
|
proxies: 'Proxies',
|
||||||
|
rules: 'Rules',
|
||||||
|
connections: 'Connections',
|
||||||
|
logs: 'Logs',
|
||||||
|
config: 'Config',
|
||||||
|
upload: 'Upload',
|
||||||
|
download: 'Download',
|
||||||
|
uploadTotal: 'Upload Total',
|
||||||
|
downloadTotal: 'Download Total',
|
||||||
|
activeConnections: 'Active Connections',
|
||||||
|
memoryUsage: 'Memory Usage',
|
||||||
|
traffic: 'Traffic',
|
||||||
|
memory: 'Memory',
|
||||||
|
down: 'Down',
|
||||||
|
up: 'Up',
|
||||||
|
proxyProviders: 'Proxy Providers',
|
||||||
|
ruleProviders: 'Rule Providers',
|
||||||
|
search: 'Search',
|
||||||
|
ID: 'ID',
|
||||||
|
type: 'Type',
|
||||||
|
name: 'Name',
|
||||||
|
process: 'Process',
|
||||||
|
host: 'Host',
|
||||||
|
chains: 'Chains',
|
||||||
|
dlSpeed: 'DL Speed',
|
||||||
|
ulSpeed: 'UL Speed',
|
||||||
|
dl: 'DL',
|
||||||
|
ul: 'UL',
|
||||||
|
source: 'Source',
|
||||||
|
destination: 'Destination',
|
||||||
|
close: 'Close',
|
||||||
|
reset: 'Reset',
|
||||||
|
}
|
@ -1,84 +1,13 @@
|
|||||||
import { I18nContext, createI18nContext, useI18n } from '@solid-primitives/i18n'
|
import { I18nContext, createI18nContext, useI18n } from '@solid-primitives/i18n'
|
||||||
import { makePersisted } from '@solid-primitives/storage'
|
import { makePersisted } from '@solid-primitives/storage'
|
||||||
import { ParentComponent, createEffect, createSignal } from 'solid-js'
|
import { ParentComponent, createEffect, createSignal } from 'solid-js'
|
||||||
|
import { LANG } from '~/config/enum'
|
||||||
const dict = {
|
import dict from './dict'
|
||||||
'en-US': {
|
|
||||||
add: 'Add',
|
|
||||||
overview: 'Overview',
|
|
||||||
proxies: 'Proxies',
|
|
||||||
rules: 'Rules',
|
|
||||||
connections: 'Connections',
|
|
||||||
logs: 'Logs',
|
|
||||||
config: 'Config',
|
|
||||||
upload: 'Upload',
|
|
||||||
download: 'Download',
|
|
||||||
uploadTotal: 'Upload Total',
|
|
||||||
downloadTotal: 'Download Total',
|
|
||||||
activeConnections: 'Active Connections',
|
|
||||||
memoryUsage: 'Memory Usage',
|
|
||||||
traffic: 'Traffic',
|
|
||||||
memory: 'Memory',
|
|
||||||
down: 'Down',
|
|
||||||
up: 'Up',
|
|
||||||
proxyProviders: 'Proxy Providers',
|
|
||||||
ruleProviders: 'Rule Providers',
|
|
||||||
search: 'Search',
|
|
||||||
type: 'Type',
|
|
||||||
name: 'Name',
|
|
||||||
process: 'Process',
|
|
||||||
host: 'Host',
|
|
||||||
chains: 'Chains',
|
|
||||||
dlSpeed: 'DL Speed',
|
|
||||||
ulSpeed: 'UL Speed',
|
|
||||||
dl: 'DL',
|
|
||||||
ul: 'UL',
|
|
||||||
source: 'Source',
|
|
||||||
destination: 'Destination',
|
|
||||||
close: 'Close',
|
|
||||||
reset: 'Reset',
|
|
||||||
},
|
|
||||||
'zh-Hans': {
|
|
||||||
add: '添加',
|
|
||||||
overview: '概览',
|
|
||||||
proxies: '代理',
|
|
||||||
rules: '规则',
|
|
||||||
connections: '连接',
|
|
||||||
logs: '日志',
|
|
||||||
config: '配置',
|
|
||||||
upload: '上传',
|
|
||||||
download: '下载',
|
|
||||||
uploadTotal: '上传总量',
|
|
||||||
downloadTotal: '下载总量',
|
|
||||||
activeConnections: '活动连接',
|
|
||||||
memoryUsage: '内存使用情况',
|
|
||||||
traffic: '流量',
|
|
||||||
memory: '内存',
|
|
||||||
down: '下载',
|
|
||||||
up: '上传',
|
|
||||||
proxyProviders: '代理提供者',
|
|
||||||
ruleProviders: '规则提供者',
|
|
||||||
search: '搜索',
|
|
||||||
type: '类型',
|
|
||||||
name: '名字',
|
|
||||||
process: '进程',
|
|
||||||
host: '主机',
|
|
||||||
chains: '链路',
|
|
||||||
dlSpeed: '下载速度',
|
|
||||||
ulSpeed: '上传速度',
|
|
||||||
dl: '下载量',
|
|
||||||
ul: '上传量',
|
|
||||||
source: '源地址',
|
|
||||||
destination: '目标地址',
|
|
||||||
close: '关闭',
|
|
||||||
reset: '重置',
|
|
||||||
},
|
|
||||||
}
|
|
||||||
|
|
||||||
const useLanguage = () => {
|
const useLanguage = () => {
|
||||||
const [lang, setLang] = makePersisted(
|
const [lang, setLang] = makePersisted(
|
||||||
createSignal(
|
createSignal(
|
||||||
Reflect.has(dict, navigator.language) ? navigator.language : 'en-US',
|
Reflect.has(dict, navigator.language) ? navigator.language : LANG.EN,
|
||||||
),
|
),
|
||||||
{
|
{
|
||||||
name: 'lang',
|
name: 'lang',
|
||||||
|
36
src/i18n/zh.ts
Normal file
36
src/i18n/zh.ts
Normal file
@ -0,0 +1,36 @@
|
|||||||
|
export default {
|
||||||
|
add: '添加',
|
||||||
|
overview: '概览',
|
||||||
|
proxies: '代理',
|
||||||
|
rules: '规则',
|
||||||
|
connections: '连接',
|
||||||
|
logs: '日志',
|
||||||
|
config: '配置',
|
||||||
|
upload: '上传',
|
||||||
|
download: '下载',
|
||||||
|
uploadTotal: '上传总量',
|
||||||
|
downloadTotal: '下载总量',
|
||||||
|
activeConnections: '活动连接',
|
||||||
|
memoryUsage: '内存使用情况',
|
||||||
|
traffic: '流量',
|
||||||
|
memory: '内存',
|
||||||
|
down: '下载',
|
||||||
|
up: '上传',
|
||||||
|
proxyProviders: '代理提供者',
|
||||||
|
ruleProviders: '规则提供者',
|
||||||
|
search: '搜索',
|
||||||
|
ID: 'ID',
|
||||||
|
type: '类型',
|
||||||
|
name: '名字',
|
||||||
|
process: '进程',
|
||||||
|
host: '主机',
|
||||||
|
chains: '链路',
|
||||||
|
dlSpeed: '下载速度',
|
||||||
|
ulSpeed: '上传速度',
|
||||||
|
dl: '下载量',
|
||||||
|
ul: '上传量',
|
||||||
|
source: '源地址',
|
||||||
|
destination: '目标地址',
|
||||||
|
close: '关闭',
|
||||||
|
reset: '重置',
|
||||||
|
}
|
@ -278,11 +278,13 @@ export default () => {
|
|||||||
)}
|
)}
|
||||||
onClick={header.column.getToggleSortingHandler()}
|
onClick={header.column.getToggleSortingHandler()}
|
||||||
>
|
>
|
||||||
{header.isPlaceholder
|
{header.column.id === AccessorKey.Close ? (
|
||||||
? null
|
flexRender(
|
||||||
: flexRender(
|
|
||||||
header.column.columnDef.header,
|
header.column.columnDef.header,
|
||||||
header.getContext(),
|
header.getContext(),
|
||||||
|
)
|
||||||
|
) : (
|
||||||
|
<span>{t(header.column.id)}</span>
|
||||||
)}
|
)}
|
||||||
{{
|
{{
|
||||||
asc: <IconSortAscending />,
|
asc: <IconSortAscending />,
|
||||||
|
@ -201,13 +201,15 @@ export default () => {
|
|||||||
</TrafficWidget>
|
</TrafficWidget>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="mx-auto grid h-full w-full max-w-screen-xl grid-cols-1 gap-4">
|
<div class="flex flex-col sm:flex-row">
|
||||||
|
<div class="m-4 flex-1">
|
||||||
<SolidApexCharts
|
<SolidApexCharts
|
||||||
type="area"
|
type="area"
|
||||||
options={trafficChartOptions()}
|
options={trafficChartOptions()}
|
||||||
series={trafficChartSeries()}
|
series={trafficChartSeries()}
|
||||||
/>
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="m-4 flex-1">
|
||||||
<SolidApexCharts
|
<SolidApexCharts
|
||||||
type="line"
|
type="line"
|
||||||
options={memoryChartOptions()}
|
options={memoryChartOptions()}
|
||||||
@ -215,5 +217,6 @@ export default () => {
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
@ -64,12 +64,18 @@ export function useProxies() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const setProxyGroupByProxyName = async (proxy: Proxy, proxyName: string) => {
|
const setProxyGroupByProxyName = async (proxy: Proxy, proxyName: string) => {
|
||||||
|
const proxyGroupList = proxies().slice()
|
||||||
|
const proxyGroup = proxyGroupList.find((i) => i.name === proxy.name)!
|
||||||
|
|
||||||
await request.put(`proxies/${proxy.name}`, {
|
await request.put(`proxies/${proxy.name}`, {
|
||||||
body: JSON.stringify({
|
body: JSON.stringify({
|
||||||
name: proxyName,
|
name: proxyName,
|
||||||
}),
|
}),
|
||||||
})
|
})
|
||||||
await updateProxy()
|
|
||||||
|
proxyGroup.now = proxyName
|
||||||
|
setProxies(proxyGroupList)
|
||||||
|
updateProxy()
|
||||||
}
|
}
|
||||||
|
|
||||||
const delayTestByProxyGroupName = async (proxyGroupName: string) => {
|
const delayTestByProxyGroupName = async (proxyGroupName: string) => {
|
||||||
|
Loading…
Reference in New Issue
Block a user