openbmc-web3:添加语言

本文介绍了如何在webui-vue中添加汉语支持,包括修改Login.vue文件添加语言选择,创建和修改汉化json文件,以及汉化过程中需要注意的事项。目前已完成英语、西班牙语和俄语的支持,新增了zh-CN.json文件。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1 说明

webui-vue在登录界面支持语言选择,目前支持英语、西班牙语和俄语三种语言,其中,西班牙语翻译很少,本文是添加汉语支持,其它语言支持操作相同。

webui-vue软件包基于i18n( internationalization国际化的英文单词,首末字符i和n,18为中间的字符数)已经支持了支持英语、西班牙语、俄语三种语言(实际西班牙语和英语没什么区别,俄语翻译工作已经完成),基于i18n我们可以很容易的进行web页面的汉化工作。
本文webui-vue软件包gitcommitID:

ef96c6d96950e40954c5eb8ed87fef5dcf630bf3

2 添加语言选择

修改“webui-vue/src/views/Login/Login.vue”文件,在languages下添加如下内容并保存。

{
	value: 'zh-cn',
	text: 'chinese',
},

1 “value”—语言包的json文件名。
2 “text”—登录界面语言选择下拉框显示语言名称,不能是中文。
在这里插入图片描述

编译完成后,到登录界面可以看到可选“chinese”选项。
在这里插入图片描述

3 添加汉化json文件

复制“webui-vue/src/locales/en-US.json”文件,并修改复制文件的名称为zh-cn.json(zh-cn和前面的value的值一致)。

在这里插入图片描述

4 修改json文件

找到“pageLogin”关键字,将内容修改成如下内容并保存。

"pageLogin": {
    "language": "中文",
    "logIn": "登录",
    "password": "密码",
    "username": "用户名",
    "alert": {
      "message": "无效用户名或密码"
    }
  }

在这里插入图片描述

刷新登录界面并选择“Chinese”,web显示如下

在这里插入图片描述

pageOverview页面部

 "pageOverview": {
    "backupVersion": "备份固件",
    "bmcTime": "BMC 日期和时间",
    "criticalEvents": "错误",
    "dhcp": "DHCPv4",
    "dumps": "Dumps",
    "eventLogs": "事件日志",
    "firmwareInformation": "BMC 固件信息",
    "firmwareVersion": "固件版本",
    "hostName": "主机名",
    "idlePower": "Idle power",
    "inventory": "资产和LED灯",
    "ipv4": "IPv4",
    "linkStatus": "连接状态",
    "model": "模式",
    "networkInformation": "网络信息",
    "powerCap": "电源最大功耗",
    "powerConsumption": "电源功耗",
    "powerInformation": "电源信息",
    "powerMode": "电源模式",
    "runningVersion": "运行固件",
    "serialNumber": "序列号",
    "serverInformation": "服务器信息",
    "serverManufacturer": "服务器制造商",
    "solConsole": "@:appNavigation.serialOverLan",
    "statusInformation": "状态信息",
    "systemIdentifyLed": "系统识别灯",
    "systemInformation": "系统信息",
    "total": "总功耗",
    "warningEvents": "告警",
    "viewMore": "查看更多"
  },

web显示如下

在这里插入图片描述

1、复制json文件并改名后可能会导致编译错误,可以从新执行编译命令。
2、webui-vue软件包更新后,可以对比en-US.json和zh-cn.json文件,根据en-US.json文件增加或者修改zh-cn.json文件中的汉化。
3、json实际已经按照web页面(组件)进行了分类,汉化时可以按照页面来慢慢汉化。
4、有些显示文字依赖于其他的页面的显示值,或者从服务端等得到的值,这些不要进行修改。
5、汉化翻译过程中,不能按照英文意思直译,需要做一些适应性的调整。
6、添加其它语言支持,如添加法语支持,执行类似操作即可。

更多汉化结果:
在这里插入图片描述

5 zh-CN.json文件

后续慢慢更新


{
  "global": {
    "action": {
      "add": "添加",
      "cancel": "取消",
      "clearAll": "清空",
      "confirm": "确认",
      "copy": "复制",
      "delete": "删除",
      "deleteAll": "删除全部",
      "disable": "禁用",
      "download": "下载",
      "edit": "编辑",
      "enable": "启用",
      "export": "导出",
      "exportAll": "导出全部",
      "filter": "筛选",
      "refresh": "刷新",
      "replace": "替换",
      "reset": "重置",
      "save": "保存",
      "saveSettings": "保存设置",
      "selected": "已选的"
    },
    "ariaLabel": {
      "clearSearch": "清空输入",
      "hidePassword": "隐藏密码",
      "scrollToTop": "返回顶部",
      "showPassword": "显示密码. 注意: 此操作将会显示密码。",
      "tooltip": "提示",
      "progressBar": "页面加载进度条"
    },
    "calendar": {
      "selectDate": "选择日期",
      "useCursorKeysToNavigateCalendarDates": "使用鼠标选择日期"
    },
    "fileUpload": {
      "browseText": "选择文件",
      "clearSelectedFile": "删除所选文件"
    },
    "form": {
      "dateMustBeAfter": "Date must be after %{date}",
      "dateMustBeBefore": "Date must be before %{date}",
      "fieldRequired": "Field required",
      "invalidFormat": "Invalid format",
      "invalidValue": "Invalid value",
      "lengthMustBeBetween": "Length must be between %{min} – %{max} characters",
      "mustBeAtLeast": "Must be at least %{value}",
      "optional": "optional",
      "passwordsDoNotMatch": "Passwords do not match",
      "required": "Required",
      "search": "Search",
      "selectAnOption": "Select an option",
      "valueMustBeBetween": "Value must be between %{min} – %{max}"
    },
    "status": {
      "copied": "已复制",
      "disabled": "禁用",
      "enabled": "启用",
      "error": "错误",
      "notAvailable": "未知",
      "off": "关闭",
      "on": "开启",
      "success": "成功",
      "warning": "警告",
      "informational": "通知"
    },
    "table": {
      "collapseTableRow": "收起",
      "emptyMessage": "无",
      "emptySearchMessage": "未匹配到查询信息",
      "expandTableRow": "展开",
      "fromDate": "起始日期",
      "items": "%{count}项",
      "itemsPerPage": "每页显示条数",
      "selectAll": "全选",
      "selectItem": "选择项",
      "selectedItems": "%{filterCount}/%{count}项",
      "toDate": "结束日期",
      "viewAll": "显示全部"
    },
    "toast": {
      "unAuthTitle": "未授权",
      "unAuthDescription": "当前用户没有访问权限,请使用管理员用户或有权限用户访问。"
    }
  },
  "appHeader": {
    "applicationHeader": "应用顶部",
    "health": "健康状态",
    "logOut": "用户注销",
    "power": "电源状态",
    "profileSettings": "@:appPageTitle.profileSettings",
    "refresh": "刷新",
    "skipToContent": "跳转内容",
    "titleHideNavigation": "隐藏导航",
    "titleShowNavigation": "显示导航",
    "titleProfile": "显示配置文件菜单",
    "titleRefresh": "刷新应用数据"
  },
  "appNavigation": {
    "resourceManagement": "资源管理",
    "securityAndAccess": "访问安全",
    "sessions": "@:appPageTitle.sessions",
    "settings": "设置",
    "operations": "操作",
    "dateTime": "@:appPageTitle.dateTime",
    "dumps": "@:appPageTitle.dumps",
    "eventLogs": "@:appPageTitle.eventLogs",
    "factoryReset": "@:appPageTitle.factoryReset",
    "firmware": "@:appPageTitle.firmware",
    "hardwareStatus": "硬件状态",
    "inventory": "@:appPageTitle.inventory",
    "kvm": "@:appPageTitle.kvm",
    "ldap": "@:appPageTitle.ldap",
    "logs": "日志",
    "userManagement": "@:appPageTitle.userManagement",
    "network": "@:appPageTitle.network",
    "overview": "@:appPageTitle.overview",
    "primaryNavigation": "Primary navigation",
    "postCodeLogs": "@:appPageTitle.postCodeLogs",
    "powerRestorePolicy": "@:appPageTitle.powerRestorePolicy",
    "rebootBmc": "@:appPageTitle.rebootBmc",
    "policies": "@:appPageTitle.policies",
    "sensors": "@:appPageTitle.sensors",
    "serialOverLan": "SOL控制台",
    "serverPowerOperations": "@:appPageTitle.serverPowerOperations",
    "certificates": "@:appPageTitle.certificates",
    "virtualMedia": "@:appPageTitle.virtualMedia",
    "power": "@:appPageTitle.power",
    "keyClear": "@:appPageTitle.keyClear"
  },
  "appPageTitle": {
    "changePassword": "修改密码",
    "power": "电源&功率",
    "sessions": "会话管理",
    "dateTime": "时间管理",
    "dumps": "转储文件",
    "eventLogs": "事件日志",
    "factoryReset": "恢复出厂设置",
    "firmware": "固件管理",
    "inventory": "资产与LED灯",
    "kvm": "KVM",
    "ldap": "LDAP",
    "userManagement": "用户管理",
    "login": "登录管理",
    "network": "网络",
    "overview": "概览",
    "pageNotFound": "页面未找到",
    "postCodeLogs": "POST日志",
    "powerRestorePolicy": "电源恢复策略",
    "profileSettings": "用户管理",
    "rebootBmc": "重启BMC",
    "policies": "协议管理",
    "sensors": "传感器信息",
    "serialOverLan": "SOL控制台",
    "serverPowerOperations": "服务器电源控制",
    "certificates": "证书管理",
    "virtualMedia": "虚拟媒体",
    "keyClear": "Key clear"
  },
  "pageChangePassword": {
    "changePassword": "修改密码",
    "changePasswordAlertMessage": "密码已过期,请修改密码",
    "changePasswordError": "修改密码时出错",
    "confirmNewPassword": "确认新密码",
    "goBack": "返回",
    "newPassword": "新密码",
    "username": "用户名"
  },
  "pageSessions": {
    "action": {
      "disconnect": "Disconnect"
    },
    "modal": {
      "disconnectTitle": "Disconnect session| Disconnect sessions",
      "disconnectMessage": "Are you sure you want to disconnect %{count} session? This action cannot be undone. | Are you sure you want to disconnect %{count} sessions? This action cannot be undone."
    },
    "table": {
      "clientID": "Client ID",
      "username": "Username",
      "ipAddress": "IP address",
      "searchSessions": "Search sessions"
    },
    "toast": {
      "errorDelete": "Error disconnecting %{count} session. | Error disconnecting %{count} sessions.",
      "successDelete": "Successfully disconnected %{count} session. | Successfully disconnected %{count} sessions."
    }
  },
  "pageDateTime": {
    "alert": {
      "message": "To change how date and time are displayed (either UTC or browser offset) throughout the application, visit ",
      "link": "Profile 
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值