Skip to content

M
mySkill-x
Commit 530c28df by pantakan konthang
Options

pms ปริ้น pdf

parent a27b33aa
Showing with 554 additions and 30 deletions
package-lock.json
...@@ -54,6 +54,7 @@ ...@@ -54,6 +54,7 @@
"glob-watcher": "^6.0.0", "glob-watcher": "^6.0.0",
"hammerjs": "^2.0.8", "hammerjs": "^2.0.8",
"helmet": "^7.0.0", "helmet": "^7.0.0",
"html2pdf.js": "^0.10.3",
"keen-slider": "^6.8.5", "keen-slider": "^6.8.5",
"leaflet": "^1.9.4", "leaflet": "^1.9.4",
"lightgallery": "^2.1.2", "lightgallery": "^2.1.2",
...@@ -97,6 +98,7 @@ ...@@ -97,6 +98,7 @@
"@types/d3-shape": "^3.1.1", "@types/d3-shape": "^3.1.1",
"@types/hammerjs": "^2.0.41", "@types/hammerjs": "^2.0.41",
"@types/jasmine": "~4.3.4", "@types/jasmine": "~4.3.4",
"@types/jspdf": "^1.3.3",
"@types/leaflet": "^1.9.3", "@types/leaflet": "^1.9.3",
"@types/mousetrap": "^1.6.11", "@types/mousetrap": "^1.6.11",
"@types/wnumb": "^1.2.1", "@types/wnumb": "^1.2.1",
...@@ -6919,6 +6921,13 @@ ...@@ -6919,6 +6921,13 @@
"integrity": "sha512-RbSSoHliUbnXj3ny0CNFOoxrIDV6SUGyStHsvDqosw6CkdPV8TtWGlfecuK4ToyMEAql6pzNxgCFKanovUzlgQ==", "integrity": "sha512-RbSSoHliUbnXj3ny0CNFOoxrIDV6SUGyStHsvDqosw6CkdPV8TtWGlfecuK4ToyMEAql6pzNxgCFKanovUzlgQ==",
"dev": true "dev": true
}, },
"node_modules/@types/jspdf": {
"version": "1.3.3",
"resolved": "https://registry.npmjs.org/@types/jspdf/-/jspdf-1.3.3.tgz",
"integrity": "sha512-DqwyAKpVuv+7DniCp2Deq1xGvfdnKSNgl9Agun2w6dFvR5UKamiv4VfYUgcypd8S9ojUyARFIlZqBrYrBMQlew==",
"dev": true,
"license": "MIT"
},
"node_modules/@types/leaflet": { "node_modules/@types/leaflet": {
"version": "1.9.6", "version": "1.9.6",
"resolved": "https://registry.npmjs.org/@types/leaflet/-/leaflet-1.9.6.tgz", "resolved": "https://registry.npmjs.org/@types/leaflet/-/leaflet-1.9.6.tgz",
...@@ -6969,6 +6978,13 @@ ...@@ -6969,6 +6978,13 @@
"integrity": "sha512-u95svzDlTysU5xecFNTgfFG5RUWu1A9P0VzgpcIiGZA9iraHOdSzcxMxQ55DyeRaGCSxQi7LxXDI4rzq/MYfdg==", "integrity": "sha512-u95svzDlTysU5xecFNTgfFG5RUWu1A9P0VzgpcIiGZA9iraHOdSzcxMxQ55DyeRaGCSxQi7LxXDI4rzq/MYfdg==",
"dev": true "dev": true
}, },
"node_modules/@types/raf": {
"version": "3.4.3",
"resolved": "https://registry.npmjs.org/@types/raf/-/raf-3.4.3.tgz",
"integrity": "sha512-c4YAvMedbPZ5tEyxzQdMoOhhJ4RD3rngZIdwC2/qDN3d7JpEhB6fiBRKVY1lg5B7Wk+uPBjn5f39j1/2MY1oOw==",
"license": "MIT",
"optional": true
},
"node_modules/@types/range-parser": { "node_modules/@types/range-parser": {
"version": "1.2.5", "version": "1.2.5",
"resolved": "https://registry.npmjs.org/@types/range-parser/-/range-parser-1.2.5.tgz", "resolved": "https://registry.npmjs.org/@types/range-parser/-/range-parser-1.2.5.tgz",
...@@ -7032,9 +7048,10 @@ ...@@ -7032,9 +7048,10 @@
"integrity": "sha512-6tOUG+nVHn0cJbVp25JFayS5UE6+xlbcNF9Lo9mU7U0zk3zeUShZied4YEQZjy1JBF043FSkdXw8YkUJuVtB5g==" "integrity": "sha512-6tOUG+nVHn0cJbVp25JFayS5UE6+xlbcNF9Lo9mU7U0zk3zeUShZied4YEQZjy1JBF043FSkdXw8YkUJuVtB5g=="
}, },
"node_modules/@types/trusted-types": { "node_modules/@types/trusted-types": {
"version": "2.0.4", "version": "2.0.7",
"resolved": "https://registry.npmjs.org/@types/trusted-types/-/trusted-types-2.0.4.tgz", "resolved": "https://registry.npmjs.org/@types/trusted-types/-/trusted-types-2.0.7.tgz",
"integrity": "sha512-IDaobHimLQhjwsQ/NMwRVfa/yL7L/wriQPMhw1ZJall0KX6E1oxk29XMDeilW5qTIg5aoiqf5Udy8U/51aNoQQ==" "integrity": "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==",
"license": "MIT"
}, },
"node_modules/@types/wnumb": { "node_modules/@types/wnumb": {
"version": "1.2.1", "version": "1.2.1",
...@@ -7978,6 +7995,18 @@ ...@@ -7978,6 +7995,18 @@
"integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==", "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==",
"dev": true "dev": true
}, },
"node_modules/atob": {
"version": "2.1.2",
"resolved": "https://registry.npmjs.org/atob/-/atob-2.1.2.tgz",
"integrity": "sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==",
"license": "(MIT OR Apache-2.0)",
"bin": {
"atob": "bin/atob.js"
},
"engines": {
"node": ">= 4.5.0"
}
},
"node_modules/autoprefixer": { "node_modules/autoprefixer": {
"version": "10.4.16", "version": "10.4.16",
"resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.16.tgz", "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.16.tgz",
...@@ -8109,6 +8138,15 @@ ...@@ -8109,6 +8138,15 @@
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz", "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==" "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="
}, },
"node_modules/base64-arraybuffer": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-1.0.2.tgz",
"integrity": "sha512-I3yl4r9QB5ZRY3XuJVEPfc2XhZO6YweFPI+UovAzn+8/hb3oJ6lnysaFcjVpkCPfVWFUDvoZ8kmVDP7WyRtYtQ==",
"license": "MIT",
"engines": {
"node": ">= 0.6.0"
}
},
"node_modules/base64-js": { "node_modules/base64-js": {
"version": "1.5.1", "version": "1.5.1",
"resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz", "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
...@@ -8533,6 +8571,18 @@ ...@@ -8533,6 +8571,18 @@
"resolved": "https://registry.npmjs.org/bs-recipes/-/bs-recipes-1.3.4.tgz", "resolved": "https://registry.npmjs.org/bs-recipes/-/bs-recipes-1.3.4.tgz",
"integrity": "sha512-BXvDkqhDNxXEjeGM8LFkSbR+jzmP/CYpCiVKYn+soB1dDldeU15EBNDkwVXndKuX35wnNUaPd0qSoQEAkmQtMw==" "integrity": "sha512-BXvDkqhDNxXEjeGM8LFkSbR+jzmP/CYpCiVKYn+soB1dDldeU15EBNDkwVXndKuX35wnNUaPd0qSoQEAkmQtMw=="
}, },
"node_modules/btoa": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/btoa/-/btoa-1.2.1.tgz",
"integrity": "sha512-SB4/MIGlsiVkMcHmT+pSmIPoNDoHg+7cMzmt3Uxt628MTz2487DKSqK/fuhFBrkuqrYv5UCEnACpF4dTFNKc/g==",
"license": "(MIT OR Apache-2.0)",
"bin": {
"btoa": "bin/btoa.js"
},
"engines": {
"node": ">= 0.4.0"
}
},
"node_modules/buffer": { "node_modules/buffer": {
"version": "5.7.1", "version": "5.7.1",
"resolved": "https://registry.npmjs.org/buffer/-/buffer-5.7.1.tgz", "resolved": "https://registry.npmjs.org/buffer/-/buffer-5.7.1.tgz",
...@@ -8735,6 +8785,38 @@ ...@@ -8735,6 +8785,38 @@
} }
] ]
}, },
"node_modules/canvg": {
"version": "3.0.11",
"resolved": "https://registry.npmjs.org/canvg/-/canvg-3.0.11.tgz",
"integrity": "sha512-5ON+q7jCTgMp9cjpu4Jo6XbvfYwSB2Ow3kzHKfIyJfaCAOHLbdKPQqGKgfED/R5B+3TFFfe8pegYA+b423SRyA==",
"license": "MIT",
"optional": true,
"dependencies": {
"@babel/runtime": "^7.12.5",
"@types/raf": "^3.4.0",
"core-js": "^3.8.3",
"raf": "^3.4.1",
"regenerator-runtime": "^0.13.7",
"rgbcolor": "^1.0.1",
"stackblur-canvas": "^2.0.0",
"svg-pathdata": "^6.0.3"
},
"engines": {
"node": ">=10.0.0"
}
},
"node_modules/canvg/node_modules/core-js": {
"version": "3.45.1",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-3.45.1.tgz",
"integrity": "sha512-L4NPsJlCfZsPeXukyzHFlg/i7IIVwHSItR0wg0FLNqYClJ4MQYTYLbC7EkjKYRLZF2iof2MUgN0EGy7MdQFChg==",
"hasInstallScript": true,
"license": "MIT",
"optional": true,
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/core-js"
}
},
"node_modules/chalk": { "node_modules/chalk": {
"version": "2.4.2", "version": "2.4.2",
"resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz", "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
...@@ -9372,6 +9454,15 @@ ...@@ -9372,6 +9454,15 @@
"node": ">= 8" "node": ">= 8"
} }
}, },
"node_modules/css-line-break": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/css-line-break/-/css-line-break-2.1.0.tgz",
"integrity": "sha512-FHcKFCZcAha3LwfVBhCQbW2nCNbkZXn7KVUJcsT5/P8YmfsVja0FMPJr0B903j/E69HUphKiV9iQArX8SDYA4w==",
"license": "MIT",
"dependencies": {
"utrie": "^1.0.2"
}
},
"node_modules/css-loader": { "node_modules/css-loader": {
"version": "6.8.1", "version": "6.8.1",
"resolved": "https://registry.npmjs.org/css-loader/-/css-loader-6.8.1.tgz", "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-6.8.1.tgz",
...@@ -9977,6 +10068,16 @@ ...@@ -9977,6 +10068,16 @@
"url": "https://github.com/fb55/domhandler?sponsor=1" "url": "https://github.com/fb55/domhandler?sponsor=1"
} }
}, },
"node_modules/dompurify": {
"version": "3.2.6",
"resolved": "https://registry.npmjs.org/dompurify/-/dompurify-3.2.6.tgz",
"integrity": "sha512-/2GogDQlohXPZe6D6NOgQvXLPSYBqIWMnZ8zzOhn09REE4eyAzb+Hed3jhoM9OkuaJ8P6ZGTTVWQKAi8ieIzfQ==",
"license": "(MPL-2.0 OR Apache-2.0)",
"optional": true,
"optionalDependencies": {
"@types/trusted-types": "^2.0.7"
}
},
"node_modules/domutils": { "node_modules/domutils": {
"version": "3.1.0", "version": "3.1.0",
"resolved": "https://registry.npmjs.org/domutils/-/domutils-3.1.0.tgz", "resolved": "https://registry.npmjs.org/domutils/-/domutils-3.1.0.tgz",
...@@ -10319,6 +10420,12 @@ ...@@ -10319,6 +10420,12 @@
"integrity": "sha512-JUFAyicQV9mXc3YRxPnDlrfBKpqt6hUYzz9/boprUJHs4e4KVr3XwOF70doO6gwXUor6EWZJAyWAfKki84t20Q==", "integrity": "sha512-JUFAyicQV9mXc3YRxPnDlrfBKpqt6hUYzz9/boprUJHs4e4KVr3XwOF70doO6gwXUor6EWZJAyWAfKki84t20Q==",
"dev": true "dev": true
}, },
"node_modules/es6-promise": {
"version": "4.2.8",
"resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.2.8.tgz",
"integrity": "sha512-HJDGx5daxeIvxdBxvG2cb9g4tEvwIk3i8+nhX0yGrYmZUzbkdg8QbDevheDB8gd0//uPj4c1EQua8Q+MViT0/w==",
"license": "MIT"
},
"node_modules/esbuild": { "node_modules/esbuild": {
"version": "0.18.17", "version": "0.18.17",
"resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.18.17.tgz", "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.18.17.tgz",
...@@ -11212,6 +11319,12 @@ ...@@ -11212,6 +11319,12 @@
"resolved": "https://registry.npmjs.org/fecha/-/fecha-4.2.3.tgz", "resolved": "https://registry.npmjs.org/fecha/-/fecha-4.2.3.tgz",
"integrity": "sha512-OP2IUU6HeYKJi3i0z4A19kHMQoLVs4Hc+DPqqxI2h/DPZHTm/vjsfC6P0b4jCMy14XizLBqvndQ+UilD7707Jw==" "integrity": "sha512-OP2IUU6HeYKJi3i0z4A19kHMQoLVs4Hc+DPqqxI2h/DPZHTm/vjsfC6P0b4jCMy14XizLBqvndQ+UilD7707Jw=="
}, },
"node_modules/fflate": {
"version": "0.8.2",
"resolved": "https://registry.npmjs.org/fflate/-/fflate-0.8.2.tgz",
"integrity": "sha512-cPJU47OaAoCbg0pBvzsgpTPhmhqI5eJjh/JIu8tPj5q+T7iLvW/JAYUqmE7KOB4R1ZyEhzBaIQpQpardBF5z8A==",
"license": "MIT"
},
"node_modules/figures": { "node_modules/figures": {
"version": "3.2.0", "version": "3.2.0",
"resolved": "https://registry.npmjs.org/figures/-/figures-3.2.0.tgz", "resolved": "https://registry.npmjs.org/figures/-/figures-3.2.0.tgz",
...@@ -12094,6 +12207,30 @@ ...@@ -12094,6 +12207,30 @@
"integrity": "sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==", "integrity": "sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==",
"dev": true "dev": true
}, },
"node_modules/html2canvas": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/html2canvas/-/html2canvas-1.4.1.tgz",
"integrity": "sha512-fPU6BHNpsyIhr8yyMpTLLxAbkaK8ArIBcmZIRiBLiDhjeqvXolaEmDGmELFuX9I4xDcaKKcJl+TKZLqruBbmWA==",
"license": "MIT",
"dependencies": {
"css-line-break": "^2.1.0",
"text-segmentation": "^1.0.3"
},
"engines": {
"node": ">=8.0.0"
}
},
"node_modules/html2pdf.js": {
"version": "0.10.3",
"resolved": "https://registry.npmjs.org/html2pdf.js/-/html2pdf.js-0.10.3.tgz",
"integrity": "sha512-RcB1sh8rs5NT3jgbN5zvvTmkmZrsUrxpZ/RI8TMbvuReNZAdJZG5TMfA2TBP6ZXxpXlWf9NB/ciLXVb6W2LbRQ==",
"license": "MIT",
"dependencies": {
"es6-promise": "^4.2.5",
"html2canvas": "^1.0.0",
"jspdf": "^3.0.0"
}
},
"node_modules/htmlparser2": { "node_modules/htmlparser2": {
"version": "8.0.2", "version": "8.0.2",
"resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-8.0.2.tgz", "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-8.0.2.tgz",
...@@ -13161,6 +13298,33 @@ ...@@ -13161,6 +13298,33 @@
"node >= 0.2.0" "node >= 0.2.0"
] ]
}, },
"node_modules/jspdf": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/jspdf/-/jspdf-3.0.1.tgz",
"integrity": "sha512-qaGIxqxetdoNnFQQXxTKUD9/Z7AloLaw94fFsOiJMxbfYdBbrBuhWmbzI8TVjrw7s3jBY1PFHofBKMV/wZPapg==",
"license": "MIT",
"dependencies": {
"@babel/runtime": "^7.26.7",
"atob": "^2.1.2",
"btoa": "^1.2.1",
"fflate": "^0.8.1"
},
"optionalDependencies": {
"canvg": "^3.0.11",
"core-js": "^3.6.0",
"dompurify": "^3.2.4",
"html2canvas": "^1.0.0-rc.5"
}
},
"node_modules/jspdf/node_modules/@babel/runtime": {
"version": "7.28.3",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.28.3.tgz",
"integrity": "sha512-9uIQ10o0WGdpP6GDhXcdOJPJuDgFtIDtN/9+ArJQ2NAfAmiuhTQdzkaTGR33v43GYS2UrSA0eX2pPPHoFVvpxA==",
"license": "MIT",
"engines": {
"node": ">=6.9.0"
}
},
"node_modules/karma": { "node_modules/karma": {
"version": "6.4.2", "version": "6.4.2",
"resolved": "https://registry.npmjs.org/karma/-/karma-6.4.2.tgz", "resolved": "https://registry.npmjs.org/karma/-/karma-6.4.2.tgz",
...@@ -15520,6 +15684,13 @@ ...@@ -15520,6 +15684,13 @@
"node": ">=8" "node": ">=8"
} }
}, },
"node_modules/performance-now": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz",
"integrity": "sha512-7EAHlyLHI56VEIdK57uwHdHKIaAGbnXPiw0yWbarQZOKaKpvUIgW0jWRVLiatnM+XXlSwsanIBH/hzGMJulMow==",
"license": "MIT",
"optional": true
},
"node_modules/picocolors": { "node_modules/picocolors": {
"version": "1.0.0", "version": "1.0.0",
"resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
...@@ -16182,6 +16353,16 @@ ...@@ -16182,6 +16353,16 @@
} }
] ]
}, },
"node_modules/raf": {
"version": "3.4.1",
"resolved": "https://registry.npmjs.org/raf/-/raf-3.4.1.tgz",
"integrity": "sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA==",
"license": "MIT",
"optional": true,
"dependencies": {
"performance-now": "^2.1.0"
}
},
"node_modules/randombytes": { "node_modules/randombytes": {
"version": "2.1.0", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz", "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz",
...@@ -16564,6 +16745,16 @@ ...@@ -16564,6 +16745,16 @@
"resolved": "https://registry.npmjs.org/rfdc/-/rfdc-1.3.0.tgz", "resolved": "https://registry.npmjs.org/rfdc/-/rfdc-1.3.0.tgz",
"integrity": "sha512-V2hovdzFbOi77/WajaSMXk2OLm+xNIeQdMMuB7icj7bk6zi2F8GGAxigcnDFpJHbNyNcgyJDiP+8nOrY5cZGrA==" "integrity": "sha512-V2hovdzFbOi77/WajaSMXk2OLm+xNIeQdMMuB7icj7bk6zi2F8GGAxigcnDFpJHbNyNcgyJDiP+8nOrY5cZGrA=="
}, },
"node_modules/rgbcolor": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/rgbcolor/-/rgbcolor-1.0.1.tgz",
"integrity": "sha512-9aZLIrhRaD97sgVhtJOW6ckOEh6/GnvQtdVNfdZ6s67+3/XwLS9lBcQYzEEhYVeUowN7pRzMLsyGhK2i/xvWbw==",
"license": "MIT OR SEE LICENSE IN FEEL-FREE.md",
"optional": true,
"engines": {
"node": ">= 0.8.15"
}
},
"node_modules/rimraf": { "node_modules/rimraf": {
"version": "3.0.2", "version": "3.0.2",
"resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz", "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
...@@ -17438,6 +17629,16 @@ ...@@ -17438,6 +17629,16 @@
"node": "*" "node": "*"
} }
}, },
"node_modules/stackblur-canvas": {
"version": "2.7.0",
"resolved": "https://registry.npmjs.org/stackblur-canvas/-/stackblur-canvas-2.7.0.tgz",
"integrity": "sha512-yf7OENo23AGJhBriGx0QivY5JP6Y1HbrrDI6WLt6C5auYZXlQrheoY8hD4ibekFKz1HOfE48Ww8kMWMnJD/zcQ==",
"license": "MIT",
"optional": true,
"engines": {
"node": ">=0.1.14"
}
},
"node_modules/statuses": { "node_modules/statuses": {
"version": "1.3.1", "version": "1.3.1",
"resolved": "https://registry.npmjs.org/statuses/-/statuses-1.3.1.tgz", "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.3.1.tgz",
...@@ -17632,6 +17833,16 @@ ...@@ -17632,6 +17833,16 @@
"url": "https://github.com/sponsors/ljharb" "url": "https://github.com/sponsors/ljharb"
} }
}, },
"node_modules/svg-pathdata": {
"version": "6.0.3",
"resolved": "https://registry.npmjs.org/svg-pathdata/-/svg-pathdata-6.0.3.tgz",
"integrity": "sha512-qsjeeq5YjBZ5eMdFuUa4ZosMLxgr5RZ+F+Y1OrDhuOCEInRMA3x74XdBtggJcj9kOeInz0WE+LgCPDkZFlBYJw==",
"license": "MIT",
"optional": true,
"engines": {
"node": ">=12.0.0"
}
},
"node_modules/svg.draggable.js": { "node_modules/svg.draggable.js": {
"version": "2.2.2", "version": "2.2.2",
"resolved": "https://registry.npmjs.org/svg.draggable.js/-/svg.draggable.js-2.2.2.tgz", "resolved": "https://registry.npmjs.org/svg.draggable.js/-/svg.draggable.js-2.2.2.tgz",
...@@ -18039,6 +18250,15 @@ ...@@ -18039,6 +18250,15 @@
"resolved": "https://registry.npmjs.org/text-hex/-/text-hex-1.0.0.tgz", "resolved": "https://registry.npmjs.org/text-hex/-/text-hex-1.0.0.tgz",
"integrity": "sha512-uuVGNWzgJ4yhRaNSiubPY7OjISw4sw4E5Uv0wbjp+OzcbmVU/rsT8ujgcXJhn9ypzsgr5vlzpPqP+MBBKcGvbg==" "integrity": "sha512-uuVGNWzgJ4yhRaNSiubPY7OjISw4sw4E5Uv0wbjp+OzcbmVU/rsT8ujgcXJhn9ypzsgr5vlzpPqP+MBBKcGvbg=="
}, },
"node_modules/text-segmentation": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/text-segmentation/-/text-segmentation-1.0.3.tgz",
"integrity": "sha512-iOiPUo/BGnZ6+54OsWxZidGCsdU8YbE4PSpdPinp7DeMtUJNJBoJ/ouUSTJjHkh1KntHaltHl/gDs2FC4i5+Nw==",
"license": "MIT",
"dependencies": {
"utrie": "^1.0.2"
}
},
"node_modules/text-table": { "node_modules/text-table": {
"version": "0.2.0", "version": "0.2.0",
"resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz", "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
...@@ -18447,6 +18667,15 @@ ...@@ -18447,6 +18667,15 @@
"node": ">= 0.4.0" "node": ">= 0.4.0"
} }
}, },
"node_modules/utrie": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/utrie/-/utrie-1.0.2.tgz",
"integrity": "sha512-1MLa5ouZiOmQzUbjbu9VmjLzn1QLXBhwpUa7kdLUQK+KQ5KA9I1vk5U4YHe/X2Ch7PYnJfWuWT+VbuxbGwljhw==",
"license": "MIT",
"dependencies": {
"base64-arraybuffer": "^1.0.2"
}
},
"node_modules/uuid": { "node_modules/uuid": {
"version": "8.3.2", "version": "8.3.2",
"resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz", "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
......
package.json
...@@ -59,6 +59,7 @@ ...@@ -59,6 +59,7 @@
"glob-watcher": "^6.0.0", "glob-watcher": "^6.0.0",
"hammerjs": "^2.0.8", "hammerjs": "^2.0.8",
"helmet": "^7.0.0", "helmet": "^7.0.0",
"html2pdf.js": "^0.10.3",
"keen-slider": "^6.8.5", "keen-slider": "^6.8.5",
"leaflet": "^1.9.4", "leaflet": "^1.9.4",
"lightgallery": "^2.1.2", "lightgallery": "^2.1.2",
...@@ -102,6 +103,7 @@ ...@@ -102,6 +103,7 @@
"@types/d3-shape": "^3.1.1", "@types/d3-shape": "^3.1.1",
"@types/hammerjs": "^2.0.41", "@types/hammerjs": "^2.0.41",
"@types/jasmine": "~4.3.4", "@types/jasmine": "~4.3.4",
"@types/jspdf": "^1.3.3",
"@types/leaflet": "^1.9.3", "@types/leaflet": "^1.9.3",
"@types/mousetrap": "^1.6.11", "@types/mousetrap": "^1.6.11",
"@types/wnumb": "^1.2.1", "@types/wnumb": "^1.2.1",
......
src/app/components/performance-evaluation/pms-form-employee/pms-form-employee.component.html
...@@ -617,7 +617,7 @@ ...@@ -617,7 +617,7 @@
<app-pms-idp [currentTap]="currentTap" [canSave]="canSave" [appraisalIdp]="compentency.data.idp" <app-pms-idp [currentTap]="currentTap" [canSave]="canSave" [appraisalIdp]="compentency.data.idp"
[evaluaterId]="evaluaterId" [evaluateeId]="evaluateeId" [evaluaterId]="evaluaterId" [evaluateeId]="evaluateeId"
[canEdit]="evaluationForm=='sup'?canEdit:false" [currentStep]="compentency.data.currentStep" [canEdit]="evaluationForm=='sup'?canEdit:false" [currentStep]="compentency.data.currentStep"
[dateIso]="dateIso" (idpForm)="compentency.data.idp=$event" [complete]="complete"></app-pms-idp> [dateIso]="dateIso" (idpForm)="compentency.data.idp=$event" [complete]="complete" [pdfPrint]="pdfPrint" (pdfPrinted)="onPdfPrinted()"></app-pms-idp>
</div> </div>
<ng-container *ngIf="compentency.data&&canSave"> <ng-container *ngIf="compentency.data&&canSave">
<div class="box-footer text-end space-x-3 rtl:space-x-reverse" <div class="box-footer text-end space-x-3 rtl:space-x-reverse"
...@@ -626,6 +626,11 @@ ...@@ -626,6 +626,11 @@
<textarea type="text" class="ti-form-input" rows="2" placeholder="ใส่ Comment ที่นี่" <textarea type="text" class="ti-form-input" rows="2" placeholder="ใส่ Comment ที่นี่"
[(ngModel)]="comment"></textarea> [(ngModel)]="comment"></textarea>
</div> </div>
<button (click)="toggleStatusPdfPrint()" class="ti-btn m-0 ti-btn-soft-warning"
*ngIf="currentTap == 'แผนพัฒนาบุคลากร'">
<i class="ri-draft-fill"></i>
PDF
</button>
<button (click)="save('approve')" class="ti-btn m-0 ti-btn-soft-secondary" <button (click)="save('approve')" class="ti-btn m-0 ti-btn-soft-secondary"
[disabled]="compentencyFormRemain||kpiFormRemain" [disabled]="compentencyFormRemain||kpiFormRemain"
[class.ti-btn-disabled]="compentencyFormRemain||kpiFormRemain"> [class.ti-btn-disabled]="compentencyFormRemain||kpiFormRemain">
...@@ -659,4 +664,4 @@ ...@@ -659,4 +664,4 @@
</div> </div>
</div> </div>
</div> </div>
</ng-template> </ng-template>
\ No newline at end of file
src/app/components/performance-evaluation/pms-form-employee/pms-form-employee.component.scss
...@@ -8,3 +8,18 @@ ...@@ -8,3 +8,18 @@
opacity: 1; opacity: 1;
} }
} }
@media print {
body * {
visibility: hidden; /* ซ่อนทุก element */
}
#printArea, #printArea * {
visibility: visible; /* แสดงเฉพาะ #printArea */
}
#printArea {
position: absolute;
left: 0;
top: 0;
width: 100%;
}
}
src/app/components/performance-evaluation/pms-form-employee/pms-form-employee.component.ts
...@@ -74,7 +74,7 @@ export class PmsFormEmployeeComponent { ...@@ -74,7 +74,7 @@ export class PmsFormEmployeeComponent {
complete = false complete = false
@ViewChild('scrollContainer') scrollContainer!: ElementRef; @ViewChild('scrollContainer') scrollContainer!: ElementRef;
pdfPrint = false;
constructor( constructor(
private router: Router, private router: Router,
...@@ -429,7 +429,7 @@ export class PmsFormEmployeeComponent { ...@@ -429,7 +429,7 @@ export class PmsFormEmployeeComponent {
<g id="alert cart"> <g id="alert cart">
<g id="mdi:file-export"> <g id="mdi:file-export">
<circle cx="22.5" cy="19.5" r="33.5" fill="#E8F8EE"/> <circle cx="22.5" cy="19.5" r="33.5" fill="#E8F8EE"/>
<path d="M9.75 3.25C8.88805 3.25 8.0614 3.59241 7.4519 4.2019C6.84241 4.8114 6.5 5.63805 6.5 6.5V32.5C6.5 33.362 6.84241 34.1886 7.4519 34.7981C8.0614 35.4076 8.88805 35.75 9.75 35.75H29.25C30.112 35.75 30.9386 35.4076 31.5481 34.7981C32.1576 34.1886 32.5 33.362 32.5 32.5V13L22.75 3.25M21.125 5.6875L30.0625 14.625H21.125M14.5113 19.8575H26V31.3463L22.555 27.9013L17.9563 32.5L13.3575 27.9013L17.9563 23.3188" <path d="M9.75 3.25C8.88805 3.25 8.0614 3.59241 7.4519 4.2019C6.84241 4.8114 6.5 5.63805 6.5 6.5V32.5C6.5 33.362 6.84241 34.1886 7.4519 34.7981C8.0614 35.4076 8.88805 35.75 9.75 35.75H29.25C30.112 35.75 30.9386 35.4076 31.5481 34.7981C32.1576 34.1886 32.5 33.362 32.5 32.5V13L22.75 3.25M21.125 5.6875L30.0625 14.625H21.125M14.5113 19.8575H26V31.3463L22.555 27.9013L17.9563 32.5L13.3575 27.9013L17.9563 23.3188"
fill="#1DBE5A"/> fill="#1DBE5A"/>
</g> </g>
</g> </g>
...@@ -759,4 +759,14 @@ export class PmsFormEmployeeComponent { ...@@ -759,4 +759,14 @@ export class PmsFormEmployeeComponent {
const imgElement = event.target as HTMLImageElement; const imgElement = event.target as HTMLImageElement;
imgElement.src = './assets/img/users/defaultperson.jpg'; imgElement.src = './assets/img/users/defaultperson.jpg';
} }
}
\ No newline at end of file toggleStatusPdfPrint() {
this.pdfPrint = !this.pdfPrint; // สลับ true/false เพื่อให้ Child จับการเปลี่ยน
}
onPdfPrinted() {
// เมื่อ Child แจ้งว่าพิมพ์เสร็จ ให้รีเซ็ตกลับเป็น false
this.pdfPrint = false;
}
}
src/app/components/performance-evaluation/pms-form-employee/pms-idp/pms-idp.component.html
<ng-container *ngTemplateOutlet="idpEvaluation"></ng-container> <ng-container *ngTemplateOutlet="idpEvaluation"></ng-container>
<ng-template #idpEvaluation> <ng-template #idpEvaluation>
<ng-container *ngIf="appraisalIdp"> <ng-container *ngIf="appraisalIdp">
<div style="overflow-y: auto;" style="padding-top: 1rem"> <div style="overflow-y: auto; padding-top: 1rem" #pdfArea class="pdf-container">
<div class="pb-2"> <div class="pb-2">
<div class="font-size-18px font-weight-700 text-gray-500"> <div class="font-size-18px font-weight-700 text-gray-500">
ส่วนที่ 1: ข้อมูลทั่วไป ส่วนที่ 1: ข้อมูลทั่วไป
...@@ -283,29 +283,34 @@ ...@@ -283,29 +283,34 @@
<div class="flex !items-center" style="min-height: 100px;"> <div class="flex !items-center" style="min-height: 100px;">
{{competencyCourse.tdesc}} {{competencyCourse.tdesc}}
<span class="ciricon border cursor-pointer" <span class="ciricon border cursor-pointer"
*ngIf="canEdit&&appraisalIdp.masfromEvaluationIdp.idpStatus=='1'" *ngIf="canEdit&&appraisalIdp.masfromEvaluationIdp.idpStatus=='1' && pdfPrintCheck == 0"
(click)="deleteCompetencyCourse(i,l)"> (click)="deleteCompetencyCourse(i,l)">
<i class="ri-close-line text-red-500"></i> <i class="ri-close-line text-red-500"></i>
</span> </span>
</div> </div>
<button <div *ngIf="pdfPrintCheck == 0">
*ngIf="last&&canEdit&&appraisalIdp.masfromEvaluationIdp.idpStatus=='1'" <button
type="button" *ngIf="last&&canEdit&&appraisalIdp.masfromEvaluationIdp.idpStatus=='1'"
class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md" type="button"
(click)="openCompetencycourseDialog(i) "> class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md"
<i class="ri-add-line"></i> (click)="openCompetencycourseDialog(i) ">
Add <i class="ri-add-line"></i>
Add
</button> </button>
</div>
</ng-container> </ng-container>
</ng-container> </ng-container>
<ng-container <ng-container
*ngIf="canEdit&&!data.competencyCourse?.length&&appraisalIdp.masfromEvaluationIdp.idpStatus=='1'&&data.idpDevelopmentPlan?.training"> *ngIf="canEdit&&!data.competencyCourse?.length&&appraisalIdp.masfromEvaluationIdp.idpStatus=='1'&&data.idpDevelopmentPlan?.training">
<button type="button" <div *ngIf="pdfPrintCheck == 0">
class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md"
(click)="openCompetencycourseDialog(i)"> <button type="button"
<i class="ri-add-line"></i> class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md"
Add (click)="openCompetencycourseDialog(i)">
<i class="ri-add-line"></i>
Add
</button> </button>
</div>
</ng-container> </ng-container>
</td> </td>
<td class="!p-0"></td> <td class="!p-0"></td>
...@@ -315,7 +320,9 @@ ...@@ -315,7 +320,9 @@
*ngIf="appraisalIdp.masfromEvaluationRound.apsPeriodStart &&appraisalIdp.masfromEvaluationRound.apsPeriodEnd"> *ngIf="appraisalIdp.masfromEvaluationRound.apsPeriodStart &&appraisalIdp.masfromEvaluationRound.apsPeriodEnd">
จาก&nbsp; จาก&nbsp;
</ng-container> </ng-container>
<ng-container
<ng-container *ngIf="pdfPrintCheck == 0">
<ng-container
*ngIf="data.idpDevelopmentPlan&&data.idpDevelopmentPlan?.training && appraisalIdp.apsapprove1.employeeId == evaluaterId"> *ngIf="data.idpDevelopmentPlan&&data.idpDevelopmentPlan?.training && appraisalIdp.apsapprove1.employeeId == evaluaterId">
<input type="date" id="input-label" class="ti-form-input" <input type="date" id="input-label" class="ti-form-input"
[(ngModel)]="appraisalIdp.masfromEvaluationRound.apsPeriodStart"> [(ngModel)]="appraisalIdp.masfromEvaluationRound.apsPeriodStart">
...@@ -335,6 +342,18 @@ ...@@ -335,6 +342,18 @@
</ng-container> </ng-container>
{{convertDateFormat(appraisalIdp.masfromEvaluationRound.apsPeriodEnd)}} {{convertDateFormat(appraisalIdp.masfromEvaluationRound.apsPeriodEnd)}}
</ng-container> </ng-container>
</ng-container>
<ng-container *ngIf="pdfPrintCheck == 1">
{{convertDateFormat(appraisalIdp.masfromEvaluationRound.apsPeriodStart)}}
<ng-container
*ngIf="appraisalIdp.masfromEvaluationRound.apsPeriodStart &&appraisalIdp.masfromEvaluationRound.apsPeriodEnd">
<p></p>ถึง&nbsp;
</ng-container>
{{convertDateFormat(appraisalIdp.masfromEvaluationRound.apsPeriodEnd)}}
</ng-container>
</td> </td>
</tr> </tr>
</ng-container> </ng-container>
...@@ -414,4 +433,4 @@ ...@@ -414,4 +433,4 @@
ย้อนกลับ ย้อนกลับ
</button> </button>
</mat-dialog-actions> </mat-dialog-actions>
</ng-template> </ng-template>
\ No newline at end of file
src/app/components/performance-evaluation/pms-form-employee/pms-idp/pms-idp.component.scss
@media print {
body * {
visibility: hidden; /* ซ่อนทุก element */
}
#printArea, #printArea * {
visibility: visible; /* แสดงเฉพาะ #printArea */
}
#printArea {
position: absolute;
left: 0;
top: 0;
width: 100%;
}
}
.pdf-container {
/* เอาตามที่คุณมีได้เลย */
background: #fff;
padding: 10px;
transform: translateZ(0);
}
.pdf-container table {
// table-layout: fixed;
width: 100%;
// word-break: break-word;
white-space: normal;
}
.page-break {
break-after: page; /* modern */
page-break-after: always; /* legacy */
}
.no-break {
break-inside: avoid;
page-break-inside: avoid;
}
.pdf-header {
display: flex;
gap: 12px;
align-items: center;
img {
width: 72px;
height: 72px;
object-fit: cover;
border-radius: 50%;
}
}
/* ตารางใน PDF ให้ไม่แตกกลางหน้า */
table, .card, .section-block {
break-inside: avoid;
page-break-inside: avoid;
}
.pdf-container > :last-child {
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
// .pdf-container .page-break:last-child {
// page-break-after: auto !important;
// break-after: auto !important;
// }
src/app/components/performance-evaluation/pms-form-employee/pms-idp/pms-idp.component.ts
import { ChangeDetectorRef, Component, EventEmitter, Input, Output, SimpleChanges, ViewChild } from '@angular/core'; import { ChangeDetectorRef, Component, ElementRef, EventEmitter, Input, Output, SimpleChanges, ViewChild } from '@angular/core';
import { MatDialog } from '@angular/material/dialog'; import { MatDialog } from '@angular/material/dialog';
import { Idp } from 'src/app/shared/model/competency.model'; import { Idp } from 'src/app/shared/model/competency.model';
import { CompetencycourseMiniModel, MyCompetencycourseMiniModel } from 'src/app/shared/model/competencycourse-mini.model'; import { CompetencycourseMiniModel, MyCompetencycourseMiniModel } from 'src/app/shared/model/competencycourse-mini.model';
...@@ -35,6 +35,10 @@ export class PmsIdpComponent { ...@@ -35,6 +35,10 @@ export class PmsIdpComponent {
@Input() currentStep = "" @Input() currentStep = ""
@Input() currentTap = "" @Input() currentTap = ""
@Output() idpForm: EventEmitter<any> = new EventEmitter<any>(); @Output() idpForm: EventEmitter<any> = new EventEmitter<any>();
@Input() pdfPrint = false;
@Output() pdfPrinted = new EventEmitter<void>();
pdfPrintCheck = 0
@ViewChild('pdfArea') pdfArea!: ElementRef<HTMLElement>;
competencycourse: { loading: boolean, data: CompetencycourseMiniModel[] } = { loading: false, data: [] } competencycourse: { loading: boolean, data: CompetencycourseMiniModel[] } = { loading: false, data: [] }
competencycourseTable: table = { competencycourseTable: table = {
...@@ -58,6 +62,17 @@ export class PmsIdpComponent { ...@@ -58,6 +62,17 @@ export class PmsIdpComponent {
this.getCompetencycourseMiniList() this.getCompetencycourseMiniList()
} }
ngOnChanges(changes: SimpleChanges): void { ngOnChanges(changes: SimpleChanges): void {
if (changes['pdfPrint']) {
const { previousValue, currentValue } = changes['pdfPrint'];
console.log('pdfPrint changed:', previousValue, '→', currentValue);
// สั่งพิมพ์เฉพาะตอนเป็น true
if (currentValue === true) {
this.pdfPrintCheck = 1
this.exportPdf();
this.pdfPrinted.emit(); // แจ้ง Parent ให้รีเซ็ต flag
}
}
if (changes['currentTap']?.currentValue || changes['appraisalIdp']?.currentValue) { if (changes['currentTap']?.currentValue || changes['appraisalIdp']?.currentValue) {
this.getFormIdp() this.getFormIdp()
} }
...@@ -173,4 +188,164 @@ export class PmsIdpComponent { ...@@ -173,4 +188,164 @@ export class PmsIdpComponent {
this.idpForm.emit(this.appraisalIdp) this.idpForm.emit(this.appraisalIdp)
} }
print() {
window.print();
}
/** ล็อคความกว้างเทียบ A4 (≈794px @96dpi) ให้ layout เสถียรตอนแคปเจอร์ */
private freezeWidthForA4(el: HTMLElement) {
const prev = {
width: el.style.width,
maxWidth: el.style.maxWidth,
transform: el.style.transform,
transformOrigin: el.style.transformOrigin,
};
el.style.width = '794px';
el.style.maxWidth = '794px';
el.style.transformOrigin = 'top left';
el.style.transform = 'scale(1)';
return () => {
el.style.width = prev.width;
el.style.maxWidth = prev.maxWidth;
el.style.transform = prev.transform;
el.style.transformOrigin = prev.transformOrigin;
};
}
/** ขยายเป็นความกว้างจริง (scrollWidth) แล้วสเกลลงให้พอดี A4 */
private expandToFullWidthThenScale(el: HTMLElement) {
const A4_PX = 794; // ≈ 210mm @ 96dpi
const full = el.scrollWidth; // ความกว้างจริงทั้งหมด (รวมพื้นที่ต้องเลื่อนขวา)
const scale = Math.min(1, A4_PX / full); // สเกลลงให้พอดี A4 (ถ้ากว้างกว่า)
// เก็บค่าเดิมไว้คืนทีหลัง
const prev = {
width: el.style.width,
maxWidth: el.style.maxWidth,
overflowX: el.style.overflowX,
transform: el.style.transform,
transformOrigin: el.style.transformOrigin,
};
// คลี่ความกว้างออกทั้งหมด แล้วสเกลให้พอดี A4
el.style.width = `${full}px`;
el.style.maxWidth = 'none';
el.style.overflowX = 'visible';
el.style.transformOrigin = 'top left';
el.style.transform = `scale(${scale})`;
// คืนค่า
return () => {
el.style.width = prev.width;
el.style.maxWidth = prev.maxWidth;
el.style.overflowX = prev.overflowX;
el.style.transform = prev.transform;
el.style.transformOrigin = prev.transformOrigin;
};
}
/** ทำให้ทุกกล่องใน subtree ไม่ตัดขอบขวา: overflowX => visible, ยกเลิก position:sticky ชั่วคราว */
private unclipOverflows(el: HTMLElement) {
const patched: Array<{node: HTMLElement, prev: Partial<CSSStyleDeclaration>}> = [];
const walker = document.createTreeWalker(el, NodeFilter.SHOW_ELEMENT);
const patchNode = (node: HTMLElement) => {
const style = window.getComputedStyle(node);
const needOverflowPatch = style.overflowX !== 'visible' || style.overflow !== 'visible';
const isSticky = style.position === 'sticky';
if (needOverflowPatch || isSticky) {
const prev = {
overflow: node.style.overflow,
overflowX: node.style.overflowX,
overflowY: node.style.overflowY,
position: node.style.position,
clipPath: (node.style as any).clipPath,
};
patched.push({ node, prev });
node.style.overflow = 'visible';
node.style.overflowX = 'visible';
node.style.overflowY = 'visible';
if (isSticky) node.style.position = 'static';
(node.style as any).clipPath = 'none';
}
};
// รวม el เองด้วย
patchNode(el as HTMLElement);
while (walker.nextNode()) {
patchNode(walker.currentNode as HTMLElement);
}
// ฟังก์ชันคืนค่าเดิม
return () => {
for (const { node, prev } of patched) {
node.style.overflow = prev.overflow || '';
node.style.overflowX = prev.overflowX || '';
node.style.overflowY = prev.overflowY || '';
node.style.position = prev.position || '';
(node.style as any).clipPath = prev.clipPath || '';
}
};
}
// @ViewChild('pdfArea') pdfArea!: ElementRef<HTMLElement>;
async exportPdf() {
const el = this.pdfArea?.nativeElement;
if (!el) return;
const mod: any = await import('html2pdf.js');
const html2pdf = mod.default ?? mod;
// 1) คลี่กว้างจริงแล้วสเกลลงพอดี A4
const cleanupScale = this.expandToFullWidthThenScale(el);
// 2) ปลดคลิป overflow/sticky ของลูก ๆ ทั้งหมด
const cleanupUnclip = this.unclipOverflows(el);
const prevBodyOverflow = document.body.style.overflow;
document.body.style.overflow = 'hidden';
// ขนาดจริงของ element (หลังถูกขยายแล้ว)
const fullW = el.scrollWidth;
const fullH = el.scrollHeight;
const epsilon = 2; // กันเผื่อ
const opt = {
margin: [10,10,10,10],
filename: `pms-${this.evaluateeId || 'employee'}-${new Date().toISOString().slice(0,10)}.pdf`,
image: { type: 'jpeg', quality: 0.96 },
html2canvas: {
scale: 2,
useCORS: true,
logging: false,
scrollX: 0,
scrollY: -window.scrollY,
// 👇 บอกขนาดที่จะเรนเดอร์ให้เท่าของจริงทั้งหมด
width: 800,
// height: fullH,
height: Math.max(0, fullH - epsilon),
windowWidth: 800,
// windowHeight: fullH,
windowHeight: Math.max(0, fullH - epsilon),
// foreignObjectRendering: true, // ลองเปิดถ้า layout ยังเพี้ยน (มีข้อจำกัดกับบางเคส)
},
jsPDF: { unit: 'mm', format: 'a4', orientation: 'portrait' },
pagebreak: { mode: ['css','legacy'], avoid: ['.no-break','table','img'] }
};
try {
await html2pdf().from(el).set(opt).save();
} finally {
cleanupUnclip();
cleanupScale();
document.body.style.overflow = prevBodyOverflow;
}
this.pdfPrintCheck = 0
}
} }
src/app/components/performance-evaluation/self-evaluation/self-evaluation.component.ts
...@@ -127,4 +127,4 @@ export class SelfEvaluationComponent implements OnInit { ...@@ -127,4 +127,4 @@ export class SelfEvaluationComponent implements OnInit {
} }
return date?.toLocaleDateString('th-TH', { day: 'numeric', month: 'long', year: 'numeric' }) || '' return date?.toLocaleDateString('th-TH', { day: 'numeric', month: 'long', year: 'numeric' }) || ''
} }
} }
\ No newline at end of file
src/typings/html2pdf.d.ts 0 → 100644
declare module 'html2pdf.js' {
const html2pdf: any;
export default html2pdf;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment