From 82b8d2c5a965386720e029d52689f97b5c62f0bc Mon Sep 17 00:00:00 2001 From: Hufe921 Date: Wed, 8 Feb 2023 20:32:18 +0800 Subject: [PATCH] feat:add i18n --- src/editor/core/command/Command.ts | 6 ++ src/editor/core/command/CommandAdapt.ts | 7 ++ src/editor/core/contextmenu/ContextMenu.ts | 7 +- .../core/contextmenu/menus/controlMenus.ts | 2 +- .../core/contextmenu/menus/globalMenus.ts | 10 +-- .../core/contextmenu/menus/hyperlinkMenus.ts | 6 +- .../core/contextmenu/menus/imageMenus.ts | 10 +-- .../core/contextmenu/menus/tableMenus.ts | 22 +++---- src/editor/core/draw/Draw.ts | 7 ++ .../core/draw/particle/date/DateParticle.ts | 24 ++++++- .../core/draw/particle/date/DatePicker.ts | 65 ++++++++++++++++--- src/editor/core/i18n/I18n.ts | 42 ++++++++++++ src/editor/core/i18n/lang/en.json | 61 +++++++++++++++++ src/editor/core/i18n/lang/zh-CN.json | 61 +++++++++++++++++ src/editor/core/register/Register.ts | 7 +- src/editor/index.ts | 7 +- .../interface/contextmenu/ContextMenu.ts | 41 ++++++++++++ src/editor/interface/i18n/I18n.ts | 7 ++ 18 files changed, 354 insertions(+), 38 deletions(-) create mode 100644 src/editor/core/i18n/I18n.ts create mode 100644 src/editor/core/i18n/lang/en.json create mode 100644 src/editor/core/i18n/lang/zh-CN.json create mode 100644 src/editor/interface/i18n/I18n.ts diff --git a/src/editor/core/command/Command.ts b/src/editor/core/command/Command.ts index 0356ee7..9187e7a 100644 --- a/src/editor/core/command/Command.ts +++ b/src/editor/core/command/Command.ts @@ -78,6 +78,7 @@ export class Command { private static setPaperMargin: CommandAdapt['setPaperMargin'] private static insertElementList: CommandAdapt['insertElementList'] private static removeControl: CommandAdapt['removeControl'] + private static setLocale: CommandAdapt['setLocale'] constructor(adapt: CommandAdapt) { Command.mode = adapt.mode.bind(adapt) @@ -149,6 +150,7 @@ export class Command { Command.setPaperMargin = adapt.setPaperMargin.bind(adapt) Command.insertElementList = adapt.insertElementList.bind(adapt) Command.removeControl = adapt.removeControl.bind(adapt) + Command.setLocale = adapt.setLocale.bind(adapt) } // 全局命令 @@ -433,4 +435,8 @@ export class Command { return Command.removeControl() } + public executeSetLocale(payload: string) { + return Command.setLocale(payload) + } + } \ No newline at end of file diff --git a/src/editor/core/command/CommandAdapt.ts b/src/editor/core/command/CommandAdapt.ts index 3a9457f..5bf7aab 100644 --- a/src/editor/core/command/CommandAdapt.ts +++ b/src/editor/core/command/CommandAdapt.ts @@ -23,6 +23,7 @@ import { INavigateInfo, Search } from '../draw/interactive/Search' import { TableTool } from '../draw/particle/table/TableTool' import { CanvasEvent } from '../event/CanvasEvent' import { HistoryManager } from '../history/HistoryManager' +import { I18n } from '../i18n/I18n' import { Position } from '../position/Position' import { RangeManager } from '../range/RangeManager' import { WorkerManager } from '../worker/WorkerManager' @@ -42,6 +43,7 @@ export class CommandAdapt { private control: Control private workerManager: WorkerManager private searchManager: Search + private i18n: I18n constructor(draw: Draw) { this.draw = draw @@ -54,6 +56,7 @@ export class CommandAdapt { this.control = draw.getControl() this.workerManager = draw.getWorkerManager() this.searchManager = draw.getSearch() + this.i18n = draw.getI18n() } public mode(payload: EditorMode) { @@ -1468,4 +1471,8 @@ export class CommandAdapt { }) } + public setLocale(payload: string) { + this.i18n.setLocale(payload) + } + } \ No newline at end of file diff --git a/src/editor/core/contextmenu/ContextMenu.ts b/src/editor/core/contextmenu/ContextMenu.ts index a775253..d41b156 100644 --- a/src/editor/core/contextmenu/ContextMenu.ts +++ b/src/editor/core/contextmenu/ContextMenu.ts @@ -5,6 +5,7 @@ import { IContextMenuContext, IRegisterContextMenu } from '../../interface/conte import { findParent } from '../../utils' import { Command } from '../command/Command' import { Draw } from '../draw/Draw' +import { I18n } from '../i18n/I18n' import { Position } from '../position/Position' import { RangeManager } from '../range/RangeManager' import { controlMenus } from './menus/controlMenus' @@ -26,6 +27,7 @@ export class ContextMenu { private command: Command private range: RangeManager private position: Position + private i18n: I18n private container: HTMLDivElement private contextMenuList: IRegisterContextMenu[] private contextMenuContainerList: HTMLDivElement[] @@ -37,6 +39,7 @@ export class ContextMenu { this.command = command this.range = draw.getRange() this.position = draw.getPosition() + this.i18n = draw.getI18n() this.container = draw.getContainer() this.context = null // 内部菜单 @@ -212,7 +215,9 @@ export class ContextMenu { } // 文本 const span = document.createElement('span') - const name = this._formatName(menu.name!) + const name = menu.i18nPath + ? this._formatName(this.i18n.t(menu.i18nPath)) + : this._formatName(menu.name || '') span.append(document.createTextNode(name)) menuItem.append(span) // 快捷方式提示 diff --git a/src/editor/core/contextmenu/menus/controlMenus.ts b/src/editor/core/contextmenu/menus/controlMenus.ts index 76497b2..0470df3 100644 --- a/src/editor/core/contextmenu/menus/controlMenus.ts +++ b/src/editor/core/contextmenu/menus/controlMenus.ts @@ -4,7 +4,7 @@ import { Command } from '../../command/Command' export const controlMenus: IRegisterContextMenu[] = [ { - name: '删除控件', + i18nPath: 'contextmenu.control.delete', when: (payload) => { return !payload.editorHasSelection && payload.startElement?.type === ElementType.CONTROL }, diff --git a/src/editor/core/contextmenu/menus/globalMenus.ts b/src/editor/core/contextmenu/menus/globalMenus.ts index cd52394..51315c1 100644 --- a/src/editor/core/contextmenu/menus/globalMenus.ts +++ b/src/editor/core/contextmenu/menus/globalMenus.ts @@ -3,7 +3,7 @@ import { Command } from '../../command/Command' export const globalMenus: IRegisterContextMenu[] = [ { - name: '剪切', + i18nPath: 'contextmenu.global.cut', shortCut: 'Ctrl + X', when: (payload) => { return !payload.isReadonly @@ -13,7 +13,7 @@ export const globalMenus: IRegisterContextMenu[] = [ } }, { - name: '复制', + i18nPath: 'contextmenu.global.copy', shortCut: 'Ctrl + C', when: (payload) => { return payload.editorHasSelection @@ -23,7 +23,7 @@ export const globalMenus: IRegisterContextMenu[] = [ } }, { - name: '粘贴', + i18nPath: 'contextmenu.global.paste', shortCut: 'Ctrl + V', when: (payload) => { return !payload.isReadonly && payload.editorTextFocus @@ -33,7 +33,7 @@ export const globalMenus: IRegisterContextMenu[] = [ } }, { - name: '全选', + i18nPath: 'contextmenu.global.selectAll', shortCut: 'Ctrl + A', when: (payload) => { return payload.editorTextFocus @@ -46,8 +46,8 @@ export const globalMenus: IRegisterContextMenu[] = [ isDivider: true }, { + i18nPath: 'contextmenu.global.print', icon: 'print', - name: '打印', when: () => true, callback: (command: Command) => { command.executePrint() diff --git a/src/editor/core/contextmenu/menus/hyperlinkMenus.ts b/src/editor/core/contextmenu/menus/hyperlinkMenus.ts index c3ef26c..28e2745 100644 --- a/src/editor/core/contextmenu/menus/hyperlinkMenus.ts +++ b/src/editor/core/contextmenu/menus/hyperlinkMenus.ts @@ -4,7 +4,7 @@ import { Command } from '../../command/Command' export const hyperlinkMenus: IRegisterContextMenu[] = [ { - name: '删除链接', + i18nPath: 'contextmenu.hyperlink.delete', when: (payload) => { return payload.startElement?.type === ElementType.HYPERLINK }, @@ -13,7 +13,7 @@ export const hyperlinkMenus: IRegisterContextMenu[] = [ } }, { - name: '取消链接', + i18nPath: 'contextmenu.hyperlink.cancel', when: (payload) => { return payload.startElement?.type === ElementType.HYPERLINK }, @@ -22,7 +22,7 @@ export const hyperlinkMenus: IRegisterContextMenu[] = [ } }, { - name: '编辑链接', + i18nPath: 'contextmenu.hyperlink.edit', when: (payload) => { return payload.startElement?.type === ElementType.HYPERLINK }, diff --git a/src/editor/core/contextmenu/menus/imageMenus.ts b/src/editor/core/contextmenu/menus/imageMenus.ts index 8daf0c8..f309992 100644 --- a/src/editor/core/contextmenu/menus/imageMenus.ts +++ b/src/editor/core/contextmenu/menus/imageMenus.ts @@ -5,7 +5,7 @@ import { Command } from '../../command/Command' export const imageMenus: IRegisterContextMenu[] = [ { - name: '更改图片', + i18nPath: 'contextmenu.image.change', icon: 'image-change', when: (payload) => { return !payload.editorHasSelection && payload.startElement?.type === ElementType.IMAGE @@ -29,7 +29,7 @@ export const imageMenus: IRegisterContextMenu[] = [ } }, { - name: '另存为图片', + i18nPath: 'contextmenu.image.saveAs', icon: 'image', when: (payload) => { return !payload.editorHasSelection && payload.startElement?.type === ElementType.IMAGE @@ -39,20 +39,20 @@ export const imageMenus: IRegisterContextMenu[] = [ } }, { - name: '文字环绕', + i18nPath: 'contextmenu.image.textWrap', when: (payload) => { return !payload.editorHasSelection && payload.startElement?.type === ElementType.IMAGE }, childMenus: [ { - name: '嵌入型', + i18nPath: 'contextmenu.image.textWrapType.embed', when: () => true, callback: (command: Command, context: IContextMenuContext) => { command.executeChangeImageDisplay(context.startElement!, ImageDisplay.BLOCK) } }, { - name: '上下型环绕', + i18nPath: 'contextmenu.image.textWrapType.upDown', when: () => true, callback: (command: Command, context: IContextMenuContext) => { command.executeChangeImageDisplay(context.startElement!, ImageDisplay.INLINE) diff --git a/src/editor/core/contextmenu/menus/tableMenus.ts b/src/editor/core/contextmenu/menus/tableMenus.ts index 9347740..1974f52 100644 --- a/src/editor/core/contextmenu/menus/tableMenus.ts +++ b/src/editor/core/contextmenu/menus/tableMenus.ts @@ -6,14 +6,14 @@ export const tableMenus: IRegisterContextMenu[] = [ isDivider: true }, { - name: '插入行列', + i18nPath: 'contextmenu.table.insertRowCol', icon: 'insert-row-col', when: (payload) => { return !payload.isReadonly && payload.isInTable }, childMenus: [ { - name: '上方插入1行', + i18nPath: 'contextmenu.table.insertTopRow', icon: 'insert-top-row', when: () => true, callback: (command: Command) => { @@ -21,7 +21,7 @@ export const tableMenus: IRegisterContextMenu[] = [ } }, { - name: '下方插入1行', + i18nPath: 'contextmenu.table.insertBottomRow', icon: 'insert-bottom-row', when: () => true, callback: (command: Command) => { @@ -29,7 +29,7 @@ export const tableMenus: IRegisterContextMenu[] = [ } }, { - name: '左侧插入1列', + i18nPath: 'contextmenu.table.insertLeftCol', icon: 'insert-left-col', when: () => true, callback: (command: Command) => { @@ -37,7 +37,7 @@ export const tableMenus: IRegisterContextMenu[] = [ } }, { - name: '右侧插入1列', + i18nPath: 'contextmenu.table.insertRightCol', icon: 'insert-right-col', when: () => true, callback: (command: Command) => { @@ -47,14 +47,14 @@ export const tableMenus: IRegisterContextMenu[] = [ ] }, { - name: '删除行列', + i18nPath: 'contextmenu.table.deleteRowCol', icon: 'delete-row-col', when: (payload) => { return !payload.isReadonly && payload.isInTable }, childMenus: [ { - name: '删除1行', + i18nPath: 'contextmenu.table.deleteRow', icon: 'delete-row', when: () => true, callback: (command: Command) => { @@ -62,7 +62,7 @@ export const tableMenus: IRegisterContextMenu[] = [ } }, { - name: '删除一列', + i18nPath: 'contextmenu.table.deleteCol', icon: 'delete-col', when: () => true, callback: (command: Command) => { @@ -70,7 +70,7 @@ export const tableMenus: IRegisterContextMenu[] = [ } }, { - name: '删除整个表格', + i18nPath: 'contextmenu.table.deleteTable', icon: 'delete-table', when: () => true, callback: (command: Command) => { @@ -80,7 +80,7 @@ export const tableMenus: IRegisterContextMenu[] = [ ] }, { - name: '合并单元格', + i18nPath: 'contextmenu.table.mergeCell', icon: 'merge-cell', when: (payload) => { return !payload.isReadonly && payload.isCrossRowCol @@ -90,7 +90,7 @@ export const tableMenus: IRegisterContextMenu[] = [ } }, { - name: '取消合并', + i18nPath: 'contextmenu.table.mergeCancelCell', icon: 'merge-cancel-cell', when: (payload) => { return !payload.isReadonly && payload.isInTable diff --git a/src/editor/core/draw/Draw.ts b/src/editor/core/draw/Draw.ts index 8f3ce48..9653518 100644 --- a/src/editor/core/draw/Draw.ts +++ b/src/editor/core/draw/Draw.ts @@ -48,6 +48,7 @@ import { DateParticle } from './particle/date/DateParticle' import { IMargin } from '../../interface/Margin' import { BlockParticle } from './particle/block/BlockParticle' import { EDITOR_COMPONENT, EDITOR_PREFIX } from '../../dataset/constant/Editor' +import { I18n } from '../i18n/I18n' export class Draw { @@ -62,6 +63,7 @@ export class Draw { private elementList: IElement[] private listener: Listener + private i18n: I18n private canvasEvent: CanvasEvent private globalEvent: GlobalEvent private cursor: Cursor @@ -120,6 +122,7 @@ export class Draw { this.pageContainer = this._createPageContainer() this._createPage(0) + this.i18n = new I18n() this.historyManager = new HistoryManager() this.position = new Position(this) this.range = new RangeManager(this) @@ -399,6 +402,10 @@ export class Draw { return this.workerManager } + public getI18n(): I18n { + return this.i18n + } + public getRowCount(): number { return this.rowList.length } diff --git a/src/editor/core/draw/particle/date/DateParticle.ts b/src/editor/core/draw/particle/date/DateParticle.ts index 7e5180e..37da363 100644 --- a/src/editor/core/draw/particle/date/DateParticle.ts +++ b/src/editor/core/draw/particle/date/DateParticle.ts @@ -14,9 +14,31 @@ export class DateParticle { constructor(draw: Draw) { this.draw = draw this.range = draw.getRange() + const i18n = draw.getI18n() + const t = i18n.t.bind(i18n) this.datePicker = new DatePicker({ mountDom: draw.getContainer(), - onSubmit: this._setValue.bind(this) + onSubmit: this._setValue.bind(this), + getLang: () => ({ + now: t('datePicker.now'), + confirm: t('datePicker.confirm'), + return: t('datePicker.return'), + timeSelect: t('datePicker.timeSelect'), + weeks: { + sun: t('datePicker.weeks.sun'), + mon: t('datePicker.weeks.mon'), + tue: t('datePicker.weeks.tue'), + wed: t('datePicker.weeks.wed'), + thu: t('datePicker.weeks.thu'), + fri: t('datePicker.weeks.fri'), + sat: t('datePicker.weeks.sat'), + }, + year: t('datePicker.year'), + month: t('datePicker.month'), + hour: t('datePicker.hour'), + minute: t('datePicker.minute'), + second: t('datePicker.second') + }) }) } diff --git a/src/editor/core/draw/particle/date/DatePicker.ts b/src/editor/core/draw/particle/date/DatePicker.ts index c262a2e..cd6d26a 100644 --- a/src/editor/core/draw/particle/date/DatePicker.ts +++ b/src/editor/core/draw/particle/date/DatePicker.ts @@ -1,14 +1,38 @@ import { EDITOR_PREFIX } from '../../../../dataset/constant/Editor' import { IElement, IElementPosition } from '../../../../interface/Element' +import { datePicker } from '../../../i18n/lang/zh-CN.json' + +export interface IDatePickerLang { + now: string; + confirm: string; + return: string; + timeSelect: string; + weeks: { + sun: string; + mon: string; + tue: string; + wed: string; + thu: string; + fri: string; + sat: string; + }; + year: string; + month: string; + hour: string; + minute: string; + second: string; +} export interface IDatePickerOption { mountDom?: HTMLElement; onSubmit?: (date: string) => any; + getLang?: () => IDatePickerLang } interface IDatePickerDom { container: HTMLDivElement; dateWrap: HTMLDivElement; + datePickerWeek: HTMLDivElement; timeWrap: HTMLUListElement; title: { preYear: HTMLSpanElement; @@ -45,12 +69,14 @@ export class DatePicker { private renderOptions: IRenderOption | null private isDatePicker: boolean private pickDate: Date | null + private lang: IDatePickerLang constructor(options: IDatePickerOption = {}) { this.options = { mountDom: document.body, ...options } + this.lang = datePicker this.now = new Date() this.dom = this._createDom() this.renderOptions = null @@ -89,7 +115,8 @@ export class DatePicker { // week-星期显示 const datePickerWeek = document.createElement('div') datePickerWeek.classList.add(`${EDITOR_PREFIX}-date-week`) - const weekList = ['日', '一', '二', '三', '四', '五', '六'] + const { weeks: { sun, mon, tue, wed, thu, fri, sat } } = this.lang + const weekList = [sun, mon, tue, wed, thu, fri, sat] weekList.forEach(week => { const weekDom = document.createElement('span') weekDom.innerText = `${week}` @@ -108,7 +135,7 @@ export class DatePicker { let hourTime: HTMLOListElement let minuteTime: HTMLOListElement let secondTime: HTMLOListElement - const timeList = ['时', '分', '秒'] + const timeList = [this.lang.hour, this.lang.minute, this.lang.second] timeList.forEach((t, i) => { const li = document.createElement('li') const timeText = document.createElement('span') @@ -139,13 +166,13 @@ export class DatePicker { datePickerMenu.classList.add(`${EDITOR_PREFIX}-date-menu`) const timeMenu = document.createElement('button') timeMenu.classList.add(`${EDITOR_PREFIX}-date-menu__time`) - timeMenu.innerText = '时间选择' + timeMenu.innerText = this.lang.timeSelect const nowMenu = document.createElement('button') nowMenu.classList.add(`${EDITOR_PREFIX}-date-menu__now`) - nowMenu.innerText = '此刻' + nowMenu.innerText = this.lang.now const submitMenu = document.createElement('button') submitMenu.classList.add(`${EDITOR_PREFIX}-date-menu__submit`) - submitMenu.innerText = '确定' + submitMenu.innerText = this.lang.confirm datePickerMenu.append(timeMenu) datePickerMenu.append(nowMenu) datePickerMenu.append(submitMenu) @@ -157,6 +184,7 @@ export class DatePicker { return { container: datePickerContainer, dateWrap, + datePickerWeek, timeWrap, title: { preYear: preYearTitle, @@ -261,6 +289,23 @@ export class DatePicker { this.pickDate = new Date(this.now) } + private _setLang() { + this.dom.menu.time.innerText = this.lang.timeSelect + this.dom.menu.now.innerText = this.lang.now + this.dom.menu.submit.innerText = this.lang.confirm + const { weeks: { sun, mon, tue, wed, thu, fri, sat } } = this.lang + const weekList = [sun, mon, tue, wed, thu, fri, sat] + this.dom.datePickerWeek.childNodes.forEach((child, i) => { + (child).innerText = weekList[i] + }) + const hourTitle = (this.dom.time.hour.previousElementSibling) + hourTitle.innerText = this.lang.hour + const minuteTitle = (this.dom.time.minute.previousElementSibling) + minuteTitle.innerText = this.lang.minute + const secondTitle = (this.dom.time.second.previousElementSibling) + secondTitle.innerText = this.lang.second + } + private _update() { // 本地年月日 const localDate = new Date() @@ -279,7 +324,7 @@ export class DatePicker { // 当前年月日 const year = this.now.getFullYear() const month = this.now.getMonth() + 1 - this.dom.title.now.innerText = `${year}年 ${String(month).padStart(2, '0')}月` + this.dom.title.now.innerText = `${year}${this.lang.year} ${String(month).padStart(2, '0')}${this.lang.month}` // 日期补差 const curDate = new Date(year, month, 0) // 当月日期 const curDay = curDate.getDate() // 当月总天数 @@ -338,11 +383,11 @@ export class DatePicker { if (this.isDatePicker) { this.dom.dateWrap.classList.add('active') this.dom.timeWrap.classList.remove('active') - this.dom.menu.time.innerText = `时间选择` + this.dom.menu.time.innerText = this.lang.timeSelect } else { this.dom.dateWrap.classList.remove('active') this.dom.timeWrap.classList.add('active') - this.dom.menu.time.innerText = `返回日期` + this.dom.menu.time.innerText = this.lang.return // 设置时分秒选择 this._setTimePick() } @@ -467,6 +512,10 @@ export class DatePicker { public render(option: IRenderOption) { this.renderOptions = option + if (this.options.getLang) { + this.lang = this.options.getLang() + this._setLang() + } this._setValue() this._update() this._setPosition() diff --git a/src/editor/core/i18n/I18n.ts b/src/editor/core/i18n/I18n.ts new file mode 100644 index 0000000..4b2e0f3 --- /dev/null +++ b/src/editor/core/i18n/I18n.ts @@ -0,0 +1,42 @@ +import { ILang } from '../../interface/i18n/I18n' +import zhCN from './lang/zh-CN.json' +import en from './lang/en.json' + +export class I18n { + + private langMap: Map = new Map([ + ['zhCN', zhCN], + ['en', en] + ]) + + private currentLocale = 'zhCN' + + public registerLangMap(locale: string, lang: ILang) { + this.langMap.set(locale, lang) + } + + public setLocale(locale: string) { + this.currentLocale = locale + } + + public getLang(): ILang { + return this.langMap.get(this.currentLocale) || zhCN + } + + public t(path: string): string { + const keyList = path.split('.') + let value = '' + let item = this.getLang() + for (let k = 0; k < keyList.length; k++) { + const key = keyList[k] + const currentValue = Reflect.get(item, key) + if (currentValue) { + value = item = currentValue + } else { + return '' + } + } + return value + } + +} diff --git a/src/editor/core/i18n/lang/en.json b/src/editor/core/i18n/lang/en.json new file mode 100644 index 0000000..165b2c5 --- /dev/null +++ b/src/editor/core/i18n/lang/en.json @@ -0,0 +1,61 @@ +{ + "contextmenu": { + "global": { + "cut": "Cut", + "copy": "Copy", + "paste": "Paste", + "selectAll": "Select all", + "print": "Print" + }, + "control": { + "delete": "Delete control" + }, + "hyperlink": { + "delete": "Delete hyperlink", + "cancel": "Cancel hyperlink", + "edit": "Edit hyperlink" + }, + "image": { + "change": "Change image", + "saveAs": "Save as image", + "textWrap": "Text wrap", + "textWrapType": { + "embed": "Embed", + "upDown": "Up down" + } + }, + "table": { + "insertRowCol": "Insert row col", + "insertTopRow": "Insert top 1 row", + "insertBottomRow": "Insert bottom 1 row", + "insertLeftCol": "Insert left 1 col", + "insertRightCol": "Insert right 1 col", + "deleteRowCol": "Delete row col", + "deleteRow": "Delete 1 row", + "deleteCol": "Delete 1 col", + "deleteTable": "Delete table", + "mergeCell": "Merge cell", + "mergeCancelCell": "Cancel merge cell" + } + }, + "datePicker": { + "now": "Now", + "confirm": "Confirm", + "return": "Return", + "timeSelect": "Time select", + "weeks": { + "sun": "Sun", + "mon": "Mon", + "tue": "Tue", + "wed": "Wed", + "thu": "Thu", + "fri": "Fri", + "sat": "Sat" + }, + "year": " ", + "month": " ", + "hour": "Hour", + "minute": "Minute", + "second": "Second" + } +} \ No newline at end of file diff --git a/src/editor/core/i18n/lang/zh-CN.json b/src/editor/core/i18n/lang/zh-CN.json new file mode 100644 index 0000000..d2e7b6b --- /dev/null +++ b/src/editor/core/i18n/lang/zh-CN.json @@ -0,0 +1,61 @@ +{ + "contextmenu": { + "global": { + "cut": "剪切", + "copy": "复制", + "paste": "粘贴", + "selectAll": "全选", + "print": "打印" + }, + "control": { + "delete": "删除控件" + }, + "hyperlink": { + "delete": "删除链接", + "cancel": "取消链接", + "edit": "编辑链接" + }, + "image": { + "change": "更改图片", + "saveAs": "另存为图片", + "textWrap": "文字环绕", + "textWrapType": { + "embed": "嵌入型", + "upDown": "上下型环绕" + } + }, + "table": { + "insertRowCol": "插入行列", + "insertTopRow": "上方插入1行", + "insertBottomRow": "下方插入1行", + "insertLeftCol": "左侧插入1列", + "insertRightCol": "右侧插入1列", + "deleteRowCol": "删除行列", + "deleteRow": "删除1行", + "deleteCol": "删除1列", + "deleteTable": "删除整个表格", + "mergeCell": "合并单元格", + "mergeCancelCell": "取消合并" + } + }, + "datePicker": { + "now": "此刻", + "confirm": "确定", + "return": "返回日期", + "timeSelect": "时间选择", + "weeks": { + "sun": "日", + "mon": "一", + "tue": "二", + "wed": "三", + "thu": "四", + "fri": "五", + "sat": "六" + }, + "year": "年", + "month": "月", + "hour": "时", + "minute": "分", + "second": "秒" + } +} \ No newline at end of file diff --git a/src/editor/core/register/Register.ts b/src/editor/core/register/Register.ts index 51d0fe9..6a24f55 100644 --- a/src/editor/core/register/Register.ts +++ b/src/editor/core/register/Register.ts @@ -2,21 +2,26 @@ import { IRegisterContextMenu } from '../../interface/contextmenu/ContextMenu' import { IRegisterShortcut } from '../../interface/shortcut/Shortcut' import { ContextMenu } from '../contextmenu/ContextMenu' import { Shortcut } from '../shortcut/Shortcut' +import { I18n } from '../i18n/I18n' +import { ILang } from '../../interface/i18n/I18n' interface IRegisterPayload { contextMenu: ContextMenu; shortcut: Shortcut; + i18n: I18n; } export class Register { public contextMenuList: (payload: IRegisterContextMenu[]) => void public shortcutList: (payload: IRegisterShortcut[]) => void + public langMap: (locale: string, lang: ILang) => void constructor(payload: IRegisterPayload) { - const { contextMenu, shortcut } = payload + const { contextMenu, shortcut, i18n } = payload this.contextMenuList = contextMenu.registerContextMenuList.bind(contextMenu) this.shortcutList = shortcut.registerShortcutList.bind(shortcut) + this.langMap = i18n.registerLangMap.bind(i18n) } } \ No newline at end of file diff --git a/src/editor/index.ts b/src/editor/index.ts index 09de2f1..cfd99c5 100644 --- a/src/editor/index.ts +++ b/src/editor/index.ts @@ -28,6 +28,7 @@ import { Shortcut } from './core/shortcut/Shortcut' import { KeyMap } from './dataset/enum/KeyMap' import { BlockType } from './dataset/enum/Block' import { IBlock } from './interface/Block' +import { ILang } from './interface/i18n/I18n' export default class Editor { @@ -110,7 +111,8 @@ export default class Editor { // 注册 this.register = new Register({ contextMenu, - shortcut + shortcut, + i18n: draw.getI18n() }) // 注册销毁方法 this.destroy = () => { @@ -147,5 +149,6 @@ export type { IRegisterContextMenu, IWatermark, INavigateInfo, - IBlock + IBlock, + ILang } \ No newline at end of file diff --git a/src/editor/interface/contextmenu/ContextMenu.ts b/src/editor/interface/contextmenu/ContextMenu.ts index aeb4934..a156515 100644 --- a/src/editor/interface/contextmenu/ContextMenu.ts +++ b/src/editor/interface/contextmenu/ContextMenu.ts @@ -12,6 +12,7 @@ export interface IContextMenuContext { } export interface IRegisterContextMenu { + i18nPath?: string; isDivider?: boolean; icon?: string; name?: string; @@ -19,4 +20,44 @@ export interface IRegisterContextMenu { when?: (payload: IContextMenuContext) => boolean; callback?: (command: Command, context: IContextMenuContext) => any; childMenus?: IRegisterContextMenu[]; +} + +export interface IContextmenuLang { + global: { + cut: string; + copy: string; + paste: string; + selectAll: string; + print: string; + }; + control: { + delete: string; + }; + hyperlink: { + delete: string; + cancel: string; + edit: string; + }; + image: { + change: string; + saveAs: string; + textWrap: string; + textWrapType: { + embed: string; + upDown: string; + } + }; + table: { + insertRowCol: string; + insertTopRow: string; + insertBottomRow: string; + insertLeftCol: string; + insertRightCol: string; + deleteRowCol: string; + deleteRow: string; + deleteCol: string; + deleteTable: string; + mergeCell: string; + mergeCancelCell: string; + }; } \ No newline at end of file diff --git a/src/editor/interface/i18n/I18n.ts b/src/editor/interface/i18n/I18n.ts new file mode 100644 index 0000000..10ff980 --- /dev/null +++ b/src/editor/interface/i18n/I18n.ts @@ -0,0 +1,7 @@ +import { IDatePickerLang } from '../../core/draw/particle/date/DatePicker' +import { IContextmenuLang } from '../contextmenu/ContextMenu' + +export interface ILang { + contextmenu: IContextmenuLang; + datePicker: IDatePickerLang; +}