diff --git a/.eslintrc b/.eslintrc index e6aaa27..e2c8255 100644 --- a/.eslintrc +++ b/.eslintrc @@ -15,7 +15,7 @@ }, "rules": { "no-console": "warn", - "prettier/prettier": "error" + "prettier/prettier": "warn" }, "settings": { "react": { diff --git a/.gitignore b/.gitignore index 86f3d0d..5a9ed41 100644 --- a/.gitignore +++ b/.gitignore @@ -18,4 +18,6 @@ componentName.json localName.json yarn.lock -package-lock.json \ No newline at end of file +package-lock.json + +test.pdf \ No newline at end of file diff --git a/package.json b/package.json index 2ab5236..071caf4 100644 --- a/package.json +++ b/package.json @@ -15,9 +15,9 @@ }, "devDependencies": { "@babel/core": "^7.12.10", + "@babel/plugin-proposal-class-properties": "^7.12.1", "@babel/preset-env": "^7.12.10", "@babel/preset-react": "^7.12.10", - "@babel/plugin-proposal-class-properties": "^7.12.1", "@types/node": "^14.14.12", "@types/react": "^15.0.0 || ^16.0.0 || ^17.0.0 ", "@types/react-dom": "^17.0.0", @@ -41,8 +41,9 @@ "webpack-dev-server": "^3.11.0" }, "dependencies": { + "@types/pdfmake": "^0.1.16", + "pdfmake": "^0.1.68", "react": "^15.0.0 || ^16.0.0 || ^17.0.0 ", - "react-dom": "^15.0.0 || ^16.0.0 || ^17.0.0 ", - "serve": "^11.3.2" + "react-dom": "^15.0.0 || ^16.0.0 || ^17.0.0 " } } diff --git a/src/App.tsx b/src/App.tsx index a58266f..8674efc 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,10 +1,12 @@ import React from "react"; import styles from "./styles/App.module.css"; +import { createDocument } from "./utils/pdf"; const App: React.FC = () => { return (

Hello, world

+
); }; diff --git a/src/custom.d.ts b/src/custom.d.ts index ede1c47..fcf7b8d 100644 --- a/src/custom.d.ts +++ b/src/custom.d.ts @@ -7,3 +7,7 @@ declare module "*.module.css" { const classes: { [key: string]: string }; export default classes; } +declare module "*.ttf" { + const content: string; + export default content; +} diff --git a/src/fonts/PTSerif-Bold.ttf b/src/fonts/PTSerif-Bold.ttf new file mode 100644 index 0000000..b955732 Binary files /dev/null and b/src/fonts/PTSerif-Bold.ttf differ diff --git a/src/fonts/PTSerif-Regular.ttf b/src/fonts/PTSerif-Regular.ttf new file mode 100644 index 0000000..24af478 Binary files /dev/null and b/src/fonts/PTSerif-Regular.ttf differ diff --git a/src/styles/App.module.css b/src/styles/App.module.css index 18eb62c..cf0f8bb 100644 --- a/src/styles/App.module.css +++ b/src/styles/App.module.css @@ -2,6 +2,6 @@ color: red; } /*just test sunlime merge*/ -body{ - background-color: blue; -} \ No newline at end of file +body { + background-color: blue; +} diff --git a/src/utils/pdf.ts b/src/utils/pdf.ts new file mode 100644 index 0000000..df80b10 --- /dev/null +++ b/src/utils/pdf.ts @@ -0,0 +1,114 @@ +import pdfMake from "pdfmake/build/pdfmake"; +import { TableCell, TDocumentDefinitions } from "pdfmake/interfaces"; + +import vfs from "./vfsFonts"; + +pdfMake.vfs = vfs; + +pdfMake.fonts = { + PTSerif: { + normal: "PTSerifRegular.ttf", + bold: "PTSerifBold.ttf", + }, +}; + +const months = [ + "Января", + "Февраля", + "Марта", + "Апреля", + "Мая", + "Июня", + "Июля", + "Августа", + "Сентября", + "Октября", + "Ноября", + "Декабря", +]; + +const getDate = () => { + const now = new Date(); + return `${now.getDate()} ${months[now.getDay()]} ${now.getFullYear()} года`; +}; + +const getGroupNumber = (gen: number): number => { + while (gen > 9) { + gen -= 9; + } + + return gen; +}; + +export const createDocument = ( + classNumber: number, + generation: number +): void => { + const doc: TDocumentDefinitions = { + content: [ + { + text: "УТВЕРЖДЕН", + style: "ral", + }, + { + text: "приказом БОУ «Югорский физико-математический лицей-интернат»", + style: "ral", + }, + { + text: `№ от ${getDate()}`, + style: "ral", + margin: [0, 0, 0, 10], + }, + { + table: { + widths: [ + "4.37%", + "4.37%", + "8.8%", + "13.7%", + "13.7%", + "13.7%", + "13.7%", + "13.7%", + "13.7%", + ], + body: [ + [ + { text: "Пара", rowSpan: 2, margin: [0, 10, 0, 0] }, + { text: "Урок", rowSpan: 2, margin: [0, 10, 0, 0] }, + { text: "Время", rowSpan: 2, margin: [0, 10, 0, 0] }, + ...["А", "Б", "В"].flatMap(word => [ + { + colSpan: 2, + text: `${classNumber} «${word}» класс`, + }, + {}, + ]), + ], + [ + "", + "", + "", + ...[1, 2, 3, 4, 5, 6].map(groupIndex => ({ + text: `${getGroupNumber(generation)}${groupIndex} группа`, + })), + ], + ], + }, + }, + ], + defaultStyle: { + font: "PTSerif", + fontSize: 12, + alignment: "center", + }, + styles: { + ral: { + alignment: "right", + }, + }, + pageOrientation: "landscape", + }; + + pdfMake.createPdf(doc).download("test.pdf"); +}; diff --git a/src/utils/vfsFonts.ts b/src/utils/vfsFonts.ts new file mode 100644 index 0000000..aaeba79 --- /dev/null +++ b/src/utils/vfsFonts.ts @@ -0,0 +1,12 @@ +import regular from "../fonts/PTSerif-Regular.ttf"; +import bold from "../fonts/PTSerif-Bold.ttf"; + +import pdfFonts from "pdfmake/build/vfs_fonts"; + +pdfFonts.pdfMake.vfs["PTSerifRegular.ttf"] = regular.slice( + regular.indexOf(",") +); + +pdfFonts.pdfMake.vfs["PTSerifBold.ttf"] = bold.slice(bold.indexOf(",")); + +export default pdfFonts.pdfMake.vfs; diff --git a/tsconfig.json b/tsconfig.json index dcf9e0b..21144a0 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -8,6 +8,7 @@ "module": "es6", "moduleResolution": "node", "target": "es5", + "lib": ["ES2020"], "allowJs": true, "jsx": "react", "allowSyntheticDefaultImports": true diff --git a/webpack.config.js b/webpack.config.js index ab298da..03ad741 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -2,7 +2,6 @@ const webpack = require("webpack"); const path = require("path"); const HtmlWebpackPlugin = require("html-webpack-plugin"); -const ESLintPlugin = require("eslint-webpack-plugin"); const getScopedName = require("./utils/getScopedName.js"); @@ -13,17 +12,16 @@ const plugins = [ new HtmlWebpackPlugin({ template: path.join(__dirname, "public", "index.html"), }), -] +]; -if (!isDev) -{ +if (!isDev) { plugins.push( new webpack.DefinePlugin({ - 'process.env': { - NODE_ENV: JSON.stringify('production') - } + "process.env": { + NODE_ENV: JSON.stringify("production"), + }, }) - ) + ); } module.exports = { @@ -39,11 +37,11 @@ module.exports = { include: path.resolve(__dirname, "src"), }, { - test:/\.js$/, + test: /\.js$/, include: /src/, - use:{ - loader:"babel-loader" - } + use: { + loader: "babel-loader", + }, }, { test: /\.css$/, @@ -76,7 +74,7 @@ module.exports = { ], }, optimization: { - minimize: true, + minimize: !isDev, }, resolve: { extensions: [".tsx", ".ts", ".js"],