updates on the orderdetails page and implemented the download option
This commit is contained in:
241
package-lock.json
generated
241
package-lock.json
generated
@@ -29,6 +29,8 @@
|
|||||||
"clsx": "^2.1.1",
|
"clsx": "^2.1.1",
|
||||||
"dayjs": "^1.11.23",
|
"dayjs": "^1.11.23",
|
||||||
"framer-motion": "^11.16.4",
|
"framer-motion": "^11.16.4",
|
||||||
|
"jspdf": "^4.2.1",
|
||||||
|
"jspdf-autotable": "^5.0.8",
|
||||||
"leaflet": "^1.9.4",
|
"leaflet": "^1.9.4",
|
||||||
"lucide-react": "^0.475.0",
|
"lucide-react": "^0.475.0",
|
||||||
"papaparse": "^5.6.0",
|
"papaparse": "^5.6.0",
|
||||||
@@ -1983,7 +1985,6 @@
|
|||||||
"version": "7.29.7",
|
"version": "7.29.7",
|
||||||
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.29.7.tgz",
|
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.29.7.tgz",
|
||||||
"integrity": "sha512-Nq8OhGWiZIZGV6hLHoyAKLLcJihP/xFeBMGJoUrxTX2psI8dCifzLhZISFb+VWS3wFMRDmCGw5R+dOySCqPLhw==",
|
"integrity": "sha512-Nq8OhGWiZIZGV6hLHoyAKLLcJihP/xFeBMGJoUrxTX2psI8dCifzLhZISFb+VWS3wFMRDmCGw5R+dOySCqPLhw==",
|
||||||
"dev": true,
|
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"engines": {
|
"engines": {
|
||||||
"node": ">=6.9.0"
|
"node": ">=6.9.0"
|
||||||
@@ -5027,6 +5028,19 @@
|
|||||||
"undici-types": "~6.21.0"
|
"undici-types": "~6.21.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/@types/pako": {
|
||||||
|
"version": "2.0.4",
|
||||||
|
"resolved": "https://registry.npmjs.org/@types/pako/-/pako-2.0.4.tgz",
|
||||||
|
"integrity": "sha512-VWDCbrLeVXJM9fihYodcLiIv0ku+AlOa/TQ1SvYOaBuyrSKgEcro95LJyIsJ4vSo6BXIxOKxiJAat04CmST9Fw==",
|
||||||
|
"license": "MIT"
|
||||||
|
},
|
||||||
|
"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/react": {
|
"node_modules/@types/react": {
|
||||||
"version": "19.2.18",
|
"version": "19.2.18",
|
||||||
"resolved": "https://registry.npmjs.org/@types/react/-/react-19.2.18.tgz",
|
"resolved": "https://registry.npmjs.org/@types/react/-/react-19.2.18.tgz",
|
||||||
@@ -5061,6 +5075,13 @@
|
|||||||
"dev": true,
|
"dev": true,
|
||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
|
"node_modules/@types/trusted-types": {
|
||||||
|
"version": "2.0.7",
|
||||||
|
"resolved": "https://registry.npmjs.org/@types/trusted-types/-/trusted-types-2.0.7.tgz",
|
||||||
|
"integrity": "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==",
|
||||||
|
"license": "MIT",
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
"node_modules/@types/use-sync-external-store": {
|
"node_modules/@types/use-sync-external-store": {
|
||||||
"version": "0.0.6",
|
"version": "0.0.6",
|
||||||
"resolved": "https://registry.npmjs.org/@types/use-sync-external-store/-/use-sync-external-store-0.0.6.tgz",
|
"resolved": "https://registry.npmjs.org/@types/use-sync-external-store/-/use-sync-external-store-0.0.6.tgz",
|
||||||
@@ -5661,6 +5682,16 @@
|
|||||||
"dev": true,
|
"dev": true,
|
||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
|
"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",
|
||||||
|
"optional": true,
|
||||||
|
"engines": {
|
||||||
|
"node": ">= 0.6.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/baseline-browser-mapping": {
|
"node_modules/baseline-browser-mapping": {
|
||||||
"version": "2.11.12",
|
"version": "2.11.12",
|
||||||
"resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.11.12.tgz",
|
"resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.11.12.tgz",
|
||||||
@@ -5859,6 +5890,26 @@
|
|||||||
],
|
],
|
||||||
"license": "CC-BY-4.0"
|
"license": "CC-BY-4.0"
|
||||||
},
|
},
|
||||||
|
"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/cfb": {
|
"node_modules/cfb": {
|
||||||
"version": "1.2.2",
|
"version": "1.2.2",
|
||||||
"resolved": "https://registry.npmjs.org/cfb/-/cfb-1.2.2.tgz",
|
"resolved": "https://registry.npmjs.org/cfb/-/cfb-1.2.2.tgz",
|
||||||
@@ -6076,6 +6127,21 @@
|
|||||||
"dev": true,
|
"dev": true,
|
||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
|
"node_modules/core-js": {
|
||||||
|
"version": "3.50.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/core-js/-/core-js-3.50.0.tgz",
|
||||||
|
"integrity": "sha512-BRWgOLKkFeCgRudR6zrs8p9XJZcE14grzKMMssoYrk6krtuEZ7MTKPIY5RzOnqsEKIR9kst7wNzphttraT+Yqw==",
|
||||||
|
"hasInstallScript": true,
|
||||||
|
"license": "MIT",
|
||||||
|
"optional": true,
|
||||||
|
"engines": {
|
||||||
|
"node": "*"
|
||||||
|
},
|
||||||
|
"funding": {
|
||||||
|
"type": "opencollective",
|
||||||
|
"url": "https://opencollective.com/core-js"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/core-js-compat": {
|
"node_modules/core-js-compat": {
|
||||||
"version": "3.50.0",
|
"version": "3.50.0",
|
||||||
"resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.50.0.tgz",
|
"resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.50.0.tgz",
|
||||||
@@ -6142,6 +6208,16 @@
|
|||||||
"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",
|
||||||
|
"optional": true,
|
||||||
|
"dependencies": {
|
||||||
|
"utrie": "^1.0.2"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/css-mediaquery": {
|
"node_modules/css-mediaquery": {
|
||||||
"version": "0.1.2",
|
"version": "0.1.2",
|
||||||
"resolved": "https://registry.npmjs.org/css-mediaquery/-/css-mediaquery-0.1.2.tgz",
|
"resolved": "https://registry.npmjs.org/css-mediaquery/-/css-mediaquery-0.1.2.tgz",
|
||||||
@@ -6586,6 +6662,16 @@
|
|||||||
"node": ">=12"
|
"node": ">=12"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/dompurify": {
|
||||||
|
"version": "3.4.15",
|
||||||
|
"resolved": "https://registry.npmjs.org/dompurify/-/dompurify-3.4.15.tgz",
|
||||||
|
"integrity": "sha512-EUBjM+B+lkDE41iE82DDSCfkoPGfXx8IxFxPMjNzm/Uk4xDet77rTN9wqlxlVg71kK7XGuUMv6wUxJUwwv+Xyw==",
|
||||||
|
"license": "(MPL-2.0 OR Apache-2.0)",
|
||||||
|
"optional": true,
|
||||||
|
"optionalDependencies": {
|
||||||
|
"@types/trusted-types": "^2.0.7"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/dunder-proto": {
|
"node_modules/dunder-proto": {
|
||||||
"version": "1.0.1",
|
"version": "1.0.1",
|
||||||
"resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
|
"resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
|
||||||
@@ -7278,6 +7364,17 @@
|
|||||||
"dev": true,
|
"dev": true,
|
||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
|
"node_modules/fast-png": {
|
||||||
|
"version": "6.4.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/fast-png/-/fast-png-6.4.0.tgz",
|
||||||
|
"integrity": "sha512-kAqZq1TlgBjZcLr5mcN6NP5Rv4V2f22z00c3g8vRrwkcqjerx7BEhPbOnWCPqaHUl2XWQBJQvOT/FQhdMT7X/Q==",
|
||||||
|
"license": "MIT",
|
||||||
|
"dependencies": {
|
||||||
|
"@types/pako": "^2.0.3",
|
||||||
|
"iobuffer": "^5.3.2",
|
||||||
|
"pako": "^2.1.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/fastq": {
|
"node_modules/fastq": {
|
||||||
"version": "1.20.1",
|
"version": "1.20.1",
|
||||||
"resolved": "https://registry.npmjs.org/fastq/-/fastq-1.20.1.tgz",
|
"resolved": "https://registry.npmjs.org/fastq/-/fastq-1.20.1.tgz",
|
||||||
@@ -7297,6 +7394,12 @@
|
|||||||
"bser": "2.1.1"
|
"bser": "2.1.1"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/fflate": {
|
||||||
|
"version": "0.8.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/fflate/-/fflate-0.8.3.tgz",
|
||||||
|
"integrity": "sha512-tbZNuJrLwGUp3zshBtdy4W+ORxZuIh8a5ilyIEQDC5rY1f3U20JMry0Ll3WBzU58EZKsEuJFXhb5gwv8CsPvgA==",
|
||||||
|
"license": "MIT"
|
||||||
|
},
|
||||||
"node_modules/file-entry-cache": {
|
"node_modules/file-entry-cache": {
|
||||||
"version": "8.0.0",
|
"version": "8.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-8.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-8.0.0.tgz",
|
||||||
@@ -7846,6 +7949,20 @@
|
|||||||
"dev": true,
|
"dev": true,
|
||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
|
"node_modules/html2canvas": {
|
||||||
|
"version": "1.4.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/html2canvas/-/html2canvas-1.4.1.tgz",
|
||||||
|
"integrity": "sha512-fPU6BHNpsyIhr8yyMpTLLxAbkaK8ArIBcmZIRiBLiDhjeqvXolaEmDGmELFuX9I4xDcaKKcJl+TKZLqruBbmWA==",
|
||||||
|
"license": "MIT",
|
||||||
|
"optional": true,
|
||||||
|
"dependencies": {
|
||||||
|
"css-line-break": "^2.1.0",
|
||||||
|
"text-segmentation": "^1.0.3"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">=8.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/http-proxy-agent": {
|
"node_modules/http-proxy-agent": {
|
||||||
"version": "5.0.0",
|
"version": "5.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-5.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-5.0.0.tgz",
|
||||||
@@ -8037,6 +8154,12 @@
|
|||||||
"loose-envify": "^1.0.0"
|
"loose-envify": "^1.0.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/iobuffer": {
|
||||||
|
"version": "5.4.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/iobuffer/-/iobuffer-5.4.0.tgz",
|
||||||
|
"integrity": "sha512-DRebOWuqDvxunfkNJAlc3IzWIPD5xVxwUNbHr7xKB8E6aLJxIPfNX3CoMJghcFjpv6RWQsrcJbghtEwSPoJqMA==",
|
||||||
|
"license": "MIT"
|
||||||
|
},
|
||||||
"node_modules/is-array-buffer": {
|
"node_modules/is-array-buffer": {
|
||||||
"version": "3.0.5",
|
"version": "3.0.5",
|
||||||
"resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.5.tgz",
|
"resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.5.tgz",
|
||||||
@@ -9702,6 +9825,32 @@
|
|||||||
"node": ">=6"
|
"node": ">=6"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/jspdf": {
|
||||||
|
"version": "4.2.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/jspdf/-/jspdf-4.2.1.tgz",
|
||||||
|
"integrity": "sha512-YyAXyvnmjTbR4bHQRLzex3CuINCDlQnBqoSYyjJwTP2x9jDLuKDzy7aKUl0hgx3uhcl7xzg32agn5vlie6HIlQ==",
|
||||||
|
"license": "MIT",
|
||||||
|
"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"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/jspdf-autotable": {
|
||||||
|
"version": "5.0.8",
|
||||||
|
"resolved": "https://registry.npmjs.org/jspdf-autotable/-/jspdf-autotable-5.0.8.tgz",
|
||||||
|
"integrity": "sha512-Hy05N86yBO7CXBrnSLOge7i1ZYpKH2DjQ94iybaP7vBhSInjvRBgDc99ngKzSbSO8Jc98ZCally8I6n0tj2RJQ==",
|
||||||
|
"license": "MIT",
|
||||||
|
"peerDependencies": {
|
||||||
|
"jspdf": "^2 || ^3 || ^4"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/jsx-ast-utils": {
|
"node_modules/jsx-ast-utils": {
|
||||||
"version": "3.3.5",
|
"version": "3.3.5",
|
||||||
"resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-3.3.5.tgz",
|
"resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-3.3.5.tgz",
|
||||||
@@ -10331,6 +10480,22 @@
|
|||||||
"node": ">=6"
|
"node": ">=6"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/pako": {
|
||||||
|
"version": "2.2.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/pako/-/pako-2.2.0.tgz",
|
||||||
|
"integrity": "sha512-zJq6RP/5q+TO2OpFV3FHzlPnFjmkb7Nc99a5SNjJE+uu/PkpChs+NIZSSzbBoD+6kjiISXjfYdwj1ZRQ81dz/w==",
|
||||||
|
"funding": [
|
||||||
|
{
|
||||||
|
"type": "github",
|
||||||
|
"url": "https://github.com/sponsors/puzrin"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "github",
|
||||||
|
"url": "https://github.com/sponsors/nodeca"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"license": "(MIT AND Zlib)"
|
||||||
|
},
|
||||||
"node_modules/papaparse": {
|
"node_modules/papaparse": {
|
||||||
"version": "5.6.0",
|
"version": "5.6.0",
|
||||||
"resolved": "https://registry.npmjs.org/papaparse/-/papaparse-5.6.0.tgz",
|
"resolved": "https://registry.npmjs.org/papaparse/-/papaparse-5.6.0.tgz",
|
||||||
@@ -10418,6 +10583,13 @@
|
|||||||
"integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
|
"integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
|
||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
|
"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.1.1",
|
"version": "1.1.1",
|
||||||
"resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
|
"resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
|
||||||
@@ -10856,6 +11028,16 @@
|
|||||||
],
|
],
|
||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
|
"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/react": {
|
"node_modules/react": {
|
||||||
"version": "19.2.8",
|
"version": "19.2.8",
|
||||||
"resolved": "https://registry.npmjs.org/react/-/react-19.2.8.tgz",
|
"resolved": "https://registry.npmjs.org/react/-/react-19.2.8.tgz",
|
||||||
@@ -11186,6 +11368,13 @@
|
|||||||
"node": ">=4"
|
"node": ">=4"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/regenerator-runtime": {
|
||||||
|
"version": "0.13.11",
|
||||||
|
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz",
|
||||||
|
"integrity": "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==",
|
||||||
|
"license": "MIT",
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
"node_modules/regexp.prototype.flags": {
|
"node_modules/regexp.prototype.flags": {
|
||||||
"version": "1.5.4",
|
"version": "1.5.4",
|
||||||
"resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.4.tgz",
|
"resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.4.tgz",
|
||||||
@@ -11345,6 +11534,16 @@
|
|||||||
"node": ">=0.10.0"
|
"node": ">=0.10.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"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/rollup": {
|
"node_modules/rollup": {
|
||||||
"version": "4.62.4",
|
"version": "4.62.4",
|
||||||
"resolved": "https://registry.npmjs.org/rollup/-/rollup-4.62.4.tgz",
|
"resolved": "https://registry.npmjs.org/rollup/-/rollup-4.62.4.tgz",
|
||||||
@@ -11749,6 +11948,16 @@
|
|||||||
"node": ">=8"
|
"node": ">=8"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"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/stop-iteration-iterator": {
|
"node_modules/stop-iteration-iterator": {
|
||||||
"version": "1.1.0",
|
"version": "1.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/stop-iteration-iterator/-/stop-iteration-iterator-1.1.0.tgz",
|
"resolved": "https://registry.npmjs.org/stop-iteration-iterator/-/stop-iteration-iterator-1.1.0.tgz",
|
||||||
@@ -12004,6 +12213,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/symbol-tree": {
|
"node_modules/symbol-tree": {
|
||||||
"version": "3.2.4",
|
"version": "3.2.4",
|
||||||
"resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
|
"resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
|
||||||
@@ -12103,6 +12322,16 @@
|
|||||||
"node": ">=8"
|
"node": ">=8"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"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",
|
||||||
|
"optional": true,
|
||||||
|
"dependencies": {
|
||||||
|
"utrie": "^1.0.2"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/thenify": {
|
"node_modules/thenify": {
|
||||||
"version": "3.3.1",
|
"version": "3.3.1",
|
||||||
"resolved": "https://registry.npmjs.org/thenify/-/thenify-3.3.1.tgz",
|
"resolved": "https://registry.npmjs.org/thenify/-/thenify-3.3.1.tgz",
|
||||||
@@ -12565,6 +12794,16 @@
|
|||||||
"integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
|
"integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
|
||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
|
"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",
|
||||||
|
"optional": true,
|
||||||
|
"dependencies": {
|
||||||
|
"base64-arraybuffer": "^1.0.2"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/v8-to-istanbul": {
|
"node_modules/v8-to-istanbul": {
|
||||||
"version": "9.3.0",
|
"version": "9.3.0",
|
||||||
"resolved": "https://registry.npmjs.org/v8-to-istanbul/-/v8-to-istanbul-9.3.0.tgz",
|
"resolved": "https://registry.npmjs.org/v8-to-istanbul/-/v8-to-istanbul-9.3.0.tgz",
|
||||||
|
|||||||
@@ -36,6 +36,8 @@
|
|||||||
"clsx": "^2.1.1",
|
"clsx": "^2.1.1",
|
||||||
"dayjs": "^1.11.23",
|
"dayjs": "^1.11.23",
|
||||||
"framer-motion": "^11.16.4",
|
"framer-motion": "^11.16.4",
|
||||||
|
"jspdf": "^4.2.1",
|
||||||
|
"jspdf-autotable": "^5.0.8",
|
||||||
"leaflet": "^1.9.4",
|
"leaflet": "^1.9.4",
|
||||||
"lucide-react": "^0.475.0",
|
"lucide-react": "^0.475.0",
|
||||||
"papaparse": "^5.6.0",
|
"papaparse": "^5.6.0",
|
||||||
|
|||||||
197
src/lib/ordersPdfGenerator.js
Normal file
197
src/lib/ordersPdfGenerator.js
Normal file
@@ -0,0 +1,197 @@
|
|||||||
|
import { jsPDF } from 'jspdf';
|
||||||
|
import autoTable from 'jspdf-autotable';
|
||||||
|
import dayjs from 'dayjs';
|
||||||
|
import { formatDoormileTimestamp } from '@/lib/doormileTimestamp';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Generates an executive-grade operational PDF report for Doormile Orders.
|
||||||
|
*/
|
||||||
|
export async function generateOrdersPdfReport({
|
||||||
|
title = 'Orders Report',
|
||||||
|
subtitle = 'Operational Delivery Breakdown',
|
||||||
|
dateRangeLabel = 'Last 7 Days',
|
||||||
|
fromDate,
|
||||||
|
toDate,
|
||||||
|
rows = [],
|
||||||
|
}) {
|
||||||
|
const doc = new jsPDF({
|
||||||
|
orientation: 'landscape',
|
||||||
|
unit: 'mm',
|
||||||
|
format: 'a4',
|
||||||
|
});
|
||||||
|
|
||||||
|
const pageWidth = doc.internal.pageSize.getWidth();
|
||||||
|
const pageHeight = doc.internal.pageSize.getHeight();
|
||||||
|
|
||||||
|
// 1. Top Brand Crimson Header Bar
|
||||||
|
doc.setFillColor(200, 16, 46); // Doormile Brand Crimson #C8102E
|
||||||
|
doc.rect(0, 0, pageWidth, 24, 'F');
|
||||||
|
|
||||||
|
// Company Name
|
||||||
|
doc.setTextColor(255, 255, 255);
|
||||||
|
doc.setFont('helvetica', 'bold');
|
||||||
|
doc.setFontSize(15);
|
||||||
|
doc.text('DOORMILE EXPRESS', 14, 10.5);
|
||||||
|
|
||||||
|
// Subtitle
|
||||||
|
doc.setFont('helvetica', 'normal');
|
||||||
|
doc.setFontSize(8.5);
|
||||||
|
doc.text(`${title.toUpperCase()} · ${subtitle}`, 14, 17.5);
|
||||||
|
|
||||||
|
// Date and Metadata on Right
|
||||||
|
doc.setFontSize(8);
|
||||||
|
doc.text(
|
||||||
|
`Period: ${dateRangeLabel} (${fromDate} to ${toDate})`,
|
||||||
|
pageWidth - 14,
|
||||||
|
10.5,
|
||||||
|
{ align: 'right' }
|
||||||
|
);
|
||||||
|
doc.text(
|
||||||
|
`Generated: ${dayjs().format('DD MMM YYYY, hh:mm A')}`,
|
||||||
|
pageWidth - 14,
|
||||||
|
17.5,
|
||||||
|
{ align: 'right' }
|
||||||
|
);
|
||||||
|
|
||||||
|
// 2. Metric KPI Summary Ribbon
|
||||||
|
const totalOrders = rows.length;
|
||||||
|
const completedOrders = rows.filter((r) =>
|
||||||
|
['delivered', 'completed'].includes((r.orderstatus || '').toLowerCase())
|
||||||
|
).length;
|
||||||
|
const totalRevenue = rows.reduce(
|
||||||
|
(sum, r) => sum + (Number(r.deliverycharges) || 0),
|
||||||
|
0
|
||||||
|
);
|
||||||
|
const totalKm = rows.reduce((sum, r) => sum + (Number(r.kms) || 0), 0);
|
||||||
|
|
||||||
|
const kpis = [
|
||||||
|
{ label: 'TOTAL ORDERS', val: String(totalOrders) },
|
||||||
|
{
|
||||||
|
label: 'DELIVERED SUCESSFULLY',
|
||||||
|
val: `${completedOrders} (${totalOrders ? Math.round((completedOrders / totalOrders) * 100) : 0}%)`,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'DELIVERY CHARGES',
|
||||||
|
val: `Rs. ${totalRevenue.toLocaleString('en-IN', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`,
|
||||||
|
},
|
||||||
|
{ label: 'TOTAL DISTANCE', val: `${totalKm.toFixed(1)} km` },
|
||||||
|
];
|
||||||
|
|
||||||
|
doc.setFillColor(248, 250, 252);
|
||||||
|
doc.rect(14, 28, pageWidth - 28, 13, 'F');
|
||||||
|
doc.setDrawColor(226, 232, 240);
|
||||||
|
doc.rect(14, 28, pageWidth - 28, 13, 'S');
|
||||||
|
|
||||||
|
const colWidth = (pageWidth - 28) / kpis.length;
|
||||||
|
kpis.forEach((kpi, idx) => {
|
||||||
|
const x = 14 + idx * colWidth + 5;
|
||||||
|
doc.setTextColor(100, 116, 139);
|
||||||
|
doc.setFontSize(6.5);
|
||||||
|
doc.setFont('helvetica', 'bold');
|
||||||
|
doc.text(kpi.label, x, 32.5);
|
||||||
|
|
||||||
|
doc.setTextColor(16, 24, 32);
|
||||||
|
doc.setFontSize(9.5);
|
||||||
|
doc.setFont('helvetica', 'bold');
|
||||||
|
doc.text(kpi.val, x, 38);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 3. Tabular Orders List
|
||||||
|
const tableData = rows.map((r, i) => [
|
||||||
|
i + 1,
|
||||||
|
r.orderid || '—',
|
||||||
|
formatDoormileTimestamp(r.orderdate, 'DD/MM/YY hh:mm A') || '—',
|
||||||
|
r.tenantname || '—',
|
||||||
|
(r.pickupaddress || '—').substring(0, 42),
|
||||||
|
`${r.deliverycustomer ? r.deliverycustomer + ' - ' : ''}${(r.deliveryaddress || '—').substring(0, 38)}`,
|
||||||
|
r.ridername || 'Unassigned',
|
||||||
|
r.kms ? `${Number(r.kms).toFixed(1)}` : '0.0',
|
||||||
|
r.deliverycharges != null ? `Rs. ${Number(r.deliverycharges).toFixed(2)}` : '—',
|
||||||
|
(r.orderstatus || 'pending').toUpperCase(),
|
||||||
|
]);
|
||||||
|
|
||||||
|
autoTable(doc, {
|
||||||
|
startY: 45,
|
||||||
|
head: [
|
||||||
|
[
|
||||||
|
'#',
|
||||||
|
'Order ID',
|
||||||
|
'Date & Time',
|
||||||
|
'Client',
|
||||||
|
'Pickup Location',
|
||||||
|
'Drop Customer & Location',
|
||||||
|
'Miler',
|
||||||
|
'Km',
|
||||||
|
'Amount',
|
||||||
|
'Status',
|
||||||
|
],
|
||||||
|
],
|
||||||
|
body:
|
||||||
|
tableData.length > 0
|
||||||
|
? tableData
|
||||||
|
: [
|
||||||
|
[
|
||||||
|
'—',
|
||||||
|
'No orders recorded in this date range',
|
||||||
|
'',
|
||||||
|
'',
|
||||||
|
'',
|
||||||
|
'',
|
||||||
|
'',
|
||||||
|
'',
|
||||||
|
'',
|
||||||
|
'',
|
||||||
|
],
|
||||||
|
],
|
||||||
|
theme: 'grid',
|
||||||
|
headStyles: {
|
||||||
|
fillColor: [200, 16, 46],
|
||||||
|
textColor: [255, 255, 255],
|
||||||
|
fontSize: 7.5,
|
||||||
|
fontStyle: 'bold',
|
||||||
|
halign: 'left',
|
||||||
|
cellPadding: 2,
|
||||||
|
},
|
||||||
|
styles: {
|
||||||
|
fontSize: 7,
|
||||||
|
textColor: [30, 41, 59],
|
||||||
|
cellPadding: 1.8,
|
||||||
|
overflow: 'linebreak',
|
||||||
|
},
|
||||||
|
alternateRowStyles: {
|
||||||
|
fillColor: [248, 250, 252],
|
||||||
|
},
|
||||||
|
columnStyles: {
|
||||||
|
0: { cellWidth: 8, halign: 'center' },
|
||||||
|
1: { cellWidth: 24, fontStyle: 'bold' },
|
||||||
|
2: { cellWidth: 26 },
|
||||||
|
3: { cellWidth: 26 },
|
||||||
|
4: { cellWidth: 50 },
|
||||||
|
5: { cellWidth: 54 },
|
||||||
|
6: { cellWidth: 26 },
|
||||||
|
7: { cellWidth: 14, halign: 'right' },
|
||||||
|
8: { cellWidth: 22, halign: 'right', fontStyle: 'bold' },
|
||||||
|
9: { cellWidth: 20, halign: 'center' },
|
||||||
|
},
|
||||||
|
margin: { left: 14, right: 14, top: 45, bottom: 12 },
|
||||||
|
didDrawPage: (data) => {
|
||||||
|
// Footer
|
||||||
|
doc.setFontSize(7);
|
||||||
|
doc.setTextColor(148, 163, 184);
|
||||||
|
doc.text(
|
||||||
|
'Doormile Express Operations Report · Confidential · System Generated',
|
||||||
|
14,
|
||||||
|
pageHeight - 6
|
||||||
|
);
|
||||||
|
doc.text(
|
||||||
|
`Page ${doc.internal.getNumberOfPages()}`,
|
||||||
|
pageWidth - 14,
|
||||||
|
pageHeight - 6,
|
||||||
|
{ align: 'right' }
|
||||||
|
);
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const cleanTitle = title.replace(/\s+/g, '_');
|
||||||
|
doc.save(`Doormile_${cleanTitle}_${fromDate}_to_${toDate}.pdf`);
|
||||||
|
}
|
||||||
276
src/pages/doormile/reports/OperationalReportCards.jsx
Normal file
276
src/pages/doormile/reports/OperationalReportCards.jsx
Normal file
@@ -0,0 +1,276 @@
|
|||||||
|
import React, { useState } from 'react';
|
||||||
|
import dayjs from 'dayjs';
|
||||||
|
import {
|
||||||
|
BarChart2,
|
||||||
|
TrendingUp,
|
||||||
|
Package,
|
||||||
|
ArrowDownToLine,
|
||||||
|
FileText,
|
||||||
|
FileSpreadsheet,
|
||||||
|
Calendar,
|
||||||
|
Loader2,
|
||||||
|
Check,
|
||||||
|
} from 'lucide-react';
|
||||||
|
import { cn } from '@/lib/utils';
|
||||||
|
import {
|
||||||
|
DropdownMenu,
|
||||||
|
DropdownMenuContent,
|
||||||
|
DropdownMenuItem,
|
||||||
|
DropdownMenuLabel,
|
||||||
|
DropdownMenuSeparator,
|
||||||
|
DropdownMenuTrigger,
|
||||||
|
} from '@/components/ui/dropdown-menu';
|
||||||
|
import { generateOrdersPdfReport } from '@/lib/ordersPdfGenerator';
|
||||||
|
import { exportRows } from '@/lib/doormileFormat';
|
||||||
|
import { fetchDeliveries } from '@/api/doormile/queries';
|
||||||
|
import { OpenToast } from '@/components/third-party/OpenToast';
|
||||||
|
|
||||||
|
const EXPORT_COLUMNS = [
|
||||||
|
{ key: 'orderid', header: 'Order ID' },
|
||||||
|
{ key: 'orderdate', header: 'Date & Time' },
|
||||||
|
{ key: 'tenantname', header: 'Client' },
|
||||||
|
{ key: 'deliverycustomer', header: 'Customer' },
|
||||||
|
{ key: 'pickupaddress', header: 'Pickup' },
|
||||||
|
{ key: 'deliveryaddress', header: 'Drop' },
|
||||||
|
{ key: 'ridername', header: 'Miler' },
|
||||||
|
{ key: 'kms', header: 'Km' },
|
||||||
|
{ key: 'deliverycharges', header: 'Amount' },
|
||||||
|
{ key: 'orderstatus', header: 'Status' },
|
||||||
|
];
|
||||||
|
|
||||||
|
export default function OperationalReportCards({ onSelectRange }) {
|
||||||
|
const [downloadingCardId, setDownloadingCardId] = useState(null);
|
||||||
|
|
||||||
|
const today = dayjs().format('YYYY-MM-DD');
|
||||||
|
|
||||||
|
const REPORTS = [
|
||||||
|
{
|
||||||
|
id: 'last-7-days',
|
||||||
|
days: 7,
|
||||||
|
title: 'Last 7 Days Orders Report',
|
||||||
|
description:
|
||||||
|
'Complete order dispatch, miler fulfillment, and client billing breakdown for the trailing 7 days.',
|
||||||
|
fromDate: dayjs().subtract(6, 'day').format('YYYY-MM-DD'),
|
||||||
|
toDate: today,
|
||||||
|
footerMeta: 'Trailing 7d · PDF · XLSX',
|
||||||
|
icon: BarChart2,
|
||||||
|
iconColor: 'bg-brand-tint text-brand',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'last-15-days',
|
||||||
|
days: 15,
|
||||||
|
title: 'Last 15 Days Orders Report',
|
||||||
|
description:
|
||||||
|
'Mid-month operational summary, delivery SLA tracking, and courier performance across hubs.',
|
||||||
|
fromDate: dayjs().subtract(14, 'day').format('YYYY-MM-DD'),
|
||||||
|
toDate: today,
|
||||||
|
footerMeta: 'Trailing 15d · PDF · XLSX',
|
||||||
|
icon: TrendingUp,
|
||||||
|
iconColor: 'bg-slate-100 text-slate-700',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'last-30-days',
|
||||||
|
days: 30,
|
||||||
|
title: 'Last 30 Days Orders Report',
|
||||||
|
description:
|
||||||
|
'Monthly comprehensive operational audit of all orders, route kilometers, and delivery revenues.',
|
||||||
|
fromDate: dayjs().subtract(29, 'day').format('YYYY-MM-DD'),
|
||||||
|
toDate: today,
|
||||||
|
footerMeta: 'Trailing 30d · PDF · XLSX',
|
||||||
|
icon: Package,
|
||||||
|
iconColor: 'bg-emerald-50 text-emerald-700',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
const fetchOrdersForReport = async (report) => {
|
||||||
|
try {
|
||||||
|
const res = await fetchDeliveries({
|
||||||
|
pageParam: 1,
|
||||||
|
queryKey: [
|
||||||
|
'deliveries',
|
||||||
|
'',
|
||||||
|
'',
|
||||||
|
'',
|
||||||
|
report.fromDate,
|
||||||
|
report.toDate,
|
||||||
|
500,
|
||||||
|
],
|
||||||
|
});
|
||||||
|
return res?.rows || [];
|
||||||
|
} catch (err) {
|
||||||
|
console.warn('Failed to fetch range-specific deliveries:', err);
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleDownloadPdf = async (report) => {
|
||||||
|
setDownloadingCardId(report.id);
|
||||||
|
OpenToast(`Generating ${report.title} PDF...`, 'info', 2000);
|
||||||
|
|
||||||
|
try {
|
||||||
|
const rows = await fetchOrdersForReport(report);
|
||||||
|
await generateOrdersPdfReport({
|
||||||
|
title: report.title,
|
||||||
|
subtitle: `Trailing ${report.days} Days Breakdown`,
|
||||||
|
dateRangeLabel: `Last ${report.days} Days`,
|
||||||
|
fromDate: report.fromDate,
|
||||||
|
toDate: report.toDate,
|
||||||
|
rows,
|
||||||
|
});
|
||||||
|
OpenToast(`${report.title} PDF downloaded successfully!`, 'success', 2500);
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Error generating PDF:', error);
|
||||||
|
OpenToast('Failed to generate PDF report', 'error', 3000);
|
||||||
|
} finally {
|
||||||
|
setDownloadingCardId(null);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleDownloadExcel = async (report) => {
|
||||||
|
setDownloadingCardId(report.id);
|
||||||
|
OpenToast(`Preparing ${report.title} Excel export...`, 'info', 2000);
|
||||||
|
|
||||||
|
try {
|
||||||
|
const rows = await fetchOrdersForReport(report);
|
||||||
|
await exportRows(
|
||||||
|
rows,
|
||||||
|
EXPORT_COLUMNS,
|
||||||
|
`Doormile_Orders_${report.days}Days_${report.fromDate}_to_${report.toDate}`
|
||||||
|
);
|
||||||
|
OpenToast(`${report.title} Excel file downloaded!`, 'success', 2500);
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Error generating Excel:', error);
|
||||||
|
OpenToast('Failed to export Excel report', 'error', 3000);
|
||||||
|
} finally {
|
||||||
|
setDownloadingCardId(null);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleApplyToTable = (report) => {
|
||||||
|
if (onSelectRange) {
|
||||||
|
onSelectRange({ from: report.fromDate, to: report.toDate });
|
||||||
|
OpenToast(`Filtered table to ${report.title}`, 'info', 1800);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="space-y-3 pt-1">
|
||||||
|
{/* Section Header matching Reference Image: OPERATIONAL REPORTS */}
|
||||||
|
<div className="flex items-center justify-between">
|
||||||
|
<h2 className="text-[11px] font-bold uppercase tracking-wider text-slate-400 font-heading">
|
||||||
|
OPERATIONAL REPORTS
|
||||||
|
</h2>
|
||||||
|
<span className="text-xs text-slate-400">
|
||||||
|
Downloadable executive summaries
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* 3 Report Cards in a Responsive Grid */}
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||||
|
{REPORTS.map((report) => {
|
||||||
|
const Icon = report.icon;
|
||||||
|
const isBusy = downloadingCardId === report.id;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
key={report.id}
|
||||||
|
className="bg-white rounded-2xl border border-slate-200/90 shadow-2xs hover:shadow-md hover:border-slate-300 transition-all p-5 flex flex-col justify-between group"
|
||||||
|
>
|
||||||
|
<div>
|
||||||
|
{/* Top Row: Icon on left, Operational Badge on right */}
|
||||||
|
<div className="flex items-center justify-between gap-2">
|
||||||
|
<div
|
||||||
|
className={cn(
|
||||||
|
'w-9 h-9 rounded-xl flex items-center justify-center shrink-0 shadow-2xs transition-transform group-hover:scale-105',
|
||||||
|
report.iconColor
|
||||||
|
)}
|
||||||
|
>
|
||||||
|
<Icon className="w-4.5 h-4.5" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<span className="px-2.5 py-0.5 rounded-full text-[10.5px] font-semibold bg-slate-100 text-slate-600 border border-slate-200/80">
|
||||||
|
Operational
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Card Title */}
|
||||||
|
<h3 className="text-base font-bold text-slate-900 font-heading mt-3.5 tracking-tight group-hover:text-brand transition-colors">
|
||||||
|
{report.title}
|
||||||
|
</h3>
|
||||||
|
|
||||||
|
{/* Card Description */}
|
||||||
|
<p className="text-xs text-slate-500 mt-1.5 leading-relaxed line-clamp-2">
|
||||||
|
{report.description}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Card Footer: Metadata on left, Export action on right */}
|
||||||
|
<div className="flex items-center justify-between pt-4 mt-4 border-t border-slate-100 text-xs">
|
||||||
|
<span className="text-slate-400 font-medium text-[11px]">
|
||||||
|
{report.footerMeta}
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<DropdownMenu>
|
||||||
|
<DropdownMenuTrigger asChild>
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
disabled={isBusy}
|
||||||
|
className="inline-flex items-center gap-1.5 font-semibold text-slate-700 hover:text-brand active:scale-95 transition-all cursor-pointer disabled:opacity-50"
|
||||||
|
>
|
||||||
|
{isBusy ? (
|
||||||
|
<Loader2 className="w-3.5 h-3.5 animate-spin text-brand" />
|
||||||
|
) : (
|
||||||
|
<ArrowDownToLine className="w-3.5 h-3.5" />
|
||||||
|
)}
|
||||||
|
<span>Export</span>
|
||||||
|
</button>
|
||||||
|
</DropdownMenuTrigger>
|
||||||
|
<DropdownMenuContent align="end" className="w-52 p-1.5">
|
||||||
|
<DropdownMenuLabel className="text-[10px] uppercase font-bold text-slate-400 tracking-wider px-2 py-1">
|
||||||
|
Choose Export Format
|
||||||
|
</DropdownMenuLabel>
|
||||||
|
<DropdownMenuItem
|
||||||
|
onClick={() => handleDownloadPdf(report)}
|
||||||
|
className="cursor-pointer flex items-center gap-2 text-xs font-semibold py-2 px-2.5 rounded-lg text-slate-800 hover:text-brand hover:bg-brand-tint/60 transition-colors"
|
||||||
|
>
|
||||||
|
<FileText className="w-4 h-4 text-brand" />
|
||||||
|
<div className="flex-1">
|
||||||
|
<div>Download PDF Report</div>
|
||||||
|
<div className="text-[10px] text-slate-400 font-normal">
|
||||||
|
Branded summary with metrics
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</DropdownMenuItem>
|
||||||
|
|
||||||
|
<DropdownMenuItem
|
||||||
|
onClick={() => handleDownloadExcel(report)}
|
||||||
|
className="cursor-pointer flex items-center gap-2 text-xs font-semibold py-2 px-2.5 rounded-lg text-slate-800 hover:text-emerald-700 hover:bg-emerald-50 transition-colors"
|
||||||
|
>
|
||||||
|
<FileSpreadsheet className="w-4 h-4 text-emerald-600" />
|
||||||
|
<div className="flex-1">
|
||||||
|
<div>Download Excel (.xlsx)</div>
|
||||||
|
<div className="text-[10px] text-slate-400 font-normal">
|
||||||
|
Full tabular spreadsheet
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</DropdownMenuItem>
|
||||||
|
|
||||||
|
<DropdownMenuSeparator className="my-1" />
|
||||||
|
|
||||||
|
<DropdownMenuItem
|
||||||
|
onClick={() => handleApplyToTable(report)}
|
||||||
|
className="cursor-pointer flex items-center gap-2 text-xs font-medium py-1.5 px-2.5 rounded-lg text-slate-600 hover:text-slate-900 hover:bg-slate-100 transition-colors"
|
||||||
|
>
|
||||||
|
<Calendar className="w-3.5 h-3.5 text-slate-400" />
|
||||||
|
<span>View in Table Below</span>
|
||||||
|
</DropdownMenuItem>
|
||||||
|
</DropdownMenuContent>
|
||||||
|
</DropdownMenu>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -9,6 +9,7 @@ import { ListToolbar } from '@/components/doormile/ListToolbar';
|
|||||||
import { useDeliveries, useRiderOptions, useTenants } from '@/lib/doormileHooks';
|
import { useDeliveries, useRiderOptions, useTenants } from '@/lib/doormileHooks';
|
||||||
import { formatDoormileTimestamp } from '@/lib/doormileTimestamp';
|
import { formatDoormileTimestamp } from '@/lib/doormileTimestamp';
|
||||||
import { currency, exportRows, km as formatKm, matchesQuery, orDash, useDebouncedValue } from '@/lib/doormileFormat';
|
import { currency, exportRows, km as formatKm, matchesQuery, orDash, useDebouncedValue } from '@/lib/doormileFormat';
|
||||||
|
import OperationalReportCards from './OperationalReportCards';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Orders details — the row-level export behind the summary.
|
* Orders details — the row-level export behind the summary.
|
||||||
@@ -160,7 +161,10 @@ export default function OrdersDetails() {
|
|||||||
];
|
];
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Stack space="lg">
|
<Stack space="xl">
|
||||||
|
{/* Downloadable Operational Report Cards matching reference */}
|
||||||
|
<OperationalReportCards onSelectRange={setRange} />
|
||||||
|
|
||||||
<Stack space="sm">
|
<Stack space="sm">
|
||||||
<ListToolbar
|
<ListToolbar
|
||||||
search={search}
|
search={search}
|
||||||
|
|||||||
101
tests/integration/ordersReportCards.test.jsx
Normal file
101
tests/integration/ordersReportCards.test.jsx
Normal file
@@ -0,0 +1,101 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import { render, screen, fireEvent } from '@testing-library/react';
|
||||||
|
import OperationalReportCards from '@/pages/doormile/reports/OperationalReportCards';
|
||||||
|
|
||||||
|
// Mock DropdownMenu for clean testing in jsdom
|
||||||
|
jest.mock('@/components/ui/dropdown-menu', () => ({
|
||||||
|
DropdownMenu: ({ children }) => <div>{children}</div>,
|
||||||
|
DropdownMenuTrigger: ({ children }) => <div>{children}</div>,
|
||||||
|
DropdownMenuContent: ({ children }) => <div>{children}</div>,
|
||||||
|
DropdownMenuItem: ({ children, onClick }) => (
|
||||||
|
<button type="button" onClick={onClick}>
|
||||||
|
{children}
|
||||||
|
</button>
|
||||||
|
),
|
||||||
|
DropdownMenuLabel: ({ children }) => <div>{children}</div>,
|
||||||
|
DropdownMenuSeparator: () => <hr />,
|
||||||
|
}));
|
||||||
|
|
||||||
|
// Stub lucide-react icons for Jest
|
||||||
|
jest.mock('lucide-react', () => {
|
||||||
|
return new Proxy(
|
||||||
|
{},
|
||||||
|
{
|
||||||
|
get: (target, prop) => {
|
||||||
|
if (prop === '__esModule') return true;
|
||||||
|
return (props) => <span data-testid={`icon-${String(prop)}`} {...props} />;
|
||||||
|
},
|
||||||
|
}
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Mock api calls
|
||||||
|
jest.mock('@/api/doormile/queries', () => ({
|
||||||
|
fetchDeliveries: jest.fn().mockResolvedValue({
|
||||||
|
rows: [
|
||||||
|
{
|
||||||
|
orderheaderid: '1',
|
||||||
|
orderid: 'DM-1001',
|
||||||
|
orderdate: '2026-09-20T10:00:00Z',
|
||||||
|
tenantname: 'Acme Logistics',
|
||||||
|
deliverycustomer: 'John Doe',
|
||||||
|
pickupaddress: '123 Main St',
|
||||||
|
deliveryaddress: '456 Market St',
|
||||||
|
ridername: 'Rider Dave',
|
||||||
|
kms: 5.2,
|
||||||
|
deliverycharges: 120,
|
||||||
|
orderstatus: 'delivered',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
}),
|
||||||
|
}));
|
||||||
|
|
||||||
|
// Mock pdf generator
|
||||||
|
jest.mock('@/lib/ordersPdfGenerator', () => ({
|
||||||
|
generateOrdersPdfReport: jest.fn().mockResolvedValue(true),
|
||||||
|
}));
|
||||||
|
|
||||||
|
describe('OperationalReportCards Component', () => {
|
||||||
|
it('renders section title and all 3 operational report cards', () => {
|
||||||
|
render(<OperationalReportCards onSelectRange={() => {}} />);
|
||||||
|
|
||||||
|
expect(screen.getByText('OPERATIONAL REPORTS')).toBeInTheDocument();
|
||||||
|
expect(screen.getByText('Last 7 Days Orders Report')).toBeInTheDocument();
|
||||||
|
expect(screen.getByText('Last 15 Days Orders Report')).toBeInTheDocument();
|
||||||
|
expect(screen.getByText('Last 30 Days Orders Report')).toBeInTheDocument();
|
||||||
|
|
||||||
|
const badges = screen.getAllByText('Operational');
|
||||||
|
expect(badges.length).toBe(3);
|
||||||
|
|
||||||
|
const exportButtons = screen.getAllByText('Export');
|
||||||
|
expect(exportButtons.length).toBe(3);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('displays trailing duration metadata on each card', () => {
|
||||||
|
render(<OperationalReportCards onSelectRange={() => {}} />);
|
||||||
|
|
||||||
|
expect(screen.getByText('Trailing 7d · PDF · XLSX')).toBeInTheDocument();
|
||||||
|
expect(screen.getByText('Trailing 15d · PDF · XLSX')).toBeInTheDocument();
|
||||||
|
expect(screen.getByText('Trailing 30d · PDF · XLSX')).toBeInTheDocument();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('notifies parent onSelectRange when choosing View in Table', async () => {
|
||||||
|
const handleSelectRange = jest.fn();
|
||||||
|
render(<OperationalReportCards onSelectRange={handleSelectRange} />);
|
||||||
|
|
||||||
|
// Click Export on the first card
|
||||||
|
const exportButtons = screen.getAllByText('Export');
|
||||||
|
fireEvent.pointerDown(exportButtons[0]);
|
||||||
|
|
||||||
|
// Choose View in Table Below
|
||||||
|
const viewInTableItems = screen.getAllByText('View in Table Below');
|
||||||
|
fireEvent.click(viewInTableItems[0]);
|
||||||
|
|
||||||
|
expect(handleSelectRange).toHaveBeenCalledWith(
|
||||||
|
expect.objectContaining({
|
||||||
|
from: expect.any(String),
|
||||||
|
to: expect.any(String),
|
||||||
|
})
|
||||||
|
);
|
||||||
|
});
|
||||||
|
});
|
||||||
Reference in New Issue
Block a user