Compare commits

..

4 Commits

Author SHA1 Message Date
Cristiano 750fc19d46 When closing modal it patch delivery 2025-12-18 16:48:08 +01:00
Cristiano 2796c46625 First view of validating delivery 2025-12-18 16:23:49 +01:00
Cristiano 01848b3920 Real value for products under limit 2025-12-11 17:49:32 +01:00
Cristiano a7e099b9db Real value for deliverer and suppliers count 2025-12-11 16:26:12 +01:00
152 changed files with 2586 additions and 4117 deletions
+12 -162
View File
@@ -17,11 +17,8 @@
"@openapitools/openapi-generator-cli": "^2.25.2",
"@tailwindcss/postcss": "^4.1.17",
"@tailwindcss/vite": "^4.1.17",
"browser-image-compression": "^2.0.2",
"jwt-decode": "^4.0.0",
"ng-zorro-antd": "^20.4.0",
"postcss": "^8.5.6",
"rimraf": "^6.1.3",
"rxjs": "~7.8.0",
"tailwindcss": "^4.1.17",
"tslib": "^2.3.0",
@@ -31,7 +28,6 @@
"@angular/build": "^20.3.9",
"@angular/cli": "^20.3.9",
"@angular/compiler-cli": "^20.3.0",
"baseline-browser-mapping": "^2.10.32",
"less": "^4.2.0",
"typescript": "~5.9.2"
}
@@ -504,7 +500,6 @@
"resolved": "https://registry.npmjs.org/@angular/common/-/common-20.3.11.tgz",
"integrity": "sha512-zQ8xlyUBS+UDAUKk7z/hhWdTtQU2oc/Dwo7jXpyrYlz9y2X1A6sAZpUigdYpbrBkIaNs3MplJevgMiCm3kmN8g==",
"license": "MIT",
"peer": true,
"dependencies": {
"tslib": "^2.3.0"
},
@@ -521,7 +516,6 @@
"resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-20.3.11.tgz",
"integrity": "sha512-3O0iMPttD8a4QQQrjVfIjboiZZ17ErkZuqK8BXJBTn2rplpkq1m3kVhgsmzN2OANRR05GF9Ed1dTf8ycTrO1yg==",
"license": "MIT",
"peer": true,
"dependencies": {
"tslib": "^2.3.0"
},
@@ -535,7 +529,6 @@
"integrity": "sha512-u6T8kxj7LzK3btEln6Vd8y7p+O1eNXrLiGwqPuRF/QoyjBrRkTYufZ1I4TvzUxdd0ot6mPDRfdmiD15q//Y+oQ==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"@babel/core": "7.28.3",
"@jridgewell/sourcemap-codec": "^1.4.14",
@@ -568,7 +561,6 @@
"resolved": "https://registry.npmjs.org/@angular/core/-/core-20.3.11.tgz",
"integrity": "sha512-tOXlxG0SI9Yy1b/ntGyBahfffDpFg7vAbAt+9riOb5ZZ8GYyyOzg78Lqa/lrdBVEG0PXdDjEa0MV93qCyqwYlg==",
"license": "MIT",
"peer": true,
"dependencies": {
"tslib": "^2.3.0"
},
@@ -594,7 +586,6 @@
"resolved": "https://registry.npmjs.org/@angular/forms/-/forms-20.3.11.tgz",
"integrity": "sha512-jXDvW6a9HUzmLmvgPE+hVoZzc6QJBtQ1kYNn/FZDhbtmjRThJtaMW9YfS0Vz/a9KT9cxBf+8O8Q+yspvgsh3fg==",
"license": "MIT",
"peer": true,
"dependencies": {
"tslib": "^2.3.0"
},
@@ -613,7 +604,6 @@
"resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-20.3.11.tgz",
"integrity": "sha512-hh+8O8m4QzYYlQr9WGew472P37GF1u64NF3HfHmUKJ0xSqqTOHfpni3utev8upJAFJXBKOUZETgeHu2JRcGavg==",
"license": "MIT",
"peer": true,
"dependencies": {
"tslib": "^2.3.0"
},
@@ -636,7 +626,6 @@
"resolved": "https://registry.npmjs.org/@angular/router/-/router-20.3.11.tgz",
"integrity": "sha512-kuv7Yso7GY3tfRtQN0kW4v2Or4NUEBdjxTz5C8YuAhGDpiKXxDNkXzFliYTVWpJkr3EkTuR9mt9IAc+wxof3Pw==",
"license": "MIT",
"peer": true,
"dependencies": {
"tslib": "^2.3.0"
},
@@ -718,7 +707,6 @@
"integrity": "sha512-yDBHV9kQNcr2/sUr9jghVyz9C3Y5G2zUM2H2lo+9mKv4sFgbA8s8Z9t8D1jiTkGoO/NoIfKMyKWr4s6CN23ZwQ==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"@ampproject/remapping": "^2.2.0",
"@babel/code-frame": "^7.27.1",
@@ -1660,7 +1648,6 @@
"integrity": "sha512-nqhDw2ZcAUrKNPwhjinJny903bRhI0rQhiDz1LksjeRxqa36i3l75+4iXbOy0rlDpLJGxqtgoPavQjmmyS5UJw==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"@inquirer/checkbox": "^4.2.1",
"@inquirer/confirm": "^5.1.14",
@@ -2520,7 +2507,6 @@
"resolved": "https://registry.npmjs.org/@nestjs/common/-/common-11.1.9.tgz",
"integrity": "sha512-zDntUTReRbAThIfSp3dQZ9kKqI+LjgLp5YZN5c1bgNRDuoeLySAoZg46Bg1a+uV8TMgIRziHocglKGNzr6l+bQ==",
"license": "MIT",
"peer": true,
"dependencies": {
"file-type": "21.1.0",
"iterare": "1.2.1",
@@ -4284,7 +4270,6 @@
"resolved": "https://registry.npmjs.org/axios/-/axios-1.13.2.tgz",
"integrity": "sha512-VPk9ebNqPcy5lRGuSlKx752IlDatOjT9paPlm8A7yOuW2Fbvp4X3JznJtT4f0GzGLLiWE9W8onz51SqLYwzGaA==",
"license": "MIT",
"peer": true,
"dependencies": {
"follow-redirects": "^1.15.6",
"form-data": "^4.0.4",
@@ -4319,16 +4304,13 @@
"license": "MIT"
},
"node_modules/baseline-browser-mapping": {
"version": "2.10.32",
"resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.10.32.tgz",
"integrity": "sha512-wbPvpyjJPC0zdfdKXxqEL3Ea+bOMD/87X4lftiJkkaBiuG6ALQy1SLmEd7BSmVCuwCQsBrCamgBoLyfFDD1EPg==",
"version": "2.8.27",
"resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.8.27.tgz",
"integrity": "sha512-2CXFpkjVnY2FT+B6GrSYxzYf65BJWEqz5tIRHCvNsZZ2F3CmsCB37h8SpYgKG7y9C4YAeTipIPWG7EmFmhAeXA==",
"dev": true,
"license": "Apache-2.0",
"bin": {
"baseline-browser-mapping": "dist/cli.cjs"
},
"engines": {
"node": ">=6.0.0"
"baseline-browser-mapping": "dist/cli.js"
}
},
"node_modules/basic-ftp": {
@@ -4435,15 +4417,6 @@
"node": ">=8"
}
},
"node_modules/browser-image-compression": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/browser-image-compression/-/browser-image-compression-2.0.2.tgz",
"integrity": "sha512-pBLlQyUf6yB8SmmngrcOw3EoS4RpQ1BcylI3T9Yqn7+4nrQTXJD4sJDe5ODnJdrvNMaio5OicFo75rDyJD2Ucw==",
"license": "MIT",
"dependencies": {
"uzip": "0.20201231.0"
}
},
"node_modules/browserslist": {
"version": "4.28.0",
"resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.28.0.tgz",
@@ -4464,7 +4437,6 @@
}
],
"license": "MIT",
"peer": true,
"dependencies": {
"baseline-browser-mapping": "^2.8.25",
"caniuse-lite": "^1.0.30001754",
@@ -5663,7 +5635,6 @@
"integrity": "sha512-DT9ck5YIRU+8GYzzU5kT3eHGA5iL+1Zd0EutOmTE9Dtk+Tvuzd23VBU+ec7HPNSTxXYO55gPV/hq4pSBJDjFpA==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"accepts": "^2.0.0",
"body-parser": "^2.2.0",
@@ -6913,22 +6884,12 @@
],
"license": "MIT"
},
"node_modules/jwt-decode": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/jwt-decode/-/jwt-decode-4.0.0.tgz",
"integrity": "sha512-+KJGIyHgkGuIq3IEBNftfhW/LfWhXUIY6OmyVWjliu5KH1y0fw7VQ8YndE2O4qZdMSd9SqbnC8GOcZEy0Om7sA==",
"license": "MIT",
"engines": {
"node": ">=18"
}
},
"node_modules/less": {
"version": "4.4.2",
"resolved": "https://registry.npmjs.org/less/-/less-4.4.2.tgz",
"integrity": "sha512-j1n1IuTX1VQjIy3tT7cyGbX7nvQOsFLoIqobZv4ttI5axP923gA44zUj6miiA6R5Aoms4sEGVIIcucXUbRI14g==",
"devOptional": true,
"license": "Apache-2.0",
"peer": true,
"dependencies": {
"copy-anything": "^2.0.1",
"parse-node-version": "^1.0.1",
@@ -7216,7 +7177,6 @@
"integrity": "sha512-SL0JY3DaxylDuo/MecFeiC+7pedM0zia33zl0vcjgwcq1q1FWWF1To9EIauPbl8GbMCU0R2e0uJ8bZunhYKD2g==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"cli-truncate": "^4.0.0",
"colorette": "^2.0.20",
@@ -7605,10 +7565,10 @@
}
},
"node_modules/minipass": {
"version": "7.1.3",
"resolved": "https://registry.npmjs.org/minipass/-/minipass-7.1.3.tgz",
"integrity": "sha512-tEBHqDnIoM/1rXME1zgka9g6Q2lcoCkxHLuc7ODJ5BxbP5d4c2Z5cGgtXAku59200Cx7diuHTOYfSBD8n6mm8A==",
"license": "BlueOak-1.0.0",
"version": "7.1.2",
"resolved": "https://registry.npmjs.org/minipass/-/minipass-7.1.2.tgz",
"integrity": "sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==",
"license": "ISC",
"engines": {
"node": ">=16 || 14 >=14.17"
}
@@ -8414,6 +8374,7 @@
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/package-json-from-dist/-/package-json-from-dist-1.0.1.tgz",
"integrity": "sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==",
"dev": true,
"license": "BlueOak-1.0.0"
},
"node_modules/pacote": {
@@ -8871,8 +8832,7 @@
"version": "0.2.2",
"resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.2.2.tgz",
"integrity": "sha512-urBwgfrvVP/eAyXx4hluJivBKzuEbSQs9rKWCrCkbSxNv8mxPcUZKeuoF3Uy4mJl3Lwprp6yy5/39VWigZ4K6Q==",
"license": "Apache-2.0",
"peer": true
"license": "Apache-2.0"
},
"node_modules/require-directory": {
"version": "2.1.1",
@@ -8948,103 +8908,6 @@
"dev": true,
"license": "MIT"
},
"node_modules/rimraf": {
"version": "6.1.3",
"resolved": "https://registry.npmjs.org/rimraf/-/rimraf-6.1.3.tgz",
"integrity": "sha512-LKg+Cr2ZF61fkcaK1UdkH2yEBBKnYjTyWzTJT6KNPcSPaiT7HSdhtMXQuN5wkTX0Xu72KQ1l8S42rlmexS2hSA==",
"license": "BlueOak-1.0.0",
"dependencies": {
"glob": "^13.0.3",
"package-json-from-dist": "^1.0.1"
},
"bin": {
"rimraf": "dist/esm/bin.mjs"
},
"engines": {
"node": "20 || >=22"
},
"funding": {
"url": "https://github.com/sponsors/isaacs"
}
},
"node_modules/rimraf/node_modules/balanced-match": {
"version": "4.0.4",
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-4.0.4.tgz",
"integrity": "sha512-BLrgEcRTwX2o6gGxGOCNyMvGSp35YofuYzw9h1IMTRmKqttAZZVU67bdb9Pr2vUHA8+j3i2tJfjO6C6+4myGTA==",
"license": "MIT",
"engines": {
"node": "18 || 20 || >=22"
}
},
"node_modules/rimraf/node_modules/brace-expansion": {
"version": "5.0.6",
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-5.0.6.tgz",
"integrity": "sha512-kLpxurY4Z4r9sgMsyG0Z9uzsBlgiU/EFKhj/h91/8yHu0edo7XuixOIH3VcJ8kkxs6/jPzoI6U9Vj3WqbMQ94g==",
"license": "MIT",
"dependencies": {
"balanced-match": "^4.0.2"
},
"engines": {
"node": "18 || 20 || >=22"
}
},
"node_modules/rimraf/node_modules/glob": {
"version": "13.0.6",
"resolved": "https://registry.npmjs.org/glob/-/glob-13.0.6.tgz",
"integrity": "sha512-Wjlyrolmm8uDpm/ogGyXZXb1Z+Ca2B8NbJwqBVg0axK9GbBeoS7yGV6vjXnYdGm6X53iehEuxxbyiKp8QmN4Vw==",
"license": "BlueOak-1.0.0",
"dependencies": {
"minimatch": "^10.2.2",
"minipass": "^7.1.3",
"path-scurry": "^2.0.2"
},
"engines": {
"node": "18 || 20 || >=22"
},
"funding": {
"url": "https://github.com/sponsors/isaacs"
}
},
"node_modules/rimraf/node_modules/lru-cache": {
"version": "11.5.1",
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-11.5.1.tgz",
"integrity": "sha512-RPimw/7aMdv2oqRrxKwvZXcPfwBrn/JZ2xYcY9Hus/6LaS3VOAKVWKWgNLCFSiOm1ESXinjsDlidVU7JlnCN2A==",
"license": "BlueOak-1.0.0",
"engines": {
"node": "20 || >=22"
}
},
"node_modules/rimraf/node_modules/minimatch": {
"version": "10.2.5",
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-10.2.5.tgz",
"integrity": "sha512-MULkVLfKGYDFYejP07QOurDLLQpcjk7Fw+7jXS2R2czRQzR56yHRveU5NDJEOviH+hETZKSkIk5c+T23GjFUMg==",
"license": "BlueOak-1.0.0",
"dependencies": {
"brace-expansion": "^5.0.5"
},
"engines": {
"node": "18 || 20 || >=22"
},
"funding": {
"url": "https://github.com/sponsors/isaacs"
}
},
"node_modules/rimraf/node_modules/path-scurry": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-2.0.2.tgz",
"integrity": "sha512-3O/iVVsJAPsOnpwWIeD+d6z/7PmqApyQePUtCndjatj/9I5LylHvt5qluFaBT3I5h3r1ejfR056c+FCv+NnNXg==",
"license": "BlueOak-1.0.0",
"dependencies": {
"lru-cache": "^11.0.0",
"minipass": "^7.1.2"
},
"engines": {
"node": "18 || 20 || >=22"
},
"funding": {
"url": "https://github.com/sponsors/isaacs"
}
},
"node_modules/rollup": {
"version": "4.52.3",
"resolved": "https://registry.npmjs.org/rollup/-/rollup-4.52.3.tgz",
@@ -9117,7 +8980,6 @@
"resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.2.tgz",
"integrity": "sha512-dhKf903U/PQZY6boNNtAGdWbG85WAbjT/1xYoZIC7FAY0yWapOBQVsVrDl58W86//e1VpMNBtRV4MaXfdMySFA==",
"license": "Apache-2.0",
"peer": true,
"dependencies": {
"tslib": "^2.1.0"
}
@@ -9154,7 +9016,6 @@
"integrity": "sha512-9GUyuksjw70uNpb1MTYWsH9MQHOHY6kwfnkafC24+7aOMZn9+rVMBxRbLvw756mrBFbIsFg6Xw9IkR2Fnn3k+Q==",
"devOptional": true,
"license": "MIT",
"peer": true,
"dependencies": {
"chokidar": "^4.0.0",
"immutable": "^5.0.2",
@@ -9903,8 +9764,7 @@
"version": "2.8.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
"integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
"license": "0BSD",
"peer": true
"license": "0BSD"
},
"node_modules/tuf-js": {
"version": "3.1.0",
@@ -9954,7 +9814,6 @@
"integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
"dev": true,
"license": "Apache-2.0",
"peer": true,
"bin": {
"tsc": "bin/tsc",
"tsserver": "bin/tsserver"
@@ -10079,12 +9938,6 @@
"integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
"license": "MIT"
},
"node_modules/uzip": {
"version": "0.20201231.0",
"resolved": "https://registry.npmjs.org/uzip/-/uzip-0.20201231.0.tgz",
"integrity": "sha512-OZeJfZP+R0z9D6TmBgLq2LHzSSptGMGDGigGiEe0pr8UBe/7fdflgHlHBNDASTXB5jnFuxHpNaJywSg8YFeGng==",
"license": "MIT"
},
"node_modules/validate-npm-package-license": {
"version": "3.0.4",
"resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz",
@@ -10121,7 +9974,6 @@
"resolved": "https://registry.npmjs.org/vite/-/vite-7.1.11.tgz",
"integrity": "sha512-uzcxnSDVjAopEUjljkWh8EIrg6tlzrjFUfMcR1EVsRDGwf/ccef0qQPRyOrROwhrTDaApueq+ja+KLPlzR/zdg==",
"license": "MIT",
"peer": true,
"dependencies": {
"esbuild": "^0.25.0",
"fdir": "^6.5.0",
@@ -10509,7 +10361,6 @@
"integrity": "sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ==",
"dev": true,
"license": "MIT",
"peer": true,
"funding": {
"url": "https://github.com/sponsors/colinhacks"
}
@@ -10528,8 +10379,7 @@
"version": "0.15.1",
"resolved": "https://registry.npmjs.org/zone.js/-/zone.js-0.15.1.tgz",
"integrity": "sha512-XE96n56IQpJM7NAoXswY3XRLcWFW83xe0BiAOeMD7K5k5xecOeul3Qcpx6GqEeeHNkW5DWL5zOyTbEfB4eti8w==",
"license": "MIT",
"peer": true
"license": "MIT"
}
}
}
+2 -5
View File
@@ -6,7 +6,8 @@
"start": "ng serve",
"build": "ng build",
"watch": "ng build --watch --configuration development",
"openapi": "rimraf src/app/services/api && openapi-generator-cli generate -i http://localhost:5298/swagger/v1/swagger.json -g typescript-angular -o src/app/services/api -c openapi-generator.yaml"
"openapi": "rm -rf src/app/services/api && openapi-generator-cli generate -i http://localhost:5298/swagger/v1/swagger.json -g typescript-angular -o src/app/services/api -c openapi-generator.yaml",
"openapiWin": "set JAVA_TOOL_OPTIONS=-Dcom.sun.net.ssl.checkRevocation=false -Djavax.net.ssl.trustStoreType=WINDOWS-ROOT && openapi-generator-cli generate -i https://localhost:44379/swagger/v1/swagger.json -g typescript-angular -o src/app/services/api -c openapi-generator.yaml\n"
},
"prettier": {
"printWidth": 100,
@@ -31,11 +32,8 @@
"@openapitools/openapi-generator-cli": "^2.25.2",
"@tailwindcss/postcss": "^4.1.17",
"@tailwindcss/vite": "^4.1.17",
"browser-image-compression": "^2.0.2",
"jwt-decode": "^4.0.0",
"ng-zorro-antd": "^20.4.0",
"postcss": "^8.5.6",
"rimraf": "^6.1.3",
"rxjs": "~7.8.0",
"tailwindcss": "^4.1.17",
"tslib": "^2.3.0",
@@ -45,7 +43,6 @@
"@angular/build": "^20.3.9",
"@angular/cli": "^20.3.9",
"@angular/compiler-cli": "^20.3.0",
"baseline-browser-mapping": "^2.10.32",
"less": "^4.2.0",
"typescript": "~5.9.2"
}
+12 -14
View File
@@ -1,21 +1,19 @@
import {ApplicationConfig, provideBrowserGlobalErrorListeners, provideZoneChangeDetection} from '@angular/core';
import {provideRouter} from '@angular/router';
import { ApplicationConfig, provideBrowserGlobalErrorListeners, provideZoneChangeDetection } from '@angular/core';
import { provideRouter } from '@angular/router';
import {routes} from './app.routes';
import {fr_FR, provideNzI18n} from 'ng-zorro-antd/i18n';
import {registerLocaleData} from '@angular/common';
import { routes } from './app.routes';
import { fr_FR, provideNzI18n } from 'ng-zorro-antd/i18n';
import { registerLocaleData } from '@angular/common';
import fr from '@angular/common/locales/fr';
import {provideAnimationsAsync} from '@angular/platform-browser/animations/async';
import {provideHttpClient, withInterceptors} from '@angular/common/http';
import {authInterceptor} from "./interceptors/auth-interceptor";
import { provideAnimationsAsync } from '@angular/platform-browser/animations/async';
import { provideHttpClient } from '@angular/common/http';
registerLocaleData(fr);
export const appConfig: ApplicationConfig = {
providers: [
provideBrowserGlobalErrorListeners(),
provideZoneChangeDetection({eventCoalescing: true}),
provideRouter(routes), provideNzI18n(fr_FR), provideAnimationsAsync(), provideHttpClient(),
provideHttpClient(withInterceptors([authInterceptor]))
]
providers: [
provideBrowserGlobalErrorListeners(),
provideZoneChangeDetection({ eventCoalescing: true }),
provideRouter(routes), provideNzI18n(fr_FR), provideAnimationsAsync(), provideHttpClient()
]
};
+113
View File
@@ -0,0 +1,113 @@
:host {
display: flex;
}
.app-layout {
height: 100vh;
}
nz-header {
display: flex;
align-items: center;
background: #001529;
padding: 0 24px;
}
.header-container {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
}
/* --- LOGO + TITRE --- */
.logo {
display: flex;
align-items: center;
}
.logo a {
display: flex;
align-items: center;
text-decoration: none;
}
.logo img {
height: 40px;
width: auto;
}
.logo h1 {
margin: 0 0 0 10px;
color: #fff;
font-weight: 600;
font-size: 20px;
font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
}
/* --- MENU PRINCIPAL --- */
.top-nav {
flex: 1;
margin: 0 40px;
line-height: 64px;
background: #001529;
border: none;
}
/* Couleur grise par défaut + effet blanc et zoom au survol */
.top-nav li {
transition: transform 0.2s ease, color 0.2s ease;
}
.top-nav li a {
color: #bfbfbf !important; /* gris clair par défaut */
transition: transform 0.2s ease, color 0.2s ease;
}
/* Au survol → zoom + blanc pur */
.top-nav li:hover {
transform: scale(1.08);
background: transparent !important;
color: #fff !important;
}
.top-nav li:hover a {
color: #ffffff !important;
}
/* Supprime toute coloration bleue ou fond par défaut NG-ZORRO */
.top-nav li.ant-menu-item-active,
.top-nav li.ant-menu-item-selected {
background: transparent !important;
color: #fff !important;
}
/* --- ICONES DROITES --- */
.right-icons {
display: flex;
align-items: center;
gap: 20px;
color: #fff;
font-size: 18px;
cursor: pointer;
}
.right-icons app-modal-nav {
transition: transform 0.2s ease, color 0.2s ease;
}
.right-icons app-modal-nav:hover {
color: #40a9ff;
transform: scale(1.2);
}
/* --- CONTENU --- */
nz-content {
padding: 24px 50px;
}
.inner-content {
padding: 24px;
background: #fff;
height: 100%;
}
+90 -1
View File
@@ -1 +1,90 @@
<router-outlet></router-outlet>
<nz-layout class="app-layout">
<nz-header>
<div class="header-container">
<!-- LOGO -->
<div class="logo">
<a routerLink="/welcome">
<img
src="https://www.pyro-fetes.com/wp-content/themes/pcptheme/img/logo-pyro-fetes-OR-top.png"
alt="logo"
style="width: 100px; height: auto"
/>
<h1 class="text-amber-300">PYRO FÊTES</h1>
</a>
</div>
<!-- MENU PRINCIPAL -->
<ul nz-menu class="top-nav" nzTheme="dark" nzMode="horizontal">
<li nz-menu-item routerLinkActive="ant-menu-item-selected">
<a routerLink="/stock">
<nz-icon nzType="stock"></nz-icon>
<span>Stock</span>
</a>
</li>
<li nz-submenu nzTitle="Partenaires" nzIcon="team">
<ul>
<li nz-menu-item routerLinkActive="ant-menu-item-selected">
<a routerLink="/supplier">
<nz-icon nzType="shop"></nz-icon>
<span>Fournisseurs</span>
</a>
</li>
<li nz-menu-item routerLinkActive="ant-menu-item-selected">
<a routerLink="/deliverer">
<nz-icon nzType="car"></nz-icon>
<span>Livreurs</span>
</a>
</li>
</ul>
</li>
<li nz-submenu nzTitle="Recettes" nzIcon="euro-circle">
<ul>
<li nz-menu-item routerLinkActive="ant-menu-item-selected">
<a routerLink="/quotation">
<nz-icon nzType="file"></nz-icon>
<span>Devis</span>
</a>
</li>
<li nz-menu-item routerLinkActive="ant-menu-item-selected">
<a routerLink="/purchase-order">
<nz-icon nzType="file"></nz-icon>
<span>Bon de commande</span>
</a>
</li>
<li nz-menu-item routerLinkActive="ant-menu-item-selected">
<a routerLink="/delivery-note">
<nz-icon nzType="file"></nz-icon>
<span>Bon de livraison</span>
</a>
</li>
</ul>
</li>
<li nz-menu-item routerLinkActive="ant-menu-item-selected">
<a routerLink="/user">
<nz-icon nzType="user"></nz-icon>
<span>Utilisateur</span>
</a>
</li>
</ul>
<!-- ICONES À DROITE -->
<div class="right-icons">
<app-modal-nav nameIcon="bell" name="Notification">
<app-notif-list></app-notif-list>
</app-modal-nav>
<app-modal-nav nameIcon="user" name="Profil">
<app-profil></app-profil>
</app-modal-nav>
<app-modal-nav nameIcon="setting" name="Paramètres">
<app-setting-form></app-setting-form>
</app-modal-nav>
</div>
</div>
</nz-header>
<nz-content>
<div class="inner-content overflow-auto">
<router-outlet></router-outlet>
</div>
</nz-content>
</nz-layout>
+30 -59
View File
@@ -1,70 +1,41 @@
import {Routes} from '@angular/router';
import {authGuard} from "./guards/auth.guard";
import { Routes } from '@angular/router';
export const routes: Routes = [
{
path: '',
pathMatch: 'full',
redirectTo: '/login'
redirectTo: '/welcome'
},
{
path: 'login',
loadComponent: () => import('./pages/login/login').then(x => x.Login)
path: 'welcome',
loadComponent: () => import('./pages/welcome/welcome').then(x => x.Welcome)
},
{
path: '',
loadComponent: () =>
import('./components/layout/layout').then(m => m.Layout),
children: [
{
path: '',
pathMatch: 'full',
redirectTo: '/dashboard'
},
{
path: 'dashboard',
loadComponent: () => import('./pages/dashboard/dashboard').then(m => m.Dashboard),
canActivate: [authGuard]
},
{
path: 'stock',
loadComponent: () => import('./pages/stock/stock').then(m => m.Stock),
canActivate: [authGuard]
},
{
path: 'supplier',
loadComponent: () => import('./pages/supplier/supplier').then(m => m.Supplier),
canActivate: [authGuard]
},
{
path: 'deliverer',
loadComponent: () => import('./pages/deliverer/deliverer').then(m => m.Deliverer),
canActivate: [authGuard]
},
{
path: 'quotation',
loadComponent: () => import('./pages/quotation/quotation').then(m => m.Quotation),
canActivate: [authGuard]
},
{
path: 'purchase-order',
loadComponent: () => import('./pages/purchase-order/purchase-order').then(m => m.PurchaseOrder),
canActivate: [authGuard]
},
{
path: 'delivery-note',
loadComponent: () => import('./pages/delivery-note/delivery-note').then(m => m.DeliveryNote),
canActivate: [authGuard]
},
{
path: 'user',
loadComponent: () => import('./pages/user/user').then(m => m.User),
canActivate: [authGuard],
},
{
path: '**',
redirectTo: 'dashboard'
}
]
path: 'stock',
loadComponent: () => import('./pages/stock/stock').then(x => x.Stock)
},
{
path: 'supplier',
loadComponent: () => import('./pages/supplier/supplier').then(x => x.Supplier)
},
{
path: 'deliverer',
loadComponent: () => import('./pages/deliverer/deliverer').then(x => x.Deliverer)
},
{
path: 'quotation',
loadComponent: () => import('./pages/quotation/quotation').then(x => x.Quotation)
},
{
path: 'purchase-order',
loadComponent: () => import('./pages/purchase-order/purchase-order').then(x => x.PurchaseOrder)
},
{
path: 'delivery-note',
loadComponent: () => import('./pages/delivery-note/delivery-note').then(x => x.DeliveryNote)
},
{
path: 'user',
loadComponent: () => import('./pages/user/user').then(x => x.User)
}
];
+14 -10
View File
@@ -1,13 +1,17 @@
import {Component} from '@angular/core';
import {RouterOutlet} from '@angular/router';
import {NzLayoutModule} from 'ng-zorro-antd/layout';
import {NzMenuModule} from 'ng-zorro-antd/menu';
import { Component } from '@angular/core';
import {RouterLink, RouterLinkActive, RouterOutlet} from '@angular/router';
import { NzLayoutModule } from 'ng-zorro-antd/layout';
import { NzMenuModule } from 'ng-zorro-antd/menu';
import {NzIconDirective} from "ng-zorro-antd/icon";
import {ModalNav} from "./components/modal-nav/modal-nav";
import {Profil} from "./components/profil/profil";
import {NotifList} from "./components/notif-list/notif-list";
import {SettingForm} from "./components/setting-form/setting-form";
@Component({
selector: 'app-root',
imports: [RouterOutlet, NzLayoutModule, NzMenuModule],
templateUrl: './app.html',
styleUrl: './app.css'
selector: 'app-root',
imports: [RouterOutlet, NzLayoutModule, NzMenuModule, NzIconDirective, RouterLinkActive, RouterLink, ModalNav, Profil, NotifList, SettingForm],
templateUrl: './app.html',
styleUrl: './app.css'
})
export class App {
}
export class App {}
@@ -1,40 +0,0 @@
<form [formGroup]="addProductForm">
<nz-form-item nz-flex>
<nz-form-label nzSpan="12" nzRequired>
Fournisseur
</nz-form-label>
<nz-form-control nzSpan="12" nzErrorTip="Ce champ est requis">
<nz-select formControlName="supplierId" nzPlaceHolder="Choisir un fournisseur" nzShowSearch>
@for (supplier of suppliers(); track supplier.id) {
<nz-option [nzLabel]="supplier.name" [nzValue]="supplier.id"></nz-option>
}
</nz-select>
</nz-form-control>
</nz-form-item>
<div class="overflow-x-auto mt-6">
<nz-table [nzBordered]="true" class="mx-auto text-center">
<thead>
<tr>
<th class="text-center">Produit</th>
<th class="text-center">Prix</th>
</tr>
</thead>
<tbody formArrayName="lines">
@for (line of lines.controls; let i = $index; track i) {
<tr [formGroupName]="i" class="text-center">
<td class="text-center">{{ line.value.name }}</td>
<td class="text-center">
<nz-input-number
formControlName="price"
[nzMin]="0"
[nzStep]="1">
</nz-input-number>
</td>
</tr>
}
</tbody>
</nz-table>
</div>
</form>
@@ -1,54 +0,0 @@
import {Component, input} from '@angular/core';
import {FormArray, FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms";
import {GetProductDto, GetSupplierDto} from "../../services/api";
import {NzColDirective, NzRowDirective} from "ng-zorro-antd/grid";
import {NzFormControlComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
import {NzFlexDirective} from "ng-zorro-antd/flex";
import {NzTableComponent} from "ng-zorro-antd/table";
import {NzInputNumberComponent} from "ng-zorro-antd/input-number";
import {NzOptionComponent, NzSelectComponent} from "ng-zorro-antd/select";
@Component({
selector: 'app-add-product-supplier-form',
imports: [
NzRowDirective,
NzFormControlComponent,
NzFormLabelComponent,
ReactiveFormsModule,
NzFlexDirective,
NzColDirective,
NzTableComponent,
NzInputNumberComponent,
NzOptionComponent,
NzSelectComponent
],
templateUrl: './add-product-supplier-form.html',
styleUrl: './add-product-supplier-form.css',
})
export class AddProductSupplierForm {
addProductForm: FormGroup = new FormGroup({
supplierId: new FormControl<number>(null, Validators.required),
lines: new FormArray([], Validators.required),
});
suppliers = input.required<GetSupplierDto[]>();
products = input.required<GetProductDto[]>();
get lines(): FormArray {
return this.addProductForm.get('lines') as FormArray;
}
addProductToForm() {
this.lines.clear();
this.products().forEach(x => {
this.lines.push(
new FormGroup({
productId: new FormControl(x.id),
name: new FormControl(x.name),
price: new FormControl(0, [Validators.required, Validators.min(0)])
})
);
});
}
}
@@ -1,53 +0,0 @@
<form [formGroup]="createPurchaseOrderForm">
<nz-form-item nz-flex>
<nz-form-label nzSpan="12" nzRequired>
Conditions générales de vente
</nz-form-label>
<nz-form-control nzSpan="12" nzErrorTip="Ce champ est requis">
<input nz-input placeholder="Conditions générales de vente" formControlName="purchaseConditions">
</nz-form-control>
</nz-form-item>
<nz-form-item nz-flex>
<nz-form-label nzSpan="12" nzRequired>
Fournisseur
</nz-form-label>
<nz-form-control nzSpan="12" nzErrorTip="Ce champ est requis">
<nz-select formControlName="supplierId"
(ngModelChange)="refresh()"
[nzPlaceHolder]="getBestSupplier().name ?? 'Choisir un fournisseur'"
nzShowSearch>
@for (supplier of suppliers(); track supplier.id) {
<nz-option [nzLabel]="supplier.name" [nzValue]="supplier.id"></nz-option>
}
</nz-select>
</nz-form-control>
</nz-form-item>
<div class="overflow-x-auto">
<nz-table [nzBordered]="true" class="mx-auto text-center">
<thead>
<tr>
<th class="text-center">Produit</th>
<th class="text-center">Quantité</th>
</tr>
</thead>
<tbody formArrayName="lines">
@for (line of lines.controls; let i = $index; track i) {
<tr [formGroupName]="i" class="text-center">
<td class="text-center">{{ line.value.name }}</td>
<td class="text-center">
<nz-input-number
formControlName="quantity"
[nzMin]="1"
[nzStep]="1">
</nz-input-number>
</td>
</tr>
}
</tbody>
</nz-table>
</div>
</form>
@@ -1,93 +0,0 @@
import {Component, input, OnInit, signal} from '@angular/core';
import {FormBuilder, FormGroup, FormArray, Validators, ReactiveFormsModule, FormControl} from '@angular/forms';
import {GetProductDto, GetSupplierDto} from '../../services/api';
import {NzTableComponent} from "ng-zorro-antd/table";
import {NzInputNumberComponent} from "ng-zorro-antd/input-number";
import {NzColDirective} from "ng-zorro-antd/grid";
import {NzFlexDirective} from "ng-zorro-antd/flex";
import {NzFormControlComponent, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
import {NzInputDirective} from "ng-zorro-antd/input";
import {NzOptionComponent, NzSelectComponent} from "ng-zorro-antd/select";
import {min} from "rxjs";
@Component({
selector: 'app-create-purchaseorder-form',
templateUrl: './create-purchaseorder-form.html',
styleUrl: './create-purchaseorder-form.css',
imports: [
ReactiveFormsModule,
NzTableComponent,
NzInputNumberComponent,
NzColDirective,
NzFlexDirective,
NzFormControlComponent,
NzFormItemComponent,
NzFormLabelComponent,
NzInputDirective,
NzOptionComponent,
NzSelectComponent,
]
})
export class CreatePurchaseorderForm {
suppliers = input.required<GetSupplierDto[]>();
products = input.required<GetProductDto[]>();
getBestSupplier() {
let bestSupplier: GetSupplierDto = this.suppliers()[0];
let maxProducts = 0;
const selectedProducts = this.products().map(x => x.id);
this.suppliers().forEach(x => {
const supplierProductsCount = x.prices.filter(p => selectedProducts.includes(p.productId)).length ?? 0;
if (supplierProductsCount > maxProducts) {
maxProducts = supplierProductsCount;
bestSupplier = x;
}
})
return bestSupplier;
}
getProductsOfSupplier() {
const supplier = this.suppliers().find(x => x.id === this.createPurchaseOrderForm.value.supplierId);
if (!supplier) return [];
const supplierProductIds = supplier.prices.map(x => x.productId);
return this.products().filter(product => supplierProductIds.includes(product.id));
}
createPurchaseOrderForm: FormGroup = new FormGroup({
purchaseConditions: new FormControl<string | null>(null, Validators.required),
lines: new FormArray([], Validators.required),
supplierId: new FormControl<number>(null, Validators.required),
})
get lines(): FormArray {
return this.createPurchaseOrderForm.get('lines') as FormArray;
}
addProductToForm() {
const supplierId = this.createPurchaseOrderForm.value.supplierId ?? this.getBestSupplier().id;
this.createPurchaseOrderForm.patchValue({
supplierId
});
this.refresh();
}
refresh() {
this.lines.clear();
this.getProductsOfSupplier().forEach(x => {
this.lines.push(
new FormGroup({
productId: new FormControl(x.id),
name: new FormControl(x.name),
quantity: new FormControl(1, [Validators.required, Validators.min(1)])
})
);
});
}
}
@@ -1,62 +0,0 @@
<form [formGroup]="createQuotationForm">
<nz-form-item nz-flex>
<nz-form-label nzSpan="12" nzRequired>
Client
</nz-form-label>
<nz-form-control nzSpan="12" nzErrorTip="Ce champ est requis">
<nz-select formControlName="customerId" nzPlaceHolder="Choisir un client"
nzShowSearch>
@for (customer of customers(); track customer.id) {
<nz-option [nzLabel]="customer.note" [nzValue]="customer.id"></nz-option>
}
</nz-select>
</nz-form-control>
</nz-form-item>
<nz-form-item nz-flex>
<nz-form-label nzSpan="12" nzRequired>
Message
</nz-form-label>
<nz-form-control nzSpan="12" nzErrorTip="Ce champ est requis">
<input nz-input placeholder="Message" formControlName="message">
</nz-form-control>
</nz-form-item>
<nz-form-item nz-flex>
<nz-form-label nzSpan="12" nzRequired>
Conditions générales
</nz-form-label>
<nz-form-control nzSpan="12" nzErrorTip="Ce champ est requis">
<input nz-input placeholder="Conditions générales de vente" formControlName="conditionsSale">
</nz-form-control>
</nz-form-item>
<div class="overflow-x-auto">
<nz-table [nzBordered]="true" class="mx-auto text-center">
<thead>
<tr>
<th class="text-center">Produit</th>
<th class="text-center">Quantité</th>
</tr>
</thead>
<tbody formArrayName="lines">
@for (line of lines.controls; let i = $index; track i) {
<tr [formGroupName]="i" class="text-center">
<td class="text-center">{{ line.value.name }}</td>
<td class="text-center">
<nz-input-number
formControlName="quantity"
[nzMin]="1"
[nzStep]="1">
</nz-input-number>
</td>
</tr>
}
</tbody>
</nz-table>
</div>
</form>
@@ -1,105 +0,0 @@
import {Component, inject, input, OnInit, signal} from '@angular/core';
import {
FormArray,
FormBuilder,
FormControl,
FormGroup,
FormsModule,
ReactiveFormsModule,
Validators
} from "@angular/forms";
import {NzColDirective} from "ng-zorro-antd/grid";
import {NzFlexDirective} from "ng-zorro-antd/flex";
import {NzFormControlComponent, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
import {NzInputDirective} from "ng-zorro-antd/input";
import {NzInputNumberComponent} from "ng-zorro-antd/input-number";
import {NzTableComponent} from "ng-zorro-antd/table";
import {CustomersService, GetCustomerDto, GetProductDto, GetSupplierDto} from "../../services/api";
import {NzOptionComponent, NzSelectComponent} from "ng-zorro-antd/select";
import {firstValueFrom} from "rxjs";
import {NzNotificationService} from "ng-zorro-antd/notification";
@Component({
selector: 'app-create-quotation-form',
imports: [
FormsModule,
NzColDirective,
NzFlexDirective,
NzFormControlComponent,
NzFormItemComponent,
NzFormLabelComponent,
NzInputDirective,
NzInputNumberComponent,
NzTableComponent,
ReactiveFormsModule,
NzOptionComponent,
NzSelectComponent
],
templateUrl: './create-quotation-form.html',
styleUrl: './create-quotation-form.css',
})
export class CreateQuotationForm implements OnInit {
private customersService = inject(CustomersService);
private notificationService = inject(NzNotificationService);
suppliers = input.required<GetSupplierDto[]>();
products = input.required<GetProductDto[]>();
customers = signal<GetCustomerDto[]>([]);
async ngOnInit() {
try {
const customers = await firstValueFrom(this.customersService.getAllCustomersEndpoint())
this.customers.set(customers);
} catch {
this.notificationService.error('Erreur', 'Erreur de communication avec l\'API')
}
}
createQuotationForm: FormGroup = new FormGroup({
message: new FormControl<string>(null, Validators.required),
conditionsSale: new FormControl<string>(null, Validators.required),
supplierId: new FormControl<number>(null, Validators.required),
customerId: new FormControl<number>(null, Validators.required),
lines: new FormArray([], Validators.required),
})
get lines(): FormArray {
return this.createQuotationForm.get('lines') as FormArray;
}
getDefaultSupplier() {
let defaultSupplier: GetSupplierDto = this.suppliers()[0];
let maxProducts = 0;
const selectedProducts = this.products().map(x => x.id);
this.suppliers().forEach(x => {
const supplierProductsCount = x.prices.filter(p => selectedProducts.includes(p.productId)).length ?? 0;
if (supplierProductsCount > maxProducts) {
maxProducts = supplierProductsCount;
defaultSupplier = x;
}
})
return defaultSupplier;
}
addProductToForm() {
this.lines.clear();
this.products().forEach(x => {
this.lines.push(
new FormGroup({
productId: new FormControl(x.id),
name: new FormControl(x.name),
quantity: new FormControl(1, [Validators.required, Validators.min(1)])
})
);
});
this.createQuotationForm.patchValue({
supplierId: this.getDefaultSupplier().id,
});
}
}
@@ -1,15 +0,0 @@
<form [formGroup]="choiceDelivererForm">
<nz-form-item nz-flex>
<nz-form-label nzSpan="12" nzRequired>
Transporteur
</nz-form-label>
<nz-form-control nzSpan="12" nzErrorTip="Ce champ est requis">
<nz-select formControlName="delivererId" nzPlaceHolder="Choisir un transporteur" nzShowSearch>
@for (deliverer of deliverers(); track deliverer.id) {
<nz-option [nzLabel]="deliverer.transporter" [nzValue]="deliverer.id"></nz-option>
}
</nz-select>
</nz-form-control>
</nz-form-item>
</form>
@@ -1,45 +0,0 @@
import {Component, inject, OnInit, signal} from '@angular/core';
import {FormControl, FormGroup, FormsModule, ReactiveFormsModule, Validators} from "@angular/forms";
import {NzColDirective, NzRowDirective} from "ng-zorro-antd/grid";
import {NzFlexDirective} from "ng-zorro-antd/flex";
import {NzFormControlComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
import {NzOptionComponent, NzSelectComponent} from "ng-zorro-antd/select";
import {DeliverersService, GetDelivererDto} from "../../services/api";
import {firstValueFrom} from "rxjs";
import {NzNotificationService} from "ng-zorro-antd/notification";
@Component({
selector: 'app-deliverer-choice',
imports: [
FormsModule,
NzColDirective,
NzFlexDirective,
NzFormControlComponent,
NzFormLabelComponent,
NzOptionComponent,
NzRowDirective,
NzSelectComponent,
ReactiveFormsModule
],
templateUrl: './deliverer-choice.html',
styleUrl: './deliverer-choice.css',
})
export class DelivererChoice implements OnInit {
private deliverersService = inject(DeliverersService);
private notificationService = inject(NzNotificationService);
choiceDelivererForm: FormGroup = new FormGroup({
delivererId: new FormControl<number>(null, Validators.required),
});
deliverers = signal<GetDelivererDto[]>([]);
async ngOnInit() {
try {
const deliverers = await firstValueFrom(this.deliverersService.getAllDelivererEndpoint());
this.deliverers.set(deliverers);
} catch {
this.notificationService.error('Erreur', 'Erreur lors de l\'affichage des livreurs');
}
}
}
@@ -7,7 +7,7 @@ import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/
import {GetDelivererDto} from "../../services/api";
@Component({
selector: 'app-deliverer-form',
selector: 'app-deliverer-form',
imports: [
NzColDirective,
NzFlexDirective,
@@ -18,16 +18,15 @@ import {GetDelivererDto} from "../../services/api";
NzInputDirective,
ReactiveFormsModule
],
templateUrl: './deliverer-form.html',
styleUrl: './deliverer-form.css',
templateUrl: './deliverer-form.html',
styleUrl: './deliverer-form.css',
})
export class DelivererForm {
delivererForm: FormGroup = new FormGroup({
transporter: new FormControl<string>(null, [Validators.required])
})
deliverer = input<GetDelivererDto>();
deliverer= input<GetDelivererDto>();
constructor() {
effect(() => {
if (this.deliverer()) {
@@ -6,7 +6,7 @@ nz-table {
background: #fff;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
box-shadow: 0 2px 6px rgba(0,0,0,0.1);
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
@@ -66,21 +66,18 @@ nz-table tbody td p {
nz-table thead {
display: none;
}
nz-table tbody tr {
display: block;
margin-bottom: 16px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 1px 3px rgba(0,0,0,0.1);
border-radius: 8px;
padding: 12px;
}
nz-table tbody td {
display: flex;
justify-content: space-between;
padding: 6px 12px;
}
nz-table tbody td::before {
content: attr(data-label);
font-weight: 600;
@@ -1,6 +1,6 @@
<nz-table [nzData]="deliverers()"
[nzFrontPagination]="false"
[nzLoading]="deliverersLoading()">
<nz-table [nzData]="deliverers()"
[nzFrontPagination]="false"
[nzLoading]="deliverersLoading()">
<thead>
<tr class="text-center">
<th>Transporteur</th>
@@ -11,12 +11,12 @@
<tbody class="text-center">
@for (deliverer of deliverers(); track deliverer.id) {
<tr>
<td>{{ deliverer.transporter }}</td>
<td>{{deliverer.transporter}}</td>
<td>
<app-modal-button type="link" name="Voir tout les bons de livraison" size="50%">
<div style="max-height: 400px; overflow-y: auto;">
<nz-table [nzData]="deliverers()"
[nzFrontPagination]="false">
[nzFrontPagination]="false">
<thead>
<tr class="text-center">
<th>Numéro de livraison</th>
@@ -28,10 +28,10 @@
<tbody class="text-center">
@for (deliveryInfo of deliverer.deliveryNotes; track deliveryInfo.id) {
<tr>
<td>{{ deliveryInfo.trackingNumber }}</td>
<td>{{ deliveryInfo.expeditionDate | date: 'dd/MM/yyyy' }}</td>
<td>{{ deliveryInfo.estimateDeliveryDate | date: 'dd/MM/yyyy' }}</td>
<td>{{ deliveryInfo.realDeliveryDate | date: 'dd/MM/yyyy' }}</td>
<td>{{deliveryInfo.trackingNumber}}</td>
<td>{{deliveryInfo.expeditionDate | date: 'dd/MM/yyyy'}}</td>
<td>{{deliveryInfo.estimateDeliveryDate | date: 'dd/MM/yyyy'}}</td>
<td>{{deliveryInfo.realDeliveryDate | date: 'dd/MM/yyyy'}}</td>
</tr>
}
</tbody>
@@ -41,13 +41,9 @@
</td>
<td>
<div style="justify-content: center; display: flex">
<nz-icon nzType="edit" nzTheme="outline" class="cursor-pointer"
(click)="openEditModal(deliverer)"></nz-icon>
@if (admin()){
<nz-divider nzType="vertical"></nz-divider>
<nz-icon nzType="delete" nzTheme="outline" (click)="delete(deliverer.id)"
class="text-red-600 cursor-pointer"></nz-icon>
}
<nz-icon nzType="edit" nzTheme="outline" class="cursor-pointer" (click)="openEditModal(deliverer)"></nz-icon>
<nz-divider nzType="vertical"></nz-divider>
<nz-icon nzType="delete" nzTheme="outline" (click)="delete(deliverer.id)" class="text-red-600 cursor-pointer"></nz-icon>
</div>
</td>
</tr>
@@ -56,8 +52,7 @@
</nz-table>
<div class="hidden">
<app-modal-nav #modalNav nameIcon="edit" [name]="'Modifier'"
(ok)="onModalOk(selectedDeliverer.id, delivererForm, modalNav)" (cancel)="onModalCancel(modalNav)">
<app-modal-nav #modalNav nameIcon="edit" [name]="'Modifier'" (ok)="onModalOk(selectedDeliverer.id, delivererForm, modalNav)" (cancel)="onModalCancel(modalNav)">
<app-deliverer-form #delivererForm [deliverer]="selectedDeliverer"></app-deliverer-form>
</app-modal-nav>
</div>
@@ -9,10 +9,10 @@ import {DelivererForm} from "../deliverer-form/deliverer-form";
import {DeliverersService, GetDelivererDto, GetSupplierDto} from "../../services/api";
import {NzNotificationService} from "ng-zorro-antd/notification";
import {firstValueFrom} from "rxjs";
import {AuthService} from "../../services/auth.service";
import {SupplierForm} from "../supplier-form/supplier-form";
@Component({
selector: 'app-deliverer-table',
selector: 'app-deliverer-table',
imports: [
ModalNav,
NzDividerComponent,
@@ -22,24 +22,20 @@ import {AuthService} from "../../services/auth.service";
DatePipe,
DelivererForm,
],
templateUrl: './deliverer-table.html',
styleUrl: './deliverer-table.css',
templateUrl: './deliverer-table.html',
styleUrl: './deliverer-table.css',
})
export class DelivererTable implements OnInit {
private deliverersService = inject(DeliverersService);
private notificationService = inject(NzNotificationService)
private authService = inject(AuthService);
deliverers = signal<GetDelivererDto[]>([]);
deliverersLoading = signal<boolean>(false);
admin = signal<boolean>(false);
updateDeliverer = viewChild.required<DelivererForm>('delivererForm');
modal = viewChild.required<ModalNav>('modalNav');
async ngOnInit() {
await this.fetchDeliverers();
this.admin.set(this.authService.isAdmin());
}
async fetchDeliverers() {
@@ -48,17 +44,23 @@ export class DelivererTable implements OnInit {
try {
const deliverers = await firstValueFrom(this.deliverersService.getAllDelivererEndpoint())
this.deliverers.set(deliverers);
} catch {
this.notificationService.error('Erreur', 'Erreur lors du chargement des transporteurs');
} catch (e) {
this.notificationService.error(
'Erreur',
'Erreur de communication avec l\'API'
)
}
this.deliverersLoading.set(false)
}
async delete(deliverer: number) {
async delete(deliverer:number) {
try {
await firstValueFrom(this.deliverersService.deleteDelivererEndpoint(deliverer))
this.notificationService.success('Success', 'Suppression effectuée');
} catch {
this.notificationService.success(
'Success',
'Suppression effectuée'
)
} catch (e) {
this.notificationService.error(
'Erreur',
'Impossible de supprimer la ligne'
@@ -69,24 +71,34 @@ export class DelivererTable implements OnInit {
async edit(id: number, updateDelivererComponent: DelivererForm) {
if (updateDelivererComponent.delivererForm.invalid) {
this.notificationService.error('Erreur', 'Formulaire invalide');
this.notificationService.error(
'Erreur',
'Erreur d\'écriture dans le formulaire'
)
return;
}
try {
const deliverers = updateDelivererComponent.delivererForm.getRawValue();
await firstValueFrom(this.deliverersService.updateDelivererEndpoint(id, deliverers))
this.notificationService.success('Success', 'Transporteur modifié')
} catch {
this.notificationService.error('Erreur', 'Erreur lors de la modification')
this.notificationService.success(
'Success',
'Transporteur modifié'
)
} catch (e) {
console.error(e);
this.notificationService.error(
'Erreur',
'Erreur lors de la modification'
)
}
}
selectedDeliverer: GetDelivererDto | null = null;
openEditModal(supplier: GetSupplierDto) {
this.selectedDeliverer = {...supplier};
this.selectedDeliverer = { ...supplier };
this.modal().showModal();
}
@@ -95,7 +107,7 @@ export class DelivererTable implements OnInit {
await this.edit(supplierId, updateDelivererComponent);
updateDelivererComponent.delivererForm.reset();
this.onModalCancel(modal);
modal.isVisible = false;
await this.fetchDeliverers();
}
@@ -5,7 +5,7 @@
</nz-form-label>
<nz-form-control nzSpan="9" nzErrorTip="Ce champ est requis">
<nz-select formControlName="delivererId" nzPlaceHolder="Choisir un transporteur" nzShowSearch>
<nz-select formControlName="deliverer" [nzPlaceHolder]="'Choisir un transporteur'" nzShowSearch [nzFilterOption]="filter">
@for (deliverer of deliverers(); track deliverer.id) {
<nz-option [nzValue]="deliverer.id" [nzLabel]="deliverer.transporter"></nz-option>
}
@@ -1,16 +1,16 @@
import {Component, effect, inject, input, OnInit, signal} from '@angular/core';
import {Component, inject, signal} from '@angular/core';
import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms";
import {NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
import {NzColDirective} from "ng-zorro-antd/grid";
import {NzFlexDirective} from "ng-zorro-antd/flex";
import {NzDatePickerComponent} from "ng-zorro-antd/date-picker";
import {NzOptionComponent, NzSelectComponent} from "ng-zorro-antd/select";
import {DeliverersService, GetDelivererDto, GetDeliveryNoteDto} from "../../services/api";
import {DeliverersService, GetDelivererDto} from "../../services/api";
import {NzNotificationService} from "ng-zorro-antd/notification";
import {firstValueFrom} from "rxjs";
@Component({
selector: 'app-deliverery-note-form',
selector: 'app-deliverery-note-form',
imports: [
NzFormItemComponent,
NzFormLabelComponent,
@@ -21,32 +21,28 @@ import {firstValueFrom} from "rxjs";
ReactiveFormsModule,
NzDatePickerComponent,
NzSelectComponent,
NzOptionComponent,
NzOptionComponent
],
templateUrl: './deliverery-note-form.html',
styleUrl: './deliverery-note-form.css',
templateUrl: './deliverery-note-form.html',
styleUrl: './deliverery-note-form.css',
})
export class DelivereryNoteForm implements OnInit {
export class DelivereryNoteForm {
deliveryNoteForm: FormGroup = new FormGroup({
trackingNumber: new FormControl<string>(null),
delivererId: new FormControl<number>(null, [Validators.required]),
expeditionDate: new FormControl(null, [Validators.required]),
estimatedDate: new FormControl(null, [Validators.required]),
deliverer: new FormControl<string>(null,[Validators.required]),
expeditionDate: new FormControl(null,[Validators.required]),
estimatedDate: new FormControl(null),
realDeliveryDate: new FormControl(null)
})
private deliverersService = inject(DeliverersService);
private notificationService = inject(NzNotificationService);
deliverers = signal<GetDelivererDto[]>([]);
deliveryNote = input<GetDeliveryNoteDto>();
async fetchDeliverers() {
try {
const deliverers = await firstValueFrom(this.deliverersService.getAllDelivererEndpoint());
this.deliverers.set(deliverers);
} catch {
} catch (e) {
this.notificationService.error('Erreur', 'Impossible de récupérer les transporteurs');
}
}
@@ -55,18 +51,7 @@ export class DelivereryNoteForm implements OnInit {
await this.fetchDeliverers();
}
constructor() {
effect(() => {
if (this.deliveryNote()) {
this.deliveryNoteForm.patchValue({
trackingNumber: this.deliveryNote().trackingNumber,
expeditionDate: this.deliveryNote().expeditionDate,
realDeliveryDate: this.deliveryNote().realDeliveryDate,
estimatedDate: this.deliveryNote().estimateDeliveryDate,
delivererId: this.deliveryNote().delivererId
});
}
});
filter(input: string, option: any) {
return option.nzLabel.toLowerCase().includes(input.toLowerCase());
}
}
@@ -6,7 +6,7 @@ nz-table {
background: #fff;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
box-shadow: 0 2px 6px rgba(0,0,0,0.1);
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
@@ -66,21 +66,18 @@ nz-table tbody td p {
nz-table thead {
display: none;
}
nz-table tbody tr {
display: block;
margin-bottom: 16px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 1px 3px rgba(0,0,0,0.1);
border-radius: 8px;
padding: 12px;
}
nz-table tbody td {
display: flex;
justify-content: space-between;
padding: 6px 12px;
}
nz-table tbody td::before {
content: attr(data-label);
font-weight: 600;
@@ -1,61 +1,71 @@
<nz-table [nzData]="deliveryNotes()"
class="mr-7"
[nzFrontPagination]="false"
[nzLoading]="deliveryNotesLoading()">
<nz-table [nzData]="deliveryNotes()"
class="mr-7"
[nzFrontPagination]="false"
[nzLoading]="deliveryNotesLoading()">
<thead>
<tr class="text-center">
<th>Numéro de livraison</th>
<th>Transporteur</th>
<th>Date d'expédition</th>
<th>Date de livraison estimée</th>
<th>Date de livraison réelle</th>
<th>Statut</th>
<th>Action</th>
</tr>
</thead>
<tr class="text-center">
<th>Numéro de livraison</th>
<th>Transporteur</th>
<th>Date d'expédition</th>
<th>Date de livraison estimée</th>
<th>Date de livraison réelle</th>
<th>Produits</th>
<th>Action</th>
</tr>
</thead >
<tbody class="text-center">
@for (deliveryNote of deliveryNotes(); track deliveryNote.id) {
<tr>
<td>{{ deliveryNote.trackingNumber }}</td>
<td>{{ deliveryNote.delivererTransporter }}</td>
<td>{{ deliveryNote.expeditionDate | date: 'dd/MM/yyyy' }}</td>
<td>{{ deliveryNote.estimateDeliveryDate | date: 'dd/MM/yyyy' }}</td>
<td>{{ deliveryNote.realDeliveryDate | date: 'dd/MM/yyyy' }}</td>
<td>{{deliveryNote.trackingNumber}}</td>
<td>{{deliveryNote.delivererTransporter}}</td>
<td>{{deliveryNote.expeditionDate | date: 'dd/MM/yyyy'}}</td>
<td>{{deliveryNote.estimateDeliveryDate | date: 'dd/MM/yyyy'}}</td>
<td>{{deliveryNote.realDeliveryDate | date: 'dd/MM/yyyy'}}</td>
<td>
@if (deliveryNote.estimateDeliveryDate >= date && deliveryNote.realDeliveryDate == null) {
<p class="text-blue-900 font-semibold">En cours</p>
} @else if (deliveryNote.realDeliveryDate == null) {
<p class="text-red-600 font-semibold">En retard</p>
} @else {
<p class="text-green-800 font-semibold">Terminée</p>
}
<app-modal-button type="link" name="Voir les produits" size="40%">
<div style="max-height: 400px; overflow-y: auto;">
<nz-table [nzData]="deliveryNotes()"
[nzFrontPagination]="false">
<thead>
<tr class="text-center">
<th>Réference</th>
<th>Nom</th>
<th>Quantité</th>
</tr>
</thead>
<tbody class="text-center">
@for (product of deliveryNote.products; track product.productId) {
<tr>
<td>{{product.productReference}}</td>
<td>{{product.productName}}</td>
<td>{{product.quantity}}</td>
</tr>
}
</tbody>
</nz-table>
</div>
</app-modal-button>
</td>
<td>
<div style="justify-content: center; display: flex">
<nz-icon nzType="check" nzTheme="outline" (click)="validate(deliveryNote.id)"
class="cursor-pointer text-green-700"/>
<div>
<nz-icon nzType="check" nzTheme="outline" (click)="validate(deliveryNote.id)" class="cursor-pointer text-green-700"/>
</div>
<nz-divider nzType="vertical"></nz-divider>
<nz-icon nzType="edit" nzTheme="outline" class="cursor-pointer"
(click)="openEditModal(deliveryNote)"></nz-icon>
<app-modal-nav nameIcon="edit" name="Modification du bon de livraison" class="cursor-pointer">
<app-deliverery-note-form></app-deliverery-note-form>
</app-modal-nav>
<nz-divider nzType="vertical"></nz-divider>
@if (admin()){
<nz-icon nzType="delete" nzTheme="outline" (click)="delete(deliveryNote.id)"
class="cursor-pointer text-red-700"/>
<nz-divider nzType="vertical"></nz-divider>
}
<nz-icon nzType="export" nzTheme="outline" (click)="export(deliveryNote.id)"
class="cursor-pointer text-green-700"/>
<div>
<nz-icon nzType="delete" nzTheme="outline" (click)="delete(deliveryNote.id)" class="cursor-pointer text-red-700"/>
</div>
<nz-divider nzType="vertical"></nz-divider>
<div>
<nz-icon nzType="export" nzTheme="outline" (click)="export(deliveryNote.id)" class="cursor-pointer text-green-700"/>
</div>
</div>
</td>
</tr>
}
</tbody>
</nz-table>
<div class="hidden">
<app-modal-nav #modalNav nameIcon="edit" [name]="'Modifier un bon de livraison'"
(ok)="onModalOk(selectedDeliveryNote.id, deliveryNoteForm, modalNav)"
(cancel)="onModalCancel(modalNav)">
<app-deliverery-note-form #deliveryNoteForm [deliveryNote]="selectedDeliveryNote"></app-deliverery-note-form>
</app-modal-nav>
</div>
@@ -1,20 +1,21 @@
import {Component, inject, OnInit, signal, viewChild} from '@angular/core';
import {Component, inject, OnInit, signal} from '@angular/core';
import {DatePipe} from "@angular/common";
import {ModalButton} from "../modal-button/modal-button";
import {ModalNav} from "../modal-nav/modal-nav";
import {NzDividerComponent} from "ng-zorro-antd/divider";
import {NzIconDirective} from "ng-zorro-antd/icon";
import {NzTableComponent} from "ng-zorro-antd/table";
import {DelivereryNoteForm} from "../deliverery-note-form/deliverery-note-form";
import {DeliverynotesService, GetDeliveryNoteDto, UpdateDeliveryNoteDto} from "../../services/api";
import {DeliverynotesService, GetDeliveryNoteDto} from "../../services/api";
import {NzNotificationService} from "ng-zorro-antd/notification";
import {firstValueFrom} from "rxjs";
import {format} from "date-fns";
import {FileService} from "../../services/file.service";
import {AuthService} from "../../services/auth.service";
@Component({
selector: 'app-deliverery-note-table',
selector: 'app-deliverery-note-table',
imports: [
ModalButton,
ModalNav,
NzDividerComponent,
NzIconDirective,
@@ -22,52 +23,53 @@ import {AuthService} from "../../services/auth.service";
DelivereryNoteForm,
DatePipe,
],
templateUrl: './deliverery-note-table.html',
styleUrl: './deliverery-note-table.css',
templateUrl: './deliverery-note-table.html',
styleUrl: './deliverery-note-table.css',
})
export class DelivereryNoteTable implements OnInit {
private deliveryNotesService = inject(DeliverynotesService);
private notificationService = inject(NzNotificationService);
private fileService = inject(FileService);
private authService = inject(AuthService);
deliveryNotes = signal<GetDeliveryNoteDto[]>([]);
deliveryNotesLoading = signal<boolean>(false);
admin = signal<boolean>(false);
modal = viewChild.required<ModalNav>('modalNav');
date = new Date().toISOString().split('T')[0]; // yyyy-mm-dd
async ngOnInit() {
await this.fetchDeliveryNotes();
this.admin.set(this.authService.isAdmin());
}
async fetchDeliveryNotes() {
this.deliveryNotesLoading.set(true)
try {
const deliveryNotes = await firstValueFrom(this.deliveryNotesService.getAllDeliveryNoteEndpoint());
const deliveryNotes = await firstValueFrom(this.deliveryNotesService.getAllDeliveryNoteEndpoint())
this.deliveryNotes.set(deliveryNotes);
} catch {
this.notificationService.error('Erreur', 'Erreur lors du chargement des bons de livraison');
} catch (e) {
this.notificationService.error(
'Erreur',
'Erreur de communication avec l\'API'
)
}
this.deliveryNotesLoading.set(false)
}
async delete(deliveryNote: number) {
async delete(deliveryNote:number) {
this.deliveryNotesLoading.set(true)
try {
await firstValueFrom(this.deliveryNotesService.deleteDeliveryNoteEndpoint(deliveryNote));
this.notificationService.success('Success', 'Suppression effectuée');
} catch {
this.notificationService.error('Erreur', 'Impossible de supprimer la ligne');
this.notificationService.success(
'Success',
'Suppression effectuée'
)
} catch (e) {
this.notificationService.error(
'Erreur',
'Impossible de supprimer la ligne'
)
}
this.deliveryNotesLoading.set(false)
await this.fetchDeliveryNotes();
}
async validate(deliveryNote: number) {
async validate(deliveryNote:number) {
this.deliveryNotesLoading.set(true)
try {
const PatchRealDate = {
@@ -76,12 +78,22 @@ export class DelivereryNoteTable implements OnInit {
try {
await firstValueFrom(this.deliveryNotesService.patchRealDeliveryDateEndpoint(deliveryNote, PatchRealDate))
this.notificationService.success('Success', 'Date actualisée');
} catch {
this.notificationService.error('Erreur', 'La date à déjà été actualisée');
this.notificationService.success(
'Success',
'Date actualisée'
)
} catch (e) {
this.notificationService.error(
'Erreur',
'La date à déjà été actualisée'
)
}
} catch {
this.notificationService.error('Erreur', 'Erreur d\'actualisation de la date');
} catch (e) {
this.notificationService.error(
'Erreur',
'Erreur d\'actualisation de la date'
)
}
this.deliveryNotesLoading.set(false)
await this.fetchDeliveryNotes()
@@ -90,58 +102,17 @@ export class DelivereryNoteTable implements OnInit {
async export(deliveryNoteId: number) {
this.deliveryNotesLoading.set(true)
try {
const pdf = await firstValueFrom(this.deliveryNotesService.getDeliveryNotePdfEndpoint(deliveryNoteId, "response"));
const pdf = await firstValueFrom(
this.deliveryNotesService.getDeliveryNotePdfEndpoint(deliveryNoteId, "response")
);
this.fileService.downloadBlob(pdf)
} catch {
this.notificationService.error('Erreur', 'Impossible de générer un PDF');
} catch (e) {
console.error(e);
this.notificationService.error(
'Erreur',
'Impossible de générer un PDF'
);
}
this.deliveryNotesLoading.set(false)
}
async edit(id: number, updateDelivereryNoteComponent: DelivereryNoteForm) {
if (updateDelivereryNoteComponent.deliveryNoteForm.invalid) {
this.notificationService.error('Erreur', 'Formulaire invalide');
return;
}
try {
const raw = updateDelivereryNoteComponent.deliveryNoteForm.getRawValue();
const toIso = (val: any) =>
val ? new Date(val).toISOString().substring(0, 10) : null;
const deliveryNoteDto: UpdateDeliveryNoteDto = {
trackingNumber: raw.trackingNumber,
delivererId: raw.delivererId,
expeditionDate: toIso(raw.expeditionDate),
estimateDeliveryDate: toIso(raw.estimatedDate),
realDeliveryDate: toIso(raw.realDeliveryDate)
};
await firstValueFrom(this.deliveryNotesService.updateDeliveryNoteEndpoint(id, deliveryNoteDto));
this.notificationService.success('Success', 'Bon de livraison modifié');
} catch {
this.notificationService.error('Erreur', 'Erreur lors de la modification');
}
}
selectedDeliveryNote: GetDeliveryNoteDto | null = null;
openEditModal(deliveryNote: GetDeliveryNoteDto) {
this.selectedDeliveryNote = {...deliveryNote};
this.modal().showModal();
}
async onModalOk(id: number, updateDelivereryNoteComponent: DelivereryNoteForm, modal: ModalNav) {
if (!this.selectedDeliveryNote) return;
await this.edit(id, updateDelivereryNoteComponent);
updateDelivereryNoteComponent.deliveryNoteForm.reset();
this.onModalCancel(modal);
await this.fetchDeliveryNotes();
}
onModalCancel(modal: ModalNav) {
modal.isVisible = false;
}
}
@@ -11,9 +11,11 @@
flex-direction: column;
align-items: flex-start;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.06),
0 8px 20px rgba(0, 0, 0, 0.08),
0 16px 40px rgba(0, 0, 0, 0.06);
/* Box shadow pour effet superposition */
box-shadow:
0 4px 8px rgba(0, 0, 0, 0.06),
0 8px 20px rgba(0, 0, 0, 0.08),
0 16px 40px rgba(0, 0, 0, 0.06);
}
@@ -30,17 +32,19 @@
.search-input:focus {
border-color: #3b82f6;
box-shadow: 0 0 8px rgba(59, 130, 246, 0.2);
box-shadow: 0 0 8px rgba(59,130,246,0.2);
outline: none;
}
/* Liste scrollable */
.livraisons-list {
width: 100%;
max-height: 500px;
overflow-y: auto;
padding-right: 10px;
max-height: 350px; /* hauteur max de la liste */
overflow-y: auto; /* scroll vertical activé */
padding-right: 10px; /* pour le scrollbar */
}
/* Scrollbar personnalisée (optionnel) */
.livraisons-list::-webkit-scrollbar {
width: 8px;
}
@@ -54,11 +58,12 @@
background: #f3f4f6;
}
/* Carte de livraison */
.livraison-card {
background: #ffffff;
padding: 20px 22px;
border-radius: 14px;
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.05);
box-shadow: 0 6px 16px rgba(0,0,0,0.05);
display: flex;
justify-content: space-between;
align-items: center;
@@ -69,9 +74,10 @@
.livraison-card:hover {
transform: translateY(-3px);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.08);
box-shadow: 0 10px 22px rgba(0,0,0,0.08);
}
/* Infos livraison */
.livraison-info h3 {
font-size: 17px;
margin: 0 0 4px;
@@ -83,3 +89,26 @@
font-size: 14px;
color: #6b7280;
}
/* Bouton valider */
.validate-btn {
padding: 10px 20px;
border-radius: 12px;
border: none;
cursor: pointer;
font-weight: 600;
background: #3b82f6;
color: white;
transition: all 0.3s ease;
}
.validate-btn:hover {
background: #2563eb;
}
.validate-btn.validated {
background: #9ca3af;
cursor: default;
color: #ffffff;
opacity: 0.9;
}
@@ -1,6 +1,5 @@
<div class="livraisons-container">
<input type="text" placeholder="Rechercher une livraison" class="search-input"
(input)="search.set($any($event.target).value)"/>
<input type="text" placeholder="Rechercher une livraison" class="search-input" (input)="search.set($any($event.target).value)"/>
<div class="livraisons-list">
@for (deliveryItem of filteredDeliveries(); track deliveryItem.id) {
@@ -8,28 +7,10 @@
<div class="livraison-info">
<h3>{{ deliveryItem.delivererTransporter }}</h3>
<p class="mr-5">Date d'expédition: {{ deliveryItem.expeditionDate }}</p>
<p>Quantité livrée : {{ deliveryItem.products.length }}</p>
<p>Produits : {{ deliveryItem.products }}</p>
</div>
<app-modal-nav #modal name="Valider la livraison" nameIcon="check"
(click)="check(deliveryItem.id)"
(ok)="validate(deliveryItem.id, selectedWarehouseId!, modal)"
(cancel)="reject(modal)">
<div class="mb-4 flex justify-center">
<nz-select
[(ngModel)]="selectedWarehouseId"
nzPlaceHolder="Sélectionner un entrepôt"
required
class="w-64">
@for (wareHouse of wareHouses(); track wareHouse.id) {
<nz-option [nzValue]="wareHouse.id" [nzLabel]="wareHouse.name"/>
}
</nz-select>
</div>
<app-modal-nav name="Valider la livraison" nameIcon="check" (click)="validate(deliveryItem.id)">
<div style="max-height: 400px; overflow-y: auto;">
<nz-table [nzData]="filteredDeliveries()"
[nzFrontPagination]="false">
@@ -43,15 +24,18 @@
<tbody class="text-center">
@for (product of deliveryItem.products; track product.productId) {
<tr>
<td>{{ product.productReference }}</td>
<td>{{ product.productName }}</td>
<td>{{ product.quantity }}</td>
<td>{{product.productReference}}</td>
<td>{{product.productName}}</td>
<td>{{product.quantity}}</td>
</tr>
}
</tbody>
</nz-table>
</div>
</app-modal-nav>
</div>
}
</div>
@@ -1,105 +1,78 @@
import {Component, computed, inject, OnInit, signal} from '@angular/core';
import {
DeliverynotesService,
GetDeliveryNoteDto, GetWareHouseDto,
WarehouseproductsService,
WarehousesService
} from "../../services/api";
import {NzButtonComponent, NzButtonSize} from "ng-zorro-antd/button";
import {NzIconDirective} from "ng-zorro-antd/icon";
import {DeliverynotesService, GetDeliveryNoteDto} from "../../services/api";
import {firstValueFrom} from "rxjs";
import {NzNotificationService} from "ng-zorro-antd/notification";
import {ModalButton} from "../modal-button/modal-button";
import {ModalNav} from "../modal-nav/modal-nav";
import {NzTableComponent} from "ng-zorro-antd/table";
import {format} from "date-fns";
import {ModalNav} from "../modal-nav/modal-nav";
import {NzOptionComponent, NzSelectComponent} from "ng-zorro-antd/select";
import {FormsModule} from "@angular/forms";
@Component({
selector: 'app-delivery-validator',
selector: 'app-delivery-validator',
imports: [
NzTableComponent,
NzButtonComponent,
NzIconDirective,
ModalButton,
ModalNav,
NzSelectComponent,
NzOptionComponent,
FormsModule
NzTableComponent
],
templateUrl: './delivery-validator.html',
styleUrl: './delivery-validator.css',
templateUrl: './delivery-validator.html',
styleUrl: './delivery-validator.css',
})
export class DeliveryValidator implements OnInit {
private deliveryNotesService = inject(DeliverynotesService);
private notificationService = inject(NzNotificationService);
private warehousesService = inject(WarehousesService);
private warehouseProductsService = inject(WarehouseproductsService);
private deliveriesService = inject(DeliverynotesService);
private notificationsService = inject(NzNotificationService);
search = signal<string>('');
deliveryNotes = signal<GetDeliveryNoteDto[]>([]);
wareHouses = signal<GetWareHouseDto[]>([]);
size: NzButtonSize = 'large';
search = signal('');
selectedWarehouseId: number | null = null;
deliveries = signal<GetDeliveryNoteDto[]>(null);
async ngOnInit() {
await this.fetchDeliveryNotes();
try {
const wareHouses = await firstValueFrom(this.warehousesService.getAllWarehouseEndpoint());
this.wareHouses.set(wareHouses);
} catch {
this.notificationService.error('Erreur', 'Erreur lors du chargement des quantitées')
async fetchDeliveries(){
try{
const deliveries = await firstValueFrom(this.deliveriesService.getAllDeliveryNoteEndpoint());
this.deliveries.set(deliveries);
}catch(e) {
this.notificationsService.error(
'Error',
'Error fetching deliveries',
)
}
}
async fetchDeliveryNotes() {
try {
const deliveries = await firstValueFrom(this.deliveryNotesService.getAllDeliveryNotesNotArrivedEndpoint());
this.deliveryNotes.set(deliveries);
} catch {
this.notificationService.error('Erreur', 'Erreur lors du chargement des bon de livraison')
}
async ngOnInit(){
await this.fetchDeliveries();
}
filteredDeliveries = computed(() => {
if(this.deliveries() == null){
return
}
const query = this.search().toLowerCase();
return this.deliveryNotes().filter(l =>
return this.deliveries().filter(l =>
l.delivererTransporter.toLowerCase().includes(query) ||
l.expeditionDate.includes(query)
l.estimateDeliveryDate.includes(query)
);
});
async check(id: number) {
try {
async validate(id) {
try{
const PatchRealDate = {
realDeliveryDate: format(new Date(), 'yyyy-MM-dd')
};
await firstValueFrom(this.deliveryNotesService.patchRealDeliveryDateEndpoint(id, PatchRealDate));
} catch {
this.notificationService.error('Erreur', 'Impossible d\'actualiser la date')
await firstValueFrom(this.deliveriesService.patchRealDeliveryDateEndpoint(id, PatchRealDate));
}
}
async validate(id: number, warehouseId: number, modal: ModalNav) {
try {
const deliveryNote = this.deliveryNotes().find(x => x.id === id);
for (const product of deliveryNote.products) {
await firstValueFrom(this.warehouseProductsService.patchWareHouseProductQuantityEndpoint(
product.productId,
warehouseId,
{
quantity: product.quantity
}
));
}
this.notificationService.success('Succès', 'Les produits sont bien ajoutés au stock')
modal.isVisible = false;
await this.fetchDeliveryNotes();
} catch {
this.notificationService.error('Erreur', 'Vous devez choisir un entrepôt')
catch(e) {
this.notificationsService.error(
'Error',
'Error validateing delivery',
)
}
}
async reject(modal: ModalNav) {
modal.isVisible = false;
await this.fetchDeliveryNotes();
}
}
+2 -2
View File
@@ -1,7 +1,7 @@
<div class="card-content">
<div class="card-top">
<nz-icon [ngStyle]="{ 'color': color() }" [nzType]="icon()" nzTheme="outline"></nz-icon>
<p class="card-number">{{ value() }}</p>
<p class="card-number">{{value()}}</p>
</div>
<p class="card-text">{{ description() }}</p>
<p class="card-text">{{description()}}</p>
</div>
+3 -3
View File
@@ -3,13 +3,13 @@ import {NzIconDirective} from "ng-zorro-antd/icon";
import {NgStyle} from "@angular/common";
@Component({
selector: 'app-info-card',
selector: 'app-info-card',
imports: [
NzIconDirective,
NgStyle
],
templateUrl: './info-card.html',
styleUrl: './info-card.css',
templateUrl: './info-card.html',
styleUrl: './info-card.css',
})
export class InfoCard {
icon = input.required<string>()
@@ -0,0 +1,72 @@
.documents-section {
display: flex;
flex-direction: column;
align-items: flex-start; /* contenu aligné à gauche */
gap: 16px; /* espace entre le titre et la liste */
margin: 40px 6%;
}
/* Titre */
.documents-section h1 {
font-size: 24px;
font-weight: 700;
color: #111827;
margin: 0; /* on gère lespace avec le gap */
letter-spacing: 0.5px;
text-transform: capitalize;
border-left: 4px solid #3b82f6;
padding-left: 12px;
}
/* Liste de documents scrollable */
.content {
width: 1000px;
display: flex;
flex-wrap: wrap;
gap: 16px;
padding: 30px 15px;
border-radius: 20px;
box-shadow:
0 4px 8px rgba(0, 0, 0, 0.06),
0 8px 20px rgba(0, 0, 0, 0.08),
0 16px 40px rgba(0, 0, 0, 0.06);
max-height: 390px;
overflow-y: auto;
}
/* Chaque carte */
.content > div {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 120px;
height: 140px;
padding: 12px;
background: #ffffff;
border-radius: 14px;
cursor: pointer;
box-shadow: 0 6px 16px rgba(0,0,0,0.08);
transition: all 0.2s ease;
text-align: center;
}
.content > div:hover {
transform: translateY(-3px);
box-shadow: 0 10px 22px rgba(0,0,0,0.12);
}
.content img {
width: 48px;
height: 48px;
margin-bottom: 10px;
object-fit: contain;
}
.content p {
margin: 0;
font-size: 16px;
font-weight: 600;
color: #111827;
word-break: break-word;
}
@@ -0,0 +1,11 @@
<div class="documents-section">
<h1>Documents récents</h1>
<div class="content">
@for (doc of purchaseOrder(); track doc.id) {
<div>
<img src="https://cdn-icons-png.flaticon.com/512/337/337946.png" alt="pdf">
<p>{{ doc.name }}</p>
</div>
}
</div>
</div>
@@ -0,0 +1,44 @@
import { Component } from '@angular/core';
interface PurchaseOrder {
id: number;
name: string;
}
@Component({
selector: 'app-info-table',
templateUrl: './info-table.html',
styleUrls: ['./info-table.css'],
})
export class InfoTable {
docs: PurchaseOrder[] = [
{ id: 1, name: 'Bon de commande'},
{ id: 2, name: 'Bon de commande'},
{ id: 3, name: 'Bon de commande'},
{ id: 1, name: 'Bon de commande'},
{ id: 2, name: 'Bon de commande'},
{ id: 3, name: 'Bon de commande'},
{ id: 1, name: 'Bon de commande'},
{ id: 2, name: 'Bon de commande'},
{ id: 3, name: 'Bon de commande'},
{ id: 1, name: 'Bon de commande'},
{ id: 2, name: 'Bon de commande'},
{ id: 3, name: 'Bon de commande'},
{ id: 1, name: 'Bon de commande'},
{ id: 2, name: 'Bon de commande'},
{ id: 3, name: 'Bon de commande'},
{ id: 1, name: 'Bon de commande'},
{ id: 2, name: 'Bon de commande'},
{ id: 3, name: 'Bon de commande'},
{ id: 1, name: 'Bon de commande'},
{ id: 2, name: 'Bon de commande'},
{ id: 3, name: 'Bon de commande'},
{ id: 1, name: 'Bon de commande'},
{ id: 2, name: 'Bon de commande'},
{ id: 3, name: 'Bon de commande'},
];
purchaseOrder(): PurchaseOrder[] {
return this.docs;
}
}
-122
View File
@@ -1,122 +0,0 @@
:host {
display: flex;
}
.app-layout {
height: 100vh;
}
nz-header {
display: flex;
align-items: center;
background: #001529;
padding: 0 24px;
}
.header-container {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
}
/* --- LOGO + TITRE --- */
.logo {
display: flex;
align-items: center;
}
.logo a {
display: flex;
align-items: center;
text-decoration: none;
}
.logo img {
height: 40px;
width: auto;
}
.logo h1 {
margin: 0 0 0 10px;
color: #fff;
font-weight: 600;
font-size: 20px;
font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
}
/* --- MENU PRINCIPAL --- */
.top-nav {
flex: 1;
margin: 0 40px;
line-height: 64px;
background: #001529;
border: none;
}
/* Couleur grise par défaut + effet blanc et zoom au survol */
.top-nav li {
transition: transform 0.2s ease, color 0.2s ease;
}
.top-nav li a {
color: #bfbfbf !important; /* gris clair par défaut */
transition: transform 0.2s ease, color 0.2s ease;
}
/* Au survol → zoom + blanc pur */
.top-nav li:hover {
transform: scale(1.08);
background: transparent !important;
color: #fff !important;
}
.top-nav li:hover a {
color: #ffffff !important;
}
/* Supprime toute coloration bleue ou fond par défaut NG-ZORRO */
.top-nav li.ant-menu-item-active,
.top-nav li.ant-menu-item-selected {
background: transparent !important;
color: #fff !important;
}
/* --- ICONES DROITES --- */
.right-icons {
display: flex;
align-items: center;
gap: 20px;
color: #fff;
font-size: 18px;
cursor: pointer;
}
.right-icons app-modal-nav {
transition: transform 0.2s ease, color 0.2s ease;
}
.disconnect {
transition: transform 0.2s ease, color 0.2s ease;
}
.disconnect:hover {
color: #40a9ff;
transform: scale(1.2);
}
.right-icons app-modal-nav:hover {
color: #40a9ff;
transform: scale(1.2);
}
/* --- CONTENU --- */
nz-content {
padding: 24px 50px;
}
.inner-content {
padding: 24px;
background: #fff;
height: 100%;
}
-90
View File
@@ -1,90 +0,0 @@
<nz-layout class="app-layout">
<nz-header>
<div class="header-container">
<!-- LOGO -->
<div class="logo">
<a routerLink="/dashboard">
<img
src="https://www.pyro-fetes.com/wp-content/themes/pcptheme/img/logo-pyro-fetes-OR-top.png"
alt="logo"
style="width: 100px; height: auto"
/>
<h1 class="text-amber-300">PYRO FÊTES</h1>
</a>
</div>
<!-- MENU PRINCIPAL -->
<ul nz-menu class="top-nav" nzTheme="dark" nzMode="horizontal">
<li nz-menu-item routerLinkActive="ant-menu-item-selected">
<a routerLink="/stock">
<nz-icon nzType="stock"></nz-icon>
<span>Stock</span>
</a>
</li>
<li nz-submenu nzTitle="Partenaires" nzIcon="team">
<ul>
<li nz-menu-item routerLinkActive="ant-menu-item-selected">
<a routerLink="/supplier">
<nz-icon nzType="shop"></nz-icon>
<span>Fournisseurs</span>
</a>
</li>
<li nz-menu-item routerLinkActive="ant-menu-item-selected">
<a routerLink="/deliverer">
<nz-icon nzType="car"></nz-icon>
<span>Livreurs</span>
</a>
</li>
</ul>
</li>
<li nz-submenu nzTitle="Recettes" nzIcon="euro-circle">
<ul>
<li nz-menu-item routerLinkActive="ant-menu-item-selected">
<a routerLink="/quotation">
<nz-icon nzType="file"></nz-icon>
<span>Devis</span>
</a>
</li>
<li nz-menu-item routerLinkActive="ant-menu-item-selected">
<a routerLink="/purchase-order">
<nz-icon nzType="file"></nz-icon>
<span>Bon de commande</span>
</a>
</li>
<li nz-menu-item routerLinkActive="ant-menu-item-selected">
<a routerLink="/delivery-note">
<nz-icon nzType="file"></nz-icon>
<span>Bon de livraison</span>
</a>
</li>
</ul>
</li>
@if (admin()) {
<li nz-menu-item routerLinkActive="ant-menu-item-selected">
<a routerLink="/user">
<nz-icon nzType="user"></nz-icon>
<span>Utilisateur</span>
</a>
</li>
}
</ul>
<!-- ICONES À DROITE -->
<div class="right-icons">
<nz-icon nzType="logout" nzTheme="outline" class="disconnect" (click)="disconnect()"/>
<app-modal-nav nameIcon="user" name="Profil">
<app-profil></app-profil>
</app-modal-nav>
<app-modal-nav nameIcon="setting" name="Paramètres">
<app-setting-form></app-setting-form>
</app-modal-nav>
</div>
</div>
</nz-header>
<nz-content>
<div class="inner-content overflow-auto">
<router-outlet></router-outlet>
</div>
</nz-content>
</nz-layout>
-45
View File
@@ -1,45 +0,0 @@
import {Component, inject, OnInit, signal} from '@angular/core';
import {ModalNav} from "../modal-nav/modal-nav";
import {NzContentComponent, NzHeaderComponent, NzLayoutComponent} from "ng-zorro-antd/layout";
import {NzIconDirective} from "ng-zorro-antd/icon";
import {NzMenuDirective, NzMenuItemComponent, NzSubMenuComponent} from "ng-zorro-antd/menu";
import {Profil} from "../profil/profil";
import {Router, RouterLink, RouterLinkActive, RouterOutlet} from "@angular/router";
import {SettingForm} from "../setting-form/setting-form";
import {AuthService} from "../../services/auth.service";
@Component({
selector: 'app-layout',
imports: [
ModalNav,
NzContentComponent,
NzHeaderComponent,
NzIconDirective,
NzLayoutComponent,
NzMenuDirective,
NzMenuItemComponent,
NzSubMenuComponent,
Profil,
RouterLink,
RouterLinkActive,
RouterOutlet,
SettingForm
],
templateUrl: './layout.html',
styleUrl: './layout.css',
})
export class Layout implements OnInit {
private authService = inject(AuthService);
private router = inject(Router);
admin = signal<boolean>(false);
ngOnInit() {
this.admin.set(this.authService.isAdmin());
}
async disconnect() {
this.authService.logout();
await this.router.navigate(['/login']);
}
}
@@ -1,4 +1,4 @@
<button nz-button [nzType]="type()" (click)="showModal()">{{ name() }}</button>
<button nz-button [nzType]="type()" (click)="showModal()">{{name()}}</button>
<ng-template #modalContent>
<ng-content></ng-content>
@@ -1,4 +1,4 @@
import {Component, input, output} from '@angular/core';
import {Component, input, Input, output} from '@angular/core';
import {NzModalComponent} from "ng-zorro-antd/modal";
import {NzButtonComponent} from "ng-zorro-antd/button";
+3 -3
View File
@@ -1,6 +1,6 @@
import {Component, input, output} from '@angular/core';
import {NzButtonModule} from 'ng-zorro-antd/button';
import {NzModalModule} from 'ng-zorro-antd/modal';
import {Component, Input, input, output} from '@angular/core';
import { NzButtonModule } from 'ng-zorro-antd/button';
import { NzModalModule } from 'ng-zorro-antd/modal';
import {NzIconDirective} from "ng-zorro-antd/icon";
@Component({
@@ -0,0 +1,34 @@
<div class="ml-90">
<p class="cursor-pointer text-red-700" (click)="delete()">
<nz-icon nzType="delete" nzTheme="outline"/> Tout supprimer
</p>
</div>
<nz-list nzItemLayout="vertical" class="max-w-xl mx-auto max-h-[400px] overflow-y-auto border border-gray-200 rounded-lg">
@for (item of notifList; track item) {
<nz-list-item class="flex items-start p-4 border-b border-gray-200">
<nz-list-item-meta class="flex-1">
<nz-list-item-meta-avatar>
<img src="https://cdn-icons-png.flaticon.com/512/1/1176.png" alt="info" class="w-10 h-10 rounded-full mt-10 mr-2 w-10">
</nz-list-item-meta-avatar>
<nz-list-item-meta-title>
<p class="font-semibold mb-1">{{item.title}}</p>
<p class="text-gray-500 mb-1">{{item.author}}</p>
</nz-list-item-meta-title>
<nz-list-item-meta-description>
<p>{{item.content}}</p>
</nz-list-item-meta-description>
</nz-list-item-meta>
<nz-list-item-extra>
<img src="https://www.pyro-fetes.com/wp-content/themes/pcptheme/img/logo-pyro-fetes-OR-top.png"
alt="logo"
class="w-35 object-contain mt-4">
</nz-list-item-extra>
</nz-list-item>
}
</nz-list>
@@ -0,0 +1,92 @@
import { Component } from '@angular/core';
import {NotifInfo} from "../../interfaces/notif.interface";
import {
NzListComponent,
NzListItemComponent,
NzListItemExtraComponent, NzListItemMetaAvatarComponent,
NzListItemMetaComponent, NzListItemMetaDescriptionComponent, NzListItemMetaTitleComponent
} from "ng-zorro-antd/list";
import {NzIconDirective} from "ng-zorro-antd/icon";
@Component({
selector: 'app-notif-list',
imports: [
NzListComponent,
NzListItemComponent,
NzListItemMetaComponent,
NzListItemExtraComponent,
NzListItemMetaDescriptionComponent,
NzListItemMetaAvatarComponent,
NzListItemMetaTitleComponent,
NzIconDirective
],
templateUrl: './notif-list.html',
styleUrl: './notif-list.css',
})
export class NotifList {
notifList: NotifInfo[] = [
{
author: 'Admin',
title: 'Information system',
content: 'L\'utilisateur à bien été crée.'
},
{
author: 'Admin',
title: 'Information system',
content: 'L\'utilisateur à bien été crée.'
},
{
author: 'Admin',
title: 'Information system',
content: 'L\'utilisateur à bien été crée.'
},
{
author: 'Admin',
title: 'Information system',
content: 'L\'utilisateur à bien été crée.'
},
{
author: 'Admin',
title: 'Information system',
content: 'L\'utilisateur à bien été crée.'
},
{
author: 'Admin',
title: 'Information system',
content: 'L\'utilisateur à bien été crée.'
},
{
author: 'Admin',
title: 'Information system',
content: 'L\'utilisateur à bien été crée.'
},
{
author: 'Admin',
title: 'Information system',
content: 'L\'utilisateur à bien été crée.'
},
{
author: 'Admin',
title: 'Information system',
content: 'L\'utilisateur à bien été crée.'
},
{
author: 'Admin',
title: 'Information system',
content: 'L\'utilisateur à bien été crée.'
},
{
author: 'Admin',
title: 'Information system',
content: 'L\'utilisateur à bien été crée.'
}
];
delete() {
this.notifList = [];
}
addContent(author: string, title: string, content: string) {
this.notifList.push({ author, title, content });
}
}
+5 -6
View File
@@ -4,10 +4,10 @@ import {NzColDirective} from "ng-zorro-antd/grid";
import {NzFlexDirective} from "ng-zorro-antd/flex";
import {NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
import {NzInputDirective} from "ng-zorro-antd/input";
import {GetPriceDto} from "../../services/api";
import {GetPriceDto, GetSupplierDto} from "../../services/api";
@Component({
selector: 'app-price-form',
selector: 'app-price-form',
imports: [
FormsModule,
NzColDirective,
@@ -19,16 +19,15 @@ import {GetPriceDto} from "../../services/api";
NzInputDirective,
ReactiveFormsModule
],
templateUrl: './price-form.html',
styleUrl: './price-form.css',
templateUrl: './price-form.html',
styleUrl: './price-form.css',
})
export class PriceForm {
priceForm: FormGroup = new FormGroup({
price: new FormControl<string>(null, [Validators.required]),
})
price = input<GetPriceDto>();
price= input<GetPriceDto>();
constructor() {
effect(() => {
if (this.price()) {
@@ -0,0 +1,21 @@
<form nz-form nzLayout="horizontal" [formGroup]="productForm">
<nz-form-item nz-flex>
<nz-form-label nzSpan="9" nzRequired>
Prix
</nz-form-label>
<nz-form-control nzSpan="8" nzErrorTip="Ce champ est requis">
<input nz-input placeholder="Prix" formControlName="price">
</nz-form-control>
</nz-form-item>
<nz-form-item nz-flex>
<nz-form-label nzSpan="9" nzRequired>
Quantité
</nz-form-label>
<nz-form-control nzSpan="8" nzErrorTip="Ce champ est requis">
<input nz-input placeholder="Quantité" formControlName="quantity">
</nz-form-control>
</nz-form-item>
</form>
@@ -1,13 +1,12 @@
import {Component, effect, input} from '@angular/core';
import { Component } from '@angular/core';
import {FormControl, FormGroup, FormsModule, ReactiveFormsModule, Validators} from "@angular/forms";
import {NzColDirective} from "ng-zorro-antd/grid";
import {NzFlexDirective} from "ng-zorro-antd/flex";
import {NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
import {NzInputDirective} from "ng-zorro-antd/input";
import {GetPurchaseProductDto} from "../../services/api";
@Component({
selector: 'app-quantity-form',
selector: 'app-product-form',
imports: [
FormsModule,
NzColDirective,
@@ -19,23 +18,12 @@ import {GetPurchaseProductDto} from "../../services/api";
NzInputDirective,
ReactiveFormsModule
],
templateUrl: './quantity-form.html',
styleUrl: './quantity-form.css',
templateUrl: './product-form.html',
styleUrl: './product-form.css',
})
export class QuantityForm {
quantityForm: FormGroup = new FormGroup({
quantity: new FormControl<number>(null, [Validators.required])
export class ProductForm {
productForm: FormGroup = new FormGroup({
price: new FormControl<string>(null, [Validators.required]),
quantity: new FormControl<string>(null, [Validators.required])
})
quantity = input<GetPurchaseProductDto>();
constructor() {
effect(() => {
if (this.quantity()) {
this.quantityForm.patchValue({
quantity: this.quantity().quantity
});
}
});
}
}
@@ -0,0 +1,9 @@
import { Component } from '@angular/core';
@Component({
selector: 'app-product-table',
imports: [],
templateUrl: './product-table.html',
styleUrl: './product-table.css',
})
export class ProductTable {}
@@ -26,7 +26,8 @@
<nz-form-control nzSpan="12" nzErrorTip="Ce champ est requis">
<nz-select formControlName="fonction" [nzPlaceHolder]="'Choisir une fonction'">
<nz-option nzLabel="Admin" nzValue="Admin"></nz-option>
<nz-option nzLabel="Employé" nzValue="Employe"></nz-option>
<nz-option nzLabel="Visiteur" nzValue="Visiteur"></nz-option>
<nz-option nzLabel="Partenaire" nzValue="Partenaire"></nz-option>
</nz-select>
</nz-form-control>
</nz-form-item>
@@ -8,7 +8,7 @@ import {NzOptionComponent, NzSelectComponent} from "ng-zorro-antd/select";
import {GetUserDto} from "../../services/api";
@Component({
selector: 'app-profil-form',
selector: 'app-profil-form',
imports: [
FormsModule,
NzColDirective,
@@ -22,8 +22,8 @@ import {GetUserDto} from "../../services/api";
NzSelectComponent,
NzOptionComponent
],
templateUrl: './profil-form.html',
styleUrl: './profil-form.css',
templateUrl: './profil-form.html',
styleUrl: './profil-form.css',
})
export class ProfilForm {
profilForm: FormGroup = new FormGroup({
@@ -34,7 +34,6 @@ export class ProfilForm {
})
user = input<GetUserDto>();
constructor() {
effect(() => {
if (this.user()) {
+10 -4
View File
@@ -1,9 +1,15 @@
<div class="ml-110 cursor-pointer">
<app-modal-nav nameIcon="edit" name="Modification du profil">
<app-profil-form [user]=""></app-profil-form>
</app-modal-nav>
</div>
<div class="mx-auto flex items-center justify-center w-30 h-30 rounded-full bg-blue-900 text-white text-6xl fontProfil">
{{ getInitial(user().name) }}
{{ getInitial(data.name) }}
</div>
<div class="mt-6">
<p class="text-3xl festive2 mx-auto flex items-center justify-center">{{ user().name }}</p>
<p class="text-xl festive2 mt-0 flex items-center justify-center">{{ user().email }}</p>
<p class="text-xl festive2 mt-0 flex items-center justify-center">{{ user().fonction }}</p>
<p class="text-3xl festive2 mx-auto flex items-center justify-center">{{data.name}}</p>
<p class="text-xl festive2 mt-0 flex items-center justify-center">{{data.email}}</p>
<p class="text-xl festive2 mt-0 flex items-center justify-center">{{data.fonction}}</p>
</div>
+18 -22
View File
@@ -1,28 +1,24 @@
import {Component, inject, OnInit, signal} from '@angular/core';
import {NzNotificationService} from "ng-zorro-antd/notification";
import {GetUserDto, UserService} from "../../services/api";
import {firstValueFrom} from "rxjs";
import { Component } from '@angular/core';
import {UserInfo} from "../../interfaces/user.interface";
import {ProfilForm} from "../profil-form/profil-form";
import {ModalNav} from "../modal-nav/modal-nav";
@Component({
selector: 'app-profil',
imports: [],
templateUrl: './profil.html',
styleUrl: './profil.css',
selector: 'app-profil',
imports: [
ProfilForm,
ModalNav
],
templateUrl: './profil.html',
styleUrl: './profil.css',
})
export class Profil implements OnInit {
private notificationService = inject(NzNotificationService);
private userService = inject(UserService);
user = signal<GetUserDto>({});
async ngOnInit() {
try {
const user = await firstValueFrom(this.userService.getUserEndpoint());
this.user.set(user);
} catch {
this.notificationService.error('Erreur', 'Impossible de charger l\'utilisateur');
}
}
export class Profil {
data: UserInfo =
{
name: 'Mathys Sanchez Vendé',
email: 'mathys.sanchez@vende.fr',
fonction: 'admin',
};
getInitial(name: string): string {
if (!name || name.trim() === '') return '?';
@@ -5,7 +5,7 @@
</nz-form-label>
<nz-form-control nzSpan="12" nzErrorTip="Ce champ est requis">
<input nz-input placeholder="Conditions générales de vente" formControlName="purchaseConditions">
<input nz-input placeholder="Conditions générales de vente" formControlName="purchaseCondition">
</nz-form-control>
</nz-form-item>
</form>
@@ -1,13 +1,12 @@
import {Component, effect, input} from '@angular/core';
import { Component } from '@angular/core';
import {FormControl, FormGroup, FormsModule, ReactiveFormsModule, Validators} from "@angular/forms";
import {NzColDirective} from "ng-zorro-antd/grid";
import {NzFlexDirective} from "ng-zorro-antd/flex";
import {NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
import {NzInputDirective} from "ng-zorro-antd/input";
import {GetPurchaseOrderDto} from "../../services/api";
@Component({
selector: 'app-purchase-order-form',
selector: 'app-purchase-order-form',
imports: [
FormsModule,
NzColDirective,
@@ -19,23 +18,11 @@ import {GetPurchaseOrderDto} from "../../services/api";
NzInputDirective,
ReactiveFormsModule
],
templateUrl: './purchase-order-form.html',
styleUrl: './purchase-order-form.css',
templateUrl: './purchase-order-form.html',
styleUrl: './purchase-order-form.css',
})
export class PurchaseOrderForm {
purchaseOrderForm: FormGroup = new FormGroup({
purchaseConditions: new FormControl<string>(null, [Validators.required])
purchaseCondition: new FormControl<string>(null,[Validators.required])
})
purchaseOrder = input<GetPurchaseOrderDto>();
constructor() {
effect(() => {
if (this.purchaseOrder()) {
this.purchaseOrderForm.patchValue({
purchaseConditions: this.purchaseOrder().purchaseConditions,
});
}
});
}
}
@@ -6,7 +6,7 @@ nz-table {
background: #fff;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
box-shadow: 0 2px 6px rgba(0,0,0,0.1);
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
@@ -66,21 +66,18 @@ nz-table tbody td p {
nz-table thead {
display: none;
}
nz-table tbody tr {
display: block;
margin-bottom: 16px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 1px 3px rgba(0,0,0,0.1);
border-radius: 8px;
padding: 12px;
}
nz-table tbody td {
display: flex;
justify-content: space-between;
padding: 6px 12px;
}
nz-table tbody td::before {
content: attr(data-label);
font-weight: 600;
@@ -15,8 +15,8 @@
@for (purchaseOrder of purchaseOrders(); track purchaseOrder.id) {
<tr>
<td>{{ purchaseOrder.id }}</td>
<td>{{ purchaseOrder.purchaseConditions }}</td>
<td>{{ purchaseOrder.supplierName }}</td>
<td>{{purchaseOrder.purchaseConditions}}</td>
<td>Fournisseur ???</td>
<td>
<app-modal-button type="link" name="Voir les produits" size="45%">
<div style="max-height: 400px; overflow-y: auto;">
@@ -32,20 +32,17 @@
</tr>
</thead>
<tbody class="text-center">
@for (product of purchaseOrder.products; track product.productId) {
@for (product of purchaseOrder.getPurchaseProductDto; track product.productId) {
<tr>
<td>{{ product.productName }}</td>
<td>{{ product.productReference }}</td>
<td>{{ product.productPrice }} </td>
<td>{{ product.quantity }}</td>
<td>{{product.productName}}</td>
<td>{{product.productReferences}}</td>
<td>Prix €€€</td>
<td>{{product.quantity}}</td>
<td>
<div style="justify-content: center; display: flex">
<nz-icon nzType="edit" nzTheme="outline" class="cursor-pointer"
(click)="openEditQuantityModal(product)"></nz-icon>
<nz-divider nzType="vertical"></nz-divider>
<nz-icon nzType="delete" nzTheme="outline"
class="cursor-pointer text-red-700"
(click)="deleteProduct(product.productId, purchaseOrder.id)"/>
<div>
<nz-icon nzType="delete" nzTheme="outline" class="cursor-pointer text-red-700"/>
</div>
</div>
</td>
</tr>
@@ -57,46 +54,28 @@
</td>
<td>
<div style="justify-content: center; display: flex">
<nz-icon nzType="edit" nzTheme="outline" class="cursor-pointer"
(click)="openEditModal(purchaseOrder)"></nz-icon>
<div>
<nz-icon nzType="plus-circle" nzTheme="outline" (click)="delete(purchaseOrder.id)" class="cursor-pointer text-green-700"/>
</div>
<nz-divider nzType="vertical"></nz-divider>
@if (admin()) {
<nz-icon nzType="delete" nzTheme="outline" (click)="delete(purchaseOrder.id)"
class="cursor-pointer text-red-700"/>
<nz-divider nzType="vertical"></nz-divider>
}
<nz-icon nzType="export" nzTheme="outline" (click)="export(purchaseOrder.id)"
class="cursor-pointer text-green-700"/>
<app-modal-nav nameIcon="edit" name="Modification des conditions de vente" class="cursor-pointer">
<app-purchase-order-form></app-purchase-order-form>
</app-modal-nav>
<nz-divider nzType="vertical"></nz-divider>
<nz-icon nzType="interaction" nzTheme="outline" (click)="openDelivererModal(purchaseOrder)"
class="cursor-pointer text-blue-700"/>
<div>
<nz-icon nzType="delete" nzTheme="outline" (click)="delete(purchaseOrder.id)" class="cursor-pointer text-red-700"/>
</div>
<nz-divider nzType="vertical"></nz-divider>
<div>
<nz-icon nzType="export" nzTheme="outline" (click)="export(purchaseOrder.id)" class="cursor-pointer text-green-700"/>
</div>
<nz-divider nzType="vertical"></nz-divider>
<div>
<nz-icon nzType="interaction" nzTheme="outline" (click)="transfer()" class="cursor-pointer text-blue-700"/>
</div>
</div>
</td>
</tr>
}
</tbody>
</nz-table>
<div class="hidden">
<app-modal-nav #modalNav nameIcon="edit" name="Modification des conditions de vente"
(ok)="onModalOk(selectedPurchaseOrder.id, purchaseOrderForm, modalNav)"
(cancel)="onModalCancel(modalNav)">
<app-purchase-order-form #purchaseOrderForm [purchaseOrder]="selectedPurchaseOrder"></app-purchase-order-form>
</app-modal-nav>
</div>
<div class="hidden">
<app-modal-nav #modalQuantity nameIcon="edit" name="Modification de la quantité"
(ok)="onModalQuantityOk(selectedQuantity.productId, selectedQuantity.purchaseOrderId, quantityForm, modalQuantity)"
(cancel)="onModalCancel(modalQuantity)">
<app-quantity-form #quantityForm [quantity]="selectedQuantity"></app-quantity-form>
</app-modal-nav>
</div>
<div class="hidden">
<app-modal-nav #modalDeliverer nameIcon="edit" name="Choix du transporteur"
(ok)="transfer(selectedPurchaseOrder, delivererChoice)"
(cancel)="onModalCancel(modalDeliverer)">
<app-deliverer-choice #delivererChoice></app-deliverer-choice>
</app-modal-nav>
</div>
@@ -1,26 +1,17 @@
import {Component, inject, OnInit, signal, viewChild} from '@angular/core';
import {Component, inject, OnInit, signal} from '@angular/core';
import {ModalNav} from "../modal-nav/modal-nav";
import {NzDividerComponent} from "ng-zorro-antd/divider";
import {NzIconDirective} from "ng-zorro-antd/icon";
import {NzTableComponent} from "ng-zorro-antd/table";
import {PurchaseOrderForm} from "../purchase-order-form/purchase-order-form";
import {ModalButton} from "../modal-button/modal-button";
import {
CreateDeliveryNoteDto,
DeliverynotesService,
GetPurchaseOrderDto,
GetPurchaseProductDto,
PurchaseordersService,
} from "../../services/api";
import {GetPurchaseOrderDto, PurchaseordersService} from "../../services/api";
import {NzNotificationService} from "ng-zorro-antd/notification";
import {firstValueFrom} from "rxjs";
import {FileService} from "../../services/file.service";
import {QuantityForm} from "../quantity-form/quantity-form";
import {DelivererChoice} from "../deliverer-choice/deliverer-choice";
import {AuthService} from "../../services/auth.service";
@Component({
selector: 'app-purchase-order-table',
selector: 'app-purchase-order-table',
imports: [
ModalNav,
NzDividerComponent,
@@ -28,30 +19,19 @@ import {AuthService} from "../../services/auth.service";
NzTableComponent,
PurchaseOrderForm,
ModalButton,
QuantityForm,
DelivererChoice,
],
templateUrl: './purchase-order-table.html',
styleUrl: './purchase-order-table.css',
templateUrl: './purchase-order-table.html',
styleUrl: './purchase-order-table.css',
})
export class PurchaseOrderTable implements OnInit {
private purchaseOrdersService = inject(PurchaseordersService);
private notificationService = inject(NzNotificationService);
private fileService = inject(FileService);
private deliveryNoteService = inject(DeliverynotesService);
private authService = inject(AuthService);
purchaseOrders = signal<GetPurchaseOrderDto[]>([]);
purchaseOrdersLoading = signal<boolean>(false);
admin = signal<boolean>(false);
modal = viewChild.required<ModalNav>('modalNav');
modalQuantity = viewChild.required<ModalNav>('modalQuantity');
modalDeliverer = viewChild.required<ModalNav>('modalDeliverer');
async ngOnInit() {
await this.fetchPurchaseOrder();
this.admin.set(this.authService.isAdmin());
}
async fetchPurchaseOrder() {
@@ -60,156 +40,51 @@ export class PurchaseOrderTable implements OnInit {
try {
const purchaseOrders = await firstValueFrom(this.purchaseOrdersService.getAllPurchaseOrderEndpoint())
this.purchaseOrders.set(purchaseOrders);
} catch {
this.notificationService.error('Erreur', 'Erreur lors du chargement des bons de commande')
} catch (e) {
this.notificationService.error(
'Erreur',
'Erreur de communication avec l\'API'
)
}
this.purchaseOrdersLoading.set(false)
}
async delete(purchaseOrderId: number) {
async delete(purchaseOrderId:number) {
this.purchaseOrdersLoading.set(true)
try {
await firstValueFrom(this.purchaseOrdersService.deletePurchaseOrderEndpoint(purchaseOrderId))
this.notificationService.success('Success', 'Suppression effectuée')
} catch {
this.notificationService.error('Erreur', 'Impossible de supprimer la ligne')
this.notificationService.success(
'Success',
'Suppression effectuée'
)
} catch (e) {
this.notificationService.error(
'Erreur',
'Impossible de supprimer la ligne'
)
}
this.purchaseOrdersLoading.set(false)
await this.fetchPurchaseOrder();
}
async export(purchaseOrderId: number) {
async export(purchaseOrderId: number){
this.purchaseOrdersLoading.set(true)
try {
const pdf = await firstValueFrom(
this.purchaseOrdersService.getPurchaseOrderPdfEndpoint(purchaseOrderId, "response")
);
this.fileService.downloadBlob(pdf)
} catch {
this.notificationService.error('Erreur', 'Impossible de générer un PDF');
} catch (e) {
console.error(e);
this.notificationService.error(
'Erreur',
'Impossible de générer un PDF'
);
}
this.purchaseOrdersLoading.set(false)
}
async transfer(purchaseOrder: GetPurchaseOrderDto, delivererForm: DelivererChoice) {
this.purchaseOrdersLoading.set(true);
try {
const deliverer = delivererForm.choiceDelivererForm.getRawValue();
const date = new Date().toISOString().split('T')[0]; // yyyy-mm-dd
let trackingValue = 'TRK-';
const idStr = purchaseOrder.id?.toString() ?? '';
if (idStr.length < 2) trackingValue += '00' + idStr + '-' + date;
else if (idStr.length < 3) trackingValue += '0' + idStr + '-' + date;
else trackingValue += idStr.substring(0, 3) + date.replace(/-/g, '');
const productQuantities: Record<number, number> = {};
purchaseOrder.products?.forEach(p => {
if (p.productId != null && p.quantity != null) {
productQuantities[p.productId] = p.quantity;
}
});
const deliveryNoteDto: CreateDeliveryNoteDto = {
trackingNumber: trackingValue,
delivererId: deliverer.delivererId,
productQuantities: productQuantities,
supplierId: purchaseOrder.supplierId
};
await firstValueFrom(this.deliveryNoteService.createDeliveryNoteEndpoint(deliveryNoteDto));
this.notificationService.success('Succès', 'Bon de livraison créé avec succès');
} catch {
this.notificationService.error('Erreur', 'Erreur lors du transfert');
}
this.onModalCancel(this.modalDeliverer());
this.purchaseOrdersLoading.set(false);
}
async edit(id: number, updatePurchaseOrderComponent: PurchaseOrderForm) {
if (updatePurchaseOrderComponent.purchaseOrderForm.invalid) {
this.notificationService.error('Erreur', 'Formulaire invalide')
return;
}
try {
const purchaseOrders = updatePurchaseOrderComponent.purchaseOrderForm.getRawValue();
await firstValueFrom(this.purchaseOrdersService.patchPurchaseOrderPurchaseConditionsEndpoint(id, purchaseOrders))
this.notificationService.success('Success', 'Bon de commande modifié')
} catch {
this.notificationService.error('Erreur', 'Erreur lors de la modification')
}
}
async deleteProduct(productId: number, purchaseOrderId: number) {
this.purchaseOrdersLoading.set(true)
try {
await firstValueFrom(this.purchaseOrdersService.deleteProductFromPurchaseOrderEndpoint(productId, purchaseOrderId))
this.notificationService.success('Success', 'Suppression effectuée')
} catch {
this.notificationService.error('Erreur', 'Impossible de supprimer la ligne')
}
this.purchaseOrdersLoading.set(false)
await this.fetchPurchaseOrder();
}
async editQuantity(productId: number, purchaseOrderId: number, updateQuantityComponent: QuantityForm) {
if (updateQuantityComponent.quantityForm.invalid) {
this.notificationService.error('Erreur', 'Erreur d\'écriture dans le formulaire')
return;
}
try {
const quantity = updateQuantityComponent.quantityForm.getRawValue();
await firstValueFrom(this.purchaseOrdersService.patchPurchaseProductQuantityEndpoint(productId, purchaseOrderId, quantity))
this.notificationService.success('Success', 'Quantité modifiée');
} catch {
this.notificationService.error('Erreur', 'Erreur lors de la modification');
}
}
selectedPurchaseOrder: GetPurchaseOrderDto | null = null;
openEditModal(purchaseOrder: GetPurchaseOrderDto) {
this.selectedPurchaseOrder = {...purchaseOrder};
this.modal().showModal();
}
openDelivererModal(purchaseOrder: GetPurchaseOrderDto) {
this.selectedPurchaseOrder = {...purchaseOrder};
this.modalDeliverer().showModal();
}
async onModalOk(id: number, updatePurchaseOrderComponent: PurchaseOrderForm, modal: ModalNav) {
if (!this.selectedPurchaseOrder) return;
await this.edit(id, updatePurchaseOrderComponent);
updatePurchaseOrderComponent.purchaseOrderForm.reset();
this.onModalCancel(modal);
await this.fetchPurchaseOrder();
}
onModalCancel(modal: ModalNav) {
modal.isVisible = false;
}
selectedQuantity: GetPurchaseProductDto | null = null;
openEditQuantityModal(quantity: GetPurchaseProductDto) {
this.selectedQuantity = {...quantity};
this.modalQuantity().showModal();
}
async onModalQuantityOk(productId: number, purchaseOrderId: number, updateQuantityComponent: QuantityForm, modal: ModalNav) {
if (!this.selectedQuantity) return;
await this.editQuantity(productId, purchaseOrderId, updateQuantityComponent);
updateQuantityComponent.quantityForm.reset();
this.onModalCancel(modal);
await this.fetchPurchaseOrder();
transfer() {
return
}
}
@@ -1,11 +0,0 @@
<form nz-form nzLayout="horizontal" [formGroup]="quantityForm">
<nz-form-item nz-flex>
<nz-form-label nzSpan="9" nzRequired>
Quantité
</nz-form-label>
<nz-form-control nzSpan="12" nzErrorTip="Ce champ est requis">
<input nz-input type="number" placeholder="0" formControlName="quantity">
</nz-form-control>
</nz-form-item>
</form>
@@ -1,11 +1,11 @@
<form nz-form nzLayout="horizontal" [formGroup]="quotationForm">
<form nz-form nzLayout="horizontal" [formGroup]="QuotationForm">
<nz-form-item nz-flex>
<nz-form-label nzSpan="9">
Message du devis
</nz-form-label>
<nz-form-control nzSpan="12">
<input nz-input placeholder="Message du devis" formControlName="message">
<input nz-input placeholder="Message du devis" formControlName="quotationMessage">
</nz-form-control>
</nz-form-item>
@@ -15,7 +15,7 @@
</nz-form-label>
<nz-form-control nzSpan="12">
<input nz-input placeholder="Conditions de vente" formControlName="conditionsSale">
<input nz-input placeholder="Conditions de vente" formControlName="quotationConditionsSale">
</nz-form-control>
</nz-form-item>
</form>
@@ -1,10 +1,10 @@
import {Component, effect, input} from '@angular/core';
import { Component } from '@angular/core';
import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms";
import {NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
import {NzInputDirective} from "ng-zorro-antd/input";
import {NzColDirective} from "ng-zorro-antd/grid";
import {NzFlexDirective} from "ng-zorro-antd/flex";
import {GetQuotationDto} from "../../services/api";
import {NzDatePickerComponent} from "ng-zorro-antd/date-picker";
@Component({
selector: 'app-quotation-form',
@@ -22,21 +22,8 @@ import {GetQuotationDto} from "../../services/api";
styleUrl: './quotation-form.css',
})
export class QuotationForm {
quotationForm: FormGroup = new FormGroup({
message: new FormControl<string>(null, [Validators.required]),
conditionsSale: new FormControl<string>(null, [Validators.required]),
QuotationForm: FormGroup = new FormGroup({
quotationMessage: new FormControl<string>(null),
quotationConditionsSale: new FormControl<string>(null),
})
quotation = input<GetQuotationDto>();
constructor() {
effect(() => {
if (this.quotation()) {
this.quotationForm.patchValue({
message: this.quotation().message,
conditionsSale: this.quotation().conditionsSale,
});
}
});
}
}
@@ -6,7 +6,7 @@ nz-table {
background: #fff;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
box-shadow: 0 2px 6px rgba(0,0,0,0.1);
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
@@ -66,21 +66,18 @@ nz-table tbody td p {
nz-table thead {
display: none;
}
nz-table tbody tr {
display: block;
margin-bottom: 16px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 1px 3px rgba(0,0,0,0.1);
border-radius: 8px;
padding: 12px;
}
nz-table tbody td {
display: flex;
justify-content: space-between;
padding: 6px 12px;
}
nz-table tbody td::before {
content: attr(data-label);
font-weight: 600;
@@ -11,13 +11,13 @@
<th>Produit</th>
<th>Action</th>
</tr>
</thead>
</thead >
<tbody class="text-center">
@for (quotation of quotations(); track quotation.id) {
<tr>
<td>{{ quotation.id }}</td>
<td>{{ quotation.message }}</td>
<td>{{ quotation.conditionsSale }}</td>
<td>{{quotation.id}}</td>
<td>{{quotation.message}}</td>
<td>{{quotation.conditionsSale}}</td>
<td>
<app-modal-button type="link" name="Voir les produits" size="45%">
<div style="max-height: 400px; overflow-y: auto;">
@@ -32,20 +32,15 @@
</tr>
</thead>
<tbody class="text-center">
@for (product of quotation.products; track product.productId) {
@for (product of quotation.getQuotationProductDto; track product.productId) {
<tr>
<td>{{ product.productReference }}</td>
<td>{{ product.productReferences }}</td>
<td>{{ product.productName }}</td>
<td>{{ product.productPrice }} €</td>
<td>{{ product.quantity }}</td>
<td>Price ???</td>
<td>Quantité ???</td>
<td>
<div style="justify-content: center; display: flex">
<nz-icon nzType="edit" nzTheme="outline" class="cursor-pointer"
(click)="openEditQuantityModal(product)"></nz-icon>
<nz-divider nzType="vertical"></nz-divider>
<nz-icon nzType="delete" nzTheme="outline"
class="cursor-pointer text-red-700"
(click)="deleteProduct(product.productId, quotation.id)"/>
<nz-icon nzType="delete" nzTheme="outline" class="cursor-pointer text-red-700"/>
</div>
</td>
</tr>
@@ -57,16 +52,21 @@
</td>
<td>
<div style="justify-content: center; display: flex">
<nz-icon nzType="edit" nzTheme="outline" class="cursor-pointer"
(click)="openEditModal(quotation)"></nz-icon>
<div>
<nz-icon nzType="plus-circle" nzTheme="outline" class="cursor-pointer text-green-700" />
</div>
<nz-divider nzType="vertical"></nz-divider>
@if (admin()) {
<nz-icon nzType="delete" nzTheme="outline" class="cursor-pointer text-red-700"
(click)="delete(quotation.id)"/>
<nz-divider nzType="vertical"></nz-divider>
}
<nz-icon nzType="export" (click)="export(quotation.id)" nzTheme="outline"
class="cursor-pointer text-green-700"/>
<app-modal-nav nameIcon="edit" name="Modification du devis" class="cursor-pointer">
<app-quotation-form></app-quotation-form>
</app-modal-nav>
<nz-divider nzType="vertical"></nz-divider>
<div>
<nz-icon nzType="delete" nzTheme="outline" class="cursor-pointer text-red-700" (click)="delete(quotation.id)"/>
</div>
<nz-divider nzType="vertical"></nz-divider>
<div>
<nz-icon nzType="export" (click)="export(quotation.id)" nzTheme="outline" class="cursor-pointer text-green-700"/>
</div>
</div>
</td>
</tr>
@@ -74,17 +74,3 @@
</tbody>
</nz-table>
<div class="hidden">
<app-modal-nav #modalNav nameIcon="edit" [name]="'Modification du devis'"
(ok)="onModalOk(selectedQuotation.id, quotationForm, modalNav)" (cancel)="onModalCancel(modalNav)">
<app-quotation-form #quotationForm [quotation]="selectedQuotation"></app-quotation-form>
</app-modal-nav>
</div>
<div class="hidden">
<app-modal-nav #modalQuantity nameIcon="edit" [name]="'Modification de la quantité'"
(ok)="onModalQuantityOk(selectedQuantity.productId, selectedQuantity.quotationId, quantityForm, modalQuantity)"
(cancel)="onModalCancel(modalQuantity)">
<app-quantity-form #quantityForm [quantity]="selectedQuantity"></app-quantity-form>
</app-modal-nav>
</div>
@@ -1,20 +1,14 @@
import {Component, inject, OnInit, signal, viewChild} from '@angular/core';
import {Component, inject, OnInit, signal} from '@angular/core';
import {NzTableComponent} from "ng-zorro-antd/table";
import {ModalButton} from "../modal-button/modal-button";
import {ModalNav} from "../modal-nav/modal-nav";
import {NzDividerComponent} from "ng-zorro-antd/divider";
import {NzIconDirective} from "ng-zorro-antd/icon";
import {QuotationForm} from "../quotation-form/quotation-form";
import {
GetQuotationDto,
GetQuotationProductDto,
QuotationsService
} from "../../services/api";
import {GetQuotationDto, QuotationsService} from "../../services/api";
import {NzNotificationService} from "ng-zorro-antd/notification";
import {firstValueFrom} from "rxjs";
import {FileService} from "../../services/file.service";
import {QuantityForm} from "../quantity-form/quantity-form";
import {AuthService} from "../../services/auth.service";
@Component({
selector: 'app-quotation-table',
@@ -25,7 +19,6 @@ import {AuthService} from "../../services/auth.service";
NzIconDirective,
NzTableComponent,
QuotationForm,
QuantityForm,
],
templateUrl: './quotation-table.html',
styleUrl: './quotation-table.css',
@@ -35,18 +28,11 @@ export class QuotationTable implements OnInit {
private quotationsService = inject(QuotationsService);
private notificationService = inject(NzNotificationService);
private fileService = inject(FileService);
private authService = inject(AuthService);
quotations = signal<GetQuotationDto[]>([]);
quotationsLoading = signal<boolean>(false);
admin = signal<boolean>(false);
modal = viewChild.required<ModalNav>('modalNav');
modalQuantity = viewChild.required<ModalNav>('modalQuantity');
async ngOnInit() {
await this.fetchQuotations();
this.admin.set(this.authService.isAdmin());
}
async fetchQuotations() {
@@ -55,114 +41,48 @@ export class QuotationTable implements OnInit {
try {
const quotations = await firstValueFrom(this.quotationsService.getAllQuotationEndpoint())
this.quotations.set(quotations);
} catch {
this.notificationService.error('Erreur', 'Erreur lors du chargement des devis')
} catch (e) {
this.notificationService.error(
'Erreur',
'Erreur de communication avec l\'API'
)
}
this.quotationsLoading.set(false)
}
async delete(quotation: number) {
async delete(quotation:number) {
this.quotationsLoading.set(true)
try {
await firstValueFrom(this.quotationsService.deleteQuotationEndpoint(quotation))
this.notificationService.success('Success', 'Suppression effectuée')
} catch {
this.notificationService.error('Erreur', 'Impossible de supprimer la ligne')
this.notificationService.success(
'Success',
'Suppression effectuée'
)
} catch (e) {
this.notificationService.error(
'Erreur',
'Impossible de supprimer la ligne'
)
}
this.quotationsLoading.set(false)
await this.fetchQuotations();
}
async export(quotationId: number) {
async export(quotationId: number){
this.quotationsLoading.set(true)
try {
const pdf = await firstValueFrom(
this.quotationsService.getQuotationPdfEndpoint(quotationId, "response")
);
this.fileService.downloadBlob(pdf)
} catch {
this.notificationService.error('Erreur', 'Impossible de générer un PDF');
} catch (e) {
console.error(e);
this.notificationService.error(
'Erreur',
'Impossible de générer un PDF'
);
}
this.quotationsLoading.set(false)
}
async edit(id: number, updateQuotationComponent: QuotationForm) {
if (updateQuotationComponent.quotationForm.invalid) {
this.notificationService.error('Erreur', 'Formulaire invalide');
return;
}
try {
const quotations = updateQuotationComponent.quotationForm.getRawValue();
await firstValueFrom(this.quotationsService.updateQuotationEndpoint(id, quotations));
this.notificationService.success('Success', 'Devis modifié')
} catch {
this.notificationService.error('Erreur', 'Erreur lors de la modification')
}
}
async deleteProduct(productId: number, quotationId: number) {
this.quotationsLoading.set(true)
try {
await firstValueFrom(this.quotationsService.deleteProductFromQuotationEndpoint(productId, quotationId))
this.notificationService.success('Success', 'Suppression effectuée')
} catch {
this.notificationService.error('Erreur', 'Impossible de supprimer la ligne')
}
this.quotationsLoading.set(false)
await this.fetchQuotations();
}
async editQuantity(productId: number, quotationId: number, updateQuantityComponent: QuantityForm) {
if (updateQuantityComponent.quantityForm.invalid) {
this.notificationService.error('Erreur', 'Formulaire invalide')
return;
}
try {
const quantity = updateQuantityComponent.quantityForm.getRawValue();
await firstValueFrom(this.quotationsService.patchQuotationProductQuantityEndpoint(productId, quotationId, quantity))
this.notificationService.success('Success', 'Quantité modifiée')
} catch {
this.notificationService.error('Erreur', 'Erreur lors de la modification')
}
}
selectedQuotation: GetQuotationDto | null = null;
openEditModal(quotation: GetQuotationDto) {
this.selectedQuotation = {...quotation};
this.modal().showModal();
}
async onModalOk(id: number, updateQuotationComponent: QuotationForm, modal: ModalNav) {
if (!this.selectedQuotation) return;
await this.edit(id, updateQuotationComponent);
updateQuotationComponent.quotationForm.reset();
this.onModalCancel(modal);
await this.fetchQuotations();
}
onModalCancel(modal: ModalNav) {
modal.isVisible = false;
}
selectedQuantity: GetQuotationProductDto | null = null;
openEditQuantityModal(quantity: GetQuotationProductDto) {
this.selectedQuantity = {...quantity};
this.modalQuantity().showModal();
}
async onModalQuantityOk(productId: number, quotationId: number, updateQuantityComponent: QuantityForm, modal: ModalNav) {
if (!this.selectedQuantity) return;
await this.editQuantity(productId, quotationId, updateQuantityComponent);
updateQuantityComponent.quantityForm.reset();
this.onModalCancel(modal);
await this.fetchQuotations();
}
}
+36
View File
@@ -0,0 +1,36 @@
/* From Uiverse.io by LightAndy1 */
.group {
box-shadow: 0 1px 2px 1px #001529;
border-radius: 15px;
padding: 0.1rem 0.5rem 0.1rem 1rem;
display: flex;
line-height: 28px;
align-items: center;
position: relative;
max-width: 400px;
}
.input {
width: 100%;
height: 32px;
line-height: 28px;
padding: 0 1rem;
border: 2px solid transparent;
border-radius: 8px;
outline: none;
background-color: #f3f3f4;
color: #0d0c22;
transition: 0.3s ease;
}
.input::placeholder {
color: #9e9ea7;
}
.input:focus,
input:hover {
outline: none;
border-color: #40A9FF;
background-color: #fff;
box-shadow: 0 0 0 4px rgba(199, 199, 197, 0.1);
}
+10
View File
@@ -0,0 +1,10 @@
<form nz-form nzLayout="horizontal" [formGroup]="searchForm" (ngSubmit)="submitForm()">
<nz-form-item nz-flex>
<nz-form-control nzSpan="12">
<div class="group">
<nz-icon nzType="search" nzTheme="outline" class="mr-2 text-xl"></nz-icon>
<input class="input" placeholder="Rechercher" formControlName="searchValue"/>
</div>
</nz-form-control>
</nz-form-item>
</form>
+37
View File
@@ -0,0 +1,37 @@
import { Component } from '@angular/core';
import {NzIconDirective} from "ng-zorro-antd/icon";
import {NzColDirective} from "ng-zorro-antd/grid";
import {NzFlexDirective} from "ng-zorro-antd/flex";
import {NzFormControlComponent, NzFormDirective, NzFormItemComponent} from "ng-zorro-antd/form";
import {FormControl, FormGroup, ReactiveFormsModule} from "@angular/forms";
@Component({
selector: 'app-search',
imports: [
NzIconDirective,
NzColDirective,
NzFlexDirective,
NzFormControlComponent,
NzFormDirective,
NzFormItemComponent,
ReactiveFormsModule
],
templateUrl: './search.html',
styleUrl: './search.css',
})
export class Search {
searchForm: FormGroup = new FormGroup({
searchValue: new FormControl<string>(null)
})
submitForm() {
// Pour annuler si le formulaire est invalide
if (this.searchForm.invalid) return;
// Pour obtenir la valeur du formulaire
console.log(this.searchForm.getRawValue())
// Pour vider le formulaire
this.searchForm.reset()
}
}
@@ -1,60 +1,35 @@
<form nz-form nzLayout="horizontal" [formGroup]="settingForm">
<form nz-form nzLayout="horizontal" [formGroup]="settingForm" (ngSubmit)="submitForm()">
<!-- Logo -->
<div class="row">
<div class="row-left">
@if (settings().logo) {
<img [src]="settings().logo" alt=""/>
} @else {
<img [src]="setting.logo" alt="logo">
}
<img [src]="setting.logo" alt="logo">
</div>
@if (admin()){
<div class="row-right">
<nz-form-item>
<nz-form-label nzSpan="9">Logo</nz-form-label>
<nz-form-control nzErrorTip="Ce champ est requis">
<input #fileInputLogo nz-input type="file" placeholder="Déposer"
(change)="onFileChange('logo', fileInputLogo.files)">
</nz-form-control>
</nz-form-item>
</div>
} @else {
<div class="row-right">
<nz-form-item>
<p class="text-red-600">Vous ne pouvez pas modifier le logo</p>
</nz-form-item>
</div>
}
<div class="row-right">
<nz-form-item>
<nz-form-label nzSpan="9">Logo</nz-form-label>
<nz-form-control nzSpan="25">
<input nz-input type="file" formControlName="logo" />
</nz-form-control>
</nz-form-item>
</div>
</div>
<!-- Signature -->
<div class="row">
<div class="row-left">
@if (settings().electronicSignature) {
<img [src]="settings().electronicSignature" alt=""/>
} @else {
<img [src]="setting.electronicSignature" alt="logo">
}
<img [src]="setting.signature" alt="logo">
</div>
@if (admin()) {
<div class="row-right">
<nz-form-item>
<nz-form-label nzSpan="9">Signature</nz-form-label>
<nz-form-control nzErrorTip="Ce champ est requis">
<input #fileInputSignature nz-input type="file" placeholder="Déposer"
(change)="onFileChange('electronicSignature', fileInputSignature.files)">
</nz-form-control>
</nz-form-item>
</div>
} @else {
<div class="row-right">
<nz-form-item>
<p class="text-red-600">Vous ne pouvez pas modifier la signature</p>
</nz-form-item>
</div>
}
<div class="row-right">
<nz-form-item>
<nz-form-label nzSpan="9">Signature</nz-form-label>
<nz-form-control nzSpan="25">
<input nz-input type="file" formControlName="signature" />
</nz-form-control>
</nz-form-item>
</div>
</div>
</form>
+21 -64
View File
@@ -1,17 +1,12 @@
import {Component, inject, OnInit, signal} from '@angular/core';
import { Component } from '@angular/core';
import {FormControl, FormGroup, FormsModule, ReactiveFormsModule} from "@angular/forms";
import {NzColDirective} from "ng-zorro-antd/grid";
import {NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
import {NzInputDirective} from "ng-zorro-antd/input";
import {SettingInfo} from "../../interfaces/setting.interface";
import {firstValueFrom} from "rxjs";
import {GetSettingDto, SettingsService} from "../../services/api";
import {NzNotificationService} from "ng-zorro-antd/notification";
import imageCompression from "browser-image-compression";
import {AuthService} from "../../services/auth.service";
@Component({
selector: 'app-setting-form',
selector: 'app-setting-form',
imports: [
FormsModule,
NzColDirective,
@@ -20,68 +15,30 @@ import {AuthService} from "../../services/auth.service";
NzFormItemComponent,
NzFormLabelComponent,
NzInputDirective,
ReactiveFormsModule,
ReactiveFormsModule
],
templateUrl: './setting-form.html',
styleUrl: './setting-form.css',
templateUrl: './setting-form.html',
styleUrl: './setting-form.css',
})
export class SettingForm implements OnInit {
private settingsService = inject(SettingsService);
private notificationService = inject(NzNotificationService);
private authService = inject(AuthService);
export class SettingForm {
settingForm: FormGroup = new FormGroup({
logo: new FormControl<string>(null),
signature: new FormControl<string>(null)
})
settings = signal<GetSettingDto>({});
admin = signal<boolean>(false);
submitForm() {
// Pour annuler si le formulaire est invalide
if (this.settingForm.invalid) return;
// Pour obtenir la valeur du formulaire
console.log(this.settingForm.getRawValue())
// Pour vider le formulaire
this.settingForm.reset()
}
setting: SettingInfo = {
logo: 'https://www.pyro-fetes.com/wp-content/themes/pcptheme/img/logo-pyro-fetes-OR-top.png',
electronicSignature: 'https://www.pyro-fetes.com/wp-content/themes/pcptheme/img/logo-pyro-fetes-OR-top.png'
}
settingForm: FormGroup = new FormGroup({
logo: new FormControl<string>(null),
electronicSignature: new FormControl<string>(null)
})
async ngOnInit() {
await this.fetchSettings();
this.admin.set(this.authService.isAdmin());
}
async fetchSettings() {
try {
const settingsPicture = await firstValueFrom(this.settingsService.getSettingEndpoint());
this.settings.set(settingsPicture);
} catch {
this.notificationService.error('Erreur', 'Aucun paramètre défini')
}
}
async onFileChange(control: string, files?: FileList | null) {
if (!files?.length) return;
const file = files[0];
const options = {
maxSizeMB: 1,
maxWidthOrHeight: 1080,
useWebWorker: true,
fileType: 'image/jpeg'
}
const compressed = await imageCompression(file, options);
try {
if (control === 'logo') {
await firstValueFrom(this.settingsService.patchSettingLogoEndpoint(compressed));
} else {
await firstValueFrom(this.settingsService.patchSettingElectronicSignatureEndpoint(compressed));
}
await this.fetchSettings();
} catch {
this.notificationService.error('Erreur', 'Impossible de changer les paramètres actuellement');
}
this.settingForm.reset();
signature: 'https://www.pyro-fetes.com/wp-content/themes/pcptheme/img/logo-pyro-fetes-OR-top.png'
}
}
@@ -6,7 +6,7 @@
</nz-form-label>
<nz-form-control nzSpan="4" nzErrorTip="Requis">
<input nz-input type="number" placeholder="0" formControlName="minimalQuantity">
<input nz-input type="number" placeholder="12345" formControlName="minimalQuantity">
</nz-form-control>
</nz-form-item>
</form>
+4 -5
View File
@@ -7,7 +7,7 @@ import {NzFlexDirective} from "ng-zorro-antd/flex";
import {GetProductDto} from "../../services/api";
@Component({
selector: 'app-stock-form',
selector: 'app-stock-form',
imports: [
NzFormItemComponent,
NzFormLabelComponent,
@@ -18,8 +18,8 @@ import {GetProductDto} from "../../services/api";
ReactiveFormsModule,
NzFlexDirective
],
templateUrl: './stock-form.html',
styleUrl: './stock-form.css',
templateUrl: './stock-form.html',
styleUrl: './stock-form.css',
})
export class StockForm {
stockForm = new FormGroup({
@@ -27,8 +27,7 @@ export class StockForm {
minimalQuantity: new FormControl<number>(null, [Validators.required])
})
product = input<GetProductDto>();
product= input<GetProductDto>();
constructor() {
effect(() => {
if (this.product()) {
@@ -6,7 +6,7 @@ nz-table {
background: #fff;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
box-shadow: 0 2px 6px rgba(0,0,0,0.1);
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
@@ -66,21 +66,18 @@ nz-table tbody td p {
nz-table thead {
display: none;
}
nz-table tbody tr {
display: block;
margin-bottom: 16px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 1px 3px rgba(0,0,0,0.1);
border-radius: 8px;
padding: 12px;
}
nz-table tbody td {
display: flex;
justify-content: space-between;
padding: 6px 12px;
}
nz-table tbody td::before {
content: attr(data-label);
font-weight: 600;
+16 -18
View File
@@ -1,16 +1,18 @@
<nz-table
[nzData]="products()"
[nzFrontPagination]="false"
[nzLoading]="productsLoading()"
[nzData]="products()"
[nzFrontPagination]="false"
[nzLoading]="productsLoading()"
(nzCurrentPageDataChange)="onCurrentPageDataChange($event)"
>
<thead>
<tr class="text-center">
<th nzWidth="40px">
<label nz-checkbox
[(ngModel)]="checked"
[nzIndeterminate]="indeterminate"
(ngModelChange)="allCheck($event)">
</label>
<label
nz-checkbox
[(ngModel)]="checked"
[nzIndeterminate]="indeterminate"
(ngModelChange)="onAllChecked($event)"
></label>
</th>
<th>Nom</th>
<th>Référence</th>
@@ -30,10 +32,11 @@
<td nzWidth="40px">
<label
nz-checkbox
[ngModel]="selectedIds.includes(product.id)"
[ngModel]="setOfCheckedId.has(product.id)"
(ngModelChange)="onItemChecked(product.id, $event)"
></label>
</td>
<td>{{ product.name }}</td>
<td>{{ product.references }}</td>
<td>{{ product.nec }}</td>
@@ -44,13 +47,9 @@
<td>{{ product.minimalQuantity }}</td>
<td>
<div style="justify-content: center; display: flex">
<nz-icon nzType="edit" nzTheme="outline" class="cursor-pointer"
(click)="openEditModal(product)"></nz-icon>
@if (admin()) {
<nz-divider nzType="vertical"></nz-divider>
<nz-icon nzType="delete" nzTheme="outline" (click)="delete(product.id)"
class="text-red-600 cursor-pointer"></nz-icon>
}
<nz-icon nzType="edit" nzTheme="outline" class="cursor-pointer" (click)="openEditModal(product)"></nz-icon>
<nz-divider nzType="vertical"></nz-divider>
<nz-icon nzType="delete" nzTheme="outline" (click)="delete(product.id)" class="text-red-600 cursor-pointer"></nz-icon>
</div>
</td>
</tr>
@@ -59,8 +58,7 @@
</nz-table>
<div class="hidden">
<app-modal-nav #modalNav nameIcon="edit" [name]="'Modifier'"
(ok)="onModalOk(selectedProduct.id, stockForm, modalNav)" (cancel)="onModalCancel(modalNav)">
<app-modal-nav #modalNav nameIcon="edit" [name]="'Modifier'" (ok)="onModalOk(selectedProduct.id, stockForm, modalNav)" (cancel)="onModalCancel(modalNav)">
<app-stock-form #stockForm [product]="selectedProduct"></app-stock-form>
</app-modal-nav>
</div>
+104 -75
View File
@@ -5,11 +5,10 @@ import {NzIconDirective} from "ng-zorro-antd/icon";
import {StockForm} from "../stock-form/stock-form";
import {NzDividerComponent} from "ng-zorro-antd/divider";
import {FormsModule} from "@angular/forms";
import {NzCheckboxComponent} from "ng-zorro-antd/checkbox";
import {GetProductDto, ProductsService, WarehouseproductsService} from "../../services/api";
import {NzNotificationService} from "ng-zorro-antd/notification";
import {firstValueFrom} from "rxjs";
import {NzCheckboxComponent} from "ng-zorro-antd/checkbox";
import {AuthService} from "../../services/auth.service";
interface ProductWithQuantity extends GetProductDto {
totalQuantity?: number;
@@ -24,8 +23,8 @@ interface ProductWithQuantity extends GetProductDto {
StockForm,
NzDividerComponent,
FormsModule,
NzThMeasureDirective,
NzCheckboxComponent,
NzThMeasureDirective,
],
templateUrl: './stock-table.html',
styleUrl: './stock-table.css',
@@ -35,125 +34,155 @@ export class StockTable implements OnInit {
private productsService = inject(ProductsService);
private wareHousseProductsService = inject(WarehouseproductsService)
private notificationService = inject(NzNotificationService)
private authService = inject(AuthService);
products = signal<ProductWithQuantity[]>([]);
productsLoading = signal<boolean>(false);
admin = signal<boolean>(false);
updateProduct = viewChild.required<StockForm>('stockForm');
modal = viewChild.required<ModalNav>('modalNav');
selectionChange = output<number[]>();
productsTables = output<GetProductDto[]>();
checked = false;
indeterminate = false;
setOfCheckedId = new Set<number>();
selectionChange = output<boolean>()
currentPageData: GetProductDto[] = [];
selectedProduct: GetProductDto | null = null;
checked: boolean = false;
indeterminate: boolean = false;
selectedIds: number[] = [];
get hasSelection(): boolean {
return this.setOfCheckedId.size > 0;
}
updateCheckedSet(id: number, checked: boolean): void {
if (checked) this.setOfCheckedId.add(id);
else this.setOfCheckedId.delete(id);
}
onItemChecked(id: number, checked: boolean): void {
this.updateCheckedSet(id, checked);
this.refreshCheckedStatus();
}
onAllChecked(checked: boolean): void {
this.currentPageData.forEach(item =>
this.updateCheckedSet(item.id, checked)
);
this.refreshCheckedStatus();
}
onCurrentPageDataChange($event: GetProductDto[]): void {
this.currentPageData = $event;
this.refreshCheckedStatus();
}
refreshCheckedStatus(): void {
const total = this.currentPageData.length;
const checkedCount = this.currentPageData.filter(p => this.setOfCheckedId.has(p.id)).length;
this.checked = checkedCount === total;
this.indeterminate = checkedCount > 0 && checkedCount < total;
setTimeout(() => this.selectionChange.emit(this.hasSelection));
}
get selectedIds() {
return Array.from(this.setOfCheckedId);
}
async ngOnInit() {
await this.fetchProducts();
this.admin.set(this.authService.isAdmin());
}
async fetchTotalQuantity(product: ProductWithQuantity) {
try {
const res = await firstValueFrom(
this.wareHousseProductsService.getTotalQuantityEndpoint(product.id)
);
product.totalQuantity = res.totalQuantity;
} catch (e) {
product.totalQuantity = 0;
}
}
async fetchProducts() {
this.productsLoading.set(true);
try {
const products = await firstValueFrom(this.productsService.getAllProductsEndpoint());
this.productsTables.emit(products);
const productsWithQuantity = await Promise.all(
products.map(async (x) => {
try {
const quantity = await firstValueFrom(this.wareHousseProductsService.getTotalQuantityEndpoint(x.id));
return {
...x,
totalQuantity: quantity.totalQuantity ?? 0
};
} catch {
return {
...x,
totalQuantity: 0
};
}
})
);
// transforme chaque produit en ProductWithQuantity
const productsWithQuantity: ProductWithQuantity[] = products.map(p => ({ ...p }));
this.products.set(productsWithQuantity);
} catch {
this.notificationService.error('Erreur', 'Impossible de charger le catalogue');
// récupérer la quantité pour chaque produit en parallèle
await Promise.all(productsWithQuantity.map(p => this.fetchTotalQuantity(p)));
// déclencher la mise à jour du signal
this.products.set([...productsWithQuantity]);
} catch (e) {
this.notificationService.error(
'Erreur',
'Erreur de communication avec l\'API'
);
}
this.productsLoading.set(false);
}
async delete(productId: number) {
async delete(productId:number) {
try {
await firstValueFrom(this.productsService.deleteProductEndpoint(productId))
this.notificationService.success('Success', 'Suppression effectuée');
} catch {
this.notificationService.error('Erreur', 'Impossible de supprimer la ligne');
this.notificationService.success(
'Success',
'Suppression effectuée'
)
} catch (e) {
this.notificationService.error(
'Erreur',
'Impossible de supprimer la ligne'
)
}
await this.fetchProducts();
}
async edit(id: number, updateProductComponent: StockForm) {
if (updateProductComponent.stockForm.invalid) {
this.notificationService.error('Erreur', 'Formulaire invalide')
this.notificationService.error(
'Erreur',
'Erreur d\'écriture dans le formulaire'
)
return;
}
try {
const products = updateProductComponent.stockForm.getRawValue();
await firstValueFrom(this.productsService.patchProductMinimalStockEndpoint(id, products));
await this.fetchProducts();
this.notificationService.success('Success', 'Limite de stock modifiée');
} catch {
this.notificationService.error('Erreur', 'Erreur lors de la modification');
await firstValueFrom(this.productsService.patchProductMinimalStockEndpoint(id, products))
this.notificationService.success(
'Success',
'Limite de stock modifiée'
)
} catch (e) {
console.error(e);
this.notificationService.error(
'Erreur',
'Erreur lors de la modification'
)
}
}
selectedProduct: GetProductDto | null = null;
openEditModal(product: GetProductDto) {
this.selectedProduct = {...product};
this.selectedProduct = { ...product};
this.modal().showModal();
}
async onModalOk(productId: number, updateProductComponent: StockForm, modal: ModalNav) {
if (!this.selectedProduct) return;
await this.edit(productId, updateProductComponent);
updateProductComponent.stockForm.reset();
this.onModalCancel(modal);
modal.isVisible = false;
await this.fetchProducts();
}
onModalCancel(modal: ModalNav) {
modal.isVisible = false;
}
updateCheck(id: number, checked: boolean) {
if (checked) {
if (!this.selectedIds.includes(id)) {
this.selectedIds.push(id);
}
} else this.selectedIds = this.selectedIds.filter(x => x !== id);
}
refreshCheckStatus() {
const total = this.products().length;
const checkedCount = this.selectedIds.length;
this.checked = checkedCount === total;
this.indeterminate = checkedCount > 0 && checkedCount < total;
this.selectionChange.emit(this.selectedIds);
}
allCheck(checked: boolean) {
this.products().forEach(x =>
this.updateCheck(x.id, checked)
);
this.refreshCheckStatus();
}
onItemChecked(id: number, checked: boolean): void {
this.updateCheck(id, checked);
this.refreshCheckStatus();
}
}
@@ -22,8 +22,6 @@ import {GetSupplierDto} from "../../services/api";
styleUrl: './supplier-form.css',
})
export class SupplierForm {
supplier = input<GetSupplierDto>();
supplierForm: FormGroup = new FormGroup({
name: new FormControl<string>(null, [Validators.required]),
email: new FormControl<string>(null, [Validators.required]),
@@ -35,6 +33,7 @@ export class SupplierForm {
})
supplier= input<GetSupplierDto>();
constructor() {
effect(() => {
if (this.supplier()) {
@@ -6,7 +6,7 @@ nz-table {
background: #fff;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
box-shadow: 0 2px 6px rgba(0,0,0,0.1);
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
@@ -66,21 +66,18 @@ nz-table tbody td p {
nz-table thead {
display: none;
}
nz-table tbody tr {
display: block;
margin-bottom: 16px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 1px 3px rgba(0,0,0,0.1);
border-radius: 8px;
padding: 12px;
}
nz-table tbody td {
display: flex;
justify-content: space-between;
padding: 6px 12px;
}
nz-table tbody td::before {
content: attr(data-label);
font-weight: 600;
@@ -36,22 +36,19 @@
</tr>
</thead>
<tbody class="text-center">
@for (product of supplier.prices; track product.productId) {
@for (product of supplier.prices; track product.id) {
<tr>
<td>{{ product.productName }}</td>
<td>{{ product.productReference }}</td>
<td>{{ product.productReferences }}</td>
<td>{{ product.sellingPrice }}€</td>
<td>
<div class="flex items-center justify-center space-x-2">
<nz-icon nzType="edit" nzTheme="outline"
class="cursor-pointer text-gray-600 hover:text-gray-900"
(click)="openEditProductModal(product, supplier.id)"></nz-icon>
@if (admin()) {
<nz-divider nzType="vertical"></nz-divider>
<nz-icon nzType="delete" nzTheme="outline"
class="cursor-pointer text-red-600 hover:text-red-800"
(click)="deleteProduct(product.productId, supplier.id)"></nz-icon>
}
<nz-divider nzType="vertical"></nz-divider>
<nz-icon nzType="delete" nzTheme="outline" class="cursor-pointer text-red-600 hover:text-red-800"
(click)="deleteProduct(product.productId, product.supplierId)"></nz-icon>
</div>
</td>
</tr>
@@ -64,11 +61,9 @@
<div style="display: flex; align-items: center;">
<nz-icon nzType="edit" nzTheme="outline" class="cursor-pointer"
(click)="openEditModal(supplier)"></nz-icon>
@if (admin()) {
<nz-divider nzType="vertical"></nz-divider>
<nz-icon nzType="delete" nzTheme="outline" (click)="delete(supplier.id)"
class="text-red-600 cursor-pointer"></nz-icon>
}
<nz-divider nzType="vertical"></nz-divider>
<nz-icon nzType="delete" nzTheme="outline" (click)="delete(supplier.id)"
class="text-red-600 cursor-pointer"></nz-icon>
</div>
</td>
</tr>
@@ -9,7 +9,6 @@ import {GetPriceDto, GetSupplierDto, PricesService, SuppliersService} from "../.
import {NzNotificationService} from "ng-zorro-antd/notification";
import {firstValueFrom} from "rxjs";
import {PriceForm} from "../price-form/price-form";
import {AuthService} from "../../services/auth.service";
@Component({
selector: 'app-supplier-table',
@@ -30,22 +29,17 @@ export class SupplierTable implements OnInit {
private suppliersService = inject(SuppliersService);
private pricesService = inject(PricesService);
private notificationService = inject(NzNotificationService);
private authService = inject(AuthService);
suppliers = signal<GetSupplierDto[]>([]);
suppliersLoading = signal<boolean>(false);
admin = signal<boolean>(false);
updateSupplier = viewChild.required<SupplierForm>('supplierForm');
supplierModal = viewChild.required<ModalNav>('supplierModal');
productModal = viewChild.required<ModalNav>('productModal');
selectedSupplier: GetSupplierDto | null = null;
selectedProduct: GetPriceDto | null = null;
selectedProductSupplierId: number | null = null;
async ngOnInit() {
await this.fetchSuppliers();
this.admin.set(this.authService.isAdmin());
}
async fetchSuppliers() {
@@ -53,7 +47,7 @@ export class SupplierTable implements OnInit {
try {
const suppliers = await firstValueFrom(this.suppliersService.getAllSuppliersEndpoint());
this.suppliers.set(suppliers);
} catch {
} catch (e) {
this.notificationService.error('Erreur', 'Erreur de communication avec l\'API');
}
this.suppliersLoading.set(false);
@@ -68,7 +62,8 @@ export class SupplierTable implements OnInit {
const suppliers = updateSupplierComponent.supplierForm.getRawValue();
await firstValueFrom(this.suppliersService.updateSupplierEndpoint(id, suppliers));
this.notificationService.success('Success', 'Fournisseur modifié');
} catch {
} catch (e) {
console.error(e);
this.notificationService.error('Erreur', 'Erreur lors de la modification');
}
}
@@ -78,18 +73,18 @@ export class SupplierTable implements OnInit {
await firstValueFrom(this.suppliersService.deleteSupplierEndpoint(supplier));
this.notificationService.success('Succès', 'Suppression effectuée');
await this.fetchSuppliers();
} catch {
} catch (e) {
this.notificationService.error('Erreur', 'Impossible de supprimer la ligne');
}
}
openEditModal(supplier: GetSupplierDto) {
this.selectedSupplier = {...supplier};
this.selectedSupplier = { ...supplier };
this.supplierModal().showModal();
}
openEditProductModal(product: GetPriceDto, supplierId: number) {
this.selectedProduct = {...product};
this.selectedProduct = { ...product };
this.selectedProductSupplierId = supplierId;
this.productModal().showModal();
}
@@ -110,13 +105,13 @@ export class SupplierTable implements OnInit {
modal: ModalNav
) {
if (productId == null || supplierId == null || !this.selectedProduct) {
this.notificationService.error('Erreur', 'Identifiants produit ou fournisseur manquants');
this.notificationService.error('Erreur', 'Identifiants produit/fournisseur manquants');
return;
}
await this.editPrice(productId, supplierId, updateProductComponent);
updateProductComponent.priceForm.reset();
this.onModalCancel(modal);
modal.isVisible = false;
await this.fetchSuppliers();
}
@@ -138,7 +133,8 @@ export class SupplierTable implements OnInit {
};
await firstValueFrom(this.pricesService.patchPriceEndpoint(productId, supplierId, body));
this.notificationService.success('Success', 'Prix modifié');
} catch {
} catch (e) {
console.error(e);
this.notificationService.error('Erreur', 'Erreur lors de la modification');
}
}
@@ -146,10 +142,10 @@ export class SupplierTable implements OnInit {
async deleteProduct(idProduct: number, idSupplier: number) {
try {
await firstValueFrom(this.suppliersService.deleteProductToSupplierEndpoint(idSupplier, idProduct));
await firstValueFrom(this.pricesService.deletePriceEndpoint(idProduct, idSupplier));
this.notificationService.success('Succès', 'Produit supprimé');
await this.fetchSuppliers();
} catch {
} catch (e) {
this.notificationService.error('Erreur', 'Impossible de supprimer le produit');
}
}
+2 -5
View File
@@ -6,7 +6,7 @@ nz-table {
background: #fff;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
box-shadow: 0 2px 6px rgba(0,0,0,0.1);
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
@@ -66,21 +66,18 @@ nz-table tbody td p {
nz-table thead {
display: none;
}
nz-table tbody tr {
display: block;
margin-bottom: 16px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 1px 3px rgba(0,0,0,0.1);
border-radius: 8px;
padding: 12px;
}
nz-table tbody td {
display: flex;
justify-content: space-between;
padding: 6px 12px;
}
nz-table tbody td::before {
content: attr(data-label);
font-weight: 600;
+7 -10
View File
@@ -2,7 +2,7 @@
[nzLoading]="usersLoading()"
[nzFrontPagination]="false"
class="mr-7">
<thead>
<thead>
<tr class="text-center">
<th>Prénom</th>
<th>Email</th>
@@ -13,17 +13,15 @@
<tbody class="text-center">
@for (user of users(); track user.id) {
<tr>
<td>{{ user.name }}</td>
<td>{{ user.email }}</td>
<td>{{ user.fonction }}</td>
<td>{{user.name}}</td>
<td>{{user.email}}</td>
<td>{{user.fonction}}</td>
<td>
<div style="justify-content: center; display: flex">
<nz-icon nzType="edit" nzTheme="outline" class="cursor-pointer"
(click)="openEditModal(user)"></nz-icon>
<nz-icon nzType="edit" nzTheme="outline" class="cursor-pointer" (click)="openEditModal(user)"></nz-icon>
<nz-divider nzType="vertical"></nz-divider>
<div>
<nz-icon nzType="delete" nzTheme="outline" (click)="delete(user.id)"
class="cursor-pointer text-red-700"/>
<nz-icon nzType="delete" nzTheme="outline" (click)="delete(user.id)" class="cursor-pointer text-red-700"/>
</div>
</div>
</td>
@@ -33,8 +31,7 @@
</nz-table>
<div class="hidden">
<app-modal-nav #modalNav nameIcon="edit" [name]="'Modifier'" (ok)="onModalOk(selectedUser.id, updateUser, modalNav)"
(cancel)="onModalCancel(modalNav)">
<app-modal-nav #modalNav nameIcon="edit" [name]="'Modifier'" (ok)="onModalOk(selectedUser.id, updateUser, modalNav)" (cancel)="onModalCancel(modalNav)">
<app-profil-form #updateUser [user]="selectedUser"></app-profil-form>
</app-modal-nav>
</div>
+34 -19
View File
@@ -9,7 +9,7 @@ import {NzNotificationService} from "ng-zorro-antd/notification";
import {firstValueFrom} from "rxjs";
@Component({
selector: 'app-user-table',
selector: 'app-user-table',
imports: [
ModalNav,
NzIconDirective,
@@ -17,16 +17,15 @@ import {firstValueFrom} from "rxjs";
ProfilForm,
NzDividerComponent
],
templateUrl: './user-table.html',
styleUrl: './user-table.css',
templateUrl: './user-table.html',
styleUrl: './user-table.css',
})
export class UserTable implements OnInit {
private usersService = inject(UsersService);
private notificationService = inject(NzNotificationService)
users = signal<GetUserDto[]>([]);
usersLoading = signal<boolean>(false);
updateUser = viewChild.required<ProfilForm>('profilForm');
modal = viewChild.required<ModalNav>('modalNav');
async ngOnInit() {
@@ -39,25 +38,37 @@ export class UserTable implements OnInit {
try {
const users = await firstValueFrom(this.usersService.getAllUsersEndpoint())
this.users.set(users);
} catch {
this.notificationService.error('Erreur', 'Impossible de charger les utilisateurs')
} catch (e) {
this.notificationService.error(
'Erreur',
'Erreur de communication avec l\'API'
)
}
this.usersLoading.set(false)
}
async delete(user: number) {
async delete(user:number) {
try {
await firstValueFrom(this.usersService.deleteUserEndpoint(user))
this.notificationService.success('Success', 'Suppression effectuée')
} catch {
this.notificationService.error('Erreur', 'Impossible de supprimer la ligne')
this.notificationService.success(
'Success',
'Suppression effectuée'
)
} catch (e) {
this.notificationService.error(
'Erreur',
'Impossible de supprimer la ligne'
)
}
await this.fetchUsers();
}
async edit(id: number, updateUserComponent: ProfilForm) {
if (updateUserComponent.profilForm.invalid) {
this.notificationService.error('Erreur', 'Formulaire invalide')
this.notificationService.error(
'Erreur',
'Erreur d\'écriture dans le formulaire'
)
return;
}
@@ -65,16 +76,21 @@ export class UserTable implements OnInit {
const users = updateUserComponent.profilForm.getRawValue();
await firstValueFrom(this.usersService.updateUserEndpoint(id, users))
this.notificationService.success('Success', 'Utilisateur modifié')
} catch {
this.notificationService.error('Erreur', 'Erreur lors de la modification')
this.notificationService.success(
'Success',
'Utilisateur modifié'
)
} catch (e) {
this.notificationService.error(
'Erreur',
'Erreur lors de la modification'
)
}
}
selectedUser: GetUserDto | null = null;
openEditModal(user: GetUserDto) {
this.selectedUser = {...user};
this.selectedUser = { ...user };
this.modal().showModal();
}
@@ -83,10 +99,9 @@ export class UserTable implements OnInit {
await this.edit(userId, updateUserComponent);
updateUserComponent.profilForm.reset();
this.onModalCancel(modal);
modal.isVisible = false;
await this.fetchUsers();
}
onModalCancel(modal: ModalNav) {
modal.isVisible = false;
}
-14
View File
@@ -1,14 +0,0 @@
import { inject } from '@angular/core';
import { Router } from '@angular/router';
import { AuthService} from "../services/auth.service";
export const authGuard = async () => {
const auth = inject(AuthService);
const router = inject(Router);
if(!auth.userAuthenticated()) {
await router.navigateByUrl('/login');
return false;
}
return true
};
-48
View File
@@ -1,48 +0,0 @@
import {HttpInterceptorFn, HttpErrorResponse, HttpRequest, HttpHandlerFn} from '@angular/common/http';
import {inject} from '@angular/core';
import {AuthService} from '../services/auth.service';
import {RefreshService} from '../services/api';
import {NzNotificationService} from 'ng-zorro-antd/notification';
import {catchError, switchMap, throwError} from 'rxjs';
export const authInterceptor: HttpInterceptorFn = (req: HttpRequest<any>, next: HttpHandlerFn) => {
const authService = inject(AuthService);
const refreshService = inject(RefreshService);
const notification = inject(NzNotificationService);
const token = authService.getToken();
let authReq = req;
if (token) {
authReq = req.clone({
setHeaders: {Authorization: `Bearer ${token}`}
});
}
return next(authReq).pipe(
catchError((error: HttpErrorResponse) => {
if (error.status === 401 && token) {
return refreshService.refreshTokenEndpoint({token})
.pipe(
switchMap((res: any) => {
authService.setToken(res.token);
const newReq = req.clone({
setHeaders: {Authorization: `Bearer ${res.token}`}
});
return next(newReq);
}),
catchError((refreshErr) => {
authService.logout();
notification.error('Session expirée', 'Veuillez vous reconnecter.');
return throwError(() => refreshErr);
})
);
}
if (error.status === 403) {
notification.error('Accès refusé', 'Vous navez pas les droits pour cette action.');
}
return throwError(() => error);
})
);
};
+5
View File
@@ -0,0 +1,5 @@
export interface NotifInfo {
author: string;
title: string;
content: string;
}
+1 -1
View File
@@ -1,4 +1,4 @@
export interface SettingInfo {
logo: string;
electronicSignature: string;
signature: string;
}
+5
View File
@@ -0,0 +1,5 @@
export interface UserInfo {
name: string;
email: string;
fonction: string;
}
-27
View File
@@ -1,27 +0,0 @@
<div class="flex w-full px-4 gap-4 items-start mt-6">
<div class="w-1/2">
<app-delivery-validator></app-delivery-validator>
</div>
<div class="w-1/2 mt-10 flex flex-col gap-4">
<p class="text-2xl font-bold">Tableau de bord</p>
<div class="grid grid-cols-2 gap-4">
<app-info-card color="#f59e0b" icon="inbox"
[value]="productsUnderLimitCount()"
description="Produits sous le seuil minimal.">
</app-info-card>
<app-info-card color="#3b82f6" icon="team"
[value]="deliversCount()+suppliersCount()"
description="Partenaires actifs.">
</app-info-card>
<app-info-card color="#10b981" icon="truck"
[value]="deliversCount()"
description="Livreurs partenaires.">
</app-info-card>
<app-info-card color="#ef4444" icon="shop"
[value]="suppliersCount()"
description="Fournisseurs partenaires.">
</app-info-card>
</div>
</div>
</div>
+5 -1
View File
@@ -8,8 +8,12 @@
<app-deliverer-form #delivererForm></app-deliverer-form>
</app-modal-button>
<div class="ml-95 w-150">
<app-search class="w-full"></app-search>
</div>
</div>
<div class="mt-4">
<div class="mt-1">
<app-deliverer-table #delivererTable></app-deliverer-table>
</div>
+21 -9
View File
@@ -2,19 +2,21 @@ import {Component, inject, viewChild} from '@angular/core';
import {ModalButton} from "../../components/modal-button/modal-button";
import {DelivererTable} from "../../components/deliverer-table/deliverer-table";
import {DelivererForm} from "../../components/deliverer-form/deliverer-form";
import {Search} from "../../components/search/search";
import {DeliverersService} from "../../services/api";
import {NzNotificationService} from "ng-zorro-antd/notification";
import {firstValueFrom} from "rxjs";
@Component({
selector: 'app-deliverer',
selector: 'app-deliverer',
imports: [
ModalButton,
DelivererTable,
DelivererForm,
Search
],
templateUrl: './deliverer.html',
styleUrl: './deliverer.css',
templateUrl: './deliverer.html',
styleUrl: './deliverer.css',
})
export class Deliverer {
modal = viewChild.required<ModalButton>('modalButton');
@@ -26,7 +28,7 @@ export class Deliverer {
async onModalOk() {
await this.addDeliverer()
this.createDeliverer().delivererForm.reset();
this.onModalCancel();
this.modal().isVisible = false;
await this.delivererTable().fetchDeliverers()
}
@@ -35,16 +37,26 @@ export class Deliverer {
}
async addDeliverer() {
if (this.createDeliverer().delivererForm.invalid) {
this.notificationService.error('Erreur', 'Formulaire invalide')
if (this.createDeliverer().delivererForm.invalid)
{
this.notificationService.error(
'Erreur',
'Erreur d\'écriture dans le formulaire'
)
}
try {
const deliverers = this.createDeliverer().delivererForm.getRawValue();
await firstValueFrom(this.deliverersService.createDelivererEndpoint(deliverers))
this.notificationService.success('Success', 'Transporteur enregistré')
} catch {
this.notificationService.error('Erreur', 'Erreur d\'enregistrement')
this.notificationService.success(
'Success',
'Transporteur enregistré'
)
} catch (e) {
this.notificationService.error(
'Erreur',
'Erreur d\'enregistrement'
)
}
}
}
+11 -1
View File
@@ -1,3 +1,13 @@
<div class="mt-2">
<div class="flex mt-2">
<app-modal-button type="primary" name="Créer un bon de livraison" size="32%">
<app-deliverery-note-form></app-deliverery-note-form>
</app-modal-button>
<div class="ml-95 w-150">
<app-search></app-search>
</div>
</div>
<div class="mt-1">
<app-deliverery-note-table></app-deliverery-note-table>
</div>
+10 -4
View File
@@ -1,13 +1,19 @@
import {Component} from '@angular/core';
import { Component } from '@angular/core';
import {DelivereryNoteTable} from "../../components/deliverery-note-table/deliverery-note-table";
import {ModalButton} from "../../components/modal-button/modal-button";
import {DelivereryNoteForm} from "../../components/deliverery-note-form/deliverery-note-form";
import {Search} from "../../components/search/search";
@Component({
selector: 'app-delivery-note',
selector: 'app-delivery-note',
imports: [
DelivereryNoteTable,
ModalButton,
DelivereryNoteForm,
Search
],
templateUrl: './delivery-note.html',
styleUrl: './delivery-note.css',
templateUrl: './delivery-note.html',
styleUrl: './delivery-note.css',
})
export class DeliveryNote {
View File
-46
View File
@@ -1,46 +0,0 @@
<div class="grid grid-cols-9 min-h-screen bg-blue-950">
<div class="col-span-6 w-full h-full border rounded-r-4xl overflow-hidden">
<img src="https://www.pyro-fetes.com/wp-content/uploads/2023/03/5I9A3180-scaled.jpg"
class="w-full h-full object-cover"
alt=""
/>
</div>
<div class="col-span-3 w-full flex items-center justify-center">
<div class="flex flex-col items-center">
<img src="https://www.pyro-fetes.com/wp-content/uploads/2020/10/PyroFetes-logo-OR.png"
class="w-9/12 mb-10"
alt=""
/>
<div class="bg-white border rounded-2xl p-8 w-80 shadow-lg">
<form nz-form nzLayout="vertical" [formGroup]="loginForm">
<nz-form-item>
<nz-form-label nzRequired>
Nom d'utilisateur
</nz-form-label>
<nz-form-control nzErrorTip="Ce champ est requis">
<input nz-input placeholder="Nom d'utilisateur" formControlName="name">
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label nzRequired class="mt-3">
Mot de passe
</nz-form-label>
<nz-form-control nzErrorTip="Ce champ est requis">
<input nz-input type="password" placeholder="Mot de passe" formControlName="password">
</nz-form-control>
</nz-form-item>
<button class="mt-4 rounded-xl w-full" nz-button nzType="primary" (click)="connectUser()">
Connexion
</button>
</form>
</div>
</div>
</div>
</div>
-43
View File
@@ -1,43 +0,0 @@
import {Component, inject, OnInit} from '@angular/core';
import {NzColDirective} from "ng-zorro-antd/grid";
import {NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
import {NzInputDirective} from "ng-zorro-antd/input";
import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms";
import {NzButtonComponent} from "ng-zorro-antd/button";
import {AuthService} from "../../services/auth.service";
import {Router} from "@angular/router";
@Component({
selector: 'app-login',
imports: [
NzColDirective,
NzFormControlComponent,
NzFormDirective,
NzFormItemComponent,
NzFormLabelComponent,
NzInputDirective,
ReactiveFormsModule,
NzButtonComponent
],
templateUrl: './login.html',
styleUrl: './login.css',
})
export class Login implements OnInit {
private authService = inject(AuthService);
private router = inject(Router);
ngOnInit() {
this.authService.logout();
}
loginForm: FormGroup = new FormGroup({
name: new FormControl<string>(null, [Validators.required]),
password: new FormControl<string>(null, [Validators.required])
})
async connectUser() {
if (this.loginForm.invalid) return;
const ok = await this.authService.connectUser(this.loginForm.value.name, this.loginForm.value.password);
if (ok) await this.router.navigate(['/dashboard']);
}
}
@@ -1,4 +1,10 @@
<div class="mt-2">
<div class="flex mt-2">
<div class="ml-95 w-150">
<app-search></app-search>
</div>
</div>
<div class="mt-1">
<app-purchase-order-table></app-purchase-order-table>
</div>
@@ -1,13 +1,15 @@
import {Component} from '@angular/core';
import { Component } from '@angular/core';
import {Search} from "../../components/search/search";
import {PurchaseOrderTable} from "../../components/purchase-order-table/purchase-order-table";
@Component({
selector: 'app-purchase-order',
selector: 'app-purchase-order',
imports: [
Search,
PurchaseOrderTable,
],
templateUrl: './purchase-order.html',
styleUrl: './purchase-order.css',
templateUrl: './purchase-order.html',
styleUrl: './purchase-order.css',
})
export class PurchaseOrder {
+7 -1
View File
@@ -1,3 +1,9 @@
<div class="mt-2">
<div class="flex mt-2">
<div class="ml-95 w-150">
<app-search></app-search>
</div>
</div>
<div class="mt-1">
<app-quotation-table></app-quotation-table>
</div>
+6 -4
View File
@@ -1,13 +1,15 @@
import {Component} from '@angular/core';
import { Component } from '@angular/core';
import {Search} from "../../components/search/search";
import {QuotationTable} from "../../components/quotation-table/quotation-table";
@Component({
selector: 'app-quotation',
selector: 'app-quotation',
imports: [
Search,
QuotationTable
],
templateUrl: './quotation.html',
styleUrl: './quotation.css',
templateUrl: './quotation.html',
styleUrl: './quotation.css',
})
export class Quotation {
+11 -43
View File
@@ -1,51 +1,19 @@
<div class="flex mt-2">
@if (productIds().length) {
<app-modal-button #modalButtonPurchaseOrder
(click)="openPurchaseOrderForm()"
(ok)="onModalPurchaseOrderOk()"
(cancel)="onModalPurchaseOrderCancel()"
type="default"
name="Créer un bon de commande"
size="35%"
class="ml-4">
<app-create-purchaseorder-form #purchaseOrderForm
[suppliers]="suppliers()"
[products]="selectedProducts()">
</app-create-purchaseorder-form>
@if (hasSelection) {
<app-modal-button #modalButton type="default" name="Créer un bon de commande" size="35%" class="ml-4">
<app-purchase-order-form #purchaseOrderForm></app-purchase-order-form>
</app-modal-button>
<app-modal-button #modalButtonQuotation
type="default"
name="Créer un devis"
size="35%"
class="ml-4"
(click)="openQuotationForm()"
(ok)="onModalQuotationOk()"
(cancel)="onModalQuotationCancel()">
<app-create-quotation-form #quotationForm
[suppliers]="suppliers()"
[products]="selectedProducts()">
</app-create-quotation-form>
</app-modal-button>
<app-modal-button #modalButtonSupplier
type="default"
name="Associer à un fournisseur"
size="35%"
class="ml-4"
(click)="openSupplierForm()"
(ok)="onModalSupplierOk()"
(cancel)="onModalSupplierCancel()">
<app-add-product-supplier-form #supplierForm
[suppliers]="suppliers()"
[products]="selectedProducts()">
</app-add-product-supplier-form>
<app-modal-button #modalButton type="default" name="Créer un devis" size="35%" class="ml-4" (click)="test()">
<app-quotation-form #quotationForm></app-quotation-form>
</app-modal-button>
}
<div class="ml-95 w-150">
<app-search class="w-full"></app-search>
</div>
</div>
<div class="mt-4">
<app-stock-table (selectionChange)="onSelectionChange($event)"
(productsTables)="products.set($event)">
</app-stock-table>
<div class="mt-1">
<app-stock-table #stockTable (selectionChange)="onSelectionChange($event)"></app-stock-table>
</div>
+57 -190
View File
@@ -1,210 +1,77 @@
import {Component, inject, OnInit, signal, viewChild} from '@angular/core';
import {Component, inject, viewChild} from '@angular/core';
import {StockTable} from "../../components/stock-table/stock-table";
import {Search} from "../../components/search/search";
import {ModalButton} from "../../components/modal-button/modal-button";
import {CreatePurchaseorderForm} from "../../components/create-purchaseorder-form/create-purchaseorder-form";
import {PurchaseOrderForm} from "../../components/purchase-order-form/purchase-order-form";
import {QuotationForm} from "../../components/quotation-form/quotation-form";
import {ProductsService} from "../../services/api";
import {NzNotificationService} from "ng-zorro-antd/notification";
import {
CreatePurchaseOrderDto, CreateQuotationDto,
GetProductDto,
GetSupplierDto,
PurchaseordersService,
QuotationsService,
SuppliersService
} from "../../services/api";
import {firstValueFrom} from "rxjs";
import {CreateQuotationForm} from "../../components/create-quotation-form/create-quotation-form";
import {AddProductSupplierForm} from "../../components/add-product-supplier-form/add-product-supplier-form";
@Component({
selector: 'app-stock',
selector: 'app-stock',
imports: [
StockTable,
Search,
ModalButton,
CreatePurchaseorderForm,
CreateQuotationForm,
AddProductSupplierForm,
PurchaseOrderForm,
QuotationForm,
],
templateUrl: './stock.html',
styleUrl: './stock.css',
templateUrl: './stock.html',
styleUrl: './stock.css',
})
export class Stock implements OnInit {
createPurchaseOrder = viewChild.required<CreatePurchaseorderForm>('purchaseOrderForm');
createQuotation = viewChild.required<CreateQuotationForm>('quotationForm');
addProduct = viewChild.required<AddProductSupplierForm>('supplierForm');
modalButtonPurchaseOrder = viewChild.required<ModalButton>('modalButtonPurchaseOrder');
modalButtonQuotation = viewChild.required<ModalButton>('modalButtonQuotation');
modalButtonSupplier = viewChild.required<ModalButton>('modalButtonSupplier');
export class Stock {
modal = viewChild.required<ModalButton>('modalButton');
createQuotation = viewChild.required<QuotationForm>('quotationForm');
createPurchaseOrder = viewChild.required<PurchaseOrderForm>('purchaseOrderForm');
productTable = viewChild.required<StockTable>('stockTable');
private productsService = inject(ProductsService);
private notificationService = inject(NzNotificationService)
private purchaseOrdersService = inject(PurchaseordersService);
private quotationsService = inject(QuotationsService);
private suppliersService = inject(SuppliersService);
private notificationService = inject(NzNotificationService);
// async onModalOk() {
// await this.addSupplier()
// this.createSupplier().supplierForm.reset();
// this.modal().isVisible = false;
// await this.supplierTable().fetchSuppliers()
// }
//
// onModalCancel() {
// this.modal().isVisible = false;
// }
//
// async addSupplier() {
// if (this.createSupplier().supplierForm.invalid)
// {
// this.notificationService.error(
// 'Erreur',
// 'Erreur d\'écriture dans le formulaire'
// )
// }
// try {
// const suppliers = this.createSupplier().supplierForm.getRawValue();
// await firstValueFrom(this.usersService.createSupplierEndpoint(suppliers))
//
// this.notificationService.success(
// 'Success',
// 'Fournisseur enregistré'
// )
// } catch (e) {
// this.notificationService.error(
// 'Erreur',
// 'Erreur d\'enregistrement'
// )
// }
// }
products = signal<GetProductDto[]>([]);
suppliers = signal<GetSupplierDto[]>([]);
selectedProducts = signal([]);
hasSelection = false;
productIds = signal<number[]>([]);
async ngOnInit() {
try {
const suppliers = await firstValueFrom(this.suppliersService.getAllSuppliersEndpoint());
this.suppliers.set(suppliers);
} catch {
this.notificationService.error('Erreur', 'Impossible de charger les fournisseurs');
}
onSelectionChange(value: boolean) {
this.hasSelection = value;
}
onSelectionChange(ids: number[]) {
this.productIds.set(ids);
this.selectedProducts.set(this.products().filter(x => ids.includes(x.id)));
test(){
console.log(this.productTable().selectedIds);
}
openPurchaseOrderForm() {
this.createPurchaseOrder().addProductToForm();
}
openQuotationForm() {
this.createQuotation().addProductToForm();
}
openSupplierForm() {
this.addProduct().addProductToForm();
}
async addPurchaseOrder() {
const form = this.createPurchaseOrder().createPurchaseOrderForm;
if (form.invalid) {
this.notificationService.error('Erreur', 'Formulaire invalide');
return;
}
const orderLines = this.createPurchaseOrder().lines.value.map((line: { productId: any; quantity: any; }) => ({
productId: line.productId,
quantity: line.quantity
}));
if (!orderLines.length) {
this.notificationService.error('Erreur', 'Aucun produit sélectionné');
return;
}
const purchaseOrder: CreatePurchaseOrderDto = {
purchaseConditions: form.value.purchaseConditions,
products: orderLines,
supplierId: form.value.supplierId
};
try {
await firstValueFrom(this.purchaseOrdersService.createPurchaseOrder(purchaseOrder));
this.notificationService.success('Succès', 'Bon de commande créé');
} catch {
this.notificationService.error('Erreur', 'Erreur lors de la création du bon de commande.');
}
}
async addQuotation() {
const form = this.createQuotation().createQuotationForm;
if (form.invalid) {
this.notificationService.error('Erreur', 'Formulaire invalide');
return;
}
const orderLines = this.createQuotation().lines.value.map((line: { productId: any; quantity: any; }) => ({
productId: line.productId,
quantity: line.quantity
}));
if (!orderLines.length) {
this.notificationService.error('Erreur', 'Aucun produit sélectionné');
return;
}
const quotation: CreateQuotationDto = {
message: this.createQuotation().createQuotationForm.value.message,
conditionsSale: this.createQuotation().createQuotationForm.value.conditionsSale,
customerId: this.createQuotation().createQuotationForm.value.customerId,
supplierId: this.createQuotation().createQuotationForm.value.supplierId,
products: orderLines
};
try {
await firstValueFrom(this.quotationsService.createQuotationEndpoint(quotation));
this.notificationService.success('Succès', 'Devis créé');
} catch {
this.notificationService.error('Erreur', 'Erreur lors de la création du devis.');
}
}
async addProductFromSupplier() {
const form = this.addProduct().addProductForm;
let success = 0;
if (form.invalid) {
this.notificationService.error('Erreur', 'Formulaire invalide');
return;
}
const supplierId = form.value.supplierId;
const lines = this.addProduct().lines.value;
if (!lines.length) {
this.notificationService.error('Erreur', 'Aucun produit sélectionné');
return;
}
for (const line of lines) {
try {
await firstValueFrom(
this.suppliersService.addProductToSupplierEndpoint(
supplierId,
line.productId,
{
sellingPrice: line.price
}
)
);
success++;
} catch {
}
}
this.notificationService.success('Succès', `${success} produits ajoutés`);
}
async onModalPurchaseOrderOk() {
await this.addPurchaseOrder();
this.createPurchaseOrder().createPurchaseOrderForm.reset();
this.modalButtonPurchaseOrder().isVisible = false;
this.onModalPurchaseOrderCancel();
}
onModalPurchaseOrderCancel() {
this.modalButtonPurchaseOrder().isVisible = false;
}
async onModalQuotationOk() {
await this.addQuotation();
this.createQuotation().createQuotationForm.reset();
this.modalButtonQuotation().isVisible = false;
this.onModalQuotationCancel();
}
onModalQuotationCancel() {
this.modalButtonQuotation().isVisible = false;
}
async onModalSupplierOk() {
await this.addProductFromSupplier();
this.addProduct().addProductForm.reset();
this.modalButtonSupplier().isVisible = false;
this.onModalSupplierCancel();
}
onModalSupplierCancel() {
this.modalButtonSupplier().isVisible = false;
}
}

Some files were not shown because too many files have changed in this diff Show More