Club Management System Webapp Summary

Please note this is a summary made at an intermediate stage; refer to the Final_Report.pdf to know about the project's final touches.

Made with Flask and MySQL

Setup

1. Install Python

2. Install MySQL

3. Install the required packages for python:

   pip install flask
   pip install flask-mysql
   pip install flask-session
   pip install mysql-connector-python

4. Create the database CLUB_MS. In order to do login in to MYSQL Workbench using your root user and run the 'studentdb.sql' file in your SQL Workbench. This will create the database and populate it with the required tables and data.

5. Now update the mysql configurations in 'app.py' file. If you are using root user like us you can enter your root password for the password key below in the 'app.py' file, however, it should be best to rather use some other user and and passowrd, but for that you need to run the script 'studentdb.sql' with the same user.

   mysql_config = {
   'host': 'localhost',
   'user': 'root',
   'password': 'DBMS_mysql@0204',    #Enter ur password for root
   'database': 'CLUB_MS'
   }

6. Login in to MYSQL Workbench using your root user.

   • Click on the 'Administration' tab.
   

   • Click on the 'Users and Privileges' option.

   • Click on the 'Add Account' button. -Enter the following details keeping the rest of the fields as default:

     • Login Name: newuser
     • Password: mannudb

   • Click on the apply button.

• Click on 'Administrative Roles' and then click on 'Revoke All Privileges'.

• Click on 'Schmema Privileges' and then click on 'Revoke All Privileges'.

• Go to your home tab in Workbench and then add a new connection by clicking on the '+' button:

• Here Enter the following: - Connection Name: student - Username: student

• Click on 'Test Connection' and then enter the password mannudb when prompted. Then click on 'OK'.

7. Repeat the entire above point for a new user 'employee' in your MYSQL Workbench with the following details:

   • Login Name: employee
   • Connection Name: employee
   • Username: employee
   • Password: mannudb

8. Grant Permissions to the 'student' role. In order to do this, run the 'student_role_permissions' file in the 'Dump Files' directory in your SQL Workbench. This will grant the required permissions to the 'student' role.

9. Grant Permissions to the 'employee' role. In order to do this, run the 'employee_role_permissions' file in the 'Dump Files' directory in your SQL Workbench. This will grant the required permissions to the 'employee' role.

Running the Webapp

After setting up the database and configuration, we can run our webapp. To do that:

1. Open your terminal window in the folder 'Database-Project/' and run the following:

   python app.py

2. Open your browser and go to the URL that is displayed in the terminal, like this:

   http://127.0.0.1:5000

Now your home page is opened which is a login page for our Club Management System where you can login as a student, employee or admin (person with all permissions).

Login view

We have 3 different kinds of logins for which navigate each to seperate views of the webapp with different capabilities and facilities.

STUDENT View

On performing student login we start with student details.
There are many features for students from issueing different equipment, to viewing or registering for an upcoming event and even adding an event (permissions alloted if secretary of a club/council). Below are some features:

Equipments Section

This is the equipment page You can perform either of the 3 actions on this page from issuing new equipment which is followed in the below images or returning any unreturned equipment or viewing your own issuing history.

As you can see a entry with loudspeakers have been made with purpose practice. This includes INSERT query into the ISSUE table. For returning, we use UPDATE query. Moreover, for viewing queries with WHERE clause used.

Events

We can register for various upcoming events through following procedure:

Council and Clubs

Council and Clubs page can be used for various purposes, ranging from seeing information about various councils and clubs listed under them. Moreover, if we are secretary for a club/ council we can add or delete member/ coordinator entries in our own council/ club. Secretary for a club can also add event listing which are listed with a pending approval. Checkout yourself by logging in as a secretary.

EMPLOYEE view

Employee view in general is very similar to student view except if you have any special responsibilities.

Below employee has the responsibilty to manage below venues. You can verify this from the database. Below emloyee has the responsibilty for approvals on below event. BEFORE query: Below you can see that after hitting the update button, the approval was changed to accept for selected event. AFTER:

ADMIN view

On performing we start with this page displaying all the tables and we can select one to view or make changes to.

Admin can perform INSERT, DELETE and RENAME queries on all the tables of the database. BEFORE performing operations:

1. Performing INSERT
   We INSERT a club "Club_dummy" to our clubs table. Fill in all the fields and press INSERT button. Changes will reflect both on the webapp and database.
   
   
   

2. Performing DELETE
   We DELETE the club "Club_dummy" which we earlier added. Just fill in the corresponding fields and press DELETE.
   
   
   

3. Performing RENAME
   Admin can rename a table and it will reflect over the database and the webapp.
   On pressing the RENAME button the following fields appears asking for a new name. Fill in the field and press enter.
   
   

   Renaming clubs to clubs_of_iitgn.
   
   Also reflected on the sql where now club_ms.clubs table doesn’t exist, instead club_ms.clubs_of_iitgn exists. Same can be tried out for other tables from the admin Page whose access only lies with admin (if you login as admin).
   
   Also the main admin page has now changed
   

Work Distribution

Group1

1. Anshul Choudhary

   • Worked on ideating the initial design of the website.
   • Made sketches and illustrated the flow of the website and different requirements
   • Made front-end for couple of website including css styling

2. Shrijan Sahu

   • Made front-end for many pages and beautified their looks
   • Ideated on various possible design themes for the website.
   • Added javascript and accomplished dynamic changes obtained from running backend

3. Amey Rangari

   • Participated in initial design ideation for the website to discuss flow and execution.
   • Made beautification and visual changes to various components of project.
   • Assisted in debugging of various issues arrived during linking.

Group2

1. Shubh Singhal

   • Ideated and wrote various backend queries required for smooth functioning of webapp.
   • Added and tested various views and dynamic operations.
   • Led in debugging various inconsistences and bugs accumulated in running the webapp.

2. Yashraj Deshmukh

   • Led in writing back-end code for various pages and setting routing protocols.
   • Ideated on what routing protocols to follow and work-flow of app.
   • Worked on combining various elements of database system.

3. Pratham Sagar

   • Ideated on what permissions to be alloted to different users and implemented that.
   • Documented the screenshots of the execution in the ReadMe.MD file.
   • Collaborated with Front-end team and contributed to html structure of pages.

4. Manvendra Singh

   • Setup the inital required connections for flask and mysql integration with the webapp.
   • Documented the testing output with snapshots in the ReadMe.MD file.
   • Made backend-routing protocols for many pages and fit them in the front-end.