feat: PDF report lengkap dengan summary, top 5, attention villages, trend, peak hours
- PDF report memuat 6 ringkasan kartu: desa aktif/nonaktif/no-activity, total aktivitas, pengguna aktif/nonaktif - Section Top 5 desa paling aktif dengan progress bar dan medal emoji - Section Villages Needing Attention untuk desa nonaktif atau tanpa aktivitas - Tabel semua desa dengan kolom trend vs periode sebelumnya - Section Peak Activity Hours dalam layout dua kolom bersama Top 5 - Menggunakan window.open + HTML string untuk output yang bersih dan terbaca
This commit is contained in:
46
bun.lock
46
bun.lock
@@ -22,6 +22,8 @@
|
||||
"dayjs": "^1.11.20",
|
||||
"elkjs": "^0.9.3",
|
||||
"elysia": "^1.4.28",
|
||||
"html2canvas": "^1.4.1",
|
||||
"jspdf": "^4.2.1",
|
||||
"minio": "^8.0.7",
|
||||
"postcss": "^8.5.8",
|
||||
"postcss-preset-mantine": "^1.18.0",
|
||||
@@ -352,10 +354,16 @@
|
||||
|
||||
"@types/node": ["@types/node@25.5.0", "", { "dependencies": { "undici-types": "~7.18.0" } }, "sha512-jp2P3tQMSxWugkCUKLRPVUpGaL5MVFwF8RDuSRztfwgN1wmqJeMSbKlnEtQqU8UrhTmzEmZdu2I6v2dpp7XIxw=="],
|
||||
|
||||
"@types/pako": ["@types/pako@2.0.4", "", {}, "sha512-VWDCbrLeVXJM9fihYodcLiIv0ku+AlOa/TQ1SvYOaBuyrSKgEcro95LJyIsJ4vSo6BXIxOKxiJAat04CmST9Fw=="],
|
||||
|
||||
"@types/raf": ["@types/raf@3.4.3", "", {}, "sha512-c4YAvMedbPZ5tEyxzQdMoOhhJ4RD3rngZIdwC2/qDN3d7JpEhB6fiBRKVY1lg5B7Wk+uPBjn5f39j1/2MY1oOw=="],
|
||||
|
||||
"@types/react": ["@types/react@19.2.14", "", { "dependencies": { "csstype": "^3.2.2" } }, "sha512-ilcTH/UniCkMdtexkoCN0bI7pMcJDvmQFPvuPvmEaYA/NSfFTAgdUSLAoVjaRJm7+6PvcM+q1zYOwS4wTYMF9w=="],
|
||||
|
||||
"@types/react-dom": ["@types/react-dom@19.2.3", "", { "peerDependencies": { "@types/react": "^19.2.0" } }, "sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ=="],
|
||||
|
||||
"@types/trusted-types": ["@types/trusted-types@2.0.7", "", {}, "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw=="],
|
||||
|
||||
"@types/use-sync-external-store": ["@types/use-sync-external-store@0.0.6", "", {}, "sha512-zFDAD+tlpf2r4asuHEj0XH6pY6i0g5NeAHPn+15wk3BV6JA69eERFXC1gyGThDkVa1zCyKr5jox1+2LbV/AMLg=="],
|
||||
|
||||
"@types/yauzl": ["@types/yauzl@2.10.3", "", { "dependencies": { "@types/node": "*" } }, "sha512-oJoftv0LSuaDZE3Le4DbKX+KS9G36NzOeSap90UIK0yMA/NhKJhqlSGtNDORNRaIbQfzjXDrQa0ytJ6mNRGz/Q=="],
|
||||
@@ -406,6 +414,8 @@
|
||||
|
||||
"bare-url": ["bare-url@2.4.0", "", { "dependencies": { "bare-path": "^3.0.0" } }, "sha512-NSTU5WN+fy/L0DDenfE8SXQna4voXuW0FHM7wH8i3/q9khUSchfPbPezO4zSFMnDGIf9YE+mt/RWhZgNRKRIXA=="],
|
||||
|
||||
"base64-arraybuffer": ["base64-arraybuffer@1.0.2", "", {}, "sha512-I3yl4r9QB5ZRY3XuJVEPfc2XhZO6YweFPI+UovAzn+8/hb3oJ6lnysaFcjVpkCPfVWFUDvoZ8kmVDP7WyRtYtQ=="],
|
||||
|
||||
"baseline-browser-mapping": ["baseline-browser-mapping@2.10.12", "", { "bin": { "baseline-browser-mapping": "dist/cli.cjs" } }, "sha512-qyq26DxfY4awP2gIRXhhLWfwzwI+N5Nxk6iQi8EFizIaWIjqicQTE4sLnZZVdeKPRcVNoJOkkpfzoIYuvCKaIQ=="],
|
||||
|
||||
"basic-ftp": ["basic-ftp@5.2.0", "", {}, "sha512-VoMINM2rqJwJgfdHq6RiUudKt2BV+FY5ZFezP/ypmwayk68+NzzAQy4XXLlqsGD4MCzq3DrmNFD/uUmBJuGoXw=="],
|
||||
@@ -438,6 +448,8 @@
|
||||
|
||||
"caniuse-lite": ["caniuse-lite@1.0.30001782", "", {}, "sha512-dZcaJLJeDMh4rELYFw1tvSn1bhZWYFOt468FcbHHxx/Z/dFidd1I6ciyFdi3iwfQCyOjqo9upF6lGQYtMiJWxw=="],
|
||||
|
||||
"canvg": ["canvg@3.0.11", "", { "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" } }, "sha512-5ON+q7jCTgMp9cjpu4Jo6XbvfYwSB2Ow3kzHKfIyJfaCAOHLbdKPQqGKgfED/R5B+3TFFfe8pegYA+b423SRyA=="],
|
||||
|
||||
"chalk": ["chalk@5.6.2", "", {}, "sha512-7NzBL0rN6fMUW+f7A6Io4h40qQlG+xGmtMxfbnH/K7TAtt8JQWVQK+6g0UXKMeVJoyV5EkkNsErQ8pVD3bLHbA=="],
|
||||
|
||||
"chokidar": ["chokidar@3.6.0", "", { "dependencies": { "anymatch": "~3.1.2", "braces": "~3.0.2", "glob-parent": "~5.1.2", "is-binary-path": "~2.1.0", "is-glob": "~4.0.1", "normalize-path": "~3.0.0", "readdirp": "~3.6.0" }, "optionalDependencies": { "fsevents": "~2.3.2" } }, "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw=="],
|
||||
@@ -472,10 +484,14 @@
|
||||
|
||||
"cookie-signature": ["cookie-signature@1.2.2", "", {}, "sha512-D76uU73ulSXrD1UXF4KE2TMxVVwhsnCgfAyTg9k8P6KGZjlXKrOLe4dJQKI3Bxi5wjesZoFXJWElNWBjPZMbhg=="],
|
||||
|
||||
"core-js": ["core-js@3.49.0", "", {}, "sha512-es1U2+YTtzpwkxVLwAFdSpaIMyQaq0PBgm3YD1W3Qpsn1NAmO3KSgZfu+oGSWVu6NvLHoHCV/aYcsE5wiB7ALg=="],
|
||||
|
||||
"cors": ["cors@2.8.6", "", { "dependencies": { "object-assign": "^4", "vary": "^1" } }, "sha512-tJtZBBHA6vjIAaF6EnIaq6laBBP9aq/Y3ouVJjEfoHbRBcHBAHYcMh/w8LDrk2PvIMMq8gmopa5D4V8RmbrxGw=="],
|
||||
|
||||
"cross-spawn": ["cross-spawn@7.0.6", "", { "dependencies": { "path-key": "^3.1.0", "shebang-command": "^2.0.0", "which": "^2.0.1" } }, "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA=="],
|
||||
|
||||
"css-line-break": ["css-line-break@2.1.0", "", { "dependencies": { "utrie": "^1.0.2" } }, "sha512-FHcKFCZcAha3LwfVBhCQbW2nCNbkZXn7KVUJcsT5/P8YmfsVja0FMPJr0B903j/E69HUphKiV9iQArX8SDYA4w=="],
|
||||
|
||||
"cssesc": ["cssesc@3.0.0", "", { "bin": { "cssesc": "bin/cssesc" } }, "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg=="],
|
||||
|
||||
"csstype": ["csstype@3.2.3", "", {}, "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ=="],
|
||||
@@ -544,6 +560,8 @@
|
||||
|
||||
"dom-helpers": ["dom-helpers@5.2.1", "", { "dependencies": { "@babel/runtime": "^7.8.7", "csstype": "^3.0.2" } }, "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA=="],
|
||||
|
||||
"dompurify": ["dompurify@3.4.7", "", { "optionalDependencies": { "@types/trusted-types": "^2.0.7" } }, "sha512-2jBxDJY4RR06tQNy4w5FlFH7kfxsQZlufd0sbv+chfHCxeJwrFw2baUDsSwvBISD4K4RDbd0PTfy3uNXsR6siA=="],
|
||||
|
||||
"dotenv": ["dotenv@16.6.1", "", {}, "sha512-uBq4egWHTcTt33a72vpSG0z3HnPuIl6NqYcTrKEg2azoEyl2hpW0zqlxysq2pK9HlDIHyHyakeYaYnSAwd8bow=="],
|
||||
|
||||
"dunder-proto": ["dunder-proto@1.0.1", "", { "dependencies": { "call-bind-apply-helpers": "^1.0.1", "es-errors": "^1.3.0", "gopd": "^1.2.0" } }, "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A=="],
|
||||
@@ -616,6 +634,8 @@
|
||||
|
||||
"fast-fifo": ["fast-fifo@1.3.2", "", {}, "sha512-/d9sfos4yxzpwkDkuN7k2SqFKtYNmCTzgfEpz82x34IM9/zc8KGxQoXg1liNC/izpRM/MBdt44Nmx41ZWqk+FQ=="],
|
||||
|
||||
"fast-png": ["fast-png@6.4.0", "", { "dependencies": { "@types/pako": "^2.0.3", "iobuffer": "^5.3.2", "pako": "^2.1.0" } }, "sha512-kAqZq1TlgBjZcLr5mcN6NP5Rv4V2f22z00c3g8vRrwkcqjerx7BEhPbOnWCPqaHUl2XWQBJQvOT/FQhdMT7X/Q=="],
|
||||
|
||||
"fast-uri": ["fast-uri@3.1.0", "", {}, "sha512-iPeeDKJSWf4IEOasVVrknXpaBV0IApz/gp7S2bb7Z4Lljbl2MGJRqInZiUrQwV16cpzw/D3S5j5Julj/gT52AA=="],
|
||||
|
||||
"fast-xml-builder": ["fast-xml-builder@1.1.5", "", { "dependencies": { "path-expression-matcher": "^1.1.3" } }, "sha512-4TJn/8FKLeslLAH3dnohXqE3QSoxkhvaMzepOIZytwJXZO69Bfz0HBdDHzOTOon6G59Zrk6VQ2bEiv1t61rfkA=="],
|
||||
@@ -626,6 +646,8 @@
|
||||
|
||||
"fdir": ["fdir@6.5.0", "", { "peerDependencies": { "picomatch": "^3 || ^4" }, "optionalPeers": ["picomatch"] }, "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg=="],
|
||||
|
||||
"fflate": ["fflate@0.8.3", "", {}, "sha512-tbZNuJrLwGUp3zshBtdy4W+ORxZuIh8a5ilyIEQDC5rY1f3U20JMry0Ll3WBzU58EZKsEuJFXhb5gwv8CsPvgA=="],
|
||||
|
||||
"file-type": ["file-type@22.0.0", "", { "dependencies": { "@tokenizer/inflate": "^0.4.1", "strtok3": "^10.3.5", "token-types": "^6.1.2", "uint8array-extras": "^1.5.0" } }, "sha512-cmBmnYo8Zymabm2+qAP7jTFbKF10bQpYmxoGfuZbRFRcq00BRddJdGNH/P7GA1EMpJy5yQbqa9B7yROb3z8Ziw=="],
|
||||
|
||||
"fill-range": ["fill-range@7.1.1", "", { "dependencies": { "to-regex-range": "^5.0.1" } }, "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg=="],
|
||||
@@ -674,6 +696,8 @@
|
||||
|
||||
"hookable": ["hookable@5.5.3", "", {}, "sha512-Yc+BQe8SvoXH1643Qez1zqLRmbA5rCL+sSmk6TVos0LWVfNIB7PGncdlId77WzLGSIB5KaWgTaNTs2lNVEI6VQ=="],
|
||||
|
||||
"html2canvas": ["html2canvas@1.4.1", "", { "dependencies": { "css-line-break": "^2.1.0", "text-segmentation": "^1.0.3" } }, "sha512-fPU6BHNpsyIhr8yyMpTLLxAbkaK8ArIBcmZIRiBLiDhjeqvXolaEmDGmELFuX9I4xDcaKKcJl+TKZLqruBbmWA=="],
|
||||
|
||||
"http-errors": ["http-errors@2.0.1", "", { "dependencies": { "depd": "~2.0.0", "inherits": "~2.0.4", "setprototypeof": "~1.2.0", "statuses": "~2.0.2", "toidentifier": "~1.0.1" } }, "sha512-4FbRdAX+bSdmo4AUFuS0WNiPz8NgFt+r8ThgNWmlrjQjt1Q7ZR9+zTlce2859x4KSXrwIsaeTqDoKQmtP8pLmQ=="],
|
||||
|
||||
"http-proxy-agent": ["http-proxy-agent@7.0.2", "", { "dependencies": { "agent-base": "^7.1.0", "debug": "^4.3.4" } }, "sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig=="],
|
||||
@@ -690,6 +714,8 @@
|
||||
|
||||
"internmap": ["internmap@2.0.3", "", {}, "sha512-5Hh7Y1wQbvY5ooGgPbDaL5iYLAPzMTUrjMulskHLH6wnv/A+1q5rgEaiuqEjB+oxGXIVZs1FF+R/KPN3ZSQYYg=="],
|
||||
|
||||
"iobuffer": ["iobuffer@5.4.0", "", {}, "sha512-DRebOWuqDvxunfkNJAlc3IzWIPD5xVxwUNbHr7xKB8E6aLJxIPfNX3CoMJghcFjpv6RWQsrcJbghtEwSPoJqMA=="],
|
||||
|
||||
"ip-address": ["ip-address@10.1.0", "", {}, "sha512-XXADHxXmvT9+CRxhXg56LJovE+bmWnEWB78LB83VZTprKTmaC5QfruXocxzTZ2Kl0DNwKuBdlIhjL8LeY8Sf8Q=="],
|
||||
|
||||
"ipaddr.js": ["ipaddr.js@2.3.0", "", {}, "sha512-Zv/pA+ciVFbCSBBjGfaKUya/CcGmUHzTydLMaTwrUUEM2DIEO3iZvueGxmacvmN50fGpGVKeTXpb2LcYQxeVdg=="],
|
||||
@@ -724,6 +750,8 @@
|
||||
|
||||
"json5": ["json5@2.2.3", "", { "bin": { "json5": "lib/cli.js" } }, "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg=="],
|
||||
|
||||
"jspdf": ["jspdf@4.2.1", "", { "dependencies": { "@babel/runtime": "^7.28.6", "fast-png": "^6.2.0", "fflate": "^0.8.1" }, "optionalDependencies": { "canvg": "^3.0.11", "core-js": "^3.6.0", "dompurify": "^3.3.1", "html2canvas": "^1.0.0-rc.5" } }, "sha512-YyAXyvnmjTbR4bHQRLzex3CuINCDlQnBqoSYyjJwTP2x9jDLuKDzy7aKUl0hgx3uhcl7xzg32agn5vlie6HIlQ=="],
|
||||
|
||||
"lightningcss": ["lightningcss@1.32.0", "", { "dependencies": { "detect-libc": "^2.0.3" }, "optionalDependencies": { "lightningcss-android-arm64": "1.32.0", "lightningcss-darwin-arm64": "1.32.0", "lightningcss-darwin-x64": "1.32.0", "lightningcss-freebsd-x64": "1.32.0", "lightningcss-linux-arm-gnueabihf": "1.32.0", "lightningcss-linux-arm64-gnu": "1.32.0", "lightningcss-linux-arm64-musl": "1.32.0", "lightningcss-linux-x64-gnu": "1.32.0", "lightningcss-linux-x64-musl": "1.32.0", "lightningcss-win32-arm64-msvc": "1.32.0", "lightningcss-win32-x64-msvc": "1.32.0" } }, "sha512-NXYBzinNrblfraPGyrbPoD19C1h9lfI/1mzgWYvXUTe414Gz/X1FD2XBZSZM7rRTrMA8JL3OtAaGifrIKhQ5yQ=="],
|
||||
|
||||
"lightningcss-android-arm64": ["lightningcss-android-arm64@1.32.0", "", { "os": "android", "cpu": "arm64" }, "sha512-YK7/ClTt4kAK0vo6w3X+Pnm0D2cf2vPHbhOXdoNti1Ga0al1P4TBZhwjATvjNwLEBCnKvjJc2jQgHXH0NEwlAg=="],
|
||||
@@ -802,6 +830,8 @@
|
||||
|
||||
"pac-resolver": ["pac-resolver@7.0.1", "", { "dependencies": { "degenerator": "^5.0.0", "netmask": "^2.0.2" } }, "sha512-5NPgf87AT2STgwa2ntRMr45jTKrYBGkVU36yT0ig/n/GMAa3oPqhZfIQ2kMEimReg0+t9kZViDVZ83qfVUlckg=="],
|
||||
|
||||
"pako": ["pako@2.1.0", "", {}, "sha512-w+eufiZ1WuJYgPXbV/PO3NCMEc3xqylkKHzp8bxp1uW4qaSNQUkwmLLEc3kKsfz8lpV1F8Ht3U1Cm+9Srog2ug=="],
|
||||
|
||||
"parseurl": ["parseurl@1.3.3", "", {}, "sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ=="],
|
||||
|
||||
"path-expression-matcher": ["path-expression-matcher@1.5.0", "", {}, "sha512-cbrerZV+6rvdQrrD+iGMcZFEiiSrbv9Tfdkvnusy6y0x0GKBXREFg/Y65GhIfm0tnLntThhzCnfKwp1WRjeCyQ=="],
|
||||
@@ -816,6 +846,8 @@
|
||||
|
||||
"perfect-debounce": ["perfect-debounce@1.0.0", "", {}, "sha512-xCy9V055GLEqoFaHoC1SoLIaLmWctgCUaBaWxDZ7/Zx4CTyX7cJQLJOok/orfjZAh9kEYpjJa4d0KcJmCbctZA=="],
|
||||
|
||||
"performance-now": ["performance-now@2.1.0", "", {}, "sha512-7EAHlyLHI56VEIdK57uwHdHKIaAGbnXPiw0yWbarQZOKaKpvUIgW0jWRVLiatnM+XXlSwsanIBH/hzGMJulMow=="],
|
||||
|
||||
"picocolors": ["picocolors@1.1.1", "", {}, "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA=="],
|
||||
|
||||
"picomatch": ["picomatch@4.0.4", "", {}, "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A=="],
|
||||
@@ -866,6 +898,8 @@
|
||||
|
||||
"query-string": ["query-string@7.1.3", "", { "dependencies": { "decode-uri-component": "^0.2.2", "filter-obj": "^1.1.0", "split-on-first": "^1.0.0", "strict-uri-encode": "^2.0.0" } }, "sha512-hh2WYhq4fi8+b+/2Kg9CEge4fDPvHS534aOOvOZeQ3+Vf2mCFsaFBYj0i+iXcAq6I9Vzp5fjMFBlONvayDC1qg=="],
|
||||
|
||||
"raf": ["raf@3.4.1", "", { "dependencies": { "performance-now": "^2.1.0" } }, "sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA=="],
|
||||
|
||||
"range-parser": ["range-parser@1.2.1", "", {}, "sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg=="],
|
||||
|
||||
"raw-body": ["raw-body@3.0.2", "", { "dependencies": { "bytes": "~3.1.2", "http-errors": "~2.0.1", "iconv-lite": "~0.7.0", "unpipe": "~1.0.0" } }, "sha512-K5zQjDllxWkf7Z5xJdV0/B0WTNqx6vxG70zJE4N0kBs4LovmEYWJzQGxC9bS9RAKu3bgM40lrd5zoLJ12MQ5BA=="],
|
||||
@@ -906,6 +940,8 @@
|
||||
|
||||
"redux-thunk": ["redux-thunk@3.1.0", "", { "peerDependencies": { "redux": "^5.0.0" } }, "sha512-NW2r5T6ksUKXCabzhL9z+h206HQw/NJkcLm1GPImRQ8IzfXwRGqjVhKJGauHirT0DAuyy6hjdnMZaRoAcy0Klw=="],
|
||||
|
||||
"regenerator-runtime": ["regenerator-runtime@0.13.11", "", {}, "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg=="],
|
||||
|
||||
"require-directory": ["require-directory@2.1.1", "", {}, "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q=="],
|
||||
|
||||
"require-from-string": ["require-from-string@2.0.2", "", {}, "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw=="],
|
||||
@@ -914,6 +950,8 @@
|
||||
|
||||
"resolve-pkg-maps": ["resolve-pkg-maps@1.0.0", "", {}, "sha512-seS2Tj26TBVOC2NIc2rOe2y2ZO7efxITtLZcGSOnHHNOQ7CkiUBfw0Iw2ck6xkIhPwLhKNLS8BO+hEpngQlqzw=="],
|
||||
|
||||
"rgbcolor": ["rgbcolor@1.0.1", "", {}, "sha512-9aZLIrhRaD97sgVhtJOW6ckOEh6/GnvQtdVNfdZ6s67+3/XwLS9lBcQYzEEhYVeUowN7pRzMLsyGhK2i/xvWbw=="],
|
||||
|
||||
"rolldown": ["rolldown@1.0.0-rc.12", "", { "dependencies": { "@oxc-project/types": "=0.122.0", "@rolldown/pluginutils": "1.0.0-rc.12" }, "optionalDependencies": { "@rolldown/binding-android-arm64": "1.0.0-rc.12", "@rolldown/binding-darwin-arm64": "1.0.0-rc.12", "@rolldown/binding-darwin-x64": "1.0.0-rc.12", "@rolldown/binding-freebsd-x64": "1.0.0-rc.12", "@rolldown/binding-linux-arm-gnueabihf": "1.0.0-rc.12", "@rolldown/binding-linux-arm64-gnu": "1.0.0-rc.12", "@rolldown/binding-linux-arm64-musl": "1.0.0-rc.12", "@rolldown/binding-linux-ppc64-gnu": "1.0.0-rc.12", "@rolldown/binding-linux-s390x-gnu": "1.0.0-rc.12", "@rolldown/binding-linux-x64-gnu": "1.0.0-rc.12", "@rolldown/binding-linux-x64-musl": "1.0.0-rc.12", "@rolldown/binding-openharmony-arm64": "1.0.0-rc.12", "@rolldown/binding-wasm32-wasi": "1.0.0-rc.12", "@rolldown/binding-win32-arm64-msvc": "1.0.0-rc.12", "@rolldown/binding-win32-x64-msvc": "1.0.0-rc.12" }, "bin": { "rolldown": "bin/cli.mjs" } }, "sha512-yP4USLIMYrwpPHEFB5JGH1uxhcslv6/hL0OyvTuY+3qlOSJvZ7ntYnoWpehBxufkgN0cvXxppuTu5hHa/zPh+A=="],
|
||||
|
||||
"router": ["router@2.2.0", "", { "dependencies": { "debug": "^4.4.0", "depd": "^2.0.0", "is-promise": "^4.0.0", "parseurl": "^1.3.3", "path-to-regexp": "^8.0.0" } }, "sha512-nLTrUKm2UyiL7rlhapu/Zl45FwNgkZGaCpZbIHajDYgwlJCOzLSk+cIPAnsEqV955GjILJnKbdQC1nVPz+gAYQ=="],
|
||||
@@ -962,6 +1000,8 @@
|
||||
|
||||
"split-on-first": ["split-on-first@1.1.0", "", {}, "sha512-43ZssAJaMusuKWL8sKUBQXHWOpq8d6CfN/u1p4gUzfJkM05C8rxTmYrkIPTXapZpORA6LkkzcUulJ8FqA7Uudw=="],
|
||||
|
||||
"stackblur-canvas": ["stackblur-canvas@2.7.0", "", {}, "sha512-yf7OENo23AGJhBriGx0QivY5JP6Y1HbrrDI6WLt6C5auYZXlQrheoY8hD4ibekFKz1HOfE48Ww8kMWMnJD/zcQ=="],
|
||||
|
||||
"statuses": ["statuses@2.0.2", "", {}, "sha512-DvEy55V3DB7uknRo+4iOGT5fP1slR8wQohVdknigZPMpMstaKJQWhwiYBACJE3Ul2pTnATihhBYnRhZQHGBiRw=="],
|
||||
|
||||
"stream-chain": ["stream-chain@2.2.5", "", {}, "sha512-1TJmBx6aSWqZ4tx7aTpBDXK0/e2hhcNSTV8+CbFJtDjbb+I1mZ8lHit0Grw9GRT+6JbIrrDd8esncgBi8aBXGA=="],
|
||||
@@ -984,6 +1024,8 @@
|
||||
|
||||
"sugarss": ["sugarss@5.0.1", "", { "peerDependencies": { "postcss": "^8.3.3" } }, "sha512-ctS5RYCBVvPoZAnzIaX5QSShK8ZiZxD5HUqSxlusvEMC+QZQIPCPOIJg6aceFX+K2rf4+SH89eu++h1Zmsr2nw=="],
|
||||
|
||||
"svg-pathdata": ["svg-pathdata@6.0.3", "", {}, "sha512-qsjeeq5YjBZ5eMdFuUa4ZosMLxgr5RZ+F+Y1OrDhuOCEInRMA3x74XdBtggJcj9kOeInz0WE+LgCPDkZFlBYJw=="],
|
||||
|
||||
"swr": ["swr@2.4.1", "", { "dependencies": { "dequal": "^2.0.3", "use-sync-external-store": "^1.6.0" }, "peerDependencies": { "react": "^16.11.0 || ^17.0.0 || ^18.0.0 || ^19.0.0" } }, "sha512-2CC6CiKQtEwaEeNiqWTAw9PGykW8SR5zZX8MZk6TeAvEAnVS7Visz8WzphqgtQ8v2xz/4Q5K+j+SeMaKXeeQIA=="],
|
||||
|
||||
"tabbable": ["tabbable@6.4.0", "", {}, "sha512-05PUHKSNE8ou2dwIxTngl4EzcnsCDZGJ/iCLtDflR/SHB/ny14rXc+qU5P4mG9JkusiV7EivzY9Mhm55AzAvCg=="],
|
||||
@@ -996,6 +1038,8 @@
|
||||
|
||||
"text-decoder": ["text-decoder@1.2.7", "", { "dependencies": { "b4a": "^1.6.4" } }, "sha512-vlLytXkeP4xvEq2otHeJfSQIRyWxo/oZGEbXrtEEF9Hnmrdly59sUbzZ/QgyWuLYHctCHxFF4tRQZNQ9k60ExQ=="],
|
||||
|
||||
"text-segmentation": ["text-segmentation@1.0.3", "", { "dependencies": { "utrie": "^1.0.2" } }, "sha512-iOiPUo/BGnZ6+54OsWxZidGCsdU8YbE4PSpdPinp7DeMtUJNJBoJ/ouUSTJjHkh1KntHaltHl/gDs2FC4i5+Nw=="],
|
||||
|
||||
"through2": ["through2@4.0.2", "", { "dependencies": { "readable-stream": "3" } }, "sha512-iOqSav00cVxEEICeD7TjLB1sueEL+81Wpzp2bY17uZjZN0pWZPuo4suZ/61VujxmqSGFfgOcNuTZ85QJwNZQpw=="],
|
||||
|
||||
"tiny-invariant": ["tiny-invariant@1.3.3", "", {}, "sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg=="],
|
||||
@@ -1046,6 +1090,8 @@
|
||||
|
||||
"util-deprecate": ["util-deprecate@1.0.2", "", {}, "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw=="],
|
||||
|
||||
"utrie": ["utrie@1.0.2", "", { "dependencies": { "base64-arraybuffer": "^1.0.2" } }, "sha512-1MLa5ouZiOmQzUbjbu9VmjLzn1QLXBhwpUa7kdLUQK+KQ5KA9I1vk5U4YHe/X2Ch7PYnJfWuWT+VbuxbGwljhw=="],
|
||||
|
||||
"vary": ["vary@1.1.2", "", {}, "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg=="],
|
||||
|
||||
"victory-vendor": ["victory-vendor@37.3.6", "", { "dependencies": { "@types/d3-array": "^3.0.3", "@types/d3-ease": "^3.0.0", "@types/d3-interpolate": "^3.0.1", "@types/d3-scale": "^4.0.2", "@types/d3-shape": "^3.1.0", "@types/d3-time": "^3.0.0", "@types/d3-timer": "^3.0.0", "d3-array": "^3.1.6", "d3-ease": "^3.0.1", "d3-interpolate": "^3.0.1", "d3-scale": "^4.0.2", "d3-shape": "^3.1.0", "d3-time": "^3.0.0", "d3-timer": "^3.0.1" } }, "sha512-SbPDPdDBYp+5MJHhBCAyI7wKM3d5ivekigc2Dk2s7pgbZ9wIgIBYGVw4zGHBml/qTFbexrofXW6Gu4noGxrOwQ=="],
|
||||
|
||||
@@ -41,6 +41,8 @@
|
||||
"dayjs": "^1.11.20",
|
||||
"elkjs": "^0.9.3",
|
||||
"elysia": "^1.4.28",
|
||||
"html2canvas": "^1.4.1",
|
||||
"jspdf": "^4.2.1",
|
||||
"minio": "^8.0.7",
|
||||
"postcss": "^8.5.8",
|
||||
"postcss-preset-mantine": "^1.18.0",
|
||||
|
||||
@@ -89,6 +89,8 @@ export const API_URLS = {
|
||||
if (dateTo) params.set('dateTo', dateTo)
|
||||
return `${DESA_PLUS_PROXY}/api/monitoring/export-logs?${params}`
|
||||
},
|
||||
getVillageReport: (range: 7 | 30 | 90 = 7) =>
|
||||
`${DESA_PLUS_PROXY}/api/monitoring/village-report?range=${range}`,
|
||||
exportUsers: (search: string, isActive?: string, idUserRole?: string, idVillage?: string) => {
|
||||
const params = new URLSearchParams({ search })
|
||||
if (isActive) params.set('isActive', isActive)
|
||||
|
||||
@@ -32,6 +32,7 @@ import {
|
||||
TbBuildingCommunity,
|
||||
TbChevronDown,
|
||||
TbChevronUp,
|
||||
TbFileText,
|
||||
TbRefresh,
|
||||
TbVersions,
|
||||
} from 'react-icons/tb'
|
||||
@@ -52,6 +53,7 @@ function AppOverviewPage() {
|
||||
const { data: session } = useSession()
|
||||
const isDeveloper = session?.user?.role === 'DEVELOPER'
|
||||
const errorTableRef = useRef<ErrorDataTableHandle>(null)
|
||||
const [isExporting, setIsExporting] = useState(false)
|
||||
|
||||
const [latestVersion, setLatestVersion] = useState('')
|
||||
const [minVersion, setMinVersion] = useState('')
|
||||
@@ -130,6 +132,256 @@ function AppOverviewPage() {
|
||||
}
|
||||
}
|
||||
|
||||
const handleDownloadPDF = async () => {
|
||||
setIsExporting(true)
|
||||
try {
|
||||
const [reportRes, peakRes] = await Promise.all([
|
||||
fetch(API_URLS.getVillageReport(comparisonRange as 7 | 30 | 90)).then(r => r.json()),
|
||||
fetch(API_URLS.getPeakHours()).then(r => r.json()),
|
||||
])
|
||||
if (!reportRes.success) return
|
||||
|
||||
const { villages, generatedAt } = reportRes.data
|
||||
const peakHours: { hour: number; label: string; count: number }[] = peakRes?.data?.hours ?? []
|
||||
const peakHour: { label: string; count: number } | null = peakRes?.data?.peak ?? null
|
||||
const appName = isDesaPlus ? 'Desa+' : appId
|
||||
|
||||
// ── Aggregates ─────────────────────────────────────
|
||||
const totalActive = villages.filter((v: any) => v.isActive).length
|
||||
const totalInactive = villages.filter((v: any) => !v.isActive).length
|
||||
const totalStale = villages.filter((v: any) => v.activityCount === 0).length
|
||||
const totalActivity = villages.reduce((s: number, v: any) => s + v.activityCount, 0)
|
||||
const totalActiveUsers = villages.reduce((s: number, v: any) => s + v.activeUsers, 0)
|
||||
const totalInactiveUsers = villages.reduce((s: number, v: any) => s + v.inactiveUsers, 0)
|
||||
|
||||
const top5 = villages.slice(0, 5)
|
||||
const maxActivity = top5[0]?.activityCount || 1
|
||||
const needsAttention = villages.filter((v: any) => !v.isActive || v.activityCount === 0)
|
||||
|
||||
// ── Helpers ────────────────────────────────────────
|
||||
const trendBadge = (trend: number) => {
|
||||
if (trend > 0) return `<span style="color:#059669;font-weight:700">▲ +${trend}%</span>`
|
||||
if (trend < 0) return `<span style="color:#dc2626;font-weight:700">▼ ${trend}%</span>`
|
||||
return `<span style="color:#9ca3af">— 0%</span>`
|
||||
}
|
||||
const statusBadge = (active: boolean) =>
|
||||
`<span style="display:inline-block;padding:2px 8px;border-radius:12px;font-size:11px;font-weight:700;
|
||||
background:${active ? '#d1fae5' : '#fee2e2'};color:${active ? '#065f46' : '#991b1b'}">
|
||||
${active ? 'Active' : 'Inactive'}</span>`
|
||||
const lastActivityCell = (v: any) => v.lastActivity
|
||||
? `${v.lastActivity}<br><span style="color:${v.daysSince > 30 ? '#dc2626' : v.daysSince > 7 ? '#d97706' : '#059669'}">${v.daysSince}d ago</span>`
|
||||
: '<span style="color:#999">No activity</span>'
|
||||
|
||||
// ── Section: Top 5 ────────────────────────────────
|
||||
const top5Rows = top5.map((v: any, i: number) => `
|
||||
<tr style="background:${i % 2 === 0 ? '#fff' : '#f9fafb'}">
|
||||
<td style="text-align:center;font-weight:800;font-size:14px;color:${i === 0 ? '#d97706' : i === 1 ? '#6b7280' : i === 2 ? '#b45309' : '#374151'}">
|
||||
${i === 0 ? '🥇' : i === 1 ? '🥈' : i === 2 ? '🥉' : `#${i + 1}`}
|
||||
</td>
|
||||
<td><strong>${v.name}</strong></td>
|
||||
<td style="width:35%">
|
||||
<div style="background:#e5e7eb;border-radius:4px;height:10px;overflow:hidden">
|
||||
<div style="width:${Math.round((v.activityCount / maxActivity) * 100)}%;height:100%;background:${i === 0 ? '#d97706' : '#3b82f6'};border-radius:4px"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td style="text-align:right;font-weight:700">${v.activityCount.toLocaleString()}</td>
|
||||
<td style="text-align:center">${trendBadge(v.trend)}</td>
|
||||
</tr>`).join('')
|
||||
|
||||
// ── Section: Needs Attention ───────────────────────
|
||||
const attentionRows = needsAttention.length === 0
|
||||
? '<tr><td colspan="5" style="text-align:center;color:#9ca3af;padding:16px">All villages are active and have activity in this period.</td></tr>'
|
||||
: needsAttention.map((v: any, i: number) => `
|
||||
<tr style="background:${i % 2 === 0 ? '#fff' : '#f9fafb'}">
|
||||
<td>${v.name}</td>
|
||||
<td style="text-align:center">${statusBadge(v.isActive)}</td>
|
||||
<td style="text-align:center">${v.activeUsers + v.inactiveUsers}</td>
|
||||
<td style="text-align:center">
|
||||
${!v.isActive
|
||||
? '<span style="color:#dc2626;font-weight:700">Village inactive</span>'
|
||||
: '<span style="color:#d97706;font-weight:700">No activity in period</span>'}
|
||||
</td>
|
||||
<td style="text-align:center;font-size:11px">${lastActivityCell(v)}</td>
|
||||
</tr>`).join('')
|
||||
|
||||
// ── Section: All Villages ─────────────────────────
|
||||
const allRows = villages.map((v: any, i: number) => `
|
||||
<tr style="background:${i % 2 === 0 ? '#fff' : '#f9fafb'}">
|
||||
<td style="text-align:center;color:#9ca3af">${i + 1}</td>
|
||||
<td>
|
||||
<strong>${v.name}</strong>
|
||||
${v.perbekel !== '-' ? `<br><span style="font-size:10px;color:#9ca3af">Perbekel: ${v.perbekel}</span>` : ''}
|
||||
</td>
|
||||
<td style="text-align:center">${statusBadge(v.isActive)}</td>
|
||||
<td style="text-align:center">${v.activeUsers}</td>
|
||||
<td style="text-align:center">${v.inactiveUsers}</td>
|
||||
<td style="text-align:right;font-weight:700">${v.activityCount.toLocaleString()}</td>
|
||||
<td style="text-align:center">${trendBadge(v.trend)}</td>
|
||||
<td style="text-align:center;font-size:11px">${lastActivityCell(v)}</td>
|
||||
</tr>`).join('')
|
||||
|
||||
// ── Section: Peak Hours ───────────────────────────
|
||||
const peakMax = Math.max(...peakHours.map(h => h.count), 1)
|
||||
const peakRows = peakHours.filter(h => h.count > 0).map((h, i) => `
|
||||
<tr style="background:${i % 2 === 0 ? '#fff' : '#f9fafb'}">
|
||||
<td style="font-weight:700;width:80px">${h.label}</td>
|
||||
<td>
|
||||
<div style="background:#e5e7eb;border-radius:4px;height:8px;overflow:hidden">
|
||||
<div style="width:${Math.round((h.count / peakMax) * 100)}%;height:100%;background:#7c3aed;border-radius:4px"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td style="text-align:right;width:80px;font-weight:600">${h.count.toLocaleString()}</td>
|
||||
</tr>`).join('')
|
||||
|
||||
// ── Build HTML ────────────────────────────────────
|
||||
const html = `<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<title>${appName} — Village Report</title>
|
||||
<style>
|
||||
* { box-sizing: border-box; margin: 0; padding: 0; }
|
||||
body { font-family: Arial, sans-serif; color: #111; background: #fff; font-size: 12px; }
|
||||
.cover { background: linear-gradient(135deg, #1d4ed8, #7c3aed); color: white; padding: 36px 40px 28px; }
|
||||
.cover h1 { font-size: 26px; font-weight: 800; margin-bottom: 6px; }
|
||||
.cover p { font-size: 12px; opacity: 0.8; margin-top: 4px; }
|
||||
.summary { display: grid; grid-template-columns: repeat(6, 1fr); border-bottom: 2px solid #e5e7eb; }
|
||||
.summary-card { padding: 14px 16px; border-right: 1px solid #e5e7eb; }
|
||||
.summary-card:last-child { border-right: none; }
|
||||
.summary-card .label { font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #6b7280; margin-bottom: 4px; }
|
||||
.summary-card .value { font-size: 24px; font-weight: 800; }
|
||||
.summary-card .sub { font-size: 10px; color: #9ca3af; margin-top: 2px; }
|
||||
.section { padding: 20px 32px; border-bottom: 1px solid #f3f4f6; }
|
||||
.section h2 { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #6b7280; padding-bottom: 8px; border-bottom: 2px solid #e5e7eb; margin-bottom: 14px; }
|
||||
table { width: 100%; border-collapse: collapse; }
|
||||
th { font-size: 9px; font-weight: 700; text-transform: uppercase; color: #6b7280; padding: 7px 10px; border-bottom: 2px solid #e5e7eb; text-align: left; background: #f9fafb; }
|
||||
td { padding: 8px 10px; border-bottom: 1px solid #f3f4f6; vertical-align: middle; line-height: 1.4; }
|
||||
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
|
||||
.footer { padding: 14px 32px; border-top: 2px solid #e5e7eb; font-size: 10px; color: #9ca3af; text-align: center; }
|
||||
@media print { body { -webkit-print-color-adjust: exact; print-color-adjust: exact; } .section { page-break-inside: avoid; } }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="cover">
|
||||
<h1>${appName} — Village Monitoring Report</h1>
|
||||
<p>Generated: ${generatedAt}</p>
|
||||
<p>Period: last ${comparisonRange} days · Compared to previous ${comparisonRange} days</p>
|
||||
</div>
|
||||
|
||||
<div class="summary">
|
||||
<div class="summary-card">
|
||||
<div class="label">Active Villages</div>
|
||||
<div class="value" style="color:#059669">${totalActive}</div>
|
||||
<div class="sub">of ${villages.length} total</div>
|
||||
</div>
|
||||
<div class="summary-card">
|
||||
<div class="label">Inactive Villages</div>
|
||||
<div class="value" style="color:#dc2626">${totalInactive}</div>
|
||||
<div class="sub">not operational</div>
|
||||
</div>
|
||||
<div class="summary-card">
|
||||
<div class="label">No Activity</div>
|
||||
<div class="value" style="color:#d97706">${totalStale}</div>
|
||||
<div class="sub">in this period</div>
|
||||
</div>
|
||||
<div class="summary-card">
|
||||
<div class="label">Total Activity</div>
|
||||
<div class="value">${totalActivity.toLocaleString()}</div>
|
||||
<div class="sub">last ${comparisonRange} days</div>
|
||||
</div>
|
||||
<div class="summary-card">
|
||||
<div class="label">Active Users</div>
|
||||
<div class="value" style="color:#0891b2">${totalActiveUsers.toLocaleString()}</div>
|
||||
<div class="sub">across all villages</div>
|
||||
</div>
|
||||
<div class="summary-card">
|
||||
<div class="label">Inactive Users</div>
|
||||
<div class="value" style="color:#6b7280">${totalInactiveUsers.toLocaleString()}</div>
|
||||
<div class="sub">across all villages</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section">
|
||||
<div class="two-col">
|
||||
<div>
|
||||
<h2>Top 5 Most Active Villages</h2>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="width:6%">#</th>
|
||||
<th>Village</th>
|
||||
<th style="width:30%">Activity</th>
|
||||
<th style="text-align:right;width:10%">Count</th>
|
||||
<th style="text-align:center;width:14%">vs Prev</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>${top5Rows}</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Peak Activity Hours</h2>
|
||||
${peakHour ? `<p style="font-size:11px;color:#6b7280;margin-bottom:10px">Busiest hour: <strong>${peakHour.label}</strong> (${peakHour.count.toLocaleString()} activities)</p>` : ''}
|
||||
<table>
|
||||
<thead><tr><th>Hour</th><th>Distribution</th><th style="text-align:right">Count</th></tr></thead>
|
||||
<tbody>${peakRows || '<tr><td colspan="3" style="text-align:center;color:#9ca3af">No data</td></tr>'}</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section">
|
||||
<h2>Villages Needing Attention (${needsAttention.length})</h2>
|
||||
${needsAttention.length === 0
|
||||
? '<p style="color:#9ca3af;font-size:11px">All villages are active and have activity in this period.</p>'
|
||||
: `<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Village</th>
|
||||
<th style="text-align:center">Status</th>
|
||||
<th style="text-align:center">Total Users</th>
|
||||
<th>Reason</th>
|
||||
<th style="text-align:center">Last Activity</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>${attentionRows}</tbody>
|
||||
</table>`}
|
||||
</div>
|
||||
|
||||
<div class="section">
|
||||
<h2>All Villages — ${villages.length} Villages</h2>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="width:3%;text-align:center">#</th>
|
||||
<th style="width:22%">Village / Perbekel</th>
|
||||
<th style="width:9%;text-align:center">Status</th>
|
||||
<th style="width:8%;text-align:center">Active Users</th>
|
||||
<th style="width:8%;text-align:center">Inactive Users</th>
|
||||
<th style="width:10%;text-align:right">Activity (${comparisonRange}D)</th>
|
||||
<th style="width:10%;text-align:center">vs Prev Period</th>
|
||||
<th style="width:18%;text-align:center">Last Activity</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>${allRows}</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="footer">
|
||||
${appName} Monitoring System · ${generatedAt} · ${villages.length} villages · Period: last ${comparisonRange} days
|
||||
</div>
|
||||
|
||||
<script>window.onload = () => window.print()<\/script>
|
||||
</body>
|
||||
</html>`
|
||||
|
||||
const win = window.open('', '_blank')
|
||||
if (win) { win.document.write(html); win.document.close() }
|
||||
} finally {
|
||||
setIsExporting(false)
|
||||
}
|
||||
}
|
||||
|
||||
const maintenanceOn = grid?.version?.mobile_maintenance === 'true'
|
||||
|
||||
return (
|
||||
@@ -189,18 +441,34 @@ function AppOverviewPage() {
|
||||
Real-time metrics and activity for {isDesaPlus ? 'Desa+' : appId}.
|
||||
</Text>
|
||||
</Stack>
|
||||
<Tooltip label="Refresh data" withArrow>
|
||||
<ActionIcon
|
||||
variant="light"
|
||||
color="brand-blue"
|
||||
size="lg"
|
||||
radius="md"
|
||||
onClick={handleRefresh}
|
||||
loading={gridLoading || dailyLoading || comparisonLoading}
|
||||
>
|
||||
<TbRefresh size={18} />
|
||||
</ActionIcon>
|
||||
</Tooltip>
|
||||
<Group gap="xs">
|
||||
{isDesaPlus && (
|
||||
<Button
|
||||
variant="light"
|
||||
color="gray"
|
||||
size="sm"
|
||||
radius="md"
|
||||
leftSection={<TbFileText size={16} />}
|
||||
onClick={handleDownloadPDF}
|
||||
loading={isExporting}
|
||||
disabled={gridLoading || !grid}
|
||||
>
|
||||
Download PDF
|
||||
</Button>
|
||||
)}
|
||||
<Tooltip label="Refresh data" withArrow>
|
||||
<ActionIcon
|
||||
variant="light"
|
||||
color="brand-blue"
|
||||
size="lg"
|
||||
radius="md"
|
||||
onClick={handleRefresh}
|
||||
loading={gridLoading || dailyLoading || comparisonLoading}
|
||||
>
|
||||
<TbRefresh size={18} />
|
||||
</ActionIcon>
|
||||
</Tooltip>
|
||||
</Group>
|
||||
</Group>
|
||||
|
||||
<SimpleGrid cols={{ base: 1, sm: 2, lg: 4 }} spacing="lg">
|
||||
@@ -325,7 +593,6 @@ function AppOverviewPage() {
|
||||
<VillageActivityLineChart data={dailyData} isLoading={dailyLoading} range={dailyRange} onRangeChange={setDailyRange} />
|
||||
<VillageComparisonBarChart data={comparisonData} isLoading={comparisonLoading} range={comparisonRange} onRangeChange={setComparisonRange} />
|
||||
</SimpleGrid>
|
||||
|
||||
<ErrorDataTable ref={errorTableRef} appId={appId} />
|
||||
</Stack>
|
||||
</>
|
||||
|
||||
Reference in New Issue
Block a user