Skip to content

Commit

Permalink
More UI
Browse files Browse the repository at this point in the history
  • Loading branch information
laistdomiciano committed Sep 12, 2024
1 parent 6a4331f commit 6853e13
Show file tree
Hide file tree
Showing 5 changed files with 225 additions and 250 deletions.
31 changes: 15 additions & 16 deletions frontend/frontend_app.py
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
from flask import Flask, request, session, render_template, redirect, url_for, jsonify
from flask import Flask, request, session, render_template, redirect, url_for, flash
from flask_login import LoginManager, login_user, login_required, logout_user, current_user
from werkzeug.security import check_password_hash
import requests
Expand Down Expand Up @@ -77,7 +77,7 @@ def logout():
@app.route('/dashboard')
@login_required
def dashboard():
return render_template('dashboard.html', user=session.get('user'))
return render_template('create_contract.html', user=session.get('user'))

@app.route('/create_employee', methods=['GET', 'POST'])
@login_required
Expand Down Expand Up @@ -105,44 +105,43 @@ def create_employee():
'client_representative': request.form.get('client_representative')
}

# Prepare the headers, including the token for authorization
headers = {
'Authorization': f"Bearer {session.get('access_token')}"
}

# Send a POST request to the backend API to create the employee
response = requests.post(f"{BACKEND_API_URL}/create_employee", json=form_data, headers=headers)
result = response.json()

if response.status_code == 201:
# If employee creation was successful, flash a success message and redirect to dashboard

flash(f"Employee {form_data['employee_name']} created successfully.", 'success')
return redirect(url_for('dashboard'))
else:
# If there was an error, render the form again and display the error message
error = result.get('error', 'An error occurred while creating the employee.')
return render_template('create_employee.html', error=error)

# If it's a GET request, simply render the create_employee form
return render_template('create_employee.html')



@app.route('/employees_wo_contract', methods=['GET'])
@app.route('/create_contract', methods=['GET'])
@login_required
def employees_wo_contract():
def create_contract():
headers = {
'Authorization': f"Bearer {session.get('access_token')}"
}

response = requests.get(f"{BACKEND_API_URL}/employees_wo_contract", headers=headers)
employees = response.json()
response_contract = requests.get(f"{BACKEND_API_URL}/create_contract", headers=headers)
response_employee = requests.get(f"{BACKEND_API_URL}/create_contract", headers=headers)
contracts = response_contract.json()
employees = response_employee.json()

if response.status_code == 200:
return render_template('employees_wo_contract.html', employees=employees)
if response_contract.status_code and response_employee.status_code == 200:
return render_template('create_contract.html', employees=employees, contracts=contracts)
else:
error = employees.get('error', 'An error occurred while retrieving employees.')
return render_template('employees_wo_contract.html', error=error)
error_contracts = employees.get('error', 'An error occurred while retrieving employees.')
error_employees = employees.get('error', 'An error occurred while retrieving employees.')
return render_template('create_contract.html', error_contracts=error_contracts,error_employees=error_employees)


@app.route('/update_user/<int:user_id>', methods=['GET', 'POST'])
Expand All @@ -152,7 +151,7 @@ def update_user(user_id):
form_data = {
'name': request.form.get('name'),
'email': request.form.get('email'),
'password': request.form.get('password') # Optional
'password': request.form.get('password')
}

headers = {
Expand Down
47 changes: 47 additions & 0 deletions frontend/public/create_contract.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
<!-- frontend/templates/create_contract.html -->
{% extends "home.html" %}

{% block content %}
<div class="container my-5">
<div class="d-flex justify-content-between align-items-center mb-4">
<h2>Dashboard</h2>
<a href="/logout" class="btn btn-danger">Logout</a>
</div>
<div class="card shadow-sm">
<div class="card-body">
<h5 class="card-title">Welcome, {{ user.username }}!</h5>
<p class="card-text">Choose a contract type to generate:</p>
<!-- Bootstrap Dropdown -->
<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle" type="button" id="contractDropdown" data-bs-toggle="dropdown" aria-expanded="false">
Select Contract Type
</button>
<ul class="dropdown-menu" aria-labelledby="contractDropdown">
<li><a class="dropdown-item" href="#" data-type="fulltime">Full-Time Employment</a></li>
<li><a class="dropdown-item" href="#" data-type="parttime">Part-Time Employment</a></li>
<li><a class="dropdown-item" href="#" data-type="freelance">Freelance Contract</a></li>
</ul>
</div>
</div>
</div>
</div>

<!-- Optional: Modal for Contract Generation -->
<div class="modal fade" id="contractModal" tabindex="-1" aria-labelledby="contractModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="contractModalLabel">Generate Contract</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<p>Are you sure you want to generate a <span id="contractTypeName"></span> contract?</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-primary" id="confirmGenerate">Generate</button>
</div>
</div>
</div>
</div>
{% endblock %}
155 changes: 154 additions & 1 deletion frontend/public/create_employee.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,24 +5,177 @@
<div class="col-md-8 col-lg-6">
<h2 class="mb-4">Create New Employee</h2>
<form id="create-employee-form" action="/create_employee" method="post" class="needs-validation" novalidate>

<!-- Employee Name -->
<div class="mb-3">
<label for="employee_name" class="form-label">Employee Name</label>
<input type="text" id="employee_name" name="employee_name" class="form-control" required>
<div class="invalid-feedback">
Please enter the employee name.
</div>
</div>

<!-- Company Name -->
<div class="mb-3">
<label for="company_name" class="form-label">Company Name</label>
<input type="text" id="company_name" name="company_name" class="form-control" required>
<div class="invalid-feedback">
Please enter the company name.
</div>
</div>
<!-- Add all required fields similar to the above two -->

<!-- Start Date -->
<div class="mb-3">
<label for="start_date" class="form-label">Start Date</label>
<input type="date" id="start_date" name="start_date" class="form-control" required>
<div class="invalid-feedback">
Please enter a valid start date.
</div>
</div>

<!-- Job Title -->
<div class="mb-3">
<label for="job_title" class="form-label">Job Title</label>
<input type="text" id="job_title" name="job_title" class="form-control" required>
<div class="invalid-feedback">
Please enter the job title.
</div>
</div>

<!-- Job Responsibilities -->
<div class="mb-3">
<label for="job_responsibilities" class="form-label">Job Responsibilities</label>
<textarea id="job_responsibilities" name="job_responsibilities" class="form-control" rows="4" required></textarea>
<div class="invalid-feedback">
Please enter the job responsibilities.
</div>
</div>

<!-- Salary -->
<div class="mb-3">
<label for="salary" class="form-label">Salary</label>
<input type="number" step="0.01" id="salary" name="salary" class="form-control" required>
<div class="invalid-feedback">
Please enter the salary.
</div>
</div>

<!-- Benefits -->
<div class="mb-3">
<label for="benefits" class="form-label">Benefits</label>
<textarea id="benefits" name="benefits" class="form-control" rows="2"></textarea>
<div class="invalid-feedback">
Please enter any benefits.
</div>
</div>

<!-- Work Hours -->
<div class="mb-3">
<label for="work_hours" class="form-label">Work Hours</label>
<input type="text" id="work_hours" name="work_hours" class="form-control" required>
<div class="invalid-feedback">
Please enter the work hours.
</div>
</div>

<!-- Leave Days -->
<div class="mb-3">
<label for="leave_days" class="form-label">Leave Days</label>
<input type="number" id="leave_days" name="leave_days" class="form-control" required>
<div class="invalid-feedback">
Please enter the number of leave days.
</div>
</div>

<!-- Notice Period -->
<div class="mb-3">
<label for="notice_period" class="form-label">Notice Period</label>
<input type="text" id="notice_period" name="notice_period" class="form-control" required>
<div class="invalid-feedback">
Please enter the notice period.
</div>
</div>

<!-- Hourly Rate -->
<div class="mb-3">
<label for="hourly_rate" class="form-label">Hourly Rate</label>
<input type="number" step="0.01" id="hourly_rate" name="hourly_rate" class="form-control" required>
<div class="invalid-feedback">
Please enter the hourly rate.
</div>
</div>

<!-- Number of Hours -->
<div class="mb-3">
<label for="number_of_hours" class="form-label">Number of Hours</label>
<input type="number" step="0.01" id="number_of_hours" name="number_of_hours" class="form-control" required>
<div class="invalid-feedback">
Please enter the number of hours.
</div>
</div>

<!-- Description of Services -->
<div class="mb-3">
<label for="description_of_services" class="form-label">Description of Services</label>
<textarea id="description_of_services" name="description_of_services" class="form-control" rows="4" required></textarea>
<div class="invalid-feedback">
Please enter a description of services.
</div>
</div>

<!-- Fee Amount -->
<div class="mb-3">
<label for="fee_amount" class="form-label">Fee Amount</label>
<input type="number" step="0.01" id="fee_amount" name="fee_amount" class="form-control" required>
<div class="invalid-feedback">
Please enter the fee amount.
</div>
</div>

<!-- Payment Schedule -->
<div class="mb-3">
<label for="payment_schedule" class="form-label">Payment Schedule</label>
<input type="text" id="payment_schedule" name="payment_schedule" class="form-control" required>
<div class="invalid-feedback">
Please enter the payment schedule.
</div>
</div>

<!-- Ownership Terms -->
<div class="mb-3">
<label for="ownership_terms" class="form-label">Ownership Terms</label>
<textarea id="ownership_terms" name="ownership_terms" class="form-control" rows="3" required></textarea>
<div class="invalid-feedback">
Please enter the ownership terms.
</div>
</div>

<!-- Company Representative -->
<div class="mb-3">
<label for="company_representative" class="form-label">Company Representative</label>
<input type="text" id="company_representative" name="company_representative" class="form-control" required>
<div class="invalid-feedback">
Please enter the company representative's name.
</div>
</div>

<!-- Client Representative -->
<div class="mb-3">
<label for="client_representative" class="form-label">Client Representative</label>
<input type="text" id="client_representative" name="client_representative" class="form-control" required>
<div class="invalid-feedback">
Please enter the client representative's name.
</div>
</div>

<!-- Submit Button -->
<button type="submit" class="btn btn-success w-100">Create Employee</button>
</form>

<!-- Back to Dashboard Link -->
<p class="mt-3 text-center"><a href="/dashboard">Back to Dashboard</a></p>

<!-- Display Error Message if Any -->
{% if error %}
<div class="alert alert-danger mt-3" role="alert">
{{ error }}
Expand Down
55 changes: 9 additions & 46 deletions frontend/public/dashboard.html
Original file line number Diff line number Diff line change
@@ -1,47 +1,10 @@
<!-- frontend/templates/dashboard.html -->
{% extends "home.html" %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>

{% block content %}
<div class="container my-5">
<div class="d-flex justify-content-between align-items-center mb-4">
<h2>Dashboard</h2>
<a href="/logout" class="btn btn-danger">Logout</a>
</div>
<div class="card shadow-sm">
<div class="card-body">
<h5 class="card-title">Welcome, {{ user.username }}!</h5>
<p class="card-text">Choose a contract type to generate:</p>
<!-- Bootstrap Dropdown -->
<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle" type="button" id="contractDropdown" data-bs-toggle="dropdown" aria-expanded="false">
Select Contract Type
</button>
<ul class="dropdown-menu" aria-labelledby="contractDropdown">
<li><a class="dropdown-item" href="#" data-type="fulltime">Full-Time Employment</a></li>
<li><a class="dropdown-item" href="#" data-type="parttime">Part-Time Employment</a></li>
<li><a class="dropdown-item" href="#" data-type="freelance">Freelance Contract</a></li>
</ul>
</div>
</div>
</div>
</div>

<!-- Optional: Modal for Contract Generation -->
<div class="modal fade" id="contractModal" tabindex="-1" aria-labelledby="contractModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="contractModalLabel">Generate Contract</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<p>Are you sure you want to generate a <span id="contractTypeName"></span> contract?</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-primary" id="confirmGenerate">Generate</button>
</div>
</div>
</div>
</div>
{% endblock %}
</body>
</html>
Loading

0 comments on commit 6853e13

Please sign in to comment.