A complete bill management software to digitilize previously offline billing process.
Request Demo
·
Report Bug
·
Request Feature
Table of Contents
The goal of this project is to manage saved bills and data of more than 400+ Delhi-based institutes that the Delite Catering Company counts as clients, as well as to digitize the offline billing process.
The Digital Transformation era has begun and businesses need to efficiently utilize and manage data in order to compete in the digital economy of today while also assuring future success. Starting by eliminating paper-based operations is a smart strategy.
Companies should be transformed digitally so that data can be quickly searched for, retrieved, and integrated. This simplifies process implementation and reduces costs.
│ .gitignore │ package-lock.json │ package.json │ Procfile │ README.md | .env │ ├───client │ │ package-lock.json │ │ package-lock.json │ │ README.md │ │ │ ├───public │ │ favicon.ico │ │ index.html │ │ logo192.png │ │ logo512.png │ │ manifest.json │ │ robots.txt │ │ │ └───src │ │ App.js │ │ bootstrap.min.css │ │ index.css │ │ index.js │ │ │ ├───actions │ │ billActions.js │ │ unitActions.js │ │ userActions.js │ │ │ ├───components │ │ │ Footer.js │ │ │ Header.js │ │ │ Main.js │ │ │ │ │ ├───Bill │ │ │ index.js │ │ │ index.module.css │ │ │ │ │ ├───BillHistory │ │ │ Filter.js │ │ │ │ │ ├───form │ │ │ FormContainer.js │ │ │ │ │ ├───Institutes │ │ │ └───Modals │ │ │ AddInstituteModal.js │ │ │ EditInstituteModal.js │ │ │ │ │ └───ui │ │ Loader.js │ │ Message.js │ │ │ ├───constants │ │ billConstants.js │ │ unitConstants.js │ │ userConstants.js │ │ │ ├───hooks │ │ useDebounce.js │ │ │ ├───reducers │ │ billReducer.js │ │ unitReducers.js │ │ userReducers.js │ │ │ ├───store │ │ store.js │ │ │ ├───utils │ │ dateToString.js │ │ formatAMPM.js | | printPDF.js │ │ │ └───views │ BillHistoryPage.js │ BillPage.js │ BillPage.module.css │ EditBillPage.js │ HomePage.js │ InstitutesPage.js │ LoginPage.js │ ProfilePage.js │ RegisterPage.js │ SchoolBillHistoryPage.js │ └───server │ index.js │ ├───controllers │ billController.js │ unitController.js │ userController.js │ ├───middleware │ authMiddleware.js │ errorMiddleware.js │ ├───models │ billModel.js │ unitModel.js │ userModel.js │ ├───routes │ billRoutes.js │ unitRoutes.js │ userRoutes.js │ └───utils db.js
feature1.mp4
- User can enter email ID and password, which is verified in backend using custom controller function.
- Passwords are encrypted and compared using BCryptJS
- An authentication token is generated using JSON Web Token
feature2.mp4
- Institute list is fetched from backend and populated into an array which is then passed to data attribute of Mantine/core's Select component
- Mantine/core's Select component is searchable using a filter function that has been configured to exclude institutions whose code or name doesn't matches the entered value.
- Once user selects an institute and click on generate bill, redirection takes place with institute id and unit id as url parameters.
feature3.mp4
- Using the unit and institute IDs from URL parameters, the data is fetched from backend. The bill automatically updates fields like the most recent invoice number, the billing/supply address, etc.
- The total/taxable amount is calculated and updated automatically, and fields like date, time, quantity, rate, etc. are kept editable.
- When a user enters all the necessary information and clicks the save button, the bill is stored in the database and the user is redirected to the home page.
feature4.mp4
- When user navigates to all bills option in navbar, a complete list of latest bills (max 50)
- The total/taxable amount is calculated and updated automatically, and fields like date, time, quantity, rate, etc. are kept editable.
- When a user enters all the necessary information and clicks the save button, the bill is stored in the database and the user is redirected to the home page.
- Using
findById(req.params.id)
to find the billdeleteOne()
methods, a bill can be deleted and from the database.
feature5.mp4
- User can select multiple bills from the table and select print option.
- Details of selected bills are fetched and each bill is mapped into the bill component.
- The total content of web page is replaced with all bill components and
window.print()
method is used. Once done, the document is replaced back with original content.
feature7.mp4
- User can filter bills according to a specific date or a range of dates.
- When a user picks a date or range of dates, a backend request is made, and bills that correspond to the selected dates are returned and displayed in the front end.
feature8.mp4
- A user may also search for bills for a specific institute. A backend request is made when an institute is chosen and using the institute ID, bills are filtered and sent back to the client.
- All features are identical to those on the "all bills" page.
feature9.mp4
- Users can view a list of all institutes as well as add, edit, and delete them which, in backend, has been implemented using CRUD operations.
feature6.mp4
- Users can also update their profile information such as name, email, and password.