diff --git a/docs/en/guide/contextmenu-internal.md b/docs/en/guide/contextmenu-internal.md index 0b711f5..aca6e36 100644 --- a/docs/en/guide/contextmenu-internal.md +++ b/docs/en/guide/contextmenu-internal.md @@ -28,6 +28,13 @@ - All borders - Borderless - Outer border +- Td borders + - Top border + - Right border + - Bottom border + - Left border + - Forward border + - Back border - Vertical alignment - Top alignment - Center vertically diff --git a/docs/en/guide/i18n.md b/docs/en/guide/i18n.md index 14d2ef5..0e3995b 100644 --- a/docs/en/guide/i18n.md +++ b/docs/en/guide/i18n.md @@ -64,7 +64,10 @@ interface ILang { borderEmpty: string borderExternal: string borderTd: string + borderTdTop: string + borderTdRight: string borderTdBottom: string + borderTdLeft: string borderTdForward: string borderTdBack: string } diff --git a/docs/guide/contextmenu-internal.md b/docs/guide/contextmenu-internal.md index 9486d24..e502e97 100644 --- a/docs/guide/contextmenu-internal.md +++ b/docs/guide/contextmenu-internal.md @@ -28,6 +28,13 @@ - 所有框线 - 无框线 - 外侧框线 + - 单元格边框 + - 上边框 + - 右边框 + - 下边框 + - 左边框 + - 正斜线 + - 反斜线 - 垂直对齐 - 顶端对齐 - 垂直居中 diff --git a/docs/guide/i18n.md b/docs/guide/i18n.md index 6814619..2365999 100644 --- a/docs/guide/i18n.md +++ b/docs/guide/i18n.md @@ -64,7 +64,10 @@ interface ILang { borderEmpty: string borderExternal: string borderTd: string + borderTdTop: string + borderTdRight: string borderTdBottom: string + borderTdLeft: string borderTdForward: string borderTdBack: string } diff --git a/src/editor/assets/css/contextmenu/contextmenu.css b/src/editor/assets/css/contextmenu/contextmenu.css index 02714d6..a3cac0a 100644 --- a/src/editor/assets/css/contextmenu/contextmenu.css +++ b/src/editor/assets/css/contextmenu/contextmenu.css @@ -163,10 +163,22 @@ background-image: url(../../../assets/images/table-border-td.svg); } +.ce-contextmenu-border-td-top { + background-image: url(../../../assets/images/table-border-td-top.svg); +} + +.ce-contextmenu-border-td-left { + background-image: url(../../../assets/images/table-border-td-left.svg); +} + .ce-contextmenu-border-td-bottom { background-image: url(../../../assets/images/table-border-td-bottom.svg); } +.ce-contextmenu-border-td-right { + background-image: url(../../../assets/images/table-border-td-right.svg); +} + .ce-contextmenu-border-td-forward { background-image: url(../../../assets/images/table-border-td-forward.svg); } diff --git a/src/editor/assets/images/table-border-td-bottom.svg b/src/editor/assets/images/table-border-td-bottom.svg index 952b9e2..220fb72 100644 --- a/src/editor/assets/images/table-border-td-bottom.svg +++ b/src/editor/assets/images/table-border-td-bottom.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/editor/assets/images/table-border-td-left.svg b/src/editor/assets/images/table-border-td-left.svg new file mode 100644 index 0000000..762804f --- /dev/null +++ b/src/editor/assets/images/table-border-td-left.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/editor/assets/images/table-border-td-right.svg b/src/editor/assets/images/table-border-td-right.svg new file mode 100644 index 0000000..b550f61 --- /dev/null +++ b/src/editor/assets/images/table-border-td-right.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/editor/assets/images/table-border-td-top.svg b/src/editor/assets/images/table-border-td-top.svg new file mode 100644 index 0000000..3e36a7b --- /dev/null +++ b/src/editor/assets/images/table-border-td-top.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/editor/core/contextmenu/menus/tableMenus.ts b/src/editor/core/contextmenu/menus/tableMenus.ts index da7599a..b7031d0 100644 --- a/src/editor/core/contextmenu/menus/tableMenus.ts +++ b/src/editor/core/contextmenu/menus/tableMenus.ts @@ -14,7 +14,10 @@ const { BORDER_EMPTY, BORDER_EXTERNAL, BORDER_TD, + BORDER_TD_TOP, + BORDER_TD_LEFT, BORDER_TD_BOTTOM, + BORDER_TD_RIGHT, BORDER_TD_BACK, BORDER_TD_FORWARD, VERTICAL_ALIGN, @@ -80,6 +83,24 @@ export const tableMenus: IRegisterContextMenu[] = [ icon: 'border-td', when: () => true, childMenus: [ + { + key: BORDER_TD_TOP, + i18nPath: 'contextmenu.table.borderTdTop', + icon: 'border-td-top', + when: () => true, + callback: (command: Command) => { + command.executeTableTdBorderType(TdBorder.TOP) + } + }, + { + key: BORDER_TD_RIGHT, + i18nPath: 'contextmenu.table.borderTdRight', + icon: 'border-td-right', + when: () => true, + callback: (command: Command) => { + command.executeTableTdBorderType(TdBorder.RIGHT) + } + }, { key: BORDER_TD_BOTTOM, i18nPath: 'contextmenu.table.borderTdBottom', @@ -89,6 +110,15 @@ export const tableMenus: IRegisterContextMenu[] = [ command.executeTableTdBorderType(TdBorder.BOTTOM) } }, + { + key: BORDER_TD_LEFT, + i18nPath: 'contextmenu.table.borderTdLeft', + icon: 'border-td-left', + when: () => true, + callback: (command: Command) => { + command.executeTableTdBorderType(TdBorder.LEFT) + } + }, { key: BORDER_TD_FORWARD, i18nPath: 'contextmenu.table.borderTdForward', diff --git a/src/editor/core/draw/particle/table/TableParticle.ts b/src/editor/core/draw/particle/table/TableParticle.ts index a4beb99..e7a394c 100644 --- a/src/editor/core/draw/particle/table/TableParticle.ts +++ b/src/editor/core/draw/particle/table/TableParticle.ts @@ -189,13 +189,29 @@ export class TableParticle { ctx.translate(0.5, 0.5) // 绘制线条 ctx.beginPath() + // 单元格边框 + if (td.borderType === TdBorder.TOP) { + ctx.moveTo(x - width, y) + ctx.lineTo(x, y) + ctx.stroke() + } + if (td.borderType === TdBorder.RIGHT) { + ctx.moveTo(x, y) + ctx.lineTo(x, y + height) + ctx.stroke() + } if (td.borderType === TdBorder.BOTTOM) { ctx.moveTo(x, y + height) ctx.lineTo(x - width, y + height) ctx.stroke() } + if (td.borderType === TdBorder.LEFT) { + ctx.moveTo(x - width, y) + ctx.lineTo(x - width, y + height) + ctx.stroke() + } + // 表格线 if (!isEmptyBorderType && !isExternalBorderType) { - ctx.moveTo(x, y + height) ctx.moveTo(x, y) ctx.lineTo(x, y + height) ctx.lineTo(x - width, y + height) diff --git a/src/editor/core/i18n/lang/en.json b/src/editor/core/i18n/lang/en.json index 740da22..05abc72 100644 --- a/src/editor/core/i18n/lang/en.json +++ b/src/editor/core/i18n/lang/en.json @@ -45,9 +45,12 @@ "borderEmpty": "Empty", "borderExternal": "External", "borderTd": "Table cell border", + "borderTdTop": "Top", + "borderTdRight": "Right", "borderTdBottom": "Bottom", - "borderTdForward": "forward", - "borderTdBack": "back" + "borderTdLeft": "Left", + "borderTdForward": "Forward", + "borderTdBack": "Back" } }, "datePicker": { diff --git a/src/editor/core/i18n/lang/zh-CN.json b/src/editor/core/i18n/lang/zh-CN.json index f9ddce7..4d11611 100644 --- a/src/editor/core/i18n/lang/zh-CN.json +++ b/src/editor/core/i18n/lang/zh-CN.json @@ -45,7 +45,10 @@ "borderEmpty": "无框线", "borderExternal": "外侧框线", "borderTd": "单元格边框", + "borderTdTop": "上边框", + "borderTdRight": "右边框", "borderTdBottom": "下边框", + "borderTdLeft": "左边框", "borderTdForward": "正斜线", "borderTdBack": "反斜线" } diff --git a/src/editor/dataset/constant/ContextMenu.ts b/src/editor/dataset/constant/ContextMenu.ts index b82f66f..282f969 100644 --- a/src/editor/dataset/constant/ContextMenu.ts +++ b/src/editor/dataset/constant/ContextMenu.ts @@ -31,7 +31,10 @@ export const INTERNAL_CONTEXT_MENU_KEY = { BORDER_EMPTY: 'tableBorderEmpty', BORDER_EXTERNAL: 'tableBorderExternal', BORDER_TD: 'tableBorderTd', + BORDER_TD_TOP: 'tableBorderTdTop', + BORDER_TD_RIGHT: 'tableBorderTdRight', BORDER_TD_BOTTOM: 'tableBorderTdBottom', + BORDER_TD_LEFT: 'tableBorderTdLeft', BORDER_TD_FORWARD: 'tableBorderTdForward', BORDER_TD_BACK: 'tableBorderTdBack', VERTICAL_ALIGN: 'tableVerticalAlign', diff --git a/src/editor/dataset/enum/table/Table.ts b/src/editor/dataset/enum/table/Table.ts index f01b94a..ca176b4 100644 --- a/src/editor/dataset/enum/table/Table.ts +++ b/src/editor/dataset/enum/table/Table.ts @@ -5,7 +5,10 @@ export enum TableBorder { } export enum TdBorder { - BOTTOM = 'bottom' + TOP = 'top', + RIGHT = 'right', + BOTTOM = 'bottom', + LEFT = 'left' } export enum TdSlash {