diff --git a/.gitignore b/.gitignore index a9bf2f9..243230d 100644 --- a/.gitignore +++ b/.gitignore @@ -35,3 +35,6 @@ test/ # Environment variables .env* + +backend/wwwroot/admin/* +backend/wwwroot/landing-page/* \ No newline at end of file diff --git a/README.md b/README.md index fcc2a64..3aa6a81 100644 --- a/README.md +++ b/README.md @@ -1,23 +1,93 @@ -# Blood-Bank +
-## Project environment's recommendations + +
+
+ + Logo + + +

Judoh - Blood Bank Management System

+ +

+ A management system provides basic functional features for a blood bank. +

+
+ + + +## About The Project + +This project is a team project from my university. We intended to build a management system to manage a blood bank. Therefor, we provides 3 web applications for User (Landing Page), Hospital (hospital accounts) and Admins (Admin Page). We also implement other features such as organize/manage Blood Donation Events, ... + +Here are some of the basis required feature: + +- ℹ️ Provide basic information about Blood for users (in landing page) +

Logo

+ +- 🕹 Manage blood storage (in admin page) +

Logo

+ +- 📃 Dashboard for admin to view important information (in admin page) +

Logo

+ +- 🩸 Create and Organize Blood Donation events (in admin page) +

Logo

+ +- 💉 Register for a blood donation events +

Logo

+ +- More screenshots and features [here](#usage) + +

(back to top)

+ +### Built With + +For front end + +- [Vue.js v3](https://vuejs.org/) +- [PrimeVue](https://www.primefaces.org/primevue/) for UI library + +For the backend API + +- [.NET](https://dotnet.microsoft.com/en-us/) +- [ASP.NET](https://dotnet.microsoft.com/en-us/apps/aspnet) +- [MongoDB](https://www.mongodb.com/) + +

(back to top)

+ + + +## Getting Started + +This is an example of how you may give instructions on setting up our project locally. +To get a local copy up and running follow these simple example steps. + +#### Setting Up Environment ``` - Node version >= v14.17.4 + Node.js >= v14.17.4 NPM >= v6.14.14 .NET v5.0 MongoDB v5.0.5 + + OS: Linux or MacOS ``` ```markdown NOTES - ⚠️ Please make sure if MongoDB and .NET is installed. + ⚠️ Please make sure that MongoDB and .NET are installed. ⚠️ Please re-install all the dependencies every time you test. + ⚠️ Commands for this project are wrote for Linux-based OS. They may not work on Windows machines. ``` -### Project Testing command +### Installation + +1. Clone the repo and change directory to that folder -1. Clone repo + ```sh + git clone https://github.com/NgoQuocBao1010/Blood-Bank.git + ``` 1. Change directory to /backend, create an .env file and enter your localhost MongoDB URL @@ -25,41 +95,202 @@ MongoDB= ``` -1. Change directory back to the root folder +1. Go back to the root folder, install all front-end dependencies ```bash - cd .. + npm run install-all ``` -1. Start server +1. Build and serve the websites ```bash - npm run start-sv + npm start ``` -1. Install all front-end dependencies +1. If everything works correctly, you could visit the website on http://127.0.0.1:5000 . - ```bash - npm run install-all - ``` + **If there is any error (or for debug/development purpose)**, you can run the project by follow the below steps. -1. Test for Landing Pages (go to the URL shown in the terminal) + - [Start server](./backend/README.md) + - [Start landing page](./landing-page/README.md) + - [Start admin page](./admin-page/README.md) - ```bash - npm run start-lp +

(back to top)

- ``` + +
+
-1. Test for Admin Pages (go to the URL shown in the terminal) +## Usage - ```bash - npm run start-admin - ``` +As the introduction indicated, the main purpose of this project is for blood bank management, after the installation successfully, you can explore around our web application to enjoy all of its functionalities. + +1. Landing Pages: Provide basic information of blood and the important of blood donation. Display and provide for users a way to register for blood donation events. + +-
+ Landing page Screenshots +
    +
  1. +

    + Learn about blood +

    +

    +
    2. +
  2. +

    + Learn about blood donation +

    +

    +
    3. +
  3. +

    + Research information on Blood Donation events +

    +

    +
    4. +
  4. +

    + Research information on Blood Donation events +

    +

    +
    5. +
  5. +

    + Register for upcoming blood donation events +

    +

    +
    6. +
+
+ +2. Admin Pages: Provide a way for administrators to manage Blood, blood incomes/outcomes, events, users, hospitals ... . + +-
+ Admin page Screenshots +
    +
  1. +

    + Dashboard - Provides brief and recent information +

    +

    +
    2. +
  2. +

    + Blood Storage - Monitor the amount of each blood type from storage +

    +

    +
    3. +
  3. +

    + Donors Management - Manage information of donors +

    +

    +

    +
    4. +
  4. +

    + Events Management - Manage information of each blood donation event +

    +

    +

    +
    5. +
  5. +

    + Users Management - Manage information and permission of each user, provide accounts for new users +

    +

    +
    6. +
  6. +

    + Hospitals Management - Manage information +

    +

    +
    7. +
  7. +

    + Donation Management - Manage each donations from a blood donation events. Suppose each donations from an event will be captured in an Excel file, user can upload a excel file to save the donation info. (Here a sample excel file) +

    +

    +

    +

    +
    8. +
  8. +

    + Requests Management - Manage each blood request from a hospital. (Here a screenshots of hospital blood requests form.) +

    +

    +
    9. +
+
+ +3. Hospital Pages: Provide a way for hospital to requests blood from the bank. + +-
+ Hospital Pages Screenshots +
    +
    +
  1. +

    + Blood Request Form - Request blood from the bank +

    +

    +
    2. +
  2. +

    + Update information of hospital +

    +

    +
    3. +
+
+ +

(back to top)

+ + + +## Contributing + +Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated**. + +If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". +Don't forget to give the project a star! Thanks again! + +1. Fork the Project +2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`) +3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`) +4. Push to the Branch (`git push origin feature/AmazingFeature`) +5. Open a Pull Request + +

(back to top)

+ + + +## License + +Distributed under the MIT License. + +

(back to top)

+ + + +## Contributors + +Trương Hoàng Thuận (Captain 💕) - [@truonghoangthuan](https://github.com/truonghoangthuan) + +Ngô Hồng Quốc Bảo - [@NgoQuocBao](https://twitter.com/ngohquocbao1010) + +Lê Chánh Nhựt - [@lcnhut070200](https://github.com/lcnhut070200) + +Bùi Quốc Trọng - [@trongbui1105](https://github.com/trongbui1105) + + +

(back to top)

+ + -1. Server will run on localhost, port 5000. Make sure server is run successfully by using Postman or any API testing tool to make a GET request to server endpoint: http://localhost:5000/api to see all the available endpoints. +## Acknowledgments -## Independent testings: +- This awesome README temaplate is from [Best README Template](https://github.com/othneildrew/Best-README-Template). ♥ +- Admin pages UI are inspired from [Sakai Prime Vue](https://www.primefaces.org/sakai-vue/#/). -1. Test only [Landing pages](./landing-page/README.md) -1. Test only [Admin pages](./clients/README.md) -1. Test only [Server](./backend/README.md) +

(back to top)

diff --git a/admin-page/README.md b/admin-page/README.md index c2ff02c..3751382 100644 --- a/admin-page/README.md +++ b/admin-page/README.md @@ -1,6 +1,7 @@ ### Admin Page installation guide 1. Clone repo +1. [Install and start .NET server](../backend/README.md) 1. Install admin page dependencies ```bash @@ -13,4 +14,4 @@ npm run start-admin ``` -1. If everything is successfull, Go to http://localhost:3000/ **(make sure no service is run on the port 3000)** +1. If everything is installed successfully, Go to http://localhost:3000/ **(make sure no service is run on the port 3000)** diff --git a/admin-page/package.json b/admin-page/package.json index ac5b567..fa44a56 100644 --- a/admin-page/package.json +++ b/admin-page/package.json @@ -1,27 +1,27 @@ { - "version": "0.0.0", - "scripts": { - "dev": "vite", - "build": "vite build", - "preview": "vite preview --port 5050" - }, - "dependencies": { - "@vuelidate/core": "^2.0.0-alpha.35", - "@vuelidate/validators": "^2.0.0-alpha.27", - "axios": "^0.26.1", - "chart.js": "^3.7.1", - "dayjs": "^1.11.0", - "pinia": "^2.0.9", - "primeflex": "^3.1.3", - "primeicons": "^5.0.0", - "primevue": "^3.12.0", - "sass": "^1.49.0", - "vue": "^3.2.27", - "vue-router": "^4.0.12", - "xlsx": "^0.18.4" - }, - "devDependencies": { - "@vitejs/plugin-vue": "^2.0.1", - "vite": "^2.7.13" - } + "version": "0.0.0", + "scripts": { + "dev": "vite", + "build": "vite build --base=/admin/", + "preview": "vite preview --port 5050" + }, + "dependencies": { + "@vuelidate/core": "^2.0.0-alpha.35", + "@vuelidate/validators": "^2.0.0-alpha.27", + "axios": "^0.26.1", + "chart.js": "^3.7.1", + "dayjs": "^1.11.0", + "pinia": "^2.0.9", + "primeflex": "^3.1.3", + "primeicons": "^5.0.0", + "primevue": "^3.12.0", + "sass": "^1.49.0", + "vue": "^3.2.27", + "vue-router": "^4.0.12", + "xlsx": "^0.18.4" + }, + "devDependencies": { + "@vitejs/plugin-vue": "^2.0.1", + "vite": "^2.7.13" + } } diff --git a/admin-page/src/App.vue b/admin-page/src/App.vue index f813b1e..6b593a6 100644 --- a/admin-page/src/App.vue +++ b/admin-page/src/App.vue @@ -3,8 +3,8 @@ import { defineAsyncComponent, markRaw, watch, provide } from "vue"; import { useRoute, useRouter } from "vue-router"; import Toast from "primevue/toast"; -import { useUserStore } from "./stores/user"; -import { useAppStore } from "./stores/app"; +import { useUserStore } from "./stores/user.js"; +import { useAppStore } from "./stores/app.js"; import AppLoadingPage from "./components/AppLoadingPage.vue"; const userStore = useUserStore(); diff --git a/admin-page/src/api/AppRepo.js b/admin-page/src/api/AppRepo.js index 670a064..d793e3c 100644 --- a/admin-page/src/api/AppRepo.js +++ b/admin-page/src/api/AppRepo.js @@ -1,4 +1,4 @@ -import Repository from "./Repository"; +import Repository from "./Repository.js"; export default { getEndpoints() { diff --git a/admin-page/src/api/BloodRepo.js b/admin-page/src/api/BloodRepo.js index 9e7dd87..06922a6 100644 --- a/admin-page/src/api/BloodRepo.js +++ b/admin-page/src/api/BloodRepo.js @@ -1,4 +1,4 @@ -import Repository from "./Repository"; +import Repository from "./Repository.js"; const resource = "/Blood"; diff --git a/admin-page/src/api/DonorRepo.js b/admin-page/src/api/DonorRepo.js index 4a00be1..2614cbd 100644 --- a/admin-page/src/api/DonorRepo.js +++ b/admin-page/src/api/DonorRepo.js @@ -1,4 +1,4 @@ -import Repository from "./Repository"; +import Repository from "./Repository.js"; const resource = "/donor"; diff --git a/admin-page/src/api/DonorTransaction.js b/admin-page/src/api/DonorTransaction.js index c9beee9..351b985 100644 --- a/admin-page/src/api/DonorTransaction.js +++ b/admin-page/src/api/DonorTransaction.js @@ -1,4 +1,4 @@ -import Repository from "./Repository"; +import Repository from "./Repository.js"; const resource = "/donortransaction"; diff --git a/admin-page/src/api/EventRepo.js b/admin-page/src/api/EventRepo.js index 9bb6c11..a40e243 100644 --- a/admin-page/src/api/EventRepo.js +++ b/admin-page/src/api/EventRepo.js @@ -1,4 +1,4 @@ -import Repository from "./Repository"; +import Repository from "./Repository.js"; const resource = "/event"; diff --git a/admin-page/src/api/EventSubmissionRepo.js b/admin-page/src/api/EventSubmissionRepo.js index 20efcc7..9c57d15 100644 --- a/admin-page/src/api/EventSubmissionRepo.js +++ b/admin-page/src/api/EventSubmissionRepo.js @@ -1,4 +1,4 @@ -import Repository from "./Repository"; +import Repository from "./Repository.js"; const resource = "/eventSubmission"; diff --git a/admin-page/src/api/HospitalRepo.js b/admin-page/src/api/HospitalRepo.js index cb677f7..66005c7 100644 --- a/admin-page/src/api/HospitalRepo.js +++ b/admin-page/src/api/HospitalRepo.js @@ -1,4 +1,4 @@ -import Repository from "./Repository"; +import Repository from "./Repository.js"; const resource = "/Hospital"; diff --git a/admin-page/src/api/RequestRepo.js b/admin-page/src/api/RequestRepo.js index 2ec8ab7..2e46031 100644 --- a/admin-page/src/api/RequestRepo.js +++ b/admin-page/src/api/RequestRepo.js @@ -1,4 +1,4 @@ -import Repository from "./Repository"; +import Repository from "./Repository.js"; const resource = "/Request"; diff --git a/admin-page/src/api/UserRepo.js b/admin-page/src/api/UserRepo.js index 5d34bfa..2c731b1 100644 --- a/admin-page/src/api/UserRepo.js +++ b/admin-page/src/api/UserRepo.js @@ -1,4 +1,4 @@ -import Repository from "./Repository"; +import Repository from "./Repository.js"; const resource = "/user"; diff --git a/admin-page/src/api/helpers.js b/admin-page/src/api/helpers.js index 61b7c95..76b84e6 100644 --- a/admin-page/src/api/helpers.js +++ b/admin-page/src/api/helpers.js @@ -1,4 +1,4 @@ -import Repository from "./Repository"; +import Repository from "./Repository.js"; const useLocalToken = () => { /* Use local token to authorized */ diff --git a/admin-page/src/components/dashboard/ActivityChart.vue b/admin-page/src/components/dashboard/ActivityChart.vue index fbe2d44..d360ba0 100644 --- a/admin-page/src/components/dashboard/ActivityChart.vue +++ b/admin-page/src/components/dashboard/ActivityChart.vue @@ -1,7 +1,7 @@ diff --git a/admin-page/src/views/form/EventForm.vue b/admin-page/src/views/form/EventForm.vue index e35d215..cd1ef39 100644 --- a/admin-page/src/views/form/EventForm.vue +++ b/admin-page/src/views/form/EventForm.vue @@ -12,8 +12,8 @@ import { useToast } from "primevue/usetoast"; import useVuelidate from "@vuelidate/core"; import { required } from "@vuelidate/validators"; -import { useEventStore } from "../../stores/event"; -import EventRepo from "../../api/EventRepo"; +import { useEventStore } from "../../stores/event.js"; +import EventRepo from "../../api/EventRepo.js"; import { fileToBase64, formatDate, stringToDate } from "../../utils"; import { PRIMARY_CITIES } from "../../constants"; diff --git a/admin-page/src/views/form/HospitalForm.vue b/admin-page/src/views/form/HospitalForm.vue index 6089578..c45309f 100644 --- a/admin-page/src/views/form/HospitalForm.vue +++ b/admin-page/src/views/form/HospitalForm.vue @@ -5,7 +5,7 @@ import InputText from "primevue/inputtext"; import { useToast } from "primevue/usetoast"; import useVuelidate from "@vuelidate/core"; import { required } from "@vuelidate/validators"; -import HospitalRepo from "../../api/HospitalRepo"; +import HospitalRepo from "../../api/HospitalRepo.js"; const router = useRouter(); const { _id, hospitalData } = defineProps({ diff --git a/admin-page/src/views/hospital-pages/HospitalProfile.vue b/admin-page/src/views/hospital-pages/HospitalProfile.vue index 78ab3a5..2bc553f 100644 --- a/admin-page/src/views/hospital-pages/HospitalProfile.vue +++ b/admin-page/src/views/hospital-pages/HospitalProfile.vue @@ -1,7 +1,7 @@ diff --git a/landing-page/vite.config.js b/landing-page/vite.config.js index 315212d..dda8503 100644 --- a/landing-page/vite.config.js +++ b/landing-page/vite.config.js @@ -1,7 +1,7 @@ -import { defineConfig } from 'vite' -import vue from '@vitejs/plugin-vue' +import { defineConfig } from "vite"; +import vue from "@vitejs/plugin-vue"; // https://vitejs.dev/config/ export default defineConfig({ - plugins: [vue()] -}) + plugins: [vue()], +}); diff --git a/package.json b/package.json index fddd838..c1acd79 100644 --- a/package.json +++ b/package.json @@ -10,11 +10,12 @@ "start-lp": "cd landing-page && npm run dev", "install-all": "npm run install-admin && npm run install-lp", "build-admin": "cd admin-page && npm run build", - "preview-build-admin": "npm run build-admin && cd admin-page && npm run preview", "build-lp": "cd landing-page && npm run build", - "preview-build-lp": "npm run build-lp && cd landing-page && npm run preview", "build-all": "npm run build-admin && npm run build-lp", - "start-sv": "cd backend && dotnet run" + "move-build": "mkdir -p ./backend/wwwroot && cp -R ./admin-page/dist ./backend/wwwroot/admin && cp -R ./landing-page/dist ./backend/wwwroot/landing-page", + "build-to-serve": "npm run build-all && if [ -d ./backend/wwwroot ]; then rm -Rf ./backend/wwwroot; fi && npm run move-build", + "start-sv": "cd backend && dotnet run", + "start": "npm run build-to-serve && npm run start-sv" }, "repository": { "type": "git", diff --git a/screenshots/blood.png b/screenshots/blood.png new file mode 100644 index 0000000..ad34748 Binary files /dev/null and b/screenshots/blood.png differ diff --git a/screenshots/dashboard.png b/screenshots/dashboard.png new file mode 100644 index 0000000..20fbc55 Binary files /dev/null and b/screenshots/dashboard.png differ diff --git a/screenshots/donations.png b/screenshots/donations.png new file mode 100644 index 0000000..6117f25 Binary files /dev/null and b/screenshots/donations.png differ diff --git a/screenshots/donations2.png b/screenshots/donations2.png new file mode 100644 index 0000000..4b9b21c Binary files /dev/null and b/screenshots/donations2.png differ diff --git a/screenshots/donations3.png b/screenshots/donations3.png new file mode 100644 index 0000000..51fd2a7 Binary files /dev/null and b/screenshots/donations3.png differ diff --git a/screenshots/donor.png b/screenshots/donor.png new file mode 100644 index 0000000..d6c53dc Binary files /dev/null and b/screenshots/donor.png differ diff --git a/screenshots/donors.png b/screenshots/donors.png new file mode 100644 index 0000000..e2719ac Binary files /dev/null and b/screenshots/donors.png differ diff --git a/screenshots/event_detail.png b/screenshots/event_detail.png new file mode 100644 index 0000000..f785a91 Binary files /dev/null and b/screenshots/event_detail.png differ diff --git a/screenshots/events_admin.png b/screenshots/events_admin.png new file mode 100644 index 0000000..039c175 Binary files /dev/null and b/screenshots/events_admin.png differ diff --git a/screenshots/events_lp.png b/screenshots/events_lp.png new file mode 100644 index 0000000..68dc03f Binary files /dev/null and b/screenshots/events_lp.png differ diff --git a/screenshots/hos.png b/screenshots/hos.png new file mode 100644 index 0000000..9163238 Binary files /dev/null and b/screenshots/hos.png differ diff --git a/screenshots/hos_info.png b/screenshots/hos_info.png new file mode 100644 index 0000000..d3dfcf3 Binary files /dev/null and b/screenshots/hos_info.png differ diff --git a/screenshots/hos_req.png b/screenshots/hos_req.png new file mode 100644 index 0000000..925f5a7 Binary files /dev/null and b/screenshots/hos_req.png differ diff --git a/screenshots/info.png b/screenshots/info.png new file mode 100644 index 0000000..f8334b5 Binary files /dev/null and b/screenshots/info.png differ diff --git a/screenshots/info_donation.png b/screenshots/info_donation.png new file mode 100644 index 0000000..7c4bae4 Binary files /dev/null and b/screenshots/info_donation.png differ diff --git a/screenshots/logo.png b/screenshots/logo.png new file mode 100644 index 0000000..cf7f703 Binary files /dev/null and b/screenshots/logo.png differ diff --git a/screenshots/register.png b/screenshots/register.png new file mode 100644 index 0000000..f61d67f Binary files /dev/null and b/screenshots/register.png differ diff --git a/screenshots/requests.png b/screenshots/requests.png new file mode 100644 index 0000000..79e976c Binary files /dev/null and b/screenshots/requests.png differ diff --git a/screenshots/requests2.png b/screenshots/requests2.png new file mode 100644 index 0000000..667d2cf Binary files /dev/null and b/screenshots/requests2.png differ diff --git a/screenshots/users.png b/screenshots/users.png new file mode 100644 index 0000000..29e3ecc Binary files /dev/null and b/screenshots/users.png differ