From ebe098848379c34f67998a20acca6b4ad73e5cbb Mon Sep 17 00:00:00 2001 From: Jake Date: Thu, 3 Feb 2022 10:31:22 +0000 Subject: [PATCH 01/25] HT-13 Add vue router --- ui/package-lock.json | 336 ++++++++++++++++++++++++++++++++++++++- ui/package.json | 3 +- ui/src/App.vue | 10 +- ui/src/main.js | 2 + ui/src/router/router.js | 33 ++++ ui/src/views/MyBills.vue | 13 ++ ui/src/views/PayBill.vue | 13 ++ 7 files changed, 395 insertions(+), 15 deletions(-) create mode 100644 ui/src/router/router.js create mode 100644 ui/src/views/MyBills.vue create mode 100644 ui/src/views/PayBill.vue diff --git a/ui/package-lock.json b/ui/package-lock.json index ce14129..3d28285 100644 --- a/ui/package-lock.json +++ b/ui/package-lock.json @@ -8,8 +8,11 @@ "name": "cssd-assignment", "version": "0.1.0", "dependencies": { + "bootstrap": "^4.6.1", + "bootstrap-vue": "^2.21.2", "core-js": "^3.6.5", - "vue": "^2.6.11" + "vue": "^2.6.11", + "vue-router": "^3.5.3" }, "devDependencies": { "@vue/cli-plugin-babel": "~4.5.0", @@ -1724,6 +1727,87 @@ "node": ">= 6" } }, + "node_modules/@nuxt/opencollective": { + "version": "0.3.2", + "resolved": "https://registry.npmjs.org/@nuxt/opencollective/-/opencollective-0.3.2.tgz", + "integrity": "sha512-XG7rUdXG9fcafu9KTDIYjJSkRO38EwjlKYIb5TQ/0WDbiTUTtUtgncMscKOYzfsY86kGs05pAuMOR+3Fi0aN3A==", + "dependencies": { + "chalk": "^4.1.0", + "consola": "^2.15.0", + "node-fetch": "^2.6.1" + }, + "bin": { + "opencollective": "bin/opencollective.js" + }, + "engines": { + "node": ">=8.0.0", + "npm": ">=5.0.0" + } + }, + "node_modules/@nuxt/opencollective/node_modules/ansi-styles": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", + "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", + "dependencies": { + "color-convert": "^2.0.1" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/chalk/ansi-styles?sponsor=1" + } + }, + "node_modules/@nuxt/opencollective/node_modules/chalk": { + "version": "4.1.2", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", + "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", + "dependencies": { + "ansi-styles": "^4.1.0", + "supports-color": "^7.1.0" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/chalk/chalk?sponsor=1" + } + }, + "node_modules/@nuxt/opencollective/node_modules/color-convert": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", + "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", + "dependencies": { + "color-name": "~1.1.4" + }, + "engines": { + "node": ">=7.0.0" + } + }, + "node_modules/@nuxt/opencollective/node_modules/color-name": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", + "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==" + }, + "node_modules/@nuxt/opencollective/node_modules/has-flag": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", + "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", + "engines": { + "node": ">=8" + } + }, + "node_modules/@nuxt/opencollective/node_modules/supports-color": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", + "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", + "dependencies": { + "has-flag": "^4.0.0" + }, + "engines": { + "node": ">=8" + } + }, "node_modules/@soda/friendly-errors-webpack-plugin": { "version": "1.8.1", "resolved": "https://registry.npmjs.org/@soda/friendly-errors-webpack-plugin/-/friendly-errors-webpack-plugin-1.8.1.tgz", @@ -3401,6 +3485,32 @@ "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24=", "dev": true }, + "node_modules/bootstrap": { + "version": "4.6.1", + "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.6.1.tgz", + "integrity": "sha512-0dj+VgI9Ecom+rvvpNZ4MUZJz8dcX7WCX+eTID9+/8HgOkv3dsRzi8BGeZJCQU6flWQVYxwTQnEZFrmJSEO7og==", + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/bootstrap" + }, + "peerDependencies": { + "jquery": "1.9.1 - 3", + "popper.js": "^1.16.1" + } + }, + "node_modules/bootstrap-vue": { + "version": "2.21.2", + "resolved": "https://registry.npmjs.org/bootstrap-vue/-/bootstrap-vue-2.21.2.tgz", + "integrity": "sha512-0Exe+4MZysqhZNXIKf4TzkvXaupxh9EHsoCRez0o5Dc0J7rlafayOEwql63qXv74CgZO8E4U8ugRNJko1vMvNw==", + "hasInstallScript": true, + "dependencies": { + "@nuxt/opencollective": "^0.3.2", + "bootstrap": ">=4.5.3 <5.0.0", + "popper.js": "^1.16.1", + "portal-vue": "^2.1.7", + "vue-functional-data-merge": "^3.1.0" + } + }, "node_modules/brace-expansion": { "version": "1.1.11", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", @@ -4428,6 +4538,11 @@ "node": ">=0.8" } }, + "node_modules/consola": { + "version": "2.15.3", + "resolved": "https://registry.npmjs.org/consola/-/consola-2.15.3.tgz", + "integrity": "sha512-9vAdYbHj6x2fLKC4+oPH0kFzY/orMZyG2Aj+kNylHxKGJ/Ed4dpNyAQYwJOdqO4zdM7XpVHmyejQDcQHrnuXbw==" + }, "node_modules/console-browserify": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.2.0.tgz", @@ -8575,6 +8690,12 @@ "integrity": "sha512-JVAfqNPTvNq3sB/VHQJAFxN/sPgKnsKrCwyRt15zwNCdrMMJDdcEOdubuy+DuJYYdm0ox1J4uzEuYKkN+9yhVg==", "dev": true }, + "node_modules/jquery": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.6.0.tgz", + "integrity": "sha512-JVzAR/AjBvVt2BmYhxRCSYysDsPcssdmTFnzyLEts9qNwmjmu4JTAMYubEfwVOSwpQ1I1sKKFcxhZCI2buerfw==", + "peer": true + }, "node_modules/js-message": { "version": "1.0.7", "resolved": "https://registry.npmjs.org/js-message/-/js-message-1.0.7.tgz", @@ -9421,6 +9542,25 @@ "lower-case": "^1.1.1" } }, + "node_modules/node-fetch": { + "version": "2.6.7", + "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.7.tgz", + "integrity": "sha512-ZjMPFEfVx5j+y2yF35Kzx5sF7kDzxuDj6ziH4FFbOp87zKDZNx8yExJIb05OGF4Nlt9IHFIMBkRl41VdvcNdbQ==", + "dependencies": { + "whatwg-url": "^5.0.0" + }, + "engines": { + "node": "4.x || >=6.0.0" + }, + "peerDependencies": { + "encoding": "^0.1.0" + }, + "peerDependenciesMeta": { + "encoding": { + "optional": true + } + } + }, "node_modules/node-forge": { "version": "0.10.0", "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.10.0.tgz", @@ -10370,6 +10510,24 @@ "node": ">=6" } }, + "node_modules/popper.js": { + "version": "1.16.1", + "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz", + "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==", + "deprecated": "You can find the new Popper v2 at @popperjs/core, this package is dedicated to the legacy v1", + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/popperjs" + } + }, + "node_modules/portal-vue": { + "version": "2.1.7", + "resolved": "https://registry.npmjs.org/portal-vue/-/portal-vue-2.1.7.tgz", + "integrity": "sha512-+yCno2oB3xA7irTt0EU5Ezw22L2J51uKAacE/6hMPMoO/mx3h4rXFkkBkT4GFsMDv/vEe8TNKC3ujJJ0PTwb6g==", + "peerDependencies": { + "vue": "^2.5.18" + } + }, "node_modules/portfinder": { "version": "1.0.28", "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz", @@ -13432,6 +13590,11 @@ "node": ">=0.8" } }, + "node_modules/tr46": { + "version": "0.0.3", + "resolved": "https://registry.npmjs.org/tr46/-/tr46-0.0.3.tgz", + "integrity": "sha1-gYT9NH2snNwYWZLzpmIuFLnZq2o=" + }, "node_modules/tryer": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/tryer/-/tryer-1.0.1.tgz", @@ -13986,6 +14149,11 @@ "node": ">=8.0.0" } }, + "node_modules/vue-functional-data-merge": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/vue-functional-data-merge/-/vue-functional-data-merge-3.1.0.tgz", + "integrity": "sha512-leT4kdJVQyeZNY1kmnS1xiUlQ9z1B/kdBFCILIjYYQDqZgLqCLa0UhjSSeRX6c3mUe6U5qYeM8LrEqkHJ1B4LA==" + }, "node_modules/vue-hot-reload-api": { "version": "2.3.4", "resolved": "https://registry.npmjs.org/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz", @@ -14130,6 +14298,11 @@ "integrity": "sha1-M7QHd3VMZDJXPBIMw4CLvRDUfwQ=", "dev": true }, + "node_modules/vue-router": { + "version": "3.5.3", + "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.5.3.tgz", + "integrity": "sha512-FUlILrW3DGitS2h+Xaw8aRNvGTwtuaxrRkNSHWTizOfLUie7wuYwezeZ50iflRn8YPV5kxmU2LQuu3nM/b3Zsg==" + }, "node_modules/vue-style-loader": { "version": "4.1.3", "resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-4.1.3.tgz", @@ -14309,6 +14482,11 @@ "defaults": "^1.0.3" } }, + "node_modules/webidl-conversions": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz", + "integrity": "sha1-JFNCdeKnvGvnvIZhHMFq4KVlSHE=" + }, "node_modules/webpack": { "version": "4.46.0", "resolved": "https://registry.npmjs.org/webpack/-/webpack-4.46.0.tgz", @@ -14938,6 +15116,15 @@ "node": ">=0.8.0" } }, + "node_modules/whatwg-url": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-5.0.0.tgz", + "integrity": "sha1-lmRU6HZUYuN2RNNib2dCzotwll0=", + "dependencies": { + "tr46": "~0.0.3", + "webidl-conversions": "^3.0.0" + } + }, "node_modules/which": { "version": "1.3.1", "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz", @@ -16453,6 +16640,61 @@ "integrity": "sha512-shAmDyaQC4H92APFoIaVDHCx5bStIocgvbwQyxPRrbUY20V1EYTbSDchWbuwlMG3V17cprZhA6+78JfB+3DTPw==", "dev": true }, + "@nuxt/opencollective": { + "version": "0.3.2", + "resolved": "https://registry.npmjs.org/@nuxt/opencollective/-/opencollective-0.3.2.tgz", + "integrity": "sha512-XG7rUdXG9fcafu9KTDIYjJSkRO38EwjlKYIb5TQ/0WDbiTUTtUtgncMscKOYzfsY86kGs05pAuMOR+3Fi0aN3A==", + "requires": { + "chalk": "^4.1.0", + "consola": "^2.15.0", + "node-fetch": "^2.6.1" + }, + "dependencies": { + "ansi-styles": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", + "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", + "requires": { + "color-convert": "^2.0.1" + } + }, + "chalk": { + "version": "4.1.2", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", + "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", + "requires": { + "ansi-styles": "^4.1.0", + "supports-color": "^7.1.0" + } + }, + "color-convert": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", + "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", + "requires": { + "color-name": "~1.1.4" + } + }, + "color-name": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", + "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==" + }, + "has-flag": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", + "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==" + }, + "supports-color": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", + "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", + "requires": { + "has-flag": "^4.0.0" + } + } + } + }, "@soda/friendly-errors-webpack-plugin": { "version": "1.8.1", "resolved": "https://registry.npmjs.org/@soda/friendly-errors-webpack-plugin/-/friendly-errors-webpack-plugin-1.8.1.tgz", @@ -16962,7 +17204,8 @@ "version": "4.5.15", "resolved": "https://registry.npmjs.org/@vue/cli-plugin-vuex/-/cli-plugin-vuex-4.5.15.tgz", "integrity": "sha512-fqap+4HN+w+InDxlA3hZTOGE0tzBTgXhKLoDydhywqgmhQ1D9JA6Feh94ze6tG8DsWX58/ujYUqA8jAz17FJtg==", - "dev": true + "dev": true, + "requires": {} }, "@vue/cli-service": { "version": "4.5.15", @@ -17099,7 +17342,8 @@ "version": "1.1.2", "resolved": "https://registry.npmjs.org/@vue/preload-webpack-plugin/-/preload-webpack-plugin-1.1.2.tgz", "integrity": "sha512-LIZMuJk38pk9U9Ur4YzHjlIyMuxPlACdBIHH9/nGYVTsaGKOSnSuELiE8vS9wa+dJpIYspYUOqk+L1Q4pgHQHQ==", - "dev": true + "dev": true, + "requires": {} }, "@vue/web-component-wrapper": { "version": "1.3.0", @@ -17314,7 +17558,8 @@ "version": "5.3.2", "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz", "integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==", - "dev": true + "dev": true, + "requires": {} }, "acorn-walk": { "version": "7.2.0", @@ -17344,13 +17589,15 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/ajv-errors/-/ajv-errors-1.0.1.tgz", "integrity": "sha512-DCRfO/4nQ+89p/RK43i8Ezd41EqdGIU4ld7nGF8OQ14oc/we5rEntLCUa7+jrn3nn83BosfwZA0wb4pon2o8iQ==", - "dev": true + "dev": true, + "requires": {} }, "ajv-keywords": { "version": "3.5.2", "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.5.2.tgz", "integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==", - "dev": true + "dev": true, + "requires": {} }, "alphanum-sort": { "version": "1.0.2", @@ -17844,6 +18091,24 @@ "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24=", "dev": true }, + "bootstrap": { + "version": "4.6.1", + "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.6.1.tgz", + "integrity": "sha512-0dj+VgI9Ecom+rvvpNZ4MUZJz8dcX7WCX+eTID9+/8HgOkv3dsRzi8BGeZJCQU6flWQVYxwTQnEZFrmJSEO7og==", + "requires": {} + }, + "bootstrap-vue": { + "version": "2.21.2", + "resolved": "https://registry.npmjs.org/bootstrap-vue/-/bootstrap-vue-2.21.2.tgz", + "integrity": "sha512-0Exe+4MZysqhZNXIKf4TzkvXaupxh9EHsoCRez0o5Dc0J7rlafayOEwql63qXv74CgZO8E4U8ugRNJko1vMvNw==", + "requires": { + "@nuxt/opencollective": "^0.3.2", + "bootstrap": ">=4.5.3 <5.0.0", + "popper.js": "^1.16.1", + "portal-vue": "^2.1.7", + "vue-functional-data-merge": "^3.1.0" + } + }, "brace-expansion": { "version": "1.1.11", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", @@ -18688,6 +18953,11 @@ "integrity": "sha512-e54B99q/OUoH64zYYRf3HBP5z24G38h5D3qXu23JGRoigpX5Ss4r9ZnDk3g0Z8uQC2x2lPaJ+UlWBc1ZWBWdLg==", "dev": true }, + "consola": { + "version": "2.15.3", + "resolved": "https://registry.npmjs.org/consola/-/consola-2.15.3.tgz", + "integrity": "sha512-9vAdYbHj6x2fLKC4+oPH0kFzY/orMZyG2Aj+kNylHxKGJ/Ed4dpNyAQYwJOdqO4zdM7XpVHmyejQDcQHrnuXbw==" + }, "console-browserify": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.2.0.tgz", @@ -21896,6 +22166,12 @@ "integrity": "sha512-JVAfqNPTvNq3sB/VHQJAFxN/sPgKnsKrCwyRt15zwNCdrMMJDdcEOdubuy+DuJYYdm0ox1J4uzEuYKkN+9yhVg==", "dev": true }, + "jquery": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.6.0.tgz", + "integrity": "sha512-JVzAR/AjBvVt2BmYhxRCSYysDsPcssdmTFnzyLEts9qNwmjmu4JTAMYubEfwVOSwpQ1I1sKKFcxhZCI2buerfw==", + "peer": true + }, "js-message": { "version": "1.0.7", "resolved": "https://registry.npmjs.org/js-message/-/js-message-1.0.7.tgz", @@ -22614,6 +22890,14 @@ "lower-case": "^1.1.1" } }, + "node-fetch": { + "version": "2.6.7", + "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.7.tgz", + "integrity": "sha512-ZjMPFEfVx5j+y2yF35Kzx5sF7kDzxuDj6ziH4FFbOp87zKDZNx8yExJIb05OGF4Nlt9IHFIMBkRl41VdvcNdbQ==", + "requires": { + "whatwg-url": "^5.0.0" + } + }, "node-forge": { "version": "0.10.0", "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.10.0.tgz", @@ -23364,6 +23648,17 @@ "ts-pnp": "^1.1.6" } }, + "popper.js": { + "version": "1.16.1", + "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz", + "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==" + }, + "portal-vue": { + "version": "2.1.7", + "resolved": "https://registry.npmjs.org/portal-vue/-/portal-vue-2.1.7.tgz", + "integrity": "sha512-+yCno2oB3xA7irTt0EU5Ezw22L2J51uKAacE/6hMPMoO/mx3h4rXFkkBkT4GFsMDv/vEe8TNKC3ujJJ0PTwb6g==", + "requires": {} + }, "portfinder": { "version": "1.0.28", "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz", @@ -25941,6 +26236,11 @@ "punycode": "^2.1.1" } }, + "tr46": { + "version": "0.0.3", + "resolved": "https://registry.npmjs.org/tr46/-/tr46-0.0.3.tgz", + "integrity": "sha1-gYT9NH2snNwYWZLzpmIuFLnZq2o=" + }, "tryer": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/tryer/-/tryer-1.0.1.tgz", @@ -26391,6 +26691,11 @@ } } }, + "vue-functional-data-merge": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/vue-functional-data-merge/-/vue-functional-data-merge-3.1.0.tgz", + "integrity": "sha512-leT4kdJVQyeZNY1kmnS1xiUlQ9z1B/kdBFCILIjYYQDqZgLqCLa0UhjSSeRX6c3mUe6U5qYeM8LrEqkHJ1B4LA==" + }, "vue-hot-reload-api": { "version": "2.3.4", "resolved": "https://registry.npmjs.org/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz", @@ -26499,6 +26804,11 @@ } } }, + "vue-router": { + "version": "3.5.3", + "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.5.3.tgz", + "integrity": "sha512-FUlILrW3DGitS2h+Xaw8aRNvGTwtuaxrRkNSHWTizOfLUie7wuYwezeZ50iflRn8YPV5kxmU2LQuu3nM/b3Zsg==" + }, "vue-style-loader": { "version": "4.1.3", "resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-4.1.3.tgz", @@ -26659,6 +26969,11 @@ "defaults": "^1.0.3" } }, + "webidl-conversions": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz", + "integrity": "sha1-JFNCdeKnvGvnvIZhHMFq4KVlSHE=" + }, "webpack": { "version": "4.46.0", "resolved": "https://registry.npmjs.org/webpack/-/webpack-4.46.0.tgz", @@ -27153,6 +27468,15 @@ "integrity": "sha512-OqedPIGOfsDlo31UNwYbCFMSaO9m9G/0faIHj5/dZFDMFqPTcx6UwqyOy3COEaEOg/9VsGIpdqn62W5KhoKSpg==", "dev": true }, + "whatwg-url": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-5.0.0.tgz", + "integrity": "sha1-lmRU6HZUYuN2RNNib2dCzotwll0=", + "requires": { + "tr46": "~0.0.3", + "webidl-conversions": "^3.0.0" + } + }, "which": { "version": "1.3.1", "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz", diff --git a/ui/package.json b/ui/package.json index e215858..c954611 100644 --- a/ui/package.json +++ b/ui/package.json @@ -12,7 +12,8 @@ "bootstrap": "^4.6.1", "bootstrap-vue": "^2.21.2", "core-js": "^3.6.5", - "vue": "^2.6.11" + "vue": "^2.6.11", + "vue-router": "^3.5.3" }, "devDependencies": { "@vue/cli-plugin-babel": "~4.5.0", diff --git a/ui/src/App.vue b/ui/src/App.vue index 55df315..24271f3 100644 --- a/ui/src/App.vue +++ b/ui/src/App.vue @@ -1,18 +1,12 @@ diff --git a/ui/src/main.js b/ui/src/main.js index 68b082c..2001c3f 100644 --- a/ui/src/main.js +++ b/ui/src/main.js @@ -1,5 +1,6 @@ import Vue from 'vue' import App from './App.vue' +import router from './router/router' import { BootstrapVue, IconsPlugin } from 'bootstrap-vue' import 'bootstrap/dist/css/bootstrap.css' import 'bootstrap-vue/dist/bootstrap-vue.css' @@ -13,5 +14,6 @@ Vue.use(IconsPlugin) Vue.config.productionTip = false new Vue({ + router, render: h => h(App), }).$mount('#app') diff --git a/ui/src/router/router.js b/ui/src/router/router.js new file mode 100644 index 0000000..1671067 --- /dev/null +++ b/ui/src/router/router.js @@ -0,0 +1,33 @@ +import Vue from "vue"; +import VueRouter from "vue-router"; +import MyBills from "@/views/MyBills"; +import PayBill from "@/views/PayBill"; +/** + * Import Vue Router + */ +Vue.use(VueRouter) + +const routes = [ + { + path: '/', + redirect: '/my-bills' + }, + { + path: '/my-bills', + name: 'MyBills', + component: MyBills + }, + { + path: '/my-bills/:id', + name: 'PayBill', + component: PayBill + } +] + +const router = new VueRouter({ + mode: 'history', + base: process.env.BASE_URL, + routes +}) + +export default router \ No newline at end of file diff --git a/ui/src/views/MyBills.vue b/ui/src/views/MyBills.vue new file mode 100644 index 0000000..67eafbd --- /dev/null +++ b/ui/src/views/MyBills.vue @@ -0,0 +1,13 @@ + + + \ No newline at end of file diff --git a/ui/src/views/PayBill.vue b/ui/src/views/PayBill.vue new file mode 100644 index 0000000..bf7b1fd --- /dev/null +++ b/ui/src/views/PayBill.vue @@ -0,0 +1,13 @@ + + + \ No newline at end of file From 9cf6f3c65408e25a63640555e51938c2bd563248 Mon Sep 17 00:00:00 2001 From: Jake Date: Thu, 3 Feb 2022 10:50:30 +0000 Subject: [PATCH 02/25] HT-13 Create axios request to interact with the api --- ui/package-lock.json | 21 ++++++++++++++++++--- ui/package.json | 1 + ui/src/api/api.js | 28 ++++++++++++++++++++++++++++ 3 files changed, 47 insertions(+), 3 deletions(-) create mode 100644 ui/src/api/api.js diff --git a/ui/package-lock.json b/ui/package-lock.json index 3d28285..f7d02f6 100644 --- a/ui/package-lock.json +++ b/ui/package-lock.json @@ -8,6 +8,7 @@ "name": "cssd-assignment", "version": "0.1.0", "dependencies": { + "axios": "^0.25.0", "bootstrap": "^4.6.1", "bootstrap-vue": "^2.21.2", "core-js": "^3.6.5", @@ -3196,6 +3197,14 @@ "integrity": "sha512-xh1Rl34h6Fi1DC2WWKfxUTVqRsNnr6LsKz2+hfwDxQJWmrx8+c7ylaqBMcHfl1U1r2dsifOvKX3LQuLNZ+XSvA==", "dev": true }, + "node_modules/axios": { + "version": "0.25.0", + "resolved": "https://registry.npmjs.org/axios/-/axios-0.25.0.tgz", + "integrity": "sha512-cD8FOb0tRH3uuEe6+evtAbgJtfxr7ly3fQjYcMcuPlgkwVS9xboaVIpcDV+cYQe+yGykgwZCs1pzjntcGa6l5g==", + "dependencies": { + "follow-redirects": "^1.14.7" + } + }, "node_modules/babel-eslint": { "version": "10.1.0", "resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-10.1.0.tgz", @@ -6975,7 +6984,6 @@ "version": "1.14.7", "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.7.tgz", "integrity": "sha512-+hbxoLbFMbRKDwohX8GkTataGqO6Jb7jGwpAlwgy2bIz25XtRm7KEzJM76R1WiNT5SwZkX4Y75SwBolkpmE7iQ==", - "dev": true, "funding": [ { "type": "individual", @@ -17857,6 +17865,14 @@ "integrity": "sha512-xh1Rl34h6Fi1DC2WWKfxUTVqRsNnr6LsKz2+hfwDxQJWmrx8+c7ylaqBMcHfl1U1r2dsifOvKX3LQuLNZ+XSvA==", "dev": true }, + "axios": { + "version": "0.25.0", + "resolved": "https://registry.npmjs.org/axios/-/axios-0.25.0.tgz", + "integrity": "sha512-cD8FOb0tRH3uuEe6+evtAbgJtfxr7ly3fQjYcMcuPlgkwVS9xboaVIpcDV+cYQe+yGykgwZCs1pzjntcGa6l5g==", + "requires": { + "follow-redirects": "^1.14.7" + } + }, "babel-eslint": { "version": "10.1.0", "resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-10.1.0.tgz", @@ -20884,8 +20900,7 @@ "follow-redirects": { "version": "1.14.7", "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.7.tgz", - "integrity": "sha512-+hbxoLbFMbRKDwohX8GkTataGqO6Jb7jGwpAlwgy2bIz25XtRm7KEzJM76R1WiNT5SwZkX4Y75SwBolkpmE7iQ==", - "dev": true + "integrity": "sha512-+hbxoLbFMbRKDwohX8GkTataGqO6Jb7jGwpAlwgy2bIz25XtRm7KEzJM76R1WiNT5SwZkX4Y75SwBolkpmE7iQ==" }, "for-in": { "version": "1.0.2", diff --git a/ui/package.json b/ui/package.json index c954611..39c28e1 100644 --- a/ui/package.json +++ b/ui/package.json @@ -9,6 +9,7 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "axios": "^0.25.0", "bootstrap": "^4.6.1", "bootstrap-vue": "^2.21.2", "core-js": "^3.6.5", diff --git a/ui/src/api/api.js b/ui/src/api/api.js new file mode 100644 index 0000000..5ccb03a --- /dev/null +++ b/ui/src/api/api.js @@ -0,0 +1,28 @@ +import axios from 'axios' + +const api = class Api { + constructor() { + this.baseUrl = 'http://localhost:3000' + } + + async getAllBills(queryString) { + const query = { + driver: queryString.driver, + paid: queryString.paid, + limit: queryString.limit, + offset: queryString.offset + } + + return axios.get(`${this.baseUrl}/bill/`, { params: JSON.parse(JSON.stringify(query)) } ) + .then(response => {return response.data}) + .catch(error => {throw error}) + } + + async payBill(billId) { + return axios.put(`${this.baseUrl}/bill/${billId}`, { body: { paid: true }}) + .then(response => {return response.data}) + .catch(error => {throw error}) + } +} + +export default new api \ No newline at end of file From 651f8f234abe3c5d2c48a67485b6377d0ae99a59 Mon Sep 17 00:00:00 2001 From: Jake Date: Thu, 3 Feb 2022 12:38:22 +0000 Subject: [PATCH 03/25] HT-13 Add My Bills page and navbar --- ui/package-lock.json | 186 +++++++++++++++++++++++++++---- ui/package.json | 3 + ui/src/App.vue | 19 +--- ui/src/assets/creditcard.png | Bin 0 -> 1045 bytes ui/src/assets/global.png | Bin 0 -> 2852 bytes ui/src/assets/money.png | Bin 0 -> 1571 bytes ui/src/assets/profile.png | Bin 0 -> 1691 bytes ui/src/assets/support.png | Bin 0 -> 1750 bytes ui/src/components/HelloWorld.vue | 58 ---------- ui/src/components/navbar.vue | 54 +++++++++ ui/src/main.js | 3 +- ui/src/styles/style.scss | 31 ++++++ ui/src/utilities.js | 8 ++ ui/src/views/MyBills.vue | 45 +++++++- 14 files changed, 311 insertions(+), 96 deletions(-) create mode 100644 ui/src/assets/creditcard.png create mode 100644 ui/src/assets/global.png create mode 100644 ui/src/assets/money.png create mode 100644 ui/src/assets/profile.png create mode 100644 ui/src/assets/support.png delete mode 100644 ui/src/components/HelloWorld.vue create mode 100644 ui/src/components/navbar.vue create mode 100644 ui/src/styles/style.scss create mode 100644 ui/src/utilities.js diff --git a/ui/package-lock.json b/ui/package-lock.json index f7d02f6..eca542b 100644 --- a/ui/package-lock.json +++ b/ui/package-lock.json @@ -12,6 +12,7 @@ "bootstrap": "^4.6.1", "bootstrap-vue": "^2.21.2", "core-js": "^3.6.5", + "dayjs": "^1.10.7", "vue": "^2.6.11", "vue-router": "^3.5.3" }, @@ -22,6 +23,8 @@ "babel-eslint": "^10.1.0", "eslint": "^6.7.2", "eslint-plugin-vue": "^6.2.2", + "sass": "^1.49.7", + "sass-loader": "^8.0.2", "vue-template-compiler": "^2.6.11" } }, @@ -3393,7 +3396,6 @@ "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz", "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==", "dev": true, - "optional": true, "engines": { "node": ">=8" } @@ -3984,7 +3986,6 @@ "url": "https://paulmillr.com/funding/" } ], - "optional": true, "dependencies": { "anymatch": "~3.1.2", "braces": "~3.0.2", @@ -4006,7 +4007,6 @@ "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz", "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==", "dev": true, - "optional": true, "dependencies": { "fill-range": "^7.0.1" }, @@ -4019,7 +4019,6 @@ "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==", "dev": true, - "optional": true, "dependencies": { "to-regex-range": "^5.0.1" }, @@ -4032,7 +4031,6 @@ "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", "dev": true, - "optional": true, "dependencies": { "is-glob": "^4.0.1" }, @@ -4045,7 +4043,6 @@ "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==", "dev": true, - "optional": true, "engines": { "node": ">=0.12.0" } @@ -4055,7 +4052,6 @@ "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz", "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==", "dev": true, - "optional": true, "dependencies": { "is-number": "^7.0.0" }, @@ -4371,6 +4367,20 @@ "node": ">=0.8" } }, + "node_modules/clone-deep": { + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-4.0.1.tgz", + "integrity": "sha512-neHB9xuzh/wk0dIHweyAXv2aPGZIVk3pLMe+/RNzINf17fe0OG96QroktYAUm7SM1PBnzTabaLboqqxDyMU+SQ==", + "dev": true, + "dependencies": { + "is-plain-object": "^2.0.4", + "kind-of": "^6.0.2", + "shallow-clone": "^3.0.0" + }, + "engines": { + "node": ">=6" + } + }, "node_modules/coa": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/coa/-/coa-2.0.2.tgz", @@ -5270,6 +5280,11 @@ "node": ">=0.10" } }, + "node_modules/dayjs": { + "version": "1.10.7", + "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.10.7.tgz", + "integrity": "sha512-P6twpd70BcPK34K26uJ1KT3wlhpuOAPoMwJzpsIWUxHZ7wpmbdZL/hQqBDfz7hGurYSa5PhzdhDHtt319hL3ig==" + }, "node_modules/de-indent": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/de-indent/-/de-indent-1.0.2.tgz", @@ -7886,6 +7901,12 @@ "node": ">= 4" } }, + "node_modules/immutable": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.0.0.tgz", + "integrity": "sha512-zIE9hX70qew5qTUjSS7wi1iwj/l7+m54KWU247nhM3v806UdGj1yDndXj+IOYxxtW9zyLI+xqFNZjTuDaLUqFw==", + "dev": true + }, "node_modules/import-cwd": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/import-cwd/-/import-cwd-2.1.0.tgz", @@ -8252,7 +8273,6 @@ "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz", "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==", "dev": true, - "optional": true, "dependencies": { "binary-extensions": "^2.0.0" }, @@ -11550,7 +11570,6 @@ "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz", "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==", "dev": true, - "optional": true, "dependencies": { "picomatch": "^2.2.1" }, @@ -11954,6 +11973,60 @@ "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==", "dev": true }, + "node_modules/sass": { + "version": "1.49.7", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.49.7.tgz", + "integrity": "sha512-13dml55EMIR2rS4d/RDHHP0sXMY3+30e1TKsyXaSz3iLWVoDWEoboY8WzJd5JMnxrRHffKO3wq2mpJ0jxRJiEQ==", + "dev": true, + "dependencies": { + "chokidar": ">=3.0.0 <4.0.0", + "immutable": "^4.0.0", + "source-map-js": ">=0.6.2 <2.0.0" + }, + "bin": { + "sass": "sass.js" + }, + "engines": { + "node": ">=12.0.0" + } + }, + "node_modules/sass-loader": { + "version": "8.0.2", + "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-8.0.2.tgz", + "integrity": "sha512-7o4dbSK8/Ol2KflEmSco4jTjQoV988bM82P9CZdmo9hR3RLnvNc0ufMNdMrB0caq38JQ/FgF4/7RcbcfKzxoFQ==", + "dev": true, + "dependencies": { + "clone-deep": "^4.0.1", + "loader-utils": "^1.2.3", + "neo-async": "^2.6.1", + "schema-utils": "^2.6.1", + "semver": "^6.3.0" + }, + "engines": { + "node": ">= 8.9.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/webpack" + }, + "peerDependencies": { + "fibers": ">= 3.1.0", + "node-sass": "^4.0.0", + "sass": "^1.3.0", + "webpack": "^4.36.0 || ^5.0.0" + }, + "peerDependenciesMeta": { + "fibers": { + "optional": true + }, + "node-sass": { + "optional": true + }, + "sass": { + "optional": true + } + } + }, "node_modules/sax": { "version": "1.2.4", "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz", @@ -12210,6 +12283,18 @@ "sha.js": "bin.js" } }, + "node_modules/shallow-clone": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/shallow-clone/-/shallow-clone-3.0.1.tgz", + "integrity": "sha512-/6KqX+GVUdqPuPPd2LxDDxzX6CAbjJehAAOKlNpqqUpAqPM6HeL8f+o3a+JsyGjn2lv0WY8UsTgUJjU9Ok55NA==", + "dev": true, + "dependencies": { + "kind-of": "^6.0.2" + }, + "engines": { + "node": ">=8" + } + }, "node_modules/shebang-command": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz", @@ -12571,6 +12656,15 @@ "node": ">=0.10.0" } }, + "node_modules/source-map-js": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", + "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==", + "dev": true, + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/source-map-resolve": { "version": "0.5.3", "resolved": "https://registry.npmjs.org/source-map-resolve/-/source-map-resolve-0.5.3.tgz", @@ -18013,8 +18107,7 @@ "version": "2.2.0", "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz", "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==", - "dev": true, - "optional": true + "dev": true }, "bindings": { "version": "1.5.0", @@ -18515,7 +18608,6 @@ "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz", "integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==", "dev": true, - "optional": true, "requires": { "anymatch": "~3.1.2", "braces": "~3.0.2", @@ -18532,7 +18624,6 @@ "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz", "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==", "dev": true, - "optional": true, "requires": { "fill-range": "^7.0.1" } @@ -18542,7 +18633,6 @@ "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==", "dev": true, - "optional": true, "requires": { "to-regex-range": "^5.0.1" } @@ -18552,7 +18642,6 @@ "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", "dev": true, - "optional": true, "requires": { "is-glob": "^4.0.1" } @@ -18561,15 +18650,13 @@ "version": "7.0.0", "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==", - "dev": true, - "optional": true + "dev": true }, "to-regex-range": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz", "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==", "dev": true, - "optional": true, "requires": { "is-number": "^7.0.0" } @@ -18815,6 +18902,17 @@ "integrity": "sha1-2jCcwmPfFZlMaIypAheco8fNfH4=", "dev": true }, + "clone-deep": { + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-4.0.1.tgz", + "integrity": "sha512-neHB9xuzh/wk0dIHweyAXv2aPGZIVk3pLMe+/RNzINf17fe0OG96QroktYAUm7SM1PBnzTabaLboqqxDyMU+SQ==", + "dev": true, + "requires": { + "is-plain-object": "^2.0.4", + "kind-of": "^6.0.2", + "shallow-clone": "^3.0.0" + } + }, "coa": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/coa/-/coa-2.0.2.tgz", @@ -19541,6 +19639,11 @@ "assert-plus": "^1.0.0" } }, + "dayjs": { + "version": "1.10.7", + "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.10.7.tgz", + "integrity": "sha512-P6twpd70BcPK34K26uJ1KT3wlhpuOAPoMwJzpsIWUxHZ7wpmbdZL/hQqBDfz7hGurYSa5PhzdhDHtt319hL3ig==" + }, "de-indent": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/de-indent/-/de-indent-1.0.2.tgz", @@ -21580,6 +21683,12 @@ "integrity": "sha512-cyFDKrqc/YdcWFniJhzI42+AzS+gNwmUzOSFcRCQYwySuBBBy/KjuxWLZ/FHEH6Moq1NizMOBWyTcv8O4OZIMg==", "dev": true }, + "immutable": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.0.0.tgz", + "integrity": "sha512-zIE9hX70qew5qTUjSS7wi1iwj/l7+m54KWU247nhM3v806UdGj1yDndXj+IOYxxtW9zyLI+xqFNZjTuDaLUqFw==", + "dev": true + }, "import-cwd": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/import-cwd/-/import-cwd-2.1.0.tgz", @@ -21865,7 +21974,6 @@ "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz", "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==", "dev": true, - "optional": true, "requires": { "binary-extensions": "^2.0.0" } @@ -24551,7 +24659,6 @@ "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz", "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==", "dev": true, - "optional": true, "requires": { "picomatch": "^2.2.1" } @@ -24879,6 +24986,30 @@ "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==", "dev": true }, + "sass": { + "version": "1.49.7", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.49.7.tgz", + "integrity": "sha512-13dml55EMIR2rS4d/RDHHP0sXMY3+30e1TKsyXaSz3iLWVoDWEoboY8WzJd5JMnxrRHffKO3wq2mpJ0jxRJiEQ==", + "dev": true, + "requires": { + "chokidar": ">=3.0.0 <4.0.0", + "immutable": "^4.0.0", + "source-map-js": ">=0.6.2 <2.0.0" + } + }, + "sass-loader": { + "version": "8.0.2", + "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-8.0.2.tgz", + "integrity": "sha512-7o4dbSK8/Ol2KflEmSco4jTjQoV988bM82P9CZdmo9hR3RLnvNc0ufMNdMrB0caq38JQ/FgF4/7RcbcfKzxoFQ==", + "dev": true, + "requires": { + "clone-deep": "^4.0.1", + "loader-utils": "^1.2.3", + "neo-async": "^2.6.1", + "schema-utils": "^2.6.1", + "semver": "^6.3.0" + } + }, "sax": { "version": "1.2.4", "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz", @@ -25103,6 +25234,15 @@ "safe-buffer": "^5.0.1" } }, + "shallow-clone": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/shallow-clone/-/shallow-clone-3.0.1.tgz", + "integrity": "sha512-/6KqX+GVUdqPuPPd2LxDDxzX6CAbjJehAAOKlNpqqUpAqPM6HeL8f+o3a+JsyGjn2lv0WY8UsTgUJjU9Ok55NA==", + "dev": true, + "requires": { + "kind-of": "^6.0.2" + } + }, "shebang-command": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz", @@ -25412,6 +25552,12 @@ "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=", "dev": true }, + "source-map-js": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", + "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==", + "dev": true + }, "source-map-resolve": { "version": "0.5.3", "resolved": "https://registry.npmjs.org/source-map-resolve/-/source-map-resolve-0.5.3.tgz", diff --git a/ui/package.json b/ui/package.json index 39c28e1..079ec9c 100644 --- a/ui/package.json +++ b/ui/package.json @@ -13,6 +13,7 @@ "bootstrap": "^4.6.1", "bootstrap-vue": "^2.21.2", "core-js": "^3.6.5", + "dayjs": "^1.10.7", "vue": "^2.6.11", "vue-router": "^3.5.3" }, @@ -23,6 +24,8 @@ "babel-eslint": "^10.1.0", "eslint": "^6.7.2", "eslint-plugin-vue": "^6.2.2", + "sass": "^1.49.7", + "sass-loader": "^8.0.2", "vue-template-compiler": "^2.6.11" }, "eslintConfig": { diff --git a/ui/src/App.vue b/ui/src/App.vue index 24271f3..df8e75e 100644 --- a/ui/src/App.vue +++ b/ui/src/App.vue @@ -1,22 +1,15 @@ - diff --git a/ui/src/assets/creditcard.png b/ui/src/assets/creditcard.png new file mode 100644 index 0000000000000000000000000000000000000000..b43c8bd8f902c89f1974da04b2f7a031bc674fdc GIT binary patch literal 1045 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 literal 0 HcmV?d00001 diff --git a/ui/src/assets/support.png b/ui/src/assets/support.png new file mode 100644 index 0000000000000000000000000000000000000000..3ff54539f6ddbca85b142869a674b672db6416ce GIT binary patch literal 1750 zcmV;{1}XW8P)|0G}TvZglog_^rX**8n4+!eSs-;FqDoAl5j)LgI(gru(Xwrp(xX4)AMK$0E zr7l`RvXFuuTtQ?uJEW;Q8W#VZ$o)nFxDO}eS2yFnA zsgE__j#DfmrMon=0FcUKeP`r|iRPeLIff(%Iqn}L8p=cQ$tF@>C|M?zZ1u4KW%7B# zF?PEN$7qteBqIMa<%Nsd0I-W`HkA`8(U*x}C{9xjfB?BO` z(h7#io1i-9wH=&lb*1Bh`|pW{wV1&RJPlY3DxHD>Q0ty`p6=KlFTXeXhB$fRRngko zvUuahYV>$|d~xQtKa74O|P?WP%V=x_R#bDzG`vRlch;8Yp}Zc@8mJRuqaX^qvfmDD%}j$ zPuT+~rv;=GabIe^72ai>gsBzE^j6X zad?Q91sviyIo!2vSpwceK{tm6-{CjB*HIoaK{ifgZ(jmr0N~;2Y;aJhJHG95&^*l1 zQ64fuHeCP?Qtv+8Tb*4Vzt3Ku-x?Ug$vG5WZhHk}V^~2==a#~yxg>Q1Jn-xj)xO?` zYADBJTg7AhdfUGI`n#GSc*SRY?dr2G!}GN+e5|nEZSS7LcUc z45B*jF0ZpmQFwW6luj7~C>ik!6`khqcJBLuV6a0AKVE*P1Y~3^gMQ=#5|o)pW_ZQ( z76_JruaAt@HZ!beirM>taO|z|h1j;Pzsi;CyX03S{{XUnU!10d&WQ*$;ekvJ<*36s zkIxX;M0tzALn$x7n{q@3$!brSkkjH`X)GrQaB}LEc}p<;O;{+Y$y?FV702vwnLID8esY0Pv$BoW(K%nsQ0>LR`0Occ`CLKX!CQJo)Q4(3upux=&?mf@2&GJ9orG zRi1Oy>B!=s%q_04s+CPqIlOu5Y}qgT)xDcs5Fi6&VJJTpN_7||X_ThjKrk(jQ$f%y zkEcC@A%#rV1cWep11KP9DxY=wJ-0MT>GTDnK0o~O;cf_Z`rVI=mG`rzX6b~=8LY=<=|oW5d|*ycbz3K>sk0`bB1L&}QdBWYt`iVg4@|J1 z88T_2ZUA{UMH^Xw!y0gb0ky`OX}u3{mDd8m<|iafe1$OYx?1l!oj>1sa5BV4X92{J sXw0LtV^*uHDcyN^dZRx+|BnCz08(vtZm`I= -
-

{{ msg }}

-

- For a guide and recipes on how to configure / customize this project,
- check out the - vue-cli documentation. -

-

Installed CLI Plugins

- -

Essential Links

- -

Ecosystem

- -
- - - - - - diff --git a/ui/src/components/navbar.vue b/ui/src/components/navbar.vue new file mode 100644 index 0000000..5ad260e --- /dev/null +++ b/ui/src/components/navbar.vue @@ -0,0 +1,54 @@ + + + \ No newline at end of file diff --git a/ui/src/main.js b/ui/src/main.js index 2001c3f..160802c 100644 --- a/ui/src/main.js +++ b/ui/src/main.js @@ -2,8 +2,7 @@ import Vue from 'vue' import App from './App.vue' import router from './router/router' import { BootstrapVue, IconsPlugin } from 'bootstrap-vue' -import 'bootstrap/dist/css/bootstrap.css' -import 'bootstrap-vue/dist/bootstrap-vue.css' +import '@/styles/style.scss' /** * Import Bootstrap into Vue diff --git a/ui/src/styles/style.scss b/ui/src/styles/style.scss new file mode 100644 index 0000000..2d4b367 --- /dev/null +++ b/ui/src/styles/style.scss @@ -0,0 +1,31 @@ +@import '~bootstrap/dist/css/bootstrap.css'; +@import '~bootstrap-vue/dist/bootstrap-vue.css'; + +$Navy-Blue: #3c4253; +$White: white; + +.navbar { + background-color: $Navy-Blue; +} + +.nav-link { + color: $White !important; +} + +h4 { + color: $White; +} + +.navy-blue-text { + color: $Navy-Blue; +} + +.white-text { + color: $White; +} + +@media (min-width: 1200px) { + .container { + max-width: 75% !important; + } +} \ No newline at end of file diff --git a/ui/src/utilities.js b/ui/src/utilities.js new file mode 100644 index 0000000..db613cc --- /dev/null +++ b/ui/src/utilities.js @@ -0,0 +1,8 @@ +import dayjs from 'dayjs' +export function formatDate(date) { + return dayjs(date).format('ddd D MMM YYYY @ H:mm') +} + +export function formatCost(price) { + return new Intl.NumberFormat(undefined, {style: 'currency', currency: 'GBP'}).format(Number.parseInt(price)) +} \ No newline at end of file diff --git a/ui/src/views/MyBills.vue b/ui/src/views/MyBills.vue index 67eafbd..d2787cf 100644 --- a/ui/src/views/MyBills.vue +++ b/ui/src/views/MyBills.vue @@ -1,13 +1,52 @@  \ No newline at end of file From 7ef84c9650a51671dfade35aba8bf393837dec95 Mon Sep 17 00:00:00 2001 From: Jake Date: Thu, 3 Feb 2022 12:54:38 +0000 Subject: [PATCH 04/25] HT-13 Add filtering to table --- ui/src/views/MyBills.vue | 47 +++++++++++++++++++++++++++++++++++++--- 1 file changed, 44 insertions(+), 3 deletions(-) diff --git a/ui/src/views/MyBills.vue b/ui/src/views/MyBills.vue index d2787cf..25aa692 100644 --- a/ui/src/views/MyBills.vue +++ b/ui/src/views/MyBills.vue @@ -1,7 +1,19 @@  +
+ + Per Page: + + + + {{ totalCount }} books in {{ Math.ceil(totalCount / limit) }} pages +
@@ -33,12 +54,32 @@ export default Vue.extend({ name: 'MyBills', data () { return { - bills: [] + bills: [], + totalCount: 0, + limit: 10, + offset: 1, + filter: { + entryLocation: '', + exitLocation: '', + carRegistrationNumber: '' + } } }, computed: { fields() { - return ['EntryLocation', 'ExitLocation', 'CarRegistrationNumber', 'Date', 'Cost', 'Actions'] + return [{key: 'EntryLocation', sortable: false}, + {key: 'ExitLocation', sortable: false}, + {key: 'CarRegistrationNumber', sortable: false}, + {key: 'Date', sortable: true}, + {key: 'Cost', sortable: true}, + {key: 'Actions', sortable: false}] + }, + filteredBills() { + return this.bills.filter((bill) => + bill.journey.entryLocation.name.includes(this.filter.entryLocation) && + bill.journey.exitLocation.name.includes(this.filter.exitLocation) && + bill.journey.regNumber.includes(this.filter.carRegistrationNumber) + ) } }, methods: { From b4fc67096fe8ad05363d34ed504f652bb2dc69d1 Mon Sep 17 00:00:00 2001 From: Jake Date: Thu, 3 Feb 2022 12:55:42 +0000 Subject: [PATCH 05/25] HT-13 Add help icon to navbar --- ui/src/components/navbar.vue | 3 +++ 1 file changed, 3 insertions(+) diff --git a/ui/src/components/navbar.vue b/ui/src/components/navbar.vue index 5ad260e..35b2b3b 100644 --- a/ui/src/components/navbar.vue +++ b/ui/src/components/navbar.vue @@ -5,6 +5,9 @@

Self Service Portal

+ + support iconHelp + @@ -84,10 +84,16 @@ export default Vue.extend({ }, methods: { formatDate, - formatCost + formatCost, + async getBills() { + const data = await api.getAllBills({limit: this.limit, offset: parseInt(this.offset - 1)}) //TODO: Filter by DriverId + console.log(data) + this.bills = data.bills + this.totalCount = data.count + } }, async created() { - this.bills = await api.getAllBills({}) //TODO: Filter by DriverId + await this.getBills() } }) \ No newline at end of file From 64ad70eaf666bd9e1e53881ea696368eff363f4a Mon Sep 17 00:00:00 2001 From: Jake Date: Thu, 3 Feb 2022 13:20:40 +0000 Subject: [PATCH 07/25] HT-13 Change document title based on route meta data and add spacing between nav bar items --- ui/src/components/navbar.vue | 6 +++--- ui/src/router/router.js | 10 +++++++++- 2 files changed, 12 insertions(+), 4 deletions(-) diff --git a/ui/src/components/navbar.vue b/ui/src/components/navbar.vue index 35b2b3b..0137414 100644 --- a/ui/src/components/navbar.vue +++ b/ui/src/components/navbar.vue @@ -5,16 +5,16 @@

Self Service Portal

- + support iconHelp - + {{lang}} - + diff --git a/ui/src/router/router.js b/ui/src/router/router.js index 1671067..24a7a10 100644 --- a/ui/src/router/router.js +++ b/ui/src/router/router.js @@ -15,7 +15,10 @@ const routes = [ { path: '/my-bills', name: 'MyBills', - component: MyBills + component: MyBills, + meta: { + title: 'My Bills' + } }, { path: '/my-bills/:id', @@ -30,4 +33,9 @@ const router = new VueRouter({ routes }) +router.beforeEach((to, from, next) => { + document.title = to.meta.title + next() +}) + export default router \ No newline at end of file From 47b11e79b38d980b87bf6f4337618af8cace343b Mon Sep 17 00:00:00 2001 From: Jake Date: Thu, 3 Feb 2022 13:43:36 +0000 Subject: [PATCH 08/25] HT-13 Add Cypress --- ui/cypress.json | 3 + ui/cypress/fixtures/example.json | 5 + .../1-getting-started/todo.test.js | 143 ++ ui/cypress/plugins/index.js | 22 + ui/cypress/support/commands.js | 25 + ui/cypress/support/index.js | 20 + ui/package-lock.json | 2151 ++++++++++++++++- ui/package.json | 3 +- 8 files changed, 2316 insertions(+), 56 deletions(-) create mode 100644 ui/cypress.json create mode 100644 ui/cypress/fixtures/example.json create mode 100644 ui/cypress/integration/1-getting-started/todo.test.js create mode 100644 ui/cypress/plugins/index.js create mode 100644 ui/cypress/support/commands.js create mode 100644 ui/cypress/support/index.js diff --git a/ui/cypress.json b/ui/cypress.json new file mode 100644 index 0000000..b4be333 --- /dev/null +++ b/ui/cypress.json @@ -0,0 +1,3 @@ +{ + "testFiles": "**/*test.js" +} \ No newline at end of file diff --git a/ui/cypress/fixtures/example.json b/ui/cypress/fixtures/example.json new file mode 100644 index 0000000..02e4254 --- /dev/null +++ b/ui/cypress/fixtures/example.json @@ -0,0 +1,5 @@ +{ + "name": "Using fixtures to represent data", + "email": "hello@cypress.io", + "body": "Fixtures are a great way to mock data for responses to routes" +} diff --git a/ui/cypress/integration/1-getting-started/todo.test.js b/ui/cypress/integration/1-getting-started/todo.test.js new file mode 100644 index 0000000..4768ff9 --- /dev/null +++ b/ui/cypress/integration/1-getting-started/todo.test.js @@ -0,0 +1,143 @@ +/// + +// Welcome to Cypress! +// +// This spec file contains a variety of sample tests +// for a todo list app that are designed to demonstrate +// the power of writing tests in Cypress. +// +// To learn more about how Cypress works and +// what makes it such an awesome testing tool, +// please read our getting started guide: +// https://on.cypress.io/introduction-to-cypress + +describe('example to-do app', () => { + beforeEach(() => { + // Cypress starts out with a blank slate for each test + // so we must tell it to visit our website with the `cy.visit()` command. + // Since we want to visit the same URL at the start of all our tests, + // we include it in our beforeEach function so that it runs before each test + cy.visit('https://example.cypress.io/todo') + }) + + it('displays two todo items by default', () => { + // We use the `cy.get()` command to get all elements that match the selector. + // Then, we use `should` to assert that there are two matched items, + // which are the two default items. + cy.get('.todo-list li').should('have.length', 2) + + // We can go even further and check that the default todos each contain + // the correct text. We use the `first` and `last` functions + // to get just the first and last matched elements individually, + // and then perform an assertion with `should`. + cy.get('.todo-list li').first().should('have.text', 'Pay electric bill') + cy.get('.todo-list li').last().should('have.text', 'Walk the dog') + }) + + it('can add new todo items', () => { + // We'll store our item text in a variable so we can reuse it + const newItem = 'Feed the cat' + + // Let's get the input element and use the `type` command to + // input our new list item. After typing the content of our item, + // we need to type the enter key as well in order to submit the input. + // This input has a data-test attribute so we'll use that to select the + // element in accordance with best practices: + // https://on.cypress.io/selecting-elements + cy.get('[data-test=new-todo]').type(`${newItem}{enter}`) + + // Now that we've typed our new item, let's check that it actually was added to the list. + // Since it's the newest item, it should exist as the last element in the list. + // In addition, with the two default items, we should have a total of 3 elements in the list. + // Since assertions yield the element that was asserted on, + // we can chain both of these assertions together into a single statement. + cy.get('.todo-list li') + .should('have.length', 3) + .last() + .should('have.text', newItem) + }) + + it('can check off an item as completed', () => { + // In addition to using the `get` command to get an element by selector, + // we can also use the `contains` command to get an element by its contents. + // However, this will yield the