Track Time Hours and Salary with Django

Image for post
Image for post

Hello world. In this article we will create a django app, which will handle employers and we will track their hours work and payments. We will use the next frameworks and libraries to help us create that. ( I assume you have already installed a python and you know the basics steps)


Part 1. Create the App

After installing django or i assume you have it, let’s create our app.

Next step create our apps.

The front end app will place our views, templates, and static files and the payroll app will add our models, forms etc..

Inside the frontend folder let’s create two more folders with the names templates and static, so the directory will be like this.

Inside the static folder add this files ==>

Inside the templates folder add this files ==>

Will explain om last part the frontend.

Now it’s time to edit files inside payroll_warehouse folder. I will add only the changes, you can always grab the whole file from github.

First we register our apps.

And then we inform the django app where the static folder is and adding the currency variable.

The second file need edit is the Delete anything from this file and add this.

Here just copy the code, this code include the views we will write and with the help of path we match them with the url. Further explain later.

Done let’s move on.

Part 2. Payroll Folder, Create The models.

First, we will create some abstract models. So inside the payroll folder we create a new file called

What does abstract models? We use them as a base model to create different models with same fields and little changes if needed so we don’t repeat ourselves.

Let’s add here a function too.

What does? Get’s the date from frontend format and transform to a format that django understand so he can use it.

This is a default order model. Many features will be not used, just added as a example, like the paid function or printed. So if we had a bigger app we could this model as a Sale Model, Warehouse Invoice, in fact anything we want, and make our life easier.

Now let’s go to .

First the imports, nothing fancy here.

The Occupation model will be used for filtering the Employers. So the fields we need is, check if it’s active, the title , some notes if needed and the balance is a meter that gets all the remaining money you need to pay per occupation. To achieve that we need to overwrite the save method of the model. Let’s see it. (again maybe i will not use anything)

No need to explain the __str__method, let’s see the save method now. When a save trigger on a occupation object, this calculation always run to refresh the balance. Step by step, we get all the employers(persons), related in this object and with the help of aggregate and Sum we get the desire result. We always need to check if there is a queryset because if there no objects, the program will crash.

Now is time to Create the Person model.

In this model will add the employers. What info we need? We have to check if the person is active, when added or edited, his name, phone, which occupation belongs for easy filtering and his balance and some salary.W will have 2 different salary options, one for extra time and one for normal

After that lets add this methods.

We override the save method again, this time to update the balance we call the update_balance function, which works like before with occupation, we save the object, and after that we save the occupation if exists so we trigger the save method we explain earlier. Now update_balance method. First step we get all the invoices for this person and calculate the total money we need to pay him. After that we calculate which of this is already paid and we return the difference.

And we add this code for the front end again. Now its time for the Payrolls.

First we will add the manager here.

Normal we should create a separate file, but cba. What we need the manager for? We can create our own querysets, which is easier to use them to get the data we want.

Now the Payroll Model.

With the payroll model we can add payments to our employers.The fields now, title we add a note about the payment(optionally), person we see which employer gets the payment, and choice is the type of payment.With ordering, we can handle which order will be show on frontend

The functions now.

With str we return the desire title we want, and we override the save method, so we can add the paid value if the object is paid and add a default title if the user left it False.

And finally let’s see the signal.

(signals is a django system to call a function when a object is saved, created or deleted, here will use the post_delete)

What we do here? We using the receiver and when a payroll object is deleted, after the deletion we trigger this function to update the person balance.

And finally let’s create another one file called

Imports, nothing fancy here.

This model will help us to track when the employers start and end the shift. Again we override the save method and when a new object is created, we calculate the hours and the cost depends on the type of shift and save it again on cost field.

Now lets create another file the

This will help us to create a widget for adding date and hour to our browser

Now to use this widget we need our

Here we can see the imports and the BaseForm. Will use the BaseForm model for all ours forms we will create have the class form-control which bootstrap understands.

All the forms we need is here. A little explain now for PersonScheduleForm

We needed way to pass the data from model to frontend, and configure the front end, this line does all the magic.All the others form not need much explain, when we use the HiddenInput, will pass the data from the view and for date_expired, except the form-control we need to pass the date type for the browser again.

4. The views and the templates

I will not cover full explain for the templates files, but only when needed, now let’s see the from frontend folder.

First the imports

Homepage view, we will use always the method_decorator with the staff_member to all views to ensure only staff members have access to the page. Then we add the forms we created before so the user can create a occupation or employer. Finally we will fetch all the data from the models person and occupation with the objects.all()

Next we create views to validate the data from the forms. What we do? Because on the homepage we have multiply forms weneed to redirect the validation of data with the help of action on the html forms to different views for easy manipulation the post data.

Where is the the action? Inside homepage.html we redirect the forms easy here.


After the redirection we use this views to get and save the data

And last the update and delete view for occupation.

Now let’s see the person update view. Here we need to do many things, like update or delete the person, add payment or add schedule.

Let’s analyse one by one.

First the form to update the data for the person. Because we use class based view, we just add the form to form class and with form_valid, and get_success url we manipulate the post data.

Now the payment form.

Here the user will add the payments. He choose the fields he want and after that with the help of action we redirect it to another view fo validation.

Now let’s explain the time form.

After we pick the from and until fields, we have to choose a category, and depends on category we multiply the time with the hours or extra field from model. Same like before the validation is on another view.

Here we handle the validation or the delete for payments and schedules, so depends from type_ argument we do the action needed

Thx ya!

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store