mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-02-12 04:18:54 +00:00
fix: pdf export in client and hide png export (#2604)
This commit is contained in:
@@ -4,7 +4,7 @@ export const waterMarkStyle = style({
|
||||
display: 'none',
|
||||
'@media': {
|
||||
print: {
|
||||
position: 'absolute',
|
||||
position: 'fixed',
|
||||
bottom: '0',
|
||||
right: '20px',
|
||||
zIndex: 100,
|
||||
|
||||
@@ -1,22 +1,138 @@
|
||||
import { useAFFiNEI18N } from '@affine/i18n/hooks';
|
||||
import type { PageBlockModel } from '@blocksuite/blocks';
|
||||
import { ContentParser } from '@blocksuite/blocks/content-parser';
|
||||
import {
|
||||
ArrowRightSmallIcon,
|
||||
ExportIcon,
|
||||
ExportToHtmlIcon,
|
||||
ExportToMarkdownIcon,
|
||||
ExportToPdfIcon,
|
||||
} from '@blocksuite/icons';
|
||||
import { useRef } from 'react';
|
||||
|
||||
import { Menu, MenuItem } from '../../..';
|
||||
import type { CommonMenuItemProps } from './types';
|
||||
|
||||
export const Export = ({
|
||||
const ExportToPdfMenuItem = ({
|
||||
onSelect,
|
||||
}: CommonMenuItemProps<{ type: 'pdf' }>) => {
|
||||
const t = useAFFiNEI18N();
|
||||
const contentParserRef = useRef<ContentParser>();
|
||||
return (
|
||||
<>
|
||||
{globalThis.currentEditor!.mode === 'page' && (
|
||||
<MenuItem
|
||||
data-testid="export-to-pdf"
|
||||
onClick={async () => {
|
||||
if (!contentParserRef.current) {
|
||||
contentParserRef.current = new ContentParser(
|
||||
globalThis.currentEditor!.page
|
||||
);
|
||||
}
|
||||
const result = await window.apis?.export.savePDFFileAs(
|
||||
(
|
||||
globalThis.currentEditor!.page.root as PageBlockModel
|
||||
).title.toString()
|
||||
);
|
||||
if (result !== undefined) {
|
||||
return;
|
||||
}
|
||||
contentParserRef.current.exportPdf();
|
||||
onSelect?.({ type: 'pdf' });
|
||||
}}
|
||||
icon={<ExportToPdfIcon />}
|
||||
>
|
||||
{t['Export to PDF']()}
|
||||
</MenuItem>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
const ExportToHtmlMenuItem = ({
|
||||
onSelect,
|
||||
}: CommonMenuItemProps<{ type: 'html' }>) => {
|
||||
const t = useAFFiNEI18N();
|
||||
const contentParserRef = useRef<ContentParser>();
|
||||
return (
|
||||
<>
|
||||
<MenuItem
|
||||
data-testid="export-to-html"
|
||||
onClick={() => {
|
||||
if (!contentParserRef.current) {
|
||||
contentParserRef.current = new ContentParser(
|
||||
globalThis.currentEditor!.page
|
||||
);
|
||||
}
|
||||
contentParserRef.current.exportHtml();
|
||||
onSelect?.({ type: 'html' });
|
||||
}}
|
||||
icon={<ExportToHtmlIcon />}
|
||||
>
|
||||
{t['Export to HTML']()}
|
||||
</MenuItem>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
// const ExportToPngMenuItem = ({
|
||||
// onSelect,
|
||||
// }: CommonMenuItemProps<{ type: 'png' }>) => {
|
||||
// const t = useAFFiNEI18N();
|
||||
// const contentParserRef = useRef<ContentParser>();
|
||||
// return (
|
||||
// <>
|
||||
// {globalThis.currentEditor!.mode === 'page' && (
|
||||
// <MenuItem
|
||||
// data-testid="export-to-png"
|
||||
// onClick={() => {
|
||||
// if (!contentParserRef.current) {
|
||||
// contentParserRef.current = new ContentParser(
|
||||
// globalThis.currentEditor!.page
|
||||
// );
|
||||
// }
|
||||
// contentParserRef.current.exportPng();
|
||||
// onSelect?.({ type: 'png' });
|
||||
// }}
|
||||
// icon={<ExportToPngIcon />}
|
||||
// >
|
||||
// {t['Export to PNG']()}
|
||||
// </MenuItem>
|
||||
// )}
|
||||
// </>
|
||||
// );
|
||||
// };
|
||||
|
||||
const ExportToMarkdownMenuItem = ({
|
||||
onSelect,
|
||||
}: CommonMenuItemProps<{ type: 'markdown' }>) => {
|
||||
const t = useAFFiNEI18N();
|
||||
const contentParserRef = useRef<ContentParser>();
|
||||
return (
|
||||
<>
|
||||
<MenuItem
|
||||
data-testid="export-to-markdown"
|
||||
onClick={() => {
|
||||
if (!contentParserRef.current) {
|
||||
contentParserRef.current = new ContentParser(
|
||||
globalThis.currentEditor!.page
|
||||
);
|
||||
}
|
||||
contentParserRef.current.exportMarkdown();
|
||||
onSelect?.({ type: 'markdown' });
|
||||
}}
|
||||
icon={<ExportToMarkdownIcon />}
|
||||
>
|
||||
{t['Export to Markdown']()}
|
||||
</MenuItem>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export const Export = ({
|
||||
onItemClick,
|
||||
}: CommonMenuItemProps<{ type: 'markdown' | 'html' | 'pdf' | 'png' }>) => {
|
||||
const t = useAFFiNEI18N();
|
||||
const contentParserRef = useRef<ContentParser>();
|
||||
return (
|
||||
<Menu
|
||||
width={248}
|
||||
@@ -24,74 +140,10 @@ export const Export = ({
|
||||
trigger="click"
|
||||
content={
|
||||
<>
|
||||
{/* <MenuItem
|
||||
data-testid="export-to-pdf"
|
||||
onClick={async () => {
|
||||
if (!contentParserRef.current) {
|
||||
contentParserRef.current = new ContentParser(
|
||||
globalThis.currentEditor!.page
|
||||
);
|
||||
}
|
||||
const result = await window.apis?.export.savePDFFileAs(
|
||||
(
|
||||
globalThis.currentEditor!.page.root as PageBlockModel
|
||||
).title.toString()
|
||||
);
|
||||
if (result !== undefined) {
|
||||
return;
|
||||
}
|
||||
contentParserRef.current.exportPdf();
|
||||
onSelect?.({ type: 'pdf' });
|
||||
}}
|
||||
icon={<ExportToPdfIcon />}
|
||||
>
|
||||
{t['Export to PDF']()}
|
||||
</MenuItem> */}
|
||||
<MenuItem
|
||||
data-testid="export-to-html"
|
||||
onClick={() => {
|
||||
if (!contentParserRef.current) {
|
||||
contentParserRef.current = new ContentParser(
|
||||
globalThis.currentEditor!.page
|
||||
);
|
||||
}
|
||||
contentParserRef.current.exportHtml();
|
||||
onSelect?.({ type: 'html' });
|
||||
}}
|
||||
icon={<ExportToHtmlIcon />}
|
||||
>
|
||||
{t['Export to HTML']()}
|
||||
</MenuItem>
|
||||
{/* <MenuItem
|
||||
data-testid="export-to-png"
|
||||
onClick={() => {
|
||||
if (!contentParserRef.current) {
|
||||
contentParserRef.current = new ContentParser(
|
||||
globalThis.currentEditor!.page
|
||||
);
|
||||
}
|
||||
contentParserRef.current.exportPng();
|
||||
onSelect?.({ type: 'png' });
|
||||
}}
|
||||
icon={<ExportToPngIcon />}
|
||||
>
|
||||
{t['Export to PNG']()}
|
||||
</MenuItem> */}
|
||||
<MenuItem
|
||||
data-testid="export-to-markdown"
|
||||
onClick={() => {
|
||||
if (!contentParserRef.current) {
|
||||
contentParserRef.current = new ContentParser(
|
||||
globalThis.currentEditor!.page
|
||||
);
|
||||
}
|
||||
contentParserRef.current.exportMarkdown();
|
||||
onSelect?.({ type: 'markdown' });
|
||||
}}
|
||||
icon={<ExportToMarkdownIcon />}
|
||||
>
|
||||
{t['Export to Markdown']()}
|
||||
</MenuItem>
|
||||
<ExportToPdfMenuItem></ExportToPdfMenuItem>
|
||||
<ExportToHtmlMenuItem></ExportToHtmlMenuItem>
|
||||
{/* <ExportToPngMenuItem></ExportToPngMenuItem> */}
|
||||
<ExportToMarkdownMenuItem></ExportToMarkdownMenuItem>
|
||||
</>
|
||||
}
|
||||
>
|
||||
|
||||
@@ -58,6 +58,11 @@ export const mainContainerStyle = style({
|
||||
borderRadius: '8px',
|
||||
overflow: 'hidden',
|
||||
boxShadow: 'var(--affine-shadow-1)',
|
||||
'@media': {
|
||||
print: {
|
||||
overflow: 'visible',
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user