Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature backend(global) 41 implementing search bar functionality #46

Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
41 changes: 38 additions & 3 deletions app.py
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
from flask import Flask, render_template, request, redirect
from flask import Flask, render_template, request, redirect, jsonify, Response
import sqlite3
from flask_sqlalchemy import SQLAlchemy

Expand Down Expand Up @@ -274,7 +274,7 @@ def edit_employee(id):
employee = Employee.query.get(id)
if request.method == 'GET':
return render_template('edit_employee.html', employee=employee, locations=locations)

if request.method == 'POST':
employee.employee_name = request.form['employee_name']
employee.gender = request.form['gender']
Expand All @@ -286,7 +286,7 @@ def edit_employee(id):
db.session.commit()
return redirect('/employee')

@app.route('/edit_equipment<int:barcode_number>', methods=['GET' ,'POST' ])
@app.route('/edit_equipment<int:barcode_number>', methods=['GET' ,'POST' ])
def edit_equipment(barcode_number):
locations = Location.query.all()
employees = Employee.query.all()
Expand Down Expand Up @@ -336,5 +336,40 @@ def employee_index():
employees = Employee.query.all()
return render_template ('employeeList.html', employees = employees)

@app.route('/search', methods=['GET'])
def search():
res = None
entity = request.args.get('entity')
query = request.args.get('query')

if entity == 'location':
data = Location.query.filter(Location.location_name.contains(query)).all()
res = jsonify([{
"location_name": r.location_name, "number_of_offices": r.number_of_offices, "head_quater_contact": r.number_of_offices
} for r in data])

elif entity == 'employee':
data = Employee.query.filter(Employee.employee_name.contains(query)).all()
res = jsonify([{
"employee_name": r.employee_name, "gender": r.gender, "title": r.title, "type": r.type, "phone_number": r.phone_number, "department": r.department, "location_id": r.location_id
} for r in data])

elif entity == 'equipment':
data = Equipment.query.filter(Equipment.type.contains(query)).all()
res = jsonify([{
"type": r.type, "serial_number": r.serial_number, "model_number": r.model_number, "purchase_date": r.purchase_date, "employee": r.employee, "location_id": r.location_id
} for r in data])

elif entity == 'purchase':
data = Purchases.query.filter(Purchases.store.contains(query)).all()
res = jsonify([{
"date": r.date, "store": r.store, "warranty_period": r.warranty_period,
} for r in data])

else:
res = Response("Invalid entity", status=400)

return res

if __name__ == '__main__':
app.run(host='localhost', port=8080, debug=True)
Binary file removed instance/OIS.db
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This file is a SQLite file. You never want this in your VCS. Good work here

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you Sir @stephane-segning

Binary file not shown.
22 changes: 22 additions & 0 deletions static/index.js
Original file line number Diff line number Diff line change
@@ -1,3 +1,24 @@
$(document).ready(function() {
$('#search-button').click(function() {
var query = $('#query').val();
$.ajax({
url: '/search',
type: 'GET',
data: { query: query },
success: function(response) {
var results = response;
var resultsHtml = '';
for (var i = 0; i < results.length; i++) {
resultsHtml += '<p>' + results[i] + '</p>';
}
$('#search-results').html(resultsHtml);
},
error: function(error) {
console.log('Search request failed:', error);
}
});
});
});
// javascript code

// function updateLocationCount() {
Expand All @@ -12,3 +33,4 @@

// // Call the updateLocationCount function every 5 seconds
// setInterval(updateLocationCount, 1000);

39 changes: 34 additions & 5 deletions templates/employeeList.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,41 @@
rel="stylesheet"
href="{{ url_for('static', filename='main.css') }}"
/>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>

<script>
$(document).ready(function(){
$('#search-button').on('click', function(){
var query = $('#query').val();
$.get('/search', {entity: 'employee', query: query}, function(data){
$('#table-results').empty();
data.forEach(function(employee){
$('#table-results').append(`
<tr>
<td>${ employee.employee_name }</td>
<td>${ employee.gender}</td>
<td>${ employee.title}</td>
<td>${ employee.type}</td>
<td>${ employee.phone_number}</td>
<td>${ employee.department}</td>
<td>${ employee.location_id}</td>
<td class="action">
<a href="/edit_employee/employee.id"><i class="fa fa-edit" style="font-size:24px"></i></a>
<a href="/delete_employee/employee.id"><i class="fa fa-trash-o" style="font-size:24px"></i></a>
</td>
</tr>
`);
});
});
});
});
</script>
</head>
<body>
<div class="header">
<input type="search" id="query" name="search" placeholder="Search...">
<button>Submit</button>
<div class="header">
<input type="search" id="query" name="search" placeholder="Search by Employee Name...">
<button id="search-button">Submit</button>
<a href="#"><img src="{{ url_for('static', filename='logo.png') }}" alt=""></a>
</div>

Expand Down Expand Up @@ -53,7 +82,7 @@ <h1 class="marquee">Welcome To Our Online Inventory System</h1>
<th>Actions</th>
</tr>
</thead>
<tbody>
<tbody id="table-results">
{% for employee in employees %}
<tr>
<td>{{ employee.employee_name }}</td>
Expand Down
34 changes: 31 additions & 3 deletions templates/equipmentList.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,40 @@
rel="stylesheet"
href="{{ url_for('static', filename='main.css') }}"
/>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

<script>
$(document).ready(function(){
$('#search-button').on('click', function(){
var query = $('#query').val();
$.get('/search', {entity: 'equipment', query: query}, function(data){
$('#table-results').empty();
data.forEach(function(equip){
$('#table-results').append(`
<tr>
<td>${ equip.type }</td>
<td>${ equip.serial_number}</td>
<td>${ equip.model_number}</td>
<td>${ equip.purchase_date}</td>
<td>${ equip.employee}}</td>
<td>${ equip.location_id}</td>
<td class="action">
<a href="/edit_equipment/equip.barcode_number"><i class="fa fa-edit" style="font-size:24px"></i></a>
<a href="/delete_equipment/equip.barcode_number"><i class="fa fa-trash-o" style="font-size:24px"></i></a>
</td>
</tr>
`);
});
});
});
});
</script>
</head>
<body>
<div class="header">
<input type="search" id="query" name="search" placeholder="Search...">
<button>Submit</button>
<input type="search" id="query" name="search" placeholder="Search by Type...">
<button id="search-button">Submit</button>
<a href="#"><img src="{{ url_for('static', filename='logo.png') }}" alt=""></a>
</div>

Expand Down Expand Up @@ -52,7 +80,7 @@ <h1 class="marquee">Welcome To Our Online Inventory System</h1>
<th>Actions</th>
</tr>
</thead>
<tbody>
<tbody id="table-results">
{% for equip in equipment %}
<tr>
<td>{{ equip.type }}</td>
Expand Down
32 changes: 29 additions & 3 deletions templates/locationList.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,16 +4,41 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Online Inventory System</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<link
rel="stylesheet"
href="{{ url_for('static', filename='main.css') }}"
/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

<script>
$(document).ready(function(){
$('#search-button').on('click', function(){
var query = $('#query').val();
$.get('/search', {entity: 'location', query: query}, function(data){
$('#table-results').empty();
data.forEach(function(d){
$('#table-results').append(`
<tr>
<td>${ d.location_name }</td>
<td>${ d.number_of_offices}</td>
<td>${ d.head_quater_contact}</td>
<td class="action">
<a href="/edit_location/location.id"><i class="fa fa-edit" style="font-size:24px"></i></a>
<a href="/delete_location/location.id"><i class="fa fa-trash-o" style="font-size:24px"></i></a>
</td>
</tr>
`);
});
});
});
});
</script>
</head>
<body>
<div class="header">
<input type="search" id="query" name="search" placeholder="Search...">
<button>Submit</button>
<input type="search" id="query" name="search" placeholder="Search by Location Name...">
<button id="search-button">Submit</button>
<a href="#"><img src="{{ url_for('static', filename='logo.png') }}" alt=""></a>
</div>

Expand All @@ -37,6 +62,7 @@ <h1>Welcome To Our Online Inventory System</h1>
</marquee> -->
<div class="marquee-container">
<h1 class="marquee">Welcome To Our Online Inventory System</h1>
<div id="results"></div>
</div>
<div class="location-form">
<a href="/add-location" class="btn1">Add Location</a>
Expand All @@ -49,7 +75,7 @@ <h1 class="marquee">Welcome To Our Online Inventory System</h1>
<th>Actions</th>
</tr>
</thead>
<tbody>
<tbody id="table-results">
{% for location in locations %}
<tr>
<td>{{ location.location_name }}</td>
Expand Down
31 changes: 28 additions & 3 deletions templates/purchaseList.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,37 @@
rel="stylesheet"
href="{{ url_for('static', filename='main.css') }}"
/>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

<script>
$(document).ready(function(){
$('#search-button').on('click', function(){
var query = $('#query').val();
$.get('/search', {entity: 'purchase', query: query}, function(data){
$('#table-results').empty();
data.forEach(function(purchase){
$('#table-results').append(`
<tr>
<td>${ purchase.date }</td>
<td>${ purchase.store }</td>
<td>${ purchase.warranty_period }</td>
<td class="action">
<a href="/edit_purchase/purchase.id"><i class="fa fa-edit" style="font-size:24px"></i></a>
<a href="/delete_purchase/purchase.id"><i class="fa fa-trash-o" style="font-size:24px"></i></a>
</td>
</tr>
`);
});
});
});
});
</script>
</head>
<body>
<div class="header">
<input type="search" id="query" name="search" placeholder="Search...">
<button>Submit</button>
<input type="search" id="query" name="search" placeholder="Search by Store...">
<button id="search-button">Submit</button>
<a href="#"><img src="{{ url_for('static', filename='logo.png') }}" alt=""></a>
</div>

Expand Down Expand Up @@ -49,7 +74,7 @@ <h1 class="marquee">Welcome To Our Online Inventory System</h1>
<th>Actions</th>
</tr>
</thead>
<tbody>
<tbody id="table-results">
{% for purchase in purchases %}
<tr>
<td>{{ purchase.date }}</td>
Expand Down