Skip to content

Commit 2c84655

Browse files
whaceHccake
whace
authored and
Hccake
committed
✨ 国际化信息页面
link gh-3
1 parent e7843da commit 2c84655

File tree

9 files changed

+744
-7
lines changed

9 files changed

+744
-7
lines changed

‎src/api/i18n/i18n-data.ts

+33
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
import httpClient from '@/utils/axios'
2+
import type { I18nData, I18nDataDTO, I18nDataQO } from './types'
3+
4+
export function pageI18nData(query: I18nDataQO) {
5+
return httpClient.get('/i18n/i18n-data/page', {
6+
params: query
7+
})
8+
}
9+
10+
export function createI18nData(data: I18nDataDTO) {
11+
return httpClient.post('/i18n/i18n-data', data)
12+
}
13+
14+
export function removeI18nData(code: string, languageTag: string) {
15+
return httpClient.delete('/i18n/i18n-data', {
16+
params: {
17+
code: code,
18+
languageTag: languageTag
19+
}
20+
})
21+
}
22+
23+
export function updateI18nData(data: I18nData) {
24+
return httpClient.put('/i18n/i18n-data', data)
25+
}
26+
27+
export function exportExcel(params: I18nDataQO) {
28+
return httpClient.get('/i18n/i18n-data/export', { params, responseType: 'blob' })
29+
}
30+
31+
export function importExcel() {
32+
return httpClient.postForm('i18n/i18n-data/import', null, {})
33+
}

‎src/api/i18n/types.ts

+40
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
export interface I18nDataQO {
2+
// 国际化标识
3+
code?: string
4+
// 文本值
5+
message?: string
6+
// 语言标签
7+
languageTag?: string
8+
}
9+
10+
export interface LanguageText {
11+
// 语言标签
12+
languageTag: string
13+
// 文本值
14+
message: string
15+
}
16+
17+
export interface I18nBaseData {
18+
// 唯一标识
19+
code: string
20+
// 备注
21+
remarks?: string
22+
}
23+
24+
export interface I18nData extends LanguageText, I18nBaseData {}
25+
26+
/**
27+
* i18nData新建修改的传输对象
28+
*/
29+
export interface I18nDataDTO extends I18nBaseData {
30+
languageTexts: LanguageText[]
31+
}
32+
33+
/**
34+
* 角色分页视图对象
35+
*/
36+
export interface I18nDataPageVO extends I18nBaseData, LanguageText {
37+
id: number
38+
// 创建时间
39+
createTime?: string
40+
}

‎src/locales/lang/en-US/ballcat.json

+66-6
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,77 @@
11
{
22
"locale.ballcat": "BallCat en-US",
3-
43
"user.login.submit": "Login",
54
"user.login.submit.retry": "Login again",
65
"user.login.expired": "Login status expired!",
7-
86
"user.pemission.reject": "No Permission!",
9-
107
"system.tip.title": "System Tip",
118
"system.tip.request.error": "Abnormal network request!",
129
"system.tip.request.error.message": "request error status code: {code}",
1310
"system.tip.network.error": "The network is abnormal, and the server cannot be accessed!",
14-
"system.tip.network.error.message":
15-
"The network is abnormal, please check whether your network is smooth!",
16-
"system.tip.operate.error": "Operate Error! {message}"
11+
"system.tip.network.error.message": "The network is abnormal, please check whether your network is smooth!",
12+
"system.tip.operate.error": "Operate Error! {message}",
13+
14+
"lov": {
15+
"selectedData": "The selected data"
16+
},
17+
18+
"action": {
19+
"query": "Query",
20+
"reset": "Reset",
21+
"expand": "Expand",
22+
"collapse": "Collapse",
23+
"more": "More",
24+
"create": "New",
25+
"delete": "Delete",
26+
"edit": "Edit",
27+
"export": "Export",
28+
"import": "Import",
29+
"details": "Details",
30+
"selectFile": "Select File",
31+
"choose": "Choose",
32+
"cancel": "Cancel"
33+
},
34+
35+
"common": {
36+
"operation": "Operation",
37+
"createTime": "Create Time",
38+
"updateTime": "Update Time",
39+
"remarks": "Remarks"
40+
},
41+
42+
"message": {
43+
"confirmDelete": "Are you sure delete?",
44+
"pleaseEnter": "Please enter",
45+
"pleaseSelectFile": "Please Select File"
46+
},
47+
48+
"import": {
49+
"batchImport": "Batch Import",
50+
"downloadTemplate": "Download Template",
51+
"whenDataExisting": "When the data already exists",
52+
"skipExisting": "Skip Existing",
53+
"overwriteExisting": "Overwrite Existing",
54+
"importSuccess": "Import Success"
55+
},
56+
57+
"i18n": {
58+
"i18nData": {
59+
"text": "I18N Data",
60+
"languageTag": {
61+
"text": "Language Tag",
62+
"tips": "LanguageTag，eg. zh-CN en-Us",
63+
"required": "Please enter i18n data language-tag！"
64+
},
65+
"code": {
66+
"text": "Code",
67+
"tips": "A unique code for i18n data",
68+
"required": "Please enter i18n data code！"
69+
},
70+
"message": {
71+
"text": "Message",
72+
"tips": "The text of the i18n data",
73+
"required": "Please enter i18n data message！！"
74+
}
75+
}
76+
}
1777
}

‎src/locales/lang/zh-CN/ballcat.json

+66-1
Original file line numberDiff line numberDiff line change
@@ -12,5 +12,70 @@
1212
"system.tip.request.error.message": "请求错误状态码: {code}",
1313
"system.tip.network.error": "网络异常, 无法访问到服务器!",
1414
"system.tip.network.error.message": "网络异常, 请检测您的网络是否通畅!",
15-
"system.tip.operate.error": "操作异常! {message}"
15+
"system.tip.operate.error": "操作异常! {message}",
16+
17+
18+
"lov": {
19+
"selectedData": "已选数据"
20+
},
21+
22+
"action": {
23+
"query": "查询",
24+
"reset": "重置",
25+
"expand": "展开",
26+
"collapse": "收起",
27+
"more": "更多",
28+
"create": "新建",
29+
"delete": "删除",
30+
"edit": "编辑",
31+
"export": "导出",
32+
"import": "导入",
33+
"details": "详情",
34+
"selectFile": "选择文件",
35+
"choose": "选择",
36+
"cancel": "取消"
37+
},
38+
39+
"common": {
40+
"operation": "操作",
41+
"createTime": "创建时间",
42+
"updateTime": "更新时间",
43+
"remarks": "备注"
44+
},
45+
46+
"message": {
47+
"confirmDelete": "确认要删除吗？",
48+
"pleaseEnter": "请输入",
49+
"pleaseSelectFile": "请选择一个文件"
50+
},
51+
52+
"import": {
53+
"batchImport": "批量导入",
54+
"downloadTemplate": "下载模板文件",
55+
"whenDataExisting": "当数据已存在时",
56+
"skipExisting": "跳过已有",
57+
"overwriteExisting": "覆盖已有",
58+
"importSuccess": "导入成功"
59+
},
60+
61+
"i18n": {
62+
"i18nData": {
63+
"text": "国际化信息",
64+
"languageTag": {
65+
"text": "语言标签",
66+
"tips": "语言标签，eg. zh-CN en-Us",
67+
"required": "请输入语言标签！"
68+
},
69+
"code": {
70+
"text": "国际化标识",
71+
"tips": "国际化信息的标识",
72+
"required": "请输入国际化标识！"
73+
},
74+
"message": {
75+
"text": "文本值",
76+
"tips": "国际化信息的文本",
77+
"required": "请输入文本值！"
78+
}
79+
}
80+
}
1681
}

‎src/views/i18n/LanguageText.vue

+111
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,111 @@
1+
<template>
2+
<a-space direction="vertical">
3+
<div v-for="language in languageList" :key="language.languageTag">
4+
<a-input
5+
v-model:value="language.languageTag"
6+
placeholder="语言标签"
7+
style="width: 25%; margin-right: 8px"
8+
:disabled="true"
9+
/>
10+
<a-input
11+
v-model:value="language.message"
12+
placeholder="文本值"
13+
style="width: 60%; margin-right: 8px"
14+
/>
15+
<minus-circle-outlined
16+
v-if="languageList.length > 1"
17+
class="dynamic-delete-button"
18+
:disabled="languageList.length === 1"
19+
@click="() => remove(language)"
20+
/>
21+
</div>
22+
<a-popover trigger="click">
23+
<template #content>
24+
<a-transfer
25+
:row-key="transferKey"
26+
:data-source="allLanguageList"
27+
:render="transferKey"
28+
:titles="['Source', 'Target']"
29+
:target-keys="langTags"
30+
:lazy="false"
31+
@change="langTagChange"
32+
/>
33+
</template>
34+
<a-button type="dashed" style="width: 60%">
35+
<PlusOutlined />
36+
Add field
37+
</a-button>
38+
</a-popover>
39+
</a-space>
40+
</template>
41+
42+
<script setup lang="ts">
43+
import type { LanguageText } from '@/api/i18n/types'
44+
import { supportLanguage } from '@/config'
45+
46+
const supportLanguageTags = Object.keys(supportLanguage)
47+
48+
const langTags = ref<string[]>([])
49+
const allLanguageList = ref<LanguageText[]>([])
50+
const languageList = ref<LanguageText[]>([])
51+
52+
watch(langTags.value, () => {
53+
languageList.value = allLanguageList.value.filter(
54+
x => langTags.value.findIndex(key => key === x.languageTag) !== -1
55+
)
56+
})
57+
58+
onMounted(() => {
59+
allLanguageList.value = supportLanguageTags.map(languageTag => {
60+
return {
61+
languageTag,
62+
message: ''
63+
}
64+
})
65+
langTags.value = [...supportLanguageTags]
66+
})
67+
68+
const langTagChange = (nextTargetKeys: string[]) => {
69+
langTags.value = nextTargetKeys
70+
}
71+
72+
const transferKey = (item: LanguageText) => item.languageTag
73+
74+
const remove = (language: LanguageText) => {
75+
const index = langTags.value.findIndex(key => key === language.languageTag)
76+
langTags.value.splice(index, 1)
77+
}
78+
79+
defineExpose({
80+
data: languageList,
81+
resetData() {
82+
allLanguageList.value = supportLanguageTags.map(languageTag => {
83+
return {
84+
languageTag,
85+
message: ''
86+
}
87+
})
88+
langTags.value = [...supportLanguageTags]
89+
}
90+
})
91+
</script>
92+
93+
<style scoped lang="less">
94+
.dynamic-delete-button {
95+
cursor: pointer;
96+
position: relative;
97+
top: 4px;
98+
font-size: 24px;
99+
color: #999;
100+
transition: all 0.3s;
101+
}
102+
103+
.dynamic-delete-button:hover {
104+
color: #777;
105+
}
106+
107+
.dynamic-delete-button[disabled] {
108+
cursor: not-allowed;
109+
opacity: 0.5;
110+
}
111+
</style>

0 commit comments

Comments
 (0)