src/assets/scss/variables.scss

@@ -5,7 +5,7 @@ $base--line-height: 1.15;
 $navbar--height: 50px;
 
 // Sidebar
-$sidebar--width: 230px;
+$sidebar--width: 300px;
 $sidebar--width-fold: 64px;
 $sidebar--background-color-dark: #263238;
 $sidebar--text-color-dark: #8a979e;

src/components/base-dialog/addOrUpdate/index.vue

@@ -103,6 +103,7 @@
 </template>
 
 <script>
+import CKEditor from 'ckeditor4-vue'
 import AttrForm from '../AttrForm'
 import { pick } from 'lodash/object'
 import i18n from '@/i18n'
@@ -205,6 +206,11 @@ export default {
 			return Math.ceil(this.configs.fields.length / COLUMN_PER_ROW)
 		}
 	},
+	created() {
+		/** load lang */
+		// CKEditor.load()
+		// console.log('lang', CKEditor.component.props.config.defaultLanguage = 'en' )
+	},
 	mounted() {
 		/** 计算 defaultPlaceholders */
 		const prefix = i18n.t('hints.input')

src/i18n/en.js

@@ -7,6 +7,53 @@ t.brand = {}
 t.brand.lg = 'Monitoring System'
 t.brand.mini = 'PMS'
 
+t.routes = {}
+t.routes['产品池'] = 'Products Pool'
+t.routes['基本资料'] = 'Basic Data'
+t.routes['设备数采'] = 'Equipment PLC'
+t.routes['厂务管理'] = 'Factory Management'
+t.routes['报表管理'] = 'Report Management'
+t.routes['质量管理'] = 'Quality Management'
+t.routes['权限管理'] = 'Permission Management'
+t.routes['系统设置'] = 'System Settings'
+t.routes['日志管理'] = 'Log Management'
+
+// 二级
+t.routes['厂务'] = 'Factory Affair'
+t.routes['设备'] = 'Equipment'
+t.routes['字典管理'] = 'Dict Management'
+t.routes['PLC信息'] = 'PLC'
+t.routes['设备与PLC关联配置'] = 'Relations between plc & equipments'
+t.routes['设备生产实时数据'] = 'Realtime Equipment Data'
+t.routes['产线生产实时数据'] = 'Realtime Productline Data'
+t.routes['质量检查实时数据'] = 'Realtime Quality Inspection Data'
+t.routes['报表总览'] = 'Report Overview'
+t.routes['报表分类'] = 'Report Types'
+t.routes['报表详情'] = 'Report Detail'
+t.routes['质量检测基础数据'] = 'Quality Inspection Basic Data'
+t.routes['当前检测数据'] = 'Current Inspection Data'
+t.routes['质量检查信息记录'] = 'Quality Inspection Records'
+t.routes['用户管理'] = 'User Management'
+t.routes['部门管理'] = 'Department Management'
+t.routes['角色管理'] = 'Role Management'
+t.routes['菜单管理'] = 'Menu Management'
+t.routes['参数管理'] = 'Params Management'
+t.routes['定时任务'] = 'Timed Tasks'
+t.routes['文件上传'] = 'File Upload'
+t.routes['登录日志'] = 'Login Records'
+t.routes['操作日志'] = 'Oprations Records'
+
+// 三级
+t.routes['工厂'] = 'Factory'
+t.routes['产线'] = 'Product Lines'
+t.routes['工段'] = 'Work Sections'
+t.routes['设备类型'] = 'Equipment Types'
+t.routes['设备分组'] = 'Equipment Groups'
+t.routes['设备信息'] = 'Equipment Details'
+t.routes['质量检测类型'] = 'Quality Inpection Types'
+t.routes['质量检测信息'] = 'Quality Inpection Details'
+
+
 t.save = 'Save'
 t.add = 'Add'
 t.delete = 'Delete'
@@ -307,13 +354,13 @@ t.login.demo = 'Demo'
 t.login.copyright = 'Copyright @Intelligent Automation Research Institute Co., Ltd  Version: 1.0'
 
 t.schedule = {}
-t.schedule.beanName = 'bean名称'
+t.schedule.beanName = 'Bean Name'
-t.schedule.beanNameTips = 'spring bean名称, 如: testTask'
+t.schedule.beanNameTips = 'spring bean name, eg: testTask'
 t.schedule.pauseBatch = 'Pause'
 t.schedule.resumeBatch = 'Resume'
 t.schedule.runBatch = 'Run'
-t.schedule.log = '日志列表'
+t.schedule.log = 'Log List'
-t.schedule.params = '参数'
+t.schedule.params = 'Parameters'
 t.schedule.cronExpression = 'cron expression'
 t.schedule.cronExpressionTips = 'ex: 0 0 12 * * ?'
 t.schedule.remark = 'Remark'
@@ -327,7 +374,7 @@ t.schedule.resume = 'Resume'
 t.schedule.run = 'Excute'
 t.schedule.jobId = 'Job ID'
 t.schedule.times = 'Time Cost (ms)'
-t.schedule.createDate = '执行时间'
+t.schedule.createDate = 'Executed Tune' // ?
 
 t.oss = {}
 t.oss.config = '云存储配置'
@@ -469,16 +516,16 @@ t.role = {}
 t.role.name = 'Role Name'
 t.role.remark = 'Remark'
 t.role.createDate = 'Create Time'
-t.role.menuList = '菜单授权'
+t.role.menuList = 'Menu authorization' // ?
-t.role.deptList = '数据授权'
+t.role.deptList = 'Data authorization' // ?
 
 t.user = {}
 t.user.username = 'User Name'
-t.user.deptName = '所属部门'
+t.user.deptName = 'Department'
 t.user.email = 'Email'
 t.user.mobile = 'Phone'
 t.user.status = 'Status'
-t.user.status0 = '停用'
+t.user.status0 = 'Pause' // ?
 t.user.status1 = 'Normal'
 t.user.createDate = 'Create Time'
 t.user.password = 'Password'

src/i18n/zh-CN.js

@@ -7,14 +7,57 @@ t.brand = {}
 t.brand.lg = '生产监控系统'
 t.brand.mini = '监控'
 
-// 1 代表 '' 号的替换完成
+t.routes = {}
-// 2 代表 "" 号的替换完成
+// 一级
-// 3 代表不带引号，或 {{ }} 的替换，这三种替换需按顺序执行
+t.routes['产品池'] = '产品池'
-// ? 代表需要单独review
+t.routes['基本资料'] = '基本资料'
-// 基本上完成了template模板里的替换工作
+t.routes['设备数采'] = '设备数采'
+t.routes['厂务管理'] = '厂务管理'
+t.routes['报表管理'] = '报表管理'
+t.routes['质量管理'] = '质量管理'
+t.routes['权限管理'] = '权限管理'
+t.routes['系统设置'] = '系统设置'
+t.routes['日志管理'] = '日志管理'
+
+// 二级
+t.routes['厂务'] = '厂务'
+t.routes['设备'] = '设备'
+t.routes['字典管理'] = '字典管理'
+t.routes['PLC信息'] = 'PLC信息'
+t.routes['设备与PLC关联配置'] = '设备与PLC关联配置'  // ?
+t.routes['设备生产实时数据'] = '设备生产实时数据'
+t.routes['产线生产实时数据'] = '产线生产实时数据'
+t.routes['质量检查实时数据'] = '质量检查实时数据'
+t.routes['报表总览'] = '报表总览'
+t.routes['报表分类'] = '报表分类'
+t.routes['报表详情'] = '报表详情'
+t.routes['质量检测基础数据'] = '质量检测基础数据'
+t.routes['当前检测数据'] = '当前检测数据'
+t.routes['质量检查信息记录'] = '质量检查信息记录'
+t.routes['用户管理'] = '用户管理'
+t.routes['部门管理'] = '部门管理'
+t.routes['角色管理'] = '角色管理'
+t.routes['菜单管理'] = '菜单管理'
+t.routes['参数管理'] = '参数管理'
+t.routes['定时任务'] = '定时任务'
+t.routes['文件上传'] = '文件上传'
+t.routes['登录日志'] = '登录日志'
+t.routes['操作日志'] = '操作日志'
+
+// 三级
+t.routes['工厂'] = '工厂'
+t.routes['产线'] = '产线'
+t.routes['工段'] = '工段'
+t.routes['设备类型'] = '设备类型'
+t.routes['设备分组'] = '设备分组'
+t.routes['设备信息'] = '设备信息'
+t.routes['质量检测类型'] = '质量检测类型'
+t.routes['质量检测信息'] = '质量检测信息'
+
+
+
+
 
-// 对比 v2, v3 的结果，补充此文件和 en.js 文件
-// 然后替换vue文件的内容
 t.save = '保存'
 t.add = '新增' // 1
 t.delete = '删除' // 1

src/router/index.js

@@ -3,6 +3,7 @@ import Router from 'vue-router'
 import http from '@/utils/request'
 import { isURL } from '@/utils/validate'
 import Cookies from 'js-cookie'
+import i18n from '@/i18n'
 
 Vue.use(Router)
 
@@ -104,6 +105,13 @@ router.beforeEach((to, from, next) => {
   http.get(http.adornUrl('/sys/menu/nav')).then(({ data: res }) => {
     /** axios 的拦截器已经拦截出错情况，此处只考虑正确情况即可 */
     window.SITE_CONFIG['menuList'] = res.data
+    // .map(item => {
+    //   if (item.name === '产品池') {
+    //     console.log('Got you')
+    //     item.name = 
+    //   }
+    //   return item
+    // })
     fnAddDynamicMenuRoutes(window.SITE_CONFIG['menuList'])
     next({ ...to, replace: true })
   }).catch((err) => {
@@ -139,6 +147,8 @@ function fnAddDynamicMenuRoutes(menuList = [], routes = []) {
 
   for (var i = 0; i < menuList.length; i++) {
     if (menuList[i].children && menuList[i].children.length >= 1) {
+      // 菜单的国际化
+      menuList[i].name = i18n.t(`routes["${menuList[i].name}"]`)
       temp = temp.concat(menuList[i].children)
       continue
     }
@@ -150,9 +160,15 @@ function fnAddDynamicMenuRoutes(menuList = [], routes = []) {
       meta: {
         ...window.SITE_CONFIG['contentTabDefault'],
         menuId: menuList[i].id,
-        title: menuList[i].name
+        // 菜单的国际化
+        title: i18n.t(`routes["${menuList[i].name}"]`)
       }
     }
+
+    // 菜单的国际化
+    menuList[i].name = i18n.t(`routes["${menuList[i].name}"]`)
+
+    console.log('route ===', route.meta.title)
     // eslint-disable-next-line
     let URL = (menuList[i].url || '').replace(/{{([^}}]+)?}}/g, (s1, s2) => eval(s2)) // URL支持{{ window.xxx }}占位符变量
     if (isURL(URL)) {

src/views/modules/monitoring/equipment.vue

@@ -36,6 +36,7 @@ import TableTextComponent from '@/components/base-table/components/detailCompone
 import CKEditor from 'ckeditor4-vue'
 import { calcMaxHeight } from '@/utils'
 import { timeFilter } from '@/utils/filters'
+import Cookies from 'js-cookie'
 
 const tableConfigs = [
 	{
@@ -170,10 +171,11 @@ const addOrUpdateConfigs = {
 			fieldType: 'string',
 			component: CKEditor.component,
 			props: {
-				value: 'tests',
+				// value: 'tests',
 				config: {
 					// ckeditor 的配置: https://ckeditor.com/docs/ckeditor4/latest/api/CKEDITOR_config.html
 					// toolbar: [['Bold']]
+					language: Cookies.get('language') || 'en'
 				}
 			}
 		},