From 25d42363dd64960702b3cf7f03729cb76fe69ae0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=D0=9A=D1=83=D1=80=D0=BD=D0=B0=D1=82=20=D0=90=D0=BD=D0=B4?= =?UTF-8?q?=D1=80=D0=B5=D0=B9?= Date: Mon, 1 Jun 2026 07:42:53 +0300 Subject: [PATCH] Preserve QExcell vertical alignment --- README.md | 4 ++-- src/features/qexcell/QExcell.tsx | 41 +++++++++++++++++++++++++++++++- src/io/excellOffice.test.ts | 30 ++++++++++++++++++++--- src/io/excellOffice.ts | 22 +++++++++++++++-- src/styles.css | 25 +++++++++++++++++++ src/types.ts | 1 + 6 files changed, 115 insertions(+), 8 deletions(-) diff --git a/README.md b/README.md index 85035d7..e79f540 100644 --- a/README.md +++ b/README.md @@ -32,7 +32,7 @@ npm run build ## Поддержка форматов - QWord открывает `.docx` и сохраняет `.docx`; при импорте базовых DOCX-абзацев читает выравнивание, явные цвета текста, подсветку, размер и семейство шрифта из OOXML, а при экспорте DOCX сохраняются заголовки, абзацы, выравнивание абзацев, списки, простые таблицы, внешние гиперссылки, базовые растровые изображения и базовое inline-форматирование текста: полужирный, курсив, подчеркивание, зачеркивание, цвет текста, подсветка, размер и семейство шрифта. -- QExcell открывает `.xlsx` и сохраняет `.xlsx`; сетка расширяется по фактически заполненным ячейкам, поддерживает несколько листов, формулы за пределами стартового диапазона A-H, базовые merged cells, внешние гиперссылки ячеек, базовые диаграммы листа и базовое форматирование ячеек: полужирный, курсив, подчеркивание, зачеркивание, размер и семейство шрифта, цвет текста, заливку, горизонтальное выравнивание, перенос текста и числовые форматы XLSX для дат, процентов, денежных и дробных значений. +- QExcell открывает `.xlsx` и сохраняет `.xlsx`; сетка расширяется по фактически заполненным ячейкам, поддерживает несколько листов, формулы за пределами стартового диапазона A-H, базовые merged cells, внешние гиперссылки ячеек, базовые диаграммы листа и базовое форматирование ячеек: полужирный, курсив, подчеркивание, зачеркивание, размер и семейство шрифта, цвет текста, заливку, горизонтальное и вертикальное выравнивание, перенос текста и числовые форматы XLSX для дат, процентов, денежных и дробных значений. - QPowerPoint открывает `.pptx` и сохраняет `.pptx`; импорт учитывает порядок слайдов из `presentation.xml`, читает заметки докладчика через relationships слайда, сохраняет базовые растровые изображения слайдов, пользовательский цвет фона слайда, а также цвет, размер и семейство шрифта текста заголовка/подзаголовка. - QOutlook открывает `.eml` и одиночные сообщения Outlook `.msg`, сохраняет письма в `.eml`; импорт EML поддерживает простые текстовые письма, `multipart/alternative`, `multipart/mixed`, `text/plain`, fallback из `text/html` в читаемый текст, base64, quoted-printable, MIME-вложения, `To`, `Cc` и `Bcc`. Импорт MSG читает тему, отправителя, получателей `To/Cc/Bcc`, текст/HTML body и вложения, если эти поля доступны в MSG-файле. Новые письма можно адресовать через `To/Cc/Bcc` и сохранять в EML вместе с добавленными файлами. `.pst` и экспорт в `.msg` пока не реализованы. @@ -46,7 +46,7 @@ Desktop-меню поддерживает системные команды дл - `Ctrl/Cmd+Shift+E`: экспортировать текущую рабочую область в PDF. - `Ctrl/Cmd+P`: печать текущей рабочей области. -Импорт и экспорт реализуют базовую совместимость с Office Open XML, EML и чтением MSG: текст, базовое inline-форматирование, явные `w:color`, `w:shd`, `w:highlight`, `w:sz`, `w:rFonts` и `w:strike` для цвета/подсветки/размера/семейства/зачеркивания текста DOCX, выравнивание абзацев DOCX, внешние гиперссылки DOCX/XLSX, базовые растровые изображения DOCX/PPTX, простые таблицы, несколько листов XLSX, ячейки, формулы, базовые merged cells, базовые стили, цвета текста, размеры и семейства шрифта, зачеркивание ячеек, горизонтальное выравнивание и перенос текста ячеек, числовые форматы и простые bar/line/pie диаграммы ячеек XLSX, текстовые слайды PPTX, пользовательский фон слайдов PPTX, цвет, размер и семейство шрифта текста заголовка/подзаголовка PPTX, заметки докладчика, адресацию `To/Cc/Bcc`, MIME-вложения EML и базовые поля одиночных MSG-писем. Сложные стили, макросы, сложные диаграммы, сложное позиционирование и обтекание изображений, PST, экспорт MSG и полная fidelity документов Microsoft Office в текущем инкременте не заявлены. +Импорт и экспорт реализуют базовую совместимость с Office Open XML, EML и чтением MSG: текст, базовое inline-форматирование, явные `w:color`, `w:shd`, `w:highlight`, `w:sz`, `w:rFonts` и `w:strike` для цвета/подсветки/размера/семейства/зачеркивания текста DOCX, выравнивание абзацев DOCX, внешние гиперссылки DOCX/XLSX, базовые растровые изображения DOCX/PPTX, простые таблицы, несколько листов XLSX, ячейки, формулы, базовые merged cells, базовые стили, цвета текста, размеры и семейства шрифта, зачеркивание ячеек, горизонтальное и вертикальное выравнивание и перенос текста ячеек, числовые форматы и простые bar/line/pie диаграммы ячеек XLSX, текстовые слайды PPTX, пользовательский фон слайдов PPTX, цвет, размер и семейство шрифта текста заголовка/подзаголовка PPTX, заметки докладчика, адресацию `To/Cc/Bcc`, MIME-вложения EML и базовые поля одиночных MSG-писем. Сложные стили, макросы, сложные диаграммы, сложное позиционирование и обтекание изображений, PST, экспорт MSG и полная fidelity документов Microsoft Office в текущем инкременте не заявлены. ## Сборка пакета diff --git a/src/features/qexcell/QExcell.tsx b/src/features/qexcell/QExcell.tsx index 5bba1bc..cad53c6 100644 --- a/src/features/qexcell/QExcell.tsx +++ b/src/features/qexcell/QExcell.tsx @@ -4,6 +4,9 @@ import { AlignCenter, AlignLeft, AlignRight, + AlignVerticalJustifyCenter, + AlignVerticalJustifyEnd, + AlignVerticalJustifyStart, BarChart3, Bold, Download, @@ -83,6 +86,11 @@ const horizontalAlignOptions = [ { value: "center", label: "По центру", icon: AlignCenter }, { value: "right", label: "По правому краю", icon: AlignRight } ] as const; +const verticalAlignOptions = [ + { value: "top", label: "Выровнять по верхнему краю", icon: AlignVerticalJustifyStart }, + { value: "middle", label: "Выровнять по середине", icon: AlignVerticalJustifyCenter }, + { value: "bottom", label: "Выровнять по нижнему краю", icon: AlignVerticalJustifyEnd } +] as const; const fontFamilyOptions = ["Aptos", "Arial", "Courier New", "Times New Roman"]; const fontSizeOptions = [10, 11, 12, 14, 16, 18, 20, 24]; @@ -111,6 +119,7 @@ function normalizedCellFormat(format: CellFormat): CellFormat | undefined { const textColor = normalizedFillColor(format.textColor); const fillColor = normalizedFillColor(format.fillColor); const horizontalAlign = normalizedHorizontalAlign(format.horizontalAlign); + const verticalAlign = normalizedVerticalAlign(format.verticalAlign); const numberFormat = format.numberFormat?.trim(); const fontSize = normalizedFontSize(format.fontSize); const fontFamily = normalizedFontFamily(format.fontFamily); @@ -124,6 +133,7 @@ function normalizedCellFormat(format: CellFormat): CellFormat | undefined { ...(textColor ? { textColor } : {}), ...(fillColor ? { fillColor } : {}), ...(horizontalAlign ? { horizontalAlign } : {}), + ...(verticalAlign ? { verticalAlign } : {}), ...(format.wrapText ? { wrapText: true } : {}), ...(numberFormat ? { numberFormat } : {}) }; @@ -146,10 +156,22 @@ function cellInputStyle(format?: CellFormat): CSSProperties { }; } +function cellBoxStyle(format?: CellFormat): CSSProperties | undefined { + return format?.verticalAlign ? { verticalAlign: cssVerticalAlignValue(format.verticalAlign) } : undefined; +} + function normalizedHorizontalAlign(value?: string) { return value === "left" || value === "center" || value === "right" ? value : ""; } +function normalizedVerticalAlign(value?: string) { + return value === "top" || value === "middle" || value === "bottom" ? value : ""; +} + +function cssVerticalAlignValue(value: CellFormat["verticalAlign"]) { + return value === "middle" ? "middle" : value; +} + function normalizedFontSize(value?: number) { if (!Number.isFinite(value) || !value || value <= 0) { return undefined; @@ -530,6 +552,22 @@ export function QExcell({ workbook, onChange }: QExcellProps) { ); })} + {verticalAlignOptions.map((option) => { + const Icon = option.icon; + const isActive = selectedCellFormat.verticalAlign === option.value; + return ( + + ); + })}